/* 買取査定 --------------- */
#kaitori #pan { max-width: 1080px; margin: 5px auto 0; padding: 0; }
.inner2 { width: 1000px; margin: auto; }
p.btn-def { margin-block: unset;}

#kaitori .info a.tel { padding-left: 45px; color: #1563af; font-size: 2.8em; font-weight: bold; line-height: 1.3; position: relative;}
#kaitori .info a.tel::before {content: ''; position: absolute; width: 30px; height: 30px; top: 33%; left: 0; background: url(/img/icon_fleedial.svg) no-repeat center / contain;}

section .btn-def { min-width: 220px; }
.sec-box { padding-block: min(8.5%, 60px); }
.ttl-sec { position: relative; margin-bottom: .8em; padding-bottom: .3em; font-size: 2.25em; font-weight: 700; line-height: 1.4; text-align: center; }
.ttl-sec::after {position: absolute; content: ''; display: block; bottom: 0; left: 50%; width: 1.6em; height: 2px; transform: translateX(-50%); background-color: var(--color-base); }

.mt25 { margin-top: 2.5em; }
.mt3 { margin-top: 3em; }

/* topコンテンツ */
.kaitori-top { display: grid; grid-template-columns: 52% 1fr; align-items: stretch; max-width: 1100px; margin-inline: auto; margin-top: 3em;}
.kaitori-top img { width: 100%;}

.kaitori-top .form-lead .submit { width: 100%; margin-block: unset;}
.kaitori-top .form-lead .form-txt { margin-block: unset; padding-block: .7em; font-size: 1.5em; color: var(--color-wht); font-weight: 700; text-align: center; background-color: var(--color-base); }
.kaitori-top .form-lead .list { display: grid; grid-template-columns: repeat(2,1fr); justify-items: center; gap: 1em; width: 95%; margin: 1em auto .3em;}
.kaitori-top .form-lead .list li { width: max-content; font-size: 1.2em; color: var(--color-base); text-align: center; font-weight: 600; position: relative;}
.kaitori-top .form-lead .list li::before,
.kaitori-top .form-lead .list li::after { content: ''; position: absolute; top: 50%; transform: translateY(-50%); width: .4em; height: 70%; border-style: solid ;  border-width: 0 2px 0px 2px;}
.kaitori-top .form-lead .list li::before { left: -.5em; rotate: -25deg;}
.kaitori-top .form-lead .list li::after { right: -.5em; rotate: 25deg;}

