/*
 * baikai-tool-v1.0.0.css
 * 媒介契約の見直し判定ツールの見た目。**子テーマ（cocoon-child-master）に置く。**
 * 配置先: /wp-content/themes/cocoon-child-master/baikai-tool-v1.0.0.css
 *
 * すべて #baikai-tool の中だけに効かせる。
 * 配色は行政処分ツール（shobun-tool）と揃えてある。
 */
#baikai-tool{
  --bk-g900:#085041; --bk-g700:#0F6E56; --bk-g500:#1D9E75; --bk-g100:#9FE1CB; --bk-g050:#f0faf5;
  --bk-ink:#333; --bk-ink2:#555; --bk-ink3:#888; --bk-line:#e5e5e5;
  --bk-warn:#B45309; --bk-warnbg:#FFFBEB; --bk-warnline:#FCD34D;
  --bk-alert:#991B1B; --bk-alertbg:#FEF2F2; --bk-alertline:#FECACA;
  max-width:760px;margin:0 auto;line-height:1.8;color:var(--bk-ink);
}
#baikai-tool *{box-sizing:border-box}

#baikai-tool .bk-hero{background:linear-gradient(160deg,var(--bk-g900) 0%,var(--bk-g500) 100%);
  border-radius:10px;padding:2.25rem 1.5rem;margin-bottom:1.5rem;text-align:center;color:#fff}
#baikai-tool .bk-hero .bk-eyebrow{font-size:13px;font-weight:600;color:var(--bk-g100);letter-spacing:.15em;margin:0 0 .75rem}
#baikai-tool .bk-hero .bk-h1{font-size:23px;font-weight:700;margin:0 0 .75rem;line-height:1.5;color:#fff}
#baikai-tool .bk-hero p{font-size:13.5px;color:#E1F5EE;margin:0}

#baikai-tool .bk-form{background:#fff;border:1px solid var(--bk-line);border-radius:10px;padding:1.25rem;
  margin-bottom:1rem;box-shadow:0 1px 3px rgba(0,0,0,.04)}
#baikai-tool .bk-q{padding:.9rem 0;border-bottom:1px solid #f0f0f0}
#baikai-tool .bk-q:last-child{border-bottom:none;padding-bottom:0}
#baikai-tool .bk-q > .bk-label{display:block;font-size:14px;font-weight:600;color:var(--bk-g700);margin-bottom:.15rem}
#baikai-tool .bk-note{font-size:12px;color:var(--bk-ink3);margin:0 0 .5rem;line-height:1.7}
#baikai-tool .bk-opts{display:flex;flex-wrap:wrap;gap:.4rem}
#baikai-tool .bk-opts label{display:inline-flex;align-items:center;gap:.35rem;font-size:13.5px;
  border:1px solid var(--bk-line);border-radius:999px;padding:.38rem .8rem;cursor:pointer;background:#fff;color:var(--bk-ink2)}
#baikai-tool .bk-opts label:hover{background:var(--bk-g050)}
#baikai-tool .bk-opts input{margin:0;accent-color:var(--bk-g500)}
#baikai-tool .bk-opts input:checked + span{font-weight:700;color:var(--bk-g700)}
/* font-size は16px以上。下回るとiOSが勝手に拡大する */
#baikai-tool input[type=date]{font-size:16px;padding:.5rem .7rem;border:1px solid var(--bk-line);
  border-radius:8px;font-family:inherit;color:var(--bk-ink);background:#fff;max-width:100%}
#baikai-tool .bk-disabled{opacity:.45;pointer-events:none}

#baikai-tool .bk-run{display:block;width:100%;margin-top:1rem;padding:.85rem;font-size:15px;font-weight:700;
  color:#fff;background:var(--bk-g500);border:none;border-radius:8px;cursor:pointer;font-family:inherit}
#baikai-tool .bk-run:hover{background:var(--bk-g700)}
#baikai-tool .bk-run[disabled]{background:#ccc;cursor:not-allowed}

