@charset "UTF-8";
/* よくある質問（/faq 一覧 ＋ TOP #contents-faq で共用）
   アコーディオン部品は .faq-〇〇 のグローバルクラス。/faq 限定の指定は #faq でスコープ */
@media screen and (min-width: 768px),print {

#faq main{width: 1000px;margin: 0 auto 120px;}
#faq .faq-none{font-size: 15px;line-height: 2;text-align: center;padding: 60px 0;}

.faq-list{border-top: 1px solid #D6D6D4;}
.faq-item{border-bottom: 1px solid #D6D6D4;}
.faq-q{display: flex;align-items: flex-start;gap: 20px;padding: 28px 70px 28px 10px;position: relative;cursor: pointer;list-style: none;transition: opacity .3s;}
.faq-q::-webkit-details-marker{display: none;}
.faq-q:hover{opacity: .7;}
.faq-badge{flex-shrink: 0;width: 26px;font-size: 24px;line-height: 1.2;font-weight: 500;text-align: center;}
.faq-q .faq-badge{color: #E0961E;}
.faq-q-text{flex: 1;min-width: 0;font-size: 16px;line-height: 1.8;font-weight: 500;letter-spacing: 0.8px;padding-top: 1px;}
.faq-toggle{position: absolute;top: 50%;right: 20px;width: 16px;height: 16px;margin-top: -8px;}
.faq-toggle::before,
.faq-toggle::after{content: "";position: absolute;top: 50%;left: 0;width: 100%;height: 1px;background: #333333;transition: transform .3s;}
.faq-toggle::after{transform: rotate(90deg);}
.faq-item[open] .faq-toggle::after{transform: rotate(0deg);}
.faq-a{display: flex;align-items: flex-start;gap: 20px;padding: 26px 70px 30px 10px;background: #F6F6F4;margin-bottom: 28px;}
.faq-a .faq-badge{color: #888888;}
.faq-a-text{flex: 1;min-width: 0;font-size: 15px;line-height: 2;letter-spacing: 0.5px;color: #333333;overflow-wrap: anywhere;}

}
@media screen and (max-width: 767px) {

#faq main{margin: 0 4.83vw 19.32vw;}
#faq .faq-none{font-size: 3.62vw;line-height: 2;text-align: center;padding: 12vw 0;}

.faq-list{border-top: 1px solid #D6D6D4;}
.faq-item{border-bottom: 1px solid #D6D6D4;}
.faq-q{display: flex;align-items: flex-start;gap: 3.38vw;padding: 5.31vw 12.08vw 5.31vw 1.21vw;position: relative;cursor: pointer;list-style: none;}
.faq-q::-webkit-details-marker{display: none;}
.faq-badge{flex-shrink: 0;width: 5.31vw;font-size: 5.31vw;line-height: 1.2;font-weight: 500;text-align: center;}
.faq-q .faq-badge{color: #E0961E;}
.faq-q-text{flex: 1;min-width: 0;font-size: 3.62vw;line-height: 1.8;font-weight: 500;letter-spacing: 0.1vw;padding-top: 0.24vw;}
.faq-toggle{position: absolute;top: 50%;right: 3.38vw;width: 3.38vw;height: 3.38vw;margin-top: -1.69vw;}
.faq-toggle::before,
.faq-toggle::after{content: "";position: absolute;top: 50%;left: 0;width: 100%;height: 1px;background: #333333;transition: transform .3s;}
.faq-toggle::after{transform: rotate(90deg);}
.faq-item[open] .faq-toggle::after{transform: rotate(0deg);}
.faq-a{display: flex;align-items: flex-start;gap: 3.38vw;padding: 4.83vw 4.83vw 5.31vw 1.21vw;background: #F6F6F4;margin-bottom: 5.31vw;}
.faq-a .faq-badge{color: #888888;}
.faq-a-text{flex: 1;min-width: 0;font-size: 3.38vw;line-height: 1.9;color: #333333;overflow-wrap: anywhere;}

}
