@charset "UTF-8";

@media screen and (min-width: 768px),print {

/* よくある質問（一覧・TOP共通パーツ） -------------------------------------*/
.faq-wrap{ margin-bottom: 80px; }
.faq-block{ margin-bottom: 60px; }
.faq-block:last-child{ margin-bottom: 0; }
.faq-cat-ttl{font-size: 24px;line-height: 1.5;letter-spacing: 1.2px;font-weight: 400;color: #4B555E;border-bottom: 1px solid #DEDEDE;padding: 0 0 14px 14px;margin-bottom: 30px;position: relative;}
.faq-cat-ttl::before{content: "";display: block;width: 4px;height: 24px;background: #B18B28;position: absolute;top: 3px;left: 0;}

.faq-list{ margin: 0; }
.faq-item{border: 1px solid #DEDEDE;background: #fff;margin-bottom: 16px;}
.faq-item:last-child{ margin-bottom: 0; }

.faq-q{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: start;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;padding: 22px 60px 22px 24px;position: relative;cursor: pointer;font-size: 17px;line-height: 1.65;letter-spacing: 0.68px;font-weight: 500;color: #1B1B1B;}
.faq-q:hover{ background: #F8F7F5; }
.faq-q-text{ -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; padding-top: 4px; }

.faq-badge{display: block;width: 34px;height: 34px;line-height: 34px;text-align: center;border-radius: 50%;background: #4B555E;color: #fff;font-size: 17px;letter-spacing: 0;margin-right: 16px;-webkit-flex: 0 0 auto;-ms-flex: 0 0 auto;flex: 0 0 auto;}
.faq-badge-a{ background: #B18B28; }

.faq-toggle{display: block;width: 16px;height: 16px;position: absolute;top: 50%;right: 24px;margin-top: -8px;}
.faq-toggle::before,
.faq-toggle::after{content: "";display: block;background: #B18B28;position: absolute;top: 50%;left: 0;width: 16px;height: 2px;margin-top: -1px;-webkit-transition: -webkit-transform 0.3s ease;transition: transform 0.3s ease;}
.faq-toggle::after{ -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.faq-item.is-open .faq-toggle::after{ -webkit-transform: rotate(0deg); transform: rotate(0deg); }

.faq-a{display: none;margin: 0;padding: 0 24px 24px 24px;border-top: 1px solid #EEEEEE;}
.faq-a__inner{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: start;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;padding-top: 24px;}
.faq-a-text{-webkit-box-flex: 1;-webkit-flex: 1 1 auto;-ms-flex: 1 1 auto;flex: 1 1 auto;min-width: 0;padding-top: 4px;font-size: 16px;line-height: 1.88;letter-spacing: 0.64px;font-weight: 400;color: #333333;}
.faq-empty{ text-align: center; padding: 60px 0; font-size: 16px; }

/* TOPページ抜粋 -------------------------------------*/
/* ↓ #contents の margin-bottom:-119px を相殺 */
#faq.faq-top{background: #F8F7F5;padding: 100px 0;margin-top: 119px;position: relative;z-index: 3;}
#faq.faq-top .faq-inner{ width: 1000px; margin: 0 auto; }
#faq.faq-top .ttl-Box{ text-align: center; margin-bottom: 45px; }
#faq.faq-top .ttl-Box h2{font-size: 20px;line-height: 1.6;letter-spacing: 3.2px;font-weight: 600;color: #4B555E;}
#faq.faq-top .ttl-Box h2 span.f-en{display: block;font-size: 60px;line-height: 1.3;letter-spacing: 0;font-weight: 400;}
#faq.faq-top .faq-wrap{ margin-bottom: 45px; }
#faq.faq-top .more{ text-align: center; }
#faq.faq-top .more a{display: inline-block;min-width: 300px;padding: 22px 30px;background: #fff;border: 1px solid #4B555E;color: #4B555E;font-size: 16px;letter-spacing: 1.6px;text-align: center;}
#faq.faq-top .more a:hover{ background: #4B555E; color: #fff; text-decoration: none; }

}

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

/* よくある質問（一覧・TOP共通パーツ） -------------------------------------*/
.faq-wrap{ margin-bottom: 12vw; }
body#faq .faq-wrap{ margin: 0 5.3vw 12vw; } /* 下層一覧のみ（SPはmainに幅指定が無いため） */
.faq-block{ margin-bottom: 10vw; }
.faq-block:last-child{ margin-bottom: 0; }
.faq-cat-ttl{font-size: 4.8vw;line-height: 1.5;letter-spacing: 0.24vw;font-weight: 400;color: #4B555E;border-bottom: 1px solid #DEDEDE;padding: 0 0 2.6vw 3vw;margin-bottom: 5vw;position: relative;}
.faq-cat-ttl::before{content: "";display: block;width: 0.8vw;height: 4.8vw;background: #B18B28;position: absolute;top: 0.6vw;left: 0;}

.faq-list{ margin: 0; }
.faq-item{ border: 1px solid #DEDEDE; background: #fff; margin-bottom: 3.2vw; }
.faq-item:last-child{ margin-bottom: 0; }

.faq-q{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: start;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;padding: 4.5vw 11vw 4.5vw 4vw;position: relative;cursor: pointer;font-size: 4vw;line-height: 1.6;letter-spacing: 0.16vw;font-weight: 500;color: #1B1B1B;}
.faq-q-text{ -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; padding-top: 0.8vw; }

.faq-badge{display: block;width: 7.4vw;height: 7.4vw;line-height: 7.4vw;text-align: center;border-radius: 50%;background: #4B555E;color: #fff;font-size: 4vw;letter-spacing: 0;margin-right: 3.2vw;-webkit-flex: 0 0 auto;-ms-flex: 0 0 auto;flex: 0 0 auto;}
.faq-badge-a{ background: #B18B28; }

.faq-toggle{ display: block; width: 3.7vw; height: 3.7vw; position: absolute; top: 50%; right: 4vw; margin-top: -1.85vw; }
.faq-toggle::before,
.faq-toggle::after{content: "";display: block;background: #B18B28;position: absolute;top: 50%;left: 0;width: 3.7vw;height: 0.5vw;margin-top: -0.25vw;-webkit-transition: -webkit-transform 0.3s ease;transition: transform 0.3s ease;}
.faq-toggle::after{ -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.faq-item.is-open .faq-toggle::after{ -webkit-transform: rotate(0deg); transform: rotate(0deg); }

.faq-a{ display: none; margin: 0; padding: 0 4vw 4.5vw 4vw; border-top: 1px solid #EEEEEE; }
.faq-a__inner{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: start;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;padding-top: 4.5vw;}
.faq-a-text{-webkit-box-flex: 1;-webkit-flex: 1 1 auto;-ms-flex: 1 1 auto;flex: 1 1 auto;min-width: 0;padding-top: 0.8vw;font-size: 3.7vw;line-height: 1.88;letter-spacing: 0.15vw;font-weight: 400;color: #333333;}
.faq-empty{ text-align: center; padding: 12vw 0; font-size: 3.7vw; }

/* TOPページ抜粋 -------------------------------------*/
#faq.faq-top{ background: #F8F7F5; padding: 14vw 0; position: relative; z-index: 3; }
#faq.faq-top .faq-inner{ width: 90%; margin: 0 auto; }
#faq.faq-top .ttl-Box{ text-align: center; margin-bottom: 8vw; }
#faq.faq-top .ttl-Box h2{ font-size: 4vw; line-height: 1.6; letter-spacing: 0.64vw; font-weight: 600; color: #4B555E; }
#faq.faq-top .ttl-Box h2 span.f-en{ display: block; font-size: 11vw; line-height: 1.3; letter-spacing: 0; font-weight: 400; }
#faq.faq-top .faq-wrap{ margin-bottom: 8vw; }
#faq.faq-top .more{ text-align: center; }
#faq.faq-top .more a{display: block;width: 80%;margin: 0 auto;padding: 4.5vw 4vw;background: #fff;border: 1px solid #4B555E;color: #4B555E;font-size: 3.7vw;letter-spacing: 0.37vw;text-align: center;}

}