@charset "UTF-8";
/*==========================================
変数 inc.scss
===========================================*/
/*==========================================
変数 fonts.scss
===========================================*/
/*===================================
userSS 追加
=====================================*/
/*==========================================
#header
===========================================*/
.header_logo_block {
  fill: #fff;
  width: 100%;
  text-align: center;
  display: block; }
  .header_logo_block .header_logo {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-block: clamp(10rem, 7.8125vw, 15rem); }
    @media screen and (max-width: 960px) {
      .header_logo_block .header_logo {
        padding-block: clamp(8rem, 10.4166666667vw, 10rem); } }
  .header_logo_block a {
    display: flex;
    justify-content: center;
    align-items: center; }
  .header_logo_block .logo {
    height: auto;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
    font-size: 0; }
    .header_logo_block .logo .st0 {
      fill: #fff; }

/*==========================================
#footer
===========================================*/
#footer.subpage .footer_navArea .navArea_inner {
  justify-content: center; }
#footer.subpage .footer_navArea .navArea_body {
  align-items: center; }
#footer.subpage .footer_navArea .navArea_list_wrap {
  justify-content: center; }
  #footer.subpage .footer_navArea .navArea_list_wrap.list04 {
    margin-bottom: 0; }
#footer.subpage .footer-link .link-sns {
  margin: 0; }

/*==========================================
subpage
===========================================*/
.subpage {
  background: #e4ecec;
  height: 100%; }
  .subpage .sec-subpage {
    position: relative; }
  .subpage .ttl-borderR .ttl-border.show::after {
    width: 100%;
    max-width: 3em; }
  .subpage .ttl-block-wrap {
    max-width: 100%;
    text-align: center;
    margin-inline: auto;
    position: relative; }
  .subpage .ttl-area-wrap {
    max-width: 100%;
    text-align: center;
    margin-inline: auto;
    position: relative; }
  .subpage .ttl-area {
    background: #fff;
    max-width: 1280px;
    margin-inline: auto; }
    @media screen and (min-width: 961px) {
      .subpage .ttl-area {
        padding: 0 5em 6em;
        width: 90vw; } }
    @media screen and (max-width: 960px) {
      .subpage .ttl-area {
        padding: 0 4% 5em; } }
  .subpage .cts-ttl {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    flex-direction: column; }
    @media screen and (max-width: 960px) {
      .subpage .cts-ttl {
        justify-content: flex-start; } }
    @media screen and (max-width: 576px) {
      .subpage .cts-ttl {
        justify-content: flex-start;
        align-items: flex-start;
        flex-direction: column; } }
    .subpage .cts-ttl.absolute {
      position: absolute;
      left: 0; }
  .subpage .cts-ttl-en {
    letter-spacing: 0.05em;
    font-weight: 400;
    margin-bottom: 0rem;
    font-size: clamp(2.8rem, 1.5625vw, 3rem);
    line-height: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 0.25em; }
  .subpage .cts-ttl-ja {
    font-size: clamp(1.4rem, 0.9375vw, 1.8rem); }
  .subpage .page-ttl {
    margin: 0;
    text-align: center;
    font-size: clamp(3rem, 3.9583333333vw, 7.6rem);
    font-weight: 500;
    letter-spacing: 0.1em; }
    @media screen and (max-width: 960px) {
      .subpage .page-ttl {
        font-size: clamp(3rem, 7.9166666667vw, 7.6rem);
        margin: 60px 0 clamp(6rem, 6.25vw, 12rem); } }
  .subpage .page-ttl-en {
    margin-top: -1.5em;
    margin-bottom: 40px;
    letter-spacing: 0.05em;
    font-weight: 500;
    font-size: clamp(3rem, 3.125vw, 6rem);
    line-height: 1;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    position: relative; }
    .subpage .page-ttl-en.show::after {
      width: 110%; }
    .subpage .page-ttl-en::after {
      width: 0%;
      display: inline-block;
      height: 1px;
      background: #fff;
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translate(-50%, 0);
      transition: all 1.0s ease-in-out .3s; }
    .subpage .page-ttl-en .en01 {
      font-size: clamp(5rem, 9.7916666667vw, 18.8rem); }
    .subpage .page-ttl-en .en02 {
      font-size: clamp(2.6rem, 3.125vw, 6rem); }
  .subpage .page-ttl-ja {
    font-size: clamp(1.8rem, 1.875vw, 3.6rem);
    letter-spacing: 0.1em;
    font-weight: 500; }
    @media screen and (max-width: 960px) {
      .subpage .page-ttl-ja {
        font-size: clamp(1.8rem, 3.75vw, 3.6rem); } }
    .subpage .page-ttl-ja.fwB {
      font-weight: bold; }
  .subpage .page-txt {
    text-align: center;
    font-size: clamp(1.4rem, 0.8333333333vw, 1.6rem);
    letter-spacing: 0.1em;
    font-weight: 500;
    line-height: clamp(3.2rem, 2.1875vw, 4.2rem); }
    @media screen and (max-width: 960px) {
      .subpage .page-txt {
        text-align: center; }
        .subpage .page-txt .pc-none {
          display: none; } }
    .subpage .page-txt.borderTB::before {
      content: "";
      display: block;
      width: 1px;
      height: clamp(35px, 5vw, 50px);
      background: #000;
      margin: 0 auto clamp(2rem, 2.0833333333vw, 4rem); }
    @media screen and (max-width: 960px) {
      .subpage .page-txt.borderTB::before {
        margin: 0 auto clamp(1rem, 2.0833333333vw, 2rem); } }
  .subpage .backTopBtn-wrap {
    margin-top: clamp(30px, 7.8125vw, 150px); }

