/* 朝凪農園（架空）— Web工房Pono 自主制作 */
:root { --bg: #FFFDF7; --cream: #FBF3E3; --leaf: #EAF2E6; --or: #F28C28; --or-d: #DB7414; --g: #2F6B4F; --ink: #263229; --sub: #64706A; --mute: #A2AAA5; --line: rgba(38,50,41,.13);
  --km: "Kiwi Maru", serif; --jp: "Noto Sans JP", sans-serif; --en: "DM Serif Display", serif; --ease: cubic-bezier(.22,.7,.2,1); }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--jp); font-size: 15.5px; line-height: 1.95; letter-spacing: .04em; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; } a { color: inherit; text-decoration: none; }
h1, h2, h3 { font-family: var(--km); font-weight: 500; line-height: 1.55; margin: 0; letter-spacing: .06em; }
p { margin: 0; } ul, ol, dl, dd, fieldset { margin: 0; padding: 0; list-style: none; border: 0; }
button, input, select { font: inherit; color: inherit; } svg { display: block; }
.wrap { width: min(1180px, calc(100% - 56px)); margin: 0 auto; }
.narrow { max-width: 760px; } .narrow p + p { margin-top: 1.3em; }
.demo-bar { background: var(--g); color: rgba(255,255,255,.85); font-size: 12px; text-align: center; padding: 7px 14px; line-height: 1.6; }
.demo-bar a { text-decoration: underline; margin-left: 6px; }
.note { margin-top: 12px; font-size: 12.5px; color: var(--mute); }
.lbl { font-family: var(--km); margin: 6px 0 4px; }
.lead { font-size: clamp(23px, 2.5vw, 31px); margin-bottom: 22px; }
.sign { text-align: right; font-family: var(--km); margin-top: 20px; }

