/*-----------------------

	font-family: "Roboto", sans-serif;
	font-family: "Montserrat", sans-serif;
	font-family: "Noto Serif JP", serif;
	font-family: "Noto Sans JP", sans-serif;

-----------------------*/

body{
	font-family:'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
	font-size: 100%;
	font-weight: 400;
	line-height: 1.8125;
	color: #3f3f3f;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

	@media screen and (min-width:1700px) {
		body{
			font-size: 112.5%;
		}
	}
	@media screen and (max-width:1000px) {
		body{
			font-size: 93.75%;
		}
	}
	@media screen and (max-width:860px) {
		br.tab-none{
			display: none;
		}
	}
	@media screen and (max-width:600px) {
		br.sp-none{
			display: none;
		}
	}


body.active{
	overflow: hidden;
	height: 100%;
}
a{
	color: #3f3f3f;
	text-decoration: none;
}
a[href^="tel:"] {
	pointer-events: none;
	cursor: default;
}
a.link{
	color: #256281;
	text-decoration: underline;
}
a.link-white{
	color: #fff;
	text-decoration: underline;
}
a.link-jump{
	color: #256281;
	text-decoration: underline;
	padding-right: 1.5em;
	background: url(../images/common/link-jump.png) no-repeat right .25em;
	background-size: 1em;
}
	@media screen and (max-width:860px) {
		a[href^="tel:"] {
			pointer-events: auto;
			cursor: pointer;
		}
	}

.inline-block{
	display: inline-block;
}
.overflow-x{
	overflow-x: hidden;
}

/* list */
.list-disc li{
	list-style-type: disc;
	list-style-position: outside;
	line-height: 1.5;
	margin-left: 1.375em;
	margin-top: .25em;
}

/*-----------------------
	Animation
-----------------------*/
@keyframes fv-fade-up {
	0% { 
		opacity: 0;
		transform: translateY(-1em);
	}
	100% { 
		opacity: 1; 
		transform: translateY(0);
	}
}
@keyframes fv-fade-slide {
	0% {
		opacity: 0; 
		transform: translateX(1em);
	}
	100% { 
		opacity: 1; 
		transform: translateX(0);
	}
}
.fadein{
	opacity : 0;
	transform: translateY(1.5em);
	transition : all 1.5s;
}
.fadein.scrollin{
	opacity : 1;
	transform: translateY(0);
}
.fade{
	opacity : 0;
	filter: blur(2px);
	transition : all 1.5s;
}
.fade.scrollin{
	filter: blur(0);
	opacity : 1;
}
.scale{
	opacity: 0;
	transform: scale(1.05);
	transition : all 1s;
	overflow: hidden;
}
.scale.scrollin{
	opacity : 1;
	transform: scale(1.0);
}
.svgscroll{
	opacity : .6;
	filter: blur(2px);
	transition : all 1s;
}
.svgscroll.scrollin{
	opacity : 1;
	filter: blur(0);
}

/*-----------------------
	header / main
-----------------------*/
#base--section{
	position: relative;
	margin: 2rem 5% 0;
	display: flex;
	flex-wrap: wrap;
}
	@media screen and (max-width:1200px) {
		#base--section{
			margin-right: 3%;
			margin-left: 3%;
		}
	}
	@media screen and (max-width:860px) {
		#base--section{
			margin-right: 5.5%;
			margin-left: 5.5%;
			display: block;
			margin-top: 0;
		}
	}
	@media screen and (max-width:600px) {
		#base--section{
			margin-right: 4.5%;
			margin-left: 4.5%;
			display: block;
			margin-top: 0;
		}
	}
#header{
	width: calc(100% - 82%);
	padding-right: 2.5%;
}
#header h1{
	max-width: 200px;
	margin: 1em 0 1.5em;
	animation: fv-fade-up 1.2s ease 0s 1 normal forwards;
	opacity: 0;
}
.header-nav li{
	animation: fv-fade-slide 1.2s ease .8s 1 normal forwards;
	opacity: 0;
}
.header-nav a{
	display: inline-block;
	color: #745e46;
}
#main{
	width: 82%;
}

	@media screen and (max-width:860px) {
		#header{
			width: 100%;
		}
		#header h1{
			max-width: 120px;
			margin: .5em 0 .25em 0;
		}
		.header-nav{
			display: none;
		}
		#main{
			width: 100%;
		}
	}

