@charset "UTF-8";
/*
Theme Name: Twenty Twenty-one Child
Version: 1.6
Template: twentytwentyone
*/
:root {
  --viewport-width: min(100vw, 2000px);
  --b: calc(var(--viewport-width) / 160);
}

::-moz-selection {
  background: #fff;
  color: #3b3128;
}

::selection {
  background: #fff;
  color: #3b3128;
}

* {
  color: #3b3128;
  font-family: YakuHanJP, "Noto Sans JP", sans-serif;
  font-size: max(1.4rem, 12px);
  font-weight: 400;
  line-height: 2.5;
  letter-spacing: 0.1em;
}

a > *,
button > * {
  pointer-events: none;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

a,
button {
  display: block;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

span {
  display: inline-block;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

.attention {
  font-size: max(1.2rem, 10px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
.attention small {
  display: block;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

.nolink {
  opacity: 0.5 !important;
  pointer-events: none !important;
}

.no-scroll {
  overflow: hidden;
  height: 100%;
}

.maskImage {
  -webkit-mask-image: url(./dist/images/mask.webp);
          mask-image: url(./dist/images/mask.webp);
  mask-mode: alpha;
  -webkit-mask-size: auto 200%;
          mask-size: auto 200%;
  opacity: 0;
}
.maskImage.active {
  animation: 2.3s maskAnimation cubic-bezier(0.115, 0.405, 0.24, 1) 0s forwards;
}
@keyframes maskAnimation {
  0% {
    -webkit-mask-position: center bottom;
            mask-position: center bottom;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    -webkit-mask-position: center 0%;
            mask-position: center 0%;
    -webkit-mask-size: auto 500%;
            mask-size: auto 500%;
    opacity: 1;
  }
}

.btn__link {
  display: inline-flex;
  align-items: center;
  gap: max(2.5rem, 15px);
  transition: all 0.3s ease;
}
.btn__link--text {
  flex: 1;
  color: #3b3128;
  font-size: max(1.6rem, 14px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.1em;
  transition: color 0.3s ease;
}
.btn__link--arrow {
  position: relative;
  display: grid;
  place-items: center;
  width: auto;
  height: 1.6lh;
  aspect-ratio: 1/1;
  border: none;
  border-radius: 50%;
  overflow: visible;
}
.btn__link--arrow .circle-border {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.btn__link--arrow .circle-border .circle-base {
  fill: none;
  stroke-width: 1;
  stroke-dasharray: 126 126;
}
.btn__link--arrow .circle-border .circle-animated {
  fill: none;
  stroke-width: 1;
  stroke-dasharray: 0 126;
  stroke-dashoffset: 0;
  transform-origin: center;
  transform: rotate(-90deg);
  transition: stroke-dasharray 0.6s ease;
}
.btn__link--arrow img {
  position: relative;
  z-index: 1;
  width: 30%;
  transition: transform 0.3s ease;
}
.btn__link--primary .btn__link--text {
  color: #3b3128;
}
.btn__link--primary .btn__link--arrow .circle-border .circle-base {
  stroke: rgba(59, 49, 40, 0.3);
}
.btn__link--primary .btn__link--arrow .circle-border .circle-animated {
  stroke: #3b3128;
}
.btn__link--primary .btn__link--arrow img {
  filter: none;
}
.btn__link--secondary .btn__link--text {
  color: #fff;
}
.btn__link--secondary .btn__link--arrow .circle-border .circle-base {
  stroke: rgba(255, 255, 255, 0.3);
}
.btn__link--secondary .btn__link--arrow .circle-border .circle-animated {
  stroke: white;
}
.btn__link--secondary .btn__link--arrow img {
  filter: brightness(10);
}
.btn__link:hover .btn__link--arrow .circle-border .circle-animated {
  stroke-dasharray: 126 126;
}
.btn__link:hover .btn__link--arrow img {
  transform: scale(1.1);
}

#header {
  position: fixed;
  display: flex;
  align-items: center;
  gap: max(5rem, 30px);
  top: 0;
  left: 0;
  right: 0;
  width: 100vw;
  height: max(9rem, 80px);
  padding: max(2.5rem, 20px) max(5rem, 20px) 0 max(3rem, 20px);
  z-index: 9999;
  mix-blend-mode: difference;
}
@media screen and (max-width: 550px) {
  #header {
    height: 65px;
    padding: 20px 5% 0 5%;
  }
}
#header .header__logo {
  width: auto;
  height: 100%;
  margin-right: auto;
}
#header .header__logo a {
  height: 100%;
}
#header .header__logo a img {
  width: auto;
  height: 100%;
}
#header .header__nav {
  display: flex;
  justify-self: end;
  align-items: end;
  flex-direction: column;
  gap: max(2rem, 15px) max(2.5rem, 20px);
}
#header .header__nav--top, #header .header__nav--bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: max(3rem, 20px);
}
@media screen and (max-width: 1000px) {
  #header .header__nav--top, #header .header__nav--bottom {
    display: none;
  }
}
#header .header__nav--top .header__nav--item a, #header .header__nav--bottom .header__nav--item a {
  color: #fff;
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.6rem, 14px);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.05em;
  overflow: hidden;
}
#header .header__nav--top .header__nav--item a span.textWrapper, #header .header__nav--bottom .header__nav--item a span.textWrapper {
  position: relative;
  transition: transform 0.4s ease-in-out;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(1), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(1) {
  transition-delay: 0s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(2), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(2) {
  transition-delay: 0.02s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(3), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(3) {
  transition-delay: 0.04s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(4), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(4) {
  transition-delay: 0.06s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(5), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(5) {
  transition-delay: 0.08s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(6), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(6) {
  transition-delay: 0.1s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(7), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(7) {
  transition-delay: 0.12s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(8), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(8) {
  transition-delay: 0.14s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(9), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(9) {
  transition-delay: 0.16s;
}
#header .header__nav--top .header__nav--item a span.textWrapper:nth-of-type(10), #header .header__nav--bottom .header__nav--item a span.textWrapper:nth-of-type(10) {
  transition-delay: 0.18s;
}
#header .header__nav--top .header__nav--item a span.textWrapper .char, #header .header__nav--bottom .header__nav--item a span.textWrapper .char {
  position: absolute;
  inset: 0;
  top: calc(100% + 10px);
}
#header .header__nav--top .header__nav--item a.focus, #header .header__nav--bottom .header__nav--item a.focus {
  padding: max(0.5rem, 5px) max(2rem, 15px);
  border-radius: 13px;
  border: 1px solid #fff;
}
#header .header__nav--top .header__nav--item a:hover span.textWrapper, #header .header__nav--bottom .header__nav--item a:hover span.textWrapper {
  transform: translateY(calc(-100% - 10px));
}
#header .header__nav--top {
  transform: translateX(5px);
}
#header .header__toggle {
  position: relative;
  display: block;
  width: 45px;
  height: 20px;
  z-index: 99999;
}
#header .header__toggle--line {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  transition: all 0.4s ease-in-out;
}
#header .header__toggle--line:nth-of-type(1) {
  top: 0;
}
#header .header__toggle--line:nth-of-type(2) {
  bottom: 0;
}
#header.active .header__toggle--line:nth-of-type(1) {
  top: 50%;
  transform: translateY(-50%) rotate(-20deg);
}
#header.active .header__toggle--line:nth-of-type(2) {
  bottom: 50%;
  transform: translateY(50%) rotate(20deg);
}
#header.confirmation .header__nav,
#header.confirmation .header__toggle {
  display: none;
}

