@charset "UTF-8";
/* ====================================================
 * top.css — トップページ固有 CSS
 *   - 旧 common.css に紛れていた studio セクションのアコーディオン
 *   - 旧 index.css の hero / topics / about / why / plan / studio /
 *     trial / voice / info / column 各セクション
 * ==================================================== */
/* ----- studio アコーディオン（旧 style.css 由来）----- */
* > .shop_accordion_item:first-of-type {
  border-top: solid 1px var(--color-rintosull-gray-200)
}
.shop_accordion_summary {
  border-bottom: solid 1px var(--color-rintosull-gray-200);
  padding: 15px 35px;
  font-size: 16px;
  list-style: none;
  transition: background-color .6s cubic-bezier(.19, 1, .22, 1);
  position: relative
}
@media (max-width:800px) {
  .shop_accordion_summary {
    font-size: calc((100vw / var(--vw-sp)) * 16)
  }
}
.shop_accordion_summary h2, .shop_accordion_summary h4 {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400
}
@media (max-width:800px) {
  .shop_accordion_summary h2, .shop_accordion_summary h4 {
    font-size: calc((100vw / var(--vw-sp)) * 16)
  }
}
.shop_accordion_summary::-webkit-details-marker {
  display: none
}
@media (max-width:800px) {
  .shop_accordion_summary {
    padding: calc((100vw / var(--vw-sp)) * 15) calc((100vw / var(--vw-sp)) * 20)
  }
}
.shop_accordion_summary:hover {
  background: var(--color-rintosull-gray-100)
}
.shop_accordion_summary:before {
  content: "";
  background: var(--color-rintosull-primary-blue1);
  width: 14px;
  height: 1px;
  display: block;
  position: absolute;
  top: 50%;
  right: 18px
}
@media (max-width:800px) {
  .shop_accordion_summary:before {
    right: calc((100vw / var(--vw-sp)) * 18);
    width: calc((100vw / var(--vw-sp)) * 16)
  }
}
.shop_accordion_summary:after {
  content: "";
  background: var(--color-rintosull-primary-blue1);
  width: 1px;
  height: 14px;
  margin-top: -7px;
  transition: transform .6s cubic-bezier(.19, 1, .22, 1), margin-top .6s cubic-bezier(.19, 1, .22, 1);
  display: block;
  position: absolute;
  top: 50%;
  right: 24px
}
@media (max-width:800px) {
  .shop_accordion_summary:after {
    right: calc((100vw / var(--vw-sp)) * 25);
    height: calc((100vw / var(--vw-sp)) * 16);
    margin-top: calc((100vw / var(--vw-sp)) * -7)
  }
}
.shop_accordion_item[open] .shop_accordion_summary:after {
  margin-top: -6.5px;
  transform: rotate(90deg)
}
@media (max-width:800px) {
  .shop_accordion_item[open] .shop_accordion_summary:after {
    margin-top: calc((100vw / var(--vw-sp)) * -7.5)
  }
}
.shop_accordion_body ul {
  margin: 0;
  padding: 0;
  list-style: none
}
.shop_accordion_body ul li {
  border-bottom: solid 1px var(--color-rintosull-gray-200)
}
.shop_accordion_body ul li h5 {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400
}
@media (max-width:800px) {
  .shop_accordion_body ul li h5 {
    font-size: calc((100vw / var(--vw-sp)) * 16)
  }
}
.shop_accordion_body ul li a {
  background: var(--color-rintosull-gray-50);
  padding: 15px 70px;
  transition: background-color .6s cubic-bezier(.19, 1, .22, 1);
  display: block;
  position: relative
}
@media (max-width:800px) {
  .shop_accordion_body ul li a {
    padding: calc((100vw / var(--vw-sp)) * 15) calc((100vw / var(--vw-sp)) * 53)
  }
}
.shop_accordion_body ul li a:hover {
  background: var(--color-rintosull-gray-100)
}
.shop_accordion_body ul li a:before {
  content: "";
  border-top: solid 1px var(--color-rintosull-gray-300);
  border-right: solid 1px var(--color-rintosull-gray-300);
  width: 6px;
  height: 6px;
  margin-top: -3px;
  transition: right .6s cubic-bezier(.19, 1, .22, 1);
  display: block;
  position: absolute;
  top: 50%;
  right: 23px;
  transform: rotate(45deg)
}
@media (max-width:800px) {
  .shop_accordion_body ul li a:before {
    right: calc((100vw / var(--vw-sp)) * 23);
    width: calc((100vw / var(--vw-sp)) * 6);
    height: calc((100vw / var(--vw-sp)) * 6);
    margin-top: calc((100vw / var(--vw-sp)) * -6)
  }
}
.shop_accordion_body ul li a:hover:before {
  right: 18px
}
/* ----- 各セクション本体（旧 index.css）----- */
/* =========================================================
 * index.css
 *   TOPページ (index.php) 固有スタイル。
 *   ヘッダー/フッター/CTA など共通パーツは common.css 側。
 *
 *   命名規則: スネークケース + セクション接頭辞
 *     例) .hero_image / .campaign_title / .program_list
 *
 *   ブレイクポイント:
 *     既定        … SP（(100vw / var(--vw-sp)) * N の流動値）
 *     min-width:801px … PC（固定 px）
 * ========================================================= */
/* ==================================================================
 * <main> 全体
 * ================================================================== */
main {
  width: 100%;
  overflow: hidden;
}
/* ==================================================================
 * hero セクション
 *   - キービジュアル画像を SP / PC で切り替え
 *   - 旧: <main class="w-full overflow-hidden"><section>
 *           <div class="w-full overflow-hidden">
 *             <h1 class="sr-only">...</h1>
 *             <img class="block h-auto w-full pc:hidden" ...>  // SP
 *             <img class="hidden h-auto w-full pc:block" ...>  // PC
 * ================================================================== */
.hero {
  position: relative;
}
.hero_inner {
  position: relative;
  width: 100%;
  height: var(--mv-h);
  overflow: hidden;
}
.hero_title {
  position: absolute;
  color: #FFF;
  font-size: 2rem;
  line-height: 2.5rem;
  font-family: var(--font-shippori);
  font-weight: 300;
  left: calc((100vw / var(--vw-sp)) * 20);
  bottom: calc((100vw / var(--vw-sp)) * 50);
  z-index: 2;
}
.hero_title span {
  font-size: 0.85rem;
  border-top: 1px solid;
  padding-top: 0.5rem;
  font-family: var(--font-noto-sans-jp);
  font-weight: 500;
}
/* キービジュアル動画。
   width/height を 100% にして親の aspect-ratio に従わせ、
   object-fit: cover で中央クロップさせる。 */
