@charset "UTF-8";

/* ----------------------------------
 よくある質問
---------------------------------- */
#freepage_faq .block-freepage-frame { width: auto; max-width: calc(var(--layout1-max-width) + (var(--layout1-base-padding) * 2)); padding: 0 var(--layout1-base-padding); margin: 0 auto 50px;}
#freepage_faq h1 { padding: 0; margin: 0 0 60px; border: none; font-family: var(--font-family-ship); font-size: 24px; font-weight: 500;}
#freepage_faq section { margin: 0 0 100px;}
#freepage_faq section h2 {
  margin: 0 0 24px;
  padding: 0;
  border: none;
	font-family: var(--font-family-ship);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.0;
  letter-spacing: 0.04em;
  text-align: left;
}
#freepage_faq .faq-box { padding: 0; margin: 0; border: var(--border-solid1);}
#freepage_faq .faq-box + .faq-box { margin-top: 20px;}
#freepage_faq .faq-question-ttl { padding: 20px 60px 20px 50px; margin: 0; font-family: var(--font-family-ship); font-size: 16px; font-weight: 500; position: relative; cursor: pointer;}
#freepage_faq .faq-question-ttl .q {
  font-family: var(--font-family-stix);
  font-size: 16px;
  font-weight: 700;
	font-style: italic;
	line-height: 1.0;
  color: var(--color-base);
	position: absolute;
	top: 22px;
	left: 20px;
}
#freepage_faq .faq-question-ttl .opener { width: 30px; height: 30px; display: block; position: absolute; top: calc(50% - 15px); right: 20px;}
#freepage_faq .faq-question-ttl .opener::before,
#freepage_faq .faq-question-ttl .opener::after {
  content: '';
  width: 14px;
  height: 0;
  border: none;
  border-top: var(--color-base) 2px solid;
  display: block;
  position: absolute;
  top: calc(50% - 1px);
  right: calc(50% - 7px);
  transform: rotate(0deg);
  transition: all 0.3s;	
}
#freepage_faq .faq-question-ttl .opener::before { transform: rotate(90deg);}
#freepage_faq .faq-question-ttl.open .opener::before { transform: rotate(0deg);}
#freepage_faq .faq-answer { padding: 0 20px 20px 50px; margin: 0; font-family: var(--font-family-ship); font-size: 12px; font-weight: 500; display: none; position: relative;}
#freepage_faq .faq-answer .a {
  font-family: var(--font-family-stix);
  font-size: 16px;
  font-weight: 700;
	font-style: italic;
	line-height: 1.0;
  color: var(--color-base);
	position: absolute;
	top: 5px;
	left: 20px;
}
#freepage_faq .faq-answer p  { font-family: var(--font-family-ship); font-size: 12px; font-weight: 500; line-height: var(--line-height-high);}
#freepage_faq .faq-answer li { font-family: var(--font-family-ship); font-size: 12px; font-weight: 500; line-height: var(--line-height-high);}
#freepage_faq .faq-answer a  { text-decoration: underline; transition: var(--transition);}
#freepage_faq .faq-answer a:hover { text-decoration: none; opacity: var(--opacity);}
#freepage_faq .faq-answer p + p,
#freepage_faq .faq-answer p + ul,
#freepage_faq .faq-answer ul + p { margin-top: 15px;}
#freepage_faq .faq-answer ul.indent-list li { padding-left: 1em; text-indent: -1em;}
#freepage_faq .faq-answer ul.indent-list.small li { font-size: 10px;}
#freepage_faq .faq-answer ul.disc-list li { list-style: disc inside; padding-left: 1em; text-indent: -1em;}

@media screen and (max-width: 1000px) {
	#freepage_faq .pane-topic-path.top { margin-bottom: 10px;}
	#freepage_faq .block-freepage-frame { padding: 0 var(--layout-base-padding); margin: 0 auto 50px;}
	#freepage_faq h1 { margin-bottom: 30px;}
	#freepage_faq section { margin: 0 0 60px;}
	#freepage_faq section h2 { margin: 0 0 20px; font-size: 16px;}
	#freepage_faq .faq-box + .faq-box { margin-top: 16px;}
	#freepage_faq .faq-question-ttl { padding: 16px 30px 16px 40px; font-size: 14px;}
	#freepage_faq .faq-question-ttl .q { left: 16px; top: 18px;}
	#freepage_faq .faq-question-ttl .opener { width: 20px; height: 20px; top: calc(50% - 10px); right: 10px;}
	#freepage_faq .faq-question-ttl .opener::before,
	#freepage_faq .faq-question-ttl .opener::after { width: 10px; right: calc(50% - 5px);}
	#freepage_faq .faq-answer { padding: 0 16px 16px 40px;}
	#freepage_faq .faq-answer .a { left: 16px;}
}