.menu {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: clamp(600px, 50%, 1000px);
  padding: max(10rem, 90px) max(10rem, 20px);
  height: 100vh;
  z-index: 9999;
  opacity: 0;
  overflow-y: auto;
  pointer-events: none;
  transition: all 0.4s ease-in-out;
  background: #3b3128;
}
@media screen and (max-width: 768px) {
  .menu {
    width: 100%;
  }
}
.menu__toggle {
  display: block;
  position: absolute;
  top: max(5rem, 40px);
  right: max(5rem, 20px);
  width: 45px;
  height: 20px;
  z-index: 99999;
}
.menu__toggle--line {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  transition: all 0.4s ease-in-out;
}
.menu__toggle--line:nth-of-type(1) {
  top: 0;
}
.menu__toggle--line:nth-of-type(2) {
  bottom: 0;
}
.menu__content {
  width: 100%;
  height: auto;
}
.menu__content--list {
  display: grid;
  gap: max(2rem, 20px);
  grid-template-columns: 1fr auto;
}
@media screen and (max-width: 550px) {
  .menu__content--list {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}
.menu__content--list ul {
  display: grid;
  gap: max(2rem, 20px);
}
@media screen and (max-width: 550px) {
  .menu__content--list ul {
    gap: 10px;
  }
}
.menu__content--list ul li a {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: max(1rem, 10px);
}
.menu__content--list ul li a span {
  color: #fff;
  font-weight: 400;
  line-height: 1;
}
.menu__content--list ul li a span.ja {
  font-size: max(1.4rem, 12px);
  letter-spacing: 0.1em;
}
.menu__content--list ul li a span.en {
  color: rgba(255, 255, 255, 0.3);
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.2rem, 10px);
  letter-spacing: 0.05em;
}
.menu__content--request {
  display: flex;
  flex-wrap: wrap;
  gap: max(5rem, 20px);
  margin-top: max(7rem, 50px);
}
@media screen and (max-width: 550px) {
  .menu__content--request {
    flex-direction: column;
  }
}
.menu__content--request a {
  display: flex;
  gap: max(1rem, 10px);
}
.menu__content--request a img {
  flex-shrink: 0;
  width: auto;
  height: 0.5lh;
}
.menu__content--request a .textBox {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: max(0.5rem, 5px);
}
.menu__content--request a .textBox span {
  line-height: 1;
  font-weight: 400;
}
.menu__content--request a .textBox span.ja {
  color: #fff;
  font-size: max(1.4rem, 12px);
  letter-spacing: 0.1em;
}
.menu__content--request a .textBox span.en {
  color: rgba(255, 255, 255, 0.3);
  font-size: max(1.2rem, 10px);
  letter-spacing: 0.05em;
}
.menu__content--contact {
  margin-top: max(5rem, 30px);
}
.menu__content--contact a {
  display: inline-block;
  border: 1px solid #fff;
  border-radius: 28px;
  text-align: center;
}
@media screen and (max-width: 550px) {
  .menu__content--contact a {
    width: 100%;
  }
}
.menu__content--contact a span {
  padding: max(1.5rem, 15px) max(7rem, 60px);
  color: #fff;
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.6rem, 14px);
  font-weight: 400;
  line-height: 0.8;
  letter-spacing: 0.05em;
}
.menu__content--footer {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center;
  gap: max(2rem, 20px);
  margin-top: max(10rem, 50px);
}
@media screen and (max-width: 550px) {
  .menu__content--footer {
    justify-content: center;
  }
}
.menu__content--footer .snsBox {
  display: inline-flex;
  align-items: center;
  gap: max(2rem, 20px);
}
.menu__content--footer .snsBox a {
  width: max(3rem, 30px);
}
.menu__content--footer .logo {
  width: max(13rem, 100px);
}
.menu.active {
  opacity: 1;
  pointer-events: auto;
}
.menu.active .menu__toggle--line:nth-of-type(1) {
  top: 50%;
  transform: translateY(-50%) rotate(-20deg);
}
.menu.active .menu__toggle--line:nth-of-type(2) {
  bottom: 50%;
  transform: translateY(50%) rotate(20deg);
}