.hero_video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media (min-width: 801px) {
  .hero {
    --mv-h: min(calc((100vw / var(--vw-sp)) * (2561 / 1321 * 600 / 2561 * 1321)), 90svh);
    /* PCは元の 2561/1321 比でいく場合 */
  }
  .hero_title {
    left: calc(100vw * 0.05);
    bottom: calc(100vw * 0.04);
  }
  .hero_inner {
    aspect-ratio: 2561 / 1321;
    height: auto; /* PCではaspect-ratio優先に戻す */
  }
}
@media (min-width: 801px) {
  .hero_inner {
    aspect-ratio: 2561 / 1321; /* PC（横長） */
  }
}
/* ==================================================================
 * topics セクション
 *   - 共通: <h2 class="section_title topics_title"> + <small class="section_title_sub">
 *   - 中身: バナー画像 (SP/PC で切替)
 * ================================================================== */
.topics {
  padding-top: calc((100vw / var(--vw-sp)) * 53);
  padding-bottom: calc((100vw / var(--vw-sp)) * 59);
}
/* 横幅を内側でまとめる共通ラッパ。
   ※ 他セクションでも同じ振る舞いを使うので、後で共通化検討。 */
.topics_inner {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 20);
}
/* TOPICS 見出し: 共通 .section_title を、間隔と字間だけ上書き */
.topics_title {
  margin-bottom: calc((100vw / var(--vw-sp)) * 28);
}
.topics_slider {
  width: 100%;
  margin: 0 auto;
  max-width: 800px;
}
.topics_banner_link {
  display: block;
  width: 100%;
  cursor: pointer;
}
/* バナー画像。表示/非表示は .is_sp_only / .is_pc_only に任せる */
.topics_banner_image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
/* ページネーション（ドット）のカスタマイズ */
.topics_pagination.swiper-pagination-bullets {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: calc((100vw / var(--vw-sp)) * 16);
}
.topics_pagination .swiper-pagination-bullet {
  display: inline-block;
  width: calc((100vw / var(--vw-sp)) * 5);
  height: calc((100vw / var(--vw-sp)) * 5);
  border-radius: 50%;
  background: var(--color-five-beige-200);
  cursor: pointer;
  padding: 0;
  border: none;
  outline: none;
  transition: background-color 0.3s ease;
  flex-shrink: 0;
}
@media (min-width: 801px) {
  .topics_pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
  }
}
.topics_pagination .swiper-pagination-bullet-active {
  background: var(--color-five-primary-pink2);
}
@media (min-width: 801px) {
  .topics {
    padding-top: 88px;
    padding-bottom: 162px;
  }
  .topics_inner {
    max-width: 800px;
    padding: 0;
  }
  .topics_title {
    margin-bottom: 46px;
    letter-spacing: 0.05em;
  }
}
/* ==================================================================
 * about セクション（ABOUT MACHINE PILATES）
 *   - 上端を左角丸でラップ。SP/PCで背景画像切替（.about_bg）。
 *   - h2 は共通 .section_title を使い、間隔と字間だけ .about_title で上書き。
 * ================================================================== */
.about {
  position: relative;
  padding-top: calc((100vw / var(--vw-sp)) * 80);
  padding-bottom: calc((100vw / var(--vw-sp)) * 70);
  background-color: var(--color-rintosull-white);
  overflow: hidden;
}
/* 背景画像レイヤ（絶対配置で全面に敷く） */
.about_bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.about_bg_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* テキスト本体 */
.about_inner {
  position: relative;
  z-index: 1;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 20);
}
/* h2 個別調整: .section_title をベースに余白と字間だけ上書き */
.about_title {
  margin-bottom: calc((100vw / var(--vw-sp)) * 30);
  color: #FFF;
}
.about_title .section_title_sub {
  color: #FFF;
}
/* リード文 */
.about_lead {
  font-size: calc((100vw / var(--vw-sp)) * 16);
  font-weight: 500;
  line-height: 1.6;
}
.about_lead_strong {
  font-weight: 700;
  color: var(--color-rintosull-primary-blue1);
}
/* 特徴イメージ（PCでは画面幅いっぱい）*/
.about_features {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  max-width: 533px;
}
.about_features_image {
  width: 100%;
}
/* ボタン行 */
.about_link_wrap {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  margin-top: calc((100vw / var(--vw-sp)) * 27);
}
@media (min-width: 801px) {
  .about {
    margin-top: -100px;
    padding-top: 77px;
    padding-bottom: 122px;
  }
  .about_inner {
    max-width: 800px;
    padding: 0;
  }
  .about_title {
    margin-bottom: 0;
    letter-spacing: 0.05em;
  }
  .about_lead {
    font-size: 16px;
    letter-spacing: -0.04em;
  }
  .about_features {
    margin-top: 23px;
  }
  .about_features_image.is_pc_only {
    min-height: 740px;
    object-fit: cover;
  }
  .about_link_wrap {
    margin-top: 24px;
  }
}
/* ==================================================================
 * why セクション（WHY Rintosull?）
 *   - グレー背景。上端を右角丸でラップ。
 *   - 中身は 3 つの POINT カード（画像左 + テキスト右の2カラム、SPは縦積み）
 *     と末尾ボタン。
 * ================================================================== */
