﻿.bg_color1 {background-color: #5F8C00;}
.bg_color2 {background-color: #d5d3b7;    background-image: url(Dup/img/back3.jpg);
    background-size: 800px;}
.bg_color4 {background-color: #72113D;}
.border_color1 { border-color: #72113D;}
.border_color2 {border-color: #b4b298;}
.border_color3 {border-color: #72113d;}
.border_color4 {border-color: #72113D;}
.txt_color1 {color: #72113D;}
.txt_color2 {color: #72113D;}
.txt_color3 {color: #72113D;}
.hvr_bg_color3:hover {background-color: #72113D;}
/* ----------　all　---------- */
.linkStyle{
	color:#72113D;
}
.linkStyle:hover{
	color:#72113D;
	opacity: 0.7;
	transition: all 0.5s;
}
body{
background-color: #eae9dc;
    background-image: url(Dup/img/back2.jpg);
    background-size: 800px;
}
#intro:before,#intro:after,#contents1:before,#contents1 h2 span:before,#contents2:before ,#contents2 h3 span:before,#contents3:before ,.top_cms_title:before  {
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
}
#header h1 span {
    padding: 20px 10px 20px 30px;
}

/* ----------　TOP　---------- */
.video_wrap {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100vh;
}
video {
	min-width: 100%;
	min-height: 100vh;
	z-index: 1;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}
#intro{
        position: relative;
}
#intro:before {
    width: 25%;
    height: 500px;
    background-image: url(Dup/img/intro.png);
    background-position: bottom;
    bottom: 10px;
    right: 10px;
}
#intro:after {
    width: 190px;
    height: 200px;
    background-image: url(Dup/img/sakura1.png);
    background-position: bottom left;
    bottom: -70px;
    left: -10px;
    transform: rotate( 10deg );
}
#contents1{
    position: relative;
}
#contents1:before {
    width: 1000px;
    height: 650px;
    background-image: url(Dup/img/back.png);
    bottom: -100px;
    right: -100px;
    background-position: bottom;
    mix-blend-mode: multiply;
}
#contents1 h2 span{
    position: relative;
}
#contents1 h2 span:before {
    width: 50px;
    height: 50px;
    background-image: url(Dup/img/ume1.png);
    right: -25px;
    top: -40px;
}
#contents2:before {
    width: 250px;
    height: 200px;
    background-image: url(Dup/img/sakura2.png);
    background-position: bottom right;
    bottom: -70px;
    right: -0px;
    transform: rotate( -25deg );
    z-index: 2;
}
#contents2 h3 span{
    position: relative;
}
#contents2 h3 span:before{
    width: 50px;
    height: 40px;
    background-image: url(Dup/img/ume3.png);
    left: -20px;
    bottom: -40px;
}
#contents3 h3{
    color: #72113D;   
    
}
#contents3:before {
    width: 1000px;
    height: 550px;
    background-image: url(Dup/img/back2.png);
    background-position: bottom;
    bottom: -50px;
    left: -50px;
    mix-blend-mode: multiply;
}
#contents3::after {
    background-color: #72113D;
    background-image: url(Dup/img/back1.jpg);
    background-size: 300px;
}
#top_cms .top_cms_title p{
    color: #72113D;
}
#top_cms .top_cms_title{
    position: relative;
}
#top_cms .top_cms_box:nth-child(1) .top_cms_title:before,#top_cms .top_cms_box:nth-child(5) .top_cms_title:before {
    width: 100px;
    height: 100px;
    background-image: url(Dup/img/momiji1.png);
    background-position: bottom;
    bottom: -50px;
    right: 30px;
}
#top_cms .top_cms_box:nth-child(2) .top_cms_title:before {
    width: 100px;
    height: 100px;
    background-image: url(Dup/img/ume2.png);
    background-position: bottom;
    bottom: -50px;
    left: 30px;
}
#top_cms .top_cms_box:nth-child(3) .top_cms_title:before {
    width: 100px;
    height: 100px;
    background-image: url(Dup/img/momiji2.png);
    background-position: bottom;
    bottom: -50px;
    right: 30px;
}
#top_cms .top_cms_box:nth-child(4) .top_cms_title:before {
    width: 100px;
    height: 100px;
    background-image: url(Dup/img/ume1.png);
    background-position: bottom;
    bottom: -50px;
    left: 30px;
}
/* ----------　IE　---------- */
@media all and (-ms-high-contrast: none){
  .sample{

  }
}

/* ----------　タブレット　---------- */
@media screen and (max-width: 768px){
#main_img {
    height: auto;
}
.video_wrap {
	position: static;
	overflow: hidden;
	width: 100%;
	height: auto;
	min-width: 100%;
}
video {   
	min-width: auto;
	min-height: auto;
	width: 100%;
	z-index: 1;
	position: static;
	top: 0%;
	left: 0%;
	-webkit-transform: translate(0%, 0%); 
	-ms-transform: translate(0%, 0%);
	transform: translate(0%, 0%); 
    vertical-align: bottom;
}      
#intro:after {
    width: 160px;
}
#contents1:before ,#contents3:before{
    width: 80%;
    
}
#contents1 h2 span:before {
    width: 40px;
    height: 40px;
    right: -20px;
}
    
}


/* ----------　スマホ　---------- */
@media screen and (max-width: 667px){
#header h1 span {
    padding: 10px 5px 10px 15px;
}
#intro:before {
    width: 50%;
}
#contents1:before, #contents3:before {
    width: 100%;
}
#contents1:before {
    bottom: -0px;
    right: -100px;
}
#contents2 h3 span{
    font-size: 20px;
}
#contents2 h3 span:before {
    height: 40px;
    left: -25px;
    bottom: -35px;
}
#contents2:before {
    width: 150px;
    height: 150px;
    bottom: -50px;
}
#contents3 div.left_anime h3,#contents3 div.left_anime p{
    color: #fff;    
}
#top_cms .top_cms_box:nth-child(1) .top_cms_title:before,#top_cms .top_cms_box:nth-child(3) .top_cms_title:before, #top_cms .top_cms_box:nth-child(5) .top_cms_title:before {
    width: 80px;
    height: 80px;
    bottom: -40px;
    right: 25px;
}
#page_title h2{
    font-size: 22px;
        letter-spacing: 4px;
}
}