#fixed__overlay {
  position: fixed;
  inset: 0;
  z-index: 10;
  opacity: 0;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
  background-color: rgba(0, 0, 0, 0.3);
  transition: opacity 0.4s ease-in-out;
  pointer-events: none;
  visibility: hidden;
}
#fixed__overlay.active {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

#footer {
  position: relative;
  z-index: 0;
  background: #3b3128;
  width: 100%;
}
#footer .footer__wrapper {
  display: flex;
  align-items: center;
  padding-top: max(11.7rem, 70px);
  padding-left: 10%;
  padding-bottom: max(11.7rem, 10px);
}
@media screen and (max-width: 550px) {
  #footer .footer__wrapper {
    flex-direction: column;
    padding-left: 5%;
    padding-right: 5%;
  }
}
#footer .footer__wrapper .footer__content {
  width: 90%;
}
@media screen and (max-width: 550px) {
  #footer .footer__wrapper .footer__content {
    width: 100%;
  }
}
#footer .footer__wrapper .footer__content .footer__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: max(1rem, 10px);
  padding-bottom: max(3rem, 20px);
  margin-bottom: max(5rem, 30px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
#footer .footer__wrapper .footer__content .footer__top--logo {
  width: max(17rem, 125px);
}
#footer .footer__wrapper .footer__content .footer__bottom {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: max(5rem, 50px);
}
@media screen and (max-width: 1000px) {
  #footer .footer__wrapper .footer__content .footer__bottom {
    align-items: start;
    flex-direction: column;
  }
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--title {
  position: relative;
  color: rgba(255, 255, 255, 0.4);
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.8rem, 16px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin-bottom: max(2.5rem, 20px);
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--title::before {
  content: "⚫︎";
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: 0;
  margin-right: max(1rem, 5px);
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner {
  display: flex;
  align-items: start;
  -moz-column-gap: max(6rem, 40px);
       column-gap: max(6rem, 40px);
}
@media screen and (max-width: 1000px) {
  #footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner {
    -moz-column-gap: max(11rem, 60px);
         column-gap: max(11rem, 60px);
  }
}
@media screen and (max-width: 768px) {
  #footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner {
    row-gap: 50px;
    flex-direction: column;
  }
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner .map__item b {
  color: #fff;
  font-size: max(1.8rem, 16px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.1em;
  margin-bottom: max(1.5rem, 10px);
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner .map__item p {
  color: #fff;
  font-size: max(1.4rem, 12px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.1em;
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner .map__item .map__link {
  display: flex;
  align-items: center;
  gap: max(2rem, 15px);
  margin-top: max(2rem, 15px);
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner .map__item .map__link--text {
  color: #fff;
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.8rem, 16px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.05em;
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__map--inner .map__item .map__link--arrow {
  width: auto;
  height: 1lh;
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__other {
  display: flex;
  flex-direction: column;
  row-gap: max(2.5rem, 15px);
}
@media screen and (max-width: 1000px) {
  #footer .footer__wrapper .footer__content .footer__bottom .footer__other {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
}
@media screen and (max-width: 550px) {
  #footer .footer__wrapper .footer__content .footer__bottom .footer__other {
    flex-direction: column-reverse;
    justify-content: center;
  }
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__other .other__link {
  color: #fff;
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.8rem, 16px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.05em;
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__other .other__sns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: max(2rem, 10px);
}
#footer .footer__wrapper .footer__content .footer__bottom .footer__other .other__sns--link {
  width: max(3.1rem, 25px);
}
#footer .footer__wrapper .footer__copyright {
  width: 10%;
  text-align: center;
}
@media screen and (max-width: 550px) {
  #footer .footer__wrapper .footer__copyright {
    width: 100%;
    margin-top: 30px;
  }
}
#footer .footer__wrapper .footer__copyright small {
  color: #fff;
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.5rem, 13px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  writing-mode: vertical-rl;
  -webkit-text-orientation: mixed;
          text-orientation: mixed;
}
@media screen and (max-width: 550px) {
  #footer .footer__wrapper .footer__copyright small {
    writing-mode: horizontal-tb;
    -webkit-text-orientation: initial;
            text-orientation: initial;
    white-space: normal;
  }
}
#footer.confirmation .footer__wrapper {
  padding: 20px 10%;
}
@media screen and (max-width: 550px) {
  #footer.confirmation .footer__wrapper {
    padding: 20px 5%;
  }
}
#footer.confirmation .footer__wrapper .footer__content {
  display: none;
}
#footer.confirmation .footer__wrapper .footer__copyright {
  width: 100%;
  text-align: center;
  margin-top: 0;
}
#footer.confirmation .footer__wrapper .footer__copyright small {
  writing-mode: horizontal-tb;
}