.btn { display: inline-flex; align-items: center; justify-content: center; height: 54px; padding: 0 30px; border-radius: 999px; border: 2px solid var(--ink); background: transparent; font-family: var(--km); font-size: 15.5px; letter-spacing: .08em; cursor: pointer; transition: transform .3s var(--ease), background .3s, box-shadow .3s; }
.btn:hover { transform: translateY(-3px); }
.btn--or { background: var(--or); border-color: var(--or); color: #fff; box-shadow: 0 10px 0 -4px var(--or-d); }
.btn--or:hover { box-shadow: 0 13px 0 -4px var(--or-d); }
.btn--g { background: var(--g); border-color: var(--g); color: #fff; }
.btn--w { background: #fff; border-color: #fff; }
.btn--line { border-color: var(--g); color: var(--g); }
.btn--full { width: 100%; }
.btn:disabled { opacity: .35; transform: none; cursor: default; }

.hd { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 26px; height: 78px; padding: 0 28px; background: rgba(255,253,247,.92); backdrop-filter: blur(10px); }
.lg { display: flex; align-items: center; gap: 10px; }
.lg__m { width: 46px; height: 46px; }
.lg b { display: block; font-family: var(--km); font-size: 22px; letter-spacing: .16em; line-height: 1.15; }
.lg small { display: block; font-family: var(--en); font-size: 11px; letter-spacing: .18em; color: var(--g); }
.hd__nav { display: flex; gap: 24px; margin-left: auto; font-family: var(--km); font-size: 14.5px; }
.hd__nav a { padding: 6px 2px; border-bottom: 2px solid transparent; transition: .3s; }
.hd__nav a:hover, .hd__nav a.is-cur { border-color: var(--or); }
.hd__cta { height: 46px; display: inline-flex; align-items: center; padding: 0 22px; border-radius: 999px; background: var(--or); color: #fff; font-family: var(--km); }
.mb, .dr { display: none; }

.hero { position: relative; height: calc(100svh - 109px); min-height: 580px; max-height: 920px; overflow: hidden; }
.hero > img { width: 100%; height: 100%; object-fit: cover; animation: kb 20s ease-out both; }
@keyframes kb { from { transform: scale(1.1) translateY(2%); } to { transform: none; } }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,30,24,.35), transparent 40%, rgba(20,30,24,.45)); }
.hero__c { position: absolute; z-index: 2; left: 6vw; bottom: 12vh; color: #fff; }
.hero__en { font-family: var(--en); font-style: italic; font-size: 20px; color: #FFE3B8; }
.hero h1 { margin-top: 8px; font-size: clamp(32px, 4.2vw, 58px); text-shadow: 0 4px 24px rgba(0,0,0,.3); }
.hero__btns { display: flex; gap: 12px; margin-top: 30px; flex-wrap: wrap; }
.hero__now { position: absolute; z-index: 2; right: 4vw; top: 6vh; width: 250px; padding: 20px 22px; border-radius: 26px; background: rgba(255,253,247,.94); box-shadow: 0 20px 40px -20px rgba(0,0,0,.4); }
.hero__now p { display: flex; justify-content: space-between; align-items: baseline; font-size: 12.5px; color: var(--sub); }
.hero__now b { font-family: var(--en); font-size: 28px; color: var(--g); }
.hero__now ul { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.hero__now li { font-size: 13px; padding: 3px 12px; border-radius: 99px; background: var(--leaf); color: var(--g); }

.sec { padding: clamp(80px, 10vw, 130px) 0; }
.sec--t { padding-top: 24px; }
.sec--leaf { background: var(--leaf); }
.sec--cream { background: var(--cream); }
.st { margin-bottom: 40px; }
.st__en { font-family: var(--en); font-style: italic; font-size: 20px; color: var(--or-d); }
.st h2 { margin-top: 4px; font-size: clamp(25px, 2.8vw, 34px); }
.st__l { margin-top: 10px; color: var(--sub); }

.numbers { padding: 70px 0; }
.nb { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.nb > div { padding: 30px; border-radius: 30px; background: var(--cream); text-align: center; }
.nb b { font-family: var(--en); font-size: 64px; color: var(--or-d); line-height: 1; }
.nb span { font-family: var(--km); margin-left: 4px; }
.nb p { margin-top: 10px; font-size: 14px; color: var(--sub); line-height: 1.7; }
.nb small { display: block; font-size: 11.5px; color: var(--mute); }

.teiki-t { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.teiki-t__img img { border-radius: 40px; aspect-ratio: 4 / 3; object-fit: cover; }
.teiki-t h2 { margin-top: 4px; font-size: clamp(25px, 2.8vw, 34px); }
.teiki-t p:not(.st__en) { margin-top: 16px; color: var(--sub); }
.ticks { margin: 20px 0 28px; display: grid; gap: 8px; }
.ticks li { display: flex; gap: 10px; align-items: center; font-family: var(--km); }
.ticks li::before { content: "✓"; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--g); color: #fff; font-size: 12px; flex: none; }

/* 旬カレンダー */
.sea { display: grid; grid-template-columns: 1.1fr .9fr; gap: 30px; align-items: stretch; }
.sea__m { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.sea__m button { display: flex; align-items: baseline; justify-content: center; gap: 2px; padding: 18px 0; border-radius: 20px; border: 2px solid var(--line); background: #fff; cursor: pointer; font-family: var(--km); transition: .25s; }
.sea__m b { font-family: var(--en); font-size: 30px; font-weight: 400; }
.sea__m button.is-now { border-color: var(--or); }
.sea__m button.is-on { background: var(--g); color: #fff; border-color: var(--g); }
.sea__b { background: var(--leaf); border-radius: 30px; padding: 30px; }
.sea__t { font-family: var(--km); font-size: 18px; }
.sea__t b { font-family: var(--en); font-size: 40px; color: var(--g); margin-right: 2px; }
.sea__b ul { margin-top: 16px; display: grid; gap: 10px; }
.sea__b li { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 16px; background: #fff; font-family: var(--km); animation: pop .4s var(--ease) both; }
.sea__b li:nth-child(2) { animation-delay: .05s; } .sea__b li:nth-child(3) { animation-delay: .1s; } .sea__b li:nth-child(4) { animation-delay: .15s; }
.sea__b li::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--or); }
@keyframes pop { from { opacity: 0; transform: translateX(10px); } }
.sea__note { margin-top: 14px; font-size: 13px; color: var(--g); }
.sea--c .sea__m button { padding: 12px 0; } .sea--c .sea__m b { font-size: 24px; }
.bar { margin-top: 60px; }
.bar__r { display: grid; grid-template-columns: 110px 1fr; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--line); }
.bar__r span { font-family: var(--km); font-size: 14px; }
.bar__r div { position: relative; height: 18px; }
.bar__r i { position: absolute; top: 0; bottom: 0; left: calc((var(--s) - 1) / 12 * 100%); width: calc((var(--e) - var(--s)) / 12 * 100%); border-radius: 99px; background: var(--or); }
.bar__m { display: grid; grid-template-columns: 110px repeat(12, 1fr); font-family: var(--en); color: var(--mute); text-align: center; font-size: 14px; padding-top: 8px; }

/* 商品 */
.ig { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.ic { display: block; }
.ic__img { position: relative; aspect-ratio: 1; border-radius: 30px; overflow: hidden; }
.ic__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.ic:hover .ic__img img { transform: scale(1.06); }
.ic__img span { position: absolute; left: 12px; top: 12px; font-size: 12px; padding: 3px 12px; border-radius: 99px; background: #fff; color: var(--g); }
.ic h3 { margin-top: 14px; font-size: 17px; }
.ic__sub { font-size: 12.5px; color: var(--sub); }
.ic__p { margin-top: 4px; font-family: var(--en); font-size: 22px; }
.ic__p small { font-family: var(--jp); font-size: 11px; color: var(--sub); margin-left: 6px; }

.pick-band { position: relative; min-height: 560px; display: flex; align-items: center; overflow: hidden; }
.pick-band > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pick-band__c { position: relative; margin-left: 6vw; width: min(430px, 88%); background: rgba(255,253,247,.96); border-radius: 36px; padding: 40px 36px; }
.pick-band__c h2 { margin-top: 4px; font-size: clamp(25px, 2.8vw, 34px); }
.pick-band__c p:not(.st__en) { margin: 12px 0 26px; color: var(--sub); }

.story-t { display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; align-items: center; }
.story-t h2 { margin-top: 4px; font-size: clamp(25px, 2.8vw, 34px); }
.story-t p:not(.st__en) { margin: 16px 0 26px; color: var(--sub); }
.story-t__img { display: grid; grid-template-columns: 1.3fr 1fr; gap: 16px; align-items: end; }
.story-t__img img { border-radius: 30px; object-fit: cover; aspect-ratio: 4 / 5; }
.story-t__img img + img { aspect-ratio: 1; margin-bottom: 40px; }

.ft { background: var(--g); color: rgba(255,255,255,.82); padding: 56px 0 34px; font-size: 13.5px; }
.ft__in { width: min(1180px, calc(100% - 56px)); margin: 0 auto; display: flex; justify-content: space-between; gap: 30px; }
.ft .lg b { color: #fff; } .ft .lg small { color: #CFE5D7; }
.ft__in p { margin-top: 16px; }
.ft nav { display: grid; grid-template-columns: repeat(2, auto); gap: 6px 36px; align-content: start; }
.ft__c { width: min(1180px, calc(100% - 56px)); margin: 30px auto 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.2); font-size: 12px; }
.ft__c a { text-decoration: underline; }

/* 下層 */
.ph { padding: 70px 0 40px; }
.ph h1 { margin-top: 4px; font-size: clamp(30px, 3.4vw, 44px); }
.ph__l { margin-top: 14px; color: var(--sub); max-width: 640px; }
.ph--img { position: relative; height: 380px; padding: 0; display: flex; align-items: flex-end; color: #fff; }
.ph--img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ph--img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,30,24,.55), transparent 60%); }
.ph--img .wrap { position: relative; z-index: 1; padding-bottom: 40px; }
.ph--img .st__en { color: #FFE3B8; }

/* 定期便 */
.tk { display: grid; grid-template-columns: 1fr 380px; gap: 48px; align-items: start; }
.tk__f fieldset { padding: 26px 0; border-bottom: 1px dashed var(--line); }
.tk__f legend { float: left; width: 100%; display: flex; align-items: center; gap: 12px; font-family: var(--km); font-size: 19px; margin-bottom: 16px; }
.tk__f legend + * { clear: both; }
.tk__f legend b { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--or); color: #fff; font-family: var(--en); font-weight: 400; }
.cos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.co, .seg, .tags label { cursor: pointer; }
.co input, .seg input, .tags input { position: absolute; opacity: 0; }
.co span { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 20px 18px; border-radius: 24px; border: 2px solid var(--line); background: #fff; transition: .25s; }
.co em { font-style: normal; font-family: var(--km); font-size: 17px; }
.co b { font-family: var(--en); font-weight: 400; font-size: 30px; color: var(--or-d); }
.co b small { font-family: var(--jp); font-size: 12px; color: var(--sub); }
.co i { font-style: normal; font-size: 12.5px; color: var(--g); font-weight: 700; }
.co span > small { font-size: 12.5px; color: var(--sub); line-height: 1.6; }
.co input:checked + span { border-color: var(--or); background: #FFF6EB; box-shadow: 0 8px 0 -3px var(--or); transform: translateY(-3px); }
.segs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.segs--7 { grid-template-columns: repeat(7, 1fr); gap: 6px; }
.seg span { display: block; text-align: center; padding: 14px 0; border-radius: 18px; border: 2px solid var(--line); background: #fff; font-family: var(--km); transition: .2s; }
.seg input:checked + span { background: var(--g); color: #fff; border-color: var(--g); }
.tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tags span { display: inline-block; padding: 8px 16px; border-radius: 99px; border: 2px solid var(--line); background: #fff; font-size: 14px; transition: .2s; }
.tags input:checked + span { background: #C9543A; color: #fff; border-color: #C9543A; text-decoration: line-through; }
.chk { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.chk input { width: 19px; height: 19px; accent-color: var(--or); }
.tk__s { position: sticky; top: 100px; background: #fff; border-radius: 32px; padding: 30px 28px; box-shadow: 0 24px 50px -36px rgba(38,50,41,.6); border: 2px solid var(--cream); }
.tk__st { font-family: var(--km); color: var(--sub); font-size: 13px; }
.tk__n { font-family: var(--km); font-size: 20px; }
.tk__m { margin-top: 14px; font-size: 13px; color: var(--sub); }
.tk__p b { font-family: var(--en); font-weight: 400; font-size: 54px; color: var(--or-d); line-height: 1.1; }
.tk__p span { font-family: var(--km); }
.tk__per { font-size: 13px; color: var(--sub); }
.tk__next { margin: 18px 0; padding: 16px 18px; border-radius: 20px; background: var(--leaf); }
.tk__next p { font-size: 12.5px; color: var(--g); }
.tk__next b { font-family: var(--km); font-size: 19px; font-weight: 500; }
.tk__nx { margin-top: 4px; font-size: 12px !important; color: var(--sub) !important; }
.tk__in { font-family: var(--km); font-size: 14px; }
.tk__items { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 20px; }
.tk__items li { font-size: 12.5px; padding: 3px 12px; border-radius: 99px; background: var(--cream); }
.tk__items li.is-x { text-decoration: line-through; opacity: .5; }

/* お取り寄せ */
.pds { display: grid; gap: 40px; }
.pd { display: grid; grid-template-columns: .9fr 1.1fr; gap: 44px; align-items: center; padding: 30px; border-radius: 40px; background: #fff; box-shadow: 0 24px 50px -40px rgba(38,50,41,.6); scroll-margin-top: 100px; }
.pd__img { position: relative; border-radius: 30px; overflow: hidden; aspect-ratio: 4 / 3; }
.pd__img img { width: 100%; height: 100%; object-fit: cover; }
.pd__img span { position: absolute; left: 14px; top: 14px; font-size: 12.5px; padding: 3px 14px; border-radius: 99px; background: #fff; color: var(--g); }
.pd h2 { font-size: 24px; }
.pd h2 small { display: block; font-family: var(--jp); font-size: 13px; color: var(--sub); }
.pd p { margin-top: 12px; color: var(--sub); font-size: 14.5px; }
.pd__opt { display: grid; gap: 8px; margin: 18px 0 12px; }
.pd__opt label { cursor: pointer; } .pd__opt input { position: absolute; opacity: 0; }
.pd__opt span { display: block; padding: 12px 18px; border-radius: 18px; border: 2px solid var(--line); font-size: 14.5px; transition: .2s; }
.pd__opt em { font-style: normal; color: var(--or-d); font-size: 13px; }
.pd__opt input:checked + span { border-color: var(--g); background: var(--leaf); }
.pd__f { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; flex-wrap: wrap; }
.pd__p b { font-family: var(--en); font-weight: 400; font-size: 34px; }
.pd__p small { display: block; font-size: 11.5px; color: var(--sub); }

/* いちご狩り */
.ig2 { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: start; }
.ig2 > div p { color: var(--sub); }
.tbl { width: 100%; border-collapse: collapse; margin-top: 24px; }
.tbl th, .tbl td { padding: 12px 8px; border-bottom: 1px dashed var(--line); text-align: left; font-weight: 400; font-size: 14.5px; }
.tbl thead th { font-size: 12.5px; color: var(--sub); }
.tbl td { font-family: var(--en); font-size: 19px; }
.rsv { background: #fff; border-radius: 36px; padding: 32px; box-shadow: 0 24px 50px -36px rgba(38,50,41,.6); display: grid; gap: 14px; }
.rsv__t { font-family: var(--km); font-size: 20px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; }
.rsv__t small { font-family: var(--jp); font-size: 12px; color: var(--mute); }
.cal__h { display: flex; justify-content: space-between; align-items: center; font-family: var(--km); }
.cal__h button { width: 38px; height: 38px; border-radius: 50%; border: 2px solid var(--line); background: #fff; cursor: pointer; }
.cal table { width: 100%; border-collapse: collapse; text-align: center; margin-top: 8px; }
.cal th { font-size: 12px; color: var(--mute); font-weight: 400; padding: 4px; }
.cal td { padding: 2px; }
.cal td button { width: 100%; aspect-ratio: 1; max-height: 52px; border-radius: 14px; border: 0; background: var(--leaf); cursor: pointer; font-family: var(--en); font-size: 15px; line-height: 1.1; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: .2s; }
.cal td button i { font-style: normal; font-family: var(--jp); font-size: 11px; color: var(--g); }
.cal td button.few i { color: var(--or-d); }
.cal td button:disabled { background: transparent; color: var(--mute); cursor: default; }
.cal td button:disabled i { color: var(--mute); }
.cal td button.is-on { background: var(--or); color: #fff; } .cal td button.is-on i { color: #fff; }
.slots { display: flex; flex-wrap: wrap; gap: 8px; }
.slots button { height: 44px; padding: 0 16px; border-radius: 99px; border: 2px solid var(--line); background: #fff; cursor: pointer; font-family: var(--en); font-size: 16px; }
.slots button small { font-family: var(--jp); font-size: 11px; color: var(--or-d); margin-left: 4px; }
.slots button.is-on { background: var(--g); color: #fff; border-color: var(--g); }
.slots button:disabled { opacity: .35; text-decoration: line-through; cursor: default; }
.hint { color: var(--mute); font-size: 13px; }
.ppl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.ppl label { display: grid; gap: 4px; font-size: 12.5px; color: var(--sub); }
select { height: 50px; padding: 0 14px; border-radius: 16px; border: 2px solid var(--line); background: #fff; font-size: 15px; width: 100%; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2364706A' stroke-width='1.6' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 11px; }
.rsv__sum { text-align: right; font-family: var(--km); }
.rsv__sum b { font-family: var(--en); font-size: 36px; color: var(--or-d); font-weight: 400; margin-left: 6px; }
.rsv__sum small { display: block; font-family: var(--jp); font-size: 12px; color: var(--mute); }

.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: rgba(20,30,24,.5); padding: 20px; }
.modal[hidden] { display: none; }
.modal__b { background: var(--bg); border-radius: 32px; padding: 36px 30px; max-width: 450px; text-align: center; animation: up .4s var(--ease); }
@keyframes up { from { opacity: 0; transform: translateY(14px); } }
.modal__t { font-family: var(--km); font-size: 20px; }
.modal__d { margin: 12px 0 24px; color: var(--sub); font-size: 14.5px; }
.toast { position: fixed; left: 50%; bottom: 30px; z-index: 90; transform: translate(-50%, 20px); opacity: 0; background: var(--g); color: #fff; padding: 12px 22px; border-radius: 999px; font-size: 14px; transition: .4s var(--ease); pointer-events: none; }
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }

.rv { opacity: 0; transform: translateY(26px); transition: opacity 1s var(--ease), transform 1s var(--ease); }
.rv.is-in { opacity: 1; transform: none; }
.rv-d1 { transition-delay: .12s; } .rv-d2 { transition-delay: .24s; }
@media (prefers-reduced-motion: reduce) { .rv { opacity: 1; transform: none; transition: none; } .hero > img { animation: none; } }

@media (max-width: 1080px) {
  .hd__nav { display: none; } .hd__cta { margin-left: auto; }
  .mb { display: flex; flex-direction: column; justify-content: center; gap: 7px; width: 46px; height: 46px; border: 0; background: none; padding: 0 11px; cursor: pointer; }
  .mb i { display: block; height: 2px; border-radius: 2px; background: var(--ink); transition: .3s; }
  .is-open .mb i:first-child { transform: translateY(4.5px) rotate(45deg); } .is-open .mb i:last-child { transform: translateY(-4.5px) rotate(-45deg); }
  .dr { display: flex; flex-direction: column; justify-content: center; position: fixed; inset: 0; z-index: 40; background: var(--bg); padding: 100px 30px 40px; opacity: 0; visibility: hidden; transition: .4s; }
  .is-open .dr { opacity: 1; visibility: visible; }
  .dr a { display: block; padding: 14px 0; border-bottom: 1px dashed var(--line); font-family: var(--km); font-size: 22px; }
  .dr small { display: block; font-family: var(--en); font-style: italic; font-size: 14px; color: var(--or-d); }
  .ig { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk { grid-template-columns: 1fr; } .tk__s { position: static; }
}
@media (max-width: 760px) {
  body { font-size: 15px; } .wrap, .ft__in, .ft__c { width: calc(100% - 36px); }
  .demo-bar { font-size: 11px; }
  .hd { height: 64px; padding: 0 8px 0 16px; gap: 8px; }
  .lg__m { width: 38px; height: 38px; } .lg b { font-size: 19px; }
  .hd__cta { height: 38px; padding: 0 14px; font-size: 12.5px; }
  .hero { height: 78svh; min-height: 560px; }
  .hero__c { left: 18px; right: 18px; bottom: 30px; }
  .hero h1 { font-size: 28px; }
  .hero__btns .btn { flex: 1; padding: 0 10px; height: 50px; font-size: 14px; }
  .hero__now { right: 14px; left: auto; top: 14px; width: 200px; padding: 12px 16px; border-radius: 20px; }
  .hero__now b { font-size: 22px; } .hero__now li { font-size: 11.5px; padding: 2px 9px; }
  .sec { padding: 70px 0; } .numbers { padding: 50px 0; }
  .nb { grid-template-columns: 1fr; gap: 12px; } .nb > div { padding: 20px; display: grid; grid-template-columns: auto 1fr; gap: 0 14px; text-align: left; align-items: center; }
  .nb b { font-size: 46px; grid-row: 1 / 3; } .nb p { margin: 0; } .nb span { display: none; }
  .teiki-t, .sea, .story-t, .pd, .ig2 { grid-template-columns: 1fr; gap: 26px; }
  .sea__m { grid-template-columns: repeat(6, 1fr); gap: 6px; } .sea__m button { padding: 10px 0; border-radius: 14px; } .sea__m b { font-size: 20px; }
  .sea__b { padding: 22px; }
  .bar__r { grid-template-columns: 76px 1fr; } .bar__m { grid-template-columns: 76px repeat(12, 1fr); font-size: 11px; }
  .ig { gap: 16px 12px; } .ic__img { border-radius: 22px; } .ic h3 { font-size: 15px; }
  .pick-band { min-height: 0; flex-direction: column; } .pick-band > img { position: relative; height: 300px; }
  .pick-band__c { margin: -50px 16px 40px; width: auto; padding: 30px 24px; }
  .story-t__img img + img { margin-bottom: 20px; }
  .ft__in { flex-direction: column; }
  .cos { grid-template-columns: 1fr; } .co span { flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: 12px; }
  .segs--7 { grid-template-columns: repeat(7, 1fr); gap: 4px; } .segs--7 .seg span { border-radius: 12px; padding: 10px 0; font-size: 13px; }
  .tk__s { padding: 24px 20px; }
  .pd { padding: 16px; border-radius: 30px; } .pd__img { border-radius: 22px; }
  .rsv { padding: 22px 16px; border-radius: 28px; }
  .ppl { grid-template-columns: 1fr 1fr 1fr; }
  .ph--img { height: 280px; }
}
.btn--w { color: var(--ink); }