@charset "UTF-8";

@media screen and (max-width: 750px){
	html{
		font-size : calc( 10 * 100vw / 750 );
	}
}
@media screen and (min-width: 751px) and (max-width: 1024px){
	html{
		font-size : calc( 10 * 100vw / 1240 );
	}
}
@media screen and (min-width:1025px) and (max-width: 1919px){
	html{
		font-size : calc( 10 * 100vw / 1920 );
	}
}
@media print,screen and (min-width: 1920px){
	html{
		font-size : 10px;
	}
}


body{
		margin: 0;
		padding: 0;
	}


@media screen and (min-width: 751px){
a[href^="tel:"] {
    pointer-events: none;
}
	}
img {
    -webkit-backface-visibility: hidden;
}

/*--------------------------------------------
subpage　title
---------------------------------------------*/

#maintitle{
	margin-bottom: calc( 120 * 100vw / 1600 );
	margin-top: 18px;
	width : 100%;
	text-align: center;
	padding-left: calc( 88 * 100vw / 1600 );
	padding-right: calc( 88 * 100vw / 1600 );
}
#maintitle picture > img{
	width : 100%;
	max-width: 1920px;
	height: auto;
	margin: 0 auto;
}

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

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

/*--------------------------------------------
cont
---------------------------------------------*/

.cont{
	padding-left: calc( 88 * 100vw / 1600 );
	padding-right: calc( 88 * 100vw / 1600 );
}

/*--------------------------------------------
HEADER
---------------------------------------------*/
#header{
	/*position : fixed;
	top : 0;
	left : 0;
	width : 100%;
	z-index : 10;
	background-color : #fff;*/
	/*opacity: 0.94;*/
	/*height: 114px;*/
}
#header a{
	color: #545d60;
	letter-spacing: 0.1em;
	/*font-weight: 800;*/
}

.wrap-fluid{
	display: flex;
	justify-content: space-between;
}
.wrap-fluid nav ul{
	display: flex;
	/*font-size: 1.1vw;*/
	font-size: 18px;
	text-align: center;
}


.wrap-fluid nav ul li:last-child{
	/*background-color: #ffdf35;*/
	/*padding: calc( 14 * 100vw / 1920 );*/
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
	width: 190px;
	border-bottom-left-radius: 26px;
	-webkit-border-bottom-left-radius: 26px;
	-moz-border-radius-bottomleft: 26px;
	background: #ffdf35 url(../images/commons/h_mail.png) no-repeat 50% 34% ;
}
/*.wrap-fluid nav ul li:last-child::before{
	content: '';
	width: 44px;
	height: 44px;
	background: url(../images/commons/h_mail.png) no-repeat 50% 50% ;
	margin-top: 18px;
	cursor: pointer;
}*/

.wrap-fluid nav ul li:last-child:hover {
    background-color: #fff400;
}
.wrap-fluid nav ul li:last-child a:hover {
	opacity: 1.0;
}
.wrap-fluid nav ul li{
	
}
.wrap-fluid nav ul li a{
	/*padding-left: calc( 40 * 100vw / 1920 );
	padding-right: calc( 40 * 100vw / 1920 );
	padding-top: calc( 74 * 100vw / 1920 );
	padding-bottom: calc( 28 * 100vw / 1920 );
	display: block;*/
	padding-left: 34px;
	padding-right: 34px;
	padding-top: 76px;
	padding-bottom: 20px;
	display: block;
}
/*.wrap-fluid nav ul li:last-child a{
	padding-top: 12px;
}*/

#header .wrap-fluid{
	padding-left : calc( 34 * 100vw / 1920 );
	}
#header .logo{
	padding-top : calc( 18 * 100vw / 1920 );
	}


@media screen and (max-width: 1024px){

#header{
	position : fixed;
	top : 0;
	left : 0;
	width : 100%;
	z-index : 10;
	background-color : #fff;
}
	