#fixed-sidebanner {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 1000;
  transition: transform 0.4s ease, opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
  #fixed-sidebanner {
    top: unset;
    left: 0;
    bottom: 0;
    transform: translateY(0);
  }
}
#fixed-sidebanner ul {
  display: flex;
  flex-direction: column;
  gap: max(0.6rem, 6px);
}
@media screen and (max-width: 768px) {
  #fixed-sidebanner ul {
    flex-direction: row;
    border-top: 1px solid #fff;
    width: 100%;
    gap: 0;
  }
}
@media screen and (max-width: 768px) {
  #fixed-sidebanner ul li {
    flex: 1;
  }
  #fixed-sidebanner ul li:not(:last-of-type) {
    border-right: 1px solid #fff;
  }
}
#fixed-sidebanner ul li a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: max(0.7rem, 7px);
  padding: max(1rem, 10px) max(1.5rem, 15px);
  background: #3b3128;
  width: 100%;
  min-height: max(16.5rem, 165px);
  transition: opacity 0.4s ease-in-out;
}
@media screen and (max-width: 768px) {
  #fixed-sidebanner ul li a {
    width: auto;
    min-height: 0;
    padding: 0;
    height: 50px;
    flex-direction: row;
  }
}
@media screen and (max-width: 550px) {
  #fixed-sidebanner ul li a {
    height: 45px;
  }
}
@media screen and (max-width: 768px) {
  #fixed-sidebanner ul li a img {
    height: 0.5lh;
    width: auto;
  }
}
#fixed-sidebanner ul li a span {
  color: #fff;
  font-size: max(1.4rem, 14px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.2em;
  writing-mode: vertical-rl;
  -webkit-text-orientation: mixed;
          text-orientation: mixed;
}
#fixed-sidebanner ul li a span.sp {
  display: none;
}
@media screen and (max-width: 768px) {
  #fixed-sidebanner ul li a span {
    flex-shrink: 0;
    font-size: 12px;
    writing-mode: horizontal-tb;
    -webkit-text-orientation: initial;
            text-orientation: initial;
  }
  #fixed-sidebanner ul li a span.pc {
    display: none;
  }
  #fixed-sidebanner ul li a span.sp {
    display: block;
  }
}
#fixed-sidebanner ul li a:hover {
  opacity: 0.5;
}
#fixed-sidebanner.confirmation {
  display: none;
}