.why {
  position: relative;
  padding-top: calc((100vw / var(--vw-sp)) * 77);
  padding-bottom: calc((100vw / var(--vw-sp)) * 50);
  background-color: var(--color-five-gray-100);
}
/* 見出し用ラッパ */
.why_inner {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 20);
}
/* h2 個別調整 */
}
.why_title .section_title_sub {
  letter-spacing: 0.1em;
  color: var(--color-five-gray-200);
  margin-top: calc((100vw / var(--vw-sp)) * 20);
}
.why_title .section_title_sub span {
  color: var(--color-five-primary-pink2);
}
/* 各 POINT カード */
.why_point {
  display: flex;
  flex-direction: column;
  margin-top: calc((100vw / var(--vw-sp)) * 45);
}
/* SP は縦積み、PC は横並び */
.why_point_layout {
  display: flex;
  flex-direction: column;
  gap: calc((100vw / var(--vw-sp)) * 38);
  max-width: 100%;
  margin: 0 auto;
}
/* 画像カラム */
.why_point_image {
  position: absolute;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 47);
}
.why_point_image_box {
  width: 100%;
}
/* display は .is_sp_only / .is_pc_only に任せる（display:block を書くと両方表示される） */
.why_point_image_box img {
  width: 100%;
}
/* POINT バッジ（左下に重ねる / PC は右側へ） */
.why_point_label {
  position: absolute;
  bottom: calc((100vw / var(--vw-sp)) * -10);
  left: calc((100vw / var(--vw-sp)) * -20);
  width: calc((100vw / var(--vw-sp)) * 240);
}
.why_point_label img {
  width: 100%;
  display: block;
}
/* テキストカラム */
.why_point_body {
  position: relative;
  padding-top: calc((100vw / var(--vw-sp)) * 210);
}
.why_point_body_inner {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 20);
}
.why_point_title {
  margin: 0 0 calc((100vw / var(--vw-sp)) * 8);
  font-size: calc((100vw / var(--vw-sp)) * 18);
  line-height: 1.4;
  font-weight: 500;
  color: var(--color-five-primary-pink2);
  font-feature-settings: "halt" 1;
}
.why_point_title small {
  font-size: calc((100vw / var(--vw-sp)) * 10);
}
.why_point_title strong {
  font-size: calc((100vw / var(--vw-sp)) * 53);
  font-family: var(--font-rig-300);
  font-weight: 100;
  line-height: 0.9;
  letter-spacing: -0.05em;
}
.why_point_title strong span {
  font-size: calc((100vw / var(--vw-sp)) * 13);
  font-family: var(--font-rig-500);
  letter-spacing: 0.25em;
  font-weight: bold;
  padding-left: calc((100vw / var(--vw-sp)) * 5);
}
.why_inner + .why_point .why_point_title strong {
  letter-spacing: 0;
}
.why_point:first-of-type .why_point_title strong span {
  padding-left: calc((100vw / var(--vw-sp)) * 4);
}
/* POINT 03 等で使う黄色マーカー */
.why_point_title_marker {
  background: linear-gradient(transparent 70%, #fff000 70%);
}
.why_point_text {
  text-align: justify;
  font-feature-settings: "halt" 1;
  line-height: 1.4;
  font-weight: 500;
}
.why_point_text small {
  font-size: calc((100vw / var(--vw-sp)) * 10);
}
.why_link_wrap {
  display: flex;
  justify-content: center;
  margin-top: calc((100vw / var(--vw-sp)) * 48);
}
@media (min-width: 801px) {
  .why {
    padding-top: 77px;
    padding-bottom: 0;
  }
  .why_inner {
    max-width: 800px;
    padding: 0;
  }
  .why_title {
    margin-bottom: 0;
  }
  .why_point {
    margin-top: 40px;
  }
  .why_point + .why_point {
    margin-top: 40px;
  }
  .why > .why_point:nth-of-type(even) .why_point_layout {
    flex-direction: row-reverse;
  }
  .why_point_layout {
    flex-direction: row;
    gap: 32px;
    max-width: 790px;
  }
  .why_point_image {
    max-width: 800px;
    padding: 0;
    position: unset;
  }
  .why_point_image_box {
    width: 327px;
    height: auto;
    border-radius: 20px;
  }
  .why_point_label {
    top: 18px;
    bottom: auto;
    left: 100%;
    width: 228px;
  }
  .why_point_body {
    padding-top: 0;
  }
  .why_point_body_inner {
    max-width: 385px;
    padding: 0;
  }
  .why_point_title {
    margin-bottom: 16px;
    font-size: 26px;
  }
  .why_point:nth-of-type(4) .why_point_title,
  .why_point:last-of-type .why_point_title {
    letter-spacing: -0.05em;
  }
  .why_point_title strong {
    font-size: 53px;
  }
  .why_point_title strong span,
  .why_point:first-of-type .why_point_title strong span {
    font-size: 13px;
    padding-left: 4px;
  }
  .why_point_text small {
    font-size: 12px;
    display: inline-block;
    margin-top: 15px;
  }
  .why_link_wrap {
    margin-top: 64px;
  }
}
/* ==================================================================
 * plan セクション（PLAN / 料金プラン）
 *   - グラデーション背景。上端を左角丸でラップ。
 *   - 中身は 3 枚のプランカード（SP 横並びの上下構造、PC は縦並びの上下構造）。
 * ================================================================== */
.plan {
  position: relative;
  padding-bottom: calc((100vw / var(--vw-sp)) * 190);
  background: var(--color-five-gray-100);
}
.plan_bg {
  position: absolute;
  bottom: 0;
  z-index: 0;
}
.plan_inner_bg {
  background: #B3833B;
  background: linear-gradient(90deg,rgba(179, 131, 59, 1) 0%, rgba(253, 243, 182, 1) 21%, rgba(217, 184, 82, 1) 51%, rgba(239, 220, 144, 1) 68%, rgba(253, 243, 182, 1) 79%, rgba(228, 204, 146, 1) 85%, rgba(210, 174, 118, 1) 91%, rgba(198, 156, 101, 1) 96%, rgba(194, 149, 95, 1) 100%);
  border-radius: calc((100vw / var(--vw-sp)) * 176);
  position: relative;
  z-index: 0;
  padding-top: calc((100vw / var(--vw-sp)) * 2);
  padding-bottom: calc((100vw / var(--vw-sp)) * 2);
}
.plan_inner_bg02 {
  background: #C5736C;
  background: linear-gradient(-180deg,rgba(197, 115, 108, 1) 0%, rgba(223, 162, 157, 1) 44%, rgba(197, 115, 108, 1) 100%);
  border-radius: calc((100vw / var(--vw-sp)) * 176);
  margin: calc((100vw / var(--vw-sp)) * 0) calc((100vw / var(--vw-sp)) * 2);
  position: relative;
  z-index: 0;
}
.plan_inner {
  max-width: 100%;
  margin: 0 auto;
  padding: calc((100vw / var(--vw-sp)) * 50) calc((100vw / var(--vw-sp)) * 20) calc((100vw / var(--vw-sp)) * 85);
}
.plan_title {
  color: #FFF;
}
.plan_title .section_title_sub {
  color: #FFF;
}
.plan_list {
  display: flex;
  flex-direction: column;
  gap: calc((100vw / var(--vw-sp)) * 20);
  margin-top: calc((100vw / var(--vw-sp)) * 22);
}
/* 1 枚のプランカード */
.plan_card {
  display: flex;
  flex-wrap: wrap;
  border-radius: calc((100vw / var(--vw-sp)) * 40);
  background-color: var(--color-rintosull-white);
  position: relative;
  width: 100%;
  border: 1px solid #FFF;
  overflow: hidden;
}
.plan_card_title {
  width: 100%;
  text-align: center;
  background: var(--color-five-primary-pink2);
  color: #FFF;
  font-weight: bold;
  letter-spacing: 0.1em;
  padding: calc((100vw / var(--vw-sp)) * 6) 0 calc((100vw / var(--vw-sp)) * 4);
  position: relative;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
.plan_card:first-child .plan_card_title {
  background: var(--color-five-primary-pink2);
}
.plan_card:nth-child(2) .plan_card_title {
  background: var(--color-five-primary-purple);
}
.plan_card:last-child .plan_card_title {
  background: var(--color-five-beige-100);
}
.plan_card_title small {
  font-size: calc((100vw / var(--vw-sp)) * 13);
  font-family: var(--font-rig-500);
}
.plan_card_title span.icon {
  position: absolute;
  right: calc((100vw / var(--vw-sp)) * 20);
  border-radius: 50px;
  font-size: calc((100vw / var(--vw-sp)) * 12);
  padding: 0 calc((100vw / var(--vw-sp)) * 9) calc((100vw / var(--vw-sp)) * 2);
}
.plan_card:nth-child(2) .plan_card_title span.icon {
  background: #7F6C92;
}
.plan_card:last-child  .plan_card_title span.icon {
  background: #957567;
}
/* タイトル領域（SP: 左, PC: 上） */
.plan_card_head {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc((100vw / var(--vw-sp)) * 20) calc((100vw / var(--vw-sp)) * 15) calc((100vw / var(--vw-sp)) * 22) calc((100vw / var(--vw-sp)) * 15);
  border-bottom-left-radius: calc((100vw / var(--vw-sp)) * 40);
  width: 50%;
}
.plan_card:first-child .plan_card_head {
  background: var(--color-five-primary-pink-light);
}
.plan_card:nth-child(2) .plan_card_head {
  background: var(--color-five-primary-purple-light);
}
.plan_card:last-child .plan_card_head {
  background: var(--color-five-beige-300);
}
.plan_card_head_title {
  margin: 0;
  font-size: calc((100vw / var(--vw-sp)) * 18);
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-five-gray-200);
  text-align: center;
}
.plan_card_head_title span {
  font-size: calc((100vw / var(--vw-sp)) * 13);
}
.plan_card_head_title span span {
  font-size: calc((100vw / var(--vw-sp)) * 9);
  vertical-align: super;
}
/* 価格領域（SP: 右, PC: 下） */
.plan_card_body {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc((100vw / var(--vw-sp)) * 10);
  width: 100%;
  padding: calc((100vw / var(--vw-sp)) * 16) calc((100vw / var(--vw-sp)) * 19) calc((100vw / var(--vw-sp)) * 20) calc((100vw / var(--vw-sp)) * 16);
}
.plan_card_name {
  font-size: calc((100vw / var(--vw-sp)) * 18);
  line-height: 1.2;
  text-align: center;
  font-weight: 500;
}
.plan_card_price {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.plan_card_price_label {
  font-size: calc((100vw / var(--vw-sp)) * 14);
  font-weight: 600;
}
.plan_card_price_value {
  font-size: calc((100vw / var(--vw-sp)) * 20);
  line-height: 0.9;
  text-align: center;
  font-weight: 500;
}
.plan_card_price_value_num {
  font-size: calc((100vw / var(--vw-sp)) * 32);
}
.plan_card_price_value small {
  font-size: calc((100vw / var(--vw-sp)) * 14);
  font-weight: bold;
}
.plan_link_wrap {
  display: flex;
  justify-content: center;
  margin-top: calc((100vw / var(--vw-sp)) * 48);
}
.plan_note {
  text-align: center;
  color: #FFF;
  font-weight: 500;
  font-size: calc((100vw / var(--vw-sp)) * 11);
  margin-top: calc((100vw / var(--vw-sp)) * 12);
}
@media (min-width: 801px) {
  .plan {
    padding-top: 60px;
    padding-bottom: calc((100vw / var(--vw-pc)) * 420);
  }
  .plan_inner_bg {
    max-width: 1200px;
    margin: 0 auto;
    border-radius: calc((100vw / var(--vw-pc)) * 280);
    padding-top: calc((100vw / var(--vw-pc)) * 2);
    padding-bottom: calc((100vw / var(--vw-pc)) * 1);
  }
  .plan_inner_bg02 {
    border-radius: calc((100vw / var(--vw-pc)) * 280);
    margin: 0 calc((100vw / var(--vw-pc)) * 2);
  }
  .plan_inner {
    max-width: 800px;
    padding: 72px 20px 75px;
  }
  .plan_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: stretch;
    gap: 16px;
    margin-top: 60px;
  }
  .plan_card {
    flex-direction: column;
    border-radius: 20px;
    overflow: unset;
  }
  .plan_card_head {
    justify-content: center;
    padding: 18px 28px;
    width: 100%;
    border-bottom-left-radius: 0;
    flex: none;
  }
  .plan_card_title {
    padding: 10px 0;
  }
  .plan_card_title span.icon {
    font-size: 12px;
    right: 0;
    left: 0;
    margin: auto;
    top: -14px;
    padding: 3px 0;
    width: 110px;
  }
  .plan_card:nth-child(2) .plan_card_title,
  .plan_card:last-child .plan_card_title {
    padding: 13px 0 7px;
  }
  .plan_card:last-child .plan_card_head {
    padding: 10.8px;
  }
  .plan_card:last-child .plan_card_head h3 {
    line-height: 1.2;
  }
  .plan_card_title small {
    font-size: 14px;
  }
  .plan_card_head_title span {
    font-size: 15px;
  }
  .plan_card_head_title span span {
    font-size: 10px;
  }
  .plan_card_head_title {
    font-size: 18px;
  }
  .plan_card_body {
    justify-content: flex-start;
    gap: 12px;
    padding: 18px 40px 22px;
    flex: none;
  }
  .plan_card_body::before {
    top: 0;
    right: 35px;
    bottom: auto;
    left: 36px;
    width: auto;
    height: 1px;
  }
  .plan_card_name {
    font-size: 18px;
  }
  .plan_card_price {
    margin: auto;
  }
  .plan_card_price_label {
    font-size: 14px;
  }
  .plan_card_price_value {
    font-size: 20px;
  }
  .plan_card_price_value_num {
    font-size: 32px;
  }
  .plan_card_price_value small {
    font-size: 14px;
  }
  .plan_note {
    font-size: 12px;
    margin-top: 10px;
  }
}
@media (min-width: 1024px) {
  .plan_inner_bg {
    border-radius: 320px;
  }
  .plan_inner_bg02 {
    border-radius: 320px;
  }
}
/* ==================================================================
 * trial / 体験会の流れ
 *   - .plan の下に重なるグレー帯。top-right だけ丸い形状。
 *   - ::before で右上にトリミング画像（PC/SP で別アセット）。
 *   - 3 ステップ（番号バッジ + 画像 + 説明）を SP 縦並び / PC 横並び。
 * ================================================================== */
.trial {
  position: relative;
  padding-top: calc((100vw / var(--vw-sp)) * 77);
  padding-bottom: calc((100vw / var(--vw-sp)) * 70);
  background-color: var(--color-five-gray-100);
}
.trial_inner {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 20);
}
.trial_header {
  width: 100%;
}
.trial_title {
  margin-bottom: calc((100vw / var(--vw-sp)) * 20);trial_lead
}
.trial_steps {
  display: flex;
  flex-direction: column;
  gap: calc((100vw / var(--vw-sp)) * 20);
}
.trial_step {
  display: flex;
}
.trial_step_num {
  position: relative;
  width: calc((100vw / var(--vw-sp)) * 40);
  margin-right: calc((100vw / var(--vw-sp)) * 20);
  color: var(--color-five-primary-pink2);
}
.trial_step_num::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc((100vw / var(--vw-sp)) * 19);
  display: block;
  width: 1px;
  height: calc(100% - 4.6em);
  margin-top: auto;
  margin-bottom: 0;
  background-color: var(--color-five-primary-pink2);
}
.trial_step:last-of-type .trial_step_num::before {
  display: none;
}
.trial_step_num_text {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc((100vw / var(--vw-sp)) * 35);
  padding-bottom: calc((100vw / var(--vw-sp)) * 5);
  font-family: var(--font-rig-300);
  font-size: calc((100vw / var(--vw-sp)) * 53);
  letter-spacing: -0.05em;
  line-height: 1;
}
.trial_step_num_text small {
  display: block;
  margin-bottom: calc((100vw / var(--vw-sp)) * 3);
  font-family: var(--font-rig-500);
  font-size: calc((100vw / var(--vw-sp)) * 13);
  font-weight: 600;
  letter-spacing: 0.2em;
  padding-left: calc((100vw / var(--vw-sp)) * 6);
}
.trial_step_body {
  flex: 1;
  padding-right: 0;
}
.trial_step:last-of-type .trial_step_body {
  padding-bottom: 0;
}
.trial_step_body_inner {
  overflow: hidden;
  border-radius: calc((100vw / var(--vw-sp)) * 20);
  background-color: var(--color-rintosull-white);
}
.trial_step_image {
  height: auto;
  line-height: 0;
}
.trial_step_image img {
  width: 100%;
  height: auto;
}
.trial_step_detail {
  min-height: auto;
  padding: calc((100vw / var(--vw-sp)) * 10) calc((100vw / var(--vw-sp)) * 19) calc((100vw / var(--vw-sp)) * 20);
}
.trial_step_title {
  margin: 0 0 calc((100vw / var(--vw-sp)) * 8);
      color: var(--color-five-primary-pink1);
  font-size: calc((100vw / var(--vw-sp)) * 18);
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
}
.trial_step_text {
  margin: 0;
  font-size: calc((100vw / var(--vw-sp)) * 14);
  line-height: 1.5;
  font-feature-settings: "halt" 1;
  font-weight: 500;
  text-align: justify;
}
.trial_steps .trial_step:last-child .trial_step_text {
  letter-spacing: calc((100vw / var(--vw-sp)) * -0.75);
}
.trial_step_note {
  display: block;
  color: var(--color-five-gray-150);
  font-size: calc((100vw / var(--vw-sp)) * 10);
  line-height: 1.2;
  padding-top: calc((100vw / var(--vw-sp)) * 5);
}
.trial_buttons {
  margin-top: calc((100vw / var(--vw-sp)) * 48);
}
.trial_buttons_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc((100vw / var(--vw-sp)) * 16);
}