#header a{
	letter-spacing: 0.1em;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
	
#header .wrap-fluid{
	height : calc( 182 * 100vw / 750 );
	padding-left : calc( 36 * 100% / 750 );
	padding-right : calc( 36 * 100% / 750 );
	display : flex;
	align-items : center;
	position: relative;
}
#header .logo{
	padding-top : calc( 0 * 100vw / 750 );
}
#header .logo img{
	height : calc( 140 * 100vw / 750 );
}

.wrap-fluid nav ul{
	display: flex;
	flex-direction: column;
	font-size: 4.4vw;
	text-align: center;
	margin-top: calc( 100 * 100vw / 1920 );
}
.wrap-fluid nav ul li{
	margin-bottom: calc( 20 * 100vw / 750 );
}
	
	
.wrap-fluid nav ul li a{
	border-bottom: 1px solid #fff;
	padding-top: calc( 50 * 100vw / 1920 );
	padding-bottom: calc( 90 * 100vw / 1920 );
	padding-left: calc( 0 * 100vw / 1920 );
	padding-right: calc( 0 * 100vw / 1920 );
	display: block;
}
.wrap-fluid nav ul li:last-child{
	background-color: #545d60;
	/*color: #fff;*/
	text-align: center;
	/*width: calc( 306 * 100vw / 750 );*/
	width: 70%;
	border-radius: 30px 30px 30px 30px;
	-webkit-border-radius: 30px 30px 30px 30px;
	-moz-border-radius: 30px 30px 30px 30px;
	margin: 0 auto;
}
.wrap-fluid nav ul li:last-child::before{
	background: none;
	margin-top: 0px;
	width: 0px;
	height: 0px;
	display: inline;
}
#header .wrap-fluid nav ul li:last-child a{
	font-size: 4.4vw;
	background-color: #545d60;
	color: #fff;
	display: block;
	padding-top: calc( 30 * 100vw / 750 );
	padding-bottom: calc( 30 * 100vw / 750 );
	/*width: calc( 412* 100vw / 1600 );
	max-width: 412px;*/
	border-radius: 30px 30px 30px 30px;
	border-bottom: none;
}	
	
.wrap-fluid nav ul li:last-child:hover {
    background-color: #545d60;
	opacity: 0.6;
}
.wrap-fluid nav ul li:last-child a:hover {
	/*opacity: 0.6;*/
}
	
	
	

	

.wrap-fluid nav ul li dl{
	margin-top: calc( 56 * 100vw / 750 );
	margin-bottom: calc( 56 * 100vw / 750 );
	color: #545d60;
}
.wrap-fluid nav ul li dt{
	font-size: 2.4vw;
	margin-bottom: calc( 10 * 100vw / 750 );
}
.wrap-fluid nav ul li dd{
	font-size: 3.2vw;
	margin-bottom: calc( 10 * 100vw / 750 );
}
.wrap-fluid nav ul li dd.con_tel{
	font-size: 8vw;
	font-weight: 600;
}
	
}



/*--------------------------------------------
MENU BUTTON
---------------------------------------------*/


@media screen and (max-width: 1024px){
#header p {
	margin-right: calc( 114 * 100vw / 750 );
}
#header p img{
	height: calc( 46 * 100vw / 750 );
}
}

