@charset "UTF-8";
:root{
	--body : #545d60;
	--link : #545d60;
}
/*--------------------------------------------
MV
---------------------------------------------*/
#mv{
	margin-top: 18px;
	width : 100%;
	text-align: center;
	padding-left: calc( 88 * 100vw / 1600 );
	padding-right: calc( 88 * 100vw / 1600 );
	margin-bottom: calc( 64 * 100vw / 1600 );
}
#mv picture > img{
	width : 100%;
	max-width: 1920px;
	height: auto;
	margin: 0 auto;
}

#mv .fade img,
#mv .fadesp img{
    width: 100%;
}

@media screen and (max-width: 1024px){
#mv{
	margin-top: calc( 182 * 100vw / 750 );
	margin-bottom: calc( 50 * 100vw / 750 );
}
}

/*--------------------------------------------
CONT1
---------------------------------------------*/

#cont1{
	padding-left: calc( 86 * 100vw / 1600 );
	margin-bottom: 148px;
}
#cont1 h2{
	font-size: 40px;
	font-weight: 500;
	line-height: 1.5;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	margin-bottom: calc( 30 * 100vw / 1600 );
}
#cont1 figure{
	display: flex;
	align-items: center;
	flex-flow: row-reverse;
}
#cont1 figure img{
	/*width : 100%;*/
	width: calc( 894 * 100vw / 1600 );
	height: auto;
	max-width: 894px;
}
#cont1 figcaption{
	/*font-size: 1.2vw;*/
	font-size: 18px;
	line-height: 2.4;
	text-align: left;
	padding-right: calc( 48 * 100vw / 1600 );
}

#cont1 figcaption a{
	font-size: 23px;
	color: #fff;
	background-color: #545d60;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	/*max-width: 276px;*/
	width: calc( 300* 100vw / 1600 );
	margin: 32px auto 0 auto;
	border-radius: 36px 36px 36px 36px;
	padding-left: calc( 30 * 100vw / 1600 );
	padding-right: calc( 30 * 100vw / 1600 );
}



@media screen and (min-width:1025px) and (max-width: 1399px){
#cont1 h2{
	font-size: 30px;
}
#cont1 figcaption{
	font-size: 16px;
}
#cont1 figcaption a{
	font-size: 18px;
}
}



@media screen and (max-width: 1024px){
#cont1{
	margin-bottom: calc( 130 * 100vw / 750 );
	padding-left: calc( 40 * 100vw / 750 );
}
#cont1 figure{
	display: flex;
	align-items: center;
	flex-flow: row-reverse;
	flex-direction: column;
}
#cont1 figure img{
	width: calc( 688 * 100vw / 750 );
	margin-bottom: calc( 50 * 100vw / 750 );
}
#cont1 h2{
	font-size: 6.8vw;
	margin-bottom: calc( 40 * 100vw / 750 );
}
#cont1 figcaption{
	font-size: 3.4vw;
	padding-right: calc( 44 * 100vw / 750 );
}
#cont1 figcaption a{
	font-size: 3.4vw;
	width: calc( 300* 100vw / 750 );
}
}




/*--------------------------------------------
CONT2
---------------------------------------------*/

#cont2{
	padding-right: calc( 86 * 100vw / 1600 );
	margin-bottom: calc( 140 * 100vw / 1600 );
}
#cont2 h2{
	font-size: 40px;
	font-weight: 500;
	line-height: 1.5;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	margin-bottom: calc( 30 * 100vw / 1600 );
}
#cont2 figure{
	display: flex;
	align-items: center;
}
#cont2 figure img{
	/*width : 100%;*/
	width: calc( 894 * 100vw / 1600 );
	height: auto;
	max-width: 894px;
}
#cont2 figcaption{
	/*font-size: 1.2vw;*/
	font-size: 18px;
	line-height: 2.4;
	text-align: left;
	padding-left: calc( 48 * 100vw / 1600 );
	/*padding-top: 74px;*/
}


@media screen and (min-width:1025px) and (max-width: 1399px){
#cont2 h2{
	font-size: 30px;
}
#cont2 figcaption{
	font-size: 16px;
}
}



@media screen and (max-width: 1024px){
#cont2{
	margin-bottom: calc( 150 * 100vw / 750 );
	padding-right: calc( 44 * 100vw / 750 );
}
#cont2 figure{
	display: flex;
	align-items: center;
	flex-flow: row-reverse;
	flex-direction: column;
}
#cont2 figure img{
	width: calc( 710 * 100vw / 750 );
	margin-bottom: calc( 50 * 100vw / 750 );
}
#cont2 h2{
	font-size: 6.8vw;
	margin-bottom: calc( 40 * 100vw / 750 );
}
#cont2 figcaption{
	font-size: 3.4vw;
	padding-left: calc( 44 * 100vw / 750 );
}
#cont2 figcaption a{
	font-size: 3.4vw;
	width: calc( 300* 100vw / 750 );
}
}
	
