@charset "UTF-8";
/* ---foundation--- */
html {
  scroll-padding-top: 50px;
  scroll-behavior: smooth;
}

body {
  line-height: 1.8;
  font-family: "din-2014", "Noto Sans JP", sans-serif;
  letter-spacing: 0.1em;
  word-break: break-all;
  color: #333;
}

p {
  font-size: clamp(14px, 2.3vw, 16px);
}

img,
video,
svg {
  width: 100%;
}

main {
  overflow: hidden;
}

.f-base_page {
  text-align: center;
  margin-top: 40px;
}
.f-base_page .page-numbers {
  display: inline-block;
  margin-right: 8px;
  padding: 11px 20px;
  border-radius: 3px;
  background: #fff;
  color: #FFE80D;
  border-radius: 50%;
}
.f-base_page .current {
  background-color: #FFE80D;
  color: #fff;
}

/*==================================================
スライダーのためのcss
===================================*/
.slider,
.slider_interview {
  max-width: 1000px;
  width: 100%;
  margin: auto;
}

.slider img,
.slider_interview img {
  width: 100%; /*スライダー内の画像を横幅100%に*/
  height: auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider .slick-slide {
  margin: 0 clamp(12px, 1.8vw, 24px);
  transform: none;
  opacity: 1;
}

.slider_interview .slick-slide {
  margin: 0 16px;
  transform: none;
  opacity: 1;
}

.slick-list {
  overflow: visible;
}

/*矢印の設定*/
.interview-prev,
.interview-next {
  position: absolute; /*絶対配置にする*/
  top: -65%;
  cursor: pointer; /*マウスカーソルを指マークに*/
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid #FFE80D;
  display: flex;
  align-items: center;
  justify-content: center;
}

.interview-prev {
  /*戻る矢印の位置と形状*/
  left: auto;
  right: 9%;
}
.interview-prev::after {
  content: "";
  position: absolute;
  top: 44%;
  right: 39%;
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFE80D;
  border-right: 2px solid #FFE80D;
  transform: rotate(-135deg);
  transition: all 0.4s ease;
}

.interview-next {
  right: 0;
}
.interview-next::after {
  content: "";
  position: absolute;
  top: 44%;
  right: 43%;
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFE80D;
  border-right: 2px solid #FFE80D;
  transform: rotate(45deg);
  transition: all 0.4s ease;
}

.slider-arrow-group {
  position: relative;
  display: flex;
  gap: 32px;
}
.slider-arrow-group .arrow-left,
.slider-arrow-group .arrow-right,
.slider-arrow-group .interview-arrow-left,
.slider-arrow-group .interview-arrow-right {
  cursor: pointer; /*マウスカーソルを指マークに*/
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid #FFE80D;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease;
}
.slider-arrow-group .arrow-left,
.slider-arrow-group .interview-arrow-left {
  position: relative;
}
.slider-arrow-group .arrow-left::after,
.slider-arrow-group .interview-arrow-left::after {
  content: "";
  position: absolute;
  top: 44%;
  right: 39%;
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFE80D;
  border-right: 2px solid #FFE80D;
  transform: rotate(-135deg);
  transition: all 0.4s ease;
}
.slider-arrow-group .arrow-right,
.slider-arrow-group .interview-arrow-right {
  position: relative;
}
.slider-arrow-group .arrow-right::after,
.slider-arrow-group .interview-arrow-right::after {
  content: "";
  position: absolute;
  top: 44%;
  right: 43%;
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFE80D;
  border-right: 2px solid #FFE80D;
  transform: rotate(45deg);
  transition: all 0.4s ease;
}

/*ドットナビゲーションの設定*/
.slick-dots {
  text-align: center;
  margin: 20px 0 0 0;
}

.slick-dots li {
  display: inline-block;
  margin: 0 5px;
}

.slick-dots button {
  color: transparent;
  outline: none;
  width: 8px; /*ドットボタンのサイズ*/
  height: 8px; /*ドットボタンのサイズ*/
  display: block;
  border-radius: 50%;
  background: #ccc; /*ドットボタンの色*/
}

.slick-dots .slick-active button {
  background: #333; /*ドットボタンの現在地表示の色*/
}

/*fv_sliderのPCSP表示非表示*/
.fv_slider {
  display: block;
}

.fv_slider_sp {
  display: none;
}

@media (max-width: 599px) {
  .fv_slider {
    display: none;
  }
  .fv_slider_sp {
    display: block;
  }
}
/* ---layout--- */
.l-contaner-message {
  max-width: 750px;
  margin: 0 auto;
}

.l-container-1500 {
  max-width: 1500px;
  margin: 0 auto;
}

.l-container-1200 {
  max-width: 1200px;
  margin: 0 auto;
}

.l-container-1000 {
  max-width: 1000px;
  margin: 0 auto;
}

.l-container-800 {
  max-width: 800px;
  margin: 0 auto;
}

footer {
  background-color: #141A29;
  padding: 26px 24px 20px;
  color: #fff;
}
footer .l-footer-top {
  justify-content: space-between;
  border-bottom: 1px solid #fff;
  padding: 0 8px 32px;
}
footer .l-footer-top .l-footer-logo {
  width: 10%;
  margin: 0 auto;
}
footer .l-footer-top .l-footer-logo a {
  display: flex;
  gap: 16px;
  align-items: end;
}
footer .l-footer-top .l-footer-logo a svg {
  flex: 0 1 clamp(120px, 40vw, 150px);
}
footer .l-footer-top .l-footer-logo a p {
  font-size: 14px;
  color: #fff;
}
footer .l-footer-top .l-footer-nav-group {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(2, max-content);
  justify-content: center;
  gap: 16px 32px;
}
footer .l-footer-top .l-footer-nav-group a {
  text-align: center;
}

.l-footer-bottom {
  display: flex;
  justify-content: center;
  margin-top: 32px;
}
.l-footer-bottom p {
  font-size: 12px;
}

@media (max-width: 1180px) {
  footer .l-footer-bottom {
    flex-direction: column;
    align-items: center;
    gap: 40px;
  }
  footer .l-footer-bottom ul {
    gap: 24px;
  }
}
@media (max-width: 1000px) {
  footer .l-footer-top .l-footer-logo {
    width: 30%;
  }
  footer .l-footer-top .l-footer-logo a {
    justify-content: center;
  }
  footer .l-footer-top .l-header-nav-group {
    display: none;
  }
  footer .l-footer-bottom ul {
    flex-wrap: wrap;
  }
  footer .l-footer-bottom ul li {
    width: calc(50% - 12px);
    text-align: center;
  }
}
/* header */
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #141A29;
  padding: 4px clamp(10px, 2vw, 62px);
}
header .l-header-logo-group {
  flex: 0 0 clamp(60px, 14vw, 80px);
  position: relative;
}
header .l-header-logo-group a {
  display: flex;
  gap: 12px;
  align-items: end;
  transition: color 0.4s ease;
}
header .l-header-nav a {
  color: #fff;
}
header .l-header-pc-menu-second-level {
  position: absolute;
  top: 70%;
  left: 0;
  box-sizing: border-box;
  transform: scaleY(0);
  transform-origin: center top;
  width: 100%;
  background-color: #fff;
  border-radius: 0 0 8px 8px;
  box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.15);
}
header .l-header-pc-menu-second-level p {
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin: 40px 0 24px;
  color: #981919;
}
header .l-header-pc-menu-second-level .l-header-pc-menu-second-level-list {
  flex-wrap: wrap;
  width: 100%;
  margin: 20px auto 30px;
  padding: 0 100px;
  gap: 16px;
}
header .l-header-pc-menu-second-level .l-header-pc-menu-second-level-list::before {
  position: relative;
  top: -30%;
  left: 50%;
  content: "";
  width: 100%;
  border-top: 2px solid #981919;
  transform: translate(-50%);
  padding-top: 24px;
}
header .l-header-pc-menu-second-level .l-header-pc-menu-second-level-list li {
  width: calc(50% - 12px);
  text-align: center;
  margin-left: 0px;
  transition: all 0.3s;
}
header .l-header-pc-menu-second-level .l-header-pc-menu-second-level-list li:hover {
  transition: all 0.3s;
  overflow: visible;
  color: #333;
  opacity: 0.4;
}
header:hover .l-header-pc-menu-second-level {
  transform: scaleY(1);
  transition: 0.4s;
}

