@charset "UTF-8";

.area1{
	position: relative;
	margin-top: -2.75vw;
}

.topMenuInner.on{
	opacity: 1.0;
    transition: 0.5s;
    transform: scale(1.0);
    pointer-events: auto;
}
.topMenuInner{
	background: #312928;
	width: 64vw;
	position: absolute;
    right: 0;
	top: 62vw;
	color: #FEFAF7;
	padding: 10vw 7.2vw 9.5vw;
    border-radius: 2.1vw 0 2.1vw 2.1vw;
	text-align: right;
	popinter-events:none;
	opacity: 0;
	transform: scale(0.9);
	transition: 0.5s;
}
.topMenuInner a{
	color: #FEFAF7;
}

.topMenuInner p{
	font-size: 4.26666vw;
    font-weight: 600;
    margin-top: 2.4vw;
	margin-bottom: 0.6vw;
}

.topMenuInner ul{
	margin-left: 2.4vw;
    margin-bottom: 3vw;
}

.topMenuInner.on {
    opacity: 1.0;
    transition: 0.5s;
    transform: scale(1.0);
    pointer-events: auto;
}

.topMenuInner ul li{
	height: auto!important;
	margin-bottom: auto!important;
}

.mv{
	width: 100vw;
	height: 150vh;
	background-size: 100%;
	position:fixed;
	opacity:1.0;
	transition: 0.7s;
	animation: mv_zoom 6.0s infinite linear;
}

.scrollWrap{
	opacity:0;
}

.scrollWrap:hover{
	transition: 0.4s;
	transform:scale(0.90);
	opacity:1.0;
}

.scrollWrap{
    position: fixed;
    right: 12.5vw;
    bottom: 18.2vw;
    background: #312928;
    width: 5.83333333vw;
    height: 5.83333333vw;
    z-index: 2000;
    border-radius: 50%;
    overflow: hidden;
    transform: scale(1.75);
}


.scrollWrap img:nth-child(1){
	position: absolute;
    left: 50%;
    top: 0.75vw;
    width: 1vw!important;
    margin-left: -0.5vw;
	animation: scrollAct1 2.5s infinite;
}
.scrollWrap img:nth-child(2){
	position: absolute;
    left: 50%;
    top: -4.5vw;
    width: 1vw!important;
    margin-left: -0.5vw;
	animation: scrollAct1 2.5s infinite;
}
.scrollWrap.on{
	opacity:1.0;
	transition: 0.7s;
	transition-delay: 3.0s;
}

.scrollWrap.off{
	opacity:0;
	transition: 0.7s;
}

.headMenu{
    font-size: 3.2vw;
    color: #fbefe2;
    position: relative;
    position: absolute;
    left: 0;
    top: 62.7vw;
    width: 100%;
    text-align: center;
    font-weight: 600;
}

.headMenu p{
	margin-left: 6vw;
	margin-top:0.1vw;
    position: relative;
    z-index: 300;
	opacity: 1.0;
	transition: 0.5s;
}

.headMenu.on p{
	opacity:0;
	transition: 0.5s;
}

/*
.headMenu ul.item2{
	transform: scale(1.0);
	transition: 0.5s;
}

.headMenu ul.item2.on{
	transform: scale(1.25);
	transition: 0.5s;
}
*/

