@charset "UTF-8";
/*--------------------------------------------------------------
reset.min.css
リセット関係・clearfixなど

fonts.min.css
フォントアイコンを記載したcss

common.css
レイアウト、TOPのスタイルを記載したcss

sub.css
下層のレイアウトを記載したcss
--------------------------------------------------------------*/
/* ---------------------------------------------------------- */
/* Common */
* html body {
  background: url(null) fixed;
}
html {
  overflow-x: hidden;
  font-size: 62.5%;
}
body {
  width: 100%;
  padding: 0;
  font-family: "Zen Old Mincho", serif;
  -webkit-text-size-adjust: 100%;
  background: var(--blk-color);
  color: var(--wht-color);
  position: relative;
  text-align: left;
  font-size: 1.6rem;
  line-height: normal;
  letter-spacing: 0.085rem;
  font-weight: 400;
  font-style: normal;
}
h1, h2, h3, h4, h5, h6, p {
  margin: 0;
  font-weight: 400;
}
ol, ul, menu {
  padding: 0;
}
p {
  font-size: 1.7rem;
  line-height: 4.6rem;
}
a {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
.base {
  position: relative;
  z-index: 2;
}
.inner {
  max-width: 144rem;
  width: 90%;
  margin: 0 auto;
}
.inner.header-inner {
  max-width: 100%;
}
.inner.top-hero-inner {
  max-width: 96.4rem;
}
.inner.top-about-inner {
  max-width: 100rem;
}
.inner.top-stance-inner {
  max-width: 82rem;
}
.inner.top-contact-inner {
  max-width: 95.7rem;
}
.inner.top-message-inner {
  max-width: 88rem;
}
.inner.top-dealer-inner {
  max-width: 98.9rem;
}
.flex-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}
.vertical {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
  -ms-text-orientation: upright;
  text-orientation: upright;
  margin: 0 0 0 auto;
  overflow: hidden;
}
.center {
  text-align: center;
}
.dash {
  width: 100px;
  height: 1px;
  background: var(--wht-color);
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px;
}
.vertical .dash {
  width: 1px;
  height: 55px;
  margin: 10px auto 0;
  vertical-align: baseline;
}
#wrap {
  display: block;
}
img {
  margin: 0;
  padding: 0;
  border: 0;
  max-width: 100%;
  height: auto;
}
@media (min-width: 768px) {
  .spnone {
    display: block !important;
  }
  .pcnone {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .spnone {
    display: none !important;
  }
  .pcnone {
    display: block !important;
  }
}
.clip-mask {
  -webkit-clip-path: inset(0 0 0 0);
  clip-path: inset(0 0 0 0);
  position: relative;
  z-index: 1;
  width: 100%;
  /* overflow: hidden; */
}
.clip-mask .clip-bg {
  width: 100%;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: auto;
  z-index: -1;
}
.head-box .main-ttl {
  font-size: 4rem;
  letter-spacing: 1.2rem;
  margin-bottom: 6rem;
}
.head-box .main-txt {
  font-size: 2.2rem;
  line-height: 5.5rem;
  letter-spacing: 0.3rem;
}
.square-btn {
  max-width: 50rem;
  margin: 0 auto;
}
.square-btn input, .square-btn button, .square-btn a {
  flex-wrap: wrap;
  padding: 1.3rem 0.6rem;
  border: 1px solid var(--blk-color);
  background: var(--blk-color);
  color: var(--wht-color);
  font-size: 1.5rem;
  line-height: normal;
  letter-spacing: 0.225rem;
  -webkit-appearance: none;
  margin: 0 auto;
  cursor: pointer;
  transition: 0.3s;
  max-width: 20.9rem;
  width: 100%;
}
.square-btn-wh input, .square-btn-wh button, .square-btn-wh a {
  background: var(--wht-color);
  color: var(--blk-color);
}
.square-btn input:hover, .square-btn button:hover, .square-btn a:hover {
  background: var(--wht-color);
  color: var(--blk-color);
}
.square-btn-wh input:hover, .square-btn-wh button:hover, .square-btn-wh a:hover {
  background: var(--blk-color);
  color: var(--wht-color);
}
.square-btn input:not(:last-of-type), .square-btn button:not(:last-of-type), .square-btn a:not(:last-of-type) {
  margin-right: 1.5rem;
}
.square-btn input:hover, .square-btn button:hover, .square-btn a:hover {
  opacity: 0.7;
}
.header-link-btn .link-btn-txt {
  display: block;
  text-align: center;
}
.header-link-btn .link-btn-txt {
  font-size: 1.5rem;
  line-height: normal;
}
.view_more_btn .arw_rgt {
  overflow: hidden;
  position: absolute;
  right: 5%;
  bottom: 5%;
  margin: auto;
  width: 38px;
  height: 27px;
}
.view_more_btn .arw_rgt:before, .view_more_btn .arw_rgt:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  animation-fill-mode: both;
  animation-duration: 0.6s;
  background: url(../img/icon_arrow_viewmore.svg) center / cover no-repeat;
}
.view_more_btn .arw_rgt:after {
  transform: translateX(-100%);
}
.view_more_btn .arw_rgt:before {
  animation-name: transformLeftRight;
  animation-delay: 0.2s;
}
.view_more_btn .arw_rgt:after {
  animation-name: transformRightLeft;
}
.view_more_btn:hover .arw_rgt:before {
  animation-name: transformRightLeft;
  animation-delay: 0s;
}
.view_more_btn:hover .arw_rgt:after {
  animation-name: transformLeftRight;
  animation-delay: 0.2s;
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .header-link-btn.line2 .link-btn-txt::before {
    top: 150%;
  }
}
@media (max-width: 767px) {
  p {
    font-size: 1.4rem;
    line-height: 2.8rem;
  }
  .inner.top-dealer-inner {
    width: 100%;
  }
  .vertical .dash {
    height: 30px;
    margin: 5px auto 0;
  }
  .head-box .main-ttl {
    font-size: 2.2rem;
    letter-spacing: 0.66rem;
    margin-bottom: 2.5rem;
  }
  .head-box .main-txt {
    font-size: 1.5rem;
    line-height: 3rem;
    letter-spacing: 0.2rem;
  }
  .square-btn input, .square-btn button, .square-btn a {
    font-size: 1.3rem;
  }
  .view_more_btn .arw_rgt {
    width: 17px;
    height: 12px;
    bottom: 7%;
  }
}
/* ---------------------------------------------------------- */
/* Animation */
/* フェードイン */
.FadeIn {
  opacity: 0;
  transition-duration: 1.2s;
  transition-delay: 0.5s;
}
.FadeIn.is-show {
  opacity: 1;
}
/* 上へ */
.InUp {
  opacity: 0;
  transform: translate(0, 60px);
  -webkit-transform: translate(0, 60px);
  transition: 1s;
}
.InUp.is-show {
  opacity: 1;
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
}
/* 左へ */
.InLft {
  opacity: 0;
  transform: translate(60px, 0);
  -webkit-transform: translate(60px, 0);
  transition: 1s;
}
.InLft.is-show {
  opacity: 1;
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
}
/* 右へ */
.InRgt {
  opacity: 0;
  transform: translate(-60px, 0);
  -webkit-transform: translate(-60px, 0);
  transition: 1s;
}
.InRgt.is-show {
  opacity: 1;
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
}
/* ステッカー横 */
.StickerX {
  -webkit-clip-path: inset(0 100% 0 0);
  clip-path: inset(0 100% 0 0);
  transition: 1s cubic-bezier(0.37, 0, 0.63, 1);
  transition-property: clip-path;
}
.StickerX.is-show {
  -webkit-clip-path: inset(0);
  clip-path: inset(0);
}
/* ステッカー縦 */
.StickerY {
  -webkit-clip-path: inset(0 0 100% 0);
  clip-path: inset(0 0 100% 0);
  transition: 1s cubic-bezier(0.37, 0, 0.63, 1);
  transition-property: clip-path;
}
.StickerY.is-show {
  -webkit-clip-path: inset(0);
  clip-path: inset(0);
}
/* マトリックス */
.Matrix .bg_wrap {
  overflow: hidden;
  opacity: 0;
  display: block;
}
.Matrix .bg_wrap .inn {
  opacity: 0;
  transform: Matrix(1, 0, 0, 1, 0, 100);
  transition-duration: 1s;
  transition-delay: 0.2s;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
  display: inline-block;
}
.Matrix.is-show .bg_wrap {
  opacity: 1;
  width: 100%;
}
.Matrix.is-show .bg_wrap .inn {
  opacity: 1;
  transform: Matrix(1, 0, 0, 1, 0, 0);
  display: inline-block;
  width: 100%;
}
/* フォーカス */
.FocusIn {
  opacity: 0;
}
.FocusIn.is-show {
  -webkit-animation: FocusIn 0.6s cubic-bezier(0.550, 0.085, 0.680, 0.530) 0.2s both;
  animation: FocusIn 0.6s cubic-bezier(0.550, 0.085, 0.680, 0.530) 0.2s both;
}
@-webkit-keyframes FocusIn {
  0% {
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes FocusIn {
  0% {
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
/* 表示までの時間 */
.in01 {
  animation-delay: 0.5s !important;
  transition-delay: 0.5s !important;
}
/* ---------------------------------------------------------- */
/* Header */
@media (min-width: 768px) {
  .pc_main-header {
    z-index: 10000;
    width: 100%;
    padding: 2.7rem 3% 2.7rem 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    -webkit-overflow-scrolling: touch;
    backface-visibility: hidden;
    background: var(--blk-color);
    color: var(--wht-color);
    min-height: 8rem;
  }
  .pc_main-header.is-follow-fixed, .sub_page .pc_main-header {
    position: fixed;
    top: 0;
    left: 0;
  }
  .pc_main-header .logo {
    width: 33%;
  }
  .pc_main-header .logo a {
    display: flex;
    transition: all 0.5s;
  }
  .pc_main-header .logo a:hover {
    opacity: 0.7;
  }
  .pc_main-header .name {
    font-size: 1.8rem;
    width: 33%;
    letter-spacing: 0.54rem;
  }
  .pc_main-header .link-list {
    width: 33%;
  }
  .pc_main-header .link-list .list-item {
    width: 100%;
    max-width: max-content;
  }
  .pc_main-header .link-list .list-item a {
    width: 100%;
    display: block;
    transition: all 0.5s;
  }
  .pc_main-header .link-list .list-item a:hover {
    opacity: 0.7;
  }
  .pc_main-header .inner {
    width: 100%;
  }
  .pc_main-header .link-list .list-item.icon a {
    width: 20px;
    height: 20px;
  }
  .sp_main-header, .hamburger_nav {
    display: none;
  }
  .tablet {
    display: none;
  }
}
@media (max-width: 1220px) {
  .tablet {
    display: block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .pc_main-header .link-list {
    display: none;
  }
  .pc_main-header .name {
    text-align: right;
  }
}
@media (max-width: 767px) {
  .is-locked {
    overflow: hidden;
  }
  .sp_main-header {
    width: 100%;
    justify-content: space-between;
    align-items: center;
    z-index: 10000;
    padding: 18px 5%;
    background: var(--blk-color);
    color: var(--wht-color);
    min-height: 5.2rem;
  }
  .is-show-nav .sp_main-header {
    padding: 18px 5%;
  }
  .sp_main-header.is-follow-fixed, .is-show-nav .sp_main-header, .sub_page .sp_main-header {
    position: fixed;
    top: 0;
    left: 0;
  }
  .sp_main-header.is-header-clr-bg-wh::before {
    content: "";
    background: var(--wht-color);
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    filter: invert(100%);
  }
  .sp_main-header a {
    display: flex;
    align-items: center;
  }
  .sp_main-header .logo {
    width: 28%;
    max-width: 91px;
  }
  .sp_main-header .logo a {
    display: flex;
  }
  .sp_main-header .name {
    width: 67%;
    text-align: right;
    letter-spacing: 0.26rem;
    font-size: 1.3rem;
  }
  .is-show-nav .sp_main-header .logo {
    width: 28%;
  }
  .sp_main-header .header-link {
    max-width: max-content;
    width: 50%;
    margin: 0 0 0 auto;
  }
  .hamburger {
    cursor: pointer;
    width: 18px;
    height: 15px;
    top: 8px;
    right: 15px;
    transition: all 0.2s linear;
    z-index: 9999;
  }
  .hamburger button {
    min-height: inherit;
    position: relative;
    width: 100%;
    height: 100%;
    outline: none;
  }
  .hamburger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--wht-color);
    border-radius: 4px;
  }
  .hamburger_nav {
    visibility: hidden;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9998;
    transition: all 0.6s cubic-bezier(0.61, 1, 0.88, 1);
    background: rgba(0, 0, 0, 0.85);
    color: var(--wht-color);
    transform: translateX(100%);
  }
  .is-show-nav .hamburger_nav {
    visibility: visible;
    transform: translateX(0);
    transition: all 0.6s cubic-bezier(0.61, 1, 0.88, 1);
  }
  .hamburger button {
    min-height: inherit;
    position: relative;
    width: 100%;
    height: 100%;
    outline: none;
  }
  .hamburger, .hamburger span {
    display: inline-block;
    transition: all .5s;
    box-sizing: border-box;
  }
  .hamburger span:nth-of-type(1) {
    -webkit-animation: hamburger-bar01 .75s forwards;
    animation: hamburger-bar01 .75s forwards;
    top: 0;
  }
  @-webkit-keyframes hamburger-bar01 {
    0% {
      -webkit-transform: translateY(20px) rotate(45deg);
    }
    50% {
      -webkit-transform: translateY(20px) rotate(0);
    }
    100% {
      -webkit-transform: translateY(0) rotate(0);
    }
  }
  @keyframes hamburger-bar01 {
    0% {
      transform: translateY(20px) rotate(45deg);
    }
    50% {
      transform: translateY(20px) rotate(0);
    }
    100% {
      transform: translateY(0) rotate(0);
    }
  }
  .hamburger span:nth-of-type(2) {
    transition: all .25s .25s;
    opacity: 1;
    top: 7px;
  }
  .hamburger span:nth-of-type(3) {
    bottom: 0;
    -webkit-animation: hamburger-bar03 .75s forwards;
    animation: hamburger-bar03 .75s forwards;
  }
  @-webkit-keyframes hamburger-bar03 {
    0% {
      -webkit-transform: translateY(-20px) rotate(-45deg);
    }
    50% {
      -webkit-transform: translateY(-20px) rotate(0);
    }
    100% {
      -webkit-transform: translateY(0) rotate(0);
    }
  }
  @keyframes hamburger-bar03 {
    0% {
      transform: translateY(-20px) rotate(-45deg);
    }
    50% {
      transform: translateY(-20px) rotate(0);
    }
    100% {
      transform: translateY(0) rotate(0);
    }
  }
  .hamburger.is-open span:nth-of-type(1) {
    -webkit-animation: active-hamburger-bar01 .75s forwards;
    animation: active-hamburger-bar01 .75s forwards;
  }
  @-webkit-keyframes active-hamburger-bar01 {
    0% {
      -webkit-transform: translateY(0) rotate(0);
    }
    50% {
      -webkit-transform: translateY(7px) rotate(0);
    }
    100% {
      -webkit-transform: translateY(7px) rotate(45deg);
    }
  }
  @keyframes active-hamburger-bar01 {
    0% {
      transform: translateY(0) rotate(0);
    }
    50% {
      transform: translateY(7px) rotate(0);
    }
    100% {
      transform: translateY(7px) rotate(45deg);
    }
  }
  .hamburger.is-open span:nth-of-type(2) {
    opacity: 0;
  }
  .hamburger.is-open span:nth-of-type(3) {
    -webkit-animation: active-hamburger-bar03 .75s forwards;
    animation: active-hamburger-bar03 .75s forwards;
  }
  @-webkit-keyframes active-hamburger-bar03 {
    0% {
      -webkit-transform: translateY(0) rotate(0);
    }
    50% {
      -webkit-transform: translateY(-7px) rotate(0);
    }
    100% {
      -webkit-transform: translateY(-7px) rotate(-45deg);
    }
  }
  @keyframes active-hamburger-bar03 {
    0% {
      transform: translateY(0) rotate(0);
    }
    50% {
      transform: translateY(-7px) rotate(0);
    }
    100% {
      transform: translateY(-7px) rotate(-45deg);
    }
  }
  .hamburger_nav .inner {
    width: 100%;
    height: 100%;
    position: relative;
    overflow-y: scroll;
    padding: 8.6rem 5% 2.8rem;
  }
  .hamburger_nav .link-list {
    height: 100%;
    align-content: center;
    position: relative;
    top: -5%;
    display: flex;
    flex-wrap: wrap;
  }
  .hamburger_nav .list-item {
    margin-bottom: 2rem;
    width: 100%;
  }
  .hamburger_nav .list-item a, .hamburger_nav .list-item span {
    display: block;
  }
}
/* ---------------------------------------------------------- */
/* Hero */
.top-hero {
  -webkit-clip-path: inset(0 0 0 0);
  clip-path: inset(0 0 0 0);
}
.top-hero .main-box {
  height: calc(100svh - 8rem);
  display: flex;
  justify-content: center;
  align-items: center;
}
.top-hero .main-box .inner {
  position: relative;
  top: -5%;
}
.top-hero .main-box h1 {
  margin: 0 auto 4.4rem;
}
.top-hero .main-box h1 img {
  margin: 0 auto;
}
.top-hero .main-box h1 .btm {
  width: 39%;
  margin-top: 9%;
}
.top-hero .main-box h2 {
  min-height: max-content;
  max-height: max-content;
  line-height: normal;
  margin: auto 0;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  transition-delay: 0.5s;
}
.top-hero .main-box p {
  font-size: 2.1rem;
  line-height: 3.7rem;
}
.top-hero .scroll-down {
  position: absolute;
  z-index: 3;
  right: 3%;
  bottom: 5%;
  transition-delay: 0.8s;
  width: 1px;
}
.top-hero .scroll-down::after {
  content: '';
  display: inline-block;
  position: absolute;
  z-index: 4;
  background-color: var(--wht-color);
  left: 0;
  bottom: 0;
  transform: translateX(-50%);
  width: 1px;
  height: 82px;
  animation: scroll-down 2.5s infinite;
}
@keyframes scroll-down {
  0% {
    transform: scale(1, 0);
    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(1, 0);
    transform-origin: 0 100%;
  }
}
.top-hero .slide_box {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}
.top-hero .slide_box .swiper-wrapper {
  position: fixed;
  z-index: -1;
}
.top-hero .slide_box .swiper-slide {
  height: 100vh;
}
.top-hero .slide_box img {
  -webkit-transition: 7s 1s ease-out;
  transition: 7s 1s ease-out;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.top-hero .slide_box .swiper-slide[class*=-active] img {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}
@media (min-width: 768px) {
  .top-hero .main-box h1 {
    max-width: 62.7rem;
    width: 90%;
  }
  .top-hero .main-box h2 {
    font-size: 2.5rem;
    letter-spacing: 1.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .top-hero .main-box .inner {
    width: 93%;
  }
  .top-hero .main-box h1 {
    width: 75%;
  }
  .top-hero .main-box h1 img {
    max-width: 450px;
  }
  .top-hero .main-box h2 {
    font-size: 2rem;
    margin-top: 8.1rem;
    letter-spacing: 0.9rem;
  }
}
@media (max-width: 767px) {
  .top-hero .main-box {
    height: calc(100vh - 5.1rem);
    height: calc(100svh - 5.1rem);
  }
  .top-hero .main-box .inner {
    position: initial;
  }
  .top-hero .main-box h1 {
    max-width: 25rem;
    width: 75%;
    margin-bottom: 1.8rem;
  }
  .top-hero .main-box p {
    font-size: 1.1rem;
    line-height: 2.6rem;
    letter-spacing: 0.105rem;
  }
  .top-hero .main-box .head-box {
    position: relative;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
  }
  .top-hero .main-box h2 {
    font-size: 1.6rem;
    letter-spacing: 0.7rem;
    left: 5%;
  }
  .top-hero .main-box h2.FadeIn {
    -webkit-clip-path: inset(0 0 100% 0);
    clip-path: inset(0 0 100% 0);
    transition: 1s cubic-bezier(0.37, 0, 0.63, 1);
    transition-property: clip-path;
    transition-delay: 0.8s !important;
  }
  .top-hero .main-box h2.FadeIn.is-show {
    clip-path: inset(0);
  }
  .top-hero .slide_box .swiper-slide[class*=-active] img {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
/* ---------------------------------------------------------- */
/* About */
.top-about {
  padding: 21.6rem 0 26.3rem;
}
.top-about .head-box {
  margin-bottom: 7rem;
}
.top-about .head-box .main-ttl {
  font-size: 4.8rem;
  letter-spacing: 1.4rem;
  margin-bottom: 2rem;
}
.top-about .txt-box {
  align-items: flex-start;
}
.top-about .txt-box h3 {
  font-size: 2.2rem;
  line-height: 5rem;
  letter-spacing: 1.2rem;
  min-width: 2rem;
  margin: 1.5rem 0 0;
  max-height: max-content;
  min-height: max-content;
  ;
}
.top-about .txt-box .txt {
  flex: 1;
  padding-left: 13%;
}
.top-about .txt-box h4 {
  font-size: 2.2rem;
  line-height: 5.5rem;
  margin-bottom: 5rem;
  letter-spacing: 0.15rem;
}
.top-about .clip-bg {
  background: url(../img/top_about_bg-01.jpg) center / cover no-repeat;
}
@media (max-width: 767px) {
  .top-about {
    padding: 23.5rem 0 12.2rem;
  }
  .top-about .head-box {
    margin-bottom: 3.5rem;
  }
  .top-about .head-box .main-ttl {
    font-size: 2.2rem;
    letter-spacing: 0.66rem;
    margin-bottom: 1rem;
  }
  .top-about .txt-box h3 {
    font-size: 1.6rem;
    line-height: 3.5rem;
    letter-spacing: 0.6rem;
    min-width: 1.5rem;
    margin: 10px 0 0;
    position: sticky;
    top: 15rem;
  }
  .top-about .txt-box .txt {
    padding-left: 10%;
  }
  .top-about .txt-box h4 {
    font-size: 1.5rem;
    line-height: 3rem;
    margin-bottom: 2.8rem;
    letter-spacing: 0.1rem;
  }
  .top-about .clip-bg {
    background: url(../img/sp_top_about_bg-01.jpg) center / cover no-repeat;
  }
}
/* ---------------------------------------------------------- */
/* Stance */
.top-stance {
  padding: 29.5rem 0 34rem;
}
.top-stance .head-box {
  margin-bottom: 7.5rem;
}
.top-stance .txt-box {
  align-items: flex-start;
}
.top-stance .txt-box h3 {
  font-size: 2.2rem;
  line-height: 5rem;
  letter-spacing: 1.2rem;
  min-width: 7.3rem;
  position: sticky;
  top: 15rem;
  margin: 1.5rem 0 0;
  max-height: max-content;
  min-height: max-content;
  ;
}
.top-stance .txt-box p {
  flex: 1;
  padding-left: 23%;
}
.top-stance .clip-bg {
  background: url(../img/top_stance_bg-01.jpg) center / cover no-repeat;
}
@media (max-width: 767px) {
  .top-stance {
    padding: 10.6rem 0 12.3rem;
  }
  .top-stance .head-box {
    margin-bottom: 3.5rem;
  }
  .top-stance .txt-box {
    display: block;
  }
  .top-stance .txt-box h3 {
    font-size: 1.6rem;
    line-height: 3.5rem;
    letter-spacing: 0.6rem;
    min-width: 5.7rem;
    margin: 0 auto 3.5rem;
    position: initial;
  }
  .top-stance .txt-box .vertical .dash {
    height: 30px;
    margin: 5px auto;
  }
  .top-stance .txt-box p {
    width: 100%;
    max-width: max-content;
    margin: 0 auto;
    padding-left: 0;
  }
  .top-stance .clip-bg {
    background: url(../img/sp_top_stance_bg-01.jpg) center / cover no-repeat;
  }
}
/* ---------------------------------------------------------- */
/* Type */
.top-type {
  background: var(--blk-color);
  padding: 19.7rem 0 25.6rem;
}
.top-type .head-box {
  margin-bottom: 12.5rem;
}
.top-type .head-box .main-ttl {
  font-size: 2.2rem;
  margin-bottom: 5rem;
  letter-spacing: 0.66rem;
}
.top-type .type-list {
  flex-wrap: wrap;
}
.top-type .list-item {
  max-width: 50%;
  width: 100%;
  height: 100%;
  aspect-ratio: 360 / 227;
  z-index: 2;
  overflow: hidden;
}
.top-type .list-item .thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  object-fit: cover;
  width: 100%;
  height: 100%;
  filter: saturate(0%);
  transition: all 0.5s;
}
.top-type .list-item .thumbnail::before {
  content: "";
  background: var(--blk-color);
  opacity: 0.4;
  mix-blend-mode: multiply;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.5s;
}
.top-type .list-item:hover .thumbnail {
  filter: saturate(100%);
  transform: scale(1.05);
}
.top-type .list-item:hover .thumbnail::before {
  opacity: 0;
}
.top-type .list-item p {
  font-size: 0.9rem;
  letter-spacing: 0.126rem;
  position: absolute;
  bottom: 5%;
  left: 5%;
  padding-right: 85px;
}
.top-type .list-item span {
  display: inline-block;
  vertical-align: middle;
}
.top-type .list-item .en {
  font-size: 4rem;
  letter-spacing: 0.8rem;
  margin-right: 1.5rem;
}
.top-type .list-item .ja {
  font-size: 1.4rem;
  letter-spacing: 0.21rem;
}
.top-type .list-item .txt {
  font-size: 2rem;
  letter-spacing: 0.28rem;
  line-height: 3.5rem;
}
@media (max-width: 767px) {
  .top-type {
    padding: 7.5rem 0 9.6rem;
  }
  .top-type .head-box {
    margin-bottom: 8rem;
  }
  .top-type .head-box .main-ttl {
    font-size: 1.6rem;
    margin-bottom: 2rem;
    letter-spacing: 0.29rem;
  }
  .top-type .list-item {
    max-width: 100%;
    margin-bottom: 2rem;
  }
  .top-type .list-item .en {
    font-size: 1.9rem;
    letter-spacing: 0.38rem;
    margin-right: 0.7rem;
  }
  .top-type .list-item .ja {
    font-size: 0.9rem;
    letter-spacing: 0.09rem;
  }
  .top-type .list-item .txt {
    font-size: 1.2rem;
    letter-spacing: 0.126rem;
    line-height: 2rem;
  }
}
/* ---------------------------------------------------------- */
/* Message */
.top-message {
  padding: 17rem 0 19rem;
}
.top-message .txt-box {
  align-items: flex-start;
}
.top-message .txt-box h3 {
  font-size: 2.2rem;
  line-height: 5rem;
  letter-spacing: 1.2rem;
  min-width: 7.3rem;
  margin: 1.5rem 0 0;
}
.top-message .txt-box .vertical .dash {
  height: 50px;
  margin: 5px auto 15px;
}
.top-message .txt-box p {
  flex: 1;
  padding-left: 14%;
}
.top-message .clip-bg {
  background: url(../img/top_message_bg-01.jpg) center / cover no-repeat;
}
@media (max-width: 767px) {
  .top-message {
    padding: 10.6rem 0 15.2rem;
  }
  .top-message .txt-box {
    display: block;
  }
  .top-message .txt-box h3 {
    font-size: 1.6rem;
    line-height: 3.5rem;
    letter-spacing: 0.6rem;
    min-width: 5.7rem;
    margin: 0 auto 3.5rem;
  }
  .top-message .txt-box .vertical .dash {
    height: 30px;
    margin: 5px auto;
  }
  .top-message .txt-box p {
    width: 100%;
    padding-left: 0;
  }
  .top-message .clip-bg {
    background: url(../img/sp_top_message_bg-01.jpg?20250707) center / cover no-repeat;
  }
}
/* ---------------------------------------------------------- */
/* Dealer */
.top-dealer {
  padding: 22rem 0 29.4rem;
  background: var(--gry-color);
  color: var(--blk-color);
}
.top-dealer .head-box {
  margin-bottom: 14rem;
}
.top-dealer .head-box .main-ttl {
  font-size: 2.2rem;
  margin-bottom: 5rem;
  letter-spacing: 0.66rem;
}
.top-dealer .txt-box p {
  font-size: 1.7rem;
  line-height: 4.4rem;
  width: 80%;
  margin: 9.5rem auto 0;
}
.top-dealer .store-box {
  margin-top: 15.4rem;
}
.top-dealer .store-box .detail {
  padding-right: 5%;
  padding-bottom: 3.5rem;
}
.top-dealer .store-box .detail h4 {
  font-size: 1.9rem;
  line-height: 4rem;
  margin-bottom: 2.5rem;
  letter-spacing: 0.7rem;
}
.top-dealer .store-box .detail p {
  font-size: 1.7rem;
  line-height: 3.5rem;
  margin-bottom: 1.8rem;
}
.top-dealer .store-box .sns-list {
  margin-bottom: 18px;
}
.top-dealer .store-box .sns-list .list-item {
  width: 22px;
}
.top-dealer .store-box .sns-list .list-item.list_item:not(:last-of-type) {
  margin-right: 10px;
}
.top-dealer .store-box .map {
  max-width: 51.2rem;
  width: 100%;
  height: 100%;
  aspect-ratio: 512 / 353;
}
.top-dealer .store-box .map p {
  font-size: 1.6rem;
  line-height: 4rem;
  letter-spacing: 0;
  position: absolute;
  left: 0;
  bottom: 0;
}
.top-dealer .store-box .map iframe {
  width: 100% !important;
  height: 100% !important;
}
@media (max-width: 767px) {
  .top-dealer {
    padding: 10rem 0 13.6rem;
  }
  .top-dealer .head-box {
    margin-bottom: 5rem;
  }
  .top-dealer .head-box .main-ttl {
    font-size: 1.6rem;
    margin-bottom: 3rem;
    letter-spacing: 0.29rem;
  }
  .top-dealer .head-box p {
    text-align: left;
    width: 90%;
    margin: 0 auto;
  }
  .top-dealer .txt-box p {
    font-size: 1.4rem;
    line-height: 2.8rem;
    width: 90%;
    margin: 5rem auto 0;
  }
  .top-dealer .store-box {
    width: 90%;
    margin: 5.5rem auto 0;
    flex-wrap: wrap;
  }
  .top-dealer .store-box .detail {
    width: 100%;
    padding: 0;
  }
  .top-dealer .store-box .detail h4 {
    font-size: 1.4rem;
    line-height: 2.5rem;
    margin-bottom: 1rem;
    letter-spacing: 0.42rem;
  }
  .top-dealer .store-box .detail p {
    font-size: 1.3rem;
    line-height: 2.5rem;
    margin-bottom: 1.5rem;
  }
  .top-dealer .store-box .sns-list {
    margin-bottom: 52px;
  }
  .top-dealer .store-box .sns-list .list-item {
    width: 19px;
  }
  .top-dealer .store-box .map p {
    font-size: 1.3rem;
    line-height: 2.5rem;
    position: initial;
    margin-top: 1rem;
    text-align: right;
  }
}
/* ---------------------------------------------------------- */
/* Contact */
.top-contact {
  background: var(--wht-color);
  color: var(--blk-color);
}
.top-contact .contact-box {
  align-items: flex-start;
}
.contact-box .lft-box {
  width: 27%;
  position: sticky;
  top: 15rem;
}
.contact-box .lft-box .head-box .main-ttl {
  font-size: 3.8rem;
  letter-spacing: 0.74rem;
  margin-bottom: 1.5rem;
}
.contact-box .lft-box .head-box .main-txt {
  font-size: 1.4rem;
  line-height: 3rem;
  letter-spacing: 0.07rem;
  margin-bottom: 2.8rem;
}
.contact-box .lft-box .head-box p {
  letter-spacing: 0;
}
.contact-box .lft-box .head-box p .att {
  font-size: 1.1rem;
}
.contact-box .lft-box .head-box .time {
  font-size: 1.4rem;
  line-height: 2.5rem;
  margin-top: 2rem;
  padding-top: 3.3rem;
  width: 100%;
  border-top: 1px solid var(--blk-color);
}
.contact-box .rgt-box {
  width: 59%;
}
.contact-box .contact-list-ttl {
  margin-bottom: 4rem;
}
.contact-box .contact-list-ttl h3 {
  width: 100%;
  display: block;
  border-bottom: solid 1px var(--blk-color);
  font-size: 1.3rem;
  line-height: 3rem;
  letter-spacing: 0.2rem;
  padding-bottom: 0.8rem;
}
/* .contact-box form, dl, dt, dd */
.contact-box form * {
  box-sizing: border-box;
}
.contact-box form {
  width: 100%;
}
.contact-box form dl {
  width: 100%;
}
.contact-box form dl:after, .contact-box form dl dt:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.contact-box form dl dt {
  width: 100%;
  font-size: 1.3rem;
  letter-spacing: 0.2rem;
  margin-bottom: 10px;
}
.contact-box form dl dd {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  z-index: 2;
}
.contact-box form dl dd.calendar::before {
  content: "";
  background: url("../img/icon_calendar.svg") center / cover no-repeat;
  position: absolute;
  z-index: -1;
  right: 3%;
  top: 1.5rem;
  margin: auto 0;
}
.contact-box form dl dd.time::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  color: var(--blk-color);
  line-height: 1;
  width: 0.9rem;
  height: 0.9rem;
  border: 1px solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateY(-25%) rotate(135deg);
  position: absolute;
  z-index: -1;
  right: 3.5%;
  top: 0;
  bottom: 0;
  margin: auto 0;
}
/* input, select, textarea */
.contact-box form input[type="text"], .contact-box form input[type="email"], .contact-box form input[type="tel"] {
  width: 100%;
  padding: 1.3rem 3%;
  border: 1px solid var(--blk-color);
  background: transparent;
  -webkit-appearance: none;
  font-size: 1.3rem;
  font-family: inherit;
  line-height: normal;
  letter-spacing: 0.13rem;
}
.contact-box form input[type="text"]:focus, .contact-box form input[type="email"]:focus, .contact-box form input[type="tel"]:focus, .contact-box form textarea:focus {
  box-shadow: 0px 0px 5px var(--dgry-color);
  border: 1px solid var(--dgry-color);
  background: transparent;
}
.contact-box form select {
  padding: 1.3rem 3%;
  border: 1px solid var(--blk-color);
  font-size: 1.3rem;
  font-family: inherit;
  line-height: normal;
  color: var(--blk-color) !important;
}
.contact-box form textarea {
  display: block;
  width: 100%;
  height: 17.5rem;
  padding: 1.3rem 3%;
  resize: vertical;
  border: 1px solid var(--blk-color);
  background: transparent;
  -webkit-appearance: none;
  font-size: 1.3rem;
  font-family: inherit;
  line-height: normal;
  letter-spacing: 0.13rem;
}
/* ul, li */
.contact-box form ul {
  list-style-type: none;
  width: 100%;
  flex-wrap: wrap;
}
.contact-box form ul li {
  width: 100%;
  margin-bottom: 3.8rem;
}
.contact-box form ul.col2 li {
  width: 47%;
}
/* カスタマイズ */
.contact-box form ul li label {
  cursor: pointer;
  position: relative;
}
.contact-box form ul li label input {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}
.contact-box form ul li label span.check-btn {
  color: var(--blk-color);
  font-size: 1.5rem;
  letter-spacing: 0.3rem;
  background: var(--wht-color);
  border: 1px solid var(--blk-color);
  padding: 2rem 0;
  text-align: center;
  display: block;
  transition: all 0.3s;
}
.contact-box form ul li label span.check-btn img {
  width: 100%;
}
.contact-box form ul li label input:checked + span.check-btn {
  color: var(--wht-color);
  background: var(--blk-color);
}
.contact-box form ul.thumbnail-btn li label input:checked + span.check-btn {
  background: rgba(0, 0, 0, 0.2);
}
.contact-box form ul li label input:checked + span.check-btn span.check-btn-box::before {
  border: 1px solid var(--wht-color);
}
.contact-box form ul.thumbnail-btn li label span.check-btn {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  z-index: 3;
  text-align: left;
  color: var(--wht-color);
  background: transparent;
  border: none;
}
.contact-box form ul.thumbnail-btn li label input:checked + span.check-btn::before {
  content: "";
  width: 100%;
  height: 100%;
  background: var(--blk-color);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.5;
  z-index: 2;
}
.contact-box form ul.thumbnail-btn li label .check-btn-txt {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 5%;
  margin: 0 auto;
  width: 90%;
  z-index: 3;
  text-align: left;
  color: var(--wht-color);
}
.contact-box form ul.thumbnail-btn li label .check-btn-txt .txt {
  display: flex;
  align-items: center;
}
.contact-box form ul.thumbnail-btn li label .check-btn-txt .en {
  font-size: 2rem;
  margin-right: 1rem;
}
.contact-box form ul.thumbnail-btn li label .check-btn-txt .ja {
  font-size: 0.9rem;
  letter-spacing: 0.13rem;
}
.contact-box form ul.thumbnail-btn .view_more_btn .arw_rgt {
  width: 14px;
  height: 10px;
  bottom: 25%;
  right: 0;
}
.contact-box form ul.kind-btn li .checkbox-thumbnail {
  width: 90%;
  margin: 5rem auto 8rem;
}
.contact-box form ul.kind-btn li .att {
  font-size: 1.3rem;
  line-height: 3rem;
  margin-top: 1.1rem;
}
/* input design */
.contact-box form input[name="postal"] {
  width: calc(100% - 36%);
  margin-right: 2%;
}
.contact-box form input[name="mail_address"] {
  width: 100%;
}
.contact-box form input[name="postal"] + div.auto {
  display: inline-block;
  padding: 1.3rem 3%;
  border: 1px solid var(--blk-color);
  background: var(--blk-color);
  font-size: 1.3rem;
  line-height: normal;
  letter-spacing: 0.13rem;
  color: var(--wht-color);
  text-decoration: none;
  flex: 1;
  text-align: center;
  cursor: pointer;
}
.contact-box form input[name="postal"] + div.auto:hover {
  background: var(--blk-color);
  border: 1px solid var(--blk-color);
}
/* button */
.contact-box form .square-btn {
  padding: 3.5rem 0 0;
  text-align: center;
}
/* error */
.formError .formErrorContent, .formError .formErrorArrow div {
  background: var(--brn-color);
}
@media (min-width: 768px) {
  .top-contact {
    padding: 29.5rem 0 34.5rem;
  }
  .contact-box .lft-box .head-box p {
    font-size: 1.3rem;
    line-height: 3rem;
  }
  .contact-box .contact-list:not(:last-of-type) {
    margin-bottom: 8rem;
  }
  .contact-box label + .contact-list {
    padding: 5.2rem 0 2rem;
  }
  .contact-box form dl {
    margin: 0 auto 2.5rem;
  }
  .contact-box form dl dd.calendar::before {
    width: 1.6rem;
    height: 1.8rem;
  }
}
@media (max-width: 767px) {
  .top-contact {
    padding: 9rem 0 9.9rem;
  }
  .top-contact .contact-box {
    flex-wrap: wrap;
  }
  .contact-box .lft-box {
    width: 100%;
    margin-bottom: 9rem;
    position: initial;
  }
  .contact-box .lft-box .head-box .main-ttl {
    font-size: 2.2rem;
    letter-spacing: 0.66rem;
    margin-bottom: 2.5rem;
  }
  .contact-box .lft-box .head-box .main-txt {
    font-size: 1.6rem;
    line-height: 3rem;
    margin-bottom: 1.5rem;
  }
  .contact-box .lft-box .head-box p {
    font-size: 1.4rem;
    line-height: 2.8rem;
  }
  .contact-box .lft-box .head-box p .att {
    font-size: 1.1rem;
  }
  .contact-box .lft-box .head-box .time {
    margin-top: 2rem;
    padding-top: 2rem;
    letter-spacing: 0;
  }
  .contact-box .rgt-box {
    width: 100%;
  }
  .contact-box .contact-list:not(:last-of-type) {
    margin-bottom: 4.5rem;
  }
  .contact-box label + .contact-list {
    padding: 3.5rem 0 1rem;
  }
  .contact-box .contact-list-ttl h3 {
    letter-spacing: 0.13rem;
  }
  .contact-box form dl {
    margin: 0 auto 1.8rem;
  }
  .contact-box form dl dt {
    font-size: 1.3rem;
  }
  .contact-box form dl dd.calendar::before {
    width: 1.2rem;
    height: 1.3rem;
  }
  .contact-box form ul li {
    margin-bottom: 1.3rem;
  }
  .contact-box form ul.col2 li {
    width: calc(50% - 0.5rem);
    margin-bottom: 1.4rem;
    position: relative;
  }
  .contact-box form ul li label span.check-btn {
    font-size: 1.1rem;
    letter-spacing: 0.33rem;
    padding: 1.7rem 0;
  }
  .contact-box form ul li:not(:first-of-type) span {
    margin-top: 0;
  }
  .contact-box form ul.thumbnail-btn li label .check-btn-txt .en {
    font-size: 1.5rem;
    letter-spacing: 0.3rem;
    margin-right: 0.5rem;
  }
  .contact-box form ul.thumbnail-btn li label .check-btn-txt .ja {
    font-size: 0.8rem;
    letter-spacing: 0.05rem;
  }
  .contact-box form ul li .checkbox-thumbnail {
    margin-bottom: 6rem;
  }
}
/* ---------------------------------------------------------- */
/* Calendar */
.ui-widget-header {
  background: var(--blk-color) !important;
  color: var(--wht-color) !important;
  display: flex;
  text-align: center;
  justify-content: center;
  position: relative;
  padding: 1rem 0.5rem;
  font-size: 1.5rem;
}
.ui-icon-circle-triangle-w, .ui-icon-circle-triangle-e {
  display: none !important;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus {
  border: none !important;
  background: none !important;
}
.ui-widget.ui-widget-content {
  z-index: 100 !important;
  border: 1px solid var(--blk-color) !important;
  background: var(--wht-color);
  color: var(--blk-color);
  font-size: 1.3rem;
  width: auto;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.ui-datepicker-calendar th {
  padding: 1rem !important;
}
.ui-datepicker td span, .ui-datepicker td a {
  padding: 1rem !important;
  display: inline-block;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active {
  color: var(--wht-color) !important;
  border: 1px solid var(--blk-color) !important;
  background: var(--blk-color) !important;
}
.ui-datepicker-prev, .ui-datepicker-prev:hover, .ui-datepicker-next, .ui-datepicker-next:hover {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 16px;
  height: 16px;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 16px !important;
}
.ui-datepicker-prev, .ui-datepicker-prev:hover {
  left: 0.5rem;
}
.ui-datepicker-next, .ui-datepicker-next:hover {
  right: 0.5rem;
}
.ui-datepicker-prev {
  background-image: url("../img/icon_arrow_pref-01.svg") !important;
}
.ui-datepicker-prev:hover {
  background-image: url("../img/icon_arrow_pref-02.svg") !important;
}
.ui-datepicker-next {
  background-image: url("../img/icon_arrow_next-01.svg") !important;
}
.ui-datepicker-next:hover {
  background-image: url("../img/icon_arrow_next-02.svg") !important;
}
.ui-state-disabled {
  opacity: 0.4;
}
/* ---------------------------------------------------------- */
/* Footer */
footer {
  height: 100vh;
  background: var(--brn-color);
  color: var(--blk-color);
}
footer .main-logo {
  max-width: 364px;
  width: 25%;
  margin-bottom: 5rem;
}
footer .address h2 {
  font-size: 2.2rem;
  line-height: 6rem;
  letter-spacing: 0.66rem;
}
footer .address h2 .small {
  display: inline-block;
  font-size: 1.9rem;
  letter-spacing: 0.57rem;
}
footer .address p {
  line-height: 3.5rem;
  margin-top: 1rem;
}
footer small {
  position: absolute;
  bottom: 5.4rem;
  right: 0;
  left: 0;
  margin: 0 auto;
  font-size: 1rem;
  letter-spacing: 0;
}
@media (max-width: 767px) {
  footer {
    margin-bottom: 5rem;
  }
  footer .main-logo {
    max-width: 196px;
    width: 61%;
  }
  footer .address h2 {
    font-size: 1.5rem;
    line-height: 4.2rem;
    letter-spacing: 0.45rem;
  }
  footer .address h2 .small {
    font-size: 1.2rem;
    letter-spacing: 0.36rem;
  }
  footer .address p {
    line-height: 1.2rem;
    line-height: 2.5rem;
    margin-top: 0.7rem;
  }
  footer small {
    bottom: 2.8rem;
  }
}
/* Material */
.top-gallery {
  background: #3E3E3E;
  padding: 19.7rem 0 25.6rem;
}
.top-gallery a {
  display: block;
  cursor: pointer;
}
.top-gallery .head-box {
  margin-bottom: 12.5rem;
}
.top-gallery .head-box .main-ttl {
  font-size: 2.2rem;
  margin-bottom: 5rem;
  letter-spacing: 0.66rem;
}
.top-gallery .head-box p {
  letter-spacing: 0.26rem;
}
.top-gallery .gallery-box .gallery-list > li h3 {
  margin-top: 0.5rem;
}
@media (min-width: 768px) {
  .top-gallery .gallery-box .gallery-list {
    margin: 0 -1.4rem;
  }
  .top-gallery .gallery-box .gallery-list > li {
    width: calc(100% / 3);
    padding: 1.4rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .top-gallery .gallery-box .gallery-list > li {
    width: calc(100% / 2);
    padding: 1.2rem;
  }
}
@media (max-width: 767px) {
  .top-gallery {
    padding: 10rem 0;
  }
  .top-gallery .head-box {
    margin-bottom: 7rem;
  }
  .top-gallery .head-box .main-ttl {
    font-size: 1.6rem;
    margin-bottom: 4rem;
    letter-spacing: 0.29rem;
  }
  .top-gallery .gallery-box .gallery-list {
    margin-top: 3rem;
    font-size: 1.4rem;
  }
  .top-gallery .gallery-box .gallery-list > li {
    width: calc(100% / 2);
    padding: 1rem;
  }
}
/*.img-thumb {
  overflow: hidden;
  cursor: pointer;
}
.top-gallery .swiper-wrapper {
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
}
.top-gallery .swiper-pagination {
  position: static;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  margin: 8.6rem auto 0;
  width: 80%;
}
.top-gallery .swiper-pagination-bullet {
  background: #C0C0C0;
  width: 55px;
  height: 1px;
  border-radius: 0;
  margin: 0 !important;
  opacity: 1;
}
.top-gallery .swiper-pagination-bullet-active {
  background: var(--blk-color);
}
.top-gallery .gall-vert .img-thumb {
  position: relative;
}
.top-gallery .gall-hori .img-thumb {
  position: relative;
}
@media (min-width: 768px) {
  .top-gallery .gall-hori {
    width: 30.5%;
  }
  .top-gallery .gall-vert {
    width: 16%;
  }
}
@media (max-width: 767px) {
  .top-gallery {
    padding: 4rem 0 3rem;
  }
  .top-gallery .swiper-pagination-bullet {
    width: 20px;
  }
  .top-gallery .gall-hori {
    width: 322px;
  }
  .top-gallery .gall-vert {
    width: 169px;
  }
  .top-gallery .swiper-slide .img-thumb:after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.5;
    z-index: 2;
  }
  .top-gallery .swiper-slide .img-thumb:after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.5;
    z-index: 2;
  }
  .top-gallery .swiper-slide-active .img-thumb:after {
    opacity: 0;
  }
  .top-gallery .swiper-pagination {
    margin: 3rem auto 0;
  }
}*/
/* ---------------------------------------------------------- */
/* 追従フッター */
#fixed {
  display: none;
}
@media (max-width: 767px) {
  #fixed {
    display: block;
    width: 100%;
    margin: 0 auto;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9997;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    transform: translateY(100%);
  }
  .page-confirm #fixed, .page-thanks #fixed {
    display: none !important;
  }
  #fixed li {
    flex-wrap: nowrap;
    display: flex;
    justify-content: space-between;
    width: 100%;
    width: calc(100% / 2);
    border-right: 1px solid var(--blk-color);
  }
  #fixed li:last-of-type {
    border: none;
  }
  #fixed li a {
    width: 100%;
    background: #C9C9C9;
    padding: 1.7rem 5%;
    color: var(--blk-color);
    text-align: center;
    font-size: 1.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s;
  }
  #fixed a:hover {
    background: var(--wht-color);
  }
  #fixed.is-fixed {
    display: block;
    transform: translateY(0);
  }
}
/* ---------------------------------------------------------- */
/* FancyBox v3 ポップアップスライダー調整 */
.fancybox-container {
  z-index: 10001;
}
.fancybox-is-open .fancybox-bg {
  opacity: 1;
}
.fancybox-bg {
  background: rgba(0, 0, 0, 0.8);
}
.fancybox-toolbar {
  top: 3%;
  right: 5%;
}
.fancybox-toolbar, .fancybox-button {
  background: none !important;
}
.fancybox-button--zoom, .fancybox-button--slideShow, .fancybox-button--fullScreen, .fancybox-button--thumbs, .fancybox-thumbs, .fancybox-counter, .fancybox-button--play, .fancybox-button svg, .fancybox-infobar {
  display: none !important;
}
/* 閉じるボタンカスタム */
.fancybox-button--close {
  position: relative !important;
}
.fancybox-button--close::before {
  position: absolute;
  content: "";
  top: 50%;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 26px;
  height: 24px;
  background: url("../img/icon_close.svg?20250707") no-repeat 50% 50%;
  background-size: auto 100%;
  margin-top: -12px;
}
/* キャプション */
.fancybox-caption__body {
  font-size: 1.6rem;
}
/* 矢印ボタンの共通スタイル */
.fancybox-navigation .fancybox-button {
  background: none !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
/* カスタム矢印の見た目 */
.fancybox-navigation .fancybox-button::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  border-top: 1px solid var(--wht-color);
  border-left: 1px solid var(--wht-color);
}
.fancybox-navigation .fancybox-button--arrow_right {
  right: 5%;
}
.fancybox-navigation .fancybox-button--arrow_right::before {
  right: 14px;
  transform: rotate(135deg);
}
.fancybox-navigation .fancybox-button--arrow_left {
  left: 5%;
}
.fancybox-navigation .fancybox-button--arrow_left::before {
  left: 14px;
  transform: rotate(-45deg);
}
.fancybox-navigation .fancybox-button svg {
  display: none;
  opacity: 0;
}
/* フォーカスアウトライン削除 */
.fancybox-slide,
.fancybox-content,
.fancybox-container,
.fancybox-stage {
  outline: none !important;
}
@media (max-width: 767px) {
  .fancybox-slide {
    padding: 4.8rem 2.5rem;
  }
  .fancybox-button--arrow_right {
    right: 0;
  }
  .fancybox-button--arrow_left {
    left: 0;
  }
  .fancybox-caption__body {
    font-size: 1.4rem;
  }
  .fancybox-toolbar {
    right: 2%;
  }
  .fancybox-navigation .fancybox-button--arrow_right {
    right: 0;
  }
  .fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
  }
}
/* ---------------------------------------------------------- */
/* 追従バナー */
#fixed-banner-btn{
  display: none;
}
#fixed-banner-btn:checked+label, #fixed-banner-btn:checked+label+.banner{
  display: none;
}
.fixed-banner {
  display: block;
  width: 100%;
  max-width: max-content;
  margin: 0 auto;
  position: fixed;
  bottom: 5%;
  right: -14px;
  z-index: 9996;
  -webkit-transition: all 0.8s;
  transition: all 0.8s;
  transform: translateX(100%);
}
.page-confirm .fixed-banner, .page-thanks .fixed-banner {
  display: none !important;
}
.fixed-banner.is-fixed-banner {
  display: block;
  transform: translateX(0);
  right: -1px;
}
.fixed-banner.is-hidden-banner {
  transform: translateX(100%);
}
.fixed-banner .close-btn{
  display: inline-block;
  cursor: pointer;
  position: absolute;
  top: -11px;
  left: -13px;
  width: 38px;
  height: 38px;
}
.fixed-banner .banner {
  width: 100%;
}
.fixed-banner .banner img{
  height: 144px;
}
@media (max-width: 767px) {
  .fixed-banner {
    bottom: 7rem;
  }
  .fixed-banner .banner img{
    height: 125px;
  }
  .fixed-banner .close-btn{
    top: -5px;
    left: -4px;
    width: 20px;
    height: 20px;
  }
}