@charset "UTF-8";
/* CSS Document */


html { margin: 0; color: #482312;}
body { margin: 0;}

html,
body{ overflow-x: hidden;}

.pc_view{ display: inline; }
.sp_view{ display: none; }
@media (max-width: 767px){
    .pc_view{ display: none; }
    .sp_view{ display: inline; }
}

#treatmentLP {
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo,
                 -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  }

  #treatmentLP h1, #treatmentLP h2, #treatmentLP h3 {
    line-height: 1.25;
    letter-spacing: .02em;
    font-weight: 700;
    font-size: 105%;
  }

  #treatmentLP h1 .num,
  #treatmentLP h2 .num,
  #treatmentLP h3 .num {
    font-family: "Urbanist", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-weight: 700;
    font-variant-numeric: tabular-nums; /* 桁そろえ */
    letter-spacing: .01em;
  }


/* =========================
   #key
========================= */

.key_topcopy {
    background: #7ab900;
    font-size: 165%;
    color: #fff;
    padding: 11px;
    margin: 0;
    text-align: center;
    font-weight: bold;
}

.key_topcopy span {
    color: #ffe346;
    font-size: 120%;
}


#key_lp01{
    position: relative;
    background: #EAF7F5 url("img/bg_key.jpg") no-repeat center right / cover;
}

#key_lp01 #key_wrap{
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 80px 7vw 60px;
    max-width: 1200px;
    margin: 0 auto;
}

/* 画像はフローに戻す（絶対配置を解除） */
#key_lp01 #key_copyimg{
    width: 95%;
    max-width: 900px;
    height: auto;
    margin: 0 auto;
    display: block;
}

/* レスポンシブ */
@media (min-width: 1024px){
    #key_lp01 #key_wrap{ padding: 40px 7vw 0; }
}
@media (max-width: 767px){
    #key_lp01{ background-position: 70% center; }
    #key_lp01::before{
        background: linear-gradient(90deg,
            rgba(255,255,255,.97) 0%,
            rgba(255,255,255,.9) 55%,
            rgba(255,255,255,0) 100%);
    }
    #key_lp01 #key_wrap{ padding: 20px 0px 17px 6px }
    #key_lp01 #key_copyimg{ width: 100%; max-width: none; }
}

/* 視覚的に隠す（スクリーンリーダー向けに残す） */
.vh{
    position: absolute !important;
    clip: rect(1px,1px,1px,1px);
    padding: 0; border: 0;
    height: 1px; width: 1px;
    overflow: hidden; white-space: nowrap;
}


/* =========================
   CTA
========================= */
.cta{
    background:url("img/bg_cta.jpg") no-repeat center / cover;
    color: #fff;
}
.cta .cta_wrap{
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
    padding: 28px 7vw;
}

.cta .cta_head{
    position: relative;
    display: inline-block;
    margin: 0 auto 18px;
    padding: 8px 28px;
}

.cta .cta_head h2 { font-size: 135% !important;}

.cta .cta_head::before,
.cta .cta_head::after{
    position: absolute;
    top: 70%;
    transform: translateY(-50%);
    font-weight: 700;
    color: #fff;
    opacity: .95;
    font-size: 20px;
    line-height: 1;
    content: "＼";
}
.cta .cta_head::before{ left: -16px; }
.cta .cta_head::after{ right: -16px; content: "／"; }

.cta .cta_head h2{
    font-weight: 700;
    letter-spacing: .03em;
    margin: 0 0 6px 0;
}

