@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP:400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&family=M+PLUS+Rounded+1c:wght@300;400;500&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,700|Roboto:300,400,500,700&display=swap');
@import url('reset.css');
/*
font-family: 'Noto Serif JP', serif;
font-family: 'Kosugi Maru', sans-serif;
font-family: 'M PLUS Rounded 1c', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Roboto', sans-serif;

*/

body{
	position: relative;
	font-family:'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
	font-size: 100%;
	line-height: 1.75;
	color: #3E3A39;
}
	@media screen and (max-width:1024px) {
		body{
			font-size: 87.5%;
			line-height: 1.5714;
		}
	}

	@media screen and (max-width:760px) {
		.sp-block{
			display: block;
		}
		.br-none{
			display: none;
		}
	}


a{
	color: #3E3A39;
	text-decoration: none;
	outline:none;
}
a.link{
	color: #65acbd;
	text-decoration: underline;
}

header{
	width: 94%;
	margin: 2em auto 1.5em;
	position: relative;
}

header h1 a{
	background: url(../images/common/logotype.svg) no-repeat top left;
	width: 351px;
	height: 51px;
	background-size: 100% auto;
	text-indent: -9999px;
	margin: 0 auto;
	display: block;
	position: relative;
	left: .3em;
}
header h2{
	position: absolute;
	top: 0;
	left: 0;
	line-height:1.375; 
}
.telephone{
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
}
.telephone  span{
	font-size: 1.5em;

}
	@media screen and (max-width:760px) {
		header{
			margin: 1.25em auto
		}
		header h1 a{
			width: 207px;
			height: 30px;
			left: -.4em;
		}
		header h2{
			display: none;
		}
	}

/*
++++++++++++++++++++++++++++++++++
globalmenu
++++++++++++++++++++++++++++++++++
*/
input#trigger{
	display: none;
}
.gnav{
	width: 100%;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	flex-wrap: wrap;
}
.navlink:nth-child(1){
	width: 39%;
}
.navlink:nth-child(2){
	width: 39%;
	margin-left: 8em;

}
	@media screen and (max-width:1280px) {
		.navlink:nth-child(1),
		.navlink:nth-child(2){
			margin-left: 3em;
		}
	}
	@media screen and (max-width:760px) {
		.navlink:nth-child(1),
		.navlink:nth-child(2){
			width: 100%;
			margin-left: 0;
		}
	}

.navlink li{
	padding-bottom: .625em;
	margin-bottom: .625em;
}
.navlink .telephone{
	display: inline-block;
}

.navlink li > a{
	font-size: 1.25em;
	font-weight: 700;
	line-height: 1.25em;
	display: block;
	transition: all .2s;
	position: relative;
}
.navlink li > a:before{
	position: absolute;
	right: .5em;
	top: 50%;
	margin-top: -4px;
	content: '';
	width: 8px;
	height: 8px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transition: all .1s;
}
.navlink li > a:hover:before{
	right: 0;
}
.navlink li > a > span{
	display: inline-block;
	position: relative;
}
.navlink li > a > span:after{
	border-bottom: solid 1px #3E3A39;
	bottom: 0;
	content: "";
	display: block;
	position: absolute;
	left: 0;
	transition: all .3s ease;
	-webkit-transition: all .3s ease;
	width: 0;
}
.navlink li > a > span:hover:after{
	width: 100%;
}
.navlink li > span{
	font-size: 1.25em;
	font-weight: 700;
}
.navlink li > li a:befor{
	padding-bottom: auto;
	margin-bottom: auto;
}

.navlink-sub > div{
	margin-left: 1em;
	border-bottom: 1px dotted #999;
}
.navlink-sub > div > a{
	display: block;
	padding: .6em 0;
	font-weight: 500;
	position: relative;
}
	@media screen and (max-width:760px) {
		.navlink-sub > div > a{
			padding: .375em 0;
		}
	}

.navlink-sub > div > a:before{
	position: absolute;
	right: .5em;
	top: 50%;
	margin-top: -4px;
	content: '';
	width: 8px;
	height: 8px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transition: all .1s;
}
.navlink-sub > div > a:hover:before{
	right: 0;
}
.navlink-sub > div > .sublink{
	margin-bottom: 1em;
}
.navlink-sub > div > .sublink a{
	display: block;
	font-size: .865em;
	color: #3E3A39;
	padding-left: 1.25em;
	position: relative;
	transition: all .2s;
}
.navlink-sub > div > .sublink a:hover{
	color: #508237;
}
.navlink-sub > div > .sublink a:before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: .5em;
	height: 1px;
	background: #3E3A39;
}

.navlink-yoyaku{
	margin-top: .5em;
}

.btn-icon-webyoyaku{
	display: block;
	background: #df7503 url(../images/common/icon-yoyaku.png) no-repeat 96% center;
	background-size: 1.75em auto;
	color: #fff;
	text-align: center;
	border-radius: .75em;
	-moz-border-radius: .75em;
	-webkit-border-radius: .75em;
	margin: 1.5em auto;
	padding: 1em;
}
	@media screen and (max-width:374px) {
		.btnarw-webyoyaku{
			text-align: left;
		}
	}