@media screen and (max-width: 1024px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
	@media screen and (max-width: 1024px){
		body.is-open #nav{
			max-height : 100vh;
		}
	}
	@media screen and (max-width: 1024px){
		body.is-open #drawerPanel{
			position : fixed;
			z-index : -1;
			width : 100%;
		}
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
		transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(2){
		transform : rotate(-45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(3){
		transform : rotate(45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
		transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
	}
	@media screen and (max-width: 750px) and (-ms-high-contrast:none){
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
	#menuBtn{
		z-index : 11;
		position : absolute;
	}
	#menuBtn span{
		font-size : 0;
	}
	#menuBtn > span:nth-of-type(1){
		width : 100%;
		position : relative;
		display : block;
	}
	#menuBtn span span{
		display : block;
		position : absolute;
		left : 0;
		transition : all .4s;
		width : 100%;
	}
	#menuBtn span span:nth-of-type(1){
		top : 0;
	}
	#menuBtn span span:nth-of-type(4){
		bottom : 0;
	}
}
#menuBtn{
	z-index : 11;
	position : absolute;
}
#menuBtn span{
	font-size : 0;
}
#menuBtn > span:nth-of-type(1){
	width : 100%;
	position : relative;
	display : block;
}
#menuBtn span span{
	display : block;
	position : absolute;
	left : 0;
	transition : all .4s;
	width : 100%;
}
#menuBtn span span:nth-of-type(1){
	top : 0;
}
#menuBtn span span:nth-of-type(4){
	bottom : 0;
}
@media screen and (max-width: 1024px){
	#menuBtn{
		right : calc( 40 * 100% / 750 );
		top : 50%;
		transform : translateY(-50%);
		width : calc( 50 * 100% / 750 );
		height : calc( 50 * 100vw / 750 );
		z-index : 10;
	}
	#menuBtn > span:nth-of-type(1){
		height : calc( 32.5 * 100vw / 750 );
	}
	#menuBtn span span{
		background-color : #545d60;
		height : calc( 2 * 100vw / 750 );
	}
	#menuBtn span span:nth-of-type(2),
	#menuBtn span span:nth-of-type(3){
		top : calc( 14.75 * 100vw / 750 );
	}
	#menuBtn > span:nth-of-type(2){
		margin-top : calc( 10.5 * 100vw / 750 );
		display : block;
	}
	#menuBtn > span:nth-of-type(2) img{
		height : calc( 11 * 100vw / 750 );
	}
}
body.is-open #menuBtn{
	top : 54%;
	right : calc( 50 * 100% / 750 );
}
body.is-open #menuBtn > span:nth-of-type(1){
	height : calc( 40 * 100vw / 750 );
}
body.is-open #menuBtn span span{
	background-color : #545d60;
}
body.is-open #menuBtn > span:nth-of-type(2){
	display : none;
}

@media screen and (max-width: 750px){
body.is-open #menuBtn{
	top : 54%;
	right : calc( 60 * 100% / 750 );
}
}

/*--------------------------------------------
NAV
---------------------------------------------*/
@media screen and (max-width: 1024px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
	@media screen and (max-width: 1024px){
		body.is-open #nav{
			max-height : 100vh;
		}
	}
	@media screen and (max-width: 1024px){
		body.is-open #drawerPanel{
			position : fixed;
			z-index : -1;
			width : 100%;
		}
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
		transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(2){
		transform : rotate(-45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(3){
		transform : rotate(45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
		transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
	}
	@media screen and (max-width: 750px) and (-ms-high-contrast:none){
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
	#menuBtn{
		z-index : 11;
		position : absolute;
	}
	#menuBtn span{
		font-size : 0;
	}
	#menuBtn > span:nth-of-type(1){
		width : 100%;
		position : relative;
		display : block;
	}
	#menuBtn span span{
		display : block;
		position : absolute;
		left : 0;
		transition : all .4s;
		width : 100%;
	}
	#menuBtn span span:nth-of-type(1){
		top : 0;
	}
	#menuBtn span span:nth-of-type(4){
		bottom : 0;
	}
}
@media screen and (max-width: 1024px){
	#nav{
		position : fixed;
		left : 0;
		width : 100%;
		z-index : 10;
		transition : max-height .5s ease-in;
		max-height : 0;
		overflow : hidden;
		overflow-y : scroll;
		top : 0;
		height : 100vh;
		background-color : #ffdf35;
	}
	#nav .scroll{
		position : relative;
		padding-top : calc( 133 * 100vw / 750 );
		padding-bottom : calc( 76 * 100vw / 750 );
		padding-left : calc( 87.5 * 100% / 750 );
		padding-right : calc( 87.5 * 100% / 750 );
	}
	#nav .scroll > a{
		display : block;
		text-align : center;
	}
	#nav .scroll > a img{
		height : calc( 54 * 100vw / 750 );
	}
}




