@charset "utf-8";

:root {
  --faq-bg:#fff;
  --muted:#f5f5f5;
  --text:#333;
  --border:#ddd;
}

.wcfront_faq_search { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.wcfront_search_wrap { flex:1 1 auto; min-width:0; }
.wcfront_filter_wrap { flex:0 0 auto; }
.wcfront_search_title { font-weight:bold; margin-bottom:12px; display:block; }

.wcfront_faq_search_sticky { background:var(--faq-bg); padding-bottom:2px; }
.wcfront_faq_search_sticky.is-fixed { position:fixed; z-index:10; box-shadow:0 1px 0 var(--border); padding:20px 0; max-height:calc(100vh - var(--faq-sticky-top, 0) - 40px); overflow-y:auto; }
.wcfront_faq_search_sticky.is-fixed .wcfront_search_accordion { margin-bottom:0; }

.wcfront_search_accordion { margin-bottom:20px; }
.wcfront_search_accordion_trigger { display:block; padding:14px 20px; background:var(--muted); border-radius:6px; font-weight:500; list-style:none; text-align:center; text-decoration:none; }
.wcfront_search_accordion_trigger:hover { text-decoration:underline; }
.wcfront_search_accordion_trigger .wcfront_search_state_summary { display:inline; margin-left:0.25em; font-size:0.9em; font-weight:normal; opacity:0.85; }
.wcfront_search_accordion_trigger:hover .wcfront_search_state_summary { opacity:1; }
.wcfront_search_accordion_trigger::-webkit-details-marker { display:none; }
.wcfront_search_accordion_trigger::marker { content:none; }
.wcfront_search_accordion[open] .wcfront_search_accordion_trigger { display:none; }
.wcfront_search_area { background:var(--muted); padding:24px; border-radius:0 0 6px 6px; }
.wcfront_search_accordion[open] .wcfront_search_area { border-radius:6px; }
.wcfront_search_accordion_close { margin:20px 0 0; padding:0; text-align:center; }
.wcfront_search_accordion_close_btn { background:none; border:none; font:inherit; font-weight:500; color:inherit; text-decoration:none; padding:0; }
.wcfront_search_accordion_close_btn:hover { text-decoration:underline; }
.wcfront_search_area .wcfront_search_section { margin-bottom:20px; }
.wcfront_search_area .wcfront_search_section:last-child { margin-bottom:0; }
.wcfront_search_area .wcfront_category_section { margin-top:20px; margin-bottom:20px; }
.wcfront_search_area .wcfront_category_section:last-child { margin-bottom:0; }
.wcfront_search_area .wcfront_tag_section { margin-top:20px; }
.wcfront_faq_search input[type="text"] { width:100%; padding:10px 12px; border:1px solid #ccc; border-radius:6px; }

.wcfront_category_top label { display:block; margin-bottom:8px; font-weight:bold; }
.wcfront_category_top select { width:100%; padding:10px 12px; border:1px solid #ccc; border-radius:6px; background:var(--faq-bg); }
.wcfront_category_top select:focus { outline:none; box-shadow:0 0 0 3px var(--wc-main2, rgba(0,0,0,0.08)); border-color:var(--wc-main1, #333); }

.wcfront_faq_search .button.ov { padding:10px 16px; white-space:nowrap; background:var(--wc-main1, #333); color:#fff; border:none; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; }
.wcfront_faq_search .button.ov .wcfront_btn_text_sp { display:none; }
.wcfront_faq_search .button.ov .wcfront_btn_text_pc { display:inline; }

.faq-category-group { margin-bottom:40px; }

.wcfront_category_section { background:var(--muted); padding:12px; margin-bottom:20px; border-radius:4px; }
.wcfront_category_section > summary { font-weight:bold; padding:8px; outline:none; list-style:none; display:block; position:relative; overflow:visible; }
.wcfront_category_section > summary::-webkit-details-marker { display:none; }
.wcfront_category_section > summary::marker { content:none; }
.wcfront_category_section > summary::-moz-list-bullet { display:none; }

.wcfront_tag_title { font-weight:bold; margin-bottom:14px; display:block; }
.wcfront_tag_list { display:flex; flex-wrap:nowrap; gap:8px; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
.wcfront_tag_list .tag { flex:0 0 auto; margin-right:0; }
.wcfront_tag_list label.tag { flex:0 0 auto; margin-right:0; }

.wcfront_tag_section .tag { display:inline-flex; align-items:center; justify-content:center; gap:8px; box-sizing:border-box; padding:8px 18px; border-radius:20px; background:var(--faq-bg); border:1px solid #ddd; margin-right:8px; color:inherit; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wcfront_tag_section label.tag { position:relative; }
.wcfront_tag_section .tag.checked { background:var(--wc-main1, #333); color:#fff; border-color:var(--wc-main1, #333); }
.wcfront_tag_section label.tag.checked { background:var(--wc-main1, #333); color:#fff; border-color:var(--wc-main1, #333); }

.wcfront_tag_section input.tag-checkbox { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0; }

.wcfront_search_area .wcfront_category_section { background:transparent; padding:0; margin-top:20px; margin-bottom:20px; border-radius:0; }
.wcfront_search_area .wcfront_category_section > summary { padding:6px 0; }

@container wciBase (width < 768px) {
  .wcfront_search_area { padding:24px 10px; }
  .wcfront_faq_search_sticky.is-fixed { padding:10px 0; }
  .wcfront_search_accordion_trigger { padding:10px; }
  .wcfront_faq_search { flex-wrap:nowrap; }
  .wcfront_faq_search .wcfront_search_wrap { min-width:0; }
  .wcfront_faq_search .button.ov .wcfront_btn_text_pc { display:none; }
  .wcfront_faq_search .button.ov .wcfront_btn_text_sp { display:inline; }
  .wcfront_faq_search .button.ov { padding-left:10px; padding-right:10px; }
}