.btn-icon-schedule{
	display: block;
	background: #9fb61b url(../images/common/icon-schedule.png) no-repeat 96% center;
	background-size: 1.75em auto;
	color: #fff;
	text-align: center;
	border-radius: .75em;
	-moz-border-radius: .75em;
	-webkit-border-radius: .75em;
	margin: 1.5em auto;
	padding: 1em;
}
	@media screen and (max-width:374px) {
		.btnarw-schedule{
			text-align: left;
		}
	}
.navlink-other{
	margin-top: 1.75em;
	line-height: 1.3;
}
.navlink-other img{
	width: 36px;
	margin-right: 6px;
}
.telephone-switch{
	width: 100%;
	padding-bottom: 1em;
}
.telephone-switch span > span:before{
	content: "tel.03-6904-4822";
	font-size: 1.5em;
}
	@media screen and (max-width:567px) {
		.navlink-other{
			text-align: center;
		}
		.telephone-switch{
			padding-bottom: 2em;
		}
		.telephone-switch span > span:before{
			content: "電話する";
			font-size: 1.0em;
			background: #3E3A39;
			color: #fff;
			text-align: center;
			border-radius: 3em;
			-moz-border-radius: 3em;
			-webkit-border-radius: 3em;
			padding: 1em;
			display: block;
			margin-top: 2em;

		}

	}

/* ハンバーガーモーダルウィンドウ*/

body.open {
	overflow: hidden;
	height: 100%;
}

.overlay{
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	justify-content: center;
	overflow: auto;
	z-index: 9999;
	width: 100%;
	height: 100%;
	opacity: 0;
	background: rgba(0,0,0,0.5);
	transform: scale(0);
	position: fixed;
	top: 0;
	left: 0;
}
.modal_trigger{
	position: absolute;
	width: 100%;
	height: 100%;
}
.modalcontent{
	align-self: flex-start;
	box-sizing: border-box;
	width: 100%;
	padding: 6em 14.5em 6em;
	background: #F0EAE1;
	transform: translateY(-100%);
	transition: 0.5s;
	z-index: 10000;
	-webkit-overflow-scrolling: touch;
}
	@media screen and (max-width:1280px) {
		.modalcontent{
			padding: 7.5em 3em;
		}
	}

	@media screen and (max-width:760px) {
		.modalcontent{
			padding: 4.5em 2.5em;
		}
	}


nav input:checked ~ .overlay{
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
nav input:checked ~ .overlay .modalcontent{
	transform: translateY(0);
}

.humberger{
	position: fixed;
	top: 2.5em;
	right: 3%;
	width: 3em;
	height: 2em;
	color: #000;
	z-index: 9999;
	cursor: pointer;
	padding: 1em 0 .5em 0;
}
.humberger span{
	position: relative;
	bottom: -1.35em;
	text-align: center;
	display: block;
	font-size: .8125em;
	font-family: 'Roboto', sans-serif;
}

	@media screen and (max-width:760px) {
		.humberger{
			top: 1em;
			width: 1.9em;
			height: 1.5em;
		}
		.humberger span{
			font-size: .6333em;
		}
	}


.humberger:before {
	content: "";
	position: absolute;
	top: .5em;
	left: 0;
	width:  100%;
	height: 3px;
	background: #000;
	transition: all 0.3s;
}
.humberger:after {
	content: "";
	position: absolute;
	top: 1.25em;
	left: 0;
	width:  100%;
	height: 3px;
	background: #000;
	transition: all 0.3s ease-in-out;
}

nav input:checked ~ .humberger:before{
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	top: 25%;
}

nav input:checked ~ .humberger:after{
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	top: 25%;
}
/*
++++++++++++++++++++++++++++++++++
footer
++++++++++++++++++++++++++++++++++
*/
footer{
	border-top: 1px solid #dedede;
	background-repeat: repeat-x;
	padding: 2.5em 0 1em;
	margin: 4em 0;
}
#sub footer{
	margin-top: 0;
}
#footer{
	width: 90%;
	max-width: 1280px;
	margin: 0 auto;
}
#footer-flex{
	width: 100%;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.footer-item-adress,
.footer-item-map{
	width: 48%;
}
	@media screen and (max-width:1024px) {
		.footer-item-adress{
			width: 46%;
		}
		.footer-item-map{
			width: 50%;
		}
	}
	@media screen and (max-width:760px) {
		footer{
			padding-top: 2em;
		}
		#footer{
			width: 90%;
		}
		.footer-item-adress{
			width: 100%;
		}
		.footer-item-map{
			width: 70%;
			margin: 1em auto 0
		}
	}
	@media screen and (max-width:567px) {
		.footer-item-map{
			width: 100%;
		}
	}