@media (min-width: 801px) {
  .trial {
    padding-top: 77px;
    padding-bottom: 77px;
  }
  .trial::before {
    top: -100px;
    left: 50%;
    right: auto;
    width: 650px;
    height: 370px;
    aspect-ratio: auto;
    border-radius: 0;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    background-image: url('../images/figure-trial_260401.02kv_a5oixaua.webp');
  }
  .trial_inner {
    max-width: 800px;
    padding: 0;
  }
  .trial_header {
    margin-bottom: 44px;
  }
  .trial_lead {
    margin-bottom: 64px;
    font-size: 18px;
  }
  .trial_steps {
    flex-direction: row;
    justify-content: flex-start;
    gap: 12px;
  }
  .trial_step {
    flex: 1;
    display: block;
  }
  .trial_step_num {
    width: auto;
    margin-right: 0;
    margin-bottom: 15px;
    padding-left: 13px;
  }
  .trial_step_num::before {
    top: auto;
    bottom: 34px;
    left: auto;
    right: 0;
    width: calc(100% - 4.3em);
    height: 1px;
    margin: 0;
  }
  .trial_step:last-of-type .trial_step_num::before {
    display: block;
  }
  .trial_step_num_text {
    flex-direction: column;
    width: 35px;
    padding-bottom: 0;
    font-size: 53px;
    letter-spacing: -0.01em;
  }
  .trial_step_num_text small {
    margin-bottom: 3px;
    font-size: 14px;
    letter-spacing: 0.25em;
    padding-left: 7px;
  }
  .trial_step_body {
    padding-bottom: 0;
  }
  .trial_step_body_inner {
    border-radius: 20px;
  }
  .trial_step_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .trial_step_detail {
    padding: 10px 20px 25px;
    min-height: 170px;
  }
  .trial_step_title {
    margin-bottom: 15px;
    font-size: 18px;
  }
  .trial_step_text {
    font-size: 14px;
  }
  .trial_step_note {
    font-size: 10px;
  }
  .trial_buttons {
    margin-top: 64px;
  }
  .trial_buttons_inner {
    gap: 25px;
  }
  .trial_help_link {
    padding-right: 30px;
    padding-bottom: 4px;
  }
  .trial_help_link::after {
    width: 10px;
    height: 10px;
    margin-top: -8px;
    right: 8px;
  }
  .trial_steps .trial_step:last-child .trial_step_text {
    letter-spacing: 0;
  }
}
/* ==================================================================
 * voice / 会員様の声
 *   - .trial の下に重なる濃い青の帯。top-left だけ丸い形状。
 *   - 背景に "VOICE" の超大文字飾り。
 *   - Q. 質問画像 + ドーナツチャート + 91% コピー。
 *   - 会員カード 6 枚（アイコン + 見出し + 本文 + ハッシュタグ）。
 *   - SP 1 列 / PC 2 列。最後に「通いやすい店舗を探す」ボタン。
 * ================================================================== */
