/****************************************************************************************************

faq.css

****************************************************************************************************/
span.anchorlink {
	top: -80px;
}
@media screen and (max-width: 767px) {
span.anchorlink {
	top: -60px;
}
}

/*******************************************************
header
********************************************************/
header.luxbar-fixed a{
color: #fff;
}
header.luxbar-fixed .logo_white{
display: block;
}
header.luxbar-fixed .logo_black{
display: none;
}


/*******************************************************
h1〜
********************************************************/
h1{
font-size: 30px;
font-size: clamp(24px, 3vw, 30px);
text-align: center;
color: #333;
}

h2{
font-family:'EB Garamond', serif;
font-size: 24px;
font-size: clamp(20px, 3vw, 24px);
letter-spacing:0.1em;
color: #a38a77;
margin-bottom: 1em;
padding: 0;
}

h3{
/* max-width: 90%;  */
max-width: 100%;
display: block;
/* padding-right: 1em; */
font-size: 18px;
font-size: clamp(14px, 2.6vw, 18px);
line-height: 1.6em;
}

@media screen and (max-width: 400px) {
h3{
/* max-width: 100%;  */
padding-right: 0;
}
h3 .resp_autowrap{
display: block;
padding-left: 0.6em;
}
}


/*******************************************************
hd
********************************************************/
.hd{
 padding: 8% 0;
}
@media screen and (max-width: 540px){
.hd{
 padding: 14% 0;
}
}


/*******************************************************
faqBlock
********************************************************/
main {
	background-color: white;
}
#faq {
	width: 80%;
	padding: 8em 0 5em;
	margin: 0 auto;
}

.faqBlock {
 padding-top: 3em;
}
.faqBlock:first-child {
 padding-top: 0;
}

.faqBlock .faqwrap {
	width: 100%;
 margin-bottom: 1em;
 border: 1px solid #beb1a1;
}
.faqBlock .faqwrap:last-child {
 margin-bottom: 0;
}


/*チェックボックスを非表示にする*/
.faqBlock input {
 display: none;
}
.faqBlock label {
 display: block;
 position: relative;
 cursor: pointer;
 padding: 1em 1.4em;
 background: #f3f2f0;
	font-size: 16px;
	font-size: clamp(13px, 1.6vw, 16px);
}

@media screen and (max-width: 400px) {
.faqBlock {
 padding-top: 1.7em;
}
.faqBlock label {
 padding: 1em 1.2em;
}
}


/*三角矢印アイコン*/
.faqBlock .icon {
 display: block;
 position: absolute;
 right: 1.4em;
 top: 50%;
 width: 24px;
 margin-left: 6px;
 flex-shrink: 0;
 transform-origin: center 43%;
 transition: transform 0.5s;
}
.faqBlock .icon::before,
.faqBlock .icon::after {
 content: "";
 position: absolute;
 display: block;
 width: 14px;
 height: 1px;
 background-color: #777;
}
.faqBlock .icon::before {
 left: 0;
 transform: rotate(45deg);
}
.faqBlock .icon::after {
 right: 0;
 transform: rotate(-45deg);
}

@media screen and (max-width: 540px) {
.faqBlock .icon {
 width: 20px;
}
.faqBlock .icon::before,
.faqBlock .icon::after {
 width: 11.6px;
}
}

@media screen and (max-width: 400px) {
.faqBlock .icon {
 width: 18px;
 right: 1.2em;
}
.faqBlock .icon::before,
.faqBlock .icon::after {
 width: 10.5px;
}
}
/*@media screen and (max-width: 400px) {
.faqBlock .icon {
 width: 14px;
 right: 1.2em;
}
.faqBlock .icon::before,
.faqBlock .icon::after {
 width: 8.5px;
}
}*/


/*コンテンツ初めは非表示*/
/* .faqBlock .anserBox {
 max-height: 0;
 margin: auto;
 opacity: 0;
 visibility: hidden;
 transition: 0.5s;
 overflow: hidden;
} */
.faqBlock .anserBox .anser_wrap{
 padding: 0.5em 1.2em;
 margin: auto;
}
.faqBlock .anserBox a{
 /*font-size: 0.8rem;*/
 text-decoration: underline;
}
.faqBlock .anserBox p {
font-size: 16px;
font-size: clamp(13px, 2.4vw, 16px);
 line-height: 1.6em;
 padding: 0.2em 0;
 text-align: justify;
}
.faqBlock .anserBox p.cap12{
font-size: 12px;
font-size: clamp(10px, 2vw, 12px);
 line-height: 1.4em;
 margin-top: 0.2em;
}

@media screen and (max-width: 400px) {
.faqBlock .anserBox .anser_wrap {
 padding: 0.5em 1.2em;
}
}
/*クリックするとコンテンツ表示*/
.faqBlock input:checked ~ .anserBox {
 max-height: 500px;
 opacity: 1;
 visibility: visible;
}

/* アコーディオン表示の際に三角回転 */
.faqBlock input:checked ~ label .icon {
 transform: rotate(180deg);
}



/*************************************************************************************
print
**************************************************************************************/

@media print {

}