/* この町で1年（/ichinen/）。paper.css は運営者のPCで作るファイルなので、この画面の見た目はここに分けて置く */
.pg-ic .ic{max-width:860px;margin:0 auto;padding:0 16px 48px}
.pg-ic h1,.pg-ic h2{font-family:var(--f-head);font-weight:800}
.ic-intro{background:var(--paper);border:1.5px solid var(--ink);box-shadow:var(--shadow);padding:22px 24px;margin:18px 0}
.ic-intro h1,.ic-intro .ic-h1{margin:0 0 10px;font-size:32px}
.ic-intro p{line-height:1.9}
.ic-load{padding:40px 0;text-align:center;color:#4A5657}
.ic-btn{margin:14px 0 0}
.ic-go{display:inline-block;padding:10px 18px;background:#2E6E73;color:#fff;font-weight:700;text-decoration:none;font-family:var(--f-label)}
.ic-go:hover{background:#245a5e}
.ic-go.ic-sub{background:transparent;color:#2E6E73;border:1.5px solid #2E6E73}

/* 見出し */
.ic-head{position:relative;background:var(--paper);border:1.5px solid var(--ink);box-shadow:var(--shadow);padding:26px 26px 18px;margin:20px 0 26px}
.ic-kick{margin:0;font-family:var(--f-label);font-weight:700;color:var(--pen);letter-spacing:.08em;font-size:14px}
.ic-head .ic-h1{margin:4px 0 8px;font-size:40px;line-height:1.2}
.ic-head .ic-h1 small{font-size:16px;margin-left:10px;color:#4A5657;font-family:var(--f-body);font-weight:400}
.ic-lead{margin:0;line-height:1.85;font-size:14.5px;color:#2B3738}
.ic-ans{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0}
.ic-ans li{font-size:12.5px;border:1px solid #B9AE97;padding:1px 8px;background:#F4ECDB}
.ic-ans li.h{border:0;background:none;padding-left:0;color:#4A5657}

/* 月のカード */
.ic-months{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.ic-m{background:var(--paper);background-image:repeating-linear-gradient(var(--paper) 0 33px,#EDE5D3 33px 34px);border:1.5px solid var(--ink);box-shadow:3px 4px 0 rgba(35,48,47,.14);padding:14px 20px 12px;transform:rotate(var(--rot,0deg))}
.ic-mh{display:flex;align-items:baseline;gap:4px;flex-wrap:wrap;margin:0 0 6px;border-bottom:1.5px solid var(--ink);padding-bottom:6px}
.ic-mh b{font-family:var(--f-num);font-size:38px;line-height:1;color:var(--pen)}
.ic-mh span{font-size:18px;margin-right:8px}
.ic-mh em{font-style:normal;font-size:19px}
.ic-mh small{margin-left:auto;font-family:var(--f-body);font-weight:400;font-size:12px;color:#5d6667}
.ic-l{list-style:none;margin:0;padding:0}
.ic-l li{padding:8px 0;border-bottom:1px dashed #D9CFBC}
.ic-l li:last-child{border-bottom:0}
.ic-l p{margin:0;line-height:1.85;font-size:15px}
.ic-l b{font-family:var(--f-num);font-weight:700}
.ic-l small{display:block;font-size:11.5px;color:#5d6667;margin-top:2px}
.ic-a{display:inline-block;font-size:11.5px;font-weight:700;color:var(--pen);border:1.5px solid var(--pen);padding:0 7px;margin-bottom:4px;transform:rotate(-1.5deg)}
.ic-bonae{margin:8px 0 2px;padding:8px 12px;background:#EEF3EF;border-left:3px solid #2E6E73;font-size:14px;line-height:1.8}
.ic-bonae b{color:#2E6E73}
.ic-bonae a{color:#2E6E73}

/* はがき */
.ic-hagaki{margin:34px 0 10px}
.hg-card{position:relative;background:#FFFCF3;border:1.5px solid var(--ink);box-shadow:var(--shadow);padding:26px 28px 20px;aspect-ratio:auto}
.hg-card h2{margin:0;font-size:16px;color:#4A5657;font-family:var(--f-label)}
.hg-to{font-family:var(--f-head);font-weight:800;font-size:24px;margin:6px 120px 12px 0;line-height:1.4}
.hg-kitte{position:absolute;right:22px;top:20px;width:80px;height:92px;border:2px dashed var(--pen);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--pen);font-family:var(--f-head);font-size:15px;line-height:1.3}
.hg-keshi{position:absolute;right:76px;top:78px;width:74px;height:74px;border:2px solid rgba(35,48,47,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;color:rgba(35,48,47,.65);transform:rotate(-12deg);background:rgba(255,252,243,.4)}
.hg-list{margin:0;padding:0 0 0 1.6em;font-size:18px;line-height:1.7}
.hg-list li{border-bottom:1.5px solid #D9CFBC;padding:6px 0;font-weight:700}
.hg-list li::marker{color:var(--pen);font-family:var(--f-num)}
.hg-sign{margin:12px 0 0;text-align:right;font-size:13px;color:#4A5657}
.ic-btns{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.ic-btns button,.ic-btns a{font:inherit;font-size:14px;font-weight:700;padding:9px 14px;border:1.5px solid var(--ink);background:#FFFCF3;color:var(--ink);cursor:pointer;text-decoration:none}
.ic-btns .btn-x{background:#23302F;color:#fff}

.ic-next{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:26px 0}
.ic-src{margin:30px 0 0;font-size:13px;color:#4A5657;line-height:1.8;border-top:1.5px solid var(--ink);padding-top:10px}
.ic-src h2{font-size:16px;margin:0 0 6px;color:var(--ink)}
.ic-src ul{padding-left:1.2em;margin:6px 0}
.ic-src summary{cursor:pointer;color:#2E6E73;font-weight:700}

@media (max-width:600px){
  .ic-head{padding:20px 16px 14px}
  .ic-head .ic-h1{font-size:30px}
  .ic-m{padding:12px 14px 10px;transform:none}
  .ic-mh b{font-size:32px}
  .hg-card{padding:20px 16px 16px}
  .hg-to{font-size:20px;margin-right:84px}
  .hg-kitte{width:62px;height:72px;font-size:12px;right:14px;top:14px}
  .hg-keshi{width:64px;height:64px;right:46px;top:66px;font-size:8.5px;letter-spacing:-.02em}
  .hg-list{font-size:16px}
}
/* 町の名前で選ぶ（見本の町のとき）。DESIGN.md「サイト内の動線」 */
.ic-pick{margin:12px 0 4px}.ic-pick-h{margin:0 0 6px;font-size:14px;font-weight:700}
.ic-pick .search{max-width:460px}.ic-pick .search-bar svg{width:22px;height:22px;flex:none}.ic-pick .search-results{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:20}