#common-section {
  position: relative;
  z-index: 0;
}
#common-section .common__mask {
  position: absolute;
  inset: 0;
  z-index: -1;
  -webkit-backdrop-filter: blur(30px) invert(30%);
          backdrop-filter: blur(30px) invert(30%);
}
#common-section .common__wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(1rem, 10px);
  padding-top: max(11rem, 70px);
  padding-bottom: max(11rem, 70px);
}
@media screen and (max-width: 1000px) {
  #common-section .common__wrapper {
    row-gap: max(10rem, 50px);
    grid-template-columns: 1fr;
  }
}
#common-section .common__wrapper .common__content {
  position: relative;
  flex: 1;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  margin-bottom: min(-5.5rem, -25px);
}
@media screen and (max-width: 1000px) {
  #common-section .common__wrapper .common__content {
    grid-row: span 1;
  }
}
@media screen and (max-width: 768px) {
  #common-section .common__wrapper .common__content {
    gap: 0;
    grid-row: span 2;
  }
}
#common-section .common__wrapper .common__content .common__text {
  background: #fff;
  padding: max(4.5rem, 25px) max(4rem, 25px) max(11rem, 50px);
}
@media screen and (max-width: 1000px) {
  #common-section .common__wrapper .common__content .common__text {
    width: 80%;
    padding: max(5.5rem, 25px) 17.5vw max(5rem, 25px) max(5rem, 25px);
  }
}
@media screen and (max-width: 768px) {
  #common-section .common__wrapper .common__content .common__text {
    width: 100%;
    padding: 10% 10% max(11rem, 50px);
  }
}
#common-section .common__wrapper .common__content .common__text--title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: max(3rem, 20px);
}
#common-section .common__wrapper .common__content .common__text--title hgroup.section-title {
  margin-bottom: 0;
}
#common-section .common__wrapper .common__content .common__text--title .common__arrow {
  position: relative;
  display: grid;
  place-items: center;
  align-self: center;
  width: auto;
  height: max(5.5rem, 48px);
  aspect-ratio: 1/1;
  border: none;
  border-radius: 50%;
  overflow: visible;
}
#common-section .common__wrapper .common__content .common__text--title .common__arrow .circle-border {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
#common-section .common__wrapper .common__content .common__text--title .common__arrow .circle-border .circle-base {
  fill: none;
  stroke-width: 1;
  stroke: rgba(59, 49, 40, 0.3);
  stroke-dasharray: 126 126;
}
#common-section .common__wrapper .common__content .common__text--title .common__arrow .circle-border .circle-animated {
  fill: none;
  stroke-width: 1;
  stroke: #3b3128;
  stroke-dasharray: 0 126;
  stroke-dashoffset: 0;
  transform-origin: center;
  transform: rotate(-90deg);
  transition: stroke-dasharray 0.6s ease;
}
#common-section .common__wrapper .common__content .common__text--title .common__arrow img {
  position: relative;
  z-index: 1;
  width: 30%;
  transition: transform 0.3s ease;
}
#common-section .common__wrapper .common__content:hover .common__text .common__arrow .circle-border .circle-animated {
  stroke-dasharray: 126 126;
}
#common-section .common__wrapper .common__content:hover .common__text .common__arrow img {
  transform: scale(1.1);
}
#common-section .common__wrapper .common__content .common__image {
  position: relative;
  width: auto;
  aspect-ratio: 31/19;
  margin: 0 max(5.5rem, 25px);
  transform: translateY(min(-5.5rem, -25px));
}
@media screen and (max-width: 1000px) {
  #common-section .common__wrapper .common__content .common__image {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 30vw;
    margin: 0;
  }
}
@media screen and (max-width: 768px) {
  #common-section .common__wrapper .common__content .common__image {
    position: relative;
    top: unset;
    width: auto;
    margin: 0 10%;
    transform: translateY(min(-5.5rem, -25px));
  }
}
#common-section .common__wrapper .common__content .common__image .imageBox {
  box-shadow: 0 0 26px rgba(0, 0, 0, 0);
  transition: box-shadow 2s;
}
#common-section .common__wrapper .common__content .common__image .imageBox img {
  width: 100%;
  aspect-ratio: 31/19;
}
#common-section .common__wrapper .common__content .common__image .imageBox.active {
  box-shadow: 0 0 26px rgba(0, 0, 0, 0.2);
}
#common-section .common__wrapper .common__content .common__image--accent .imageBox:nth-of-type(1) {
  position: absolute;
  top: 0;
  left: 0;
  width: 80%;
  height: auto;
  z-index: 10;
  animation-delay: 0.1s;
}
#common-section .common__wrapper .common__content .common__image--accent .imageBox:nth-of-type(2) {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 80%;
  height: auto;
}