/*--------------------------------------------
ADD　contact-container
---------------------------------------------*/

.contact-container{
	background-color: #ffdf35;
	border-radius: 30px 30px 30px 30px;
	margin-right: calc( 220 * 100vw / 1600 );
	margin-left: calc( 220 * 100vw / 1600 );
	margin-bottom: calc( 70 * 100vw / 1600 );
	padding-top: calc( 34* 100vw / 1600 );
	padding-bottom: calc( 34 * 100vw / 1600 );
	display: flex;
	align-items: center;
	justify-content: center;
}
.contact-container dl,
.contact-container p{
	margin-right: calc( 70 * 100vw / 1600 );
	margin-left: calc( 70 * 100vw / 1600 );
}
.contact-container dt{
	font-size: 16px;
	margin-bottom: 12px;
}
.contact-container dd{
	font-size: 21px;
	margin-bottom: 12px;
}
.contact-container dd.con_tel{
	font-size: 52px;
	font-weight: 600;
}

.contact-container a{
	font-size: 23px;
	color: #fff;
	background-color: #545d60;
	display: block;
	padding-top: calc( 26 * 100vw / 1600 );
	padding-bottom: calc( 26 * 100vw / 1600 );
	text-align: center;
	width: calc( 412* 100vw / 1600 );
	max-width: 412px;
	border-radius: 36px 36px 36px 36px;
}


@media screen and (min-width:1025px) and (max-width: 1399px){
.contact-container{
	margin-right: calc( 160 * 100vw / 1600 );
	margin-left: calc( 160 * 100vw / 1600 );
}
.contact-container dt{
	font-size: 13px;
	margin-bottom: 8px;
}
.contact-container dd{
	font-size: 18px;
	margin-bottom: 8px;
}
.contact-container dd.con_tel{
	font-size: 44px;
}
.contact-container a{
	font-size: 18px;
	padding-top: calc( 30 * 100vw / 1600 );
	padding-bottom: calc( 30 * 100vw / 1600 );
}

}


@media screen and (max-width: 1024px){
.contact-container{
	flex-direction: column;
	border-radius: 20px 20px 20px 20px;
	text-align: center;
	margin-right: calc( 88 * 100vw / 1600 );
	margin-left: calc( 88 * 100vw / 1600 );
	padding-top: calc( 50* 100vw / 750 );
	padding-bottom: calc( 50 * 100vw / 750 );
	margin-bottom: calc( 70 * 100vw / 750 );
}
.contact-container dt{
	font-size: 2.8vw;
	margin-bottom: calc( 5 * 100vw / 750 );
}
.contact-container dd{
	font-size: 3.6vw;
	margin-bottom: calc( 30 * 100vw / 750 );
}
.contact-container dd.con_tel{
	font-size: 8.4vw;
	margin-bottom: calc( 10 * 100vw / 750 );
}
.contact-container a{
	font-size: 3.8vw;
	padding-top: calc( 26 * 100vw / 750 );
	padding-bottom: calc( 30 * 100vw / 750 );
	width: calc( 390* 100vw / 750 );
	max-width: auto;
}
}



/*--------------------------------------------
ADD　map-container
---------------------------------------------*/


.map-container{
	position : relative;
	width : 100%;
	height: calc( 500 * 100vw / 1600 );
}
.map-container > #map,
.map-container > iframe{
	width : 100%;
	height : 100%;
	position : absolute;
	top : 0;
	left : 0;
	right : 0;
	bottom : 0;
	margin : auto;
}