/*--------------------------------------------
CONT3
---------------------------------------------*/

#cont3{
	background-color: #f1f0eb;
	position: relative;
	text-align: center;
	padding-bottom: calc( 60 * 100vw / 1600 );
}
#cont3 div{
	padding-top: calc( 80 * 100vw / 1600 );
}

#cont3 ul{
	display: flex;
	justify-content: center;
	align-items: center;
}
#cont3 .panel ul li{
	text-align: center;
	vertical-align: middle;
	font-size: 20px;
	margin-bottom: calc( 30 * 100vw / 1600 );
	margin-left: calc( 10 * 100vw / 1600 );
	margin-right: calc( 10 * 100vw / 1600 );
}
#cont3 .panel ul li img{
	height: calc( 100 * 100vw / 1600 );
	max-height: 100px;
	width: auto;
}
#cont3 .panel ul li span{
	/*width: 260px;*/
	width: calc( 260 * 100vw / 1600 );
	/*height: calc( 152 * 100vw / 1600 );*/
	/*height: 152px;*/
	display: block;
	background-color: #fff;
	padding-bottom: calc( 26 * 100vw / 1600 );
	padding-top: calc( 26 * 100vw / 1600 );
	margin-bottom: 12px;
	border-radius: 30px 30px 30px 30px;
}


#cont3 ul.tab-group{
	/*margin-bottom: calc( 40 * 100vw / 1600 );*/
	position: absolute;
	left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
#cont3 ul li.tab{
	cursor:pointer;
	background-color: #fff;
	font-size: 24px;
	width: calc( 450 * 100vw / 1600 );
	border: 1px solid #545d60;
	padding-top: calc( 26 * 100vw / 1600 );
	padding-bottom: calc( 26 * 100vw / 1600 );
}
#cont3 ul li.tab-A{
	/*background-color: #fff;*/
	border-radius: 45px 0 0 45px;
}	
#cont3 ul li.tab-B{
	/*background-color: #fff;*/
	border-radius: 0 45px 45px 0;
}

.panel{
  display:none;
}
.tab.is-active{
  background-color:#545d60 !important;
  color:#FFF;
  transition: all 0.2s ease-out;
	position: relative;
}
.tab.is-active::after{
	background-image: url("../images/top/tab_yajirushi.png");
	content: '';
	display: inline-block;
	width: 30px;
	height: 18px;
	position: absolute;
	top: 108%;
	left: 50%;
	transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.panel.is-show{
  display:block;
}


@media screen and (min-width:1025px) and (max-width: 1399px){
#cont3 ul li.tab{
	font-size: 20px;
}
#cont3 .panel ul li{
	font-size: 18px;
}
#cont3 .panel ul li span{
	width: calc( 320 * 100vw / 1600 );
}
}


@media screen and (max-width: 1024px){
#cont3{
	padding-bottom: calc( 70 * 100vw / 750 );
}
#cont3 .panel ul{
	flex-wrap: wrap;
}

	
#cont3 .panel ul li img{
	height: calc( 100 * 100vw / 750 );
	max-height: 100px;
	width: auto;
}
#cont3 ul li.tab{
	font-size: 4.0vw;
	line-height: 1.2;
	width: calc( 306 * 100vw / 750 );
	padding-top: calc( 17 * 100vw / 750 );
	padding-bottom: calc( 17 * 100vw / 750 );
}
#cont3 .panel ul li{
	font-size: 3.4vw;
	margin-bottom: calc( 30 * 100vw / 750 );
	margin-left: calc( 10 * 100vw / 750 );
	margin-right: calc( 10 * 100vw / 750 );
}
#cont3 .panel ul li span{
	width: calc( 290 * 100vw / 750 );
	padding-bottom: calc( 30 * 100vw / 750 );
	padding-top: calc( 30 * 100vw / 750 );
	margin-bottom: calc( 16 * 100vw / 750 );
	border-radius: 20px 20px 20px 20px;
}
#cont3 div{
	padding-top: calc( 120 * 100vw / 750 );
}
	
}

/*--------------------------------------------
CONT4
---------------------------------------------*/

#cont4{
	background-color: #f7f6f2;
	display: flex;
	align-items: center;
	padding-left: calc( 86 * 100vw / 1600 );
	padding-right: calc( 86 * 100vw / 1600 );
	padding-top:  calc( 86 * 100vw / 1600 );
	padding-bottom:  calc( 86 * 100vw / 1600 );
}
#cont4 picture img{
	width: calc( 604 * 100vw / 1600 );
	height: auto;
	max-width: 604px;
}
#cont4 dl{
	padding-left: calc( 56 * 100vw / 1600 );
	padding-right: calc( 34 * 100vw / 1600 );
}
#cont4 dl dt{
	font-size: 40px;
	font-weight: 500;
	line-height: 1.5;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	margin-bottom: calc( 30 * 100vw / 1600 );
	/*margin-top: calc( 70 * 100vw / 1600 );*/
}
#cont4 dl dd{
	font-size: 18px;
	line-height: 2.4;
	text-align: left;
}
#cont4 p img{
	width: calc( 364 * 100vw / 1600 );
	height: auto;
	max-width: 364px;
}




