@charset "utf-8";
/*-----------------------------------------------------
Reset
----------------------------------------------------- */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul { list-style: none; line-height: 1; }
table { border-collapse: collapse; border-spacing: 0; }

* { margin: 0; padding: 0; }
img { max-width: 100%; width: 100%; height: auto; vertical-align: top; image-rendering: -webkit-optimize-contrast; }

* { min-height: 0; min-width: 0; }

html { font-size: 62.5%; }
body { line-height: 1; margin: 0; padding: 0; height: 100%; font-family: 'Shippori Mincho', serif , 'Zen Kaku Gothic New', sans-serif; letter-spacing : 0.1em; color: #3a3a3a; }
a {	text-decoration: none; color: inherit; transition: 0.3s ease-in-out; }
@media (min-width: 1025px) {
	a[href*="tel:"] { pointer-events: none; cursor: default; text-decoration: none;}
}
p , div { text-align: justify; }
p { font-size: 1.6rem; line-height: 2.8rem; font-weight: 600; }
h1 , h2 , h3 , h4 { font-weight: 600; } 
button { margin: 0; padding: 0; outline: 0; border: 0; border-radius: 0; color: inherit; vertical-align: middle; text-align: inherit;font: inherit; -webkit-appearance: none; appearance: none; }

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

common

-----------------*/
.btn_gra { font-size: 2rem; font-weight: 700; position: relative; display: inline-block; cursor: pointer; -webkit-transition: all 0.3s; transition: all 0.3s; text-align: center; vertical-align: middle; color: #fff;background:rgb(184,210,0); background:linear-gradient(45deg, rgba(167, 191, 0, 0.5) 10%, rgba(167 ,191, 0, 0.8) 54%, rgb(167 191 0) 100%); border-radius: 50px; padding: 20px 30px; box-sizing: border-box; }
.tel_btn .btn_gra:before { content: ''; background: url("../images/icon_phone.png") no-repeat; background-size: contain; width: 26px; height: 24px; display: inline-block; margin-right: 10px; vertical-align: -4px; }
.btn_gra:before { content: ''; background: url("../images/icon_mail.png") no-repeat; background-size: contain; width: 26px; height: 24px; display: inline-block; margin-right: 10px; vertical-align: -4px; }
.btn_gra:hover { transform: scale(0.9); box-shadow: 0px 0px 10px 5px #dfe49d; }
.tel_btn figure img { display: block; margin-top: 10px; }

.contents_wrapper { max-width: 1200px; width: 90%; margin: 0 auto; }
.marker { background: linear-gradient(transparent 60%,#FAEA5F 60%); }
[data-size="w820"]{ max-width: 820px; width: 90%; margin: 0 auto; }
[data-bg="head_bg"]::before{ content: ''; display: block; z-index: -1; background: url("../images/head_bg.png")no-repeat; background-size: contain; width: 200px; height: 163px; position: absolute; top: 30px; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
[data-color="red"]{ color: #ee6758; }
[data-color="pink"]{ color: #ee6758; }
.pc { display: block; }
.tab { display: none; }
.sp { display: none; }
span.annotation { font-weight: 400; }

.topicpath { width: 100%; background: #F7F7F7; height: 50px; display: flex; align-items: center; }
.topicpath ul { padding: 0 5%; display: flex; justify-content: flex-start; font-size: 1.6em; }
.topicpath li + li::before { content: "▶︎"; color: #147CCC; display: inline-block; margin: 0 0.5em; }

.pagetop { position: absolute; right: 100px; top: -40px; max-width: 70px; width: 100%; }


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

header

-----------------*/
.bg::before { content: ''; display: block; background: url("../images/top_bg01.png")no-repeat; background-size: contain; position: absolute; top: 0; left: 0; width: 50%; height: 100%; z-index: -1; }
.bg::after { content: ''; display: block; background: url("../images/top_bg02.png")no-repeat; background-size: contain; position: absolute; top: 0; right: 0; width:35%; height: 100%; z-index: -1; background-position: top right; }

header { position: fixed; width: 100%; z-index: 999; }
header h1 { max-width:380px; width: 100%; margin-right: 30px; }
header .header_wrapper { display: flex; align-items: center; justify-content: space-between; padding: 0 3%; box-sizing: border-box; margin-top: 15px; }
header .nav_wrapper ul { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; }
header .nav_item span { display: block; color: #147CCC; font-family: 'Roboto Condensed', sans-serif; font-size: 1.4rem; }
header li.nav_item { text-align: center; font-size: 1.8em; font-weight: 600; }
header li.nav_item:hover { color: #ee6758; }
header li.nav_item:not(:last-child) { margin-right: 25px; }
header .nav-wrapper { display: flex; align-items: center; }
header .burger-btn { display: none; }
header .menu_area { display: flex; flex-direction: column; justify-content: space-between; align-items: center; }
header .btn_area { display: flex; justify-content: center; align-items: center; margin-bottom: 10px; margin-left: auto; }
header a.tel { color:#a9b505; font-size: 4em; font-weight: 600; margin-right: 25px; background: none; }
header a.tel img { margin-top: 10px; }
header a.tel::before { content: ''; display: inline-block; background: url("../images/icon_tel.png")no-repeat; width: 22px; height: 22px; background-size: contain; margin-right: 10px; }
header.change-color { background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 35%, rgba(255,255,255,1) 100%); transition: 0.3s; height: 200px; }

/*LPページのみヘッダー・横・フッター変更*/
body.lp .header{ display:none; }
body.lp .main{ margin-top:0; }
body.lp .floating-contact, body.lp .footer{ display:none; }/*footer*/
body.lp .contactArea, body.lp .floating-request{ display:none; }/*flex-右*/
/*----------------

footer

-----------------*/
footer { position: relative; padding: 100px 0 70px; border-top: 2px solid; border-image-source: linear-gradient(90deg, rgba(201,238,118,1) 0% , rgba(75,198,94,1) 100%); border-image-slice: 1; }
footer::before { position: absolute; content: ''; display: block; background: url("../images/bottom_bg01.png")no-repeat; background-size: contain; bottom: 0; left: 0; width: 50%; height: 100%; background-position: left bottom; z-index: -1; }
footer::after { position: absolute; content: ''; display: block; background: url("../images/bottom_bg02.png")no-repeat; background-size: contain; bottom: 0; right: 0; width: 40%; height: 50%; background-position: bottom right;  z-index: -1; }
footer .logo { max-width: 286px; width: 100%; margin-right: 34px; }
footer .logo_area { display: flex; justify-content: space-between; }
footer .tel_wrap .txt_wrap p.catch { font-size: 1.8em; color: #3A3A3A; font-weight: 700; }
footer .tel_wrap .txt_wrap p:not(.catch) { font-size: 4.2em; margin: 10px 0; }
footer .tel_wrap .txt_wrap span.box { font-size: 1.6rem; color: #fff; padding: 2px 10px; background: #7EB9E6; font-weight: 400; }
footer .tel_wrap .txt_wrap p:not(.catch)::before { width: 30px; height: 29px; }
footer .tel_wrap .txt_wrap span { font-size: 2.2rem; }

footer nav ul { display: flex; justify-content: space-between; line-height: 1.5; font-size: 1.8em; font-weight: 600; white-space: nowrap; z-index: 1; position: relative; }
footer nav ul li:not(:last-child) { margin-bottom: 24px; margin-right: 10px; }
footer figure { display: block; max-width: 280px; margin: 0 auto 30px;}
small { display: block; text-align: center; font-size: 1.2em; }
.floating-banner { display: none; }


@media screen and (max-width: 1320px) {
	header li.nav_item { font-size: 1.5em; }
	header li.nav_item:not(:last-child) { margin-right: 15px; }
}

@media screen and (max-width: 1143px) {
	header li.nav_item:not(:last-child) { margin-right: 10px; }
}

@media screen and (max-width: 1112px) {
	.tab { display: block; }
	.btn_gra { font-size: 1.8rem; }
	header .burger-btn { display: block; width: 50px; height: 50px; position: fixed; z-index: 3; border:none; cursor: pointer; right: 30px; top: 35px; }
	header .menu_area { position: relative; bottom: -10px; right: 5vw; }
	header h1 { width: 30%; }
	header .btn_area { margin-bottom: 0; }
	header .burger-btn span { width: 40px; height: 2px; display: block; position: absolute; right: 0; background-color: #599b2b; }
	header .burger-btn span:first-child { top: 20%; }
	header .burger-btn span:nth-child(2) { top: 40%; width: 30px; }
	header .burger-btn span:nth-child(3) { top: 60%; }
	header .burger-btn span:last-child { bottom: 17%; width: 30px; }
	header .burger-btn.close span:first-child { transform: translate(0%,10px) rotate(45deg); transition: transform .3s; top: 9px; } 
	header .burger-btn.close span:nth-child(2n) { opacity: 0; transition: opacity .3s; }
	header .burger-btn.close span:nth-child(3) { transform: translate(0%,10px) rotate(-45deg); transition: transform .3s; top: 18%; }
	header .burger-btn.close span:last-child { transform: translate(0%,10px) rotate(-45deg); transition: transform .3s; top: 9px; }
	header .nav_wrapper{ height: 100vh; position: fixed; top: 0; width: 100%; z-index: 2; background: linear-gradient(90deg, rgba(247,243,247,1) 0%, rgba(247,243,236,1) 100%); opacity: 0; visibility: hidden; right: 0; transition: 0.3s ease-in-out; padding: 0 3%; margin-right: 0; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }
	header li.nav_item:not(:last-child) { margin-bottom: 50px; margin-right: 0; }
	header .nav_wrapper ul { flex-direction: column; }
	header .nav_item span { margin-bottom: 5px; }
	header .nav_wrapper.slide-in { opacity: 1; visibility: visible; }
/*	header .tel_wrap , header .btn{ display: none; }*/
	header a.tel { font-size: 3em; margin-right: 10px; width: 40%; }
	
	header .logo_ham { display: flex; align-items: center; width: 100%; margin-bottom: 50px; height: 93px; }
	header .logo_ham img { max-width: 189px; width: 100%; }
	#Ex .ex_wrap .item span { font-size: 2rem; }
	
	.contact_area .btn_wrap .tel_btn a.btn_gra , .contact_area .btn_wrap .siryo_btn a.btn { width: 100%; margin: 0 auto; }
}

@media screen and (max-width: 960px) {
	.pc { display: none; }
	.sp { display: block; }
	header .btn_area { display: none; }
}

@media screen and (max-width: 840px) {
	footer nav ul { font-size: 1.5em }
	footer nav ul { flex-direction: column; margin-bottom: 50px; }
}

@media screen and (max-width: 600px) {
	header h1 { width: 55%; }
	header .burger-btn { top: 25px; }
	.pagetop { right: 20px; }
	header.change-color { height: 120px; }
}

@media screen and (max-width: 414px) {
	header .burger-btn { top: 15px; right: 3%; }
}