.cta .cta_head h2 span { color: #ffe346 }
.cta .cta_head p{
    opacity: .9;
    margin: 0;
}

/* ボタン群 */
.cta .cta_btns{
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}
.cta .btn{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border-radius: 9999px;
    padding: 14px 22px;
    font-weight: 700;
    text-decoration: none;
    transition: transform .05s ease, box-shadow .2s ease;
}
.cta .btn:focus-visible{
    outline: 3px solid #fff;
    outline-offset: 2px;
}
.cta .btn:hover{
    transform: translateY(-1px);
    box-shadow: 0 3px 0 rgba(0,0,0,.12);
}
.cta .btn:active{
    transform: translateY(0);
    box-shadow: none;
}

/* メールボタン（白） */
.cta .btn_mail{
    background: #fff;
    color: #482312;
    border: 2px solid rgba(255,255,255,0);
}

/* 電話ボタン（黄色） */
.cta .btn_tel{
    background: #F4D548;
    color: #482312;
}

/* 背景アイコン（画像） */
.cta .btn .ico{
    width: 22px;
    height: 22px;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    flex: 0 0 22px;
}
.cta .btn_mail .ico{ background-image: url("img/icon_mail.png"); }
.cta .btn_tel .ico{ background-image: url("img/icon_tel.png"); }

.cta .btn_tel b{
    font-family: "Urbanist", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-weight: 800;
    letter-spacing: .02em;
    font-variant-numeric: tabular-nums;
    margin-left: 6px;
    font-size: 140%;
}
.cta .btn_tel em{
    font-style: normal;
    opacity: .95;
}

/* レスポンシブ */
@media (max-width: 767px){
    .cta .cta_head{ padding: 6px 0px; }
    .cta .cta_head::before{ left: -14px; font-size: 18px; }
    .cta .cta_head::after{ right: -14px; font-size: 18px; }
    .cta .cta_head h2{ font-size: 20px; }
    .cta .cta_head p{ font-size: 17px; }
    .cta .btn{ width: 100%; justify-content: center; padding: 14px 16px; }
    .cta .btn_tel b {font-size: 163%;}

}

/* =========================
   #hissu
========================= */
#hissu {
    background: #85be00;
    text-align: center;
}

#hissu p {
    font-size: 140%;
    color: #fff;
    padding: 30px;
    text-align: center;
    font-weight: bold;
    margin: 5px 0;
    text-shadow: 1px 1px 2px #7aaa0b;
    line-height: 1.3;
    letter-spacing: 0.05em;
}

#hissu p span {
    color: #ffe346;
    font-size: 110%;
}


/* =========================
   #nayami
========================= */
#checklist {
    background-color: #fff;
    background-image: url(img/bg_selfchecklist.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 60%;
}

#checklist_wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px 10px;
    text-align: center;
}

#checklist_listtext {
    max-width: fit-content;
    margin: 30px auto;
    text-align: left;
    background: #f7f4ea;
    padding: 40px;
    border-radius: 20px;
}

#checklist_listtext ul {
    padding-left: 0;
    margin: 0;
}
#checklist_listtext li {
    margin-bottom: 15px;
    list-style: none;
}

#checklist_listtext li span { color: #76a800;}

#checklist_listtext li:last-child { margin-bottom: 0;}


/* =========================
   #checklist_bottom
========================= */



#checklist_bottom p {
    width: 1000px;
    display: block;
    margin: 0 auto;
}

#checklist_bottom img { margin: 25vh 0 20vh 20vh;}

/* レスポンシブ */
@media (min-width: 1513px){
#checklist_bottom {
    background: url(img/bg_pdcatop.jpg) no-repeat 50% 100%;
    min-height: 600px;
    background-size: 130%;
}
}
    
@media (max-width: 1512px) and (min-width: 1024px){
#checklist_bottom {
    background: url(img/bg_pdcatop.jpg) no-repeat 50% 100%;
    min-height: 500px;
    background-size: 140%;
}
}

/* レスポンシブ */
@media (max-width: 767px){
    #checklist_wrap {padding: 60px 10px 10px;}
    #checklist_titleimg { width: 90%;}
    #checklist_listtext li {
    margin-bottom: 15px;
    list-style: none;
    text-indent: -1.5em;
    margin-left: 1em;
}
    
    #checklist_bottom {
        background: url(img/bg_pdcatop_sp.jpg) no-repeat 50% 100%;
        min-height: 335px;
        background-size: 100%;
    }
    #checklist_bottom p {width: 90% !important;}
    #checklist_bottom img {
        margin: -1vh 0 2vh 2.1vh !important;
        width: 53%;
        filter: drop-shadow(1px 2px 4px #fff);
    }
    
}


/* =========================
   #shikumika
========================= */
#shikumika {
    background:url(img/bg_pdcabottom.jpg) no-repeat 50% -6px;
    background-size: 150%;
    padding-bottom: 50px;
}

#shikumika_titleimg{
    display: block;
    width: 760px;
    max-width: 96%;
    height: auto;
    margin: 0 auto 60px;
}

.pdca_read {
    width: 500px;
    margin: 0 auto 50px;
    text-align: left;
    line-height: 1.8;
    letter-spacing: 0.03em;
}

/* accent */
.acc_yg { color: #76a800; }
.acc_bgw { background: #fff; padding: 0px 3px; display: inline;}


#step6all {
    max-width: 1000px;
    margin: 0 auto;
}

#step6all article {
    background: #fff;
    border-radius: 20px;
    padding: 30px 50px;
    margin-bottom: 50px;
    position: relative;
}

