@charset "utf-8";
.sp{
	display: none!important;
}
.container{
	width: 80%;
	max-width: 1100px;
	margin: 0 auto;
	position: relative;
}
body{
	padding-top: 82vw;
}
header{
	width: 100%;
	aspect-ratio: 2717/2242;
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1;
}
h1{
	padding: 20px 0;
}
.headWrap{
	padding: 0 50px;
	display: flex;
	align-content: center;
	justify-content: space-between;
}
header nav{
	display: flex;
	gap: 40px;
}

header nav ul{
	display: flex;
	align-content: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0 20px;
}
header nav ul li a{
	color: #FFFFFF;
	text-decoration: none;
	font-weight: bold;
	font-size: 0.9em;
}
header nav ul li{
	display: flex;
	align-items: center;
}
header nav ul#navigation li:after{
	content: "";
	display: block;
	border-right: 2px solid #FFFFFF;
	height: 1em;
	margin: 0 0 0 20px;
}
header nav ul#navigation li:last-child:after{
	display: none;
	margin: 0;
}

header nav ul.navigation{
}
#mainvisual{
	flex-grow: 1;
}
#mainvisual .mvWrap{
	height: 100%;
}
#mainvisual .container{
	height: 100%;
}

#mainvisual figure{
	height: 95%;
	padding-top: 5%;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	text-align: center;
}
#mainvisual figure img{
	max-height: 825px;
	max-width: 600px;
	object-fit: contain;
	width: 40vw;
	height: calc(100% - 12vw);
}
header #hbg4{
	width: 100%;
	aspect-ratio: 2717/2242;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -11;
}
header #hbg3{
	width: 100%;
	aspect-ratio: 2717/2242;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -10;
}
header #hbg2{
	width: 100%;
	aspect-ratio: 2717/2242;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -9;
}
header #hbg1{
	width: 100%;
	aspect-ratio: 2717/2242;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -8;
}
header > figure img{
	width: 100%;
	height: 100%;
}

#c01_p{
	background: url(../images/c1bg.webp) top left / 100% auto no-repeat;
	padding-top: 15vw;
	position: relative;
	top: -12vw;
	z-index: 11;
}
#c01_p .cWrap{
	background: #8cb5a4;
}

#yclink{
	display: block;
	width: 5vw;
	height: 5vw;
	position: fixed;
	top: 26vw;
	right: 4.5vw;
	z-index: 10;
	/*background: rgba(255, 0, 0, 0.5);*/
}
#yclink a{
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -30000em;
}
#c01_p h2{
	text-align: center;
	position: relative;
	z-index: 10;
}
.c1_1{
	width:40%;
	aspect-ratio: 478/289;
	background: url(../images/c01_05.webp) top left / 100% 100% no-repeat;
	position: absolute;
	top: 50%;
	left: -10%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 6;
}
.c1_1 span{
	display: block;
	padding:0 30px;
	font-size:min(1.8vw,1.6em);
	color: #36080c;
	font-weight: bold;
	line-height: 160%;
}
.c1kv{
	position: relative;
}
.c1kv figure img{
	position: absolute;
}
.c1kv figure img#a01_01{
	width: 30%;
	bottom: 3%;
	left: -5%;
	z-index: 5;
}
.c1kv figure img#a01_02{
	width: 34%;
	bottom: 25%;
	right: -8%;
	z-index: 4;
}
.c1kv figure img#a01_06{
	width: 28%;
	bottom: -8%;
	right: -3%;
	z-index: 3;
}