@media screen and (max-width: 1024px){
.map-container{
	position : relative;
	width : 100%;
	height: calc( 460 * 100vw / 750 );
}
.map-container > #map,
.map-container > iframe{
	width : 100%;
	height : 100%;
	position : absolute;
	top : 0;
	left : 0;
	right : 0;
	bottom : 0;
	margin : auto;
}
	
}



/*--------------------------------------------
FOOTER
---------------------------------------------*/
#footer{
	background-color: #f1f0eb;
}
#footer .wrap{
	text-align: center;
	padding-top : calc( 77 * 100vw / 1920 );
	padding-bottom : calc( 100 * 100vw / 1920 );
}


#footer .wrap dl dt{
	margin-bottom: 32px;
}
#footer .wrap dl dt img{
	width: calc( 130 * 100vw / 1600 );
	max-width: 130px;
}
#footer .wrap dl dd{
	/*margin: 0 0 calc( 22 * 100vw / 1920 ) 0;*/
	/*font-size: 1.1vw;*/
	font-size : 20px;
	font-weight: 500;
	margin-bottom: 10px;
}

#footer .wrap span{
	/*font-size : 0.9vw;*/
	font-size : 40px;
	line-height : 1.92;
	font-weight: 600;
	/*margin-top: calc( 50 * 100vw / 1920 );*/
	display: block;
	margin-bottom: 36px;
}
#footer .wrap span::before{
	top: 5px;
	left: 0;
	content: url("../images/commons/f_tel.png");
	margin-right: 10px;
}
#footer .wrap p{
	/*font-size : 0.9vw;*/
	font-size : 16px;
	line-height : 1.92;
	font-weight: 300;
	/*margin-top: calc( 50 * 100vw / 1920 );*/
}



@media screen and (min-width:1025px) and (max-width: 1399px){
#footer .wrap dl dd{
	font-size : 16px;
}
#footer .wrap span{
	font-size : 32px;
}
#footer .wrap p{
	font-size : 13px;
}

}





@media screen and (max-width: 1024px){
#footer .wrap{
	padding-top : calc( 70 * 100vw / 750 );
	padding-bottom : calc( 80 * 100vw / 750 );
}
#footer .wrap dl dt{
	margin-bottom: calc( 50 * 100vw / 750 );
}
#footer .wrap dl dt img{
	width: calc( 134 * 100vw / 750 );
	max-width: 134px;
}
#footer .wrap dl dd{
	font-size : 3.4vw;
	margin-bottom: calc( 30 * 100vw / 750 );
}
#footer .wrap span{
	font-size : 6.8vw;
	margin-bottom: calc( 40 * 100vw / 750 );
}
#footer .wrap p{
	font-size : 2.8vw;
}

}





/*--------------------------------------------
toTop
---------------------------------------------*/
#toTop {
    position: fixed;
    bottom: 25px;
    right: 25px;
}
#toTop img {
	width: calc( 30 * 100vw / 750 );
}



@media screen and (max-width: 1024px){
#toTop {
    position: fixed;
    bottom: calc( 50 * 100vw / 750 );
    right: calc( 40 * 100vw / 750 );
}
#toTop img {
	width: calc( 80 * 100vw / 750 );
}
}



@media print,screen and (min-width: 1920px){
#toTop img {
	width: calc( 24 * 100vw / 750 );
}
}



/*--------------------------------------------
side_nav
---------------------------------------------*/

#side_nav{
	position:fixed;
	bottom:100px;
	left:-400px;
	z-index:9;
	-webkit-transition: left 0.8s;
	-moz-transition: left 0.8s;
	-ms-transition: left 0.8s;
	transition: left 0.8s;
}
#side_nav ul li{
	margin-bottom:10px;
}


@media screen and (max-width: 1024px){
#side_nav{
	bottom:220px;
}
#side_nav img {
	width: calc( 160 * 100vw / 750 );
}
}