/* dekita リニューアル 下層ページ（中古模型・タグ・注文フォーム・新着情報） ※v(N) は build.py で展開（PC=1400 / SP=375） */

.pageHead.isSmall { padding: calc(40 / var(--screen-w) * 100vw) calc(140 / var(--screen-w) * 100vw) calc(34 / var(--screen-w) * 100vw); }
.breadcrumb + .sec { padding-top: calc(48 / var(--screen-w) * 100vw); }

/* ============ 共通：件数・並び替え・ページ送り ============ */
.listBar { display: flex; align-items: center; justify-content: space-between; gap: calc(20 / var(--screen-w) * 100vw); margin-top: calc(44 / var(--screen-w) * 100vw); padding-bottom: calc(14 / var(--screen-w) * 100vw); border-bottom: 1px solid var(--line); }
.listCount { font-size: calc(13 / var(--screen-w) * 100vw); color: var(--textSub); }
.listCount strong { margin: 0 calc(3 / var(--screen-w) * 100vw); font-family: "Comfortaa", sans-serif; font-size: calc(18 / var(--screen-w) * 100vw); color: var(--brown); }
.listCount.isCenter { margin-top: calc(28 / var(--screen-w) * 100vw); text-align: center; }
.listSort { display: flex; align-items: center; gap: calc(10 / var(--screen-w) * 100vw); font-size: calc(13 / var(--screen-w) * 100vw); color: var(--textSub); }
.listSort select { padding: calc(6 / var(--screen-w) * 100vw) calc(30 / var(--screen-w) * 100vw) calc(6 / var(--screen-w) * 100vw) calc(12 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); font-size: calc(13 / var(--screen-w) * 100vw); appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--brown) 50%), linear-gradient(135deg, var(--brown) 50%, transparent 50%);
  background-position: right calc(14 / var(--screen-w) * 100vw) center, right calc(9 / var(--screen-w) * 100vw) center; background-size: calc(5 / var(--screen-w) * 100vw) calc(5 / var(--screen-w) * 100vw); background-repeat: no-repeat; }

.pager { display: flex; justify-content: center; align-items: center; gap: calc(8 / var(--screen-w) * 100vw); margin-top: calc(56 / var(--screen-w) * 100vw); }
.pagerItem, .pagerNext { display: inline-flex; align-items: center; justify-content: center; min-width: calc(40 / var(--screen-w) * 100vw); padding: calc(7 / var(--screen-w) * 100vw) calc(12 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); font-family: "Comfortaa", sans-serif; font-size: calc(13 / var(--screen-w) * 100vw); line-height: 1.4; color: var(--brown); transition: background-color .4s var(--ease), color .4s var(--ease); }
.pagerItem.isCurrent { background: var(--brown); border-color: var(--brown); color: var(--white); }
a.pagerItem:hover, .pagerNext:hover { background: var(--beigeLight); }
.pagerNext { padding-left: calc(18 / var(--screen-w) * 100vw); padding-right: calc(18 / var(--screen-w) * 100vw); font-family: "Noto Sans JP", sans-serif; }
.pagerDots { color: var(--beigeLine); }

.tagChip em { margin-left: calc(5 / var(--screen-w) * 100vw); font-style: normal; font-family: "Comfortaa", sans-serif; font-size: calc(10 / var(--screen-w) * 100vw); opacity: .7; }
.tagChip.isCurrent { background: var(--brown); border-color: var(--brown); color: var(--white); }

/* ============ 中古模型一覧 ============ */
.usedLead { text-align: center; font-size: calc(14 / var(--screen-w) * 100vw); color: var(--textSub); }
.usedLead .note { display: inline-block; margin-top: calc(6 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }

.filterBox { margin-top: calc(44 / var(--screen-w) * 100vw); padding: calc(30 / var(--screen-w) * 100vw) calc(36 / var(--screen-w) * 100vw); background: var(--beigeLight); border: 1px solid var(--beigeLine); }
.filterLabel { flex-shrink: 0; width: calc(110 / var(--screen-w) * 100vw); padding-top: calc(6 / var(--screen-w) * 100vw); font-size: calc(13 / var(--screen-w) * 100vw); font-weight: 700; color: var(--brownDark); }
.filterSearch { display: flex; align-items: center; gap: calc(20 / var(--screen-w) * 100vw); padding-bottom: calc(22 / var(--screen-w) * 100vw); border-bottom: 1px dashed var(--beigeLine); }
.filterSearch .filterLabel { padding-top: 0; }
.searchField { position: relative; flex: 1; max-width: calc(520 / var(--screen-w) * 100vw); }
.searchField svg { position: absolute; left: calc(14 / var(--screen-w) * 100vw); top: 50%; width: calc(18 / var(--screen-w) * 100vw); height: calc(18 / var(--screen-w) * 100vw); transform: translateY(-50%); color: var(--brown); }
.searchField input { width: 100%; padding: calc(11 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw) calc(11 / var(--screen-w) * 100vw) calc(42 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); font-size: calc(14 / var(--screen-w) * 100vw); }
.searchField input:focus { outline: 2px solid var(--orange); outline-offset: 0; border-color: var(--orange); }
.filterRow { display: flex; gap: calc(20 / var(--screen-w) * 100vw); padding: calc(20 / var(--screen-w) * 100vw) 0 0; }
.filterChips { display: flex; flex-wrap: wrap; gap: calc(8 / var(--screen-w) * 100vw); }
.chipCheck { position: relative; cursor: pointer; }
.chipCheck input { position: absolute; opacity: 0; pointer-events: none; }
.chipCheck span { display: inline-block; padding: calc(6 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); font-size: calc(13 / var(--screen-w) * 100vw); line-height: 1.6; color: var(--text); transition: background-color .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease); }
.chipCheck em { position: absolute; top: calc(-7 / var(--screen-w) * 100vw); right: calc(-5 / var(--screen-w) * 100vw); min-width: calc(20 / var(--screen-w) * 100vw); padding: 0 calc(5 / var(--screen-w) * 100vw); border-radius: calc(10 / var(--screen-w) * 100vw); background: var(--orange); color: var(--white); font-style: normal; font-family: "Comfortaa", sans-serif; font-size: calc(10 / var(--screen-w) * 100vw); line-height: calc(18 / var(--screen-w) * 100vw); text-align: center; }
.chipCheck:hover span { border-color: var(--brown); }
.chipCheck input:checked + span { background: var(--brown); border-color: var(--brown); color: var(--white); }
.chipCheck input:focus-visible + span { outline: 2px solid var(--orange); outline-offset: 2px; }
.filterFoot { display: flex; justify-content: space-between; align-items: center; margin-top: calc(24 / var(--screen-w) * 100vw); padding-top: calc(18 / var(--screen-w) * 100vw); border-top: 1px dashed var(--beigeLine); font-size: calc(13 / var(--screen-w) * 100vw); }
.filterAllTags { color: var(--brown); text-decoration: underline; text-underline-offset: calc(3 / var(--screen-w) * 100vw); }
.filterReset { padding: 0; border: 0; background: none; color: var(--textSub); text-decoration: underline; text-underline-offset: calc(3 / var(--screen-w) * 100vw); cursor: pointer; }