img#a01_03{
	position: absolute;
	top: 10%;
	left: 5%;
	width: 90%;
	z-index: 1;
}
img#a01_04{
	position: absolute;
	top: 12%;
	left: 5%;
	width: 90%;
	z-index: 2;
}
h3{
	margin-top: 100px;
	font-size: 1.875em;
	color: #FFFFFF;
	margin-bottom: 40px;

}
#c01_p{
	color: #FFFFFF;
}
#c01_p p{
	font-size: 1.125em;
}
.tac{
	text-align: center;
}
ol.feature{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	position: relative;
	left: 1%;
}
ol.feature li{
	list-style: none;
	width: calc(100% / 3 - 10px);
}
#c01_p{
	position: relative;
	margin-bottom: calc(300px - 12vw);
}
#c01_p:after{
	position: absolute;
	bottom: -299px;
	left: 0;
	content: "";
	display: block;
	background: url(../images/c1bgr.webp) top left / 100% 100% no-repeat;
	width: 100%;
	height: 300px;
}
section{
	position: relative;
	z-index: 10;
}
#c02_p{
	background: #FFFFFF;
	position: ;
	padding-top: 400px;
	top: -300px;
	z-index: 10;
	margin-bottom: -300px;
	padding-bottom: 500px;
}
h2{
	font-size: 3.125em;
	margin-bottom: 20px;
}
p.cap{
	margin-top: 20px;
	font-size: 1.875em;
}
p.cap span{
	font-size: 0.7em;
	display: block;
}
p.cap.p2{
	font-weight: bold;
	color: #6cb189;
}
#c03_p{
	color: #FFFFFF;
	background: #6e4c39;
	padding-top: 10vw;
	padding-bottom: 0px;
}
#c03pbg{
	display: block;
	position: absolute;
	top: -7vw;
	left: 0;
	width: 100%;
	height: 35vw;
	z-index: 10;
}
.z100{
	position: relative;
	z-index: 11;
}
#c03pbg span{
	display: block;
	width: 100%;
	height: 100%;
	background: url(../images/c04.webp) top left / 100% 100% no-repeat ;
}

#c03_p:before{
	content: "";
	display: block;
	position: absolute;
	top: -14vw;
	width: 100%;
	height: 15vw;
	background: url(../images/c04_02.webp) top left / 100% 100% no-repeat ;
	transform: rotate(180deg);

}

#c03_p:after{
	content: "";
	display: block;
	position: absolute;
	bottom: -15vw;
	width: 100%;
	height: 15vw;
	background: url(../images/c04_02.webp) top left / 100% 100% no-repeat 
}

.c4_01{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
}
.c4_01 figure{
	width:33%;
}
.c4_01 p{
	width: 60%;
	font-size: 1.125em;
	line-height: 188%;
}
.feature2{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}

.feature2 li{
	background: url(../images/c07.webp) top left / 100% 100% no-repeat;
	aspect-ratio: 258/216;
	display: flex;
	width: 30%;
	font-size: 1.25em;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.feature2 li:nth-child(3n+2){
	background: url(../images/c08.webp) top left / 100% 100% no-repeat;
}
.feature2 li:nth-child(3n+3){
	background: url(../images/c09.webp) top left / 100% 100% no-repeat;
}
#c04_p{
	background: #FFFFFF;
	padding-top: 20vw;
	z-index: 9;
}
h2 span{
	display: block;
	font-size: 0.7em;
}


div#slide{
	padding: 5px;
	border: 2px solid #251e1c;
	position: relative;
	background: #FFFFFF;
	margin-top: -50px;

}
div#slide ul.controller{
}
div#slide ul.controller{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding:0 80px;
	position: absolute;
	top: 30px;
	left: 0;
	width: calc(100% - 160px);
	z-index: 10;
}
div#slide ul.controller li{
	float: left;
	width: calc((100% - 300px) / 6);
}
div#slide ul.controller li a{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2.5em;
	aspect-ratio: 1;
	text-align: center;
	border-radius: 100px;
	text-decoration: none;
	background: #FFFFFF;
	color: #B3B3B3;
}
div#slide ul.controller li.current a,div#slide ul.controller li a:hover{
	color: inherit;
	background: #afd7f4;
}
div#slide ul.slide{
	width: 100%;
	aspect-ratio: 2202/1643;
	overflow:hidden;
	position: relative;
}
div#slide ul.slide li{
	position: absolute;
	top: 0;
	left:100%;
	text-align: center;
	width: 100%;
	border-radius: 10px;
	overflow: hidden;
}
div#slide ul.slide li img{
	border-radius: 10px;

}


div#slide ul.slide li.current{
	left: 0;
}

div#slide ul.current{
	position: absolute;
	bottom: 30px;
	left: 0;
	width: 100%;
	text-align: center;
}
div#slide ul.current li{
	display: inline-block;
}
div#slide ul.current li a{
	color: #E5E5E5;
	font-size: 1.5em;
	margin: 0 2px;
	text-decoration: none;
}
div#slide ul.current li.current a{
	color: #7D7D7D;
}
div#slide p.next{
	position: absolute;
	right: -85px;
	top: calc(50% - (167px / 2));
}
div#slide p.next a{
	opacity: 1!important;
}
#c05_p{
	background: #FFFFFF;
	padding-top: 60px;
}
#c05_p .container{
	width: 70%;
}

