@charset "utf-8";
/* ============================================================
   代理店ページ C案（ブランド訴求型）
   SP：〜767px ／ PC：768px〜
   ============================================================ */
:root{
  --ti-red:#dc0115;
  --ti-red2:#ff3b4e;
  --ti-ink:#1f2328;
  --ti-sub:#5b6470;
  --ti-line:#e3e6ea;
  --ti-bg:#f4f6f8;
  --ti-snow:#eef5fb;
  --ti-navy:#12304f;
  --ti-bar-h:84px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ti-bg);color:var(--ti-ink);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;font-size:14px;line-height:1.6}
h1,h2,h3,p,ul,dl,dd{margin:0;padding:0}
ul{list-style:none}
img{max-width:100%;height:auto;border:0}
a{color:#0b5cad}
a:hover{text-decoration:none}
.mt{margin-top:8px}

/* ---------- hero ---------- */
.ti-hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(160deg,#0f2a47 0%,#1d5a8f 60%,#7fb6e0 100%)}
.ti-hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-34px;height:76px;background:var(--ti-bg);border-radius:50% 50% 0 0}
.ti-hero__in{position:relative;z-index:1;max-width:960px;margin:0 auto;padding:16px 16px 64px}
.ti-hero.is-small .ti-hero__in{padding-bottom:54px}
.ti-logo{display:inline-block;background:#fff;border-radius:8px;padding:6px 10px;line-height:0}
.ti-logo img{height:24px;width:auto}
.ti-hero__title{font-size:22px;font-weight:900;line-height:1.35;margin-top:14px}
.ti-hero.is-small .ti-hero__title{font-size:18px}
.ti-hero__sub{font-size:12px;opacity:.85;margin-top:4px}
.ti-badge{display:inline-block;margin-top:10px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.4);border-radius:99px;font-size:11px;padding:4px 12px}
.ti-flake{position:absolute;color:rgba(255,255,255,.32);pointer-events:none}
.ti-flake.f1{right:8%;top:16px;font-size:20px}
.ti-flake.f2{right:22%;top:52px;font-size:12px}
.ti-flake.f3{right:12%;top:86px;font-size:26px}

/* ---------- layout ---------- */
.ti-main{padding:0 16px 32px}
.ti-wrap{position:relative;z-index:2;max-width:960px;margin:-34px auto 0}
.ti-wrap--narrow{max-width:640px}
.ti-main--search{padding-bottom:calc(var(--ti-bar-h) + 24px)}
.ti-topgrid{display:grid;gap:16px}
.ti-center{text-align:center}

/* ---------- card ---------- */
.ti-card{background:#fff;border-radius:14px;box-shadow:0 6px 18px rgba(15,42,71,.12);padding:16px}
.ti-card__title{font-size:15px;color:var(--ti-navy);margin-bottom:4px}

/* ---------- alert ---------- */
.ti-alert{background:#fff;border-radius:12px;box-shadow:0 6px 18px rgba(15,42,71,.12);overflow:hidden}

.ti-alert__title{background:var(--ti-red);color:#fff;font-size:14px;padding:10px 14px}
.ti-alert--dark .ti-alert__title{background:#333}
.ti-alert__list{padding:12px 14px;font-size:13px;line-height:1.75}
.ti-alert__list li{position:relative;padding-left:16px}
.ti-alert__list li + li{margin-top:8px}
.ti-alert__list li::before{content:"";position:absolute;left:0;top:.7em;width:7px;height:7px;border-radius:50%;background:var(--ti-red)}
.ti-alert__body{padding:12px 14px;font-size:13px;line-height:1.75}
.ti-alert__body p + p{margin-top:8px}
.ti-alert__body a{color:var(--ti-red);font-weight:700}

/* ---------- coupon ---------- */
.ti-coupon{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:2px dashed var(--ti-red);border-radius:12px;background:#fff6f6;padding:12px 14px}
.ti-coupon small{display:block;font-size:11px;color:var(--ti-sub)}
.ti-coupon b{font-size:22px;letter-spacing:.06em;color:var(--ti-navy)}
.ti-coupon__copy{border:0;border-radius:8px;background:var(--ti-navy);color:#fff;font:inherit;font-size:12px;padding:8px 14px;cursor:pointer;white-space:nowrap}
.ti-coupon__copy.is-done{background:#2e7d32}

/* ---------- form field（dl/dt/dd 構造は現行どおり） ---------- */
.ti-field{padding:14px 0;border-bottom:1px solid var(--ti-line)}
.ti-field:last-of-type{border-bottom:0}
.ti-field dt{font-size:13px;font-weight:700;color:var(--ti-navy);padding-left:8px;border-left:3px solid var(--ti-red);margin-bottom:8px;line-height:1.4}
.ti-req{display:inline-block;font-style:normal;background:var(--ti-red);color:#fff;font-size:10px;padding:1px 6px;border-radius:4px;margin-left:6px;vertical-align:1px}
.ti-row{display:flex;gap:8px}
.ti-row > *{flex:1;min-width:0}
.ti-row > input[type=hidden]{display:none}

.ti-field select,
.ti-field input[type=text]{
  width:100%;font:inherit;font-size:16px; /* iOSズーム防止 */
  color:var(--ti-ink);background-color:var(--ti-snow);border:1px solid transparent;border-radius:8px;
  padding:10px 12px;min-height:44px;outline:none;-webkit-appearance:none;appearance:none
}
/* ▼は選択肢の文言（現行どおり）で表示するため、CSSの矢印は付けない */
.ti-field select{cursor:pointer;text-overflow:ellipsis}
.ti-field select:focus,
.ti-field input[type=text]:focus{border-color:#1d5a8f;background-color:#fff;box-shadow:0 0 0 3px rgba(29,90,143,.15)}
.ti-field .note{font-size:11.5px;color:var(--ti-red);line-height:1.7;margin-top:6px}
.ti-hint{font-size:11.5px;color:var(--ti-sub);line-height:1.6;margin-top:6px}

.ti-agree{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px}
.ti-agree input,.ti-checks input{width:20px;height:20px;flex:none;margin:0;accent-color:var(--ti-red);cursor:pointer}

.ti-checks{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px}
.ti-checks label{display:flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.35;cursor:pointer;padding:3px 0}

/* ---------- button ---------- */
.ti-btn{
  display:block;width:100%;margin-top:16px;border:0;border-radius:12px;padding:15px;
  font:inherit;font-size:17px;font-weight:900;color:#fff;cursor:pointer;
  background:linear-gradient(90deg,var(--ti-red),var(--ti-red2));-webkit-appearance:none;appearance:none
}
.ti-btn:hover{filter:brightness(.95)}
.ti-btn:disabled{background:#bfc4ca;cursor:not-allowed;filter:none}

/* ---------- 画面下固定バー（検索） ---------- */
.ti-fixbar{position:fixed;left:0;right:0;bottom:0;z-index:100;background:#fff;border-top:1px solid var(--ti-line);box-shadow:0 -4px 14px rgba(15,42,71,.12);padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
.ti-fixbar__in{max-width:960px;margin:0 auto;display:flex;align-items:center;gap:20px;justify-content:flex-end}
.ti-fixbar__note{display:none;font-size:12px;color:var(--ti-sub);margin-right:auto}
.ti-fixbar .ti-btn{margin-top:0}

/* ---------- select2（大学生協） ---------- */
.ti-field .select2-container{width:100% !important}
.ti-field .select2-container--default .select2-selection--single{height:44px;border:1px solid transparent;border-radius:8px;background:var(--ti-snow)}
.ti-field .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:44px;padding-left:12px;padding-right:32px;font-size:15px;color:var(--ti-ink)}
.ti-field .select2-container--default .select2-selection--single .select2-selection__arrow{height:42px;right:8px}
.ti-field .select2-container--default .select2-selection--single .select2-selection__clear{display:none}
.select2-dropdown{border-color:var(--ti-line);border-radius:8px;overflow:hidden}
.select2-search--dropdown .select2-search__field{font-size:16px;padding:8px;border-radius:6px}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--ti-navy)}

/* ============================================================
   PC
   ============================================================ */
@media (min-width:768px){
  body{font-size:15px}
  .ti-hero__in{padding:22px 24px 96px}
  .ti-hero.is-small .ti-hero__in{padding-bottom:76px}
  .ti-hero::after{left:-5%;right:-5%;bottom:-60px;height:110px}
  .ti-logo{padding:8px 14px}
  .ti-logo img{height:30px}
  .ti-hero__title{font-size:34px;margin-top:24px}
  .ti-hero__title br{display:none}
  .ti-hero.is-small .ti-hero__title{font-size:26px;margin-top:18px}
  .ti-hero__sub{font-size:14px}
  .ti-badge{font-size:13px;padding:5px 14px;margin-top:14px}
  .ti-flake.f1{right:12%;top:30px;font-size:40px}
  .ti-flake.f2{right:24%;top:100px;font-size:20px}
  .ti-flake.f3{right:6%;top:140px;font-size:28px}

  .ti-main{padding:0 24px 48px}
  .ti-wrap{margin-top:-56px}
  .ti-topgrid{grid-template-columns:1fr 1.15fr;gap:24px;align-items:start}

  .ti-card{padding:26px 28px}
  .ti-card__title{font-size:17px;margin-bottom:8px}
  .ti-alert__title{font-size:15px;padding:12px 18px}
  .ti-alert__list,.ti-alert__body{padding:14px 18px;font-size:13.5px}
  .ti-coupon{padding:16px 18px}
  .ti-coupon b{font-size:28px;letter-spacing:.08em}

  /* 現行と同じ「左：項目名／右：入力」 */
  .ti-field{display:grid;grid-template-columns:190px 1fr;gap:16px;padding:16px 0}
  .ti-field dt{margin:10px 0 0;height:fit-content}
  .ti-row{gap:10px}
  .ti-field select,.ti-field input[type=text]{font-size:15px}
  .ti-checks{grid-template-columns:repeat(3,1fr);gap:8px 14px}
  .ti-checks label{font-size:13px}
  .ti-agree{min-height:44px}

  .ti-fixbar{padding:12px 24px}
  .ti-fixbar__note{display:block}
  .ti-fixbar .ti-btn{width:360px}
}

/* ---------- 追加：大学生協（店舗支払）など ---------- */
.ti-topgrid__info > * + *{margin-top:16px}
.ti-alert--navy .ti-alert__title{background:var(--ti-navy)}
.ti-cond{list-style:none;margin:10px 0 0;padding:10px 12px;background:var(--ti-snow);border-radius:8px}
.ti-cond li{display:flex;gap:6px;line-height:1.6}
.ti-cond li + li{margin-top:4px}
.ti-cond span{color:var(--ti-red);font-weight:700;flex:none}
a.ti-btn{text-align:center;text-decoration:none;font-size:15px;line-height:1.4}
.ti-btn--navy{background:var(--ti-navy)}
@media (min-width:768px){
  .ti-card--sticky{position:sticky;top:16px}
}
.ti-alert__body a.ti-btn{color:#fff}

/* ---------- 検索ページ：ご利用店舗の帯（案2） ---------- */
.ti-strip-wrap{position:relative;z-index:3;padding:0 16px;margin:-34px 0 0}
.ti-strip{max-width:960px;margin:0 auto;display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--ti-line);border-radius:99px;padding:6px 6px 6px 14px;font-size:12px;box-shadow:0 2px 8px rgba(15,42,71,.10)}
.ti-strip__lb{flex:none;color:var(--ti-sub)}
.ti-strip__nm{flex:1;min-width:0;font-weight:700;color:var(--ti-navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ti-strip__sep{color:var(--ti-line);margin:0 4px;font-weight:400}
.ti-strip__chg{flex:none;background:var(--ti-snow);color:var(--ti-navy);border-radius:99px;padding:5px 12px;font-size:11.5px;font-weight:700;text-decoration:none}
.ti-strip__chg:hover{background:#dfeaf5}
.ti-strip-wrap + .ti-form .ti-wrap{margin-top:12px}
@media (max-width:767px){
  .ti-strip__ag{display:none}                 /* スマホは店舗名を優先表示 */
  .ti-strip__ag + .ti-strip__sep{display:none}
}
@media (min-width:768px){
  .ti-strip-wrap{padding:0 24px;margin-top:-56px}
  .ti-strip{padding:8px 8px 8px 18px;font-size:13.5px}
  .ti-strip__chg{font-size:12.5px;padding:6px 16px}
  .ti-strip-wrap + .ti-form .ti-wrap{margin-top:14px}
}

/* ---------- 大学生協（店舗支払）TOP：ステップ構成 ---------- */
.ti-stack > * + *{margin-top:16px}
.ti-coupon--wide{margin-top:0;flex-direction:column;align-items:stretch;gap:10px}
.ti-coupon__lead{font-weight:700;color:var(--ti-red);font-size:13.5px;line-height:1.6}
.ti-coupon__sub{font-size:12px;color:var(--ti-sub);margin-top:2px}
.ti-coupon__code{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-radius:10px;padding:8px 12px}
.ti-step__title{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--ti-navy);line-height:1.4}
.ti-step__num{flex:none;background:var(--ti-red);color:#fff;font-size:11px;font-weight:900;letter-spacing:.05em;border-radius:6px;padding:3px 8px}
.ti-step__lead{margin-top:12px;font-weight:700;font-size:14px}
.ti-choice{display:grid;gap:12px;margin-top:14px}
.ti-choice__item{border:1px solid var(--ti-line);border-radius:12px;padding:14px;display:flex;flex-direction:column}
.ti-choice__item.is-main{border-color:#f3c2c7;background:#fff8f8}
.ti-choice__q{font-size:14px}
.ti-choice__q b{font-size:16px;color:var(--ti-red)}
.ti-choice__item:first-child .ti-choice__q b{color:var(--ti-navy)}
.ti-choice__a{font-size:12.5px;line-height:1.7;margin:6px 0 auto;color:var(--ti-ink)}
.ti-choice .ti-btn{margin-top:12px}
.ti-btn--line{background:#fff;color:var(--ti-red);border:2px solid var(--ti-red)}
a.ti-btn--line{color:var(--ti-red)}
.ti-step2__note{margin-top:14px;background:var(--ti-bg);border-radius:12px;padding:14px}
.ti-step2__note h3{font-size:13.5px;color:var(--ti-navy);margin-bottom:8px}
.ti-step2__note .ti-alert__list{padding:0;font-size:12.5px}
.ti-step2__note strong{color:var(--ti-red)}
html{scroll-behavior:smooth}
#store-form{scroll-margin-top:12px}
@media (min-width:768px){
  .ti-coupon--wide{flex-direction:row;align-items:center;padding:16px 20px}
  .ti-coupon__txt{flex:1}
  .ti-coupon__code{flex:none;min-width:280px;padding:10px 16px}
  .ti-step__title{font-size:19px}
  .ti-choice{grid-template-columns:1fr 1fr;gap:16px}
  .ti-choice__item{padding:18px 20px}
  .ti-step2{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:start;margin-top:6px}
  .ti-step2__note{margin-top:16px}
}
.ti-field select:disabled{opacity:.55;cursor:not-allowed}