/*-----------------------
	humbergermenu
-----------------------*/
.hamburger-icon{
	position: fixed;
	top: 2.5%;
	right: 2.5%;
	display: flex;
	width: 4.25vw;
	height: 4.25vw;
	justify-content: center;
	align-items: center;
	background-color: #745e46;
	border-radius: 50%;
	z-index: 101;
}
	@media screen and (max-width:1200px) {
		.hamburger-icon{
			width: 62px;
			height: 62px;
			top: 1.5%;
			right: 1.5%;
		}
	}
	@media screen and (max-width:860px) {
		.hamburger-icon{
			width: 58px;
			height: 58px;
			top: .5em;
			right: .75em;
		}
	}

.hamburger-icon span,
.hamburger-icon span::before,
.hamburger-icon span::after{
	content: "";
	display: block;
	height: 3px;
	width: 33px;
	border-radius: 3px;
	background-color: #ffffff;
	position: absolute;
	transition: .2s all;
}
.hamburger-icon span:before {
	bottom: 8px;
}
.hamburger-icon span:after {
	top: 8px;
}
#nav-check{
	display: none;
}
#nav-check:checked ~ .hamburger-icon{
	background-color: #b8a658;
}
#nav-check:checked ~ .hamburger-icon span{
	background-color: rgba(255, 255, 255, 0);
}
#nav-check:checked ~ .hamburger-icon span::before{
	bottom: 0;
	transform: rotate(45deg);
}
#nav-check:checked ~ .hamburger-icon span::after{
	top: 0;
	transform: rotate(-45deg);
}

.overlay{
	opacity: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .15);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 0;
	visibility:hidden;
	transition: .2s all;
	z-index: 100;
}
.overlay nav{
	background: #745e46;
	border-radius: 0 0 0 4em;
	width: 400px;
	height: auto;
	position: fixed;
	top: 0;
	left: 100%;
	transition: .4s left;
	overflow-y: scroll;
	padding-bottom: 3em;
}
#nav-check:checked ~ .overlay {
	opacity: 1;
	visibility: visible;
}
#nav-check:checked ~ .overlay nav {
	left: calc(100% - 400px);
}
.overlay ul{
	padding: 5.25em 60px 2em;
}
.overlay ul li{
	margin-bottom: 1em;
	font-size: 1.125rem;
}
.overlay ul a{
	color: #fff;
	font-weight: 500;
	transition: .2s all;
}
.overlay ul a:hover{
	color: #b8a658;
}
.nav-telephone{
	border-top: 1px solid #93826f;
	margin: 0 60px;
	padding-top: .5em;
	font-family: "Roboto", sans-serif;
	color: #fff;
	text-align: center;
}
.nav-telephone a{
	color: #fff;
	font-size: 2em;
	margin-left: .25em;
}
	@media screen and (max-width:860px) {
		.overlay nav{
			width: 240px;
		}
		#nav-check:checked ~ .overlay nav {
			left: calc(100% - 240px);
		}
		.overlay ul{
			padding: 4.75em 10% 1.5em 10%;
		}
		.overlay ul li{
			margin-bottom: .75em;
			font-size: 1rem;
		}
		.nav-telephone{
			margin: 0 10%;
		}
		.nav-telephone a{
			font-size: 1.5em;
		}
	}
/*-----------------------
	fixed
-----------------------*/
#fixed-tel{
	position: fixed;
	bottom: 1.25em;
	right: 1.25em;
	font-family: "Roboto", sans-serif;
	font-size: 1.25em;
	background: #496357;
	padding: .5em 2em;
	border-radius: 5em;
	z-index: 10;
	letter-spacing: 1px;
	opacity: 0;
	box-shadow: 0 .25em .5em .25em rgba(0, 0, 0, .1);
}

#fixed-tel a{
	color: #fff;
}
	@media screen and (max-width:860px) {
		#fixed-tel{
			padding: .5em 1.25em;
			bottom: .75em;
			right: .5em;
			font-size: 1.125em;
		}
	}