.voice {
  position: relative;
  overflow: hidden;
  padding-top: calc((100vw / var(--vw-sp)) * 137);
  padding-bottom: calc((100vw / var(--vw-sp)) * 50);
  background-color: #E1D8D4;
}
.voice_bg {
  position: absolute;
  top: 0;
}
.voice_inner_bg {
  background: #B3833B;
  background: linear-gradient(90deg,rgba(179, 131, 59, 1) 0%, rgba(253, 243, 182, 1) 21%, rgba(217, 184, 82, 1) 51%, rgba(239, 220, 144, 1) 68%, rgba(253, 243, 182, 1) 79%, rgba(228, 204, 146, 1) 85%, rgba(210, 174, 118, 1) 91%, rgba(198, 156, 101, 1) 96%, rgba(194, 149, 95, 1) 100%);
  border-radius: calc((100vw / var(--vw-sp)) * 167);
  position: relative;
  z-index: 0;
  width: 90%;
  margin: 0 auto;
  padding-bottom: calc((100vw / var(--vw-sp)) * 1);
  padding-top: calc((100vw / var(--vw-sp)) * 1);
  box-shadow: 0px 3px 16px 0px rgba(0, 0, 0, 0.25);
}
.voice_inner_bg02 {
  background: var(--color-five-beige-100);
  border-radius: calc((100vw / var(--vw-sp)) * 167);
  padding-bottom: calc((100vw / var(--vw-sp)) * 100);
  margin: calc((100vw / var(--vw-sp)) * 0) calc((100vw / var(--vw-sp)) * 2);
  position: relative;
  z-index: 0;
}
.voice_inner_bg02:before,
.voice_inner_bg02:after {
  content: '';
  display: block;
  width: 100%;
  height: calc((100vw / var(--vw-sp)) * 270);
  position: absolute;
  z-index: -1;
  mix-blend-mode: color-dodge;
  pointer-events: none;
}
.voice_inner_bg02:before {
  background: url("../img/bg-top-voice-sp.webp") 100% 0 / 100% no-repeat;
  top: calc((100vw / var(--vw-sp)) * 1);
}
.voice_inner_bg02:after {
  background: url("../img/bg-bottom-voice-sp.webp") 100% 0 / 100% no-repeat;
  bottom: calc((100vw / var(--vw-sp)) * 4);
}
.voice_bg_text {
  position: absolute;
  top: calc((100vw / var(--vw-sp)) * 1);
  right: calc((100vw / var(--vw-sp)) * -29);
  margin-top: calc((100vw / var(--vw-sp)) * -25);
  width: 100%;
  font-family: var(--font-scheherazade);
  font-weight: 400;
  font-size: calc((100vw / var(--vw-sp)) * 120);
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color-rintosull-primary-blue2);
  pointer-events: none;
}
.voice_inner {
  position: relative;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 calc((100vw / var(--vw-sp)) * 20);
  padding-top: calc((100vw / var(--vw-sp)) * 50);
  padding-bottom: calc((100vw / var(--vw-sp)) * 20);
}
.voice_title {
  margin-bottom: calc((100vw / var(--vw-sp)) * 32);
  color: var(--color-rintosull-white);
}
.voice_title .section_title_sub {
  color: var(--color-rintosull-white);
  margin-top: calc((100vw / var(--vw-sp)) * 20);
}
.voice_lead {
  font-size: calc((100vw / var(--vw-sp)) * 14);
  font-weight: 500;
  color: var(--color-five-gray-200);
  background: #FFF;
  border-radius: calc((100vw / var(--vw-sp)) * 30);
  padding: calc((100vw / var(--vw-sp)) * 7) calc((100vw / var(--vw-sp)) * 7) calc((100vw / var(--vw-sp)) * 7) calc((100vw / var(--vw-sp)) * 8);
  letter-spacing: -0.06em;
  position: relative;
}
.voice_lead:after {
  content: '';
  display: block;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  border: 6px solid transparent;
  border-left: 13px solid #FFF;
  position: absolute;
  bottom: calc((100vw / var(--vw-sp)) * -12);
  transform: rotate(90deg);
  left: 0;
  right: 0;
  margin: auto;
}
.voice_stats_question {
  display: flex;
  justify-content: center;
  width: calc((100vw / var(--vw-sp)) * 350);
}
.voice_stats_question img {
  width: 100%;
  height: auto;
}
.voice_stats_chart {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: calc((100vw / var(--vw-sp)) * 18);
}
.voice_stats_chart .pie_chart {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 0 auto;
  border-radius: 50%;
  background-image: conic-gradient(#d07573 91%, #ffffff 91% 100%);
}
.voice_stats_chart .pie_chart span {
  position: absolute;
  top: 75%;
  right: 50%;
  transform: translate(50%, -50%);
  color: #fff;
  font-weight: 600;
  font-size: 1.1em;
}
.voice_stats_chart_image {
  flex-shrink: 0;
  width: calc((100vw / var(--vw-sp)) * 198);
  margin-bottom: calc((100vw / var(--vw-sp)) * 10);
  line-height: 0;
}
.voice_stats_chart_image img {
  width: 100%;
  height: auto;
}
.voice_stats_chart_text {
  font-weight: 500;
  font-size: calc((100vw / var(--vw-sp)) * 24);
  line-height: 1.3;
  text-align: center;
  color: #FFF;
}
.voice_stats_chart_text strong {
  font-family: var(--font-rig-500);
  font-weight: 500;
  font-size: calc((100vw / var(--vw-sp)) * 42);
}
.voice_stats_chart_text strong small {
  font-size: calc((100vw / var(--vw-sp)) * 25);
}
.voice_cards {
  display: flex;
  flex-direction: column;
  gap: calc((100vw / var(--vw-sp)) * 23);
  margin-top: calc((100vw / var(--vw-sp)) * 20);
  padding: 0;
  list-style: none;
}
.voice_card {
  display: flex;
  width: 100%;
  padding: calc((100vw / var(--vw-sp)) * 20);
  border-radius: calc((100vw / var(--vw-sp)) * 20);
  background-color: var(--color-rintosull-white);
}
.voice_card_profile {
  width: calc((100vw / var(--vw-sp)) * 80);
  text-align: center;
}
.voice_card_figure {
  margin: 0 0 calc((100vw / var(--vw-sp)) * 16);
}
.voice_card_figure img {
  width: calc((100vw / var(--vw-sp)) * 80);
  height: auto;
}
.voice_card_age {
  margin: 0;
  font-size: calc((100vw / var(--vw-sp)) * 12);
  line-height: 1;
  letter-spacing: 0.1em;
  color: var(--color-five-primary-pink2);
  font-weight: 600;
}
.voice_card_body {
  flex: 1;
  padding-left: calc((100vw / var(--vw-sp)) * 20);
}
.voice_card_title {
  margin: 0 0 calc((100vw / var(--vw-sp)) * 10);
  font-size: calc((100vw / var(--vw-sp)) * 18);
  font-weight: 500;
  line-height: 1.3;
  color: var(--color-five-primary-pink2);
}
.voice_card_text {
  margin: 0;
  font-size: calc((100vw / var(--vw-sp)) * 14);
  line-height: 1.4;
  text-align: justify;
  letter-spacing: -0.03em;
  font-feature-settings: "halt" 1;
  font-weight: 500;
}
.voice_card_tags {
  display: flex;
  flex-wrap: wrap;
  gap: calc((100vw / var(--vw-sp)) * 8);
  margin: calc((100vw / var(--vw-sp)) * 10) 0 0;
  padding: 0;
  list-style: none;
}
.voice_card_tag {
  font-size: calc((100vw / var(--vw-sp)) * 12);
  letter-spacing: -0.05em;
  color: var(--color-rintosull-primary-blue1);
}
.voice_note {
  font-size: calc((100vw / var(--vw-sp)) * 11);
  line-height: 1.2;
  text-align: center;
  color: #FFF;
  font-weight: 500;
}
.voice_buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc((100vw / var(--vw-sp)) * 16);
  margin-top: calc((100vw / var(--vw-sp)) * 48);
}
@media (min-width: 801px) {
  .voice {
    padding-top: calc((100vw / var(--vw-pc)) * 370);
    padding-bottom: 77px;
  }
  .voice_inner_bg {
    max-width: 1200px;
    border-radius: calc((100vw / var(--vw-pc)) * 320);
    padding-top: calc((100vw / var(--vw-pc)) * 2);
    padding-bottom: calc((100vw / var(--vw-pc)) * 1);
  }
  .voice_inner_bg02 {
    border-radius: calc((100vw / var(--vw-pc)) * 320);
    padding-bottom: calc((100vw / var(--vw-pc)) * 77);
    margin: 0 calc((100vw / var(--vw-pc)) * 2);
    overflow: hidden;
  }
  .voice_inner_bg02:before {
    background: url(../img/bg-top-voice-pc.webp) 100% 0 / 100% no-repeat;
    top: calc((100vw / var(--vw-pc)) * 1);
    height: calc((100vw / var(--vw-pc)) * 170);
  }
  .voice_inner_bg02:after {
    background: url(../img/bg-bottom-voice-pc.webp) 100% 0 / 100% no-repeat;
    bottom: 0;
    height: calc((100vw / var(--vw-pc)) * 350);
  }
  .voice_inner {
    max-width: 800px;
    padding: 72px 0 0;
  }
  .voice_title {
    margin-bottom: 0;
  }
  .voice_title .section_title_sub {
    margin-top: 20px;
  }
  .voice_lead {
    margin-bottom: 64px;
    font-size: 18px;
  }
  .voice_stats {
    gap: 6px;
    margin-bottom: 40px;
  }
  .voice_stats_question {
    width: 380px;
  }
  .voice_stats_chart {
    flex-direction: row;
    align-items: center;
  }
  .voice_stats_chart_image {
    width: auto;
    max-width: 178px;
    margin: 0 10px 0 0;
  }
  .voice_stats_chart_text {
    margin-left: 24px;
    font-size: 30px;
  }
  .voice_stats_chart_text strong {
    font-size: 40px;
  }
  .voice_stats_chart_text strong small {
    font-size: 30px;
  }
  .voice_cards {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1%;
    margin-bottom: 0;
    margin-top: 40px;
  }
  .voice_card {
    flex-direction: column;
    align-items: center;
    max-width: 250px;
    padding: 20px;
    border-radius: 20px;
    width: 30%;
  }
  .voice_card_profile {
    width: 90px;
  }
  .voice_card_figure {
    margin-bottom: 7px;
  }
  .voice_card_figure img {
    width: 90px;
  }
  .voice_card_age {
    font-size: 12px;
    letter-spacing: normal;
  }
  .voice_card_body {
    padding-left: 0;
  }
  .voice_card_title {
    margin-bottom: 10px;
    font-size: 18px;
    white-space: normal;
    text-align: center;
    margin-top: 10px;
  }
  .voice_card_text {
    font-size: 14px;
  }
  .voice_card_tags {
    gap: 8px;
    margin-top: 8px;
  }
  .voice_card_tag {
    font-size: 12px;
  }
  .voice_note {
    margin-top: 20px;
    font-size: 12px;
  }
  .voice_buttons {
    gap: 25px;
    margin-top: 64px;
  }
}
@media (min-width: 1024px) {
  .voice_cards {
    gap: 3%;
  }
}
/* ==================================================================
 * thought / ブランドメッセージ
 * ================================================================== */
