.headline_faq {
width: 100%;
padding: 40px 0;
background-color: #fffaf5;
}
.faq_contents {
border-bottom: none;
}
.cst5515 .ontents_txt {
padding: 0 25px;
}
.ttl_head {
font-family: "Josefin Sans", sans-serif;
font-size: 36px;
font-weight: bold;
letter-spacing: 0.2em;
margin-bottom: 25px;
}
.detail_ttl {
font-size: 2rem !important;
font-weight: bold;
line-height: 30px;
letter-spacing: -0.01em;
}
.faq_contents_inner .right {
position: relative;
}
.contents_tag {
position: absolute;
bottom: 0;
}
@media screen and (max-width: 767px) {
.faq_contents.cst5515 {
max-width: 100%;
padding: 0 25px 30px;
}
.detail_ttl {
font-size: 1.8rem !important;
}
.contents_tag {
position: inherit;
}
}
.left_img img:hover {
opacity: 1;
}
.contents_txt:hover {
opacity: 1;
} .faq_answer {
max-width: 1140px;
padding: 0 25px;
margin: 50px auto;
} .faq_detail_inner {
max-width: 1140px;
padding: 0 25px;
margin: 0 auto 60px auto;
font-size: 16px;
line-height: 30px;
font-weight: 500;
} .faq_format01 {
margin: 50px auto;
}
.faq_format01 h2 {
padding: 20px 25px;
font-size: 24px;
background-color: #efefef;
line-height: 1.6;
} .faq_format02 {
border-bottom: 1px dashed #c9c9c9;
color: #ffa347;
font-size: 18px;
font-weight: bold;
line-height: 1.6;
margin: 40px auto 20px;
} .faq_format03 {
margin: 50px auto;
} .faq_format04 {
margin: 50px auto;
}
.faq_format04_img {
flex-basis: 48%;
margin-right: 2%;
}
.faq_format04_img img {
}
.faq_format04_img span {
line-height: 20px;
}
.faq_format04_txt {
flex-basis: 50%;
}
@media screen and (max-width: 767px) {
.faq_format04_img {
flex-basis: 100%;
margin-right: 0;
}
.faq_format04_img img {
max-width: 100%;
}
.faq_format04_txt {
flex-basis: 100%;
margin-top: 30px;
}
} .faq_format05 {
margin: 50px auto;
}
.faq_format05_img {
flex-basis: 50%;
margin-left: 2%;
}
.faq_format05_img img {
max-width: 500px;
}
.faq_format05_img span {
line-height: 20px;
}
.faq_format05_txt {
flex-basis: 50%;
}
@media screen and (max-width: 767px) {
.faq_format05 {
margin: 50px auto;
}
.faq_format05_inner {
flex-direction: column;
}
.faq_format05_img {
flex-basis: 100%;
order: 1;
margin-left: 0;
}
.faq_format05_img img {
max-width: 100%;
}
.faq_format05_img span {
line-height: 20px;
}
.faq_format05_txt {
flex-basis: 100%;
margin-top: 30px;
order: 2;
}
} .faq_format06 {
margin: 50px auto;
}
.faq_format06_img01,
.faq_format06_img02 { width: 48%;
}
.faq_format06_img01 img,
.faq_format06_img02 img { margin: 0 auto;
display: block;
}
.faq_format06_img01 span,
.faq_format06_img02 span {
line-height: 20px;
}
@media screen and (max-width: 767px) {
.faq_format06_img01,
.faq_format06_img02 {
flex-basis: 100%;
margin: 30px auto;
}
.faq_format06_img01 img,
.faq_format06_img02 img {
max-width: 100%;
}
} .faq_format07 {
margin: 50px auto;
}
.faq_format07_img {
text-align: center;
}
.faq_format07_img img { padding: 0 25px;
}
.faq_format07_img span {
display: block;
text-align: left;
}
@media screen and (max-width: 767px) {
.faq_format07_img img {
max-width: 100%;
}
} .read_more_faq {
background-color: #fffaf5;
margin: 70px auto 80px;
padding-bottom: 45px;
}
.read_more_faq h4 {
text-align: center;
font-size: 22px;
font-weight: bold;
padding: 40px 2% 30px;
line-height: 1.2;
}
.read_more_faq_inner {
max-width: 1140px;
margin: 0 auto;
padding: 0 25px;
} .read_more_faq_inner ul li {
flex-basis: calc(97% * 1 / 4);
margin-right: 1%;
background-color: #fff;
border: 1px solid #c9c9c9;
position: relative;
}
.read_more_faq_inner ul li a {
display: block;
padding: 30px 15px;
}
.read_more_faq_inner ul li:last-child {
margin-right: 0;
} .read_more_faq_inner ul li h5 {
font-size: 20px;
line-height: 1.6;
margin: 20px auto 70px;
}
.read_more_faq_inner ul li .contents_tag_readmore {
position: absolute;
bottom: 30px;
right: 0;
}
.line_3em {
height: 3.2em;
} .cst5515 .read_more_faq_inner ul li {
flex-basis: 100%;
margin-right: 0;
background: none;
border: none;
}
.cst5515 .read_more_faq_inner ul li a {
display: flex;
align-items: center;
flex-wrap: wrap;
padding: 0;
margin-bottom: 10px;
}
.cst5515 .read_more_faq_inner ul li h5 {
font-size: 16px;
margin: 0 30px 0 0;
}
.cst5515 .read_more_faq_inner ul li .contents_tag_readmore {
position: initial;
}
.cst5515 .line_3em {
height: auto;
}
@media screen and (max-width: 767px) {
.read_more_faq_inner ul li {
flex-basis: 49%;
margin-bottom: 20px;
}
.read_more_faq_inner ul li h5 {
font-size: 20px;
line-height: 30px;
margin: 20px auto 70px;
}
.ellipsis:before {
padding: 0;
}
.cst5515.read_more_faq h4 {
font-size: 18px;
}
.cst5515 .read_more_faq_inner ul li h5 {
font-size: 16px;
margin: 0 0 5px 0;
}
.cst5515 .read_more_faq_inner ul li a {
flex-direction: column;
align-items: initial;
}
}