@charset "utf-8";

/* ============================================================
   本日の空き枠掲示板 / style.css
   ・カードは「誰が → いくら → いつまで」の順に読ませる
   ・赤＝料金、黄＝残り時間、と色の役割を固定する
   ・スマホを基準に作り、画面が広がると自動で列が増える
   ============================================================ */

:root{
  --bg:        #0c0e12;
  --panel:     #161a21;
  --panel-2:   #1d222b;
  --line:      #272d38;
  --text:      #e7eaf0;
  --muted:     #8a93a3;
  --dim:       #5d6675;
  --red:       #ff3d46;
  --amber:     #ffb020;
  --green:     #3ad29f;

  --num: "Barlow Condensed", "Arial Narrow", sans-serif;
  --jp: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
        "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;

  --radius: 10px;
  --wrap: 1180px;
  --gutter: 14px;
}

*{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  padding:0 0 88px;
  background:var(--bg);
  color:var(--text);
  font-family:var(--jp);
  font-size:15px;
  line-height:1.7;
  overflow-wrap:break-word;
}

a{ color:inherit; }

img{ max-width:100%; height:auto; }

.wrap{
  width:100%;
  max-width:var(--wrap);
  margin:0 auto;
  padding:0 var(--gutter);
}

/* ---------- ヘッダー ---------- */
.site-head{
  background:linear-gradient(180deg, #12161d 0%, #0f1219 100%);
  border-bottom:1px solid var(--line);
}
.head-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-top:11px;
  padding-bottom:11px;
}
.brand{ display:flex; flex-direction:column; min-width:0; }
.brand-name{
  font-size:clamp(15px, 4.2vw, 18px);
  font-weight:700;
  letter-spacing:.04em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.brand-sub{
  font-size:11px;
  color:var(--muted);
  letter-spacing:.02em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.head-back{
  flex:0 0 auto;
  font-size:12px;
  color:var(--muted);
  text-decoration:none;
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 12px;
  white-space:nowrap;
}

/* 受付中の件数 */
.live{
  display:flex;
  align-items:baseline;
  gap:5px;
  white-space:nowrap;
  flex:0 0 auto;
}
.live-dot{
  width:7px; height:7px;
  border-radius:50%;
  background:var(--green);
  align-self:center;
  animation:pulse 2.4s infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(58,210,159,.55); }
  70%{ box-shadow:0 0 0 8px rgba(58,210,159,0); }
  100%{ box-shadow:0 0 0 0 rgba(58,210,159,0); }
}
.live-num{
  font-family:var(--num);
  font-size:26px;
  font-weight:700;
  line-height:1;
  color:var(--green);
}
.live-unit{ font-size:11px; color:var(--muted); }

/* ---------- 絞り込み ---------- */
.filterbar{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(12,14,18,.94);
  -webkit-backdrop-filter:saturate(140%) blur(6px);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid var(--line);
}
.filter{
  display:flex;
  gap:8px;
  align-items:center;
  padding-top:10px;
  padding-bottom:10px;
  flex-wrap:wrap;
}
.filter select,
.filter input[type="search"]{
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--text);
  border-radius:8px;
  padding:9px 10px;
  font-size:16px;          /* 16px未満だとiPhoneで画面が勝手に拡大する */
  font-family:var(--jp);
  min-width:0;
}
.filter select{ flex:0 0 auto; max-width:40%; }
.filter input[type="search"]{ flex:1 1 130px; }
.btn-find{
  flex:0 0 auto;
  background:var(--text);
  color:#0c0e12;
  border:0;
  border-radius:8px;
  padding:10px 16px;
  font-size:14px;
  font-weight:700;
  font-family:var(--jp);
  cursor:pointer;
}
.btn-clear{
  display:inline-block;
  font-size:12px;
  color:var(--muted);
  text-decoration:none;
  border:1px solid var(--line);
  border-radius:999px;
  padding:7px 14px;
}

/* ---------- 本文エリア ---------- */
.main{ padding-top:16px; }

.notice{
  background:rgba(58,210,159,.10);
  border:1px solid rgba(58,210,159,.35);
  color:var(--green);
  border-radius:8px;
  padding:10px 12px;
  font-size:13px;
  margin:0 0 14px;
}
.result-count{
  font-size:12px;
  color:var(--muted);
  margin:0 0 10px;
}

/* ============================================================
   カード一覧
   画面幅に応じて自動で列数が増えます（1列 → 2列 → 3列）
   ============================================================ */
.cards{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  gap:12px;
  align-items:start;
}

.card{
  position:relative;
  background:var(--panel);
  border:1px solid var(--line);
  border-left:3px solid var(--dim);
  border-radius:var(--radius);
  padding:13px 14px 12px;
  display:flex;
  flex-direction:column;
  min-width:0;
}
.card.is-urgent{ border-left-color:var(--amber); }
.card.is-over{ opacity:.4; }

.card-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}
.place{
  font-size:11px;
  color:var(--muted);
  letter-spacing:.08em;
  min-width:0;
}
.place .city::before{ content:"／"; color:var(--dim); }
.posted{
  font-size:11px;
  color:var(--dim);
  white-space:nowrap;
  flex:0 0 auto;
}