#hero {
  position: relative;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: -2;
}
#hero .hero__wrapper {
  position: fixed;
  inset: 0;
}
#hero .hero__wrapper .hero__bg {
  position: relative;
  width: 100vw;
  height: 100vh;
  background: #3b3128;
}
#hero .hero__wrapper .hero__bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, gray, rgba(128, 128, 128, 0));
  mix-blend-mode: multiply;
}
#hero .hero__wrapper .hero__bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#hero .hero__wrapper .hero__content {
  position: absolute;
  left: 10%;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 550px) {
  #hero .hero__wrapper .hero__content {
    left: 5%;
    right: 5%;
  }
}
#hero .hero__wrapper .hero__content hgroup.hero__title h2 {
  color: #fff;
  font-size: max(2.375vw, 28px);
  line-height: 1.5;
  letter-spacing: 0.2em;
  text-shadow: 0 0 36px #000;
}
#hero .hero__wrapper .hero__content hgroup.hero__title h2 span {
  text-shadow: 0 0 36px #000;
}
#hero .hero__wrapper .hero__content hgroup.hero__title h2 span.hero__title--small {
  font-size: max(2.6875vw, 30px);
  line-height: 1;
  letter-spacing: 0.2em;
}
#hero .hero__wrapper .hero__content hgroup.hero__title p {
  color: rgba(255, 255, 255, 0.5);
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.5vw, 24px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.05em;
  text-shadow: 0 0 36px #000;
}
#hero.loaded .hero__wrapper .hero__content hgroup.hero__title h2 {
  opacity: 1;
}
#hero.loaded .hero__wrapper .hero__content hgroup.hero__title h2 span.split-char {
  opacity: 1;
  filter: blur(0);
  transform: scale(1) translateY(0px);
}

