@charset "UTF-8";
:root {
	--c-mustard: #e8b941;
	--c-dgreen: #007d65;
	--c-green: #00a283;
	--c-lgreen: #6fb92c;
	--c-orange: #f29600;
	--c-blue: #00aecb;
--m30: 8.0vw;
--ff-nosa: YakuHanJP, "Noto Sans JP", sans-serif;
--ff-nose: YakuHanMP, "Noto Serif JP", serif;
--ff-grmd: "EB Garamond", serif;
}


/*************************************************************************************************************************
* reset
*************************************************************************************************************************/
html{ overflow-y: scroll; font-size: 62.5%;}
body{ margin: 0; padding: 0; text-align: justify; text-justify: inter-ideograph; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img{ width: 100%; max-width: 100%; height: auto; border: 0; vertical-align: bottom;}
svg{ vertical-align: bottom;}
form{ margin: 0; padding: 0;}
p{ margin: 0; padding: 0;}
a, a:hover{ text-decoration: none; outline: none;}
h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0; font-size: 0; line-height: 0;}
ul, dl, dt, dd{ margin: 0; padding: 0;}
li, ol{ margin: 0; padding: 0; list-style: none;}
table{ border: 0; border-collapse: collapse; border-spacing: 0;}
caption, th{ text-align: left;}
figure { margin: 0; padding: 0; }
header, nav, main, article, aside, section, footer{ display: block;}
button { color: #000; }
*{ box-sizing: border-box;}

/**********************************************************
*　追加ベース
**********************************************************/
body.is-fixed {
	/*position: fixed;*/
}
button{ background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }

.l-wrapper { position: relative; width: 1000px; margin-left: auto; margin-right: auto; }

@media screen and (max-width: 680px) {
	.l-wrapper { width: calc(100% - 48px); }
}

.sp-only { display: none !important; }
.sp-only-2 { display: none !important; }
.pc-only { display: block !important; }
.pc-only-2 { display: inline-block !important; }
@media screen and (max-width: 680px) {
	.sp-only { display: block !important; }
	.sp-only-2 { display: inline-block !important; }
	.pc-only { display: none !important; }
	.pc-only-2 { display: none !important; }
}


body{ font-family: YakuHanMP, "Noto Serif JP", serif; font-weight: 500; color: #000; -webkit-font-feature-settings: 'palt' 1; font-feature-settings: 'palt' 1; }
.l-body { width: 100%; background: var(--c-beige); overflow-x: hidden; }
.l-body.is-fixed { position: fixed; width: 100%; overflow: hidden; }
@media print, screen and (min-width:681px) {
	body{ min-width: 1400px; }
}

/*	iOS Sarafi Hack	*/
_::-webkit-full-page-media,
_:future,
:root .something {  }


/*----------------------------
	Common Things
----------------------------*/

/*	Header	*/
.header { position: fixed; top: 0; left: 0; width: 100%; border-bottom: 1px solid var(--c-wine); padding-left: 10px; z-index: 500; transition: background-color .4s; }
.header.header--white { background-color: rgba(255,255,255,1); }
.header__inner { display: flex; justify-content: space-between; align-items: center; height: 70px; }
.header__logo {  }
.header__logo img { width: 170px; }


.nav { display: flex; justify-content: space-between; align-items: center; }


.menu-wrap {  }
.menu {  }
.menu a { display: flex; align-items: center; font-size: 1.4rem; font-weight: 700; line-height: 1; letter-spacing: 0.08em; color: #fff; }



.header__navtrg span:nth-of-type(1) {
  top: 0;
  animation: hamburgerLink_anime 2s cubic-bezier(0.23, 1, 0.32, 1) 1s infinite both;
}
.header__navtrg span:nth-of-type(2) {
  top: 9px;
  animation: hamburgerLink_anime 2s cubic-bezier(0.23, 1, 0.32, 1) 1.5s infinite both;
}
/*
@media only screen and (max-width: 767px) {
  .hamburgerLink span:nth-of-type(2) {
    top: 8px;
  }
}
*/
.header__navtrg span:nth-of-type(3) {
  animation: hamburgerLink_anime 2s cubic-bezier(0.23, 1, 0.32, 1) 2s infinite both;
  bottom: 0;
}



@media screen and (max-width: 680px) {
	
.header { padding-left: 17px; z-index: 500; }
.header__inner { height: 68px; }
.header__logo {  }
	.nav { display: none; }
	.nav__inner { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; }
	
	.menu-wrap { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(4, 1fr); grid-column-gap: 0px; grid-row-gap: 0px; width: 100%; }
	.menu { border-bottom: 1px solid #fff; }
	.menu a { position: relative; height: 62px; padding-left: 32px; }
	.menu a::before { position: absolute; top: 50%; left: 6px; transform: translateY(-60%) rotate(135deg); transform-origin: center; width: 8px; height: 8px; border-right: 1px solid #fff; border-top: 1px solid #fff; content: ""; opacity: .5; }
	.nav__inner { padding-left: 48px; padding-right: 48px; }
	
.submenu-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 40px; }
	.submenu { width: calc(50% - 6px); }
	.submenu:first-of-type { width: 100%; margin-bottom: 25px; }
.submenu a { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc(100% - 4px); height: 60px; background: #000; }
	.submenu a::before { position: absolute; right: -4px; bottom: -4px; display: block; width: 100%; height: 100%; border-right: 1px solid #000; border-bottom: 1px solid #000; content: ""; }
	.submenu__jp,
	.submenu__en { line-height: 1; color: #fff; }
	.submenu__jp { font-size: 1.6rem; font-weight: 300; }
	.submenu__en { margin-top: 8px; font-family: var(--ff-grmd); font-size: 1.2rem; font-weight: 400; }
	
	.go2top { display: none; }
/*
	.nav .footer__link-wrap { width: calc(100% - 60px); margin-top: 40px; margin-left: auto; margin-right: auto; }
	.nav .footer__link__txt,
	.nav .footer__link::before { border-width: 1px; }
*/
}



.header__navtrg { position: fixed; top: 14px; right: 14px; transition: .4s; display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; background: #000; z-index: 500; }
.header__navtrg span { position: absolute; left: 11px; display: inline-block; transition: all .4s; width: 18px; height: 2px; background: #fff; border-radius: 1px; }
.header__navtrg span:nth-of-type(1) { top: 12px; }
.header__navtrg span:nth-of-type(2) { top: 19px; }
.header__navtrg span:nth-of-type(3) { top: 25px; }

.header.active .header__navtrg { background: #fff; }
.header.active .header__navtrg span { height: 3px; background: #000; }
.header.active .header__navtrg span:nth-of-type(1),
.header.active .header__navtrg span:nth-of-type(3) { top: 50%; left: 50%; }
.header.active .header__navtrg span:nth-of-type(1) { transform: translate(-50%, -50%) rotate(-45deg); }
.header.active .header__navtrg span:nth-of-type(2) { width: 0; }
.header.active .header__navtrg span:nth-of-type(3) { transform: translate(-50%, -50%) rotate(45deg); }
.header.active .header__navtrg span { animation: none; }



@media screen and (max-width: 680px) {
	
	.nav { position: fixed; top: 0; left: 0; display: none; width: 100%; height: 100svh; background-color: rgba(232,185,65,0.9); z-index: 400; }
	.nav__menu { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100svh; }
	.nav__menu__item:not(:first-of-type) { margin-top: 22px; }
	.nav__menu__item a { font-size: 1.4rem; font-weight: 700; color: var(--c-darkgrey); line-height: 1; letter-spacing: 0.02em; text-indent: 0.02em; text-align: center; }
	
}
@media screen and (min-width: 681px) {
	.header { padding-left: 16px; overflow: scroll; -ms-overflow-style: none; scrollbar-width: none; }
	.header__logo img { width: 240px; }
	.header__inner { min-width: 1400px; height: 80px; }
	.header__navtrg,
	.submenu-wrap { display: none; }
.nav { height: 80px; background: #fff; border-radius: 0 0 0 30px; padding: 0 60px; box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.1); }
	.menu-wrap { display: flex; justify-content: space-between; align-items: center; }
	
	.menu {  }
	.menu:not(:first-of-type) { margin-left: 37px; }
	.menu a { position: relative; color: var(--c-mustard); }
	.menu a::before { position: absolute; left: 50%; transform: translateX(-50%); bottom: -5px; display: block; width: 100%; height: 2px; background: var(--c-mustard); border-radius: 1px; content: ""; opacity: 0; pointer-events: none; transition: .4s; }
	.menu a:hover::before { opacity: 1; }
/*	.nav .footer__link-wrap  display: none; */
}




.whole-wrap { position: relative; overflow: hidden; }

/*	Footer	*/
.footer { padding-top: 120px; padding-bottom: 60px; }
.footer__link-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }
.footer__link { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc(50% - 10px); height: 60px; background: #000; margin-right: 4px; margin-bottom: 4px; line-height: 1; color: #fff; }
.footer__link::before { position: absolute; right: -4px; bottom: -4px; display: block; width: 100%; height: 100%; border-right: 1px solid #000; border-bottom: 1px solid #000; content: ""; }
.footer__link__jp { font-size: 1.6rem; font-weight: 600; }
.footer__link__en { margin-top: 1px; font: 400 1.2rem var(--ff-grmd); letter-spacing: 0.06em; text-indent: 0.06em; }
.footer__lnc { margin-top: 55px; text-align: center; }
.footer__l {  }
.footer__l img { width: 250px; }
.footer__c { margin-top: 15px; font: 300 1.2rem var(--ff-nosa); line-height: 1; }

.footer--sub { padding-top: 43px; }
.go2home { display: block; width: 120px; margin-bottom: 48px; margin-left: auto; margin-right: -8px; }

@media screen and (max-width: 680px) {
	.footer__link-wrap { width: calc(100% - 39px); margin-left: auto; margin-right: auto; }
	.footer__link:first-of-type { width: 100%; margin-bottom: 24px; }
}
@media screen and (min-width: 681px) {
	.footer { padding-top: 240px; padding-bottom: 126px; }
	.footer__link-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }
	.footer__link { transition: .4s; width: 300px; height: 120px; margin-right: 5px; margin-bottom: 5px; }
	.footer__link:nth-of-type(1) { order: 2; }
	.footer__link:nth-of-type(2) { order: 1; }
	.footer__link:nth-of-type(3) { order: 3; }
	.footer__link::before { right: -5px; bottom: -5px; }
	.footer__link:hover { color: var(--c-mustard); }
	.footer__link__jp { font-size: 2.4rem; }
	.footer__link__en { margin-top: 6px; font-size: 2.0rem; }
	.footer__lnc { margin-top: 120px; }
	.footer__l {  }
	.footer__l img { width: 400px; }
	.footer__c { margin-top: 55px; font-size: 1.5rem; }
	.footer--sub { padding-top: 56px; }
	.go2home { transition: .4s; width: 160px; margin-bottom: 82px; margin-right: -48px; }
	.go2home:hover { filter: brightness(110%); }
}

/*	Fixed Button	*/
.fixed-btn-wrap { position: fixed; right: 0; bottom: 0; transform: translateY(100%); transition: 0.4s; z-index: 1100; display: flex; width: 100%; height: 65px; }
.fixed-btn-wrap._show { transform: translateY(0); }
.fixed-btn { position: relative; display: flex; align-items: center; justify-content: center; font-family: var(--ff-nosa); font: 600 1.6rem var(--ff-nose); line-height: 1; letter-spacing: 0.08em; text-indent: 0.08em; text-align: center; background: #000; color: #fff; flex-grow: 1; text-decoration: none; }
.fixed-btn._ktkn { letter-spacing: -0.02em; text-indent: -0.02em; }
.fixed-btn:not(:last-child)::before { position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: block; width: 1px; height: calc(100% - 33px); background: rgba(255, 255, 255, 0.5); content: ""; }
@media screen and (min-width: 681px) {
	.fixed-btn-wrap { top: 50%; transform: translate(100%, -50%); flex-direction: column; width: 60px; height: 337px; border-radius: 10px 0 0 10px; overflow: hidden; }
	.fixed-btn-wrap._show { transform: translate(0, -50%); }
	.fixed-btn { writing-mode: vertical-rl; padding: 22px 0; white-space: nowrap; transition: 0.4s; }
	.fixed-btn:hover { color: var(--c-mustard); }
	.fixed-btn:not(:last-child)::before { top: auto; right: auto; bottom: 0; left: 50%; transform: translateX(-50%); width: calc(100% - 28px); height: 1px; }
	.fixed-btn:not(:last-child) { border: none; }
}


@keyframes hamburgerLink_anime {
  0% {
    transform: scale(0.5, 1);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(0.5, 1);
    transform-origin: 0 100%;
  }
}

/* css for Recruit footer template */

.r-footer{ background: #fff; padding: 20px 15px; overflow: hidden; position: relative; z-index: 1000; font-family: var(--ff-nosa); }
.r-footer__list li{ margin: 1px 0 0; letter-spacing: 0.1em; }
.r-footer__list li a{ position: relative; padding: 0 0 0 10px; font-size: 12px; color: #333;}
.r-footer__list li a::before{ content: ""; width: 0; height: 0; position: absolute; top: 5px; left: 0; border-style: solid; border-width: 4px 0 4px 5px; border-color: transparent transparent transparent #454545;}
.r-footer__box{ margin: 25px 0 0; text-align: center;}
.r-footer__box a{ display: block; width: 258px; height: 37px;}
@media print, screen and (max-width: 680px){
	.r-footer { margin-bottom: 65px; }
	.r-footer__list { position: relative; left: 50%; transform: translateX(-50%); display: inline-block; }
}
@media print, screen and (min-width: 681px){
	.r-footer{ display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; padding: 10px 30px 20px;}
	.r-footer__list{ display: flex; transform: translateY(5px);}
	.r-footer__list li{ margin: 0;}
	.r-footer__list li a{ padding-left: 5px; font-size: 15px; text-decoration: none;}
	.r-footer__list li a::after{ content: "｜"; padding: 0 0 0 5px;}
	.r-footer__list li a::before,
	.r-footer__list li:last-child a::after{ display: none;}
	.r-footer__box{ margin: 0;}
	
	.r-footer__box a { margin: 0 auto; }
	
}