h2.pt2{
	color: #6cb189;
	font-size: 1.875em;
}
.c6Wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	flex-direction: row-reverse;
	margin-bottom: 20px;
}
.c6Wrap figure{
	width: 45%;
}
.c6Wrap figure img{
	width: 100%;
}

.c6Wrap .det{
	width: 50%;
}
.det1{
	padding: 5px;
	border: 1px solid #231815;
}
.det2{
	margin: 5px 0;
	font-size: 0.8em;
}
.det3{
	padding: 5px 0;
	border: 1px solid #231815;
}
.det3 h3{
	font-size: 1em;
	text-align: center;
	margin: 0;
	color: inherit;
	padding: 0;
	border-bottom: 1px solid #231815;
}
.det3 ul{
	padding: 5px 20px;
	padding-bottom: 0;
}
.det3 ul li{
	display: inline-block;
	font-size: 0.8em;
	margin-right: 10px;
}
.det3 p.tar{
	text-align: right;
	font-size: 0.8em;
}
.det4{
	margin-top: 10px;
	font-size: 0.8em;
}
.gal{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.gal li{
	width: calc(100% / 5 - 15px);
}
.gal li img{
	width: 100%;

}
#c04_p h2{
	margin-bottom: 60px;
}
#c06_p{
	background: #FFFFFF;
	padding-top: 60px;
	padding-bottom: 100px;
}
#c06_p .container{
	width: 70%;
}
#c06_p dl{
	padding: 0 5%;
}
#c06_p dl dt:first-child{
	margin-top: 50px;
}

#c06_p dl dt{
	margin-top: 100px;
	margin-bottom: 40px
}
#c06_p dl dd strong{
	margin-bottom: 50px;
}
#c06_p dl dt strong,#c06_p dl dd strong{
	display: block;
	color: #36080c;
	font-size: 1.87em;
	display: flex;
	line-height: 166%;
}
#c06_p dl dt strong:before{
	content: "Q. ";
	display: block;
	margin-right: 20px;
}

#c06_p dl dd:before{
	content: "A. ";
	display: block;
	color: #36080c;
	font-size: 1.87em;
	margin-right: 20px;
}
#c06_p dl dd {
	display: flex;
}

#c06_p dl dd span{
	display: block;
	background: #e4ac20;
	border-radius: 10px;
	padding: 50px;
	color: #FFFFFF;
	font-size: 1.25em;
	width: 100%;
}
p.bt{
	text-align: center;
	margin-top: 60px;
}
p.bt a{
	display: inline-block;
	background: #370a0d;
	border-radius: 100px;
	padding: 20px;
	min-width: 250px;
	color: #FFFFFF;
	text-decoration: none;
}
.about{
	margin-top: 100px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border: 1px solid #231815;
	padding: 30px;
	flex-wrap: wrap;
}
.about p{
	width: calc(100% - 300px);
}

footer{
	position: relative;
	z-index: 1000;
	background: #FFFFFF;
}
footer .foot_insta{
	background: #cacaca;
	padding: 40px 0 60px 0;
}
footer .foot_insta ul{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}
footer .foot_insta ul li{
	width: 24%;
}
footer .foot_insta ul li a{
	display: block;
	width: 100%;
	aspect-ratio: 1;
	border: 1px solid #000000;
}

.foot_tt{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 50px 0 20px 0;
}
.foot_tt nav{
	width: calc(100% - 300px);
}
.foot_tt nav ul{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0 10px;
}
.foot_tt nav ul a{
	font-size: 0.9em;
	color: inherit;
	text-decoration: none;
}
.foot_tt nav ul:first-child{
	margin-bottom: 20px;
}
.foot_tt nav ul:first-child a:before{
	content: "> ";
}

p#copy{
	text-align: center;
	padding-bottom: 20px;
}
p#fklogo{
	position: absolute;
	bottom: 20px;
	right: 30px;
}

.more{
	display: none;
	margin-top: 100px;
}
p.caution{
	font-size: 0.6em;
	margin-top: 1em;
}

.det6{
	background: #62b0e3;
	padding: 5px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 20px 0;
}
.det6 h3{
	font-size: 1.2em;
	margin: 0;
	padding: 0px 10px;
	font-weight: bold;
}
.det6 p{
	font-size: 1.3em;
	padding: 10px 20px;
	background: #FFFFFF;
	min-width: 4em;
	font-weight: bold;
}