.section-title {
  margin-bottom: max(4rem, 20px);
}
.section-title .section-title__sub {
  position: relative;
  color: rgba(59, 49, 40, 0.4);
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
  font-size: max(1.8rem, 16px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
.section-title .section-title__sub::before {
  content: "⚫︎";
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: 0;
}
.section-title .section-title__main {
  color: #3b3128;
  font-size: max(2.8rem, 22px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.15em;
}

.split {
  opacity: 0;
}
.split span.split-char {
  opacity: 0;
  transform: scale(1.7) translate(-20px);
  filter: blur(max(0.875rem, 5px));
  transition: opacity 0.2s linear, transform 1.6s cubic-bezier(0.215, 0.61, 0.355, 1), filter 1.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.split.active, .split.loaded {
  opacity: 1;
}
.split.active span.split-char, .split.loaded span.split-char {
  opacity: 1;
  filter: blur(0);
  transform: scale(1) translateY(0px);
}

.fadeUp {
  opacity: 0;
  filter: blur(max(0.875rem, 5px));
  transform: translateY(20%);
  transition: opacity 0.2s linear, transform 1.6s cubic-bezier(0.215, 0.61, 0.355, 1), filter 1.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.fadeUp.active, .fadeUp.loaded {
  opacity: 1;
  filter: blur(0);
  transform: translateY(0);
}

.breadcrumb {
  position: fixed;
  bottom: 10%;
  left: 10%;
  z-index: 0;
}
@media screen and (max-width: 550px) {
  .breadcrumb {
    left: 5%;
  }
}
.breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 max(1rem, 10px);
}
.breadcrumb__item span {
  color: #fff;
}
.breadcrumb__item > span {
  color: rgba(255, 255, 255, 0.4);
}
.breadcrumb__separator {
  color: #fff;
  font-family: YakuHanJP, "Jost", "Noto Sans JP", sans-serif;
}

section#recruit-commonSection #company {
  background: #fff;
}
section#recruit-commonSection #company .company__wrapper {
  display: flex;
  -moz-column-gap: max(7rem, 30px);
       column-gap: max(7rem, 30px);
  padding-top: max(20rem, 100px);
  padding-bottom: max(16.5rem, 70px);
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #company .company__wrapper {
    flex-direction: column;
  }
}
section#recruit-commonSection #company .company__wrapper .btnBox {
  width: 100%;
}
section#recruit-commonSection #company .company__wrapper .btnBox--pc {
  display: block;
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #company .company__wrapper .btnBox--pc {
    display: none;
  }
}
section#recruit-commonSection #company .company__wrapper .btnBox--sp {
  display: none;
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #company .company__wrapper .btnBox--sp {
    display: block;
    margin-top: max(10rem, 30px);
  }
}
section#recruit-commonSection #company .company__wrapper .btnBox .btn {
  width: 100%;
}
section#recruit-commonSection #company .company__wrapper .btnBox .btn:not(:first-of-type) {
  margin-top: max(4.5rem, 30px);
  padding-top: max(4.5rem, 30px);
  border-top: 1px solid rgba(59, 49, 40, 0.15);
}
section#recruit-commonSection #company .company__wrapper .btnBox .btn__link {
  width: 100%;
  justify-content: space-between;
}
section#recruit-commonSection #company .company__wrapper .company__text {
  flex: 1;
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: space-between;
}
section#recruit-commonSection #company .company__wrapper .company__image {
  width: max(72rem, 300px);
  height: auto;
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #company .company__wrapper .company__image {
    width: 100%;
    aspect-ratio: 5/3;
  }
}
section#recruit-commonSection #company .company__wrapper .company__image img {
  width: 100%;
  height: 100%;
}
section#recruit-commonSection #entry {
  background: #fff;
}
section#recruit-commonSection #entry .entry__wrapper {
  display: flex;
  -moz-column-gap: max(7rem, 30px);
       column-gap: max(7rem, 30px);
  padding-bottom: max(16.5rem, 70px);
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #entry .entry__wrapper {
    flex-direction: column-reverse;
  }
}
section#recruit-commonSection #entry .entry__wrapper .btnBox {
  width: 100%;
}
section#recruit-commonSection #entry .entry__wrapper .btnBox--pc {
  display: block;
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #entry .entry__wrapper .btnBox--pc {
    display: none;
  }
}
section#recruit-commonSection #entry .entry__wrapper .btnBox--sp {
  display: none;
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #entry .entry__wrapper .btnBox--sp {
    display: block;
    margin-top: max(10rem, 30px);
  }
}
section#recruit-commonSection #entry .entry__wrapper .btnBox .btn {
  width: 100%;
}
section#recruit-commonSection #entry .entry__wrapper .btnBox .btn:not(:first-of-type) {
  margin-top: max(4.5rem, 30px);
  padding-top: max(4.5rem, 30px);
  border-top: 1px solid rgba(59, 49, 40, 0.15);
}
section#recruit-commonSection #entry .entry__wrapper .btnBox .btn__link {
  width: 100%;
  justify-content: space-between;
}
section#recruit-commonSection #entry .entry__wrapper .entry__text {
  flex-shrink: 0;
  flex: 1;
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: space-between;
}
section#recruit-commonSection #entry .entry__wrapper .entry__image {
  width: max(72rem, 300px);
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #entry .entry__wrapper .entry__image {
    width: 100%;
  }
}
section#recruit-commonSection #entry .entry__wrapper .entry__image > img {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1000px) {
  section#recruit-commonSection #entry .entry__wrapper .entry__image > img {
    aspect-ratio: 5/3;
    height: auto;
  }
}

