@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Kaisei+Decol:wght@400;700&family=Noto+Sans+JP:wght@100..900&display=swap');

*{ margin:0; padding:0; box-sizing:border-box; }
html{
	font-family:'Noto Sans JP', sans-serif;
	line-height:1.6; font-weight:400; color:#6c6c6c;
}
body{ position:relative; }
body::before{
	display:block; content:""; opacity:0.3;
	position:fixed; left:0; top:0; right:0; bottom:0; z-index:-1;
}

a{ color:inherit; }
img{ max-width:100%; height:auto; vertical-align:top; border:none; }
a img{ transition:all 300ms 0s ease; }
a:hover img{ opacity:0.6; }
input,select,button{ border:none; outline:none; font-size:inherit; line-height:inherit; color:inherit; }

.sub{
	display:block;
	background-color:#ffffff; background-repeat:no-repeat;
	background-image:url("../img/sub_bg1.png"), url("../img/sub_bg2.png");
	font-family:"Kaisei Decol", serif; font-weight:700; text-align:center;
}
.sub h3{
  display:inline-block;
  background:linear-gradient(-90deg, #a8cf96 0%, #f7e79c 25%, #9ed3f2 50%, #b9a7cf 75%, #e38295 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.note p{ padding-left:1em; text-indent:-1em; }
.note p *{ text-indent:0; }

.bt{
	display:inline-block; justify-content:center; align-items:center;
	background:linear-gradient(110deg, #c6b28d 0%, #d4c199 100%);
	position:relative; color:#FFFFFF; font-weight:700; text-decoration:none;
	transition:all 300ms 0s ease;
}
span.bt{ background:#6c6c6c; }
a.bt:hover{ opacity:0.6; }
.bt::after{
	position:absolute; top:50%;
	display:block; content:"";
	border:1px solid #FFFFFF;
	border-left-color:transparent;
	border-bottom-color:transparent;
	transform:translateY(-50%) rotate(45deg);
}
.bt .s{ font-weight:400; }

@media (min-width:769px) {
	html{ font-size:calc(100vw / 1034); }
	body{ font-size:14rem; line-height:1.4; }
	body::before{
		background:linear-gradient(-60deg, #a8cf96 0%, #f7e79c 25%, #9ed3f2 50%, #b9a7cf 75%, #e38295 100%);
	}
	.sp{ display:none; }
	.inner{ max-width:1034px; margin:0 auto; padding:0 50px; }
	.sub{
		padding:20rem 70rem; margin-bottom:40rem;
		background-position:left 14rem top 9rem, right 14rem top 9rem;
		background-size:76rem auto, 76rem auto;
	}
	.sub h3{ font-size:36rem; line-height:1.2; }
	.bt{ font-size:16rem; line-height:1.2; padding:20rem 65rem; }
	.bt::after{ width:10rem; height:10rem; right:20rem; }
	.bt .s{ font-size:12rem; line-height:1.2; }
}
@media (min-width:1034px) {
	html{ font-size:1px; }
}
@media (max-width:768px) {
	html{ font-size:calc(100vw / 768); }
	body{ font-size:26rem; line-height:1.4; }
	body::before{
		background:linear-gradient(-15deg, #a8cf96 0%, #f7e79c 25%, #9ed3f2 50%, #b9a7cf 75%, #e38295 100%);
	}
	.pc{ display:none; }
	.inner{ padding:0 20rem; }
	.sub{
		padding:35rem 60rem; margin-bottom:40rem;
		background-position:left 11rem top 9rem, right 11rem top 9rem;
		background-size:76rem auto, 76rem auto;
	}
	.sub h3{ font-size:42rem; line-height:1.2; }
	.bt{ font-size:24rem; line-height:1.2; padding:26rem 60rem; }
	.bt::after{ width:12rem; height:12rem; right:22rem; }
	.bt .s{ font-size:20rem; line-height:1.2; }
	.note p{ font-size:22rem; line-height:32rem; }
}


/* #kv{ */
#kv{ background:#A49171; text-align:center; }
/* } */

/* .box{ */
.box{ background:rgba(255,255,255,0.5); }
.box._1 .read{ text-align:center; }
.box._1 .read strong{ color:#c8ae73; font-weight:700; }
.box._1 .wrap_1 h4{
	font-family:"Kaisei Decol", serif; font-weight:700; text-align:center; color:#FFFFFF;
	background:linear-gradient(90deg, #a49171 0%, #eadcb7 50%, #a49171 100%);
	width:fit-content; margin:0 auto;
}
.box._1 .wrap_1 p{ color:#c8ae73; font-weight:500; text-align:center; }

.box._1 .tokuten{
	position:relative;
}
.box._1 .tokuten::before{
	display:block; content:""; opacity:0.3;
	position:absolute; left:0; top:0; right:0; bottom:0; z-index:0;
	background:linear-gradient(-60deg, #a8cf96 0%, #f7e79c 25%, #9ed3f2 50%, #b9a7cf 75%, #e38295 100%);
}

.box._1 .tokuten .wrap{
	position:relative; z-index:1;
	background:rgba(255,255,255,0.6);
}
.box._1 .tokuten .img{ text-align:center; }
.box._1 .tokuten h4{ font-family:"Kaisei Decol", serif; font-weight:700; }
.box._1 .tokuten .t2{ background:#f2c3d3; color:#FFFFFF; border-radius:100rem; }

.box._1 .how{}
.box._1 .how h3{ text-align:center; }
.box._1 .how dl dt span{
	display:flex; justify-content:center; align-items:center; border-radius:50%;
	font-family:"Kaisei Decol", serif; font-weight:700;
	background:#a6d9ec; line-height:1; color:#FFFFFF;
}
.box._1 .how .btns{ text-align:center; }

@media (min-width:769px) {
	.box{ padding:60rem 30rem; border-radius:30rem; }
	.box+.box{ margin-top:58rem; }
	
	.box._1 .read{ font-size:22rem; line-height:1.4; margin-bottom:40rem; }
	.box._1 .wrap_1 h4{
		font-size:28rem; line-height:1.0;
		padding:15rem 50rem; border-radius:50rem; margin-bottom:10rem;
	}
	.box._1 .wrap_1 p{ font-size:28rem; line-height:1.4; margin-bottom:45rem; }
	.box._1 .tokuten{ padding:15rem; max-width:782rem; margin:0 auto; }
	.box._1 .tokuten+.tokuten{ margin-top:23rem; }
	.box._1 .tokuten .wrap{ display:flex; gap:25rem; padding:30rem 20rem 30rem 30rem; }
	.box._1 .tokuten .img{ width:280rem; }
	.box._1 .tokuten .text{ width:calc(100% - 280rem - 25rem); }
	.box._1 .tokuten h4{ font-size:34rem; line-height:1.4; }
	.box._1 .tokuten .t1{ font-size:22rem; line-height:1.4; margin-top:10rem; }
	.box._1 .tokuten .t2{ font-size:20rem; line-height:1.4; padding:10rem 30rem; margin-top:20rem; }
	.box._1 .tokuten .note{ margin-top:15rem; }
	.box .how{ margin-top:50rem; }
	.box .how h3{ margin-bottom:30rem; }
	.box .how h3 img.i1{ width:361rem; }
	.box .how h3 img.i2{ width:349rem; }
	.box .how dl{ display:flex; gap:20rem; }
	.box .how dl+dl{ margin-top:30rem; }
	.box .how dl dt{ width:50rem; }
	.box .how dl dt span{ font-size:28rem; width:50rem; height:50rem;  }
	.box .how dl dd{ width:calc(100% - 50rem - 20rem); font-size:18rem; line-height:1.4; }
	.box .how .btns{ margin-top:30rem; }
}
@media (max-width:768px) {
	.box{ padding:50rem 30rem; border-radius:30rem; }
	.box+.box{ margin-top:58rem; }
	.box._1 .read{ font-size:26rem; line-height:1.4; margin-bottom:40rem; }
	.box._1 .wrap_1 h4{
		font-size:32rem; line-height:1.0;
		padding:20rem 60rem; border-radius:60rem; margin-bottom:20rem;
	}
	.box._1 .wrap_1 p{ font-size:32rem; line-height:1.4; margin-bottom:60rem; }
	.box._1 .tokuten{ padding:14rem; }
	.box._1 .tokuten+.tokuten{ margin-top:35rem; }
	.box._1 .tokuten .wrap{ display:flex; flex-flow:column; gap:30rem; padding:30rem 20rem 30rem 30rem; }
	.box._1 .tokuten .img img.i1{ width:278rem; }
	.box._1 .tokuten .img img.i2{ width:332rem; }
	.box._1 .tokuten h4{ font-size:34rem; line-height:1.4; text-align:center; }
	.box._1 .tokuten .t1{ font-size:28rem; line-height:1.4; text-align:center; margin-top:10rem; }
	.box._1 .tokuten .t2{ font-size:26rem; line-height:1.4; text-align:center; padding:20rem 30rem; margin-top:20rem; }
	.box._1 .tokuten .note{ margin-top:15rem; }
	.box .how{ margin-top:50rem; }
	.box .how h3{ margin-bottom:30rem; }
	.box .how h3 img.i1{ width:422rem; }
	.box .how h3 img.i2{ width:408rem; }
	
	.box .how dl{ display:flex; gap:20rem; }
	.box .how dl+dl{ margin-top:30rem; }
	.box .how dl dt{ width:54rem; }
	.box .how dl dt span{ font-size:31rem; width:54rem; height:54rem;  }
	.box .how dl dd{ width:calc(100% - 50rem - 20rem); font-size:26rem; line-height:1.4; }
	.box .how .btns{ margin:30rem 0 0 -74rem; }
	.box .how .btns .bt{ min-width:450rem; }
}

.box._2{ color:#000000; }
.box._2 h3{ text-align:center; font-weight:700;}
.box._2 a{ color:#c6b28d; }
.box._2>p,
.box._2 .note{ line-height:1.6; margin-bottom:1.6em; }
.box._2 h4{ font-size:700; line-height:1.6; }
@media (min-width:769px) {
	.box._2{ padding:30rem 30rem 40rem; }
	.box._2>p{ font-size:14rem; }
	.box._2 h3{ font-size:20rem; line-height:1.2; margin-bottom:50rem; }
	.box._2 h4{ font-size:16rem; }
}
@media (max-width:768px) {
	.box._2{ padding:30rem 40rem 40rem; }
	.box._2>p{ font-size:24rem; }
	.box._2 h3{ font-size:30rem; line-height:1.2; margin-bottom:40rem; }
	.box._2 h4{ font-size:26rem; }
}

.box._0 .read{ text-align:center; }
.download_photo a{ display:block; text-decoration:none; }
.download_photo figure{ overflow:hidden; background:rgba(255,255,255,0.2); }
.download_photo figcaption{
	display:block; background:rgba(255,255,255,0.5);
	font-family:"Kaisei Decol", serif; font-weight:700; text-align:center;
}
.download_photo a:nth-child(1){ background:#b9a7cf; }
.download_photo a:nth-child(2){ background:#a8cf96; }
.download_photo a:nth-child(3){ background:#9ed3f2; }
.download_photo a:nth-child(4){ background:#f7e79c; }
.download_photo a:nth-child(5){ background:#e38295; }
@media (min-width:769px) {
	.download_photo{ display:flex; gap:10rem; }
	.download_photo a{ width:calc((100% - 10rem * 4) / 5); padding:5rem; border-radius:20rem; }
	.download_photo figure{ border-radius:15rem; }
	.download_photo figcaption{ font-size:18rem; line-height:1.0; padding:10rem 5rem; }
	.box._0 .sub h3{ font-size:30rem; }
	.box._0 .read{ font-size:14rem; line-height:1.4; margin-top:10rem; }
}
@media (max-width:768px) {
	.download_photo{ display:flex; flex-wrap:wrap; gap:20rem; justify-content:center; }
	.download_photo a{ width:calc((100% - 20rem * 2) / 3); padding:8rem; border-radius:30rem; }
	.download_photo figure{ border-radius:20rem; }
	.download_photo figcaption{ font-size:28rem; line-height:1.0; padding:20rem 10rem; }
	.box._0 .read{ font-size:28rem; line-height:1.4; margin-top:20rem; }
}
/* } */



/* #footer{ */
#footer{ background:#d3dce3; color:#FFFFFF; }
#footer .copy{ text-align:center; }
@media (min-width:769px) {
	#footer{ padding:30rem 0; margin-top:95rem; }
	#footer .copy{ font-size:16rem; line-height:1.0; }
}
@media (max-width:768px) {
	#footer{ padding:30rem 0; margin-top:130rem; }
	#footer .copy{ font-size:22rem; line-height:1.8; }
}
/* } */

/* end */