/*======================================================
 notfound
=======================================================*/
.page-notfound.subpage .ttl-area {
  background: #e4ecec; }
.page-notfound .btn-more-wrap a {
  background: #fff;
  max-width: 320px;
  width: 100%;
  padding: 1.5em;
  border-radius: 100vmax; }
  @media (hover: hover) {
    .page-notfound .btn-more-wrap a:hover {
      background: #000;
      color: #fff;
      fill: #fff; } }
.page-notfound .btn-more-wrap .btn-link {
  width: fit-content;
  margin: 0 auto; }

/*======================================================
 THANKS
=======================================================*/
/*==========================================
 【TOP】
===========================================*/
.backTopBtn-wrap {
  display: flex;
  align-items: center;
  margin-top: clamp(80px, 7.8125vw, 150px); }
  .backTopBtn-wrap.Left {
    justify-content: flex-start; }
  .backTopBtn-wrap.Right {
    justify-content: flex-end; }
  .backTopBtn-wrap.Center {
    justify-content: center; }
  @media screen and (max-width: 960px) {
    .backTopBtn-wrap.sp_Center {
      justify-content: center; } }
  .backTopBtn-wrap.wht .backTopBtn {
    display: inline-block;
    border: 1px solid #000000;
    border-radius: 0px;
    color: #333333;
    letter-spacing: 0.2em;
    padding: 0.6em 2em;
    position: relative;
    overflow: hidden;
    z-index: 2;
    transition: 0.3s ease-in-out;
    background: #000000; }
    .backTopBtn-wrap.wht .backTopBtn.normal::before {
      content: "";
      width: 120%;
      height: 200%;
      position: absolute;
      top: -50%;
      right: 0;
      background: #333333;
      border-radius: 0 100% 100% 0;
      transform: translateX(-100%);
      transition: transform ease 0.3s;
      z-index: -1; }
    .backTopBtn-wrap.wht .backTopBtn.bgLeft:before {
      content: "";
      /*絶対配置で位置を指定*/
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
      /*色や形状*/
      background: #333333;
      /*背景色*/
      width: 120%;
      height: 200%;
      /*アニメーション*/
      transition: transform 0.6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
      transform: scale(0, 1);
      transform-origin: right top; }
  .backTopBtn-wrap .btn-txt {
    position: relative;
    z-index: 1;
    font-size: clamp(1.4rem, 0.9375vw, 1.8rem);
    font-weight: 600; }
    @media screen and (min-width: 376px) {
      .backTopBtn-wrap .btn-txt {
        margin-right: 1em; } }
    @media screen and (max-width: 960px) {
      .backTopBtn-wrap .btn-txt {
        white-space: nowrap; } }
    @media screen and (max-width: 375px) {
      .backTopBtn-wrap .btn-txt {
        margin-bottom: 1em; } }
  .backTopBtn-wrap .backTopBtn {
    display: inline-block;
    border: 1px solid #000000;
    border-radius: 0px;
    color: #000000;
    letter-spacing: 0.2em;
    padding: 0.6em 2em;
    position: relative;
    overflow: hidden;
    z-index: 2;
    transition: 0.3s ease-in-out;
    background: #fff; }
    .backTopBtn-wrap .backTopBtn.normal::before {
      content: "";
      width: 120%;
      height: 200%;
      position: absolute;
      top: -50%;
      right: 0;
      background: #000000;
      border-radius: 0 100% 100% 0;
      transform: translateX(-100%);
      transition: transform ease 0.3s;
      z-index: -1; }
    .backTopBtn-wrap .backTopBtn.bgLeft:before {
      content: "";
      /*絶対配置で位置を指定*/
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
      /*色や形状*/
      background: #000000;
      /*背景色*/
      width: 120%;
      height: 200%;
      /*アニメーション*/
      transition: transform 0.6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
      transform: scale(0, 1);
      transform-origin: right top; }
  .backTopBtn-wrap .item-more-flex {
    display: flex;
    align-items: center; }
    @media screen and (max-width: 375px) {
      .backTopBtn-wrap .item-more-flex {
        flex-direction: column; } }

@media (hover: hover) {
  .item-more-hover:hover:hover .backTopBtn.normal {
    color: #fff; }
    .item-more-hover:hover:hover .backTopBtn.normal::before {
      transform: translateX(10%); }
  .item-more-hover:hover:hover .backTopBtn.bgLeft {
    color: #fff; }
    .item-more-hover:hover:hover .backTopBtn.bgLeft::before {
      transform-origin: left top;
      transform: scale(1, 1); }
  .item-more-hover:hover:hover .backTopBtn.wht {
    color: #fff; }
    .item-more-hover:hover:hover .backTopBtn.wht::before {
      transform-origin: left top;
      transform: scale(1, 1); } }

/*# sourceMappingURL=subpage.css.map */
