@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500&family=Noto+Sans+JP:wght@300;400;500&family=Noto+Serif+JP:wght@400;500&display=swap');
:root{--ink:#172b20;--deep:#10271b;--cream:#f7f5ee;--paper:#fffefb;--gold:#b69b6b;--sub:#647568;--line:#d8d1c3;--serif:'Noto Serif JP',serif;--sans:'Noto Sans JP',sans;--roman:'Cormorant Garamond',serif}
*,*:before,*:after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--cream);font-family:var(--sans);font-weight:300;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #9b7c43;outline-offset:3px}
.wrap{width:min(1160px,calc(100% - 72px));margin-inline:auto}
.skip{position:absolute;top:-90px;left:15px;z-index:100;background:#fff;padding:10px}.skip:focus{top:10px}
.preview-bar{padding:10px 20px;text-align:center;background:#e9dfc7;color:#493e2c;font-size:11px;letter-spacing:.05em;line-height:1.7}
.order-header{background:#0f271a;border-bottom:1px solid #c4a76e40}
.header-inner{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:flex;align-items:center;gap:18px}.logo img{width:165px;height:auto;filter:brightness(0) saturate(100%) invert(82%) sepia(22%) saturate(600%) hue-rotate(347deg) brightness(93%) contrast(84%)}
.logo span{color:#d6c297;border-left:1px solid #d6c2976b;padding-left:16px;font:400 11px/1.8 var(--roman);letter-spacing:.18em}
.back-link{color:#dacaa9;border-bottom:1px solid #c6ae80;padding:8px 0;font-size:11px;letter-spacing:.05em;white-space:nowrap}
.intro{padding:82px 0 54px;max-width:1160px}
.eyebrow{display:block;font:400 12px var(--roman);letter-spacing:.23em;color:#987d4c}
.intro h1{font:400 clamp(31px,3.5vw,46px)/1.65 var(--serif);letter-spacing:.08em;margin:15px 0 17px}
.intro h1 span{display:block;color:#7c886f;font:300 15px/2 var(--sans);letter-spacing:.11em;margin-top:7px}
.intro>p{color:var(--sub);font-size:13px;line-height:2.1;max-width:830px;margin:0 0 30px}
.notice{display:flex;flex-direction:column;gap:6px;border:1px solid #d2be93;background:#f0eadb;padding:20px 24px;font-size:12px;line-height:2;color:#5f5847}
.notice strong{color:#715723;font-size:13px}
.order-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.85fr);gap:30px;align-items:start;padding-bottom:112px}
.form-main{min-width:0}
.group{margin:0 0 17px;padding:36px 40px 39px;background:var(--paper);border:1px solid #e2dcd0;min-width:0}
.group>legend{float:left;width:100%;font:400 24px/1.6 var(--serif);letter-spacing:.06em;margin:0 0 12px;padding:0}
.group>legend span{font:400 25px var(--roman);color:#ad9060;margin-right:16px}
.group>legend+*{clear:both}
.group-help{margin:0 0 23px;font-size:12px;line-height:2;color:#7b867c}
.two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 17px}
.field{min-width:0}.field.full{grid-column:1/-1}
.field label{display:block;font-size:12px;font-weight:500;letter-spacing:.035em;margin-bottom:9px}
.field label em{font-style:normal;color:#a07844;font-size:10px;border:1px solid #dbbf8f;border-radius:2px;padding:1px 5px;margin-left:7px;font-weight:400}
.field input,.field select,.field textarea{width:100%;border:1px solid #cecfc6;background:#fff;padding:14px 13px;min-height:49px;border-radius:0;color:var(--ink);font-size:13px}
.field textarea{resize:vertical;min-height:108px}
.field input::placeholder,.field textarea::placeholder{color:#9da79e}
.field small{display:block;margin-top:9px;color:#89958c;font-size:10px;line-height:1.8}
.qty-control{display:flex;width:100%;border:1px solid #cecfc6;height:49px}
.qty-control input{text-align:center;min-width:0;flex:1;border:0;border-left:1px solid #e1e0d8;border-right:1px solid #e1e0d8;min-height:0;padding:8px;font:400 22px var(--roman);appearance:textfield;-moz-appearance:textfield}
.qty-control input::-webkit-inner-spin-button,.qty-control input::-webkit-outer-spin-button{appearance:none;margin:0}
.qty-control button{width:52px;flex:none;background:#f8f5ec;color:#526a54;border:0;font-size:23px}
.qty-control button:hover{background:#eae4d5}.qty-control button:disabled{opacity:.4;cursor:default}
.check-line{display:flex;gap:12px;padding:19px 21px;align-items:start;border:1px solid #b9c6b9;background:#f2f5ef;cursor:pointer}
.check-line input{width:18px;height:18px;margin-top:2px;accent-color:#21412d;flex:none}
.check-line span{font-size:13px;font-weight:500;line-height:1.7}.check-line small{display:block;color:#718174;font-size:11px;font-weight:300;margin-top:4px}
.recipient-fields{border:1px solid #e2dcd0;margin:22px 0 0;padding:22px 22px 26px;min-width:0}
.recipient-fields[hidden]{display:none}.sublegend{font:400 14px var(--serif);padding:0 5px;color:#536d54;margin-bottom:12px}
.future-note{margin-top:20px;background:#f3efe5;border-left:3px solid #c7b28c;padding:17px 20px;color:#827c6d;font-size:11px;line-height:2}
.future-note strong{display:block;color:#716347;font-size:12px}
.payment-options{display:grid;gap:10px}
.pay{display:flex;gap:12px;padding:17px 18px;border:1px solid #d4d7cd;cursor:pointer;align-items:start}
.pay:has(input:checked){border-color:#a79062;background:#f6f2e8}
.pay input{margin-top:4px;accent-color:#2f5136}.pay span strong{display:block;font-size:13px;line-height:1.7;font-weight:500}.pay span small{display:block;color:#7d897e;font-size:11px;line-height:1.8;margin-top:3px}
.pay[hidden],.bulk-payment-notice[hidden]{display:none!important}.bulk-payment-notice{background:#f4eddf;border:1px solid #c7b07c;padding:16px 19px;margin:17px 0 16px;font-size:12px;line-height:1.9;color:#625941}.bulk-payment-notice strong{display:block;color:#715724;font-size:13px;margin-bottom:3px}.bulk-payment-notice span{display:block}
.submit-area{background:#e9e3d3;padding:28px 34px 34px;margin-top:19px}.submit-area p{color:#686e5f;font-size:12px;line-height:2;margin:0 0 18px}.submit-area p strong{color:#354c39}
.review-button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;background:#193a28;color:#f9f2e3;border:0;padding:18px 23px;font-size:13px;letter-spacing:.07em}
.review-button:hover{background:#29513a}.review-button span{font-size:18px}
.summary{position:sticky;top:22px;background:#153022;color:#f0e8d7;padding:34px 30px 31px;box-shadow:0 15px 42px #17231b12}
.summary .eyebrow{color:#d8bd88}.summary h2{font:400 24px/1.6 var(--serif);margin:10px 0 23px;letter-spacing:.08em}
.summary-product{border-top:1px solid #e2d5b22c;border-bottom:1px solid #e2d5b22c;padding:20px 0;display:flex;gap:14px;align-items:center}
.summary-product img{width:81px;height:81px;object-fit:cover}.summary-product strong{font:400 12px/1.9 var(--serif);display:block}.summary-product small{display:block;color:#bdc9b9;font-size:10px;margin-top:6px}
.summary dl{margin:13px 0 21px}.summary dl div{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #e2d5b220;font-size:12px}.summary dt{color:#b4c4b5}.summary dd{margin:0;color:#f4ecda;text-align:right}
.summary-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:17px;border-top:1px solid #c8ad75}.summary-bottom span{font-size:13px}.summary-bottom small{display:block;font-size:10px;color:#bac7b6;margin-top:6px}.summary-bottom strong{font:400 30px var(--roman);white-space:nowrap;color:#efd8a9}
.summary>p{font-size:10px;line-height:1.9;color:#b2c1b0;margin:25px 0 22px}.summary-back{color:#e6c99a;font-size:11px;border-bottom:1px solid #bba073;padding-bottom:5px}
footer{background:#10271b;color:#c3c9ba;padding:28px max(36px,calc((100vw - 1160px)/2));display:flex;justify-content:space-between;gap:20px;font-size:11px;line-height:2}
footer a{color:#e8d8b8;border-bottom:1px solid #bda87e}
dialog{max-width:min(660px,calc(100vw - 34px));width:100%;max-height:calc(100vh - 34px);overflow:auto;border:1px solid #ccb88c;padding:0;background:#f9f7f0;color:#1c3224;box-shadow:0 20px 70px #0006}
dialog::backdrop{background:#0b1f17b8}.dialog-head{padding:28px 35px 18px;border-bottom:1px solid #dfd6c5}.dialog-head h2{margin:8px 0 8px;font:400 25px var(--serif)}.dialog-head p{margin:0;color:#7b877b;font-size:11px;line-height:1.8}
.review-content{padding:18px 35px}.review-row{padding:13px 0;border-bottom:1px solid #e5ded0;display:grid;grid-template-columns:133px 1fr;gap:12px;font-size:12px;line-height:1.9}.review-row strong{font-weight:500;color:#576c58}.review-row span{white-space:pre-wrap;overflow-wrap:anywhere}
.dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 35px 30px}.dialog-actions button{background:#183928;color:#fff;border:0;padding:14px 20px;font-size:12px}.dialog-actions span{color:#8a907f;font-size:11px}
@media(max-width:960px){.order-layout{grid-template-columns:minmax(0,1fr)}.summary{position:static;order:-1}.summary-product img{width:65px;height:65px}.intro{padding:57px 0 42px}}
@media(max-width:600px){.wrap{width:calc(100% - 34px)}.preview-bar{font-size:10px}.header-inner{min-height:79px;gap:14px}.logo img{width:126px}.logo span{display:none}.back-link{font-size:10px}.intro{padding:46px 0 31px}.intro h1{font-size:28px}.intro h1 span{font-size:12px}.intro>p{font-size:12px}.notice{padding:17px;font-size:11px}.order-layout{gap:16px;padding-bottom:75px}.group{padding:25px 19px 27px;margin-bottom:13px}.group>legend{font-size:20px}.group>legend span{font-size:22px;margin-right:11px}.two-col{grid-template-columns:1fr;gap:17px}.recipient-fields{padding:16px}.summary{padding:27px 23px}.submit-area{padding:23px 20px 25px}.review-row{grid-template-columns:1fr;gap:2px}.dialog-head,.review-content,.dialog-actions{padding-left:22px;padding-right:22px}.dialog-actions{align-items:start;flex-direction:column}footer{padding:26px 17px;flex-direction:column}}