#step6all div { display: flex;}
#step6all ul { width: 100%;}
#step6all ul li {list-style: none; padding-left: 30px; margin: 7px 0;}
#step6all h3 {
    font-size: 180%;
    margin: 15px 0 0;
    text-align: center;
}
#step6all h3 .num {
    font-family: "Urbanist", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-weight: normal;
    font-variant-numeric: tabular-nums;
    letter-spacing: .01em;
    font-size: 160%;
    margin-right: 10px;}

#step6all p { border-radius: 15px;}
#step6all p span { color: #c87b00; }

.bluebox h3 .num { color: #aed4ef;}
.bluebox h3 .acc_txt { color: #288cdb;}
.bluebox ul li { background: url(img/icon_checkblue.png) no-repeat;}
.bluebox p { background: #dfedf8; padding: 30px}


.greenbox h3 .num { color: #b0d5ac;}
.greenbox h3 .acc_txt { color: #8cc10f;}
.greenbox ul li { background: url(img/icon_checkgreen.png) no-repeat;}
.greenbox p { background: #ecf8ee; padding: 30px}


#step6all article:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -32px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #482312;
}


/* レスポンシブ */
@media (max-width: 1023px){
    .shikumi_box{ width: 31%; padding: 20px 14px; }
}
@media (max-width: 767px){
    .key_topcopy { font-size: 110%;}
    #shikumika {
    background:url(img/bg_pdcabottom.jpg) no-repeat 50% -6px;
    background-size: 250% 102%;
    padding-bottom: 20px;}
    
    #shikumika_titleimg {
        display: block;
        width: 100%;
        max-width: 96%;
        height: auto;
        margin: 0 auto 29px;
    }
    #shikumika div {padding: 50px 20px 30px;}
    #step6all { padding-top: 0 !important;}
    #shikumika_wrap{ padding: 48px 16px 56px; }
    #step6all article {padding: 26px 21px; margin-bottom: 50px;}
    #step6all article:last-child { margin-bottom: 0px;}
    .pdca_read {width: 90%;margin: 0 auto 0px}
    #step6all div { flex-direction: column;padding: 20px 0px 0px;}
    #step6all h3 {font-size: 165%; margin-top: 0;}
    #step6all h3 .num {display: block;}
    #step6all ul {
    width: 100%;
    padding-left: 15px;
    margin-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;}
    #step6all p {border-radius: 15px; line-height: 1.7; margin-bottom: 0;}
}



/* =========================
   #program
========================= */
#program{
    background-color: #fff;
    background-image: url("img/bg_yellowdot.jpg");
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 50% auto;
    color: #0F3740;
}
#program_wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px 90px;
    text-align: center;
}
#program_titleimg{
    display: block;
    width: 700px;
    max-width: 96%;
    height: auto;
    margin: 0 auto 12px;
}
#program_intro{
    margin: 0 0 22px 0;
    font-size: 14px;
    line-height: 1.9;
    color: #586569;
}
#program_intro b{
    color: #0F3740;
}

#program_pill {
    display: block;
    background: #7DBA2D;
    color: #fff;
    font-weight: 700;
    padding: 10px 18px;
    border-radius: 10px;
    letter-spacing: .03em;
    margin: 50px auto 24px;
}

/* 中央のフローと説明ボックス */
#program_flowwrap {
    position: relative;
    max-width: 980px;
    margin: 0 auto;
    min-height: 700px;
}
#program_flow{
    display: block;
    width: 520px;
    max-width: 55%;
    height: auto;
    margin: 0 auto;
}

/* ボックス共通 */
.prog_card {
    position: absolute;
    background: #E3E6E8;
    border: 13px solid #E3E6E8;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .06);
    padding: 0;
    width: 320px;
    max-width: 34%;
    text-align: left;
}
.prog_label {
    padding: 0px 10px 6px;
    border-radius: 6px;
    font-weight: 700;
    margin: 0 0 6px 0;
    text-align: center;
    font-size: 120%;
}
.prog_text {
    margin: 0;
    line-height: 1.8;
    color: #333;
    background: #fff;
    padding: 20px;
}

/* 位置（PC） */
.is-1{ top: 20px; left: 0%; }
.is-2 {top: 135px; right: 0; width: 303px;}
.is-3{ bottom: 0; left: 12%; }

