@charset "UTF-8";

/* ===== FV ===== */

.fv_inner{
    width: 100%;
    height: 640px;
    display: flex;
    justify-content: space-around;
}

/* 左：縦書きエリア */
.fv_copy{
    width: 30%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fv_title{
    writing-mode: vertical-rl;
}

.fv_ribbon{
    font-size: 64px;
    line-height: 2;
    background-color: #FFC042;
    padding: 10px 0;
    position: relative;
}

.fv_ribbon::after{
    content: "";
    position: absolute;
    top: 10px;          /* 下にずらす */
    right: -10px;       /* 右にずらす */
    width: 100%;
    height: 100%;
    background-color: #37AB9D;  /* 緑 */
    z-index: -1;       /* 本体の後ろ */
}

.fv_sub-text{
    font-size: 36px;
}

/* 右：メイン画像 */
.fv_media{
    width: 70%;
    margin: 0;
}

.fv_img{
    width: 100%;
    object-fit: contain;
}



/* =========================
   Problems Section
   ========================= */
.problems{
    position: relative;
    background-color: #4DC0B2;
    padding-bottom: 80px;
}

/* 下のV字カット */
.problems::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height: 60px;
  background: #fff;
  clip-path: polygon(0 0, 50% 100%, 100% 0, 100% 100%, 0 100%);
}

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

.problems_head{
    display: flex;
    justify-content: space-around;
    align-items: center;
    color: #fff;
}

.problems_title{
    font-size: clamp(16px, 3vw, 40px);
    text-align: center;
}

.problems_title .highlight{
    color: #FFC042;
    font-size: clamp(20px, 5vw, 56px);
}

.problems_item{
    text-align: center;
}

/* 区切り文（白い帯＋▼） */
.problems_caption{
    display: inline-block;
    text-align: left;
    font-size: clamp(16px, 3vw, 24px);
    font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    sans-serif;
    font-weight: 700;
    color: #fff;
    margin-bottom: 50px;
    position: relative;
}

.problems_caption::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-30px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 30px solid rgba(255,255,255,.95);
}

.problems_caption-wrap{
    position: relative;
}

.problems_caption-wrap::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-27px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 30px solid #4DC0B2;
  z-index: 1;
}

.problems_caption::before{
  content:"";
  position:absolute;
  width: 100%;
  height: 3px;
  background-color: #fff;
  bottom: 0;
}

/* カード */
.problems_item{
    margin-bottom: 70px;
}

.problems_card{
    background-color: #fff;
    border-radius: 20px;
    display: flex;
    align-items: center;
}

.problems_illust{
    width: 37%;
}

.problems_content{
    width: 63%;
    padding: 0 30px 40px 30px;
    line-height: 1.8rem;
    text-align: left;
}

.problems_card-title{
    font-size: clamp(16px, 3vw, 24px);
}

.problems_text{
    font-size: clamp(16px, 2vw, 20px);
}

/* =========================
   Points Section
========================= */
.points{
    background: #fff;
    color: #4C6469;
    margin-bottom: 140px;
}

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

/* 見出し */
.points_head{
    text-align: center;
    margin: 70px 0 50px 0;
}

.points_title{
    font-size: clamp(19px, 5vw, 40px);
    font-weight: 900;
}

.points_title .highlight{
    font-size: clamp(40px, 10vw, 96px);
    color: #FFC042;
}

/* 一覧 */
.points_list{
    display: grid;
    gap: 90px;
}

/* １件 */
.point{
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 75px;
    min-height: 300px;
    align-items: stretch;
}

.point_item{
    display: grid;
    grid-template-columns: 130px 430px;
    gap: 55px;
}

.point_no{
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* POINTバッジ */
.point_tag{
    display: block;
    width: 100%;
    text-align: center;
    font-size: clamp(16px, 3vw, 24px);
    font-weight: 500;
    border-radius: 999px;
    background-color: #FFC042;
    line-height: 1;
}

/* 番号 */
.point_num{
    display: block;
    width: 100%;
    text-align: center;
    font-family: "Droid Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(60px, 10vw, 120px);
    line-height: 0.9;
}

.point_title{
    font-size: clamp(16px, 2.5vw, 30px);
    align-items: center;
    line-height: 1;
    height: 100%;
}

.point_heading{
    margin: 0;
    line-height: 1.25;
}

/* テキスト */
.point_text{
    font-size: 16px;
    line-height: 1.5;
}

/* 画像 */
.point_media{
    margin: 0;
}

.point_media img{
    display: block;
}

/* 反転 */
.point.is-even{
    grid-template-columns: 300px 1fr;
}

/* =========================
   Director Section
   ========================= */
.director{
    margin-bottom: 50px;
}

.director_inner{
    width: 95%;
    margin: 0 auto;
}

.director_title{
    text-align: center;
    font-size: clamp(19px, 5vw, 40px);
    font-weight: 900;
    margin-bottom: 150px;
}

.director_main-grid{
    display: grid;
    grid-template-columns: 1fr 1.6fr;
    gap: 40px;
    align-items: stretch;
}

/* 左：メイン写真 */
/* PC用 */
.director_photo{
    height: 100%;
    margin: 0;
}

.director_photo img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}