#fixed-tel.display{
	animation: fv-fade-up 1s ease 0s 1 normal forwards;
}


/*-----------------------
	footer
-----------------------*/
footer{
	background: #745e46;
	font-family: "Roboto", sans-serif;
	font-size: .75em;
	color: #fff;
	text-align: center;
	padding: 1.5em 5% 3em;
}
/*
-----------------------
 土台 
-----------------------*/
.sect-std{
	max-width: 1160px;
	width: 88%;
	margin:0 auto;
	padding: 3.25em 0 4em;
}
.sect-small{
	max-width: 880px;
	width: 88%;
	margin:0 auto;
	padding: 3.25em 0 4em;
}
.padding-bottom{
	padding-bottom: 2.25em;
}
	@media screen and (min-width:1700px) {
		.sect-std{
			max-width: 1366px;
		}
		.sect-small{
			max-width: 1160px;
		}
	}
	@media screen and (max-width:860px) {
		.sect-std,
		.sect-small{
			padding: 2.5em 0 2.25em;
		}
	}

.read-body{
	max-width: 1020px;
	line-height: 1.75;
}

	@media screen and (min-width:1700px) {
		.read-body{
			max-width: 1120px;
		}
	}

.sect-inner{
	margin-bottom: 3.75em;
}


/*
-----------------------
 flex 
-----------------------*/
.flex{
	display: flex;
	flex-wrap: wrap;
}
.between{
	justify-content: space-between; 
}
.row-reverse{
	flex-direction: row-reverse;
}
.flex-end{
	align-items: flex-end;
}

/* dl 
-----------------------*/
.dl-2clm{
	display: flex;
	flex-wrap: wrap;
	line-height: 1.875;
}
.dl-2clm dt{
	width: 7em;
	margin-bottom: .25em;
}
.dl-2clm dd{
	width: calc(100% - 7em);
	margin-bottom: .25em;
}

/*
-----------------------
 mt 
-----------------------*/
.mtxxl{
	margin-top: 5em;
}
.mtxl{
	margin-top: 4em;
}
.mtl{
	margin-top: 3em;
}
.mt{
	margin-top: 2em;
}
.mts{
	margin-top: 1.25em;
}
.mtxs{
	margin-top: .5em;
}

/*
-----------------------
 icon
-----------------------*/
.point-maru{
	font-weight: 600;
	padding-left: 1.5em;
	position: relative;
}
.point-maru:before{
	position: absolute;
	top: .625em;
	left: 0;
	width: .5em;
	height: .5em;
	border-radius: 50%;
	border: 3px solid;
	content: "";
}
/*
-----------------------
 box
-----------------------*/
.bgbox-white{
	background: #fff;
	padding: 2.25em 3em;
}
.kakumaru{
	border-radius: 2.25em;
}
.kakumaru-small{
	border-radius: 1.25em;
}
	@media screen and (max-width:1000px) {
		.bgbox-white{
			background: #fff;
			padding: 2em 2.25em;
		}
	}
	@media screen and (max-width:600px) {
		.bgbox-white{
			padding: 1.75em;
		}
	}