/* ラベル） */
.is-1 .prog_label b{ color: #C95A45; }
.is-2 .prog_label b{ color: #E0A81F; }
.is-3 .prog_label b{ color: #3FA463; }


/* PC/Tab→SP切替 */
@media (max-width: 1023px){
    #program_flow{ max-width: 62%; }
    .prog_card{ max-width: 38%; }
    .is-1{ top: 28px; left: 4%; }
    .is-2{ top: 184px; right: 0; }
    .is-3{ bottom: 0; left: 10%; }
}

@media (max-width: 767px){
    #program {background-size: 98% auto;}
    #program_wrap{ padding: 48px 16px 64px; }
    #program_titleimg{ width: 92%; margin-bottom: 50px; }
    #program_intro{ font-size: 13px; }
    #program_pill{ display: block; margin: 8px 0 16px; }

    #program_flowwrap{ min-height: 0; }
    #program_flow{display: none;}

    /* ボックスは縦並びへ */
    .prog_card{
        position: static;
        width: auto;
        max-width: none;
        margin: 12px auto 0;
    }
}

/* 既出ユーティリティ（SPだけ改行 / PCだけ改行） */
br.pc_view{ display: inline; }
br.sp_view{ display: none; }
@media (max-width: 767px){
    br.pc_view{ display: none; }
    br.sp_view{ display: inline; }
}

/* =========================
   #kouka
========================= */
#kouka{
    background: #fff url("img/bg_kouka.jpg") no-repeat center top / 100%;
}
#kouka_wrap{
    max-width: 1000px;
    margin: 0 auto;
    padding: 60px 20px 20px;
}
#kouka_titleimg{
    display: block;
    width: 680px;
    max-width: 96%;
    height: auto;
    margin: 0 auto 28px;
}

/* リスト（3項目） */
#kouka_list{
    list-style: none;
    margin: 80px 0 0;
    padding: 0;
    display: grid;
    gap: 36px;
}
#kouka_list > li{
    display: flex;
    align-items: center;
    gap: 24px;
    justify-content: space-between;
}
#kouka_list > li figure{
    flex: 0 0 420px;     /* 画像幅の目安（調整可） */
    margin: 0;
}
#kouka_list > li figure img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}
#kouka_list > li > div{
    width: 50%;
}
#kouka_list h3{
    margin: 0 0 8px 0;
    font-weight: 700;
    line-height: 1.4;
    font-size: 140%;
}
#kouka_list p{
    margin: 0;
    line-height: 1.9;
    color: #333;
}
#kouka_list h3 span{
    color: #7aad00;      /* 見本のグリーンに近いトーン */
    font-weight: 700;
}

/* アクセシビリティ：視覚的に隠す（読み上げ用） */
.vh{
    position: absolute !important;
    clip: rect(1px,1px,1px,1px);
    padding: 0; border: 0;
    height: 1px; width: 1px;
    overflow: hidden; white-space: nowrap;
}

/* レスポンシブ */
@media (max-width: 1023px){
    #kouka_list > li figure{ flex-basis: 360px; }
}
@media (max-width: 767px){
    #kouka_wrap{ padding: 48px 16px 56px; }
    #kouka_titleimg{ width: 98%; margin-bottom: 18px; }
    #kouka_list{ gap: 22px; margin: 40px 0 0; }
    #kouka_list > li{ flex-direction: column; align-items: flex-start; gap: 14px; }
    #kouka_list > li figure{ flex-basis: auto; width: 100%; }
    #kouka_list h3{ margin-bottom: 6px;text-align: center; }
    #kouka_list > li > div {width: 100%;}
}



/* =========================
   #process
========================= */
#process{
    background-color: #7aad00;
}
#process_wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px 80px;
    text-align: center;
}

#process_titleimg {
    display: block;
    max-width: 90%;
    height: auto;
    margin: 0 auto 45px;
}

#process_list{
    list-style: none;
    margin: 0;
    padding: 0;
}

#process .flow_card {
    position: relative;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, .10);
    padding: 30px 22px;
    max-width: 920px;
    margin: 0 auto 46px;
    text-align: left;
}

#process .flow_card:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -27px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #ffffff;
}

.flow_row{
    display: flex;
    align-items: center;
    gap: 16px;
}
.flow_icon{
    flex: 0 0 20%;
    max-width: 20%;
    height: 80px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
}
.flow_body{
    flex: 1 1 80%;
    max-width: 80%;
}

#process .flow_body > h3{
    margin: 0 0 6px 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
}
#process .flow_body > p{
    margin: 0;
    line-height: 1.8;
}

.step{
    color: #7aad00;
    font-weight: 700;
    margin-right: .4em;
    font-family: "Urbanist", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}

