@charset "UTF-8";
/*-----------------------------------------------------
Q&A（よくある質問）　20261020新規
----------------------------------------------------- */
/*滞在色変*/
#FAQ nav.localnav #menu07 a { background: #f0ecde; }

#FAQ #main { background: #f1efeb; padding-bottom: clamp(60px, 8vw, 120px); }

/* 見出しエリア */
#FAQ .faq_head { position: relative; height: 280px; background: url(../img/faq/head_l.png) left top / auto 100% no-repeat, url(../img/faq/head_r.png) right top / auto 100% no-repeat; display: flex; align-items: center; justify-content: center; }
#FAQ .faq_ttl { text-align: center; color: #403c3b; font-weight: normal; line-height: 1; }
#FAQ .faq_ttl .en { display: inline-block; font-size: 54px; letter-spacing: .08em; padding: 0 28px; border-left: 6px solid #4a8357; border-right: 6px solid #4a8357; }
#FAQ .faq_ttl .ja { display: block; font-size: 14px; letter-spacing: .1em; margin-top: 6px; }

/* セクション */
#FAQ .faq_body { width: 90%; max-width: 1136px; margin: 0 auto; }
#FAQ .faq_sec { background: #fff; }
#FAQ .faq_sec + .faq_sec { margin-top: 70px; }
#FAQ .faq_sec_ttl { background: #4a8357; color: #fff; font-weight: normal; font-size: 26px; letter-spacing: .05em; line-height: 1.4; padding: 17px 28px; }
#FAQ .faq_list { padding: 0 28px 30px; }

/* 質問 */
#FAQ .faq_item { border-top: 1px solid #62936d; }
#FAQ .faq_item:first-child { border-top: none; }
#FAQ .faq_q { position: relative; cursor: pointer; font-size: 22px; letter-spacing: .05em; line-height: 1.5; padding: 24px 70px 24px 0; transition: background .3s; }
#FAQ .faq_q::before, #FAQ .faq_q::after { content: ""; position: absolute; top: 50%; }
#FAQ .faq_q::before { right: 0; width: 26px; height: 26px; margin-top: -13px; border-radius: 50%; background: #4a8357; border: 1px solid #4a8357; box-sizing: border-box; transition: background .3s; }
#FAQ .faq_q::after { right: 6px; width: 14px; height: 14px; margin-top: -7px; background: linear-gradient(#fff, #fff) center / 14px 2px no-repeat, linear-gradient(#fff, #fff) center / 2px 14px no-repeat; }
#FAQ .faq_q:hover { opacity: .75; }

/* 開いた状態 */
#FAQ .faq_item.is-open { border-top-color: #9ebca5; }
#FAQ .faq_item.is-open .faq_q { background: #d3e1d6; margin: 0 -28px; padding-left: 28px; padding-right: 98px; border-bottom: 1px dashed #9ebca5; }
#FAQ .faq_item.is-open .faq_q::before { right: 28px; background: transparent; border-color: #4a8357; }
#FAQ .faq_item.is-open .faq_q::after { right: 34px; background: linear-gradient(#4a8357, #4a8357) center / 14px 2px no-repeat; }

/* 回答 */
#FAQ .faq_a { display: none; }
#FAQ .faq_a_inner { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; padding: 40px 0; }
#FAQ .faq_a_txt { flex: 1; }
#FAQ .faq_a_txt p { font-size: 19px; line-height: 1.85; letter-spacing: .03em; }
#FAQ .faq_illust { width: 134px; flex-shrink: 0; }
#FAQ .faq_table { width: 100%; margin-top: 10px; border-collapse: collapse; font-size: 17px; line-height: 1.5; }
#FAQ .faq_table th, #FAQ .faq_table td { border: 1px solid #3d3939; padding: 6px 12px; font-weight: normal; }
#FAQ .faq_table th { width: 22%; text-align: center; white-space: nowrap; }

/*　600pxからレスポンシブ*/
@media only screen and (max-width: 600px) {
  #FAQ .faq_head { height: 120px; }
  #FAQ .faq_ttl .en { font-size: 24px; padding: 0 12px; border-width: 3px; }
  #FAQ .faq_ttl .ja { font-size: 8px; margin-top: 4px; }
  #FAQ .faq_body { width: auto; margin: 0 20px; }
  #FAQ .faq_sec + .faq_sec { margin-top: 40px; }
  #FAQ .faq_sec_ttl { font-size: 13px; padding: 9px 12px; }
  #FAQ .faq_list { padding: 0 12px 10px; }
  #FAQ .faq_q { font-size: 11px; padding: 12px 26px 12px 0; }
  #FAQ .faq_q::before { width: 12px; height: 12px; margin-top: -6px; }
  #FAQ .faq_q::after { right: 3px; width: 6px; height: 6px; margin-top: -3px; background-size: 6px 1px, 1px 6px; }
  #FAQ .faq_item.is-open .faq_q { margin: 0 -12px; padding-left: 12px; padding-right: 38px; }
  #FAQ .faq_item.is-open .faq_q::before { right: 12px; }
  #FAQ .faq_item.is-open .faq_q::after { right: 15px; background-size: 6px 1px; }
  #FAQ .faq_a_inner { padding: 20px 0; gap: 10px; }
  #FAQ .faq_a_txt p { font-size: 11px; line-height: 1.8; }
  #FAQ .faq_illust { width: 45px; }
  #FAQ .faq_table { font-size: 8px; }
  #FAQ .faq_table th, #FAQ .faq_table td { padding: 3px 4px; }
}