.usedList { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(36 / var(--screen-w) * 100vw) calc(24 / var(--screen-w) * 100vw); margin-top: calc(30 / var(--screen-w) * 100vw); }
.usedCard { display: flex; flex-direction: column; }
.usedImg { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #f0eeea; }
.usedImg img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.usedImg:hover img { transform: scale(1.04); }
.usedBody { display: flex; flex-direction: column; flex: 1; padding-top: calc(12 / var(--screen-w) * 100vw); }
.usedName { display: flex; align-items: baseline; justify-content: space-between; gap: calc(8 / var(--screen-w) * 100vw); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(15 / var(--screen-w) * 100vw); }
.usedName span { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-size: calc(11 / var(--screen-w) * 100vw); color: var(--textSub); }
.usedTags { display: flex; flex-wrap: wrap; gap: calc(5 / var(--screen-w) * 100vw); margin-top: calc(8 / var(--screen-w) * 100vw); }
.usedSpec { display: flex; gap: calc(8 / var(--screen-w) * 100vw); margin: calc(8 / var(--screen-w) * 100vw) 0 0; font-size: calc(12 / var(--screen-w) * 100vw); color: var(--textSub); }
.usedSpec dd { margin: 0; color: var(--text); }
.usedPrice { margin-top: auto; padding-top: calc(10 / var(--screen-w) * 100vw); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(20 / var(--screen-w) * 100vw); color: var(--brown); }
.usedPrice small { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-size: calc(11 / var(--screen-w) * 100vw); }
.btnCart { width: 100%; min-width: 0; margin-top: calc(10 / var(--screen-w) * 100vw); padding: calc(10 / var(--screen-w) * 100vw) calc(20 / var(--screen-w) * 100vw); background: var(--orange); color: var(--white); font-size: calc(13 / var(--screen-w) * 100vw); }
.btnCart:hover { background: #e08f0c; }

.helpBox { display: flex; align-items: center; justify-content: space-between; gap: calc(30 / var(--screen-w) * 100vw); margin-top: calc(72 / var(--screen-w) * 100vw); padding: calc(30 / var(--screen-w) * 100vw) calc(40 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--beigeLight); font-size: calc(14 / var(--screen-w) * 100vw); }
.helpBtns { display: flex; gap: calc(12 / var(--screen-w) * 100vw); flex-shrink: 0; }
.helpBtns .btn { min-width: calc(200 / var(--screen-w) * 100vw); }

/* ============ タグ一覧（中古模型） ============ */
.tagHead { position: relative; padding: calc(34 / var(--screen-w) * 100vw) calc(40 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--beigeLight); }
.tagHeadLabel { font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(12 / var(--screen-w) * 100vw); letter-spacing: .12em; color: var(--orange); }
.tagHeadTitle { margin-top: calc(6 / var(--screen-w) * 100vw); font-size: calc(26 / var(--screen-w) * 100vw); font-weight: 700; line-height: 1.5; color: var(--brownDark); }
.tagHeadTitle span { margin-right: calc(4 / var(--screen-w) * 100vw); color: var(--orange); }
.tagHeadTitle small { margin-left: calc(6 / var(--screen-w) * 100vw); font-size: calc(15 / var(--screen-w) * 100vw); font-weight: 500; color: var(--text); }
.tagHeadText { max-width: calc(760 / var(--screen-w) * 100vw); margin-top: calc(10 / var(--screen-w) * 100vw); font-size: calc(14 / var(--screen-w) * 100vw); color: var(--textSub); }
.tagHeadCount { position: absolute; right: calc(40 / var(--screen-w) * 100vw); top: calc(34 / var(--screen-w) * 100vw); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(22 / var(--screen-w) * 100vw); color: var(--brown); }

.tagIndex { margin-top: calc(30 / var(--screen-w) * 100vw); padding: calc(24 / var(--screen-w) * 100vw) calc(30 / var(--screen-w) * 100vw); border: 1px solid var(--line); }
.tagIndexTitle { font-size: calc(14 / var(--screen-w) * 100vw); font-weight: 700; color: var(--brownDark); }
.tagIndexGroup { display: flex; gap: calc(16 / var(--screen-w) * 100vw); align-items: flex-start; margin-top: calc(14 / var(--screen-w) * 100vw); }
.tagIndexLabel { flex-shrink: 0; width: calc(110 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); color: var(--textSub); padding-top: calc(3 / var(--screen-w) * 100vw); }
.tagIndexChips { display: flex; flex-wrap: wrap; gap: calc(6 / var(--screen-w) * 100vw); }

/* ============ 注文フォーム ============ */
.orderLead { text-align: center; font-size: calc(14 / var(--screen-w) * 100vw); color: var(--textSub); }
.orderLead small { display: block; margin-top: calc(4 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }
.stepNav { display: flex; justify-content: center; margin-top: calc(36 / var(--screen-w) * 100vw); counter-reset: none; }
.stepNav li { position: relative; display: flex; align-items: center; gap: calc(8 / var(--screen-w) * 100vw); padding: calc(10 / var(--screen-w) * 100vw) calc(28 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw) calc(36 / var(--screen-w) * 100vw); background: var(--beigeLight); font-size: calc(13 / var(--screen-w) * 100vw); color: var(--textSub);
  clip-path: polygon(0 0, calc(100% - calc(14 / var(--screen-w) * 100vw)) 0, 100% 50%, calc(100% - calc(14 / var(--screen-w) * 100vw)) 100%, 0 100%, calc(14 / var(--screen-w) * 100vw) 50%); }
.stepNav li:first-child { padding-left: calc(24 / var(--screen-w) * 100vw); clip-path: polygon(0 0, calc(100% - calc(14 / var(--screen-w) * 100vw)) 0, 100% 50%, calc(100% - calc(14 / var(--screen-w) * 100vw)) 100%, 0 100%); }
.stepNav li + li { margin-left: calc(-8 / var(--screen-w) * 100vw); }
.stepNav li span { display: inline-flex; align-items: center; justify-content: center; width: calc(22 / var(--screen-w) * 100vw); height: calc(22 / var(--screen-w) * 100vw); border-radius: 50%; background: var(--white); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(11 / var(--screen-w) * 100vw); color: var(--brown); }
.stepNav li.isDone { background: var(--beige); color: var(--brownDark); }
.stepNav li.isCurrent { background: var(--brown); color: var(--white); font-weight: 700; }

.orderLayout { display: grid; grid-template-columns: 1fr calc(330 / var(--screen-w) * 100vw); gap: calc(40 / var(--screen-w) * 100vw); align-items: start; margin-top: calc(44 / var(--screen-w) * 100vw); }
.orderForm { display: flex; flex-direction: column; gap: calc(24 / var(--screen-w) * 100vw); }
.orderStep { margin: 0; padding: calc(28 / var(--screen-w) * 100vw) calc(32 / var(--screen-w) * 100vw) calc(32 / var(--screen-w) * 100vw); border: 1px solid var(--line); background: var(--white); min-width: 0; }
.orderStep.isCurrent { border-color: var(--brown); box-shadow: 0 0 0 1px var(--brown); }
.stepTitle { float: left; width: 100%; display: flex; align-items: center; gap: calc(12 / var(--screen-w) * 100vw); margin-bottom: calc(24 / var(--screen-w) * 100vw); padding: 0 0 calc(14 / var(--screen-w) * 100vw); border-bottom: 1px solid var(--line); font-size: calc(18 / var(--screen-w) * 100vw); font-weight: 700; color: var(--brownDark); }
.stepNum { padding: calc(2 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw); background: var(--brown); color: var(--white); font-family: "Comfortaa", sans-serif; font-size: calc(11 / var(--screen-w) * 100vw); letter-spacing: .08em; }
.orderStep .field { margin-top: calc(24 / var(--screen-w) * 100vw); }
.orderStep > .stepTitle + * { clear: both; margin-top: 0; }
.fieldLabel { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: calc(8 / var(--screen-w) * 100vw); margin-bottom: calc(10 / var(--screen-w) * 100vw); font-size: calc(14 / var(--screen-w) * 100vw); font-weight: 700; }
.req { padding: 0 calc(6 / var(--screen-w) * 100vw); background: var(--orangeRed); color: var(--white); font-size: calc(10 / var(--screen-w) * 100vw); font-weight: 500; line-height: 1.8; }
.any { font-size: calc(11 / var(--screen-w) * 100vw); font-weight: 400; color: var(--textSub); }

.help { position: relative; }
.help summary { display: inline-flex; align-items: center; justify-content: center; width: calc(20 / var(--screen-w) * 100vw); height: calc(20 / var(--screen-w) * 100vw); border-radius: 50%; border: 1px solid var(--brown); color: var(--brown); font-family: "Comfortaa", sans-serif; font-size: calc(11 / var(--screen-w) * 100vw); font-weight: 700; line-height: 1; cursor: pointer; list-style: none; transition: background-color .4s var(--ease), color .4s var(--ease); }
.help summary::-webkit-details-marker { display: none; }
.help summary:hover, .help[open] summary { background: var(--brown); color: var(--white); }
.helpPop { position: absolute; left: calc(-12 / var(--screen-w) * 100vw); top: calc(100% + calc(10 / var(--screen-w) * 100vw)); z-index: 5; width: calc(400 / var(--screen-w) * 100vw); padding: calc(16 / var(--screen-w) * 100vw) calc(18 / var(--screen-w) * 100vw); background: var(--white); border: 1px solid var(--beigeLine); box-shadow: 0 calc(8 / var(--screen-w) * 100vw) calc(22 / var(--screen-w) * 100vw) rgba(83,71,65,.12); font-size: calc(13 / var(--screen-w) * 100vw); font-weight: 400; line-height: 1.8; }
.helpPop::before { content: ""; position: absolute; left: calc(18 / var(--screen-w) * 100vw); top: calc(-6 / var(--screen-w) * 100vw); width: calc(10 / var(--screen-w) * 100vw); height: calc(10 / var(--screen-w) * 100vw); background: var(--white); border-left: 1px solid var(--beigeLine); border-top: 1px solid var(--beigeLine); transform: rotate(45deg); }
.helpTitle { margin-bottom: calc(6 / var(--screen-w) * 100vw); font-weight: 700; color: var(--brownDark); }
.helpPop p + p { margin-top: calc(4 / var(--screen-w) * 100vw); }
.helpPop b { color: var(--brown); }

.choiceGrid { display: grid; grid-template-columns: 1fr 1fr; gap: calc(14 / var(--screen-w) * 100vw); }
.choiceCard { position: relative; cursor: pointer; }
.choiceCard input { position: absolute; opacity: 0; pointer-events: none; }
.choiceBody { display: flex; flex-direction: column; align-items: flex-start; gap: calc(6 / var(--screen-w) * 100vw); height: 100%; padding: calc(18 / var(--screen-w) * 100vw) calc(20 / var(--screen-w) * 100vw) calc(18 / var(--screen-w) * 100vw) calc(48 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); transition: border-color .4s var(--ease), background-color .4s var(--ease); }
.choiceBody::before { content: ""; position: absolute; left: calc(18 / var(--screen-w) * 100vw); top: calc(22 / var(--screen-w) * 100vw); width: calc(16 / var(--screen-w) * 100vw); height: calc(16 / var(--screen-w) * 100vw); border-radius: 50%; border: 1px solid var(--beigeLine); background: var(--white); }
.choiceCard input:checked + .choiceBody { border-color: var(--brown); background: var(--beigeLight); }
.choiceCard input:checked + .choiceBody::before { border: calc(5 / var(--screen-w) * 100vw) solid var(--brown); }
.choiceCard input:focus-visible + .choiceBody { outline: 2px solid var(--orange); outline-offset: 2px; }
.choiceBody img { width: calc(80 / var(--screen-w) * 100vw); }
.choiceText { font-size: calc(12 / var(--screen-w) * 100vw); color: var(--textSub); line-height: 1.7; }
.choicePrice { font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(18 / var(--screen-w) * 100vw); color: var(--brown); }
.choicePrice small { font-family: "Noto Sans JP", sans-serif; font-size: calc(11 / var(--screen-w) * 100vw); font-weight: 400; }
.choiceName { font-size: calc(15 / var(--screen-w) * 100vw); font-weight: 700; }
.choiceCard.isSimple .choiceBody::before { top: calc(20 / var(--screen-w) * 100vw); }

.fieldRow { display: grid; grid-template-columns: 1fr 1fr; gap: calc(24 / var(--screen-w) * 100vw); align-items: start; margin-top: calc(24 / var(--screen-w) * 100vw); }
.orderStep .fieldRow .field { margin-top: 0; }
.segment { display: flex; }
.segment label { flex: 1; display: flex; position: relative; cursor: pointer; }
.segment label + label { margin-left: -1px; }
.segment input { position: absolute; opacity: 0; pointer-events: none; }
.segment span { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: calc(11 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); font-size: calc(13 / var(--screen-w) * 100vw); line-height: 1.5; text-align: center; transition: background-color .4s var(--ease), color .4s var(--ease); }
.segment em { font-style: normal; font-size: calc(11 / var(--screen-w) * 100vw); color: var(--orangeRed); }
.segment input:checked + span { position: relative; z-index: 1; background: var(--brown); border-color: var(--brown); color: var(--white); font-weight: 700; }
.segment input:checked + span em { color: #ffe3b8; }
.segment input:focus-visible + span { outline: 2px solid var(--orange); outline-offset: 2px; }

.checkGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(10 / var(--screen-w) * 100vw); }
.checkItem { position: relative; display: flex; cursor: pointer; }
.checkItem input { position: absolute; opacity: 0; pointer-events: none; }
.checkItem span { position: relative; flex: 1; display: flex; align-items: center; justify-content: space-between; gap: calc(6 / var(--screen-w) * 100vw); padding: calc(10 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw) calc(34 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); font-size: calc(13 / var(--screen-w) * 100vw); line-height: 1.5; letter-spacing: 0; }
.checkItem span::before { content: ""; position: absolute; left: calc(10 / var(--screen-w) * 100vw); top: 50%; width: calc(16 / var(--screen-w) * 100vw); height: calc(16 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); transform: translateY(-50%); }
.checkItem em { flex-shrink: 0; font-style: normal; font-size: calc(11 / var(--screen-w) * 100vw); white-space: nowrap; color: var(--orangeRed); }
.checkItem input:checked + span { border-color: var(--brown); background: var(--beigeLight); }
.checkItem input:checked + span::before { background: var(--brown) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='1.8'/%3E%3C/svg%3E") center / 80% no-repeat; border-color: var(--brown); }
.checkItem input:focus-visible + span { outline: 2px solid var(--orange); outline-offset: 2px; }
.checkItem.isInline { display: inline-block; margin-top: calc(16 / var(--screen-w) * 100vw); }

.fieldNote { margin-top: calc(8 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); color: var(--textSub); }
.selectWrap select { min-width: calc(260 / var(--screen-w) * 100vw); padding: calc(10 / var(--screen-w) * 100vw) calc(36 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw) calc(14 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); background: var(--white); font-size: calc(14 / var(--screen-w) * 100vw); appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--brown) 50%), linear-gradient(135deg, var(--brown) 50%, transparent 50%);
  background-position: right calc(18 / var(--screen-w) * 100vw) center, right calc(13 / var(--screen-w) * 100vw) center; background-size: calc(5 / var(--screen-w) * 100vw) calc(5 / var(--screen-w) * 100vw); background-repeat: no-repeat; }

.dropZone { position: relative; display: flex; flex-direction: column; align-items: center; gap: calc(6 / var(--screen-w) * 100vw); margin-top: calc(22 / var(--screen-w) * 100vw); padding: calc(36 / var(--screen-w) * 100vw) calc(20 / var(--screen-w) * 100vw); border: 2px dashed var(--beigeLine); background: var(--beigeLight); color: var(--brown); text-align: center; cursor: pointer; transition: border-color .4s var(--ease), background-color .4s var(--ease); }
.dropZone:hover { border-color: var(--brown); background: #f1e8d8; }
.dropZone input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dropZone svg { width: calc(34 / var(--screen-w) * 100vw); height: calc(34 / var(--screen-w) * 100vw); }
.dropMain { font-size: calc(14 / var(--screen-w) * 100vw); font-weight: 700; }
.dropSub { font-size: calc(12 / var(--screen-w) * 100vw); color: var(--textSub); }
.noteList { margin-top: calc(16 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); color: var(--textSub); }
.noteList li { position: relative; padding-left: calc(14 / var(--screen-w) * 100vw); }
.noteList li + li { margin-top: calc(4 / var(--screen-w) * 100vw); }
.noteList li::before { content: "※"; position: absolute; left: 0; }

.formNav { display: flex; justify-content: space-between; gap: calc(16 / var(--screen-w) * 100vw); }
.formNav .btn { min-width: calc(220 / var(--screen-w) * 100vw); }
.btn.isBack::after { right: auto; left: calc(18 / var(--screen-w) * 100vw); transform: translateY(-50%) rotate(-135deg); }

.estimate { position: sticky; top: calc(96 / var(--screen-w) * 100vw); padding: calc(26 / var(--screen-w) * 100vw) calc(26 / var(--screen-w) * 100vw) calc(24 / var(--screen-w) * 100vw); border: 1px solid var(--brown); background: var(--beigeLight); }
.estimateTitle { font-size: calc(14 / var(--screen-w) * 100vw); font-weight: 700; color: var(--brownDark); }
.estimateTitle small { font-size: calc(11 / var(--screen-w) * 100vw); font-weight: 400; color: var(--textSub); }
.estimateTotal { margin-top: calc(6 / var(--screen-w) * 100vw); padding-bottom: calc(14 / var(--screen-w) * 100vw); border-bottom: 1px solid var(--beigeLine); font-size: calc(14 / var(--screen-w) * 100vw); color: var(--brownDark); }
.estimateTotal span { margin-right: calc(4 / var(--screen-w) * 100vw); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(36 / var(--screen-w) * 100vw); color: var(--brown); letter-spacing: .02em; }
.estimateList { display: grid; grid-template-columns: 1fr auto; gap: calc(6 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw); margin: calc(14 / var(--screen-w) * 100vw) 0 0; font-size: calc(12 / var(--screen-w) * 100vw); }
.estimateList dt { color: var(--textSub); }
.estimateList dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.estimate .btn { width: 100%; min-width: 0; margin-top: calc(20 / var(--screen-w) * 100vw); }
.estimateNote { margin-top: calc(12 / var(--screen-w) * 100vw); font-size: calc(11 / var(--screen-w) * 100vw); color: var(--textSub); line-height: 1.7; }
.spEstimateBar { display: none; }

/* ============ 新着情報 一覧 ============ */
.tabTags { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(8 / var(--screen-w) * 100vw); }
.tabTag { padding: calc(7 / var(--screen-w) * 100vw) calc(20 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); font-size: calc(13 / var(--screen-w) * 100vw); color: var(--text); transition: background-color .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease); }
.tabTag:hover { border-color: var(--brown); color: var(--brown); }
.tabTag.isCurrent { background: var(--brown); border-color: var(--brown); color: var(--white); }
.newsList.isArchive { gap: calc(44 / var(--screen-w) * 100vw) calc(32 / var(--screen-w) * 100vw); margin-top: calc(30 / var(--screen-w) * 100vw); }
.newsTags { display: flex; flex-wrap: wrap; gap: calc(5 / var(--screen-w) * 100vw); }

/* ============ 新着情報 記事 ============ */
.postLayout { display: grid; grid-template-columns: 1fr calc(300 / var(--screen-w) * 100vw); gap: calc(60 / var(--screen-w) * 100vw); align-items: start; padding-top: calc(56 / var(--screen-w) * 100vw); }
.post { min-width: 0; }
.postMeta { display: flex; flex-wrap: wrap; align-items: center; gap: calc(8 / var(--screen-w) * 100vw); }
.postMeta .newsDate { margin: 0 calc(6 / var(--screen-w) * 100vw) 0 0; }
.postTitle { margin-top: calc(14 / var(--screen-w) * 100vw); font-size: calc(28 / var(--screen-w) * 100vw); font-weight: 700; line-height: 1.55; color: var(--brownDark); text-wrap: balance; }
.postEyecatch { margin-top: calc(28 / var(--screen-w) * 100vw); aspect-ratio: 16 / 9; overflow: hidden; background: #f0eeea; }
.postEyecatch img { width: 100%; height: 100%; object-fit: cover; }
.postBody { margin-top: calc(36 / var(--screen-w) * 100vw); font-size: calc(15 / var(--screen-w) * 100vw); line-height: 2.1; }
.postBody > * + * { margin-top: calc(20 / var(--screen-w) * 100vw); }
.postBody h2 { margin-top: calc(52 / var(--screen-w) * 100vw); padding: calc(12 / var(--screen-w) * 100vw) calc(18 / var(--screen-w) * 100vw); border-left: calc(4 / var(--screen-w) * 100vw) solid var(--brown); background: var(--beigeLight); font-size: calc(20 / var(--screen-w) * 100vw); line-height: 1.6; color: var(--brownDark); }
.postBody h3 { margin-top: calc(36 / var(--screen-w) * 100vw); padding-bottom: calc(8 / var(--screen-w) * 100vw); border-bottom: 1px solid var(--beigeLine); font-size: calc(17 / var(--screen-w) * 100vw); line-height: 1.6; color: var(--brownDark); }
.postBody ul { padding-left: 0; }
.postBody ul li { position: relative; padding-left: calc(18 / var(--screen-w) * 100vw); }
.postBody ul li + li { margin-top: calc(6 / var(--screen-w) * 100vw); }
.postBody ul li::before { content: ""; position: absolute; left: calc(3 / var(--screen-w) * 100vw); top: 1em; width: calc(6 / var(--screen-w) * 100vw); height: calc(6 / var(--screen-w) * 100vw); border-radius: 50%; background: var(--brown); }
.noticeBox { padding: calc(20 / var(--screen-w) * 100vw) calc(24 / var(--screen-w) * 100vw); border: 1px solid var(--orange); background: #fff8ea; font-size: calc(14 / var(--screen-w) * 100vw); line-height: 1.9; }
.noticeTitle { margin-bottom: calc(4 / var(--screen-w) * 100vw); font-weight: 700; color: #b06c00; }
.postBtn { text-align: center; padding-top: calc(10 / var(--screen-w) * 100vw); }
.postShare { display: flex; align-items: center; gap: calc(10 / var(--screen-w) * 100vw); margin-top: calc(56 / var(--screen-w) * 100vw); padding-top: calc(22 / var(--screen-w) * 100vw); border-top: 1px solid var(--line); font-size: calc(13 / var(--screen-w) * 100vw); color: var(--textSub); }
.postShare p { margin-right: calc(6 / var(--screen-w) * 100vw); }
.postShare a { display: inline-flex; align-items: center; justify-content: center; min-width: calc(52 / var(--screen-w) * 100vw); padding: calc(6 / var(--screen-w) * 100vw) calc(12 / var(--screen-w) * 100vw); border: 1px solid var(--beigeLine); font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: calc(12 / var(--screen-w) * 100vw); color: var(--brown); transition: background-color .4s var(--ease); }
.postShare a:hover { background: var(--beigeLight); }
.postNav { display: grid; grid-template-columns: 1fr auto 1fr; gap: calc(16 / var(--screen-w) * 100vw); align-items: center; margin-top: calc(36 / var(--screen-w) * 100vw); padding: calc(22 / var(--screen-w) * 100vw) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: calc(13 / var(--screen-w) * 100vw); }
.postPrev span, .postNext span { display: block; font-size: calc(11 / var(--screen-w) * 100vw); color: var(--textSub); }
.postNext { text-align: right; }
.postBack { padding: calc(8 / var(--screen-w) * 100vw) calc(22 / var(--screen-w) * 100vw); border: 1px solid var(--brown); color: var(--brown); font-size: calc(13 / var(--screen-w) * 100vw); transition: background-color .4s var(--ease); }
.postBack:hover { background: var(--beigeLight); }

.postSide { position: sticky; top: calc(96 / var(--screen-w) * 100vw); display: flex; flex-direction: column; gap: calc(24 / var(--screen-w) * 100vw); }
.sideBox { padding: calc(22 / var(--screen-w) * 100vw) calc(22 / var(--screen-w) * 100vw); border: 1px solid var(--line); }
.sideTitle { padding-bottom: calc(8 / var(--screen-w) * 100vw); margin-bottom: calc(12 / var(--screen-w) * 100vw); border-bottom: 1px solid var(--brown); font-size: calc(14 / var(--screen-w) * 100vw); font-weight: 700; color: var(--brownDark); }
.sideTags { display: flex; flex-wrap: wrap; gap: calc(6 / var(--screen-w) * 100vw); }
.sideList li + li { margin-top: calc(12 / var(--screen-w) * 100vw); padding-top: calc(12 / var(--screen-w) * 100vw); border-top: 1px dashed var(--line); }
.sideList a { display: block; font-size: calc(13 / var(--screen-w) * 100vw); line-height: 1.7; }
.sideList a:hover { color: var(--brown); }
.sideList .newsDate { display: block; margin: 0 0 calc(2 / var(--screen-w) * 100vw); }
.sideBox.isProduct { background: var(--beigeLight); border-color: var(--beigeLine); text-align: center; }
.sideBox.isProduct img { width: calc(110 / var(--screen-w) * 100vw); }
.sideBox.isProduct p { margin-top: calc(10 / var(--screen-w) * 100vw); font-size: calc(13 / var(--screen-w) * 100vw); line-height: 1.8; }
.sideBox.isProduct .btn { width: 100%; min-width: 0; margin-top: calc(16 / var(--screen-w) * 100vw); }

.relatedSec { padding-top: calc(96 / var(--screen-w) * 100vw); }

/* =============== SP =============== */
@media (max-width: 768px) {
  .pageHead.isSmall { padding: calc(28 / var(--screen-w) * 100vw) calc(20 / var(--screen-w) * 100vw) calc(24 / var(--screen-w) * 100vw); }
  .breadcrumb + .sec { padding-top: calc(28 / var(--screen-w) * 100vw); }

  .listBar { flex-direction: column; align-items: flex-start; gap: calc(10 / var(--screen-w) * 100vw); margin-top: calc(30 / var(--screen-w) * 100vw); }
  .listCount strong { font-size: calc(16 / var(--screen-w) * 100vw); }
  .pager { gap: calc(6 / var(--screen-w) * 100vw); margin-top: calc(40 / var(--screen-w) * 100vw); }
  .pagerItem, .pagerNext { min-width: calc(36 / var(--screen-w) * 100vw); padding: calc(6 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }

  .usedLead { text-align: left; font-size: calc(13 / var(--screen-w) * 100vw); }
  .filterBox { margin-top: calc(28 / var(--screen-w) * 100vw); padding: calc(20 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw); }
  .filterSearch { flex-direction: column; align-items: stretch; gap: calc(8 / var(--screen-w) * 100vw); }
  .filterLabel { width: auto; padding-top: 0; font-size: calc(12 / var(--screen-w) * 100vw); }
  .searchField { max-width: none; }
  .searchField input { font-size: 16px; }
  .filterRow { flex-direction: column; gap: calc(10 / var(--screen-w) * 100vw); padding-top: calc(16 / var(--screen-w) * 100vw); }
  .chipCheck span { padding: calc(5 / var(--screen-w) * 100vw) calc(12 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }
  .filterFoot { margin-top: calc(18 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }

  .usedList { grid-template-columns: 1fr 1fr; gap: calc(26 / var(--screen-w) * 100vw) calc(12 / var(--screen-w) * 100vw); margin-top: calc(20 / var(--screen-w) * 100vw); }
  .usedName { flex-direction: column; gap: 0; font-size: calc(14 / var(--screen-w) * 100vw); }
  .usedPrice { font-size: calc(17 / var(--screen-w) * 100vw); }
  .btnCart { padding: calc(9 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }
  .btnCart::after { display: none; }

  .helpBox { flex-direction: column; align-items: stretch; gap: calc(18 / var(--screen-w) * 100vw); margin-top: calc(48 / var(--screen-w) * 100vw); padding: calc(22 / var(--screen-w) * 100vw) calc(18 / var(--screen-w) * 100vw); font-size: calc(13 / var(--screen-w) * 100vw); }
  .helpBtns { flex-direction: column; }
  .helpBtns .btn { min-width: 0; }

  .tagHead { padding: calc(22 / var(--screen-w) * 100vw) calc(18 / var(--screen-w) * 100vw); }
  .tagHeadTitle { font-size: calc(21 / var(--screen-w) * 100vw); }
  .tagHeadTitle small { display: block; margin: 0; font-size: calc(13 / var(--screen-w) * 100vw); }
  .tagHeadText { font-size: calc(13 / var(--screen-w) * 100vw); }
  .tagHeadCount { right: calc(18 / var(--screen-w) * 100vw); top: calc(22 / var(--screen-w) * 100vw); font-size: calc(18 / var(--screen-w) * 100vw); }
  .tagIndex { padding: calc(18 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw); }
  .tagIndexGroup { flex-direction: column; gap: calc(6 / var(--screen-w) * 100vw); }
  .tagIndexLabel { width: auto; }

  .orderLead { text-align: left; font-size: calc(13 / var(--screen-w) * 100vw); }
  .stepNav { justify-content: flex-start; overflow-x: auto; margin: calc(24 / var(--screen-w) * 100vw) calc(-20 / var(--screen-w) * 100vw) 0; padding: 0 calc(20 / var(--screen-w) * 100vw); scrollbar-width: none; }
  .stepNav li { flex-shrink: 0; padding: calc(8 / var(--screen-w) * 100vw) calc(20 / var(--screen-w) * 100vw) calc(8 / var(--screen-w) * 100vw) calc(26 / var(--screen-w) * 100vw); font-size: calc(11 / var(--screen-w) * 100vw); white-space: nowrap; }
  .stepNav li:first-child { padding-left: calc(16 / var(--screen-w) * 100vw); }
  .orderLayout { grid-template-columns: 1fr; gap: calc(20 / var(--screen-w) * 100vw); margin-top: calc(24 / var(--screen-w) * 100vw); }
  .orderStep { padding: calc(20 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw) calc(24 / var(--screen-w) * 100vw); }
  .stepTitle { font-size: calc(16 / var(--screen-w) * 100vw); }
  .fieldLabel { font-size: calc(13 / var(--screen-w) * 100vw); }
  .helpPop { left: auto; right: calc(-80 / var(--screen-w) * 100vw); width: calc(300 / var(--screen-w) * 100vw); }
  .helpPop::before { left: auto; right: calc(84 / var(--screen-w) * 100vw); }
  .choiceGrid, .fieldRow { grid-template-columns: 1fr; gap: calc(10 / var(--screen-w) * 100vw); }
  .fieldRow { gap: 0; }
  .orderStep .fieldRow .field + .field { margin-top: calc(20 / var(--screen-w) * 100vw); }
  .choiceBody { padding: calc(14 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw) calc(14 / var(--screen-w) * 100vw) calc(44 / var(--screen-w) * 100vw); }
  .choiceBody::before { left: calc(16 / var(--screen-w) * 100vw); top: calc(18 / var(--screen-w) * 100vw); }
  .checkGrid { grid-template-columns: 1fr 1fr; gap: calc(8 / var(--screen-w) * 100vw); }
  .checkItem span { flex-direction: column; align-items: flex-start; gap: 0; padding: calc(9 / var(--screen-w) * 100vw) calc(10 / var(--screen-w) * 100vw) calc(9 / var(--screen-w) * 100vw) calc(36 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }
  .checkItem span::before { left: calc(12 / var(--screen-w) * 100vw); }
  .selectWrap select { width: 100%; min-width: 0; font-size: 16px; }
  .dropZone { padding: calc(26 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw); }
  .formNav { flex-direction: column-reverse; }
  .formNav .btn { min-width: 0; }
  .estimate { position: static; }

  .isOrderPage .spFixNav { display: none; }
  .spEstimateBar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; align-items: center; justify-content: space-between; gap: calc(12 / var(--screen-w) * 100vw); padding: calc(10 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw) calc(12 / var(--screen-w) * 100vw); background: var(--white); border-top: 1px solid var(--brown); box-shadow: 0 calc(-4 / var(--screen-w) * 100vw) calc(14 / var(--screen-w) * 100vw) rgba(83,71,65,.12); }
  .spEstimateBar p { display: flex; flex-direction: column; font-size: calc(11 / var(--screen-w) * 100vw); line-height: 1.4; color: var(--brownDark); }
  .spEstimateBar p small { font-size: calc(10 / var(--screen-w) * 100vw); color: var(--textSub); }
  .spEstimateBar b { font-family: "Comfortaa", sans-serif; font-size: calc(22 / var(--screen-w) * 100vw); color: var(--brown); }
  .spEstimateBar b small { font-family: "Noto Sans JP", sans-serif; font-size: calc(11 / var(--screen-w) * 100vw); color: var(--brownDark); }
  .spEstimateBar .btn { min-width: calc(130 / var(--screen-w) * 100vw); padding: calc(12 / var(--screen-w) * 100vw) calc(28 / var(--screen-w) * 100vw); }

  .tabTags { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(-20 / var(--screen-w) * 100vw); padding: 0 calc(20 / var(--screen-w) * 100vw) calc(4 / var(--screen-w) * 100vw); scrollbar-width: none; }
  .tabTag { flex-shrink: 0; padding: calc(6 / var(--screen-w) * 100vw) calc(14 / var(--screen-w) * 100vw); font-size: calc(12 / var(--screen-w) * 100vw); }
  .listCount.isCenter { margin-top: calc(20 / var(--screen-w) * 100vw); }
  .newsList.isArchive { gap: 0; margin-top: calc(16 / var(--screen-w) * 100vw); }

  .postLayout { grid-template-columns: 1fr; gap: calc(48 / var(--screen-w) * 100vw); padding-top: calc(32 / var(--screen-w) * 100vw); }
  .postTitle { margin-top: calc(10 / var(--screen-w) * 100vw); font-size: calc(21 / var(--screen-w) * 100vw); }
  .postEyecatch { margin-top: calc(20 / var(--screen-w) * 100vw); }
  .postBody { margin-top: calc(26 / var(--screen-w) * 100vw); font-size: calc(14 / var(--screen-w) * 100vw); line-height: 2; }
  .postBody > * + * { margin-top: calc(16 / var(--screen-w) * 100vw); }
  .postBody h2 { margin-top: calc(40 / var(--screen-w) * 100vw); padding: calc(10 / var(--screen-w) * 100vw) calc(14 / var(--screen-w) * 100vw); font-size: calc(17 / var(--screen-w) * 100vw); }
  .postBody h3 { margin-top: calc(28 / var(--screen-w) * 100vw); font-size: calc(15 / var(--screen-w) * 100vw); }
  .noticeBox { padding: calc(16 / var(--screen-w) * 100vw) calc(16 / var(--screen-w) * 100vw); font-size: calc(13 / var(--screen-w) * 100vw); }
  .postShare { flex-wrap: wrap; margin-top: calc(40 / var(--screen-w) * 100vw); }
  .postShare p { width: 100%; }
  .postNav { grid-template-columns: 1fr 1fr; font-size: calc(12 / var(--screen-w) * 100vw); }
  .postBack { grid-column: 1 / -1; grid-row: 2; justify-self: center; }
  .postSide { position: static; }
  .relatedSec { padding-top: calc(64 / var(--screen-w) * 100vw); }
}

/* 選んだ商品では選べない項目 */
.segment label.isDisabled, .checkItem.isDisabled { cursor: not-allowed; }
.segment label.isDisabled span, .checkItem.isDisabled span { background: #f3f1ee; color: #a59d96; }
.segment label.isDisabled em, .checkItem.isDisabled em { color: #a59d96; }