.headMenu ul.item2 li:nth-child(1){position: absolute; right:22.15vw; top:2.5vw; background: #FEFAF7; width: 4.8vw; height: 1px; z-index: 300; transition: 0.5s; opacity:1;}
.headMenu ul.item2 li:nth-child(2){position: absolute; right:22.15vw; top:3.5vw; background: #FEFAF7; width: 3.2vw; height: 1px; z-index: 300; transition: 0.5s; opacity:1;}
.headMenu ul.item2 li:nth-child(3){position: absolute; right:22.15vw; top:4.5vw; background: #FEFAF7; width: 1.6vw; height: 1px; z-index: 300; transition: 0.5s; opacity:1;}

.headMenu ul.item2.on li:nth-child(1){ right: 7vw; transform:rotate(45deg); transition: 0.5s; top:6vw; width: 6.4vw;}
.headMenu ul.item2.on li:nth-child(2){ right: 7vw; width: 0; opacity:0; transition: 0.5s;}
.headMenu ul.item2.on li:nth-child(3){ right: 7vw; transform:rotate(-45deg); transition: 0.5s; top:6vw; width: 6.4vw;}

@keyframes scrollAct1{
	0%{margin-top:1.25vw;}
	5%{margin-top:0.75vw;}
	35%{margin-top:6.5vw;}
	100%{margin-top:6.5vw;}
}

body:after{
	content: "";
	position: fixed;
	left:0;
	bottom:0;
	width: 100vw;
	height: 0.55555vw;
	background: #312928;
	z-index:1000;
}

.mv img{
	width: 100vw;
}

.mv1,.mv2,.mv3{
	position:absolute;
    left: 45vw;
    top: 75vh;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	transform: scale(2.5);
	pointer-events: none;
}

.mv.bgoff{
	opacity:0;
	transition: 0.7s;
}

.mv .obj{position: absolute; transform:scale(1.05); transition: 1.0s; opacity: 0;}
.mv .obj img{width:100%; }
.mv .on .obj{transform:scale(1.0); transition: 1.5s; opacity:2.0; margin-top:0; transition-delay:0.5s;}
.mv .on .bg_front, .mv .on .bg_back{transform:scale(1.0); transition: 1.5s; transition-delay:0.5s; opacity:1.0;  margin-top:0;}

.mv .obj1{width: 55.34722222vw; left: 48.5vw; top: 46vw; margin-top:-1vw;}
.mv .obj2{   width: 40.763889vw;
    left: 32.7vw;
    top: -5.6vw;}
.mv .obj3{ width: 20.833333vw; left: -3.6vw; top:29.8vw; margin-top:-1.5vw; display:none;}

.mv .obj4{
    width: 45.8vw;
    left: 9vw;
    top: 37vw;
}
.mv .obj5{
    width: 29.5vw;
    left: 11vw;
    top: 3.5vw;
}
.mv .obj6{
	width: 10.355556vw;
    left: 10.8vw;
	top: 8.1vw;}


.mv .obj7{width: 8.68055555vw; left: 50.8vw; top: 22vw; display: none;}


.mv3 .bg_front,.mv3 .bg_back{
	width: 333vw!important;
    left: -1.4vw!important;
    top: -11.3vw!important;
}

.mv1 .bg_front{
width: 144.263889vw!important;
    top: -5vw!important;
    left: -7.8vw!important;}
.mv1 .bg_back{
width: 144.263889vw!important;
    top: -5vw!important;
    left: -14.8vw!important;}


.mv .obj2_1{
    width: 56.5vw;
    left: 2.1vw;
    top: 0.5vw;
} 
.mv .obj2_2{
	width: 41.38888vw;
    left: 40.6472222vw;
    top: 37.416667vw;
	display: none;
}

.mv .obj2_3{
	width: 31.7361111vw;
	left: 72.5694444vw;
	top: 32.0833333vw;
}

.mv .obj2_4{
	width: 115.66666vw;
    left: -13.38888vw;
    top: 29.783333vw;
}

.mv .obj2_5{
	width: 51.22222vw;
    left: 35.238889vw;
    top: 34.297222vw;
}
.mv .obj2_6{
    width: 58.8194444vw;
    left: 38.5vw;
    top: -5.7vw;
}

.mv2 .bg_front,.mv2 .bg_back{
	width: 125vw!important;
    left: -15.7vw!important;
    top: -4.6vw!important;
    position: absolute;
    opacity: 0;
    transition: 2.0s;
}

.mv .obj3_1{
    width: 58.13888vw;
    left: -1vw;
    top: 10.1vw;
}

.mv .obj3_2{
	width: 107vw;
    top: 36.5vw;
    left: -7vw;
}
.mv .obj3_3{
    width: 97.027778vw;
    top: 26.8vw;
    left: -3.7vw;
}

.mv .obj3_4{
    width: 67.9166666vw;
    left: 43.5vw;
    top: 8vw;
}

.sptopnav{
	position: fixed;
	z-index:10;
	display: flex;
	width: 89.06666vw;
	left: 5.48vw;
	bottom:0;
	background :#F8EADC;
	border-radius: 6.4vw 6.4vw 0 0;
	align-items: center;
	text-align: center;
	height: 12.8vw;
	line-height: 1.0;
	border: 1px solid #3D3837;
	opacity: 1.0;
}

.sptopnav.off{
	opacity:0;
	transition: 0.7s;
}
.sptopnav li{
	width: 50%;
	position: relative;
	display:flex;
    justify-content: center;
    align-items: center;
	gap: 1.2vw;
	margin-top: 0.2vw;
}

.sptopnav li:first-child{
	margin-left: 2vw;
}
.sptopnav li:after{
    content: "";
    background: url(../img/common/arrowBtn.png) no-repeat;
    background-size: contain;
    background-position: 80% 20%;
    width: 4.33333vw;
    height: 4.33333vw;
/*
    position: absolute;
	right: 20%;
    top: -13%;
*/
    margin-top: -0.2vw;
}
.sptopnav:before{
	content: "";
	left:50%;
	top: 2.966vw;
	position: absolute;
	width: 1px;
	height: 6.4vw;
	background: #3D3837;
}

.sptopnav img{
	height: 3.06vw;
}

.mv:before{
	content:"";
	position:absolute;
	left:0;
	top:50vw;
	width:100vw;
	height:100vh;
	background: #a48a4c;
	opacity:0;
	transition: 1.0s;
}

.mv2.on:before{
	content:"";
	position:absolute;
	left:0;
	top:50vw;
	width:100vw;
	height:100vh;
	background: #4e8d95;
	opacity:0;
	transition: 1.0s;
}

.mv3.on:before{
	content:"";
	position:absolute;
	left:0;
	top:50vw;
	width:100vw;
	height:100vh;
	background: #883c17;
	opacity:0;
	transition: 1.0s;
}


.mv1:after{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100vw;
	height:150vh;
	background: #a48a4c;
	opacity:0;
	transition: 1.0s;
	z-index:100;
}

.mv2:after{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100vw;
	height:150vh;
	background:#883c17;
	opacity:0;
	transition: 1.0s;
	z-index:100;
}

.mv3:after{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100vw;
	height:150vh;
	background:#4e8d95;
	opacity:0;
	transition: 1.0s;
	z-index:100;
}


.mv.on{
	filter:blur(3px);
	transition:0.5s;
	pointer-events: none;
}

.mv.on .mv1.on:after,.mv.on .mv2.on:after,.mv.on .mv3.on:after{
	opacity: 0.6;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.mv .bg_front,.mv .bg_back{
	width: 333vw;
    left: -9.5vw;
    top: -13.6vw;
	position: absolute;
	opacity:0;
	transition: 2.0s;
}

.mv .bg_front img,.mv .bg_back img{
	width: 100%;
}

.ttl{
	position: absolute;
	right: 5.6vw;
	top:9.6vw;
	background: url("../img/index/ttl_bg_sp.svg") no-repeat;
	background-size: cover;
	width: 38.4vw;
	height: 74.13vw;
	transform: scale(1.05);
	opacity:0;
}

.ttl .ttlinner > ul{
	display:none;
}

.on .ttl{
	opacity:1.0;
	transform: scale(1.0);
	transition: 1.5s;
	transition-delay:2.5s;
}

.ttl h1 img{
	width: 24vw;
    margin-left: 7.1vw;
    margin-top: 7.2vw;
}

.ttl > ul{
    margin-left: 3.666vw;
    margin-top: 6vw;
	display: none;
}

.ttl ul li{
	height: 1.111111vw;
	margin-bottom:1.6666vw;
	font-size: 3.73333vw;
	line-height: 2.25;
}

.ttl li img{
	height: 1.111111vw;
}
.area2{	
	padding-top: 200vh;
	height: 150vh;
	position: relative;
}
.area2,.area3,.area4{
	opacity:0;
	margin-top: 2vw;
	pointer-events: none;
}
.area2.on,.area3.on,.area4.on{
	opacity:1.0;
	margin-top:0;
	transform: scale(1.00);
	transition: 0.7s;
}
.area2 img,.area3 img{
	width: 17.353333vw;
}

.area4 img{
	width: 4.0533333vw;
}

.area3,.area4{
	padding-top: 100vh;
	height: 150vh;
	position: relative;
}
.area4{
	padding-bottom: 100vh;
}

.ttl2{
	background: url("../img/index/second_ttl_bg.svg") no-repeat;
	width: 41.866666666vw;
	height: 83.73333333vw;
	background-size: cover;
	margin-right: 5.33333333vw;
	padding-left: 11.34444vw;
	padding-top: 10.66666vw;
    position: absolute;
    right: 0;
    bottom: 0;	
}
.ttl3{
	background: url("../img/index/second_ttl_bg.svg") no-repeat;
	width: 41.866666666vw;
	height: 83.73333333vw;
	background-size: cover;
	margin-right: 5.33333333vw;
	padding-left: 11.34444vw;
	padding-top: 10.66666vw;
    position: absolute;
    right: 0;
    bottom: 0;	
}
.ttl4{
	background: url("../img/index/second_ttl_bg.svg") no-repeat;
	width: 41.866666666vw;
	height: 83.73333333vw;
	background-size: cover;
	margin-right: 5.33333333vw;
	padding-left: 19.5vw;
	padding-top: 10.66666vw;
    position: absolute;
    right: 0;
  	top: 100vh;	
}

@keyframes animView{
	0%{opacity:0; transform:scale(0.7) rotate(5deg);}
	25%{transform: scale(1.05) rotate(-5deg);}
	50%{opacity:1.0; transform: scale(1.0) rotate(1.0);}
	100%{opacity: 1.0;}
}
.area5.on .obj li:nth-child(1) {
	animation: animView 1.5s forwards;
	animation-delay: 1.3s;
	opacity:0;
}
.area5.on .obj li:nth-child(2) img{
	animation: animView 1.5s forwards;
	animation-delay: 1.2s;
	opacity:0;
}


.area5 .inner{
	position: fixed;
	left:0;
	top:0;
	background: url("../img/index/area5Bg.jpg") no-repeat;
	background-size: cover;
	height: 100vh;
    width: 100vw;
    overflow: hidden;
	opacity:0;
	transition: 0.4s;
	transform: scale(1.05);
}

.area5.on .inner{
	opacity:1.0;
	transition: 1.2s;
	transform: scale(1.0);
}

.area5 .decoTxt img{
	height:5.208333333vw;
}

.area5{
	height: 250vh;
	pointer-events: none;
}

.area5 video{
	width: 350vw;
	min-height: 100vh;
}

.area5 .decoTxt figure{
	margin-bottom: 0.5vw;
}

.area5 .decoTxt figure:nth-child(1){animation: slide1 350s infinite linear;}
.area5 .decoTxt figure:nth-child(2){animation: slide1 420s infinite linear;}
.area5 .decoTxt figure:nth-child(3){animation: slide3 350s infinite linear;}
.area5 .decoTxt figure:nth-child(4){animation: slide3 400s infinite linear;}
.area5 .decoTxt figure:nth-child(5){animation: slide5 350s infinite linear;}
.area5 .decoTxt figure:nth-child(6){animation: slide5 350s infinite linear;}
.area5 .decoTxt figure:nth-child(7){animation: slide7 350s infinite linear;}
.area5 .decoTxt figure:nth-child(8){animation: slide7 350s infinite linear;}
.area5 .decoTxt figure:nth-child(9){animation: slide9 320s infinite linear;}
.area5 .decoTxt figure:nth-child(10){animation: slide9 350s infinite linear;}
.area5 .decoTxt figure:nth-child(11){animation: slide9 450s infinite linear;}

.area5 .txt img{
	width: 64.44444vw;
}

.area5 .txt{
    height: 96.8vw;
    background: #fefaf7;
    width: 100vw;
    position: absolute;
    left: 0;
    top: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -48.4vw;
}

.area5 .txt img{
	position: relative;
	margin-top: 0.2vw;
	width: 71.8666vw;
}

.area5 .txt:before{
	content: "";
    position: absolute;
    left: 19vw;
    top: 50%;
    background: #feb768;
    width: 0vw;
    height: 15vw;
    border-radius: 0.55555vw;
    margin-top: -19vw;
}
.area5 .txt:after{
    content: "";
    position: absolute;
    left: 13vw;
    top: 50%;
    background: #feb768;
    width: 0vw;
    height: 13.855555vw;
    border-radius: 0.55555vw;
    margin-top: -0.9vw;
}

.area5.on .txt:before{
    width: 62.2vw;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.area5.on .txt:after{
    width: 74.2vw;
	transition: 0.5s;
	transition-delay: 0.5s;
}

.area5 .txt p{
	position: relative;
	z-index:200;
}

.area5 .obj{
    position: fixed;
    opacity: 1.0;
    left: 0;
    top: 0;
    z-index: 10;
	height: 100vh;
}

.area5 .obj li{
	position: absolute;
}

.area5 .obj li:nth-child(1){
	left: 3.388888vw;
    top: 50%;
    margin-top: 36.8vw;	
}
.area5 .obj li:nth-child(1) img{
	width: 34.5vw;
}
.area5 .obj li:nth-child(2){
    left: 71.33338vw;
    top: 50%;
    margin-top: -63vw;
}
.area5 .obj li:nth-child(2) img{
	width: 22vw;
}

.area6{
	position: relative;
	width: 80.4vw;
	margin: 0 auto;
	opacity:0;
	background: #F7EFE8;
}

.area6.on{
	opacity:1.0;
	transition: 0.7s;
}

.area6 strong{
	position: relative;
	margin-bottom: 4.3vw;
	display: block;
}

.area6 figure img{
	width: 100vw;
	margin:0 auto;
}

.area6 .section1 figure img{
	margin-left: -26vw;
}

.area6 .section2 figure img{
	margin-right: -23vw;
}

.area6 .section3 figure img{
	margin-left: -30.7vw;
}


.area6 .decoTxt{
    position: absolute;
    left: -13vw;
	top: 22vw;}

.area6 img{
	position: relative;
}
.area6 .section1 strong img{
	width: 77.466666vw;
}
.area6 .section2 strong img{
	width: 55.73333333vw;
}

.area6 .blockLeft{
	margin-bottom: 2.777777vw;
	margin-right: 2.013333vw;
}
.area6 .section1 .blockLeft, .area6 .section3 .blockLeft{
	text-align: center;
	width: 100%;
}

.area6 .section2 .blockRight{
	text-align: center;
}

.area6 .blockRight{
	width: 100%;
	margin-left: 1.7vw;
}

.area6 strong{
	margin-top: -11.5vw;
}


.area6 .section3 strong{
	margin-top: -6vw;
}


.ttlItem li{
	background: #36626d;
	position: relative;
	border-radius: 0.6vw;
}

.area6 .section1,.area6 .section2,.area6 .section3,.area6 .section4{
	opacity:0;
	transform: scale(1.05);
}

.area6 .section1.on,.area6 .section2.on,.area6 .section3.on,.area6 .section4.on{
	opacity:1.0;
	transform: scale(1.00);
	transition: 0.7s;
}

.area6 .section4 strong img{
	width: 60.8vw;
}

.area6 .section1 .ttlItem li:nth-child(1){
	position: absolute;
	width: 0;
    height: 7.7vw;
    left: 0.3vw;
    top: 6.2vw;
}

.area6 .section1 .ttlItem li:nth-child(2){
	position: absolute;
	width: 0;
	height: 6vw;
    left: 12.3vw;
    top: 16.3vw;
}

.area6 .section1 .ttlItem li:nth-child(3){
	position: absolute;
    width: 0;
    height: 6vw;
    left: 0.5vw;
    top: 24.9vw;
}

.area6 .section1.on .ttlItem li:nth-child(1){
	width: 51.5vw;
	transition: 0.7s;
}

.area6 .section1.on .ttlItem li:nth-child(2){
	width: 39vw;
	transition: 0.75s;
}
.area6 .section1.on .ttlItem li:nth-child(3){
	width: 44.3vw;
    transition: 0.8s;
}

.area6 .section2{
	margin-top: 9vw;
}

.area6 .section2 .ttlItem li:nth-child(1){
	position: absolute;
	width: 0vw;
	height: 7.9vw;
	left:-0.8vw;
	top:-0.2vw;
}

.area6 .section2.on .ttlItem li:nth-child(1){
	width: 57.4vw;
	transition:0.7s;
}

.area6 .section2 p,.area6 .section3 p{
	width: 100%;
	margin-bottom: 3.3333vw;
}

.area6 .section3 strong img{
	width: 80.4vw;
}

.area6 .section3{
	margin-top :5.5555vw;
	padding-bottom: 2.777777vw;
}

.area6 .section3 .ttlItem li:nth-child(1){
    position: absolute;
    width: 0;
	height: 9.194444vw;
    left: -0.3vw;
    top: 6.6vw;
}

.area6 .section3 .ttlItem li:nth-child(2){
    position: absolute;
    width: 0;
    height: 9.194444vw;
    left: -0.3vw;
    top: 25.9vw;
}

.area6 .section3.on .ttlItem li:nth-child(1){
    width: 50.65vw;
	transition:0.7s;
}
.area6 .section3.on .ttlItem li:nth-child(2){
    width: 51.227778vw;
	transition:0.75s;
}

.area6 .section4{
	margin: 0 auto;
	margin-top: 0vw;
	background: #fefaf7;
	border-radius: 1.66666vw;
	padding:8.5333333vw;
	width: 80.4vw;
}

.area6 .section4 strong{
	margin-top:0;
}

.area7{
	margin-top: 17.06666vw;
	width: 100vw;
	overflow-x: hidden;
	
}

.area7 h2{
	background: #383533;
	width: 0vw;
	height: 12.4vw;
	position:relative;
	padding-left: 6.11vw;
    padding-top: 1.38vw;
	opacity:0;
}

.area7.on h2{
	transition: 0.7s;
	width: 84.133333vw;
	opacity:1.0;
}

.area7 h2 img{
	width: 74.66666vw;
	margin-top: 1.6vw;
}

.area7 h2:after{
	content: "";
    position: absolute;
    right: -12.2vw;
    border: 6.2vw transparent solid;
    border-left: 6.2vw #383533 solid;
    top: 0;
}

.area7 div.block{
	opacity:0;
	transform: scale(1.05);
}

.area7 div.block.on{
	opacity:1.0;
	transform: scale(1.00);
	transition: 0.7s;
}

.area7 > div{
	width: 88.88888vw;
	margin-top: 8.533333vw;
}

.area7 > div .txtBlock{
    margin-left: 10vw;
    margin-top: -5vw;
    background: #fefaf7;
    padding: 8.5333333vw;
    border-radius: 1.666666vw;
    width: 80vw;
	position: relative;
}

.area7 > div .txtBlock a{
	margin-top: 4.4vw;
}

.area7 > div .txtBlock:nth-child(2){
	
}

.area7 .block:nth-child(2) .txtBlock h3 img{height: 10.8vw;}
.area7 .block:nth-child(3) .txtBlock h3 img{height: 10.8vw;}
.area7 .block:nth-child(4) .txtBlock h3 img{height: 5.2vw;}

.area7 figure img{
	width: 100vw;
}

.area7 .txtBlock p{
	margin-top: 4.266666vw;
	margin-bottom:  4.266666vw;
}

.area7 p.linkBlock{
	text-align:center;
	opacity:0;
	margin-top:7.4666666vw;
}

.area7 p.linkBlock.on{
	opacity:1.0;
	transition: 0.7s;
}

.area7 p.linkBlock img{
	height: 2.66666vw;
}

.area7 a.link{
	position:relative;
	display:inline-block;
}
.area7 a.link:before{
	content: "";
	position: absolute;
	width: 0;
	height: 0.138888vw;
	background: #383533;
	left:0;
	bottom:0vw;
}

.area7 a.link:after{
	content:"";
	background: url("../img/common/arrowBtn.png") no-repeat;
	background-size: cover;
	background-position: 80% 20%;
    width: 3.8666666vw;
    height: 3.8666666vw;
	margin-left: 1.6vw;
    margin-top: -0.5vw;
	display: inline-block;
	vertical-align: top;
}

.area7 .linkBlock.on a.link:before{
	width: 100%;
	transition: 0.5s;
}

.area8 {
	transform: scale(1.05);
	opacity:0;
	text-align: center;
	margin-top: 17.06666vw;
	position: relative;
	width: 100vw;
	overflow:hidden;
}

.area8 .decoTxt{
	position: absolute;
	left:0;
	width: 300vw;
	display: flex;
	top:32.7vw;
	animation: videoLoop 45s infinite linear;
}

.area8 .decoTxt img{
	height: 7.9861111vw;
}

@keyframes videoLoop{
	0%{	left:0;}
	100%{ left:-190vw;}
}

.area8.on{
	transform: scale(1.0);
	opacity:1.0;
	transition: 0.7s;
}

.area8 h2 img{
	height: 11.33333333vw;
}

.area8 .video > a > img{
	width: 80vw;
	margin: 0 auto;
	border-radius: 1.666666vw;
}

.area8 .video{
	position: relative;
	border-radius: 1.666666vw;
	width: 80vw;
	margin: 0 auto;
	overflow:hidden;
}

.area8 .video:after{
	content: "";
	background: #383533;
	width: 100%;
	height: 100%;
	position: absolute;
	left:0;
	top:0;
	opacity: 0.7;
}

.area8 .video p.playBtn{
	position: absolute;
    left: 43.7%;
    top: 38.8%;
	z-index:1;
}

.area8 .video p.playBtn img{
	width: 10.13333vw;
}

.area8 h2{
	margin-bottom: 4vw;
}

.area9 {
	margin-top: 17.06666vw;
	position: relative;
	transform: scale(1.05);
	opacity:0;
}

.area9.on {
	transform: scale(1.00);
	opacity:1.0;
	transition:0.7s;
}

.area9 .area4Bg{
	position: absolute;
	left:0;
	top:3.333333vw;
	background: #fefaf7;
	height: 29.652777777vw;
	width: 86.875vw;
	border-radius: 0 1.6666666vw 1.6666666vw 0;
}

.area9 .inner{
	position: relative;
}

.area9 .inner > div{
	width: 80vw;
	margin: 0 auto;
	background: #fefaf7;
	border-radius: 3.2vw;
	margin-top: -18.9vw;
	padding: 15.2vw 10.66666vw 8.5vw;
}

.area9 .inner figure{
	margin-top:-2vw;
	text-align: center;
}

.area9.on .inner figure{
	margin-top:0;
	transition:0.7s;
}


.area9 p{
	width: 59.6vw;
}

.area9 h2{
	position: relative;
	margin-top: 7.94444444vw;
	margin-bottom: 3.5vw;
}

.area9.on h2{
	margin-top: 6.94444444vw;
	transition:0.7s;
}

.area9 .ttlItem li:nth-child(1){
	position: absolute;
    width: 25.3vw;
    height: 8.547222vw;
    left: -0.3vw;
    top: 6.6vw;
}
.area9 .btn1{
	width: 100%;
	text-align: center;
}

.area9 .inner > figure img{
	width: 50.6777777vw;
    margin-left: 5.6vw;
}

.area9 h2 img{
	position: relative;
	height: 14.266666vw;
}

.area9 p{
	margin-bottom: 3.5vw;
}

.area10 {
	opacity:0;
	transform: scale(1.05);
	margin-top: 21.33333vw;
	width: 100vw;
}

.area10.on{
	opacity:1.0;
	transform: scale(1.0);
	transition: 0.7s;
}

.area10 .inner{
	width: 80vw;
	align-items: center;
	margin: 0 auto;
	border-radius: 3.2vw;
	background : #fefaf7;
	padding-bottom: 11.73333vw;
}

.area10 .inner .blockLeft{
	margin-left: 4.166666vw;
	margin-right: 4.166666vw;
}

.area10 .inner .blockLeft img{
	height: 14vw;
}

.area10 .inner .blockRight{
	width: 100%;
	position: relative;

}

.area10 .inner .blockRight > *{
	width: 65.2vw;
	margin: 0 auto;
}

.area10 h2{
	position: absolute;
	width: 100%;
	left:0;
	top:0;
	margin-top: -4.1vw;
}

.area10 .inner .blockRight ul{
	display: flex;
	flex-wrap: wrap;
}

.area10 .inner .blockRight ul li{
	width: 30.46vw;
	display: flex;
    justify-content: center;
    align-items: center;
	margin-bottom: 4vw;
	text-align: center;
}

.area10 .inner .blockRight ul li:nth-child(2n-1){
	margin-right:4vw;
}

.area10 a.btn1{
	width: 65.2vw;
	margin: 0 auto;
	text-align: center;
}

.area10 .inner .blockRight ul li img{
	width: 90%;
}

.area10 .inner .blockRight > span{
    font-size: 2.4vw;
    display: block;
	text-align:center;
}

.area10 .blockLeft h2{
	margin-bottom: 2vw;
	text-align: center;
}

.area10 .ttlItem li:nth-child(1){
    position: absolute;
    width: 27.6vw;
    height: 7.847222vw;
    left: 41vw;
    top: -0.5vw;
}

.area10 h2 img{
	position: relative;
}

.area10 .blockRight{
	padding: 19.6vw 0 4.4444vw;
}

.area10 .blockRight p{
	padding-top: 3.333333vw;
}

.area11 {
	width: 80vw;
	margin: 17.06666vw auto 0;
}


.area11 div.block{
	margin-top:2vw;
	opacity:0;
	padding-bottom: 8.53vw;
	width: 100%;
}

.area11 div.block:last-child{
	padding-bottom:0;
}

.area11 div.block:not(:first-child){
	padding-top: 8.53vw;
}

.area11 h2 img{
	height: 5.2vw;
}

.area11.on div.block:nth-child(1){
	margin-top:0;
	opacity:1.0;
	transition: 0.7s;
}
.area11.on div.block:nth-child(2){
	margin-top:0;
	opacity:1.0;
	transition: 0.7s;
	transition-delay:0.1s;
}
.area11.on div.block:nth-child(3){
	margin-top:0;
	opacity:1.0;
	transition: 0.7s;
	transition-delay:0.2s;
}


.area11 p{
	width: 100%;
	margin-top: 3.2vw;
	margin-bottom: 4.4vw;
}

.area11 p a{
	color:#ba3b35;
	}

.area11 .block:not(:last-child){
	border-bottom: 1px solid #383533;
}

.area11 .btn2{
	line-height: 10.66666vw;
	width: 100%;
	padding: 1.9444444vw 6.666666vw;
/*	font-size: 3.2vw;*/
}
.area11 .btn2:before{

    width: calc(100% - 2.7vw);
}

.area12 .area12Inner{
	width: 82.63888888vw;
	margin: 9.722222vw auto 0;
	text-align: center;
	background: #fefaf7;
	border-radius: 1.66666vw;
	padding: 9.6vw;
    margin-top: -6.2vw;
    position: relative;
}

.area12 p.decoTxt img{
	width: 100vw;
}

.area12{
	transform: scale(1.05);
	opacity:0;
	margin-top: 10vw;
}

.area12.on{
	transform:scale(1.0);
	opacity: 1.0;
	transition: 0.7s;
}

.area12 h2{
	margin-bottom: 4.44444vw;
}

.area12 h2 img{
	height: 8vw;
}

.area12 p{
	margin-bottom: 4.4444vw;
}

.area12 ul li{
	width: 100%;
}

.area12 ul li:first-child{
	margin-right: 0.8333333vw;
}
.area12 ul li:last-child a{
	margin-top: 3.2vw;
}

.area13{
	width: 80vw;
	margin: 0 auto 17.06666vw;
	transform: scale(1.05);
	opacity:0;
}

.area13.on{
	transform: scale(1.0);
	opacity:1.0;
	transition:0.7s;
}

.area13 h2{
	text-align: center;
	border-top: 1px solid #312928;
	border-bottom: 1px solid #312928;
	padding:3.8vw 1.666666vw 2.8vw;
	margin-top: 17.06666vw;
	margin-bottom: 8.53333vw;
	width: 100%;
}

.area13 h2 img{
	height: 5.333333vw;
}

.area13 strong{
	font-size: 4.26666vw;
	font-weight: 600;
	line-height: 1.5;
	display: block;
	margin-bottom: 2.13333vw;
	margin-top: -1.2vw;
}

.area13 span{
	font-size: 2.93333vw;
	display: block;
	margin-top: 0vw;
}

.area13 ul li a{
	display: flex;
	gap: 6.4vw;
}
.area13 ul li a > div{
	width: 43.86vw;
}


.area13 ul li{
	opacity:0;
	margin-top:2vw;
}

.area13.on ul li:nth-child(1){
	opacity:1.0;
	margin-top:0;
	transition:0.7s;
}
.area13.on ul li:nth-child(2){
	opacity:1.0;
	margin-top:0;
	transition:0.7s;
	transition-delay: 0.1s;
}
.area13.on ul li:nth-child(3){
	opacity:1.0;
	margin-top:0;
	transition:0.7s;
	transition-delay: 0.2s;
}
.area13 ul li {
	width: 100%;
	display: flex;
}
.area13 ul li:not(:last-child){
	margin-bottom: 8.66666vw;
}

.area13 ul li img{
	width: 30vw;
	display: block;
}

.readModal{
    opacity:0;
    transition:0.7s;
    pointer-events: none;
}

.readModal.on{
    opacity: 1.0;
    transition: 0.7s;
    pointer-events: auto;
}

.readModal .modalInner{
    transform: scale(0.95);
    transition: 0.7s;
}
.readModal.on .modalInner{
    transform: scale(1.0);
    transition: 0.7s;
}

.readModal{
    position:fixed;
    width: 100vw;
    height: 100vh;
    z-index:1210;
    left:0;
    top:0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.readModal .modalBg{
    background: #000;
    opacity:0.7;
    position: fixed;
    width: 100vw;
    height: 100vh;
}
.readModal .modalInner{
    position: relative;
    background: #FEFAF7;
    width: 93.0555vw;
    height: 75vh;
    height: 75svh;
    border-radius: 6.4vw;
}

.readModal .modalInner .block{
    width: 100%;
    display: flex;
    height: 25vh;
    height: 25svh;
    align-items: center;
}
.readModal .modalInner .block > div{
    width: 50%;
}
/*
.readModal .modalInner .block + .block{
    margin-top: 6.4vw;
}
*/
.readModal .modalInner figure{
    width: 50%;
    height: 25vh;
    height: 25svh;
    overflow:hidden;
    display: flex;
    justify-content: center;
}
.readModal .modalInner figure img{
    height: 100%;
}
.readModal .modalInner .block:nth-child(2) figure{
    border-radius: 6.4vw 0 0 0;
}
.readModal .modalInner .block:last-child figure{
    border-radius: 0 0 0 6.4vw;
}
.readModal .modalInner .txtBlock{
    padding: 4.8vw;
}

.readModal .modalInner .block:nth-child(2) h3 img,.readModal .modalInner .block:nth-child(3) h3 img,.readModal .modalInner .block:nth-child(3) h3{
    height: 9.6vw;
}

.readModal .modalInner .block:nth-child(4) h3 img{
    height: 4.5vw;
}
.readModal .modalInner .txtBlock p{
    margin-top: 3.2vw;
    display: none;
}

.readModal .modalInner .txtBlock a.btn1{
    margin-top: 3.2vw;
    padding: 1.94444444vw 7.33333vw 1.9444444vw 4.333333vw;
    line-height: 1.35;
    height: 11.6vw;
}
a.btn1:before{
    height: 10.5vw;
}
.readModal .modalInner .txtBlock a.btn1 span{
    font-size: 3.2vw;
}
.readModal .modalClose{
    position:absolute;
    top: -6.66666vw;
    right:0;
    opacity:1.0;
    transform: scale(1.0);
    transition:0.3s;
    width: 2vw;
    height:2vw;
    cursor: pointer;
}
.readModal .modalClose:hover{
    opacity:0.7;
    transform: scale(0.95);
    transition: 0.3s;
}
.readModal .modalClose li{
    position:absolute;
    top:0;
    right:0;
}

.readModal .modalClose li:nth-child(1){
    transform:rotate(45deg);
}
.readModal .modalClose li:nth-child(2){
    transform:rotate(-45deg);
}

.readModal .modalClose li{
    height: 1vw;
    width: 8.2222vw;
    background: #FEFAF7;
    border-radius: 3vw;
}