@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Poppins:wght@400;500;600;700;800&family=Karla:wght@500&display=swap');



* {margin:0; padding:0;}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, img, small,
strong, dl, dt, dd, ol, ul, li, form, label, table, caption, tr, th, td, article, aside, 
footer, header, nav, section, audio, video {font-size:100%; vertical-align:baseline; border:0; outline:0; background:transparent;}
article, aside, footer, header, nav, section, a, label {display:block;}
html, body {width:100%; height:100%;}
body {color:#666;font-size:75%;font-family:"Poppins", "Noto Sans JP", sans-serif;letter-spacing:0.1em;background: #f4f5ef;}
h1, h2, h3, h4, h5 {font-weight:normal;}
video, iframe {vertical-align:top;}
ol, ul {list-style:none;}
img {width:100%; height:auto; vertical-align:top;}
a {color:#666; text-decoration:none;}
a:hover {color:#F00;}
body.fixed {position:fixed;}


@media screen and (min-width:1024px) {
	body {font-size:88%;}
	a {transition:all 0.3s ease-in-out;}
	a:hover {opacity:0.3;}
}



/* input, select, textarea, button */
input, select, textarea, button {
	font-family:"Poppins", "Noto Sans JP", sans-serif;
	letter-spacing:0.1em;
	outline:none;
	vertical-align:top;
	border:1px solid #B8B8B8;
	border-radius:0;
	box-sizing:border-box;
	-webkit-appearance:none;
}



/* input */
input {
	width:100%;
	height:48px;
}

input::-webkit-input-placeholder {color:#B8B8B8;}
input::-moz-placeholder {color:#B8B8B8;}
input:-ms-input-placeholder {color:#B8B8B8;}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="url"]:focus {border:1px solid #175CE5 !important;}

input[type="submit"],
input[type="button"] {
	cursor:pointer;
	background:#F2F2F2;
}

input[type="submit"]:hover,
input[type="button"]:hover {border:1px solid #175CE5;}



/* select */
select {
	width:100%;
	height:48px;
}


@media screen and (min-width:1024px) {
	select {
		width:auto;
		cursor:pointer;
	}
}



/* textarea */
textarea {
	width:100%;
	height:100px;
	resize:vertical;
}

textarea::-webkit-input-placeholder {color:#B8B8B8;}
textarea::-moz-placeholder {color:#B8B8B8;}
textarea:-ms-input-placeholder {color:#B8B8B8;}



/* wrapper */
@media screen and (min-width:1024px) {
	#wrapper {background:url("../images/wrapper_bg.gif");background: #eef2eb;}
}



/* wrapper_inner */
@media screen and (min-width:1024px) {
	.wrapper_inner {
		width:1024px;
		margin:0 auto;
		padding:0 12px;
		background:url("../images/wrapper_inner_bg.png") right top / 100% 13px repeat-y;
		box-sizing:border-box;
	}
}



/* header */
#header {
	width:100%;
	top:0;
	left:0;
	position:fixed;
	z-index:999999999;
	background:url("../images/header_bg.gif") center top / cover no-repeat;
}


@media screen and (min-width:1024px) {
	#header {position:static;}
}



/* header_inner */
.header_inner {
	padding:6px 16px;
	display:flex;
	justify-content:space-between;
	align-items:center;
}


@media screen and (min-width:1024px) {
	.header_inner {padding:21px 48px;}
}



/* logo */
.logo {width:calc(100% - 48px);}

.logo a {
	display:inline-block;
	transition:none;
}

.logo a:hover {opacity:1;}

.logo a img {
	width:auto;
	height:60px;
}

.logo div span{
	color: #f5f5f5;
	padding-bottom: 3px;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝","Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}


@media screen and (min-width:1024px) {
	.logo {width:auto;}

	.logo a{ margin-left: 40px; }

	.logo a img {height:120px;}

	.logo div span{ font-size: 1.2rem; }
}



/* business_hours */
.business_hours {display:none;}


@media screen and (min-width:1024px) {
	.business_hours {
		color:#FFF;
		text-align:right;
		display:block;
	}

	.business_hours p:nth-of-type(1) {
		padding-right: 0;
		font-size: 200%;
		line-height:30px;
		background: url("../images/smartphone.svg") left center / 8% 100% no-repeat;
	}

	.business_hours p:nth-of-type(2) {
		margin-top:24px;
		font-size:150%;
		line-height:20px;
	}

	.business_hours p:nth-of-type(3) {
		margin-top:10px;
		font-size:130%;
		line-height:18px;
	}

}



/* menu_btn */
.menu_btn {
	width:48px;
	height:48px;
	position:relative;
	background:#ffffff38;
}

.menu_btn_close {margin-left:auto;}

.menu_btn span {
	width:24px;
	height:3px;
	border-radius:30px;
	display:block;
	left:12px;
	position:absolute;
	background:#f4f6f1;
	transition:all 0.3s ease;
}

.menu_btn span:nth-of-type(1) {top:16px;}
.menu_btn span:nth-of-type(2) {top:23px;}
.menu_btn span:nth-of-type(3) {top:30px;}

.menu_btn_active span {
	width:26px !important;
	top:23px !important;
	left:11px !important;
}

.menu_btn_active span:nth-of-type(1) {transform:rotate(45deg) !important;}
.menu_btn_active span:nth-of-type(2) {opacity:0 !important;}
.menu_btn_active span:nth-of-type(3) {transform:rotate(-45deg) !important;}


@media screen and (min-width:1024px) {
	.menu_btn {display:none;}
}



/* nav */
#nav {
	width:100%;
	height:100%;
	padding:16px;
	display:none;
	top:0;
	right:0;
	position:fixed;
	z-index:9999999999;
	background:rgba(255,255,255,0.6);
	box-sizing:border-box;
}

#nav ul {
	height:100%;
	-webkit-overflow-scrolling:touch;
	overflow-y:scroll;
}

#nav ul li {
	width:100%;
	margin-top:1px;
	background:#2a5629;
}

#nav ul li a {
	height:48px;
	color:#FFF;
	line-height:48px;
	text-align:center;
}

#nav ul li.current a {opacity:0.8;}


@media screen and (min-width:1024px) {
	#nav {
		height:auto;
		padding:0;
		display:block;
		position:static;
		background: #d8dfcb;
	}

	#nav ul {
		height:auto;
		display:flex;
		justify-content:center;
		-webkit-overflow-scrolling:auto;
		overflow-y:auto;
	}

	#nav ul li {
		width:auto;
		margin-top:0;
		background:url("../images/nav_li_line.gif") left center no-repeat;
	}

	#nav ul li:first-of-type {background:none;}

	#nav ul li a {
		height:56px;
		padding:0 22px;
		color: #000000;
		line-height:56px;
	}
}



/* container */
#container {
	padding-top:72px;
	background:#f4f5ef;
}