/* タブレット以下用 */
.director_content-tab .director_photo{
    display: none;
}

/* 右：テキスト */
.director_role{
    font-size: clamp(16px, 3vw, 24px);
    margin: 0 0 40px 0;
}

.director_name{
    font-size: clamp(24px, 5vw, 40px);
    font-weight: 900;
    margin: 0 0 40px 0;
}

.director_lead{
    font-size: clamp(16px, 3vw, 24px);
    font-weight: 700;
    color: #4DC0B2;
}

.director_body{
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 40px;
}

/* サムネ3枚 */
.director_thumbs{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 70px;
}

.director_thumb{
    margin: 0;
    aspect-ratio: 1/1;
}

.director_thumb img{
    width:100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* =========================
   review section
   ========================= */
.reviews {
  --reviews-bg: url("../../img/top/review_ba-img-01.jpg");
  background-image: var(--reviews-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-bottom: 60px;
  padding-top: 100px;
}

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

.reviews_head{
    text-align: center;
    margin-bottom: 300px;
}

.reviews_kicker{
    font-size: clamp(16px, 4vw, 40px);
    font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    sans-serif;
    font-weight: 700;
    color: #4DC0B2;
}

/* 一覧 */
.reviews_list{
  display: grid;
  gap: 70px;
}

/* 1件：カード幅は固定せず、最大幅で管理（中央配置） */
.review{
  position: relative;
  width: 100%;
  display: flex;
  margin-bottom: 50px;
}

/* 右・左の寄せ（背景色は付けない） */
.review_left  { justify-content: flex-start; }
.review_right { justify-content: flex-end; }

/* 吹き出し本体（白い箱はここ） */
.bubble{
  position: relative;
  width: 800px;

  background: rgba(255,255,255,.92);
  border-radius: 16px;
  padding: 25px 50px;

  box-shadow: 0 12px 30px rgba(0,0,0,.08);
}

/* アイコン（吹き出しに重ねる） */
.review_avatar{
  position: absolute;
  top: -75px;
  right: 50px;              /* ここで重なり具合調整 */
  width: 150px;
  height: 150px;
  border-radius: 999px;
  object-fit: cover;

  background: #fff;
  border: 4px solid rgba(255,255,255,.95);
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
  z-index: 2;
}

/* タイトル等はお好みで（例） */
.reborn_title{
  font-size: clamp(16px, 3vw, 24px);
  font-weight: 500;
  font-family:
    "Noto Serif JP",
    "Hiragino Mincho ProN",
    serif;
  color: #4DC0B2;
}

.review_text{
  font-size: 16px;
  line-height: 2.2;
}

.reviews .btn-outline{
    background-color: #fff;
    margin: 50px 0;
}

/* =========================
   qa section
   ========================= */
.qa_inner{
    max-width: 1000px;
    margin: 0 auto 150px auto;
}

.qa_head{
    text-align: center;
    margin-bottom: 50px;
}

.qa_title{
    font-size: clamp(24px, 4vw, 40px);
}

.qa_lead{
    font-size: clamp(16px, 3vw, 24px);
}

/* list */
.qa_list{
    display: grid;
    gap: 100px;
    margin-bottom: 100px;
}

/* row */
.qa_row{
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 20px;
    align-items: center;
}

/* badge */
.qa_badge{
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    border-radius: 999px;
    font-size: clamp(24px, 3vw, 32px);
    color: #fff;
    line-height: 1;        /* ← 念のため */
}

.qa_badge-q { background: #4DC0B2; }
.qa_badge-a { background: #FEC451; }

.qa_heading{
    font-size: clamp(16px, 3vw, 32px);
    transform: translateY(2px); /* 見た目の調性 */
}

.qa_heading-q { color: #4DC0B2; }
.qa_heading-a { color: #FEC451; }

.qa_body p{
    font-size: 16px;
}

.qa .cta-wrap{
    height: 300px;
    align-items: center;
    background-image: url("../../img/top/qa_ba-img.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/* =========================
   menu section
========================= */
.menu_inner{
    max-width: 1100px;
    margin: 0 auto 100px auto;
    padding: 0 3%;
}

.menu_head{
    text-align: center;
}

.menu_title{
    font-size: clamp(24px, 4vw, 40px);
    margin-bottom: 100px;
}

/* 初診 */
.menu_first{
    display: grid;
    grid-template-columns: 1fr 4fr 11fr;
    gap: 50px;
}

.menu_first-label{
    font-size: clamp(16px, 3vw, 24px);
    font-weight: 900;
}

.menu_first-price{
    font-size: clamp(16px, 3vw, 24px);
    font-weight: 900;
}

.menu_first-desc{
    font-size: 16px;
}


/* ブロック見出し */
.menu_subtitle{
    text-align: center;
    font-size: clamp(20px, 3vw, 32px);
}

/* 基本メニュー（画像左＋文右） */
.menu_basic{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: stretch;
}

.menu_basic-media{
    height: 100%;
    margin: 0;
}

.menu_basic-media img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 16px;
}

.menu_basic-body{
    height: 100%;
    margin-bottom: 150px;
}

.menu_name{
    font-size: clamp(16px, 3vw, 24px);
    margin: 0;
}

.menu_prices-row{
  display: flex;
  gap: 18px;
  align-items: baseline;
  font-size: clamp(16px, 3vw, 24px);
  font-weight: 900;
}

.menu_text{
    font-size: 16px;
    line-height: 1.5;
}

/* オプション 2列カード */
.menu_grid{
    width: min(1000px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 78px;
}

.menu_card-body{
    font-size: clamp(16px, 3vw, 20px);
    font-weight: 900;
}

.menu_card__media,
.menu_card-media{
  margin: 0;
}

.menu_card__media img,
.menu_card-media img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.menu_cardmedia img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.menu_card-text{
    font-size: 16px;
    font-weight: 500;
}

/* =========================
   access section
========================= */
.access_inner{
    max-width: 1000px;
    margin: 0 auto 150px auto;
    padding: 3%;
}

.access_head{
    text-align: center;
    margin-bottom: 150px;
}

.access_title{
    font-size: clamp(16px, 5vw, 40px);
}

/*　上段：左情報　/ 右：地図 */
.access_top{
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 40px;
    align-items: start;
}

/* 院情報*/
.access_brand{
    display: flex;
    align-items: center;
}

.access_logo{
    width: 50px;
    height: 50px;
    object-fit: cover;
    display: block;
}

.access_brandtext{
    height: 100%;
}

.access_brandsub{
    font-size: 10px;
    line-height: 1.5;
    margin: 0;
}

.access_brandname{
    font-size: 20px;
    line-height: 1;
    margin: 0;
}

.access_list{
    display: grid;
    gap: 15px;
    font-size: 16px;
}

.access_row{
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 0;
}

.access_row dt{
  font-weight: 700;
}

.access_row dd{
  margin: 0;
}

.access_tel{
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(54,95,91,.25);
}

.access_tel:hover{
  border-bottom-color: rgba(54,95,91,.55);
}

/* 右：地図 */
.access_map{
  width: 100%;
  border-radius: 12px;
  overflow: hidden;
}

.access_map iframe{
  width: 100%;
  height: 350px; /* カンプに近い高さ */
  border: 0;
  display: block;
}

/* 下段：写真3枚 */
.access_gallery{
  margin-top: 46px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
}

.access_photo{
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
}

.access_photo img{
  width: 100%;
  height: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}

/* =========================
   final cta
========================= */
.final_cta-inner{
    max-width: 1100px;
    margin: 0 auto;
}

/* 上段 */
.final_cta-top{
    width: 100%;
    background-image: url("../../img/top/final-cta-bg.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: left top;

    margin-bottom: 50px;
    padding: 40px 0;
}

.final_cta-top-inner{
    width: min(1100px, 92%);
    margin: 0 auto;
    
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    align-items: center;
    justify-content: space-around;
    color: #fff;
}

.final_cta-catch{
    font-size: clamp(20px, 2vw, 32px);
    font-weight: 700;
}

.final_cta-lead{
    font-size: 16px;
}

.final_cta-image{
    margin: 0;
}

.final_cta-image img{
    width: 100%;
    display: block;
    border-radius: 20px;
    margin: 0;
}

/* 中段 */
.final_cta-middle{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    justify-content: space-around;
    padding: 3%;
}

.final_cta-line{
    position: relative;
}

.final_cta-linebtn.cta-btn{
    width: auto;
    font-size: clamp(20px, 3vw, 36px);
    font-weight: 700;
    color: #fff;
    background-color: #4DC0B2;

    z-index: 5;
}

.final_cta-note,
.final_cta-qrtext{
    width: 250px;
    height: 50px;
    font-size: 16px;
    font-weight: 900;
    color: #4DC0B2;
    font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    sans-serif;
    text-align: center;
    line-height: 50px;
    border-radius: 30px;
    border: 3px solid #4DC0B2;
    background-color: #fff;
    margin: 0 auto;
}

.final_cta-note{
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);

    z-index: 200;
}

.final_cta-qr{
    text-align: center;
}

.final_cta-qr img{
  width: 180px;
  height: auto;
}

/* 下段 */
.final_cta-tel{
    text-align: center;
}

.final_cta-telhead{
    font-size: clamp(20px, 2vw, 24px);
    font-weight: 700;
    font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    sans-serif;
}

.final_cta-tel{
    width: 450px;
    margin: 0 auto;
}

.final_cta-tel .cta-btn{
    width: auto;
    color: #fff;
}

.final_cta-telbtn{
    font-size: clamp(32px, 8vw, 48px);
    font-weight: 700;
    line-height: 1.2;
}

.final_cta-telbtn span{
    font-size: 16px;
    line-height: 1.2;
}

/* 中段 */
.final_cta-ekiten{
    text-align: center;
}

.final_cta-ekitenhead{
    font-size: clamp(20px, 2vw, 24px);
    font-weight: 700;
    font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    sans-serif;
}

.final_cta-ekiten{
    width: 450px;
    margin: 0 auto;
}

.final_cta-ekiten .cta-btn{
    width: auto;
    color: #fff;
    background-color: #DD0000;
}

.final_cta-ekitenbtn{
    font-size: clamp(32px, 5vw, 48px);
    font-weight: 700;
    line-height: 1.2;
}

.final_cta-ekitenbtn span{
    font-size: 16px;
    line-height: 1.2;
}


/* ========== Responsive ========== */
/* Tablet */
@media (max-width: 1024px) {
    /* ===== FV ===== */
    .fv_inner{
        height: 400px;
        margin-bottom: 20px;
    }

    /* 左：縦書きエリア */
    .fv_ribbon{
        font-size: 32px;
    }

    .fv_sub-text{
        font-size: 24px;
    }

    /* 右：メイン画像 */
    .fv_media{
        width: 70%;
        margin: 0;
    }

    .fv_img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 20px 0 0 20px;
    }

    /* =========================
   Problems Section
   ========================= */
    .problems_inner{
        padding: 0 3%;
    }

    .problems_head-icon{
        width: 15%;
        height: 15%;
    }
   
    /* 下のV字カット */
    .problems_caption::after{
    left:50%;
    bottom:-20px;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 20px solid rgba(255,255,255,.95);
    }

    /* 区切り文（白い帯＋▼） */
    .problems_caption::after{
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
        border-top: 20px solid rgba(255,255,255,.95);
    }

    .problems_caption-wrap::after{
        bottom:-19px;
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
        border-top: 20px solid #4DC0B2;
        z-index: 1;
    }

    /* カード */
    .problems_item{
        margin-bottom: 50px;
    }

    .problems_card-title{
    line-height: 1.4rem;
    }

    .problems_text{
        line-height: 1.4em;
    }

    /* =========================
    Points Section
    ========================= */
    .points{
        margin-bottom: 100px;
        padding: 5%;
    }

    /* １件 */
    .point{
        display: grid;
        grid-template-columns: 1fr 250px;
        gap: 20px;
        min-height: 300px;
        align-items: stretch;
    }

    /* 反転 */
    .point.is-even{
        grid-template-columns: 250px 1fr;
    }

    .point_item{
        display: grid;
        grid-template-columns: 1.3fr 4.3fr;
        gap: 15px;
    }

    /* =========================
   Director Section
    ========================= */
    .director{
        margin-bottom: 50px;
    }

    .director_title{
        margin: 100px auto 50px auto;
    }

    .director_main-grid{
        grid-template-columns: 1fr;
    }

    /* 左：メイン写真 */
    .director_photo{
        display: none;
    }

    /* タブレット以下用 */
    .director_content-tab .director_photo{
        display: block;
    }

    .director_photo img{
        width: 100%;
        height: clamp(150px, 28vw, 260px);
        object-fit: cover;
        object-position: top;
        border-radius: 20px;
    }

    /* 右：テキスト */
    .director_content-tab{
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 30px;
        margin: 0;
    }

    /* サムネ3枚 */
    .director_thumbs{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 15px;
    }

    /* =========================
    review section
    ========================= */
    .reviews {
        --reviews-bg: url("../../img/top/review_ba-img-02.png");
        background-image: var(--reviews-bg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        margin-bottom: 60px;
        padding-top: 50px;
    }

    .reviews_inner{
        width: 95%;
    }

    .reviews_kicker{
        color: #fff;
    }

    .reviews_head{
        text-align: center;
        margin-bottom: 100px;
    }

    /* 一覧 */
    /* 1件：カード幅は固定せず、最大幅で管理（中央配置） */
    .review{
        position: relative;
        width: 100%;
        display: flex;
        margin-bottom: 50px;
    }

    /* 右・左の寄せ（背景色は付けない） */
    .review_left  { justify-content: center; }
    .review_right { justify-content: center; }

    /* 吹き出し本体（白い箱はここ） */
    .bubble{
        width: 80%;
    }

    /* アイコン（吹き出しに重ねる） */
    .review_avatar{
        position: absolute;
        top: -75px;
        right: 50px;              /* ここで重なり具合調整 */
        width: 130px;
        height: 130px;
        border-radius: 999px;
        object-fit: cover;

        background: #fff;
        border: 4px solid rgba(255,255,255,.95);
        box-shadow: 0 10px 20px rgba(0,0,0,.10);
        z-index: 2;
    }

    /* =========================
    qa section
    ========================= */
    .qa_inner{
        width: 90%;
        margin: 0 auto 50px auto;
    }

    /* list */
    .qa_list{
        display: grid;
        gap: 50px;
        margin-bottom: 50px;
    }

    /* row */
    .qa_row{
        display: grid;
        grid-template-columns: 50px 1fr;
        gap: 20px;
        align-items: center;
    }

    /* badge */
    .qa_badge{
        width: 50px;
        height: 50px;
    }

    .qa_badge-q { background: #4DC0B2; }
    .qa_badge-a { background: #FEC451; }

    .qa_heading{
        font-size: clamp(16px, 3vw, 32px);
        transform: translateY(2px); /* 見た目の調性 */
    }

    .qa_heading-q { color: #4DC0B2; }
    .qa_heading-a { color: #FEC451; }

    .qa_body p{
        font-size: 16px;
    }

    .qa .cta-wrap{
        height: 300px;
        align-items: center;
        background-image: url("../../img/top/qa_ba-img.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    /* =========================
    menu section
    ========================= */
    .menu_inner{
        width: 95%;
        margin: 0 auto 100px auto;
    }

    .menu_title{
        margin-bottom: 50px;
    }

    /* 初診 */
    .menu_first{
        display: grid;
        grid-template-columns: 1fr;
        gap: 0px;
    }

    .menu_basic-body{
        height: 100%;
        margin-bottom: 50px;
    }

    /* =========================
    final cta
    ========================= */
    /* 上段 */
    .final_cta-top{
        width: 100%;
        background-image: url("../../img/top/final-cta-bg.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        background-position: left top;
        object-fit: cover;

        margin-bottom: 50px;
        padding: 40px 0;
    }

    .final_cta-note,
    .final_cta-qrtext{
        width: 230px;
        height: 30px;
        line-height: 30px;
    }

    .final_cta-note{
        position: absolute;
        top: -15px;
        left: 50%;
        transform: translateX(-50%);

        z-index: 200;
    }

}


/* Mobile */
@media (max-width: 768px) {
    /* =========================
    review section
    ========================= */
    /* アイコン（吹き出しに重ねる） */
    .review_avatar{
        top: -50px;
        right: 50px;              /* ここで重なり具合調整 */
        width: 100px;
        height: 100px;
    }

    .review{
        margin-bottom: 20px;
    }

    /* ブロック見出し */
    /* 基本メニュー（画像左＋文右） */
    .menu_basic{
        display: grid;
        grid-template-columns: 1fr;
        gap: 30px;
        align-items: stretch;
    }

    /* オプション 2列カード */
    .menu_grid{
        gap: 20px;
    }

}

/* さらに狭い */
@media (max-width: 610px){
    /* ===== FV ===== */

    .fv_inner{
        height: 300px;
        display: block;
        position: relative;
    }

    .fv_title{
        color: #fff;
    }

    /* 左：縦書きエリア */
    .fv_copy{
        width: 20%;
        position: relative;
        top: 20px;
        left: 30px;
        z-index: 10;
    }

    .fv_ribbon{
        font-size: 20px;
    }

    .fv_sub-text{
        font-size: 20px;
    }

    /* 右：メイン画像 */
    .fv_media{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        margin: 0;
    }

    .fv_img{
        width: 100%;
        object-fit: cover;
    }

    /* =========================
    problems Section
    ========================= */
    .problems_head-icon{
        display: none;
    }

    .problems_card{
        display: block;
        padding: 20px;
    }

    .problems_illust{
        width: 60%;
        margin: 0 auto;
    }

    .problems_content{
        width: 100%;
        margin: 0 auto;
        padding: 0;
    }

    .problems_item{
        margin-bottom: 20px;
    }

    .problems_caption{
        margin-bottom: 10px;
    }
    
    /* キャプション下の線 */
    .problems_caption::before{
        display: none;
    }

    .problems_caption::after{
        display: none;
    }

    .problems_caption-wrap::after{
        display: none;
    }

    /* =========================
    Points Section
    ========================= */
    .point{
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .points_head{
        margin: 0px auto 30px auto; 
    }

    .points_list{
        gap: 30px;
    }

    /* 反転 */
    .point.is-even{
        grid-template-columns: 1fr;
    }

    .point.is-even .point_media{
        order: 2; /* グリッドの並び変更 */
    }

    .point.is-even .point_body{
        order: 1; /* グリッドの並び変更 */
    }

    /* 画像 */
    .point_media{
        width: 100%;
        height: 300px;
        margin: 0;
    }

    .point_media img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 20px;
    }

    /* =========================
    review section
    ========================= */
    .reviews_head{
        margin-bottom: 40px;
    }

    .bubble{
        width: 100%;
        padding: 5%;
    }

    .reborn_title{
        font-weight: 700;
    }

    .reviews_list{
        gap: 20px;
    }

    /* アイコン（吹き出しに重ねる） */
    .review_avatar{
        display: none;
    }

    .review{
        margin-bottom: 10px;
    }

    /* =========================
    menu section
    ========================= */
    /* オプション 2列カード */
    .menu_name,
    .menu_card-name{
        font-size: 20px;
    }

    .menu_grid{
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .menu_card{
        display: grid;
        grid-template-columns: 1fr;
    }

    .menu_card-media {
        order: 2; /* グリッドの並び変更 */
    }

    .menu_card-body{
        order: 1; /* グリッドの並び変更 */
    }

    /* =========================
    access section
    ========================= */
    .access_inner{
        width: 90%;
        margin: 0 auto 50px auto;
    }

    .access_head{
        margin-bottom: 50px;
    }

    /*　上段：左情報　/ 右：地図 */
    .access_top{
        grid-template-columns: 1fr;
        gap: 30px;
    }

    /* =========================
    final cta
    ========================= */
    .final_cta-top-inner{
        width: min(1100px, 92%);
        margin: 0 auto;
        
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        align-items: center;
        justify-content: space-around;
        color: #fff;
    }

    .final_cta-image{
        display: none;
    }

    /* 上段 */
    .final_cta-middle{
        display: grid;
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .final_cta-note,
    .final_cta-qrtext{
        width: 230px;
        height: 30px;
        line-height: 30px;
    }

    .final_cta-note{
        top: -15px;
    }

    .final_cta-qr img{
    width: 130px;
    }

    /* 下段 */
    .final_cta-tel{
        width: 80%;
        margin: 0 auto;
    }

    /* 中段 */
    .final_cta-ekiten{
        text-align: center;
    }

    .final_cta-ekitenhead{
        font-size: clamp(20px, 2vw, 24px);
        font-weight: 700;
        font-family:
        "Noto Sans JP",
        "Hiragino Kaku Gothic ProN",
        "Yu Gothic",
        sans-serif;
    }

    .final_cta-ekiten{
        width: 80%;
        margin: 0 auto;
    }

    .final_cta-ekiten .cta-btn{
        width: auto;
        color: #fff;
        background-color: #DD0000;
    }

    .final_cta-ekitenbtn{
        font-size: clamp(24px, 5vw, 48px);
        font-weight: 700;
        line-height: 1.2;
    }

    .final_cta-ekitenbtn span{
        font-size: 16px;
        line-height: 1.2;
    }

}