/* アイコン画像の割当（背景画像） */
.ico_flow01{ background-image: url("img/icon_flow01.png"); }
.ico_flow02{ background-image: url("img/icon_flow02.png"); }
.ico_flow03{ background-image: url("img/icon_flow03.png"); }
.ico_flow04{ background-image: url("img/icon_flow04.png"); }

/* レスポンシブ */
@media (max-width: 767px){
    #process_wrap{ padding: 48px 16px 10px; }
    #process_titleimg{ width: 72%; margin-bottom: 18px; }

    .flow_row{ align-items: flex-start; gap: 12px;flex-wrap: wrap; }
    .flow_icon{
        flex: 0 0 24%;
        max-width: 24%;
        height: 56px;
        margin: 0 auto;
    }
    .flow_body{ max-width: 100%;}

    #process .flow_body > h3{ font-size: 130%; text-align: center; margin-bottom: 20px;}
    #process .flow_body > p{ font-size: 105%; line-height: 1.75; }
}

/* =========================
   #progfee
========================= */
#progfee{background:url("img/bg_price.jpg") no-repeat left top / 50%;}

#progfee_wrap{
    max-width: 700px;
    margin: 0 auto;
    padding: 60px 20px 90px;
    text-align: center;
}

#progfee_badge {
    display: inline-block;
    position: relative;
    margin: 0 auto 12px;
    padding: 10px 34px;
    background: #FBE7A8;
    border: 2px solid #E5C872;
    border-radius: 10px;
    font-weight: 700;
    line-height: 1.4;
    font-size: 130%;
}
#progfee_badge::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    width: 0; height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #E5C872;
}
#progfee_badge::before{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -8px;
    transform: translateX(-50%);
    width: 0; height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #FBE7A8;
}

/* 見出し画像 */
#progfee_titleimg {
    display: block;
    width: 330px;
    max-width: 92%;
    height: auto;
    margin: 30px auto 40px;
}

/* ティールの帯 */
#progfee_band1,
#progfee_band2{
    background: #5FA3A0;
    color: #fff;
    font-weight: 700;
    padding: 10px 18px;
    border-radius: 10px;
    letter-spacing: .03em;
    margin: 10px auto 14px;
}

/* リード文（本文サイズのまま） */
#progfee_lead{
    margin: 0 auto 20px;
    max-width: 640px;
    line-height: 1.8;
}

/* 料金オプション（2カラム） */
#progfee_options {
    list-style: none;
    margin: 0 0 70px 0;
    padding: 0;
    gap: 22px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
#progfee_options > li {
    width: 100%;
    background: #fff;
    border: 3px solid #5FA3A0;
    border-radius: 14px;
    padding: 16px 18px;
    text-align: center;
}
#progfee_options .opt_head{
    margin: 0 0 6px 0;
    font-weight: 700;
}
#progfee_options .opt_price{
    margin: 0;
    font-weight: 700;
}
#progfee_options .opt_price .num{
    font-family: "Urbanist", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
    font-weight: 800;
    font-size: 2rem;
    color: #5FA3A0;
}
#progfee_options .opt_price small{
    font-weight: 700;
}

/* フォローアップの金額行（本文サイズのまま） */
#progfee_follow{
    margin: 6px 0 0 0;
    line-height: 1.8;
}
#progfee_follow .num{
    font-family: "Urbanist", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
    font-weight: 800;
    font-size: 1.5em;
}

/* 視覚的に隠す（読み上げ用） */
.vh{
    position: absolute !important;
    clip: rect(1px,1px,1px,1px);
    padding: 0; border: 0;
    height: 1px; width: 1px;
    overflow: hidden; white-space: nowrap;
}

/* SP対応 */
@media (max-width: 767px){
    #progfee_wrap{ padding: 48px 16px 64px; }
    #progfee_titleimg{ width: 74%; margin-bottom: 18px; }
        #progfee_options {
        grid-template-columns: 1fr;
        gap: 14px;
        display: flex;
        flex-direction: column;
    }
    #progfee_badge{ padding: 15px 16px; }
    #progfee_badge::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -13px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-top: 13px solid #E5C872;
}
    #progfee_badge::before{ bottom: -7px; }
    
#progfee_options > li {
    width: 88%;
    background: #fff;
    border: 3px solid #5FA3A0;
    border-radius: 14px;
    padding: 16px 18px;
    text-align: center;
    margin: 0 auto;
}
    
}


/* =========================
   #support
========================= */
#support{
}
#support_wrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 60px 20px 20px;
}
#support_titleimg{
    display: block;
    max-width: 95%;
    height: auto;
    margin: 0 auto 40px;
}

