@charset "UTF-8";
@media screen and (min-width: 768px),print { /*----------------------------------------- h2 画像 ------------------------------------------*/
.cc-ttl-Box-01 { background: url('../images/topics/h2.jpg') top center no-repeat , url('../images/index/h-bg.jpg') top center ; }
.cc-ttl-01 { color: #fff; }
/* faq(一覧) -------------------------------------*/
#faq .Box { width: 800px; margin-left: auto; margin-right: auto; background: url('../images/topics/topics-bg.jpg') top center; padding: 25px 20px; }
#faq .color-Box { background: #fff; padding: 30px 30px 40px; }
#faq .faq-none { text-align: center; padding: 40px 0; font-size: 16px; color: #383231; }
/* faq アコーディオン（TOPと共通） -------------------------------------*/
.faq-list { text-align: left; }
.faq-list .faq-item { border-bottom: 1px dotted #989989; }
.faq-list .faq-q { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 20px 10px; cursor: pointer; list-style: none; outline: none; }
.faq-list .faq-q::-webkit-details-marker { display: none; }
.faq-list .faq-q:hover .faq-q-txt { text-decoration: underline; }
.faq-list .faq-badge { -ms-flex-negative: 0; flex-shrink: 0; display: block; width: 36px; height: 36px; line-height: 36px; border-radius: 50%; text-align: center; font-size: 18px; font-weight: bold; color: #fff; background: #433526; margin-right: 18px; }
.faq-list .faq-q-txt { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; font-size: 16px; font-weight: bold; line-height: 1.7; color: #383231; }
.faq-list .faq-toggle { -ms-flex-negative: 0; flex-shrink: 0; position: relative; display: block; width: 18px; height: 18px; margin-left: 18px; }
.faq-list .faq-toggle:before { content: ''; position: absolute; top: 8px; left: 0; width: 18px; height: 2px; background: #0099ba; }
.faq-list .faq-toggle:after { content: ''; position: absolute; top: 0; left: 8px; width: 2px; height: 18px; background: #0099ba; }
.faq-list .faq-item[open] .faq-toggle:after { display: none; }
.faq-list .faq-a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 20px 10px; margin-bottom: 20px; background: #f3f2e6; }
.faq-list .faq-a .faq-badge { background: #0099ba; }
.faq-list .faq-a-txt { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; font-size: 15px; line-height: 1.9; color: #383231; padding-top: 3px; }
}

@media screen and (max-width: 767px) { /* SP用 -------------------------------------*/
/* faq(一覧) -------------------------------------*/
#faq { background: url('../images/topics/topics-bg.jpg') top center ; padding: 6% 3%; }
#faq .Box { width: 100%; margin-left: auto; margin-right: auto; }
#faq .color-Box { background: #fff; padding: 2% 4% 6%; }
#faq .faq-none { text-align: center; padding: 10% 0; font-size: 1.4rem; color: #383231; }
/* faq アコーディオン（TOPと共通） -------------------------------------*/
.faq-list { text-align: left; }
.faq-list .faq-item { border-bottom: 1px dotted #989989; }
.faq-list .faq-q { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 4% 0; cursor: pointer; list-style: none; outline: none; }
.faq-list .faq-q::-webkit-details-marker { display: none; }
.faq-list .faq-badge { -ms-flex-negative: 0; flex-shrink: 0; display: block; width: 2.8rem; height: 2.8rem; line-height: 2.8rem; border-radius: 50%; text-align: center; font-size: 1.5rem; font-weight: bold; color: #fff; background: #433526; margin-right: 3%; }
.faq-list .faq-q-txt { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; font-size: 1.4rem; font-weight: bold; line-height: 1.6; color: #383231; }
.faq-list .faq-toggle { -ms-flex-negative: 0; flex-shrink: 0; position: relative; display: block; width: 14px; height: 14px; margin-left: 3%; }
.faq-list .faq-toggle:before { content: ''; position: absolute; top: 6px; left: 0; width: 14px; height: 2px; background: #0099ba; }
.faq-list .faq-toggle:after { content: ''; position: absolute; top: 0; left: 6px; width: 2px; height: 14px; background: #0099ba; }
.faq-list .faq-item[open] .faq-toggle:after { display: none; }
.faq-list .faq-a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 4% 3%; margin-bottom: 4%; background: #f3f2e6; }
.faq-list .faq-a .faq-badge { background: #0099ba; }
.faq-list .faq-a-txt { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; font-size: 1.3rem; line-height: 1.8; color: #383231; padding-top: .2rem; }
}