/*HeightMinというクラス名がついたら高さを小さく、上部固定に*/
header.HeightMin {
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.15);
}

@media (max-width: 999px) {
  header .l-header-logo-group {
    z-index: 999;
  }
  header .l-header-nav-group .l-header-nav-pc {
    display: none;
  }
  header .l-header-nav-group .l-header-nav-sp {
    display: block;
  }
  header .l-header-nav-group .l-header-nav-sp .l-header-nav-group {
    display: flex;
    align-items: center;
    gap: clamp(8px, 5vw, 24px);
  }
  header .l-header-nav-group .l-header-nav-sp .l-header-nav-group a span {
    color: #fff;
    font-size: 12px;
  }
}
@media (max-width: 399px) {
  header {
    padding-left: 18px;
  }
  header .l-header-logo-group a {
    flex-direction: column;
    align-items: baseline;
    gap: 4px;
  }
  header .l-header-logo-group a svg {
    flex: auto;
    width: 125px;
  }
}
.l-main-category-wrapper {
  display: flex;
  justify-content: center;
  width: 100%;
  z-index: 5;
  transition: all 0.3s;
}
.l-main-category-wrapper.is-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
}

.l-main-category {
  display: flex;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 30px;
  overflow: hidden;
}

.l-main-tab-button {
  padding: 8px clamp(10px, 2vw, 17px);
  text-align: center;
  border-right: 1px solid #ccc;
  background: #fff;
  color: #333;
  font-weight: 600;
  font-size: clamp(12px, 2vw, 22px);
  transition: all 0.3s;
}

.l-main-tab-button:last-child {
  border-right: none;
}

.l-main-tab-button.active {
  background: #EC3CE0;
  color: #fff;
}