/*
-----------------------
 font
-----------------------*/
.em{
	font-weight: bold;
}
.em500{
	font-weight: 500;
}
.brown{
	color: #745e46;
}
.midori{
	color: #496357;
}
.red{
	color: #c82d4b;
}
.marker{
	background: linear-gradient(transparent 80%, #ffe68c 10%);
}
.min{
	font-family: "Noto Serif JP", serif;
}
.roboto{
		font-family: "Roboto", sans-serif;
}
.xxx-large{
	font-size: 1.375em;
}
.xx-large{
	font-size: 1.25em;
}
.x-large{
	font-size: 1.125em;
}
.large{
	font-size: 1.0625em;
}
.medium{
	font-size: .9375em;
}
.small{
	font-size: .875em;
}
.x-small{
	font-size: .75em;
}
	@media screen and (max-width:860px) {
		.sp-txt-c{
			text-align: center;
		}
		.xxx-large{
			font-size: 1.333333333em;
		}
		.xx-large{
			font-size: 1.2em;
		}
		.x-large{
			font-size: 1.13333333em;
		}
		.large{
			font-size: 1.066666666em;
		}
		.medium{
			font-size: .933333em;
		}
		.clm2-shinryo .x-large{
			font-size: 1.066666666em;
		}

	}

.sect-tit{
	line-height: 1.2;
}
.sect-tit .eng-small{
	color: #cbba9f;
	font-size: 2.5em;
	font-weight: 100;
	font-family: "Montserrat", sans-serif;
}
.sect-tit .eng-large{
	color: #cbba9f;
	font-size: 5.4375em;
	font-weight: 100;
	font-family: "Montserrat", sans-serif;
}
#checkup .sect-tit .eng-large{
	color: #cab99d;
}
.sect-tit .ja{
	color: #a98c5f;
	font-size: 2.25em;
}
.tategaki-lr{
	-ms-writing-mode: tb-lr;
	writing-mode: vertical-lr;
}
.tategaki-rl{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}
	@media screen and (max-width:1200px) {
		.sect-tit .eng-large{
			font-size: 4.25em;
		}
	}
	@media screen and (max-width:860px) {
		.tategaki-lr,
		.tategaki-rl{
			-ms-writing-mode:lr-tb;
			writing-mode:horizontal-tb;
		}
		.sect-tit .eng-large{
			font-size: 2.66666666667em;
		}
		.sect-tit .eng-small{
			font-size: 1.6em;
			line-height: 1;
		}
		.sect-tit .ja{
			font-size: 1.75em;
		}
	}

.copy-min{
	color: #745e46;
	font-size: 1.75em;
	font-family: "Noto Serif JP", serif;
	line-height: 1.875;
	letter-spacing: 1px;
}
.copy-min-white{
	color: #fff;
	font-size: 1.6875em;
	font-family: "Noto Serif JP", serif;
	line-height: 1.875;
	letter-spacing: 1px;
}
.copy-min-medium{
	color: #745e46;
	font-size: 1.5em;
	font-family: "Noto Serif JP", serif;
	line-height: 1.75;
}

.copy-min-small{
	font-size: 1.125em;
	font-family: "Noto Serif JP", serif;
	line-height: 1.75;
}

	@media screen and (max-width:1000px) {
		.copy-min,
		.copy-min-white{
			font-size: 1.6em;
		}
		.copy-min-medium{
			font-size: 1.333333333em;
		}
	}
	@media screen and (max-width:860px) {
		.copy-min,
		.copy-min-white{
			font-size: 1.33333333333em;
		}
		.copy-min-medium{
			font-size: 1.2em;
		}
	}
	@media screen and (max-width:600px) {
		.copy-min-small{
			font-size: 1.0666666666em;
		}
	}
	/*
	@media screen and (max-width:860px) {
		.copy-min,
		.copy-min-white{
			font-size: 1.33333333333em;
			line-height: 2;
		}
	}
	@media screen and (max-width:480px) {
		.copy-min-small{
			font-size: 1em;
		}
	}
	*/

.komidashi-encl{
	font-weight: bold;
	color: #745e46;
	background: #eee8df;
	padding: .5em 1em;
	border-radius: .25em;
}
.komidashi-btm-line{
	font-size: 1.125em;
	font-weight: 600;
	line-height: 1.4;
	border-bottom: 1px solid;
	padding-bottom: .25em;
	margin-bottom: .75em;
}
.large-btmside-line{
	font-size: 1.0625em;
	font-weight: 600;
	line-height: 1.4;
	border-bottom: 1px solid;
	border-left: 7px solid;
	padding-bottom: .75em;
	padding-left: .75rem;
	margin-bottom: 1em;
}

.section-midashi{
	font-size: 2.125em;
	line-height: 1.5;
	color: #745e46;
	letter-spacing: 2px;
	border-left: 9px solid #b8a658;
	padding-left: 1rem;
	margin-bottom: .75em;
}
	@media screen and (max-width:860px) {
		.section-midashi{
			font-size: 1.8125em;
		}
	}
	@media screen and (max-width:480px) {
		.section-midashi{
			font-size: 1.5em;
			font-weight: bold;
		}
	}