section#quality-commonSection {
  background: #fff;
}
section#quality-commonSection .quality-commonSection__wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding-top: max(13rem, 50px);
  padding-bottom: max(13rem, 60px);
}
@media screen and (max-width: 1000px) {
  section#quality-commonSection .quality-commonSection__wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 1000px) {
  section#quality-commonSection .quality-commonSection__wrapper .btn:nth-of-type(3n-2) {
    border-right: 1px solid #c2c0be;
    padding-right: 10%;
  }
  section#quality-commonSection .quality-commonSection__wrapper .btn:nth-of-type(3n-1) {
    border-right: 1px solid #c2c0be;
    padding-left: 10%;
    padding-right: 10%;
  }
  section#quality-commonSection .quality-commonSection__wrapper .btn:nth-of-type(3n) {
    margin-left: 10%;
  }
}
@media screen and (max-width: 1000px) {
  section#quality-commonSection .quality-commonSection__wrapper .btn:nth-of-type(2n-1) {
    border-right: 1px solid #c2c0be;
    padding-right: 5%;
  }
  section#quality-commonSection .quality-commonSection__wrapper .btn:nth-of-type(2n) {
    padding-left: 5%;
  }
}
section#quality-commonSection .quality-commonSection__wrapper .btn a {
  width: 100%;
  margin-top: max(2rem, 15px);
  margin-bottom: max(2rem, 15px);
}/*# sourceMappingURL=style.css.map */