@charset "utf-8";
/* ===================================================
	Other CSS
====================================================== */
/* ---------------------------------------------------
よくある質問
------------------------------------------------------ */
#faq .c_nav{ justify-content: space-between;}
#faq .c_nav li{ margin: 0 0 20px;  width: 32%; max-width: 350px;}
#faq section{ margin-bottom: 100px;}
#faq .tit_icon_line { padding-bottom: 10px;}
#faq .tit_icon_line span{ font-size: 26px;}

@media screen and (max-width: 600px) {
  #faq .c_nav li{ margin: 0 0 10px;  width: 100%; max-width: 100%;}
  #faq section{ margin-bottom: 10vw;}
}

/*--------------------------------------------------------
	faqレイアウト共通スタイル※消さないで
--------------------------------------------------------*/
.faq_list { }
.faq_list [class*="layout"] { margin: 0 0 25px; line-height: 1.6;}
.faq_list [class*="layout"] > dt { font-size: 18px; padding: 20px 40px 20px 80px; position: relative;}
.faq_list [class*="layout"] > dd { position: relative;}

.faq_list [class*="layout"] > dt:before,
.faq_list [class*="layout"] > dd:before { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; color: #fff; font-size: 18px; position: absolute; top: 20px; left: 30px;}
.faq_list [class*="layout"] > dt::before { content: 'Q'; background: #542653;}
.faq_list [class*="layout"] > dd::before { content: 'A'; color: #542653; border: 1px solid #542653;}
.faq_list [class*="faqicon"] > dt.acc_tit::after { content: ''; display: block; position: absolute; right: 20px; background-repeat: no-repeat; background-size: contain;}
.lead_txt { text-align: center; line-height: 2; margin: 30px 0 60px;}
.lead_txt > a { display: block; width: 320px; margin: 20px auto 0; padding: 12px 0; color: #fff; background: #525252; transition: opacity .5s;}
.lead_txt > a:hover { text-decoration: none; opacity: 0.8;}

@media screen and (max-width: 600px){
  .faq_list { margin: 8vw auto 0;}
  .faq_list [class*="layout"] { margin: 5px 0;}
  .faq_list [class*="layout"] > dt:before,
  .faq_list [class*="layout"] > dd:before { width: 24px !important; height: 24px !important; font-size: 16px !important; left: 5px !important;}
  .faq_list [class*="layout"] > dt:before { top: 11px !important;}
  .faq_list [class*="layout"] > dd:before { top: 21px !important;}
  .faq_list [class*="layout"] > dt { padding: 10px 30px 10px 40px; font-size: 16px;}

  .faq_list [class*="faqicon"] > dt.acc_tit::after { right: 10px;}
  .lead_txt { margin: 30px 0 8vw; text-align: left;}
  .lead_txt > a { width: 250px; padding: 8px 0; text-align: center;}
}

/*--------------------------------------------------------
	faqレイアウト選択スタイル※不要なスタイルは削除
--------------------------------------------------------*/

/* faq基本レイアウトtype
--------------------------------------------------------*/
/* ▼ faq基本レイアウトtype1 ここから --------------*/
.faq_list [class*="layout1"] > dt { border-bottom: 1px solid #ccc;}
.faq_list [class*="layout1"] > dd { padding: 20px 40px 20px 80px;}
.faq_list [class*="layout1"] > dd:before { top: 15px;}
.faq_list [class*="_round"] > dt:before,
.faq_list [class*="_round"] > dd:before { width: 35px; height: 35px; border-radius: 50%; top: 15px;}

.faq_list [class*="layout1"] > dd a { text-decoration: underline;}

@media screen and (hover:hover) and (min-width: 601px) {
  .faq_list [class*="layout1"] > dd a:hover { opacity: 1; text-decoration: none;}
}

@media screen and (max-width: 600px){
  .faq_list [class*="layout1"] > dd { padding: 20px 0 20px 40px;}
}
/* ▲ faq基本レイアウトtype1 ここまで --------------*/


/* ▼ 開閉アイコンtype1 ここから --------------*/
.faq_list .faqicon_1 > dt.acc_tit::after { background-image: url(../../faq/img/arrow_5.svg); width: 10px; height: 16px; transform: rotate(90deg); top: calc(50% - 9px); transition: transform .5s;}
.faq_list .faqicon_1 > dt.acc_tit.active::after { transform: rotate(270deg);}
@media screen and (max-width: 600px){
  .faq_list .faqicon_1 > dt.acc_tit::after { width: 8px; height: 14px; top: 15px;}
}
/* ▲ 開閉アイコンtype1 ここまで --------------*/


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

}

/* ---------------------------------------------------
privacy
------------------------------------------------------ */
#privacy #sec01{ margin-bottom: 100px;}
#privacy h3{ margin-bottom: 25px;}
#privacy h3:not(:first-of-type){ margin-top: 50px;}
#privacy h3 span{ font-size: 24px;}

#privacy .cmn_list_dot_01 { margin-top: 15px;}
#privacy .cmn_list_dot_01 > li { padding: 0 0 0 1em; text-indent: -1em;}
#privacy .cmn_list_dot_01 > li::before { content: '・';}

@media screen and (max-width: 600px) {
	#privacy #sec01{ margin-bottom: 10vw;}
	#privacy h3{ margin-bottom: 5vw; padding-bottom: 2.5vw;}
	#privacy h3:not(:first-of-type){ margin-top: 10vw;}
	#privacy h3 span{ padding-left: 20px; font-size: 22px; position: relative;}
  #privacy h3 span::before{ top: 9px; left: 0; position: absolute;}


}