.thought {
  background: #C5736C;
  background: linear-gradient(0deg, rgba(197, 115, 108, 1) 0%, rgba(201, 125, 118, 1) 25%, rgba(223, 162, 157, 1) 100%);
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.thought .thought_bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.thought_inner {
  padding-top: calc((100vw / var(--vw-sp)) * 77);
}
.thought_title {
  color: #FFF;
  position: relative;
  padding-bottom: calc((100vw / var(--vw-sp)) * 55);
}
.thought_title:after {
  content: '';
  display: block;
  width: calc((100vw / var(--vw-sp)) * 0.5);
  height: calc((100vw / var(--vw-sp)) * 41);
  background: #FFF;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.thought_title .section_title_sub {
  color: #FFF;
}
.thought_body_title {
  color: #FFF;
  text-align: center;
  font-size: calc((100vw / var(--vw-sp)) * 30);
  font-family: var(--font-shippori);
  margin-bottom: calc((100vw / var(--vw-sp)) * 30);
  padding-top: calc((100vw / var(--vw-sp)) * 11);
}
.thought_body_text {
  text-align: center;
  color: #FFF;
  font-size: calc((100vw / var(--vw-sp)) * 18);
  font-feature-settings: "halt" 1;
  line-height: 1.7em;
}
.thought_body_text_top {
  padding-top: calc((100vw / var(--vw-sp)) * 32);
}
.thought_inner_box {
  position: relative;
}
.thought_inner_box .thought_features02 {
  width: calc((100vw / var(--vw-sp)) * 244);
  margin-left: auto;
  padding-top: calc((100vw / var(--vw-sp)) * 40);
}
.thought_inner_box .thought_features03 {
  width: calc((100vw / var(--vw-sp)) * 182);
  position: absolute;
  top: calc((100vw / var(--vw-sp)) * 250);
}
.thought_body_text_bottom {
  padding-top: calc((100vw / var(--vw-sp)) * 195);
  padding-bottom: calc((100vw / var(--vw-sp)) * 80);
}
@media (min-width: 801px) {
  .thought_inner {
    padding-top: 77px;
  }
  .thought_title {
    padding-bottom: 55px;
    margin-bottom: 0;
  }
  .thought_title:after {
    width: 0.5px;
    height: 41px;
  }
  .thought_body_title {
    padding-top: 20px;
    font-size: 28px;
    margin-bottom: 40px;
  }
  .thought_features01 {
    width: 402px;
    margin: 0 auto;
  }
  .thought_body_text {
    font-size: 18px;
  }
  .thought_body_text_top {
    padding-top: 30px;
  }
  .thought_inner_box {
    width: 525px;
    margin: 0 auto;
  }
  .thought_inner_box .thought_features02 {
    width: 271px;
    padding-top: 50px;
  }
  .thought_inner_box .thought_features03 {
    top: calc((100vw / var(--vw-pc)) * 170);
    width: 210px;
  }
  .thought_body_text_bottom {
    padding-top: 100px;
    line-height: 2.2;
    padding-bottom: 77px;
  }
}
@media (min-width: 1400px) {
  .thought_inner_box .thought_features03  {
    top: calc((100vw / var(--vw-pc)) * 130);
  }
}
/* ==================================================================
 * studio / 店舗情報
 * ================================================================== */
.studio {
  background: var(--color-five-gray-100);
}
.studio_inner {
  padding-top: calc((100vw / var(--vw-sp)) * 77);
}
.shop_wrap {
  padding-top: calc((100vw / var(--vw-sp)) * 45);
}
.shop_card {
  border-top: 0.5px solid #D7D7D7;
  padding: 0 calc((100vw / var(--vw-sp)) * 20) calc((100vw / var(--vw-sp)) * 20);
}
.shop_card:not(.open) .shop_content {
  max-height: 0px !important;
}
.shop_header {
  padding: calc((100vw / var(--vw-sp)) * 20) 0 0;
  cursor: pointer;
}
.shop_title_wrap {
  display: flex;
  justify-content: space-between;
}
.shop_name {
  font-size: calc((100vw / var(--vw-sp)) * 18);
  font-weight: 500;
  margin-bottom: calc((100vw / var(--vw-sp)) * 7);
}
.shop_title_wrap .toggle_btn {
  width: calc((100vw / var(--vw-sp)) * 29);
  height: calc((100vw / var(--vw-sp)) * 29);
  border: calc((100vw / var(--vw-sp)) * 0.8) solid #D7D7D7;
  border-radius: calc((100vw / var(--vw-sp)) * 20);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(180deg);
  transition: all 0.5s ease;
}
.shop_title_wrap .toggle_btn:after {
  content: '';
  display: block;
  width: 5px;
  height: 5px;
  border-top: 1px solid var(--color-five-gray-200);
  border-right: 1px solid var(--color-five-gray-200);
  -webkit-transform: rotate(315deg);
  transform: rotate(315deg);
  position: absolute;
  margin-top: calc((100vw / var(--vw-sp)) * 2);
}
.shop_card.open .shop_title_wrap .toggle_btn {
  background: var(--color-five-gray-200);
  border: none;
  transform: rotate(0deg);
}
.shop_card.open .shop_title_wrap .toggle_btn:after {
  border-top: 1px solid #FFF;
  border-right: 1px solid #FFF;
}
.shop_image {
  margin-top: calc((100vw / var(--vw-sp)) * 13);
}
.shop_details .detail_item {
  position: relative;
  padding-left: calc((100vw / var(--vw-sp)) * 60);
  border-bottom: 1px solid #D7D7D7;
  padding-bottom: calc((100vw / var(--vw-sp)) * 14);
}
.shop_details .detail_item:before {
  content: '';
  display: block;
  width: calc((100vw / var(--vw-sp)) * 44);
  height: calc((100vw / var(--vw-sp)) * 44);
  position: absolute;
  top: 0;
  left: 0;
}
.shop_details .detail_item_address:before {
  background: url("../img/shop_icon_address.webp") 100% 0 / 100% no-repeat;
}
.shop_details .detail_item_access:before {
  background: url("../img/shop_icon_access.webp") 100% 0 / 100% no-repeat;
}
.shop_details .detail_item_hours:before {
  background: url("../img/shop_icon_hours.webp") 100% 0 / 100% no-repeat;
}
.shop_details .detail_item:last-child {
  border-bottom: none;
}
.shop_details .detail_item dt {
  color: var(--color-five-primary-pink2);
  font-family: var(--font-rig-500);
  font-size: calc((100vw / var(--vw-sp)) * 12);
  letter-spacing: 0.05em;
  font-weight: bold;
}
.shop_details .detail_item dd {
  margin-left: 0;
}
.shop_details .detail_item dd p {
  font-weight: 500;
  font-size: calc((100vw / var(--vw-sp)) * 14);
}
.hours_table {
  width: 100%;
  border-collapse: collapse;
  font-size: calc((100vw / var(--vw-sp)) * 14);
  font-weight: 500;
}
.hours_table tr:not(:last-child) th,
.hours_table tr:not(:last-child) td {
  padding-bottom: calc((100vw / var(--vw-sp)) * 16);
}
.hours_day {
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
  margin-right: calc((100vw / var(--vw-sp)) * 35);
  display: block;
}
.hours_time {
  text-align: left;
  vertical-align: top;
}
.time_row {
  display: flex;
  align-items: flex-start;
}
.part_label {
  display: inline-block;
  flex-shrink: 0;
}
.time_text {
  flex-grow: 1;
  text-align: right;
}
.shop_content {
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
  max-height: 2000px;
}
@media (min-width: 801px) {
  .studio_inner {
    padding-top: 77px;
  }
  .studio_header {
    padding-bottom: 60px;
  }
  .shop_wrap {
    padding-top: 0;
    border-top: 0.5px solid #D7D7D7;
  }
  .shop_card {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 40px 40px;
  }
  .shop_card:first-of-type {
    border-top: none;
  }
  .shop_header {
    padding-top: 40px;
  }
  .shop_name {
    font-size: 18px;
    margin-bottom: 0;
  }
  .shop_tags_wrap {
    flex: 1;
    margin-left: 20px;
  }
  .shop_tags li {
    font-size: 10px;
    padding: 5px 10px 2px;
    margin-right: 5px;
  }
  .shop_title_wrap {
    align-items: center;
  }
  .shop_title_wrap .toggle_btn {
    width: 30px;
    height: 30px;
  }
  .shop_title_wrap .toggle_btn:after {
    margin-top: 2px;
  }
  p.shop_area {
    margin-top: 0;
    font-size: 14px;
  }
  .shop_content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 40px;
    align-items: flex-start;
  }
  .shop_image {
    margin-top: 60px;
    flex: 0 0 346px;
  }
  .shop_details {
    margin-top: 60px;
    flex: 1 1 0;
    min-width: 0;
  }
  .shop_details .detail_item:before {
    width: 45px;
    height: 45px;
  }
  .shop_details .detail_item {
    padding-left: 65px;
    margin-top: 0;
    padding-bottom: 10px;
  }
  .shop_details .detail_item dt {
    font-size: 12px;
  }
  .shop_details .detail_item dd p,
  .hours_table {
    font-size: 14px;
    line-height: 1.4;
  }
  .hours_table {
  width: 100%;
  border-collapse: collapse;
}
.hours_table tr {
  display: grid;
  grid-template-columns: 10em 1fr;
  gap: 0 16px;
}
.hours_day {
  text-align: left;
  white-space: nowrap;
}
.hours_time {
  white-space: nowrap;
  min-width: 0;
}
.time_row {
  display: flex;
  gap: 12px;
  white-space: nowrap;
}
.part_label {
  flex-shrink: 0;
}
  
  .shop_cta_wrap {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .shop_card {
    padding: 0 0 40px;
  }
}