@charset "UTF-8";

:root {
	--black:#373746;
	--green1:#8CDB8A;
	--green2:#CFF082;
	--green3:#3B9F64;
	--green4:#2B826D;
	--green_grad:linear-gradient(90deg,rgba(130, 210, 110, 1) 0%, rgba(50, 150, 140, 1) 100%);
}

/*-------------------------
__base_style
-------------------------*/
body,input,textarea,select,button{font-family: "Zen Old Mincho", sans-serif;font-weight: 200;color:var(--black);}
h1{}
@media screen and (min-width: 768px) {
	.sph_on{ display: none;}
}
@media screen and (max-width: 767px) {
body.menu_open{overflow: hidden;}
}
/*-------------------------
__header
-------------------------*/
#header{ z-index: 999; position: fixed; top: 0; width: 100%;}
#header .header_inner{ display: flex; justify-content: space-between; align-items: center; margin: 0 auto; padding: 20px 50px; box-sizing: border-box; height: 93px; background: #fff;}
#header .header_inner .logo{ transition: .2s; width: 230px;}
#header .header_inner .logo a{ width: 100%; height: 100%;}
#header .header_inner .logo a img{ width: 100%; height: auto;}
#header .header_inner #navi ul{ display: flex; align-items: center; gap: 40px;}
#header .header_inner #navi ul li{ font-size: 12px; text-align: left;}
#header .header_inner #navi ul li a{ font-size: 17px; text-decoration: none; color: var(--black); transition: .2s;}
#header .header_inner #navi ul li a span{ font-size: 19px;}
#header .header_inner #navi ul li.contact{ background: var(--green_grad); transition: .2s;}
#header .header_inner #navi ul li.contact a{ padding: 18px 36px; display: block; color: #fff;}
#header .header_inner #navi ul li .add{ display: block; margin-bottom: 5px;}
#header .header_inner #navi ul li .add br{ display: none;}

#header .header_inner .ham_menu{ background: var(--green_grad); position: fixed; right: 20px; top: 15px; display: block; width: 43px; height: 43px; z-index: 999;}
#header .header_inner .ham_menu span{ background: #FFF;}
#header .ham_menu span { display: block; width: 22px; height: 1px; background: #2c2c2c; position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%); transition: transform 0.3s;}
#header .ham_menu span:nth-of-type(2) { top: 50%;}
#header .ham_menu span:nth-of-type(3) { top: 60%;}

body.menu_open #header .ham_menu span { transform: translate(-50%, -50%) rotate(20deg); top: 50%;}
body.menu_open #header .ham_menu span:nth-of-type(2) { opacity: 0;}
body.menu_open #header .ham_menu span:nth-of-type(3) {  transform: translate(-50%, -50%) rotate(-20deg); top: 50%;}

@media screen and (min-width: 768px) {
	#header .header_inner .logo:hover{ opacity: .8;}
	#header .header_inner .ham_menu{ display: none;}
	#header .header_inner #navi ul li a.tel{ pointer-events: none;}
	#header .header_inner #navi ul li:not(.contact) a:not(.tel):hover{ color: var(--green1);}
	#header .header_inner #navi ul li.contact:hover{ filter: brightness(1.2);}
}
@media screen and (max-width: 1199px) {
	#header .header_inner #navi ul{ gap: 20px;}
	#header .header_inner #navi ul li a{ font-size: 15px;}
	#header .header_inner #navi ul li a span{ font-size: 17px;}
	#header .header_inner #navi ul li.contact a{ padding: 18px 20px;}
}
@media screen and (max-width: 999px) {
	#header .header_inner{ padding: 20px;}
	#header .header_inner .logo{ width: 180px;}
	#header .header_inner #navi ul{ gap: 15px;}
	#header .header_inner #navi ul li a{ font-size: 14px;}
	#header .header_inner #navi ul li a span{ font-size: 16px;}
	#header .header_inner #navi ul li.contact a{ padding: 18px;}
	#header .header_inner #navi ul li .add br{ display: block;}
}
@media screen and (max-width: 767px) {
	#header .header_inner{ padding: 10px 20px; height: 73px;}
	#header .header_inner #navi { position: fixed; height: calc(100vh - 73px); top: 73px; left: 0; right: 0; bottom: 0; width: 100%; background: var(--black); z-index: 888; visibility: hidden; display: flex; justify-content: center; align-items: center; opacity: 0; transition: visibility 0.3s, opacity 0.3s; overflow-y: scroll;}
	.menu_open #header .header_inner #navi { visibility: visible; opacity: 1}

	#header .header_inner #navi ul{ flex-wrap: wrap; justify-content: center; gap: 10px;}
	#header .header_inner #navi ul li{ width: 100%; color: #fff; text-align: center;}
	#header .header_inner #navi ul li a{ font-size: 14px; color: #fff; display: block; padding: 20px 0;}
	#header .header_inner #navi ul li.contact{ background: none;}
	#header .header_inner #navi ul li .add{ display: none;}
	#header .header_inner #navi ul li br{ display: none;}
	#header .header_inner #navi ul li.contact a{ padding: 20px 0;}
}