@media screen and (min-width:1025px) and (max-width: 1399px){
#cont4 dl dt{
	font-size: 30px;
}
#cont4 dl dd{
	font-size: 16px;
	line-height: 2;
}
}



@media screen and (max-width: 1024px){
#cont4{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: column;
	padding-left: calc( 0 * 100vw / 1600 );
	padding-right: calc( 0 * 100vw / 1600 );
	padding-top:  calc( 86 * 100vw / 750 );
	padding-bottom:  calc( 86 * 100vw / 750 );
}
#cont4 dl{
	padding-left: calc( 88 * 100vw / 1600 );
	padding-right: calc( 88 * 100vw / 1600 );
}
#cont4 dl dt{
	font-size: 6.8vw;
	text-align: center;
	margin-bottom: calc( 30 * 100vw / 750 );
}
#cont4 dl dd{
	font-size: 3.4vw;
	margin-bottom: calc( 60 * 100vw / 750 );
}
#cont4 picture img{
	/*width: calc( 670 * 100vw / 750 );*/
	width: 100%;
	padding-left: calc( 88 * 100vw / 1600 );
	padding-right: calc( 88 * 100vw / 1600 );
	height: auto;
	margin-bottom: calc( 80 * 100vw / 750 );
}
#cont4 p img{
	width: calc( 526 * 100vw / 750 );
	height: auto;
}
}

/*--------------------------------------------
CONT5
---------------------------------------------*/

#cont5{
	padding-top: calc( 70 * 100vw / 1600 );
	padding-bottom: calc( 20 * 100vw / 1600 );
}
#cont5 h2{
	background-color:#545d60;
	color: #fff;
	position: relative;
	text-align: center;
	border-radius: 45px 45px 45px 45px;
	font-size: 24px;
	width: calc( 546 * 100vw / 1600 );
	border: 1px solid #545d60;
	padding-top: calc( 26 * 100vw / 1600 );
	padding-bottom: calc( 26 * 100vw / 1600 );
	margin: 0 auto calc( 44 * 100vw / 1600 ) auto;
}
#cont5 h2::after{
	background-image: url("../images/top/tab_yajirushi.png");
	content: '';
	display: inline-block;
	width: 30px;
	height: 18px;
	position: absolute;
	top: 108%;
	left: 50%;
	transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

#cont5 dl{
	width: 100%;
	display: flex;
	align-items: center;
	border-bottom: #c9c8c3 solid 1px;
	padding-right: calc( 300 * 100vw / 1600 );
	padding-left: calc( 300 * 100vw / 1600 );
	padding-top: 30px;
	padding-bottom: 30px;
}
#cont5 dl:last-child{
	border-bottom: none;
}
#cont5 dl strong{
	font-size: 28px;
	display: block;
	font-weight: 500;
	margin-bottom: 24px;
}
#cont5 dl strong span{
	color: #f7ce1e;
	font-size: 28px;
	font-weight: 600;
	margin-right: 30px;
}
#cont5 dl dd{
	font-size: 18px;
	line-height: 1.5;
	margin-left: calc( 30 * 100vw / 1600 );
}
#cont5 dl img{
	height: calc( 150 * 100vw / 1600 );
	max-height: 150px;
	width: auto;
}



@media screen and (min-width:1025px) and (max-width: 1399px){
#cont5 h2{
	font-size: 20px;
}
#cont5 dl{
	padding-right: calc( 160 * 100vw / 1600 );
	padding-left: calc( 160 * 100vw / 1600 );
}
#cont5 dl strong{
	font-size: 26px;
}
#cont5 dl strong span{
	font-size: 26px;
}
#cont5 dl dd{
	font-size: 16px;
}

}


@media screen and (max-width: 1024px){
#cont5{
	padding-top: calc( 86 * 100vw / 750 );
	padding-bottom: calc( 30 * 100vw / 750 );
}
#cont5 h2{
	font-size: 4.2vw;
	width: calc( 606 * 100vw / 750 );
	padding-top: calc( 32 * 100vw / 750 );
	padding-bottom: calc( 32 * 100vw / 750 );
}
#cont5 dl{
	padding-left: calc( 88 * 100vw / 1600 );
	padding-right: calc( 88 * 100vw / 1600 );
	padding-top: calc( 50 * 100vw / 750 );
	padding-bottom: calc( 50 * 100vw / 750 );
}
#cont5 dl strong{
	font-size: 4.6vw;
	margin-bottom: calc( 24 * 100vw / 750 );
}
#cont5 dl strong span{
	font-size: 4.6vw;
}
#cont5 dl dd{
	font-size: 3.4vw;
}
#cont5 dl img{
	height: calc( 150 * 100vw / 750 );
	max-height: 150px;
	width: auto;
}
}