#baikai-tool .bk-result{margin-top:1.25rem}
#baikai-tool .bk-verdict{border-radius:10px;padding:1.25rem 1.35rem;margin-bottom:1rem}
#baikai-tool .bk-verdict.lv1{background:var(--bk-g050);border:1px solid var(--bk-g100)}
#baikai-tool .bk-verdict.lv2{background:var(--bk-warnbg);border:1px solid var(--bk-warnline)}
#baikai-tool .bk-verdict.lv3{background:var(--bk-alertbg);border:1px solid var(--bk-alertline)}
#baikai-tool .bk-verdict .bk-vt{font-size:17px;font-weight:700;margin:0 0 .5rem}
#baikai-tool .bk-verdict.lv1 .bk-vt{color:var(--bk-g700)}
#baikai-tool .bk-verdict.lv2 .bk-vt{color:var(--bk-warn)}
#baikai-tool .bk-verdict.lv3 .bk-vt{color:var(--bk-alert)}
#baikai-tool .bk-verdict p{font-size:13.5px;margin:0 0 .5rem;color:var(--bk-ink2)}
#baikai-tool .bk-verdict p:last-child{margin-bottom:0}

#baikai-tool .bk-term{background:#fff;border:1px solid var(--bk-line);border-radius:8px;padding:1rem 1.1rem;margin-bottom:1rem}
#baikai-tool .bk-term .bk-tt{font-size:14px;font-weight:700;color:var(--bk-g700);margin:0 0 .5rem}
#baikai-tool .bk-term .bk-big{font-size:19px;font-weight:700;color:var(--bk-ink)}
#baikai-tool .bk-term p{font-size:13px;margin:.4rem 0 0;color:var(--bk-ink2)}

#baikai-tool .bk-item{background:#fff;border:1px solid var(--bk-line);border-left-width:4px;
  border-radius:0 8px 8px 0;padding:.9rem 1.1rem;margin-bottom:.6rem}
#baikai-tool .bk-item.s3{border-left-color:var(--bk-alertline)}
#baikai-tool .bk-item.s2{border-left-color:var(--bk-warnline)}
#baikai-tool .bk-item.s1{border-left-color:var(--bk-g100)}
#baikai-tool .bk-item .bk-it{font-size:14px;font-weight:700;margin:0 0 .35rem;color:var(--bk-ink)}
#baikai-tool .bk-item p{font-size:13px;margin:0 0 .4rem;color:var(--bk-ink2)}
#baikai-tool .bk-item .bk-law{font-size:12px;color:var(--bk-ink3);margin:0 0 .4rem}
#baikai-tool .bk-item a{font-size:13px;color:var(--bk-g500);font-weight:600;text-decoration:none}
#baikai-tool .bk-item a:hover{text-decoration:underline}

#baikai-tool .bk-next{background:var(--bk-g050);border:1px solid var(--bk-g100);border-radius:10px;
  padding:1.25rem 1.35rem;margin-top:1.25rem}
#baikai-tool .bk-next .bk-nt{font-size:16px;font-weight:700;color:var(--bk-g700);margin:0 0 .6rem}
#baikai-tool .bk-next p{font-size:13.5px;margin:0 0 .6rem;color:var(--bk-ink2)}
#baikai-tool .bk-next ol{font-size:13.5px;margin:.5rem 0 0;padding-left:1.3rem;color:var(--bk-ink2)}
#baikai-tool .bk-next li{margin-bottom:.5rem}
#baikai-tool .bk-next a{color:var(--bk-g500);font-weight:600;text-decoration:none}
#baikai-tool .bk-next a:hover{text-decoration:underline}

#baikai-tool .bk-foot{font-size:12px;color:var(--bk-ink3);margin-top:1.25rem;line-height:1.9}

@media (max-width:600px){
  #baikai-tool .bk-hero{padding:1.75rem 1.1rem}
  #baikai-tool .bk-hero .bk-h1{font-size:20px}
  #baikai-tool .bk-opts label{font-size:13px;padding:.35rem .7rem}
}