.footer-mark{
	background: url(../images/common/logotype.svg) no-repeat top left;
	width: 351px;
	height: 51px;
	background-size: 100% auto;
	text-indent: -9999px;
	margin-bottom: 1em;
}
	@media screen and (max-width:1024px) {
		.footer-mark{
			width: 296px;
			height: 43px;
		}
		.access-details:first-child > span{
			display: block;
		}
	}
	@media screen and (max-width:760px) {
		.access-details:first-child > span{
			display: inline;
		}
	}

.footer-adress{
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	flex-wrap: wrap;
	align-items: flex-end;
	line-height: 1.5;
}
.access-details:last-child{
	margin-left: auto;
}
.access-details:last-child a{
	background: #65ACBD;
	color: #fff;
	font-size: .875em;
	padding: .75em;
	border-radius: .75em;
	-moz-border-radius: .75em;
	-webkit-border-radius: .75em;
	display: inline-block;
	position: relative;
	top: -.5em;
}
	@media screen and (max-width:760px) {
		.footer-mark{
			width: 200px;
			height: 29px;
			margin: 0 auto 1em auto
		}
		.footer-adress{
			display: block;
			text-align: center;
			margin-bottom: 1.5em;
		}
		.access-details:last-child{
			margin-top: .5em;
		}
		.access-details:last-child a{
			padding: .75em 4em;
			top: auto;
		}
	}

.footer-hours {
	margin-top: 1.25em;
}
.footer-hours dl{
	width: 100%;
	border-top: 2px solid #e0e0e0;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -o-flex;
	flex-wrap: wrap;
	padding: 1.25em 0;
}
.footer-hours dt{
	width: 28%;
	border-right: 2px solid #e0e0e0;
	padding-right: 1em;
}
.footer-hours dd{
	width: 72%;
	padding-left: 1em;
}
.footer-hours table{
	width: 100%;
	border-top: 2px solid #e0e0e0;
	border-bottom: 2px solid #e0e0e0;
}
.footer-hours th{
	width: 28%;
	border-right: 2px solid #e0e0e0;
	text-align: left;
	padding: .25em 0;
}
.footer-hours td{
	width: 9%;
	text-align: center;
	padding: .25em 0;
}
	@media screen and (max-width:1024px) {
		.footer-hours dd span{
			display: block;
		}
	}

#copylight{
	margin:2em 0;
	font-size: .75em;
	font-family: 'Roboto', sans-serif;
}
	@media screen and (max-width:760px) {
		#copylight{
			text-align: center;
		}
	}
/*
++++++++++++++++++++++++++++++++++
margin
++++++++++++++++++++++++++++++++++
*/
.mtl{
	margin-top: 3em;
}
.mt{
	margin-top: 2em
}
.mts{
	margin-top: 1.5em;
}
.mtxs{
	margin-top: .75em;
}

/*
++++++++++++++++++++++++++++++++++
font
++++++++++++++++++++++++++++++++++
*/
.inline-block{
	display: inline-block;
}
.em {
	font-weight: bold;
}
.em400{
	font-weight: 400;
}
.em500{
	font-weight: 500;
}
.em700{
	font-weight: 700;
}
.em900{
	font-weight: 900;
}
.small{
	font-size: .875em;
}
.xsmall{
	font-size: .75em;
}
.xx-small{
	font-size: .6875em;
}
.brown{
	color: #595334;
}
.midori{
	color: #508135;
}
.red{
	color: #af541b;
}
.deepred{
	color: #eb6044;
}
.orange{
	color: #df7503;
}
.kosugi{
	font-family: 'Kosugi Maru', sans-serif;
}
.mplus{
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
.tsume{
	font-feature-settings: "palt";
	letter-spacing: .5px;
}
.icon-shikaku-brown{
	color: #595334;
	padding-left: 1em;
	position: relative;
}
.icon-shikaku-brown:before{
	position: absolute;
	top: .5em;
	left: 0;
	content: "";
	width: .75em;
	height: .75em;
	background: #595334;
	line-height: 1.4;
}


/*
++++++++++++++++++++++++++++++++++
flex
++++++++++++++++++++++++++++++++++
*/
.flex{
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	flex-wrap: wrap;
}

.between{
	justify-content: space-between;
}
.item-center{
	-webkit-align-items: center;
	justify-content: center;
	align-items: center;
}
.align-center{
	align-items: center;
}
.stretch{
	-webkit-align-items: stretch;
	-ms-align-items: stretch;
	align-items: stretch;
}
.row-reverse{
	flex-direction: row-reverse;
}

.clm2-block{
	width: 48%;
}

	@media screen and (max-width:567px) {
		.clm2-block{
			width: 100%;
		}
	   
	}

/*
++++++++++++++++++++++++++++++++++
about
++++++++++++++++++++++++++++++++++
*/
.fadein{
	opacity : 0;
	transform : translate(0, 2.5rem);
	transition : all .7s;
	-webkit-transition: all .7s;
}