/* アイテム行：画像＋本文 */
.support_item{
    display: flex;
    align-items: center;
    gap: 40px;
    margin: 32px 0 56px;
}

.support_item figure{
    width: 48vw;
}
.support_item figure img{
    width: 100%;
    max-width: none;
}

/* 1,3枚目 */
.is-left figure{ margin-left: calc(50% - 50vw);}

/* 2枚目 */
.is-right{flex-direction: row-reverse;}
.is-right figure{margin-right: calc(50% - 50vw);}

/* 本文側 */
.support_body{
    flex: 1 1 0;
    max-width: 640px;
}
.support_no{
    margin: 0 0 6px 0;
}
.support_no .num {
    font-family: "Urbanist", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-weight: 100;
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
    font-size: 200%;
    color: #7aad00;
}

#support .support_body > h3 {
    margin: 0 0 20px 0;
    font-weight: 700;
    font-size: 130%;
    line-height: 1.5;
}
#support .support_body > h3 .accent{
    color: #7aad00;
}

.support_text{
    margin: 0;
    line-height: 1.9;
    font-size: 16px;
}



/* レスポンシブ */
@media (max-width: 1023px){
    .support_item figure img{ width: 520px; max-width: 50vw; }
}
@media (max-width: 767px){
    #support_wrap{ padding: 48px 16px 0px; }
    #support_titleimg{ width: 80%; margin-bottom: 18px; }
    .support_item{
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
        margin: 28px 0 40px;
    }
    .is-left figure,
    .is-right figure{
        margin-left: 0;
        margin-right: 0;
    }
    .support_item figure { width: 92vw; margin-bottom: 0;}
    .support_item figure img{
        width: 100%;
        max-width: none;
        border-radius: 10px;
    }
    .support_body{ max-width: none; }
    #support .support_body > h3{ font-size: 135%; text-align: center; line-height: 1.3;}
    .support_no { text-align: center;}
    .support_no .num{ font-size: 150%; }
    .support_text{ font-size: 105%; line-height: 1.8; }
    #support .support_body > h3 .accent{color: #7aad00; font-size: 110%;}
}


/* =========================
   #case
========================= */
#case {
    background: #e7f1e9 url(img/bg_jirei.jpg) no-repeat;
    background-position: 0 -30px;
    padding-top: 150px;
}
#case_wrap {
    max-width: 850px;
    margin: 0 auto;
    padding: 60px 20px 0px;
    text-align: center;
}
#case_titleimg{
    display: block;
    max-width: 92%;
    height: auto;
    margin: 0 auto 35px;
}

.case_card {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .08);
    padding: 30px 40px 40px;
    text-align: left;
    margin: 0 auto 40px;
}

/* ヘッダー行 */
.case_lead {
    margin: 0 0 12px 0;
    font-weight: 700;
    font-size: 140%;
    line-height: 1.6;
}
.case_lead .case_no {
    color: #2AA7A0;
    margin-right: .6em;
    font-family: "Urbanist", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    font-weight: 100;
    font-size: 140%;
    vertical-align: middle;
}
.case_lead mark{
    background: #FFF2A8;
    padding: 0 .16em;
}