/* 店名（カードの見出し・反転表示） */
.shop-name{
  margin:6px 0 0;
  font-size:0;              /* 内側のspanとの隙間を消すため */
  line-height:1;
}
.shop-name span{
  display:inline-block;
  background:var(--red);
  color:#fff;
  font-size:clamp(18px, 5.2vw, 21px);
  font-weight:700;
  line-height:1.32;
  letter-spacing:.01em;
  padding:4px 12px 5px;
  border-radius:5px;
  max-width:100%;
  word-break:break-word;
}
.card.is-ended .shop-name span{
  background:var(--panel-2);
  color:var(--muted);
  border:1px solid var(--line);
  padding:3px 11px 4px;
}

/* 駅名・ジャンル */
.station{
  font-size:14px;
  font-weight:700;
  color:#c6ccd8;
  letter-spacing:.02em;
}
.station::before{
  content:"◉";
  font-size:9px;
  color:var(--dim);
  margin-right:4px;
  vertical-align:1px;
}
.title{
  margin:6px 0 0;
  font-size:13px;
  font-weight:500;
  color:var(--muted);
}

/* ---------- 写真（カードの主役） ---------- */
.hero{
  position:relative;
  margin:11px 0 0;
  border-radius:8px;
  overflow:hidden;
  background:var(--panel-2);
}
/* 縦横比を固定し、どんな写真でも同じ大きさに揃える */
.hero::before{
  content:"";
  display:block;
  padding-top:133.33%;        /* 3:4（縦長） */
}
.hero-img{
  position:absolute;
  top:0; left:0;
  width:100%;
  height:100%;
  object-fit:cover;           /* はみ出す分は切り取る（伸びない・潰れない） */
  object-position:50% 22%;    /* 顔が残りやすいよう、やや上寄りで切る */
  display:block;
}
.hero-cast{
  position:absolute;
  left:0; right:0; bottom:0;
  margin:0;
  padding:34px 12px 11px;
  background:linear-gradient(to top, rgba(8,10,14,.93) 30%, rgba(8,10,14,0));
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.hero-cast-label{
  flex:0 0 auto;
  font-size:10px;
  letter-spacing:.1em;
  color:#0c0e12;
  background:var(--text);
  border-radius:3px;
  padding:1px 6px;
  font-weight:700;
}
.hero-cast-name{
  font-size:clamp(17px, 4.6vw, 20px);
  font-weight:700;
  letter-spacing:.02em;
  text-shadow:0 1px 6px rgba(0,0,0,.6);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* 写真が無いときの名前表示 */
.cast{
  margin:9px 0 0;
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.cast-label{
  flex:0 0 auto;
  font-size:10px;
  letter-spacing:.1em;
  color:var(--muted);
  border:1px solid var(--line);
  border-radius:3px;
  padding:1px 5px;
}
.cast-name{
  font-size:16px;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ---------- 料金 ---------- */
.price{
  display:flex;
  align-items:flex-end;
  gap:12px;
  padding:12px 0 2px;
  margin-top:11px;
  border-top:1px dashed var(--line);
  flex-wrap:wrap;
}
.price-normal{
  display:flex;
  flex-direction:column;
  color:var(--dim);
}
.price-normal-label{ font-size:10px; letter-spacing:.1em; }
.price-normal-num{
  font-family:var(--num);
  font-size:20px;
  font-weight:500;
  line-height:1.1;
  text-decoration:line-through;
}
.price-sale{
  display:flex;
  align-items:baseline;
  gap:6px;
  min-width:0;
}
.price-sale-label{
  font-size:10px;
  letter-spacing:.1em;
  color:var(--red);
  border:1px solid var(--red);
  border-radius:3px;
  padding:1px 5px;
  align-self:center;
  flex:0 0 auto;
}
.price-sale-num{
  font-family:var(--num);
  font-size:clamp(38px, 12vw, 48px);
  font-weight:700;
  line-height:.9;
  color:var(--red);
  letter-spacing:-.01em;
}
.price-sale-yen{
  font-size:14px;
  font-weight:700;
  color:var(--red);
}

/* ---------- 残り時間 ---------- */
.limit{
  margin-top:10px;
  background:var(--panel-2);
  border-radius:6px;
  padding:8px 10px 9px;
}
.limit-row{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
}
.limit-label{
  font-size:10px;
  color:var(--muted);
  letter-spacing:.08em;
}
.limit-count{
  font-family:var(--num);
  font-size:clamp(22px, 6.4vw, 26px);
  font-weight:700;
  line-height:1;
  color:var(--amber);
  font-variant-numeric:tabular-nums;
  margin-left:auto;
}
.limit-until{
  font-size:11px;
  color:var(--dim);
  width:100%;
  text-align:right;
}
.limit-bar{
  margin-top:7px;
  height:3px;
  background:#0e1116;
  border-radius:2px;
  overflow:hidden;
}
.limit-bar i{
  display:block;
  height:100%;
  background:var(--amber);
  border-radius:2px;
}
.card.is-urgent .limit-bar i{ background:var(--red); }
.card.is-urgent .limit-count{ color:var(--red); }

/* ---------- 本文・店舗 ---------- */
.body{
  margin:11px 0 0;
  font-size:13px;
  color:#c6ccd8;
  word-break:break-word;
}


/* ---------- 合言葉（クーポン券風） ---------- */
.keyword{
  position:relative;
  margin-top:11px;
  background:#f4efe4;
  color:#151821;
  border-radius:6px;
  padding:11px 14px 12px;
  text-align:center;
  overflow:hidden;
}
.keyword::before,
.keyword::after{
  content:"";
  position:absolute;
  top:50%;
  width:14px; height:14px;
  margin-top:-7px;
  background:var(--panel);
  border-radius:50%;
}
.keyword::before{ left:-7px; }
.keyword::after{ right:-7px; }

.keyword-label{
  display:inline-block;
  font-size:10px;
  font-weight:700;
  letter-spacing:.2em;
  color:#7a705c;
  border-bottom:1px solid #d8cfba;
  padding-bottom:2px;
  margin-bottom:5px;
}
.keyword-word{
  margin:0;
  font-size:clamp(15px, 4.4vw, 17px);
  font-weight:700;
  line-height:1.4;
}
.keyword-note{
  margin:3px 0 0;
  font-size:11px;
  line-height:1.6;
  color:#5c5546;
}

/* ---------- 連絡先 ---------- */
.contact{
  display:flex;
  gap:8px;
  margin-top:10px;
  flex-wrap:wrap;
}
.btn-tel,
.btn-line{
  flex:1 1 45%;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  border-radius:8px;
  padding:10px 8px;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  text-align:center;
  min-width:0;
}
.btn-tel{
  background:var(--text);
  color:#0c0e12;
}
.btn-tel-num{
  font-family:var(--num);
  font-size:18px;
  font-weight:700;
  letter-spacing:.03em;
}
.btn-line{
  background:transparent;
  border:1px solid var(--green);
  color:var(--green);
}
.btn-line-id{
  font-size:14px;
  font-weight:700;
  word-break:break-all;
}

.btn-site{
  display:block;
  margin-top:8px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel-2);
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  text-align:center;
  text-decoration:none;
}
.btn-site::after{ content:" ↗"; font-size:11px; }

.card-del{
  margin-top:10px;
  font-size:11px;
  color:var(--dim);
  text-decoration:none;
  text-align:right;
  border-top:1px solid var(--line);
  padding-top:8px;
}

/* ---------- 空・注意書き ---------- */
.empty{
  border:1px dashed var(--line);
  border-radius:var(--radius);
  padding:34px 18px;
  text-align:center;
}
.empty-lead{ margin:0 0 6px; font-size:15px; font-weight:700; }
.empty-sub{ margin:0 0 14px; font-size:12px; color:var(--muted); }

.more-note{
  margin:16px 0 0;
  font-size:12px;
  color:var(--muted);
  text-align:center;
}
.disclaimer{
  margin:26px 0 0;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:8px;
  font-size:11px;
  line-height:1.9;
  color:var(--dim);
}

/* ---------- 投稿ボタン（画面下固定） ---------- */
.fab{
  position:fixed;
  left:50%;
  bottom:16px;
  transform:translateX(-50%);
  z-index:30;
  background:var(--red);
  color:#fff;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  padding:13px 26px;
  border-radius:999px;
  box-shadow:0 6px 20px rgba(0,0,0,.5);
  white-space:nowrap;
}

/* ---------- フッター ---------- */
.site-foot{
  margin-top:34px;
  border-top:1px solid var(--line);
  padding:16px 0;
  font-size:12px;
  color:var(--muted);
}
.site-foot .wrap{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.site-foot a{ color:var(--muted); }
.foot-copy{ color:var(--dim); }

/* ============================================================
   投稿フォーム
   ============================================================ */
.page-form{ padding-bottom:40px; }

.form{ margin:0; max-width:640px; }

.fieldset{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:14px;
  margin-bottom:12px;
}
.fieldset-head{
  margin:0 0 12px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--amber);
  border-bottom:1px solid var(--line);
  padding-bottom:8px;
}
.fieldset-note{
  margin:-4px 0 12px;
  font-size:12px;
  color:var(--muted);
}

.field{ display:block; margin-bottom:14px; }
.field:last-child{ margin-bottom:0; }

.label{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:5px;
}
.label em{
  font-style:normal;
  font-size:10px;
  color:var(--red);
  border:1px solid var(--red);
  border-radius:3px;
  padding:0 4px;
  margin-left:6px;
}

.field input[type="text"],
.field input[type="tel"],
.field input[type="url"],
.field input[type="time"],
.field input[type="password"],
.field input[type="search"],
.field select,
.field textarea{
  width:100%;
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:8px;
  color:var(--text);
  font-size:16px;
  font-family:var(--jp);
  padding:11px 12px;
}
.field textarea{ resize:vertical; line-height:1.7; }

.field input[type="file"]{
  width:100%;
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:8px;
  color:var(--text);
  font-size:14px;
  font-family:var(--jp);
  padding:10px 12px;
}
.field input[type="file"]::-webkit-file-upload-button{
  background:var(--line);
  border:0;
  border-radius:6px;
  color:var(--text);
  font-family:var(--jp);
  font-size:13px;
  padding:7px 12px;
  margin-right:10px;
  cursor:pointer;
}

.field input:focus,
.field select:focus,
.field textarea:focus,
.filter input:focus,
.filter select:focus{
  outline:2px solid var(--amber);
  outline-offset:1px;
  border-color:var(--amber);
}

.help{
  display:block;
  margin-top:5px;
  font-size:11px;
  color:var(--dim);
  line-height:1.6;
}

.field-2col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
@media (max-width:430px){
  .field-2col{ grid-template-columns:1fr; }
}

.hp{
  position:absolute;
  left:-9999px;
  width:1px; height:1px;
  overflow:hidden;
}

.btn-submit{
  display:block;
  width:100%;
  background:var(--red);
  color:#fff;
  border:0;
  border-radius:10px;
  padding:16px;
  font-size:16px;
  font-weight:700;
  font-family:var(--jp);
  cursor:pointer;
  margin-top:4px;
}
.btn-danger{ background:#c62b33; }

.errors{
  background:rgba(255,61,70,.10);
  border:1px solid rgba(255,61,70,.45);
  border-radius:8px;
  padding:12px 14px;
  margin-bottom:14px;
}
.errors-head{
  margin:0;
  font-size:13px;
  font-weight:700;
  color:var(--red);
}
.errors ul{
  margin:8px 0 0;
  padding-left:18px;
  font-size:12px;
  color:#ffb9bd;
}

.del-target{
  background:var(--panel);
  border:1px solid var(--line);
  border-left:3px solid var(--amber);
  border-radius:var(--radius);
  padding:12px 14px;
  margin-bottom:14px;
}
.del-target-shop{ margin:0; font-size:12px; color:var(--muted); }
.del-target-title{ margin:2px 0 0; font-size:15px; font-weight:700; }

.done{
  border:1px solid rgba(58,210,159,.4);
  background:rgba(58,210,159,.08);
  border-radius:var(--radius);
  padding:30px 18px;
  text-align:center;
}
.done-lead{ margin:0 0 14px; font-size:16px; font-weight:700; color:var(--green); }

/* ---------- 画面が広いとき ---------- */
@media (min-width:768px){
  :root{ --gutter:20px; }
}

/* ---------- 動きを減らす設定への配慮 ---------- */
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
}

/* ============================================================
   受付が終わった投稿（ご成約・受付終了）
   投稿は残したまま、受付中のものと見分けがつくようにする
   ============================================================ */
.card.is-ended{
  border-left-color:var(--line);
  background:#12151b;
}
.card.is-ended .station,
.card.is-ended .price-sale-num,
.card.is-ended .price-sale-yen,
.card.is-ended .price-sale-label{
  color:var(--muted);
}
.card.is-ended .price-sale-label{ border-color:var(--line); }
.card.is-ended .btn-tel{
  background:transparent;
  border:1px solid var(--line);
  color:var(--muted);
}
.card.is-ended .btn-line{
  border-color:var(--line);
  color:var(--muted);
}

/* 写真に重ねるスタンプ */
.hero-stamp{
  position:absolute;
  top:0; left:0;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(8,10,14,.62);
}
.hero-stamp span{
  border:2px solid var(--text);
  border-radius:4px;
  color:var(--text);
  font-size:clamp(20px, 6vw, 26px);
  font-weight:700;
  letter-spacing:.22em;
  padding:8px 18px 8px 26px;   /* 字間ぶん右に寄るので左を広く */
  transform:rotate(-7deg);
  background:rgba(8,10,14,.55);
  white-space:nowrap;
}
.card.is-ended .hero-img{
  filter:grayscale(.75);
}

/* 写真が無いときの帯 */
.ended-band{
  margin:11px 0 0;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel-2);
  color:var(--muted);
  font-size:14px;
  font-weight:700;
  letter-spacing:.2em;
  text-align:center;
}

/* 残り時間の枠を「終了」表示に差し替えたとき */
.limit.is-done .limit-row{
  justify-content:space-between;
}
.limit.is-done .limit-label{
  font-size:13px;
  font-weight:700;
  color:var(--muted);
  letter-spacing:.14em;
}
.limit-done{
  font-family:var(--num);
  font-size:15px;
  color:var(--dim);
}

/* ---------- 駅名の横のジャンル ---------- */
.station-row{
  margin:8px 0 0;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  min-width:0;
}
.genre{
  flex:0 0 auto;
  font-size:11px;
  color:var(--muted);
  border:1px solid var(--line);
  border-radius:999px;
  padding:2px 9px;
  letter-spacing:.04em;
}

/* ---------- 操作画面のボタン ---------- */
.btn-close{ background:#2f6f57; }
.btn-reopen{ background:#2f5a7a; }
.act-note{
  margin:7px 0 18px;
  font-size:11px;
  line-height:1.7;
  color:var(--dim);
}
.act-note:last-child{ margin-bottom:0; }
.del-target-state{
  margin:6px 0 0;
  font-size:12px;
  color:var(--amber);
}

/* ============================================================
   入口ページ（年齢確認）
   ============================================================ */
.page-gate{
  padding:0;
  min-height:100vh;
  display:flex;
}
.gate{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:36px var(--gutter);
}
.gate-inner{
  width:100%;
  max-width:460px;
  text-align:center;
}
.gate-brand{
  margin:0;
  font-size:clamp(20px, 6vw, 26px);
  font-weight:700;
  letter-spacing:.06em;
}
.gate-sub{
  margin:6px 0 26px;
  font-size:12px;
  color:var(--muted);
  letter-spacing:.06em;
}
.gate-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px 20px 22px;
}
.gate-head{
  margin:0 0 14px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.22em;
  color:var(--amber);
}
.gate-text{
  margin:0 0 22px;
  font-size:15px;
  line-height:1.9;
}
.gate-btns{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.gate-yes{
  display:block;
  background:var(--red);
  color:#fff;
  text-decoration:none;
  font-size:16px;
  font-weight:700;
  padding:16px;
  border-radius:10px;
}
.gate-no{
  display:block;
  border:1px solid var(--line);
  color:var(--muted);
  text-decoration:none;
  font-size:14px;
  padding:13px;
  border-radius:10px;
}
.gate-note{
  margin:16px 0 0;
  font-size:11px;
  line-height:1.8;
  color:var(--dim);
}
.gate-facts{
  list-style:none;
  margin:22px 0 0;
  padding:0;
  display:flex;
  gap:8px;
}
.gate-facts li{
  flex:1;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  padding:11px 6px;
}
.gate-fact-num{
  display:block;
  font-family:var(--num);
  font-size:26px;
  font-weight:700;
  line-height:1;
  color:var(--amber);
}
.gate-fact-lbl{
  display:block;
  margin-top:4px;
  font-size:10px;
  color:var(--muted);
}
.gate-legal{
  margin:22px 0 0;
  font-size:11px;
  line-height:1.9;
  color:var(--dim);
  text-align:left;
}
.gate-links{
  margin:18px 0 0;
  font-size:12px;
}
.gate-links a{ color:var(--muted); }

/* ============================================================
   掲載案内ページ（LP）
   ============================================================ */
.page-lp{ padding-bottom:0; }
.sp-br{ display:none; }
@media (max-width:480px){ .sp-br{ display:inline; } }

.lp-hero{
  padding:46px 0 40px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, #12161d 0%, var(--bg) 100%);
}
.lp-eyebrow{
  margin:0 0 12px;
  font-size:11px;
  letter-spacing:.24em;
  color:var(--amber);
}
.lp-h1{
  margin:0;
  font-size:clamp(28px, 8vw, 46px);
  font-weight:700;
  line-height:1.35;
  letter-spacing:.01em;
}
.lp-h1-em{
  color:var(--red);
  border-bottom:3px solid var(--red);
  padding-bottom:2px;
}
.lp-lead{
  margin:20px 0 0;
  font-size:clamp(14px, 3.8vw, 16px);
  line-height:2;
  color:#c6ccd8;
}
.lp-hero-cta{
  display:flex;
  gap:10px;
  margin:28px 0 0;
  flex-wrap:wrap;
}
.lp-btn{
  flex:1 1 200px;
  background:var(--red);
  color:#fff;
  text-decoration:none;
  text-align:center;
  font-size:16px;
  font-weight:700;
  padding:16px 20px;
  border-radius:10px;
}
.lp-btn-sub{
  flex:1 1 160px;
  border:1px solid var(--line);
  color:var(--text);
  text-decoration:none;
  text-align:center;
  font-size:14px;
  font-weight:700;
  padding:16px 20px;
  border-radius:10px;
}
.lp-hero-note{
  margin:16px 0 0;
  font-size:12px;
  color:var(--muted);
}

.lp-sec{ padding:44px 0; }
.lp-sec-alt{
  background:#10141a;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.lp-h2{
  margin:0 0 22px;
  font-size:clamp(19px, 5.4vw, 26px);
  font-weight:700;
  line-height:1.5;
}
.lp-p{
  margin:0 0 22px;
  font-size:14px;
  line-height:2;
  color:#c6ccd8;
}
.lp-p strong{ color:var(--text); font-weight:700; }
.lp-note-sm{
  margin:16px 0 0;
  font-size:11px;
  line-height:1.9;
  color:var(--dim);
}

/* 課題 */
.lp-probs{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap:12px;
}
.lp-prob{
  background:var(--panel);
  border:1px solid var(--line);
  border-left:3px solid var(--dim);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:16px;
}
.lp-prob-q{
  margin:0 0 8px;
  font-size:15px;
  font-weight:700;
}
.lp-prob-a{
  margin:0;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
}

/* 特長 */
.lp-points{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap:12px;
}
.lp-point{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px 16px;
}
.lp-point-n{
  margin:0 0 10px;
  font-family:var(--num);
  font-size:24px;
  font-weight:700;
  line-height:1;
  color:var(--amber);
}
.lp-point-t{
  margin:0 0 8px;
  font-size:16px;
  font-weight:700;
}
.lp-point-d{
  margin:0;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
}

/* 使い方 */
.lp-flow{
  list-style:none;
  margin:0;
  padding:0;
}
.lp-flow li{
  display:flex;
  gap:14px;
  padding:0 0 22px;
  position:relative;
}
.lp-flow li:not(:last-child)::before{
  content:"";
  position:absolute;
  left:17px;
  top:38px;
  bottom:4px;
  width:1px;
  background:var(--line);
}
.lp-flow-n{
  flex:0 0 auto;
  width:35px; height:35px;
  border-radius:50%;
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--amber);
  font-family:var(--num);
  font-size:19px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:1;
}
.lp-flow-t{
  margin:6px 0 6px;
  font-size:16px;
  font-weight:700;
}
.lp-flow-d{
  margin:0;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
}

/* 料金 */
.lp-price{
  background:var(--panel);
  border:1px solid var(--amber);
  border-radius:var(--radius);
  padding:26px 20px 22px;
  text-align:center;
}
.lp-price-label{
  margin:0 0 6px;
  font-size:11px;
  letter-spacing:.22em;
  color:var(--amber);
}
.lp-price-num{
  margin:0;
  font-family:var(--num);
  font-size:clamp(52px, 16vw, 76px);
  font-weight:700;
  line-height:.95;
  color:var(--text);
}
.lp-price-yen{
  font-size:24px;
  font-weight:700;
  margin-left:4px;
}
.lp-price-tax{
  margin:8px 0 20px;
  font-size:12px;
  color:var(--muted);
}
.lp-price-list{
  margin:0;
  padding:20px 0 0 0;
  border-top:1px dashed var(--line);
  list-style:none;
  text-align:left;
}
.lp-price-list li{
  position:relative;
  padding:0 0 10px 22px;
  font-size:13px;
  line-height:1.8;
  color:#c6ccd8;
}
.lp-price-list li::before{
  content:"";
  position:absolute;
  left:4px; top:9px;
  width:7px; height:7px;
  border-radius:50%;
  background:var(--green);
}
.lp-price-list li:last-child{ padding-bottom:0; }

.lp-cycle{
  margin-top:14px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px 16px;
}
.lp-cycle-head{
  margin:0 0 12px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--muted);
}
.lp-cycle-line{
  margin:0 0 12px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.lp-cycle-step{
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:6px;
  padding:9px 13px;
  font-size:13px;
  font-weight:700;
}
.lp-cycle-arrow{ color:var(--amber); font-size:16px; }
.lp-cycle-note{
  margin:0;
  font-size:12px;
  line-height:1.9;
  color:var(--muted);
}

/* 掲載できない内容 */
.lp-ng{
  margin:0;
  padding:0;
  list-style:none;
}
.lp-ng li{
  position:relative;
  padding:0 0 10px 22px;
  font-size:13px;
  line-height:1.8;
  color:#c6ccd8;
}
.lp-ng li::before{
  content:"×";
  position:absolute;
  left:4px; top:0;
  color:var(--red);
  font-weight:700;
}

/* 連絡先 */
.lp-contact{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap:10px;
}
.lp-contact-item{
  display:flex;
  flex-direction:column;
  gap:3px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:15px 16px;
  text-decoration:none;
}
.lp-contact-label{
  font-size:10px;
  letter-spacing:.18em;
  color:var(--muted);
}
.lp-contact-val{
  font-size:clamp(16px, 4.4vw, 19px);
  font-weight:700;
  word-break:break-all;
}
.lp-live{
  margin:20px 0 0;
  font-size:12px;
  color:var(--muted);
}
.lp-live strong{
  font-family:var(--num);
  font-size:20px;
  color:var(--green);
  margin:0 2px;
}

/* ============================================================
   料金に含まれるもの（税込・交通費込など）
   ============================================================ */
.incs{
  margin:9px 0 0;
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.inc{
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--green);
  border:1px solid rgba(58,210,159,.5);
  background:rgba(58,210,159,.08);
  border-radius:4px;
  padding:2px 8px;
}
.inc-note{
  font-size:11px;
  color:var(--dim);
}
.card.is-ended .inc{
  color:var(--muted);
  border-color:var(--line);
  background:transparent;
}

/* ============================================================
   お気に入りのエリア
   ============================================================ */
.favbar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding-bottom:10px;
}
.favbar:empty{ display:none; }

.favs{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  min-width:0;
}
.favs-label{
  font-size:10px;
  letter-spacing:.14em;
  color:var(--dim);
  margin-right:2px;
}
.fav{
  display:inline-flex;
  align-items:stretch;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:999px;
  overflow:hidden;
}
.fav-link{
  display:inline-block;
  padding:6px 4px 6px 13px;
  font-size:12px;
  font-weight:700;
  color:var(--text);
  text-decoration:none;
  white-space:nowrap;
  max-width:180px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.fav-del{
  border:0;
  background:transparent;
  color:var(--dim);
  font-size:14px;
  line-height:1;
  padding:0 11px 0 7px;
  cursor:pointer;
  font-family:var(--jp);
}
.fav-del:hover{ color:var(--red); }

.fav-add{
  flex:0 0 auto;
  border:1px solid var(--amber);
  background:transparent;
  color:var(--amber);
  border-radius:999px;
  padding:7px 14px;
  font-size:12px;
  font-weight:700;
  font-family:var(--jp);
  cursor:pointer;
  white-space:nowrap;
}

/* ============================================================
   投稿フォーム：料金ルールとチェック欄
   ============================================================ */
.price-rule{
  margin:0 0 14px;
  border:1px solid rgba(255,176,32,.45);
  background:rgba(255,176,32,.07);
  border-radius:8px;
  padding:12px 14px;
}
.price-rule-head{
  margin:0 0 6px;
  font-size:13px;
  font-weight:700;
  color:var(--amber);
  line-height:1.6;
}
.price-rule-body{
  margin:0;
  font-size:11px;
  line-height:1.85;
  color:#c6ccd8;
}

.check-group{
  border:0;
  margin:0 0 14px;
  padding:0;
}
.check-group legend{
  padding:0;
  margin-bottom:5px;
}
.check{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px 13px;
  margin-bottom:7px;
  font-size:15px;
  cursor:pointer;
}
.check input[type="checkbox"]{
  width:20px;
  height:20px;
  accent-color:var(--green);
  flex:0 0 auto;
  margin:0;
}

/* ============================================================
   店舗のSNSリンク
   ============================================================ */
.sns{
  display:flex;
  gap:7px;
  margin-top:7px;
  flex-wrap:wrap;
}
.sns-btn{
  flex:1 1 0;
  min-width:76px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel-2);
  padding:8px 6px;
  font-size:11px;
  font-weight:700;
  color:var(--muted);
  text-decoration:none;
}
.sns-ico{
  width:17px;
  height:17px;
  border-radius:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--num);
  font-size:12px;
  font-weight:700;
  color:#0c0e12;
  flex:0 0 auto;
}
.sns-x   .sns-ico{ background:#e7eaf0; }
.sns-line .sns-ico{ background:#06c755; color:#fff; }
.sns-ig  .sns-ico{ background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7); color:#fff; }

.sns-txt{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.card.is-ended .sns-btn{ opacity:.6; }

/* ============================================================
   入口ページのキービジュアル
   ============================================================ */
.gate-kv{
  position:relative;
  margin:0 0 22px;
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--panel-2);
  border:1px solid var(--line);
  aspect-ratio:920 / 832;
}
/* aspect-ratio に対応しない古い環境向け */
@supports not (aspect-ratio: 1 / 1){
  .gate-kv{ padding-top:90%; }
  .gate-kv img{ position:absolute; top:0; left:0; }
}
.gate-kv img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.gate-kv-copy{
  position:absolute;
  left:0; right:0; bottom:0;
  margin:0;
  padding:46px 16px 15px;
  background:linear-gradient(to top, rgba(8,10,14,.95) 34%, rgba(8,10,14,0));
  text-align:left;
}
.gate-kv-l1,
.gate-kv-l2{ display:block; }
.gate-kv-l1{
  font-size:clamp(17px, 5vw, 21px);
  font-weight:700;
  letter-spacing:.04em;
  color:var(--text);
  text-shadow:0 1px 8px rgba(0,0,0,.7);
}
.gate-kv-l2{
  margin-top:3px;
  font-size:clamp(13px, 3.6vw, 15px);
  font-weight:700;
  color:var(--amber);
  text-shadow:0 1px 8px rgba(0,0,0,.7);
}

/* ============================================================
   LP：空き枠のコスト比較
   ============================================================ */
.lp-calc{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:16px;
}
.lp-calc-row{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap:12px;
  align-items:stretch;
}
.lp-calc-case{
  border:1px solid var(--line);
  border-radius:8px;
  padding:15px 14px 13px;
  background:var(--panel-2);
  display:flex;
  flex-direction:column;
}
.lp-calc-minus{ border-left:3px solid var(--dim); }
.lp-calc-plus{ border-left:3px solid var(--green); }

.lp-calc-label{
  margin:0 0 10px;
  font-size:11px;
  letter-spacing:.14em;
  color:var(--muted);
  border-bottom:1px dashed var(--line);
  padding-bottom:8px;
}
.lp-calc-line{
  margin:0 0 5px;
  font-size:13px;
  line-height:1.8;
  color:#c6ccd8;
}
.lp-calc-result{
  margin:10px 0 0;
  padding-top:10px;
  border-top:1px dashed var(--line);
  font-size:clamp(18px, 5vw, 22px);
  font-weight:700;
  letter-spacing:.04em;
}
.lp-calc-minus .lp-calc-result{ color:var(--muted); }
.lp-calc-plus  .lp-calc-result{ color:var(--green); }

.lp-calc-note{
  margin:14px 0 0;
  font-size:12px;
  line-height:1.9;
  color:var(--muted);
}

/* ============================================================
   LP：お申し込みの流れ
   ============================================================ */
.lp-steps{
  list-style:none;
  margin:0 0 22px;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap:9px;
}
.lp-steps li{
  display:flex;
  align-items:center;
  gap:11px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px 14px;
}
.lp-steps-n{
  flex:0 0 auto;
  width:26px; height:26px;
  border-radius:50%;
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--amber);
  font-family:var(--num);
  font-size:16px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
}
.lp-steps-t{
  font-size:13px;
  font-weight:700;
  line-height:1.6;
}
.lp-btn-wide{
  display:block;
  flex:none;
  width:100%;
  max-width:420px;
}
.lp-apply-note{
  margin:16px 0 0;
  font-size:12px;
  line-height:1.9;
  color:var(--muted);
}

/* ============================================================
   申込フォーム
   ============================================================ */
.form-lead{
  margin:0 0 16px;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
}
.errors-note{
  margin:8px 0 0;
  font-size:11px;
  color:#ffb9bd;
}
.done-no{
  margin:0 0 14px;
  font-size:13px;
  color:var(--muted);
}
.done-no strong{
  font-family:var(--num);
  font-size:22px;
  color:var(--text);
  letter-spacing:.06em;
  margin-left:6px;
}
.done-text{
  margin:0 0 18px;
  font-size:13px;
  line-height:1.9;
  color:#c6ccd8;
}
.check-group legend em,
.check span{
  font-size:13px;
  line-height:1.8;
}

/* ---------- 診断ページの表 ---------- */
.diag{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.diag th,
.diag td{
  border:1px solid var(--line);
  padding:9px 11px;
  text-align:left;
  vertical-align:top;
  line-height:1.7;
}
.diag th{
  background:var(--panel-2);
  color:var(--muted);
  font-weight:700;
  white-space:nowrap;
  width:38%;
}
.diag td{ word-break:break-all; }
.diag .okmark{ color:var(--green); font-weight:700; }
.diag .ng{ color:var(--red); font-weight:700; }
.diag .skip{ color:var(--dim); }
.diag .help{ font-size:11px; }

/* ============================================================
   ホーム画面に追加のご案内
   ============================================================ */
.a2hs{
  position:fixed;
  left:12px;
  right:12px;
  bottom:76px;              /* 投稿ボタンに重ならない位置 */
  z-index:40;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px 16px 14px;
  box-shadow:0 10px 34px rgba(0,0,0,.62);
  max-width:420px;
  margin:0 auto;
  animation:a2hsIn .32s ease-out;
}
@keyframes a2hsIn{
  from{ opacity:0; transform:translateY(14px); }
  to{ opacity:1; transform:translateY(0); }
}

.a2hs-x{
  position:absolute;
  top:6px; right:8px;
  border:0;
  background:transparent;
  color:var(--dim);
  font-size:20px;
  line-height:1;
  padding:6px 9px;
  cursor:pointer;
  font-family:var(--jp);
}

.a2hs-head{
  margin:0 0 5px;
  font-size:15px;
  font-weight:700;
  padding-right:24px;
}
.a2hs-lead{
  margin:0 0 12px;
  font-size:12px;
  color:var(--muted);
  line-height:1.7;
}

.a2hs-steps{
  list-style:none;
  margin:0;
  padding:0;
}
.a2hs-steps li{
  display:flex;
  align-items:flex-start;
  gap:9px;
  font-size:13px;
  line-height:1.7;
  padding:5px 0;
}
.a2hs-n{
  flex:0 0 auto;
  width:19px; height:19px;
  margin-top:2px;
  border-radius:50%;
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--amber);
  font-family:var(--num);
  font-size:12px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
}
.a2hs-steps b{ font-weight:700; color:var(--amber); }

.a2hs-ico{
  display:inline-block;
  border:1px solid var(--line);
  background:var(--panel-2);
  border-radius:4px;
  padding:1px 7px;
  font-size:11px;
  color:var(--text);
}

.a2hs-btn{
  display:block;
  width:100%;
  background:var(--red);
  color:#fff;
  border:0;
  border-radius:9px;
  padding:13px;
  font-size:15px;
  font-weight:700;
  font-family:var(--jp);
  cursor:pointer;
  margin:0 0 12px;
}

/* ホーム画面から開いたときは、下の余白を少し広げる */
@media (display-mode: standalone){
  body{ padding-bottom:104px; }
}

/* ============================================================
   割引率（○%OFF）
   ============================================================ */
.price-off{
  display:flex;
  align-items:baseline;
  gap:4px;
  flex-wrap:wrap;
  margin-left:auto;
  align-self:center;
  padding:3px 9px 4px;
  border:1px solid var(--red);
  border-radius:6px;
  background:rgba(255,61,70,.09);
}
.price-off-pct{
  font-family:var(--num);
  font-size:24px;
  font-weight:700;
  line-height:1;
  color:var(--red);
}
.price-off-unit{
  font-size:15px;
  font-weight:700;
  margin-left:1px;
}
.price-off-label{
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
  color:var(--red);
}
.price-off-yen{
  width:100%;
  font-size:10px;
  color:var(--muted);
  text-align:center;
  letter-spacing:.02em;
}
.card.is-ended .price-off{
  border-color:var(--line);
  background:transparent;
}
.card.is-ended .price-off-pct,
.card.is-ended .price-off-label{ color:var(--muted); }

/* ============================================================
   LP：無料キャンペーンの料金表示
   ============================================================ */
.lp-price.is-free{
  border-color:var(--green);
  position:relative;
  overflow:hidden;
}

.lp-free-badge{
  display:inline-block;
  margin:0 0 20px;
  background:var(--green);
  color:#08201a;
  font-size:clamp(12px, 3.4vw, 14px);
  font-weight:700;
  letter-spacing:.04em;
  padding:7px 16px;
  border-radius:999px;
}

.lp-price-swap{ text-align:center; }

/* 取り消し線つきの通常価格 */
.lp-price-was{
  position:relative;
  display:inline-block;
  padding:2px 10px;
}
.lp-price-was-label{
  display:block;
  font-size:11px;
  letter-spacing:.14em;
  color:var(--dim);
  margin-bottom:2px;
}
.lp-price-was-num{
  font-family:var(--num);
  font-size:clamp(30px, 9vw, 40px);
  font-weight:500;
  line-height:1;
  color:var(--dim);
}
/* ×印（2本の斜線） */
.lp-price-x{
  position:absolute;
  left:0; right:0;
  top:16px; bottom:-2px;
  pointer-events:none;
}
.lp-price-x::before,
.lp-price-x::after{
  content:"";
  position:absolute;
  left:-4%;
  top:50%;
  width:108%;
  height:3px;
  background:var(--red);
  border-radius:2px;
}
.lp-price-x::before{ transform:rotate(14deg); }
.lp-price-x::after{ transform:rotate(-14deg); }

.lp-price-arrow{
  margin:6px 0 2px;
  font-size:22px;
  line-height:1;
  color:var(--green);
}

.lp-price-zero{
  color:var(--green) !important;
}
.lp-price-zero .lp-price-yen{ color:var(--green); }

.lp-free-note{
  margin-top:14px;
  background:rgba(58,210,159,.07);
  border:1px solid rgba(58,210,159,.4);
  border-radius:var(--radius);
  padding:16px;
}
.lp-free-note-head{
  margin:0 0 10px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--green);
}
.lp-free-note-list{
  margin:0;
  padding:0;
  list-style:none;
}
.lp-free-note-list li{
  position:relative;
  padding:0 0 9px 20px;
  font-size:13px;
  line-height:1.8;
  color:#c6ccd8;
}
.lp-free-note-list li:last-child{ padding-bottom:0; }
.lp-free-note-list li::before{
  content:"";
  position:absolute;
  left:3px; top:9px;
  width:7px; height:7px;
  border-radius:50%;
  background:var(--green);
}

.lp-hero-free{
  color:var(--green);
  font-weight:700;
  border-bottom:2px solid var(--green);
  padding-bottom:1px;
}

/* ---------- 申込フォームの無料キャンペーン表示 ---------- */
.apply-free{
  margin:0 0 16px;
  background:rgba(58,210,159,.08);
  border:1px solid rgba(58,210,159,.45);
  border-radius:8px;
  padding:14px 15px;
}
.apply-free-head{
  margin:0 0 7px;
  font-size:clamp(14px, 4vw, 16px);
  font-weight:700;
  color:var(--green);
  line-height:1.5;
}
.apply-free-body{
  margin:0;
  font-size:12px;
  line-height:1.9;
  color:#c6ccd8;
}