/* common
********************************/
body {background-color: #efefef}
.wrapper {width: 100%;margin: 0 auto;background-color: #fff}
.wrap {width:calc(100% - 3em);margin: 0 auto;max-width: 1200px}
.wrap:after {content: '';display: block;clear: both}
.container {width: 100%;clear: both;margin: 0;overflow: hidden}
.section {padding: 5em 0}
.section--padding-none {padding: 0}
.show-pc {display: block !important}
.show-mb {display: none !important}
@media screen and (max-width: 768px) {
	.show-pc {display: none !important}
	.show-mb {display: block !important}
	.section {padding: 3em 0}
}

/**   header    **/
.header {z-index: 300;position: fixed;top: 0;left: 0;display: block;clear: both;width: 100%;height: 90px;transition:height 300ms, background 300ms;background-color: transparent;color: #fff;}
.header .wrap {display: flex;flex-wrap: wrap;align-items: center;height: 100%}
.header__logo {font-size: 1.75rem;font-weight: bold}
.header__logo a {display: block;width: 100%;height: 100%;color: #fff;transition:color 300ms}
.header__menu-wrap {display: flex;align-items: center;margin-left: auto;height: 100%}
.header__menu {display: flex;height: 100%}
.header__menu-item {position: relative;height: 100%}
.header__menu-link {display: inline-flex;align-items: center;padding: 0 1.5em;height: 100%;color: #fff;font-size: 1.125rem}
.header__menu-depth {z-index: 1;position: absolute;top: 70px;left: 50%;transform: translateX(-50%);display: none;width:140px;background-color: #f2f4f6;box-shadow: 0px 2px 8px rgba(0,0,0,0.3)}
.header__menu-depth:after {content:'';width: 0;height: 0;display: block;position: absolute;z-index: 10;border: 0;border-left: 10px solid transparent;border-right: 10px solid transparent; margin-left:-10px;left:50%; border-bottom:10px solid #f2f4f6;top:-10px}
.header__menu-depth-item {height: 40px;line-height: 40px;float: none}
.header__menu-depth-link {font-size: .875rem;font-weight: 400;color: #333;display: block;line-height: 40px;padding: 0 10px}
.header__menu-depth-link:hover {background-color: #8BB97E;color: #fff}
.header .header__direct-link {margin-left: 5em;background-color: #8BB97E;border-color: #8BB97E;color: #fff}

.header.is-hover {background-color: #8BB97E}
.header.is-hover .header__direct-link {background-color: #fff;border-color: #fff;color: #333}
.header--wh.is-hover .header__logo a,
.header--wh.is-hover .header__menu-link {color: #fff}
.header--wh.is-hover .header__btn-gnb i {background-color: #fff}

.header.is-scroll,
.header--wh {background-color: #fff;box-shadow: 0 3px 5px 0 rgba(0,0,0,0.15)}
.header.is-scroll .header__logo a,
.header--wh .header__logo a {color: #8BB97E}
.header.is-scroll .header__menu-link,
.header--wh .header__menu-link {color: #000}
.header.is-scroll .header__btn-gnb i,
.header--wh .header__btn-gnb i {background-color: #000}
.header.is-scroll .header__direct-link,
.header--wh .header__direct-link {background-color: #8BB97E;border-color: #8BB97E;color: #fff}

@media screen and (max-width: 1360px) {
	.header .wrap {padding-right: 3em}
	.header .header__direct-link {margin-left: 1em}
}
@media screen and (max-width: 1023px) {
	.header {height: 56px}
	.header__logo {}
	.header__logo a {width: 100px;height: 30px;background-size: 100%}
	.header__top-menu {display: none}
	.header__menu {display: none}
	.header .header__direct-link {margin-left: 0;margin-right: 1em}
}
@media screen and (max-width: 599px) {
	.header .header__direct-link {display: none}
}


/**   header mobile    **/
.header__btn-gnb {z-index: 200;position: absolute;right: 1em;top: 50%;transform: translateY(-50%);cursor: pointer;transform-origin: 0 0}
.header__btn-gnb i {position: relative;display: block;margin: 8px 0;width: 30px;height: 2px;background-color: #fff;transition: all 300ms ease-in-out}
.header__btn-gnb:hover i:nth-child(2) {width: 80%}
.header__btn-gnb.close {transform: rotate(45deg) translateY(-50%);transition: all 300ms 700ms ease-in-out}
.header__btn-gnb.close i {background-color: #333}
.header__btn-gnb.close:hover i {background-color: #8BB97E}
.header__btn-gnb.close i:nth-child(2) {width: 0}
.header__btn-gnb.close i:nth-child(1),
.header__btn-gnb.close i:nth-child(3) {transition-delay: 300ms}
.header__btn-gnb.close i:nth-child(1) {transform: translateY(8px) rotate(90deg)}
.header__btn-gnb.close i:nth-child(3) {transform: translateY(-13px)}

.header-mobile__overlay {z-index: 100;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,.7);display: none}
.header-mobile__gnb {z-index: 100;position: fixed;top: 0;right: -100%;display: none;background-color: #fff;max-width: 960px;width: 80%;height: 100%;box-sizing: border-box;overflow-y: auto}
.header-mobile__gnb.is-active {right: 0}
.header-mobile .header-mobile__gnb-link {display: none}
.header-mobile__menu {display: flex;flex-direction: column;align-items: center;justify-content: center;height: 100%}
.header-mobile__menu-list {margin-top: -4em;width: 80%}
.header-mobile__menu-depth1-item {display: flex;align-items: center;padding: 4em 0 2em 0;border-bottom: 1px solid #ddd}
.header-mobile__menu-depth1-link {font-size: 1.5rem;display: block;width: 300px;font-weight: 400;color: #333}
.header-mobile__menu-depth2-box {display: flex;width: calc(100% - 300px)}
.header-mobile__menu-depth2-link {position: relative;font-size: 1.125rem;display: inline-block;margin-right: 1.5em;padding-top: 3px;padding-bottom: .2em;color: #999;border-bottom: 1px solid #fff;transition: color 300ms}
.header-mobile__menu-depth2-link:hover {color: #8BB97E}
.header-mobile__menu-depth2-link:after {content: '';position: absolute;left: 0;right: 0;bottom: 0;height: 0;background-color: #8BB97E;transition: height 300ms}
.header-mobile__menu-depth2-link:hover:after {height: 2px}
.header-mobile__sta {display: flex;margin-top: 4em;width: 80%}
.header-mobile__sta-link {position: relative;font-size: 1.5rem;color: #333}
.header-mobile__sta-link + .header-mobile__sta-link {padding-left: 1em;margin-left: 1em}
.header-mobile__sta-link + .header-mobile__sta-link:before {content: '';position: absolute;top: 50%;left: 0;transform: translateY(-48%);display: block;width: 1px;height: 20px;background-color: #666}
@media screen and (max-width: 1200px){
	.header-mobile__gnb {padding: 3em}
	.header-mobile__menu-list {width: 100%}
	.header-mobile__menu-depth1-link {font-size: 1.25rem}
	.header-mobile__menu-depth2-link {font-size: 1rem}
	.header-mobile__sta a {font-size: 1.25rem}
}
@media screen and (max-width:1023px){
	.header-mobile__gnb {padding: 2em;width: 100%}
	.header-mobile__menu {padding-top: 10em;align-items: stretch;justify-content: inherit}
	.header-mobile__menu-list {width: 100%}
	.header-mobile__menu-depth1-item {padding: 0;flex-direction: column;border-bottom: 0}
	.header-mobile__menu-depth1-link {position: relative;padding: .75em 1em;margin-bottom: 0;width: 100%;border-bottom: 1px solid #ddd;font-size: 1.5rem;cursor: pointer;transition: color 300ms;box-sizing: border-box}
	.header-mobile__menu-depth1-link i {position: absolute;right: 1em;top: 1em;width: 20px;height: 20px}
	.header-mobile__menu-depth1-link i:before,
	.header-mobile__menu-depth1-link i:after {content: '';position: absolute;left: 0;top: 50%;display: block;width: 100%;height: 2px;background-color: #666;transition: all 300ms}
	.header-mobile__menu-depth1-link i:before {transform: rotate(0)}
	.header-mobile__menu-depth1-link i:after {transform: rotate(90deg)}
	.header-mobile__menu-depth2-box {display: none;padding: 1em 1.5em;width: 100%;border-bottom: 1px solid #ddd}
	.header-mobile__menu-depth2-link {padding: .7em 0;font-size: 1.25rem}
	.header-mobile__menu-depth2-link:after {display: none}

	.header-mobile__menu-depth1-item:hover .header-mobile__menu-depth1-link,
	.header-mobile__menu-depth1-item.is-active .header-mobile__menu-depth1-link {color: #8BB97E; border-bottom:0}
	.header-mobile__menu-depth1-item:hover i:before,
	.header-mobile__menu-depth1-item:hover i:after,
	.header-mobile__menu-depth1-item.is-active i:before,
	.header-mobile__menu-depth1-item.is-active i:after {background-color: #8BB97E}
	.header-mobile__menu-depth1-item.is-active > .header-mobile__menu-depth2-box {display: block}
	.header-mobile__menu-depth1-item.is-active i:before,
	.header-mobile__menu-depth1-item.is-active i:after {top: 10px;width: 70%}
	.header-mobile__menu-depth1-item.is-active i:before {left: 0;transform: rotate(45deg)}
	.header-mobile__menu-depth1-item.is-active i:after {left: 10px;transform: rotate(-45deg)}
	.header-mobile__sta {position: absolute;top: 1.5em;left: 2.5em;margin-top: 0}
}
@media screen and (max-width:599px) {
	.header-mobile .header-mobile__gnb-link{display: block;width: 4em}
}

/**   sub visual    **/
.sub-visual {position: relative;text-align: center;background: url("/assets/images/sub/sub-visual1.jpg") center/cover no-repeat}
.sub-visual0 {background-image: url('/assets/images/sub/sub-visual1.jpg');}
.sub-visual__inn {position: relative;height: 32em;box-sizing: border-box;background-repeat: no-repeat;background-position: center;background-size: cover}
.sub-visual__box {position:absolute;top:calc(50% - 26px);transform:translateY(-50%);width:100%;text-align:center}
.sub-visual__title {font-size: 3.125rem;color: #fff;margin-bottom:25px}
.sub-nav {position: absolute;bottom: 0;width: 100%;background-color: rgba(0,0,0,0.7)}
.sub-nav-layout:after {content: '';display: block;clear: both}
.sub-nav-layout__item {float: left}
.sub-nav-layout__item.is-active .sub-nav-layout__link {position: relative;background-color: #fff;color: #333}
.sub-nav-layout__item.is-active .sub-nav-layout__link:after {content: '';position: absolute;left: 0;bottom: 0;width: 100%;height: 1px;background-color: #ddd}
.sub-nav-layout__link {display: block;padding: 1em 0;text-align: center;font-size: 1.25rem;color: #fff}
.sub-nav-layout-1 .sub-nav-layout__item {width: 100%}
.sub-nav-layout-2 .sub-nav-layout__item {width: 50%}
.sub-nav-layout-3 .sub-nav-layout__item {width: 33.333%}
.sub-nav-layout-4 .sub-nav-layout__item {width: 25%}
.sub-nav-layout-5 .sub-nav-layout__item {width: 20%}
.sub-visual--nav-none .sub-visual__title {margin: 2em 0 0}
.page__title-wrap {position: relative;padding-top: 6em}
.page__title {padding: 2em 0;text-align: center;display: block;font-size: 2.5rem}
.page__title__sub {display: block;font-size: 1.5rem;font-weight: normal;}
.page__title--sub {display: block;padding: 0;margin-top: -1.5em;font-size: 2rem;font-weight: bold}
.page__title-btn {position: absolute;top: calC(50% + 3em);transform: translateY(-50%);width: 5em;height: 5em}
.page__title-btn:after {content: '';position: absolute;top: 25%;width: 30%;height: 30%;border: solid #9e9e9e;transform: rotate(-45deg) translateX(-50%)}
.page__title-btn--prev {left: 0}
.page__title-btn--prev:after {left: 50%;border-width: 1px 0 0 1px}
.page__title-btn--next {right: 0}
.page__title-btn--next:after {left: 40%;border-width: 0 1px 1px 0}
@media screen and (max-width: 1200px) {
.page__title {padding: 2.7em 0}
	.sub-visual__inn {height: 260px}
	.sub-visual__title {font-size: 2.1rem;margin-bottom:20px}
}
@media screen and (max-width: 1023px) {
	.sub-visual {padding-top: 56px}
}
@media (min-width:769px) and (max-width:808px) {
	.sub-visual {padding-top:150px}
	.sub-visual__box {top:50%}
}
@media screen and (max-width:768px) {
	.sub-nav {display: none}
	.sub-nav-layout__link {font-size: .876rem}
	.sub-visual {padding-top: 56px}
	.sub-visual__inn {height: 150px}
	.sub-visual__box {top:50%}
	.sub-visual__title {font-size: 2.25rem;margin-bottom:10px}
	.page__title {padding: 1em 0;font-size: 2rem}
	.page__title--sub {font-size: 1.5rem}
}

/**   footer    **/
.footer {position: relative;width: 100%;padding-bottom: 4em;border-top: 1px solid #e5e5e5;background-color: #f6f6f6;overflow: hidden;text-align: center;font-size: .875rem}
.footer__company {background-color: #fff}
.footer__company .wrap {display: flex;align-items: center;justify-content:center}
.footer__company-item {position: relative;padding: 1em 0;margin:0 3em}
.footer__company-item:after {content: '';position: absolute;right: -3em;top: 50%;transform: translateY(-50%);width: 1px;height: 1.125em;background-color: #ddd}
.footer__company-item:last-child:after {display: none}
.footer__copyright {padding: 1.5em 0;color: #999}
.footer__copyright-item + .footer__copyright-item {margin-top: 0.5em}
.footer__copyright dl {display: inline-flex}
.footer__copyright dt::after {content: ':';margin: 0 5px;}
.footer__copyright dl + dl {position: relative;padding-left: 1.5em}
.footer__copyright dl + dl::before {content: '';position: absolute;left: 0.5em;top: 52%;transform:translateY(-50%);width: 1px;height: 1em;background-color: #aaa}

.footer__admin-menu {position: absolute;right: 2em;bottom: 2em;display: flex;align-items: center}
.footer__admin-menu li {font-size: 13px;color: #999}
.footer__admin-menu li + li {margin-left: 1em}
@media screen and (max-width: 1024px) {
	.footer__admin-menu {bottom: 1em}
	.footer__admin-menu li {font-size: 12px}
}
@media screen and (max-width: 768px) {
	.footer__admin-menu {display: none}
}
@media screen and (max-width: 599px) {
	.footer__copyright dl {display: inline-block}
	.footer__copyright dt,
	.footer__copyright dd {display: inline}
	.footer__copyright dl + dl {padding-left: 0.55em}
	.footer__copyright dl + dl::before {display: none}
	.footer__company-item {margin: 0 1em}
}