.kaitori-top .form-wrap {margin-inline: .7em; border: 2px solid var(--color-gry1); border-radius: 6px;}
.kaitori-top .top-form form th.required::after { background-color: var(--color-base); }
.kaitori-top .ttl { align-items: center; gap: .7em; padding: .5em 1em; font-size: 1.3em; font-weight: 700; background-color: var(--color-sub1); border-radius: 5px 5px 0 0;}
.kaitori-top .ttl::before { content: none; }
.kaitori-top .ttl .main { font-size: 1em; color: var(--color-wht);}
.kaitori-top .ttl .sub { padding-inline: .3em; color: var(--color-base); background-color: var(--color-wht); border-radius: 3px;}
.kaitori-top .top-tbl { width: 100%; margin-block: 1em .5em; border-collapse: separate; border-spacing: 15px;}
.kaitori-top .top-tbl :where(th,td) { display: block;}
.kaitori-top .top-tbl th { margin-bottom: .3em; padding-block: .3em; background-color: var(--color-gry1); position: relative;}
.kaitori-top .top-tbl select { width:100%; }
.kaitori-top .submit { width: 95%; margin: 1em auto 1em; position: relative;}
/* .kaitori-top .submit::before { content: ''; position: absolute; top: 50%; left: 2em; transform: translateY(-50%); width: 2.2em; height: 2.2em; background: url(../img/common/ico-search.svg) no-repeat center / contain;} */
.kaitori-top .submit input { display: inline-block; width: 100%; margin-inline: unset; padding-block: .5em .4em; font-size: 1.5em; font-weight: bold; background-color: var(--color-sub1); border: none; border-radius: 1.5em; box-shadow: 0 5px 0 #999;}
.kaitori-top .submit input:hover { color: #fff; background-color: var(--color-sub1) !important; transition: none; }

.marker { font-size: clamp(17px,3vw,22px);}
.secttl:first-child { margin-top: unset;}


.link-list-wrap { margin-block: 3em;}
.bg-gry + .link-list-wrap { margin-top: 4em;}
.link-list { display: grid; grid-template-columns: repeat(1,1fr); gap: 1.5em;}
.link-list.satei { row-gap: 2em;}
.link-list > li { width: 100% !important; }
.link-list p { margin-block: unset;}

.link-list .btn-border { width: 100%;}
.link-list .satei_btn,
.tel-list .satei_btn { display: block; padding: 1em .7em .7em; font-size: clamp(20px,3vw,24px); color: var(--color-wht); font-weight: 700; text-align: center; border-radius: 10px; position: relative;}
.link-list .satei_btn .sub,
.tel-list .satei_btn .sub { position: absolute; top: -1.2em; left: 50%; transform: translateX(-50%); width: 30%; min-width: fit-content; padding: .2em 1.5em .1em; font-size: .65em; color: var(--color-text); background-color: var(--color-wht); border: 2px solid var(--color-base); border-radius: 2em;}
.link-list .satei_btn .sub::before { content: ''; position: absolute; bottom: -.5em; left: 50%; transform: translateX(-50%); width: 1em; height: .7em; background-color: var(--color-wht); clip-path: polygon(100% 0, 0 0, 50% 100%);}
.link-list .l-form .satei_btn { display: grid; align-items: center; height: 100%; padding-top: 1em; background-color: var(--color-base);}
.tel-wrap { margin-top: 2em; padding: 1em; background: #e5f9e5; }
.tel-ttl { font-size: clamp(1.3rem, 3vw, 25px); margin-block: 0 .3em; text-align: center; font-weight: bold; }
.tel-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7em; }
.tel-list .satei_btn { padding: 0; background-color: #fff; border: 2px solid var(--color-sub5);}
.tel-list .satei_btn .l-name { margin-top: 0; font-size: .9em; background: var(--color-sub5); border-top-left-radius: 5px; border-top-right-radius: 5px;}
.tel-list .satei_btn .sub { border-color: var(--color-sub2);}
.tel-list .satei_btn .num { display: inline-block; margin-block: .3em; padding-left: .75em; font-size: 1.2em; color: var(--color-sub5); line-height: 1; font-family: 'Helvetica','Arial',sans-serif; position: relative;}
.tel-list .satei_btn .num::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: .6em; height: .8em; background-color: var(--color-sub5); mask: url(../img/icon_tel_wht.svg) no-repeat center / contain;}

.pex-list .item { margin-inline:.5em ; margin-bottom: 1em; box-shadow: var(--shadow1); border-radius: 5px;}
.pex-list .pex-ttl { margin: 0; padding: .5em; font-size: 1.1em; color: #fff; font-weight: bold; text-align: center; line-height: 1.4; background-color: var(--color-base); border-radius: 10px 10px 0 0;}
.pex-list .pex-img { padding: .95em; padding-bottom: unset;}
.pex-list .pex-data { padding: 0 .7em .5em;}
.pex-list .pex-price { align-items: baseline;}
.pex-list .pex-price dt { font-weight: bold;}
.pex-list .pex-price em { font-size: 1.7em; font-family: 'Helvetica','Arial',sans-serif;}
.pex-list .pex-info { display: grid; grid-template-columns: 5em 1fr; gap: .3em; margin-top: .5em; font-size: .95em;}
.pex-list .pex-info dt { color: var(--color-gry4);}

/* スライド設定 */
.slick-track {display: flex;}
.slick-slide {height: auto !important;}

.dots-wrap { display: flex; justify-content: center; gap: .6em; margin-block: .8em; }
.dots-wrap li { width: min(.7em, 16px); height: min(.7em, 16px); cursor: pointer; background: var(--color-gry3); border-radius: 50%; }
.dots-wrap li button { display: none; padding: 0; appearance: none; outline: none; border: none; background-color: transparent; }

.arrows .slide-arrow { position: absolute; top: calc(50% - 50px); z-index: 1; opacity: .95; width: 20px; height: 90px; background: var(--color-base); border-radius: 2px; border: none; }
.arrows .slide-arrow::before{ position: absolute; content: ""; top: 0; bottom: 0; left: 0; right: 0; width: .5rem; height: .5rem; margin: auto; border-top: 2px solid var(--color-wht); border-right: 2px solid var(--color-wht); }
.arrows .next-arrow::before { rotate: 45deg; }
.arrows .prev-arrow::before { rotate: -135deg; }

.arrows .prev-arrow { left: -.5em;}
.arrows .next-arrow { right: -.5em;}

.bg-gry { background-color: var(--color-gry1); }
.bg-gry .label-list > li { border-color: #ccc; background-color: var(--color-wht); }
.label-list { display: grid; gap: 1.2em; padding-left: unset; counter-reset: label-num; }
.label-list.reason { grid-template-columns: repeat(3,1fr);}
.label-list > li { position: relative; padding: 3em 1em 1em; border: 1px solid var(--color-sub1); border-radius: 6px; counter-increment: label-num; list-style: none; }
.label-list.reason li { display: grid; grid-template-rows: subgrid; grid-row: span 2; row-gap: .5em;}
.label-list.reason li:nth-child(2) .ttl { font-size: 1.3em; }
.label-list .label { position: absolute; top: 0; left: 0; padding: .2em .5em; width: 100%; font-size: 1em; font-weight: 700; font-family: 'Helvetica', 'Arial', sans-serif; text-align: center; color: var(--color-wht); background-color: var(--color-sub1); border-radius: 5px 5px 0 0; }
.label-list .label::after { content: counter(label-num, decimal-leading-zero); margin-left: .2em; font-size: 1.2em; }
.label-list .main-txt, .label-list .main-ttl, .label-list .ttl { font-size: 1.7em; color: var(--color-sub3); font-weight: 800; }
:where(.box-list,.label-list) .txt { margin-block: unset; }
.label-list .ttl { margin-block: unset; text-align: center; line-height: 1.4; color: var(--color-sub1); }
.label-list.reason .ttl { align-self: center; font-size: 1.4em; color: var(--color-base);}
.label-list.reason .label { background-color: var(--color-base); }

/* 流れ */
.label-list.flow { grid-template-columns: 1fr; row-gap: 2em;}
.label-list.flow > li { display: grid; grid-template-columns: 20% 1fr; gap: .5em 1.5em; align-items: center; position: relative;}
.label-list.flow > li:not(:last-child)::before { content: ''; position: absolute; bottom: -1.5em; left: 50%; transform: translateX(-50%); width: 1em; height: 1em; background: url(../img/kaitori/arrow-down-red.svg) no-repeat center / contain; }
.label-list.flow .img-wrap { text-align: center;}
.label-list.flow img { max-width: 100px;}
.label-list.flow .ttl { margin-bottom: .4em; padding-bottom: .3em; font-size: 1.4em; text-align: start; border-bottom: 1px solid var(--color-gry1);}

.sec-btm { margin-block: 4em; }

/* テーブル */
.hikaku .tbl th { background-color: var(--color-sub1) !important; border-radius: unset; }
.hikaku .tbl thead th.bg-red { background-color: var(--color-base) !important; }
.hikaku .tbl td.bg-red2 { background-color: #fff4f5; }
.hikaku { margin-block: 4em 0; }
.tbl { border-collapse: separate; background-color: unset !important; }
.hikaku .tbl { width: 100%; border-spacing: 2px; }
.tbl :where(th,td) { padding-block: .7em .9em !important; font-size: .95em; }
.hikaku .tbl thead th { background-color: var(--color-sub1); }
.bg-gry .tbl th, .tbl thead th { color: var(--color-wht);background-color: var(--color-sub3); }
.hikaku .tbl thead th { background-color: var(--color-sub1); }
.tbl td { padding-inline: .7em !important; }
.hikaku .tbl td { border-bottom: 1px solid var(--color-gry1) !important; background-color: var(--color-wht); }
.hikaku .tbl th { width: 20%; }

/* 買取に必要なもの */
.drawer.need { width: 80%; margin-inline: auto;}
.drawer.need dt { padding: .5em;}
.drawer.need dt h2 { text-align: center; font-weight: bold;}
.drawer.need .ttl { text-align: center;}
.drawer.need dd > .disc { display: grid; grid-template-columns: repeat(2,1fr);}

/* FAQ・買取に必要なもの、など */
.faq-box { margin-top: 3em; }
.drawer > div:not(:last-child) { margin-bottom: 1.5em; }
.drawer :is(dt,dd) { position: relative; border-radius: 5px;}
.drawer :is(dt,dd)::before {
  position: absolute; top: .25em; left: .65em; font-size: 1.4em;  line-height: 1.5; text-align: center; }
:is(.open) dt{ border-radius: 5px 5px 0 0;}
.drawer dt { padding: .5em .5em .5em 2.5em; font-size: 1.12em; font-weight: 600; color: #fff; background: var(--color-sub1); cursor: pointer;}
.drawer.faq > div{ border: 1px solid #ccc; border-radius: 5px; background-color: var(--color-wht);}
.drawer.faq dt { color: var(--color-text); background-color: var(--color-wht);}
.drawer.faq dt::before { content: 'Q'; color: var(--color-base); font-family:'Helvetica','Arial',sans-serif;}
.drawer dt span { position: absolute; top: 50%; right: 1.3em; translate: 0 -50%; width:
1em; height: 1em;}
.drawer dt span::before,
.drawer dt span::after { content: ''; position: absolute; top: 50%; left: 50%; translate:-50% -50%; width: 100%; height: 2px; background: #fff; }
.drawer dt span::after { rotate:90deg; transition: all .3s;}
.drawer.faq dt span::before,
.drawer.faq dt span::after { background: var(--color-text);}

.drawer > div.open dt span::after,.drawer.open dt span::after { rotate:180deg;}
.drawer dd { padding: 1.5em 2em 1.5em; background: #fffaed;}
.drawer.faq dd { margin: .3em 1em 1em 2.7em; padding: .7em 3em; padding-right: .7em; background-color: var(--color-gry0); border-radius: 3px; }
.drawer.faq dd::before { content: 'A'; top: .33em; left: .9em; font-weight: bold; font-family: 'Helvetica','Arial',sans-serif;}
.drawer dd figure { width: 40%; margin-top: 2em;}
.drawer dd figure.size-w { width: 80%;}
.drawer dd figure figcaption { margin-top: .5em;}

/* information ------------- */
[class^="infoBox-sc-"] .scrollBox { height: 300px; overflow-y: auto; }
[class^="infoBox-sc-"] .scrollBox p { margin: 0; padding: 1.1em 1em; }
[class^="infoBox-sc-"] .scrollBox p:nth-child(odd) { background: #eee; }

/* pictureタグでだし分け用 */
.bnr-wrap { display: grid; justify-content: center;}

/* form */
form .tbl th {position: relative; background-color: var(--color-sub1);}
form th::after { position: absolute; top: 50%; right: 1em; transform: translateY(-50%); align-self: center; padding: .3em .5em .4em; font-size: .75em; line-height: 1; white-space: nowrap; background-color: var(--color-gry3);}
form th.required::after { content: '\5FC5\9808'; color: var(--color-wht); background-color: var(--color-base);}
form .confirm th::after { display:none; }
input.l { width: 98% !important; }

@media (min-width: 1100px) {
  .inner-narrow { width: 860px; margin-inline: auto; }
}