@media screen and (min-width:1024px) {
	#container {padding-top:0;}
}



/* contents */
#contents {background:#f4f6f1;}



/* article */
#article {
	padding:72px 16px 48px;
	background:url("../images/article_bg_sp.png") center top / auto 48px no-repeat;
}


@media screen and (min-width:1024px) {
	#article {
		padding:120px 48px 80px;
		background:url("../images/article_bg_pc.png") center top / auto 80px no-repeat;
	}
}



/* ttl */
.ttl {
	margin-bottom:24px;
	text-align:center;
	background:url("../images/ttl_line_bg.gif") left top 28px / 1px repeat-x;
}

.ttl span {
	padding:0 40px;
	display:inline-block;
	background:url("../images/ttl_span_right_bg.png") right center / auto 100% no-repeat, url("../images/ttl_span_left_bg.png") left center / auto 100% no-repeat;
}

.ttl span span {
	display:block;
	background:transparent;
}

.ttl span span:nth-of-type(1) {
	height:24px;
	padding:0 0 4px 0;
	font-size:200%;
	line-height:24px;
}

.ttl span span:nth-of-type(2) {
	height:12px;
	padding:8px 0 4px;
	line-height:12px;
}


@media screen and (min-width:1024px) {
	.ttl {
		margin-bottom:48px;
		background:url("../images/ttl_line_bg.gif") left top 38px / 1px repeat-x;
	}

	.ttl span {padding:0 56px;}

	.ttl span span:nth-of-type(1) {
		height:32px;
		padding:0 0 8px 0;
		font-size:229%;
		line-height:32px;
	}

	.ttl span span:nth-of-type(2) {
		height:14px;
		line-height:14px;
	}
}



/* footer */
#footer {
	padding: 40px 0 80px;
	background:#f4f5ef;
}


@media screen and (min-width:1024px) {
	#footer {padding:80px 0;}
}



/* footer_link */
.footer_link {
	margin-bottom:24px;
	text-align:center;
}

.footer_link a {display:inline-block;}



/* copyright */
.copyright {text-align:center;}

.copyright a {
	color:#666;
	display:inline-block;
	transition:none;
}

.copyright a:hover {opacity:1;}



/* contact__btn */
#contact_btn {
	width:100%;
	display:flex;
	left:0;
	bottom:0;
	position:fixed;
	z-index:999999999;
	background:url("../images/contact_btn_bg.gif") center top / cover no-repeat;
}

#contact_btn p {width:100%;}

#contact_btn p a {
	height:48px;
	color:#FFF;
	line-height:48px;
	text-align:center;
}

#contact_btn p span {
	height:20px;
	line-height:20px;
	display:inline-block;
}

#contact_btn p:first-of-type span {
	padding-left:20px;
	background:url("../images/smartphone.svg") left center / 11px 20px no-repeat;
}

#contact_btn p:last-of-type span {
	padding-left:28px;
	background:url("../images/line.svg") left center / 20px 20px no-repeat;
}


@media screen and (min-width:1024px) {
	#contact_btn {display:none !important;}
}