.l-main-pickup {
  padding: 0px 20px clamp(60px, 7vw, 90px);
}
.l-main-pickup .l-main-title {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: clamp(10px, 2vw, 40px);
}
.l-main-pickup .l-main-title .l-main-title-img {
  margin-left: 20px;
}
.l-main-pickup .l-main-title .l-main-title-img img {
  width: clamp(45px, 9vw, 64px);
  height: clamp(45px, 9vw, 64px);
}
.l-main-pickup .l-main-title h2 {
  color: #2F3E49;
  font-size: clamp(22px, 3vw, 28px);
  font-weight: 700;
  margin: 0 clamp(10px, 2vw, 20px);
}
.l-main-pickup .l-main-title::before,
.l-main-pickup .l-main-title::after {
  content: "";
  width: clamp(42px, 13vw, 210px);
  border-top: 1px dashed #ccc;
}
.l-main-pickup .l-main-gacha-list {
  display: grid;
}
.l-main-pickup ul {
  display: grid;
  grid-template-columns: repeat(2, 330px);
  gap: 24px;
  justify-content: center;
  margin-top: 20px;
}
.l-main-pickup ul li {
  width: 100%;
  text-align: center;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px;
}
.l-main-pickup ul li img {
  margin-bottom: 20px;
}
.l-main-pickup ul li .l-main-picup-bottom {
  gap: 4px;
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}
.l-main-pickup ul li .l-main-picup-bottom .one_time {
  font-size: 0.625rem;
  font-weight: 600;
  gap: 6px;
  display: flex;
  color: #fff;
  margin: 0 auto;
}
.l-main-pickup ul li .l-main-picup-bottom .one_time .tag--pink {
  background-color: #EC3CE0;
  padding: 4px 10px;
  border-radius: 8px;
}
.l-main-pickup ul li .l-main-picup-bottom .one_time .tag--yellow {
  background-color: #FFE80D;
  color: #333333;
  padding: 4px 16px;
  border-radius: 8px;
}
.l-main-pickup ul li .l-main-picup-bottom h3 {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 170%;
  text-align: center;
}
.l-main-pickup ul li .l-main-picup-bottom .card__date {
  color: #D80000;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
}
.l-main-pickup ul li .l-main-picup-bottom .card__price {
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 150%;
}
.l-main-pickup ul li .l-main-picup-bottom .card__item {
  font-weight: 400;
  font-size: 0.8rem;
  line-height: 150%;
  color: #7a7a7a;
}