/* メタ（アイコンは背景画像） */
.case_meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    list-style: none;
    margin: 0 0 16px 0;
    padding: 10px 12px;
    background: #e2f2f2;
    justify-content: center;
}
.case_meta li{
    position: relative;
    border-radius: 6px;
    padding: 8px 12px 8px 36px;
    font-weight: 700;
}
.case_meta li::before{
    content: "";
    position: absolute;
    left: 10px; top: 50%;
    transform: translateY(-50%);
    width: 18px; height: 18px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.case_meta .type::before{ background-image: url("img/icon_jireitype.png"); }
.case_meta .place::before{ background-image: url("img/icon_jireiplace.png"); }
.case_meta .staff::before{ background-image: url("img/icon_jireistaff.png"); }

.case_block{
    margin: 16px 0;
    padding: 0px 16px;
}

/* 1つ目の .case_block にだけ下線 */
.case_card > .case_block:first-of-type{
    border-bottom: 2px solid #D7DEE0; /* 色はお好みで */
    padding-bottom: 14px;             /* 線が詰まって見えないよう調整 */
    margin-bottom: 16px;              /* 下のブロックとの間隔 */
}

.enjieblock {
    background: #ffefbf;
    border-radius: 15px;
    padding: 20px 23px;
}
.case_block .case_head{ margin-top: 0; }
.case_block .case_text{ margin: 0; }

.case_head_title{
    position: relative;
    margin: 0 0 6px 0;
    padding-left: 0;
    font-size: 16px;
    font-weight: 700;
    color: #147C75;
}

.case_head{
    position: relative;
    margin: 0 0 6px 0;
    padding-left: 28px;
    font-size: 16px;
    font-weight: 700;
    color: #147C75;
}

.enjieblock .case_head{
    position: relative;
    margin: 0 0 6px 0;
    padding-left: 28px;
    font-size: 16px;
    font-weight: 700;
    color: #856501;
}

.case_head::before{
    content: "";
    position: absolute;
    left: 0; top: 50%;
    transform: translateY(-50%);
    width: 18px; height: 18px;
    background-repeat: no-repeat;
    background-size: contain;
}
.case_head.kadai::before{ background-image: url("img/icon_jireikadai.png"); }
.case_head.kouka::before{ background-image: url("img/icon_jireikouka.png"); }
.case_head.sup::before{ background-image: url("img/icon_jireisupdetail.png"); }

.case_text{
    margin: 0;
    line-height: 1.6;
    font-size: 16px;
    color: #333;
}

/* 最下部：左写真＋右 吹き出し（線のみ） */
.case_bottom {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 18px;
}
.case_photo{
    flex: 0 0 auto;
    margin: 0;
}
.case_photo img{
    display: block;
    width: 170px;
    height: auto;
}

/* 吹き出し（線のみ・白背景） */

.case_bubble {
    position: relative;
    background: #fff;
    border: 8px solid #D7DEE0;
    border-radius: 10px;
    padding: 20px 25px;
    flex: 1 1 auto;
}
.case_bubble::after {
    content: "";
    position: absolute;
    left: -21px;
    top: 28px;
    width: 0;
    height: 0;
    border-right: 18px solid #D7DEE0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
}

.case_bubble .bubble_head{
    margin: 0 0 4px 0;
    font-weight: 700;
    font-size: 110%;
}
.case_bubble .bubble_text{
    margin: 0;
    line-height: 1.8;
}

.case_bottomread {
    max-width: 850px;
    margin: 0 auto 0;
    padding-bottom: 80px;
    line-height: 1.7;
}

.case_text span,
.bubble_text span {
    color: #c87b00;
}

/* SP */
@media (max-width: 767px){
    #case {padding-top: 0px;background-position: 0 -213px;}
    #case_wrap{ padding: 90px 16px 0px; }
    #case_titleimg{ width: 62%; margin-bottom: 38px; }
    #case_card{ padding: 18px 16px; }
    .case_card {padding: 20px 18px 26px; font-size: 130% !important;}
    #case_lead{ font-size: 18px; }
    #case_meta li{ padding: 8px 10px 8px 34px; }
    #case_bottom{ flex-direction: column; gap: 10px; }
    #case_photo img{ width: 100px; }
    #case_bubble::after{ left: 18px; top: -10px; border-right: 10px solid transparent; border-bottom: 10px solid #D7DEE0; }
    #case_bubble::before{ left: 18px; top: -8px; border-right: 8px solid transparent; border-bottom: 8px solid #fff; }
    .case_lead .case_no { display: block; margin-bottom: 0; text-align: center;}
    .case_text {line-height: 1.6;}
    .case_bottomread {width: 90%;padding-bottom: 50px;}
    .case_bottom {　display: flex; flex-direction: column-reverse; flex-wrap: wrap;}
    .case_bubble{ margin-bottom: 18px;}
    case_bubble .bubble_text {font-size: 95%;}
    .case_bubble::after{
        left: 50%;
        top: auto;
        bottom: -26px;
        transform: translateX(-50%);
        border: none;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-top: 18px solid #D7DEE0;
    }
    .case_bubble::before{
        left: 50%;
        top: auto;
        bottom: -18px;
        transform: translateX(-50%);
        border: none;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 16px solid #fff;
    }
.case_meta li { padding: 0px 12px 0px 36px;}
.case_bubble .bubble_text {font-size: 16px;}
}

/* ===== アコーディオン ===== */

.case_lead { cursor: pointer; display: block; }

.case_toggle {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* 1) 閉じている時だけ非表示（開いたらデフォルトdisplayのまま） */
.case_card > .case_toggle:not(:checked) ~ .case_block,
.case_card > .case_toggle:not(:checked) ~ .case_bottom {
  display: none;
}

/* 2) 2カラムは Grid で実現（flex不要）*/
.case_bottom {
  display: grid;
  grid-template-columns: 170px 1fr;
  column-gap: 18px;
  align-items: center;
}

/* SP：縦並び。吹き出しを先に、写真を後に */
@media (max-width: 767px){
  .case_bottom {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 10px;
  }
  .case_bubble { grid-row: 1; }
  .case_photo  { grid-row: 2; }
}


.case_head_title { position: relative; }
.case_lead {
  position: relative;
  padding-right: 1.4em;
}
.case_lead::after {
  content: "";
  position: absolute;
  right: 0.2em;
  top: 0.6em;
  width: 7px; height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform .2s ease;
}

.case_card > .case_toggle:checked + .case_head_title .case_lead::after {
  transform: rotate(-135deg);
}

.case_lead:focus { outline: 2px solid #147C75; outline-offset: 2px; }



/* =========================
   #message
========================= */
#message{
    background: #f7f7f7;
}

#message_wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 0;
    display: flex;
    align-items: center;
    gap: 70px;
}

