/* FAQの配置。状態演出は90-motion.css。 */

/* 全数値は元のraw宣言。QA未合格の外部候補。 */

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-symbol {
  display: grid;
  place-items: center;
  color: var(--c-navy);
}

.faq-symbol svg {
  width: 22px;
  height: 22px;
}

.faq-minus {
  display: none;
}

.faq-item[open] .faq-minus {
  display: inline-flex;
}

.faq-item[open] .faq-plus {
  display: none;
}

.faq-answer {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  padding: 20px 14px;
  margin: 0 8px 8px;
  background: var(--c-ivory);
}

.faq-answer p {
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
}

.faq-item {
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-kraft);
  box-shadow: 0 6px 16px rgba(34,57,92,.08);
}

.faq-item summary {
  list-style: none;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  padding: 18px 14px;
  min-height: 72px;
  font-family: "Zen Maru Gothic", sans-serif;
  font-size: 17px;
  font-weight: 700;
  word-break: auto-phrase;
  overflow-wrap: break-word;
  line-height: 1.6;
}

.faq-item summary > span:nth-child(2) {
  min-width: 0;
}

@media(max-width:1023px) {
  .sp-faq {
    min-height:0;
    padding:32px 17px 24px;
  }
}

@media(max-width:1023px) {
  .sp-faq .sp-heading {
    height:76px;
    padding-top:26px;
    margin:0 0 10px;
  }
}

@media(max-width:1023px) {
  .sp-faq .sp-heading>.script {
    left:25%;
    font-size:38px;
  }
}

@media(max-width:1023px) {
  .sp-faq .sp-heading h2 {
    font-size:27px;
  }
}

@media(max-width:1023px) {
  .sp-faq-list {
    display:grid;
    gap:8px;
  }
}

@media(max-width:1023px) {
  .sp-faq .faq-item {
    margin:0;
    box-shadow:0 6px 16px rgba(34,57,92,.08);
  }
}

@media(max-width:1023px) {
  .sp-faq .faq-item summary {
    min-height:50px;
    padding:10px 12px;
    gap:9px;
    font-size:15px;
    line-height:1.4;
  }
}

@media(max-width:1023px) {
  .sp-faq .qa-letter {
    width:28px;
    height:28px;
    flex:0 0 28px;
    font-size:21px;
  }
}

@media(max-width:1023px) {
  .sp-faq .faq-symbol {
    color:var(--c-camel);
  }
}

@media(max-width:1023px) {
  .sp-faq .faq-answer {
    padding:7px 12px 13px;
    gap:9px;
  }
}

@media(max-width:1023px) {
  .sp-faq .faq-answer p {
    font-size:14px;
    line-height:1.5;
  }
}

@media(max-width:1023px) {
  .sp-faq .sp-heading>[data-ornament="english-qa"] {
    top:-22px;
    --orn-w:78px!important; /* 理由: 元inline切り抜き値より優先する既存装飾寸法 */
    --orn-h:42px!important; /* 理由: 元inline切り抜き値より優先する既存装飾寸法 */
    width:78px;
    height:42px;
  }
}

@media (min-width: 1024px) {
  .faq-item summary {
    font-size: 20px;
    grid-template-columns: 44px minmax(0, 1fr) 24px;
    padding: 20px 18px;
    gap: 15px;
  }
}

@media (min-width: 1024px) {
  .faq-answer {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 15px;
    padding: 22px 18px;
  }
}

@media (min-width: 1024px) {
  .faq-answer p {
    font-size: 18px;
  }
}

@media(min-width:1024px) {
  .pc-faq {
    height:800px;
  }
}

@media(min-width:1024px) {
  .pc-faq-heading {
    position:absolute;
    top:55px;
    left:40px;
    right:40px;
    text-align:center;
    padding-top:62px;
  }
}

@media(min-width:1024px) {
  .pc-faq-heading>.script {
    font-size:64px;
  }
}

@media(min-width:1024px) {
  .pc-faq-heading>.script::before {
    content:"";
    position:absolute;
    width:125px;
    height:1px;
    background:var(--c-camel);
    top:55%;
    transform:rotate(8deg);
    right:calc(100% + 22px);
  }
}

@media(min-width:1024px) {
  .pc-faq-heading>.script::after {
    content:"";
    position:absolute;
    width:125px;
    height:1px;
    background:var(--c-camel);
    top:55%;
    transform:rotate(8deg);
    left:calc(100% + 22px);
  }
}

@media(min-width:1024px) {
  .pc-faq-heading h2 {
    font-size:56px;
    white-space:nowrap;
  }
}

@media(min-width:1024px) {
  .pc-faq-columns {
    position:absolute;
    top:275px;
    left:4.5%;
    right:4.5%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:32px;
  }
}

@media(min-width:1024px) {
  .pc-faq-columns>div {
    min-width:0;
  }
}

@media(min-width:1024px) {
  .pc-faq .faq-item {
    margin:0 0 15px;
    padding:0;
    border:0;
    box-shadow:0 6px 16px rgba(34,57,92,.08);
    background:var(--c-kraft) url("../assets/deco/craft-paper.webp") center/680px auto;
  }
}

@media(min-width:1024px) {
  .pc-faq .faq-item summary {
    display:grid;
    grid-template-columns:40px 1fr 28px;
    gap:15px;
    align-items:center;
    min-height:60px;
    padding:8px 16px;
    font:700 20px/1.4 "Zen Maru Gothic",sans-serif;
  }
}

@media(min-width:1024px) {
  .pc-faq .qa-letter {
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:50%;
    font:400 31px/1 "Playfair Display",serif;
    background:var(--c-dusty-blue);
    color:white;
  }
}

@media(min-width:1024px) {
  .pc-faq .qa-letter--answer {
    background:var(--c-terracotta);
  }
}

@media(min-width:1024px) {
  .pc-faq .faq-answer {
    display:grid;
    grid-template-columns:40px 1fr;
    gap:15px;
    margin:0 10px 10px;
    padding:15px;
    background:white;
  }
}

@media(min-width:1024px) {
  .pc-faq .faq-answer p {
    font-size:18px;
    line-height:1.65;
  }
}

@media(min-width:1024px) {
  .pc-faq .faq-symbol {
    color:var(--c-camel);
    width:24px;
  }
}

@media(min-width:1024px) {
  .pc-faq .faq-symbol .icon {
    width:24px;
    height:24px;
  }
}

@media(min-width:1024px) {
  .pc-faq-leaf--top {
    left:-50px;
    top:0;
    width:220px;
    height:220px!important; /* 理由: 通常宣言の詳細度/順序を打ち消す: .p1-frame img / 同時適用するimportant宣言との元の勝者を維持: .p1-leaves */
    transform:rotate(-10deg);
  }
}

@media(min-width:1024px) {
  .pc-faq-leaf--bottom {
    right:-50px;
    bottom:10px;
    width:220px;
    height:220px!important; /* 理由: 通常宣言の詳細度/順序を打ち消す: .p1-frame img / 同時適用するimportant宣言との元の勝者を維持: .p1-leaves */
    transform:rotate(180deg);
  }
}

@media(min-width:1024px) {
  .pc-faq-heading>[data-pc-ornament] {
    left:50%;
    transform:translateX(-50%);
    top:-25px;
    --pc-word-w:160px;
    --pc-word-h:80px;
  }
}