@media (max-width: 769px) {
  .l-main-pickup ul {
    display: block;
  }
  .l-main-pickup ul a {
    display: flex;
    justify-content: center;
    margin-top: 30px;
  }
  .l-main-pickup ul a li {
    width: 100%;
  }
}
.l-main-item {
  background-color: #fff;
  padding: 30px 0;
  border-radius: 16px;
}
.l-main-item .l-main-item-contents {
  margin: 0 auto 60px;
  width: 40%;
}
.l-main-item .l-main-item-contents li {
  width: 100%;
  text-align: center;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px;
}
.l-main-item .l-main-item-contents li img {
  margin-bottom: 14px;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom {
  gap: 8px;
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom .one_time {
  display: flex;
  gap: 10px;
  font-size: 0.625rem;
  font-weight: 600;
  color: #fff;
  margin: 0 auto;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom .one_time .tag--pink {
  background-color: #EC3CE0;
  padding: 4px 16px;
  border-radius: 8px;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom .one_time .tag--yellow {
  background-color: #FFE80D;
  color: #333333;
  padding: 4px 16px;
  border-radius: 8px;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom h3 {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 170%;
  text-align: center;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom .card__price {
  font-weight: 600;
  font-size: 1.3rem;
  line-height: 150%;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom .card__date {
  color: #D80000;
}
.l-main-item .l-main-item-contents li .l-main-item-bottom .card__item {
  font-weight: 400;
  font-size: 0.8rem;
  line-height: 150%;
  color: #7a7a7a;
}
.l-main-item .l-main-item-info {
  background-color: #F7F7F7;
  padding: clamp(30px, 4vw, 70px) clamp(30px, 3vw, 60px);
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  gap: clamp(30px, 11vw, 70px);
}
.l-main-item .l-main-item-info h4 {
  font-size: 18px;
  font-weight: 600;
  line-height: 160%;
  margin-bottom: 20px;
}
.l-main-item .l-main-item-info p {
  padding-bottom: clamp(20px, 7vw, 30px);
  border-bottom: 1px solid #BBB;
  font-size: clamp(14px, 2vw, 16px);
  font-weight: 500;
  line-height: 160%;
}
.l-main-item .l-main-item-info-item h4 span {
  color: #333333;
}
.l-main-item .l-main-item-info-item p {
  padding-bottom: 30px;
  border-bottom: 1px solid #BBB;
}
.l-main-item .l-main-item-info-item .item-images-top, .l-main-item .l-main-item-info-item .item-images-bottom {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin: 20px 0;
}
.l-main-item .l-main-item-info-item .item-images-top img, .l-main-item .l-main-item-info-item .item-images-bottom img {
  width: 8%;
}

.l-main-item-info-bottom {
  align-items: center;
  display: flex;
  flex-direction: column;
}
.l-main-item-info-bottom p {
  font-size: 18px;
  font-weight: 500;
  line-height: 160%;
}
.l-main-item-info-bottom .l-main-item-info-price {
  margin: 30px 0 18px;
}
.l-main-item-info-bottom .l-main-item-info-price p {
  font-size: 28px;
  font-weight: 700;
  line-height: 100%; /* 28px */
}
.l-main-item-info-bottom .l-main-item-info-caution h4 span {
  color: #333333;
}
.l-main-item-info-bottom .l-main-item-info-caution p {
  border: none;
}

/* ▼ 全体の固定バー */
.l-main-item-button-sp {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  padding: 12px 16px;
  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.15);
  z-index: 9999;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.3s ease;
  display: none;
  /* 内部は横並びの Flex */
}
.l-main-item-button-sp .l-main-item-button-sp-contents {
  display: flex;
  align-items: center;
  gap: 20px;
  justify-content: center;
  /* 料金部分 */
}
.l-main-item-button-sp .l-main-item-button-sp-contents .l-main-item-info-price .l-main-item-info-text {
  font-size: 26px;
  font-weight: 700;
  margin: 0;
}

.l-main-item-button-sp-hidden {
  opacity: 0;
  pointer-events: none;
}

/* ▼ スマホのみ表示 */
@media (max-width: 768px) {
  .l-main-item-button-sp {
    display: block;
  }
}
@media (max-width: 769px) {
  .l-main-item {
    padding: 0;
  }
  .l-main-item .l-main-item-contents {
    width: 100%;
  }
  .l-main-item .l-main-item-info-bottom .l-main-item-info .item-images-top img {
    width: 15%;
  }
  .l-main-item .l-main-item-info-bottom .l-main-item-info .item-images-bottom img {
    width: 15%;
  }
}
.l-main-404 {
  padding: 100px 24px;
  text-align: center;
}
.l-main-404 img {
  max-width: clamp(160px, 16vw, 200px);
}
.l-main-404 .l-main-404-title {
  text-align: center;
  margin-top: 20px;
}
.l-main-404 .l-main-404-title h1 {
  font-size: clamp(22px, 2.5vw, 28px);
  line-height: 1.6;
  font-weight: 600;
  margin-bottom: 10px;
}

.l-main-purchase-container {
  background-color: #fff;
  text-align: center;
}
.l-main-purchase-container h1 {
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 600;
  margin-bottom: clamp(10px, 2vw, 30px);
}
.l-main-purchase-container .l-main-purchase-list {
  justify-content: center;
  display: flex;
}
.l-main-purchase-container .l-main-purchase-list ul {
  align-items: center;
  margin-bottom: 20px;
}
.l-main-purchase-container .l-main-purchase-list ul li {
  display: flex;
  background-color: #EEEEEE;
  width: clamp(340px, 76vw, 700px);
  padding: clamp(20px, 2vw, 40px) clamp(10px, 2vw, 70px);
  border-radius: 16px;
  font-weight: 600;
  gap: clamp(30px, 7vw, 70px);
  align-items: center;
  font-size: 20px;
  justify-content: center;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-left {
  width: 60%;
  text-align: left;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-left p {
  font-weight: 500;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-left h3 {
  font-size: 1rem;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-left .l-main-purchase-list-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
  margin-top: 4px;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-left .l-main-purchase-list-meta-item {
  font-size: 0.65rem;
  font-weight: 400;
  color: #888;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-left .l-main-purchase-list-meta-item strong {
  font-weight: 500;
  color: #666;
}
.l-main-purchase-container .l-main-purchase-list ul li .l-main-purchase-list-right p {
  font-size: clamp(10px, 5vw, 20px);
}

.l-main-login-inner {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 clamp(8px, 2vw, 20px);
}
.l-main-login-inner .l-main-login-item {
  margin: 0 auto 60px;
  width: 60%;
}
.l-main-login-inner .l-main-login-item .l-main-item-top {
  margin-bottom: 60px;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li {
  width: 100%;
  text-align: center;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li img {
  margin-bottom: 14px;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li .l-main-item-bottom {
  gap: 8px;
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li .l-main-item-bottom .one_time {
  display: flex;
  gap: 10px;
  font-size: 0.625rem;
  font-weight: 600;
  color: #fff;
  margin: 0 auto;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li .l-main-item-bottom .one_time .tag--pink {
  background-color: #EC3CE0;
  padding: 4px 16px;
  border-radius: 8px;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li .l-main-item-bottom h3 {
  font-size: clamp(16px, 5vw, 30px);
  font-weight: 700;
  line-height: 170%;
  text-align: center;
}
.l-main-login-inner .l-main-login-item .l-main-item-top li .l-main-item-bottom .card__price {
  font-weight: 600;
  font-size: 1.3rem;
  line-height: 150%;
}
.l-main-login-inner .l-main-login-form {
  background-color: #f8f9fa;
  padding: 60px 20px;
  justify-content: center;
  align-items: center;
  display: flex;
  border-radius: 8px;
  margin: 0 auto;
}
.l-main-login-inner .l-main-login-form label {
  display: block;
  font-weight: bold;
  color: #666;
  margin-bottom: 8px;
  font-size: 14px;
}
.l-main-login-inner .l-main-login-form .l-main-login-contents {
  background-color: #fff;
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  width: 100%;
  max-width: 600px;
}
.l-main-login-inner .l-main-login-form h2 {
  text-align: center;
  color: #374151;
  font-size: clamp(16px, 4vw, 24px);
  margin-bottom: 30px;
  font-weight: 500;
}
.l-main-login-inner .l-main-login-form .l-main-login-form-group {
  margin-bottom: 25px;
}
.l-main-login-inner .l-main-login-form .l-main-login-form-group label {
  display: block;
  font-weight: bold;
  color: #666;
  margin-bottom: 8px;
  font-size: 14px;
  white-space: nowrap;
}
.l-main-login-inner .l-main-login-form .l-main-login-form-group .u-column-label {
  display: block;
  margin-bottom: 10px;
}
.l-main-login-inner .l-main-login-form .l-main-login-form-group .u-column-label .label-text {
  display: block;
  font-size: 14px;
  font-weight: bold;
  color: #666;
  margin-bottom: 4px;
}
.l-main-login-inner .l-main-login-form .l-main-login-form-group input {
  width: 100%;
  padding: 10px 15px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: 16px;
  background-color: #fff;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.3s;
}
.l-main-login-inner .l-main-login-caution {
  margin-top: 60px;
}
.l-main-login-inner .l-main-login-caution h3 {
  margin-top: 40px;
  font-weight: bold;
}
.l-main-login-inner .l-main-login-caution .l-main-login-caution-mail {
  margin-top: 20px;
}
.l-main-login-inner .l-main-login-caution span {
  margin-left: 20px;
}

@media (max-width: 799px) {
  .l-main-login-inner {
    padding: 0;
  }
  .l-main-login-inner .l-main-login-item {
    width: 80%;
  }
}
@media screen and (max-width: 499px) {
  .l-main-login-form-group label {
    font-size: 13px;
    white-space: normal;
  }
}
/* インタビュー・クロストーク */
.l-word-talk-article .l-word-talk-article-title-group {
  line-height: 1.6;
  margin-bottom: 48px;
  margin-top: 120px;
  letter-spacing: 1px;
  font-weight: bold;
}
.l-word-talk-article .l-word-talk-article-title-group h2 {
  color: #FFE80D;
  font-size: clamp(20px, 3.5vw, 28px);
}
.l-word-talk-article .l-word-talk-article-title-group h3 {
  color: #5a5a5a;
  display: flex;
  align-items: center;
  margin: 12px 0 0 0;
  font-size: clamp(18px, 2.3vw, 20px);
  line-height: 1.6;
}
.l-word-talk-article .l-word-talk-article-title-group h3::before {
  content: "";
  flex: 0 0 20px;
  height: 1px;
  background-color: #a5a5a5;
  margin-right: 8px;
}
.l-word-talk-article .l-word-talk-article-title-group:first-child {
  margin-top: 0;
}
.l-word-talk-article p {
  margin-bottom: 32px;
  line-height: 2;
}
.l-word-talk-article .l-word-talk-article-speech-left,
.l-word-talk-article .l-word-talk-article-speech-right {
  position: relative;
  margin-top: 140px;
}
.l-word-talk-article .l-word-talk-article-speech-left .l-word-talk-article-speech-member,
.l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-member {
  position: absolute;
  top: -70px;
  display: flex;
  align-items: center;
  gap: 8px;
  width: clamp(80px, 12vw, 100px);
}
.l-word-talk-article .l-word-talk-article-speech-left .l-word-talk-article-speech-member p,
.l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-member p {
  flex: 0 0 100%;
  white-space: nowrap;
  font-size: 14px;
  font-weight: bold;
}
.l-word-talk-article .l-word-talk-article-speech-left .l-word-talk-article-speech-member img,
.l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-member img {
  border-radius: 100vh;
}
.l-word-talk-article .l-word-talk-article-speech-left .l-word-talk-article-speech-text,
.l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-text {
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  padding: 32px;
  margin: 0 clamp(32px, 4.9vw, 64px);
  font-size: clamp(14px, 2.8vw, 16px);
}
.l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-member {
  flex-direction: row-reverse;
  right: 0;
}
.l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-member p {
  text-align: right;
}
.l-word-talk-article figure {
  max-width: 800px;
  margin: clamp(48px, 5vw, 72px) auto;
  overflow: hidden;
  border-radius: clamp(8px, 2.8vw, 16px);
}

@media (max-width: 599px) {
  .l-word-talk-article .l-word-talk-article-speech-left .l-word-talk-article-speech-text,
  .l-word-talk-article .l-word-talk-article-speech-right .l-word-talk-article-speech-text {
    margin: 0 clamp(16px, 4vw, 32px);
    padding: 32px clamp(16px, 4vw, 32px) clamp(24px, 4vw, 32px);
  }
}
/* 人を知る */
.l-word-member-article ul li {
  display: flex;
  gap: 32px;
  align-items: center;
  margin-bottom: 120px;
}
.l-word-member-article ul li .l-word-member-article-image {
  flex: 0 0 clamp(300px, 40vw, 400px);
  height: 300px;
  overflow: hidden;
  border-radius: 16px;
}
.l-word-member-article ul li .l-word-member-article-image img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.l-word-member-article ul li .l-word-member-article-text h2 {
  color: #7d7d7d;
  font-size: clamp(24px, 2.8vw, 26px);
  font-weight: bold;
}
.l-word-member-article ul li .l-word-member-article-text h2 span {
  font-size: clamp(20px, 2.3vw, 22px);
  color: #FFE80D;
}
.l-word-member-article ul li .l-word-member-article-text p {
  margin-top: clamp(12px, 2vw, 24px);
  font-size: clamp(14px, 2.3vw, 16px);
}
.l-word-member-article ul li:nth-child(2n) {
  flex-direction: row-reverse;
}
.l-word-member-article ul li:last-child {
  margin-bottom: 0;
}

@media (max-width: 749px) {
  .l-word-member-article ul li {
    flex-direction: column;
  }
  .l-word-member-article ul li .l-word-member-article-image {
    flex: 0 0 min(60vw, 300px);
    height: 100%;
  }
  .l-word-member-article ul li:nth-child(2n) {
    flex-direction: column;
  }
}
/* 人を知る_スケジュール */
.l-word-member-schedule-wrap {
  display: flex;
  gap: 24px;
}
.l-word-member-schedule-wrap .l-word-member-schedule {
  width: 60%;
}
.l-word-member-schedule-wrap .l-word-member-schedule li {
  display: flex;
  align-items: center;
  width: 100%;
  line-height: 1;
  margin-bottom: clamp(18px, 3vw, 24px);
}
.l-word-member-schedule-wrap .l-word-member-schedule li p {
  position: relative;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: clamp(16px, 6vw, 18px);
  opacity: 0.8;
  white-space: nowrap;
}
.l-word-member-schedule-wrap .l-word-member-schedule li p img {
  width: 15px;
  height: 15px;
}
.l-word-member-schedule-wrap .l-word-member-schedule li h3 {
  font-size: clamp(16px, 2vw, 18px);
  margin-left: 16px;
  font-weight: 500;
  line-height: 1.6;
}
.l-word-member-schedule-wrap .l-word-member-schedule li:last-child {
  margin-bottom: 0;
}
.l-word-member-schedule-wrap .l-word-member-image {
  width: 40%;
}
.l-word-member-schedule-wrap .l-word-member-image .l-word-member-image_1 {
  margin-bottom: 24px;
}
.l-word-member-schedule-wrap .l-word-member-image .l-word-member-image_1,
.l-word-member-schedule-wrap .l-word-member-image .l-word-member-image_2 {
  overflow: hidden;
  border-radius: 8px;
}

@media (max-width: 599px) {
  .l-word-member-schedule-wrap {
    flex-direction: column;
    gap: 56px;
  }
  .l-word-member-schedule-wrap .l-word-member-schedule {
    width: 100%;
  }
  .l-word-member-schedule-wrap .l-word-member-schedule li p {
    flex: 1;
  }
  .l-word-member-schedule-wrap .l-word-member-schedule li h3 {
    flex: 3;
  }
  .l-word-member-schedule-wrap .l-word-member-image {
    width: 100%;
    display: flex;
    gap: 16px;
  }
  .l-word-member-schedule-wrap .l-word-member-image .l-word-member-image_1 {
    margin-bottom: 0;
  }
}
@media (max-width: 449px) {
  .l-word-member-schedule-wrap .l-word-member-image {
    flex-direction: column;
    max-width: 300px;
    margin: auto;
  }
}
/* WordPress＿コンテンツ共通部分 */
.l-word-content h2 {
  font-size: 1.3rem;
  font-weight: bold;
  color: #FFE80D;
  position: relative;
  padding: 24px 0 12px;
  margin-bottom: 0.8em;
}
.l-word-content h2::after {
  content: "";
  background: #FFE80D;
  width: 64px;
  height: 4px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.l-word-content p {
  padding: 8px 0;
  line-height: 2;
}
.l-word-content .wp-block-image {
  max-width: 800px;
  margin: 24px auto;
}
.l-word-content .wp-block-image img {
  width: 100%;
  height: 100%;
  border-radius: clamp(8px, 1.2vw, 16px);
}
.l-word-content .wp-block-image figcaption {
  font-size: 12px;
  padding: 0 5%;
}

/* ---Component--- */
.c-button-header a {
  display: block;
  border-radius: 38px;
  background: #FFE80D;
  color: #333333;
  padding: 4px 20px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  transition: all 0.5s;
}
.c-button-header a:hover {
  opacity: 0.7;
}

.c-button-header-sp {
  display: block;
  background-color: #FFE80D;
  border-radius: 38px;
  color: #333;
  padding: clamp(3px, 1vw, 6px) clamp(8px, 3vw, 40px);
  font-size: clamp(12px, 2vw, 14px);
  font-weight: bold;
}

.c-button-logout {
    align-items: center;
    margin-right: 10px;
}

.c-button-logout span {
    border-radius: 24px;
    background: #FFE80D;
    padding: 8px 16px;
    color: #333;
    font-size: clamp(12px, 2vw, 14px);
    font-weight: bold;
}

.c-button-item {
  display: block;
  border-radius: 88px;
  background: #FFE80D;
  color: #333333;
  padding: 8px 70px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.5s;
}

.c-button-top {
  margin: 50px auto;
  max-width: 200px;
  display: block;
  border-radius: 88px;
  background: #fff;
  color: #333333;
  padding: 6px 56px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.5s;
  border: 1px solid #000;
  margin-top: 50px;
}

.c-button-item-sp {
  display: block;
  border-radius: 88px;
  background: #FFE80D;
  color: #333333;
  padding: 8px 50px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.5s;
}

.c-button-login {
  display: block;
  width: 46%;
  margin: 40px auto 0;
  padding: 1.5%;
  text-align: center;
  background-color: #fde047;
  color: #000;
  border-radius: 50px;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  transition: opacity 0.3s;
}

.c-button-login:hover {
  opacity: 0.8;
}

@media (max-width: 699px) {
  .c-button-login {
    width: 100%;
    padding: 2.5%;
  }
  .c-button-logout {
    margin-right: 0px;
  }
}
.c-button-required {
  background-color: #ff6b6b;
  color: #fff;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  flex-shrink: 0;
}

.c-button-wrapper {
  position: relative;
  width: 100%;
}
.c-button-wrapper select {
  width: 100%;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 1.4;
  border: 1px solid #ddd;
  border-radius: 8px;
  background-color: #fff;
  color: #333;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}
.c-button-wrapper select option {
  font-size: 15px;
  padding: 8px 10px;
}
.c-button-wrapper select:focus {
  outline: none;
  border-color: #fde047;
}
.c-button-wrapper::after {
  content: "▼";
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: #aaa;
  font-size: 12px;
  pointer-events: none;
}

/* カスタムドロップダウン */
.c-custom-select {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  outline: none;
}

.c-custom-select__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 15px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background-color: #fff;
  font-size: 16px;
  color: #aaa;
  cursor: pointer;
  box-sizing: border-box;
  transition: border-color 0.3s;
  user-select: none;
}

.c-custom-select__trigger .c-custom-select__value.is-chosen {
  color: #333;
}

.c-custom-select__arrow {
  font-size: 11px;
  color: #aaa;
  transition: transform 0.2s;
  flex-shrink: 0;
  margin-left: 8px;
}

.c-custom-select.is-open .c-custom-select__trigger {
  border-color: #fde047;
}

.c-custom-select.is-open .c-custom-select__arrow {
  transform: rotate(180deg);
}

.c-custom-select__list {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background-color: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  z-index: 100;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  overflow: hidden;
}

.c-custom-select.is-open .c-custom-select__list {
  display: block;
}

.c-custom-select__item {
  padding: 10px 15px;
  font-size: 15px;
  color: #333;
  cursor: pointer;
  transition: background-color 0.15s;
}

.c-custom-select__item:hover {
  background-color: #fef9c3;
}

.c-custom-select__item.is-selected {
  background-color: #fef08a;
  font-weight: bold;
  color: #333;
}

.c-form-note {
  font-size: 14px;
  font-weight: bold;
  color: #666;
  margin-top: 8px;
  line-height: 1.4;
}

/* TOPページ */
.c-heading-title-group {
  display: flex;
  justify-content: space-between;
  align-items: end;
  margin-bottom: clamp(58px, 8vw, 80px);
}
.c-heading-title-group .c-heading-title-top {
  margin-bottom: 0;
}

.c-heading-title-top {
  margin-bottom: clamp(58px, 8vw, 80px);
}
.c-heading-title-top .c-heading-title-top-title {
  display: flex;
  align-items: center;
}
.c-heading-title-top .c-heading-title-top-title h2 {
  font-size: clamp(48px, 6.3vw, 64px);
  line-height: 1;
  font-weight: bold;
  color: #FFE80D;
}
.c-heading-title-top .c-heading-title-top-title p {
  display: flex;
  align-items: center;
  flex: 1;
  margin: 0 0 4px clamp(12px, 1.5vw, 16px);
  font-weight: bold;
  line-height: 1;
}
.c-heading-title-top .c-heading-title-top-title p::before {
  content: "";
  display: inline-block;
  height: 1px;
  background-color: #a5a5a5;
  width: 32px;
  margin-right: 8px;
}
.c-heading-title-top .c-heading-title-top-text {
  margin-top: 24px;
  font-size: clamp(14px, 1.8vw, 16px);
}

@media (max-width: 599px) {
  .c-heading-title-group {
    display: contents;
  }
  .c-heading-title-group .slider-arrow-group {
    margin: 56px 0 24px;
    justify-content: end;
  }
}
@media (max-width: 499px) {
  .c-heading-title-top .c-heading-title-top-title {
    flex-direction: column;
    align-items: normal;
  }
  .c-heading-title-top .c-heading-title-top-title p {
    margin: 6px 0 0;
  }
}
/* TOP_数字で見る */
.c-heading-title-top-detail {
  margin-bottom: clamp(40px, 7vw, 56px);
}
.c-heading-title-top-detail .c-heading-title-top-title {
  text-align: center;
}
.c-heading-title-top-detail .c-heading-title-top-title h2 {
  font-size: clamp(48px, 6.3vw, 64px);
  line-height: 1;
  font-weight: bold;
  color: #FFE80D;
  padding-bottom: 24px;
}
.c-heading-title-top-detail .c-heading-title-top-title p {
  font-weight: bold;
  position: relative;
  font-size: 20px;
}
.c-heading-title-top-detail .c-heading-title-top-title p::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 1px;
  background-color: #a5a5a5;
  width: 45px;
  top: -35%;
}
.c-heading-title-top-detail .c-heading-title-top-text {
  text-align: center;
  margin-top: 24px;
  font-size: clamp(14px, 1.8vw, 16px);
}

.c-heading-title-faq-text {
  margin-top: 24px;
  font-size: clamp(14px, 1.8vw, 16px);
}

.c-heading-entry {
  text-align: center;
  color: #fff;
}
.c-heading-entry h2 {
  font-size: clamp(48px, 6.3vw, 64px);
  line-height: 1;
  font-weight: bold;
}
.c-heading-entry p {
  margin-top: 40px;
  font-size: clamp(14px, 1.8vw, 16px);
}

.c-heading-more {
  font-size: clamp(24px, 4vw, 30px);
  line-height: 1;
  font-weight: bold;
  color: #FFE80D;
}

/* 下層_人を知る_スケジュール */
.c-heading-member_sub-schedule,
.c-heading-WorkStyle {
  display: flex;
  align-items: center;
  font-weight: bold;
  margin-bottom: 64px;
}
.c-heading-member_sub-schedule h2,
.c-heading-WorkStyle h2 {
  color: #FFE80D;
  font-size: clamp(30px, 5vw, 42px);
  line-height: 1;
}
.c-heading-member_sub-schedule p,
.c-heading-WorkStyle p {
  display: flex;
  align-items: center;
  flex: 1;
  margin: 0 0 4px clamp(12px, 1.5vw, 16px);
  line-height: 1;
  color: #777;
}
.c-heading-member_sub-schedule p::before,
.c-heading-WorkStyle p::before {
  content: "";
  display: inline-block;
  height: 1px;
  background-color: #777;
  width: 32px;
  margin-right: 8px;
}

@media (max-width: 499px) {
  .c-heading-member_sub-schedule {
    flex-direction: column;
    align-items: normal;
  }
  .c-heading-member_sub-schedule p {
    margin: 6px 0 0;
  }
}
.c-heading-WorkStyle {
  margin-bottom: clamp(40px, 5vw, 64px);
}

@media (max-width: 449px) {
  .c-heading-WorkStyle {
    margin-bottom: clamp(40px, 5vw, 64px);
    flex-direction: column;
    align-items: flex-start;
  }
  .c-heading-WorkStyle p {
    margin: 6px 0 0;
  }
}
.l-main-company {
  margin-bottom: clamp(32px, 6vw, 56px);
}
.l-main-company .c-heading-title-top .c-heading-title-top-title h2 {
  font-size: clamp(32px, 5vw, 48px);
}

.c-heading-sub-kana {
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.5;
  font-weight: bold;
  color: #FFE80D;
  margin-bottom: 24px;
}

.l-main-sub-company {
  margin-bottom: clamp(32px, 6vw, 56px);
}
.l-main-sub-company .c-heading-title-top .c-heading-title-top-title h2 {
  font-size: clamp(38px, 4.3vw, 48px);
}

.c-label-news-tag {
  border: 1px solid #FFE80D;
  border-radius: 100vh;
  font-size: 12px;
  color: #FFE80D;
  padding: 6px 16px;
  font-weight: bold;
}

/* ---Project--- */
/*アコーディオン全体*/
.accordion-area li {
  cursor: pointer;
  margin-bottom: 24px;
}
.accordion-area li:last-child {
  margin-bottom: 0;
}

/*アコーディオンタイトル*/
.title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  position: relative;
  padding: clamp(18px, 2vw, 24px) clamp(16px, 3vw, 24px) clamp(18px, 2vw, 24px) clamp(16px, 2vw, 24px);
  color: #333333;
  background-color: #ececec;
  border-radius: 16px;
  transition: all 0.5s ease;
}
.title::before {
  content: "Q";
  color: #fff;
  display: flex;
  background-color: #FFE80D;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  font-size: clamp(12px, 3vw, 16px);
  line-height: 1;
  border-radius: 40px;
  flex: 0 0 30px;
  font-weight: normal;
}
.title::after {
  transform: translateY(-25%) rotate(45deg);
  width: 10px;
  height: 10px;
  margin-left: 10px;
  border-bottom: 2px solid #333333;
  border-right: 2px solid #333;
  content: "";
  transition: transform 0.5s;
}
.title h3 {
  flex: 1;
  color: #FFE80D;
  font-weight: bold;
  font-size: clamp(14px, 1.5vw, 16px);
  line-height: 1.6;
}

.title.close::after {
  transform: rotate(225deg);
}

/*アコーディオンで現れるエリア*/
.box {
  display: none; /*はじめは非表示*/
  padding: 20px clamp(24px, 3vw, 40px) 24px;
}
.box p {
  font-size: clamp(14px, 1.5vw, 16px);
}

/*アクティブになったエリア*/
#g-nav.panelactive {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  overflow-y: scroll;
}

/*丸の拡大*/
.circle-bg {
  position: fixed;
  z-index: 3;
  /*丸の形*/
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #FFE80D;
  /*丸のスタート位置と形状*/
  transform: scale(0); /*scaleをはじめは0に*/
  right: -50px;
  top: -50px;
  transition: all 0.6s; /*0.6秒かけてアニメーション*/
}

.circle-bg.circleactive {
  transform: scale(50); /*クラスが付与されたらscaleを拡大*/
}

/*ナビゲーション*/
#g-nav ul {
  display: none;
  opacity: 0; /*はじめは透過0*/
  position: relative;
  z-index: 999;
  width: 100%;
}

/*背景が出現後にナビゲーションを表示*/
#g-nav.panelactive {
  padding: clamp(120px, 24vw, 150px) 32px clamp(120px, 24vw, 150px);
}
#g-nav.panelactive ul {
  opacity: 1;
  display: block;
}

/* 背景が出現後にナビゲーション li を表示※レイアウトによって調整してください。不必要なら削除*/
#g-nav.panelactive ul li {
  animation-name: gnaviAnime;
  animation-duration: 1s;
  animation-delay: 0.2s; /*0.2 秒遅らせて出現*/
  animation-fill-mode: forwards;
  opacity: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.168627451);
  padding-bottom: 24px;
}

@keyframes gnaviAnime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*リストのレイアウト設定*/
#g-nav li {
  margin-bottom: 32px;
  font-weight: bold;
  font-size: clamp(16px, 3.2vw, 20px);
  color: #fff;
}
#g-nav li a {
  display: block;
}
#g-nav li .p-hamburger-menu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
#g-nav li .p-hamburger-menu::after {
  transform: translateY(-25%) rotate(45deg);
  width: 10px;
  height: 10px;
  margin-left: 10px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  content: "";
  transition: transform 0.5s;
}
#g-nav li .p-hamburger-menu.close::after {
  transform: rotate(225deg);
}
#g-nav li .box {
  padding: 24px clamp(24px, 3vw, 40px) 0 24px;
}
#g-nav li .box a {
  margin-bottom: 18px;
  font-size: 16px;
  font-weight: normal;
}
#g-nav li .box a:last-child {
  margin-bottom: 0;
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: relative;
  right: 0;
  z-index: 9999; /*ボタンを最前面に*/
  cursor: pointer;
  width: 50px;
  height: 50px;
}

/*×に変化*/
.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #fff;
  width: 45%;
}

.openbtn.active span {
  background-color: #fff;
}

.openbtn span:nth-of-type(1) {
  top: 15px;
}

.openbtn span:nth-of-type(2) {
  top: 23px;
}

.openbtn span:nth-of-type(3) {
  top: 31px;
}

.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}

/* ハンバーガーメニューが表示された時のフォントカラー */
.l-header-logo-group.active a p {
  color: #fff;
}

.l-header-logo-group.active .cls-1 {
  fill: #fff;
}

/* mv */
.p-mv-top {
  position: relative;
  overflow: hidden;
}

.fv_slider {
  display: flex;
  transition: transform 0.3s ease-in-out;
}

/* 共通 */
.p-section-main {
  padding: clamp(8px, 3vw, 25px) clamp(24px, 6vw, 40px);
  position: sticky;
  top: 0;
  z-index: 9999;
  background: #fff;
}

.p-section-itempage {
  padding: clamp(62px, 17vw, 120px) clamp(24px, 6vw, 40px);
}

.p-section-purchase {
  padding: clamp(62px, 17vw, 120px) clamp(24px, 6vw, 40px);
}

/* ---Utility--- */
/* margin */
.u-mt-32 {
  margin-top: 32px;
}/*# sourceMappingURL=style.css.map */