/* 写真：左端にピッタリ（はみ出し吸着） */
#message figure{
    flex: 0 0 48vw;                       /* 画像幅（安全値） */
    margin: 0 0 0 calc(50% - 50vw);       /* 左端に吸着させる */
    overflow: hidden;
}
#message figure img{
    display: block;
    width: 100%;
    height: auto;
}

/* 文章側 */
#message_wrap > div{
    flex: 1 1 0;
    max-width: 510px;
}

/* 見出し・本文（font-sizeは未指定＝ブラウザ既定） */
#message h3 {
    margin: 0 0 30px 0;
    font-weight: 700;
    line-height: 1.5;
    font-size: 140%;
}
#message .acc_g{ color: #7aad00; font-weight: 700; }
#message p{ margin: 5px 0 12px 0; line-height: 2; }

/* 署名 */
#message #message_sig{ margin-top: 18px; text-align: right; }
#message #message_sig small{ display: block; line-height: 1.5; margin-top: 40px;}
#message #message_sig b {
    font-weight: 700;
    font-size: 140%;
    font-family: serif;
}


/* SP：1カラム（写真→文章）。はみ出し解除 */
@media (max-width: 767px){
    #message_wrap{
        display: block;
        padding: 48px 16px 56px;
    }
    #message figure{
        margin: 0 0 14px 0;       /* 吸着を解除して通常配置 */
        width: 100%;              /* フル幅 */
        flex: none;
    }
    #message_wrap > div{
        max-width: none;
    }
}



/* =========================
   #faq
========================= */
#faq {
    background: url(img/bg_greendot.png) no-repeat;
    background-position: 0 -60px;
    background-size: 40%;
}

#faq_wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding: 90px 20px 80px;
    text-align: center;
}
#faq_titleimg {
    display: block;
    max-width: 90%;
    height: auto;
    margin: 0 auto 50px;
}

/* リスト全体 */
#faq_list{
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    gap: 12px;
    text-align: left;
}

/* アコーディオン本体（details） */
#faq_list details{
    background: #F4F4F4;
    border-radius: 12px;
    border: 1px solid #ECECEC;
    overflow: hidden;
}

/* 見出し行（summary） */
#faq_list summary{
    list-style: none;              /* 既定マーカー非表示 */
    padding: 18px 56px 18px 24px;
    cursor: pointer;
    position: relative;
    font-weight: 700;
    outline: none;
}
#faq_list summary::-webkit-details-marker{
    display: none;                 /* Safari/Chrome対策 */
}
/* 右端の＋／− */
#faq_list summary::after{
    content: "+";
    position: absolute;
    right: 18px; top: 50%;
    transform: translateY(-50%);
    font-size: 22px;
    font-weight: 700;
    color: #111;
}
#faq_list details[open] summary::after{
    content: "−";
}

/* 本文 */
#faq_list details > p{
    margin: 0;
    padding: 14px 24px 18px;
    border-top: 1px solid #E5E5E5;
    line-height: 1.9;
    background: #fff;
}

/* フォーカス可視化 */
#faq_list summary:focus-visible{
    box-shadow: 0 0 0 3px rgba(42,167,160,.35);
    border-radius: 10px;
}

/* SP */
@media (max-width: 767px){
    #faq {background-size: 94%;}
    #faq_wrap{ padding: 48px 16px 56px; }
    #faq_titleimg{ width: 55%; margin-bottom: 35px; }
    #faq_list summary{ padding: 16px 48px 16px 16px; }
    #faq_list summary::after{ right: 14px; }
    #faq_list details > p{ font-size: 100%; line-height: 1.6;}
}

footer { font-size: 80%; text-align: center; padding: 20px 10px;}