/*-------------------------
__content
-------------------------*/
.topic_path{clear:both; max-width: 1100px; margin: 0 auto; padding: 0 50px; box-sizing: border-box; position: absolute; top: 260px; left: 50px;}
.topic_path ul{width:100%;text-align:left;text-shadow: 0px 0px 5px rgba(55, 55, 70, .8), 0px 0px 10px rgba(55, 55, 70, .8);}
.topic_path li{font-size:1.4em;line-height:1.4;font-weight:900;color:#fff;vertical-align:top;display:inline-block;}
.topic_path li:before{content:">";color:#fff;font-weight:900;margin-left:5px;margin-right:5px;}
.topic_path li:first-child:before{content:"";margin:0;}
.topic_path li a{font-weight:900;color:var(--green1);text-decoration:underline;}
.topic_path li a:hover{text-decoration:none;}

.conf .topic_path,
.rgst .topic_path{ position: relative; top: 0; left: 0;}
.conf .topic_path ul,
.rgst .topic_path ul{text-shadow: none;}
.conf .topic_path li,
.rgst .topic_path li{;color:#000;}
.conf .topic_path li:before,
.rgst .topic_path li:before{color:#000;}


#content #main{display:block;}
@media screen and (max-width: 767px) {
	.topic_path{ padding: 0 20px; top: 190px; left: 20px;}
}
/*-------------------------
__footer
-------------------------*/
#footer{ padding: 100px 0 65px; box-sizing: border-box; border-top: 1px solid var(--black);}
#footer .footer_inner{ margin: 0 auto; padding: 0 50px; box-sizing: border-box;}
#footer .footer_inner .footer_top{ display: flex; justify-content: center; align-items: center; gap: 40px; margin-bottom: 110px;}
#footer .footer_inner .footer_top .logo{ width: 340px; transition: .2s;}
#footer .footer_inner .footer_top .logo a{ display: block;}
#footer .footer_inner .footer_top .logo a img{ width: 100%; height: auto;}
#footer .footer_inner .footer_top .tel{ font-size: 20px; color: var(--black); text-decoration: none;}
#footer .footer_inner .footer_top .tel span{ font-size: 30px;}
#footer .footer_inner ul{ margin-bottom: 100px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 40px;}
#footer .footer_inner ul li{}
#footer .footer_inner ul li a{ font-size: 19px; text-decoration: none; color: var(--black); transition: .2s;}
#footer .footer_inner .copy{ font-size: 17px;}
.re_top{ position: fixed; bottom: 0; right: 0; background: var(--black); z-index: 999; display: none;}
.re_top a{ display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; position: relative; color: #fff; font-size: 12px; text-decoration: none; padding-top: 15px; box-sizing: border-box; transition: .3s;}
.re_top a::before{ position: absolute; top: -10px; bottom: 0; margin: auto; content: ""; vertical-align: middle; left: 50%; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: translateX(-50%) rotate(-45deg); transform: translateX(-50%) rotate(-45deg);}

@media screen and (min-width: 768px) {
	#footer .footer_inner .footer_top .logo:hover{ opacity: .8;}
	#footer .footer_inner .footer_top .tel{pointer-events: none;}
	#footer .footer_inner ul li a:not(.tel):hover{ color: var(--green1);}
	.re_top a:hover{ background: var(--green4);}
}
@media screen and (max-width: 999px) {
	#footer{ padding: 70px 0 50px; }
	#footer .footer_inner{ padding: 0 20px;}
	#footer .footer_inner .footer_top{ display: flex; justify-content: center; align-items: center; gap: 40px; margin-bottom: 80px;}
	#footer .footer_inner .footer_top .logo{ width: 240px;}
	#footer .footer_inner .footer_top .tel{ font-size: 16px;}
	#footer .footer_inner .footer_top .tel span{ font-size: 24px;}
	#footer .footer_inner ul{ margin-bottom: 80px; gap: 20px;}
	#footer .footer_inner ul li a{ font-size: 16px;}
	#footer .footer_inner .copy{ font-size: 14px;}	
}

@media screen and (max-width: 767px) {
#footer{ padding: 50px 0;}
#footer .footer_inner .footer_top{ flex-wrap: wrap; gap: 20px; margin-bottom: 50px;}
#footer .footer_inner .footer_top div{ width: 100%; display: block;}
#footer .footer_inner ul{ margin-bottom: 50px; flex-wrap: wrap;}
#footer .footer_inner ul li{ width: 100%;}	
}



/*-------------------------
__error
-------------------------*/
.notfound404 .inner{ max-width: 1100px; padding: 0 50px; box-sizing: border-box; margin: 0 auto;}
.notfound404 #block01{ margin: 93px auto 100px;}
.notfound404 #block01 .bg{ width: 100%; height: 360px; overflow: hidden; padding: 100px 50px 0; box-sizing: border-box; margin-top: -100px;}
.notfound404 #block01 .bg img { width: 100%; height: 100%; object-fit: cover;}
.notfound404 #block01 .blo_ttl_wrap{ padding: 80px 0; box-sizing: border-box; background: #fff; margin: -60px 100px 0; z-index: 99; position: relative;}
.notfound404 #block01 .blo_ttl_wrap .sec_ttl{ font-size: 20px; position: relative; line-height: 1.6;}
.notfound404 #block01 .blo_ttl_wrap .sec_ttl::before{ position: absolute; content: ""; width: 13px; height: 13px; border-radius: 50%; top: -30px; left: 50%; transform: translateX(-50%); background: var(--green1);}
.notfound404 #block01 .blo_ttl_wrap .sec_ttl .en{ font-size: 47px;}

.notfound404 .inner .err_main_txt{font-size: 20px;margin-bottom: 20px;line-height: 1.6;}
.notfound404 .inner .err_txt{ font-size: 16px; margin-bottom: 10px;line-height: 1.6;}
.notfound404 .inner .err_txt a{color: var(--green1);}

@media screen and (max-width:767px) {
	.notfound404 .inner{ padding: 0 20px;}
	.notfound404 #block01{ margin: 73px auto 50px;}
	.notfound404 #block01 .bg{ height: 270px; padding: 73px 20px 0; margin-top: -73px;}
	.notfound404 #block01 .blo_ttl_wrap{ padding: 50px 0; margin: -50px 40px 0;}
	.notfound404 #block01 .blo_ttl_wrap .sec_ttl{ font-size: 16px;}
	.notfound404 #block01 .blo_ttl_wrap .sec_ttl::before{width: 10px; height: 10px;top: -20px;}
	.notfound404 #block01 .blo_ttl_wrap .sec_ttl .en{ font-size: 28px;}
	.notfound404 .inner .err_main_txt{text-align: left;}
	.notfound404 .inner .err_txt{text-align: left;}
	.notfound404 .inner .err_txt br{display: none;}
}
@media screen and (max-width:374px) {
	.notfound404 #block01 .blo_ttl_wrap .sec_ttl .en{ font-size: 24px;}
}