@charset "UTF-8";
/* ===================================================
	Services / Yadoriki / FAQ CSS
====================================================== */

/* ---------------------------------------------------
	Global Header Overwrite
------------------------------------------------------ */
#g_header { position: absolute;}

/* ---------------------------------------------------
	Contents Overwrite
------------------------------------------------------ */
#contents { padding: 200px 0 0 !important;}

@media screen and (max-width: 600px) {
#contents { padding: 200px 0 0 !important;}
}

/* ---------------------------------------------------
Box Sub Header Overwrite
------------------------------------------------------ */
.sub_header .sub_logo{ top: 29px; width: 221px;}
/*.sub_header .sub_box_01 .sub_btn_01{ padding: 0 55px;}
.sub_header .sub_box_01 .sub_btn_02{ padding: 0 55px;}*/

@media screen and (max-width: 600px) {
.sub_header .sub_logo{ top: 15px; width: 130px;}
.sub_header .sub_box_01 .sub_btn_01{ width: 100%; padding: 0; margin: 0;}
/*.sub_header .sub_box_01 .sub_btn_01{ width: 49%; padding: 0;}
.sub_header .sub_box_01 .sub_btn_02{ width: 49%; padding: 0;}*/
}

@media screen and (max-width: 320px) {
.sub_header .sub_logo{ top: 15px; width: 120px;}
}

/* ---------------------------------------------------
.inner Overwrite
------------------------------------------------------ */
.inner{ padding: 0 0 50px;}

@media screen and (max-width: 600px) {
.inner{ padding: 0 0 20px;}
}

/* ---------------------------------------------------
Section Parent
------------------------------------------------------ */
.sec_parent{ padding: 0 0 50px;}

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


/* ---------------------------------------------------
List Children
------------------------------------------------------ */
.list_children{ display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.list_children li{ font-size: 18px; line-height: 1.3; margin: 0 20px 20px 0; border: solid 2px #d6d6d6; border-radius: 100px;}
.list_children li a{ display: block; position: relative; padding: 15px 50px 15px 30px;}
.list_children li a::after{ content: ""; display: block; width: 10px; height: 10px; border-right: solid 2px #f48f2f; border-bottom: solid 2px #f48f2f; transform: rotate(45deg); position: absolute; top: 17px; right: 20px;}

@media screen and (max-width: 600px) {
.list_children{ }
.list_children li{ font-size: 14px; line-height: 1.3; margin: 0 10px 10px 0; border: solid 2px #d6d6d6; border-radius: 100px;}
.list_children li a{ display: block; position: relative; padding: 10px 25px 10px 15px;}
.list_children li a::after{ content: ""; display: block; width: 6px; height: 6px; border-right: solid 2px #f48f2f; border-bottom: solid 2px #f48f2f; transform: rotate(45deg); position: absolute; top: 12px; right: 10px;}
}


/* ---------------------------------------------------
Section Child
------------------------------------------------------ */
.sec_child{}

/* ---------------------------------------------------
List post
------------------------------------------------------ */
.list_post{}
.list_post li{ border: solid 2px #d6d6d6; border-radius: 10px; background: #fff; margin: 0 0 20px; box-sizing: border-box; font-size: 16px; line-height: 1.6; padding: 0;}
.list_post li a{ display: block; padding: 45px 90px 45px 100px; font-weight: bold; position: relative; cursor: pointer;}
.list_post li a::before{ content: ""; background: url("../img/txt_q_01.svg") no-repeat 0 0; width: 24px; height: 35px; display: block; position: absolute; top: 40px; left: 50px;}
.list_post li a::after{ content: ""; display: block; width: 15px; height: 15px; border-bottom: solid 2px #f77900; border-right: solid 2px #f77900; transform: rotate(-45deg); transform-origin: center center; position: absolute; top: 48px; right: 40px; transition: right 0.5s;}
.list_post li a:hover::after{ right: 36px;}

@media screen and (max-width: 600px) {
.list_post{}
.list_post li{ margin: 0 0 20px; font-size: 15px; line-height: 1.6; padding: 0 0 10px;}
.list_post li a{ padding: 20px 45px 10px 50px;}
.list_post li a::before{ top: 14px; left: 15px;}
.list_post li a::after{ top: 22px; right: 20px;}
.list_post li a:hover::after{ right: 16px;}
}

/* ---------------------------------------------------
Section Single
------------------------------------------------------ */
.sec_single{ margin: 50px 0 100px;}
.sec_single .cmn_tit_02 span::after{ content: " / ";}
.sec_single .cmn_tit_02 span:last-of-type::after{ content: "";}
.sec_single .box_tit{ border: solid 2px #d6d6d6; border-radius: 10px; background: #fff; margin: 0 0 20px; padding: 25px 50px; box-sizing: border-box;}
.sec_single .tit{ font-size: 20px; line-height: 1.6; padding: 0; display: block; font-weight: bold;}
.sec_single .box_body{ padding: 25px 50px; box-sizing: border-box;}
.sec_single .body{ font-size: 20px; line-height: 1.6;}
.sec_single .sub{ font-size: 20px; color: #f77900; display: block;}
.sec_single .sub::first-letter{ font-size: 35px;}
.sec_single .box_btn{ text-align: center; margin: 40px auto 0;}

@media screen and (max-width: 600px) {
.sec_single{ margin: 0 0 50px;}
.sec_single .cmn_tit_02 span::after{ content: " / ";}
.sec_single .cmn_tit_02 span:last-of-type::after{ content: "";}
.sec_single .box_tit{ border: solid 2px #d6d6d6; border-radius: 10px; background: #fff; margin: 0; padding: 10px 20px 15px; box-sizing: border-box;}
.sec_single .tit{ font-size: 18px; line-height: 1.6; padding: 0; display: block; font-weight: bold;}
.sec_single .box_body{ padding: 15px 20px; box-sizing: border-box;}
.sec_single .body{ font-size: 15px; line-height: 1.6;}
.sec_single .sub{ font-size: 16px; color: #f77900; display: block;}
.sec_single .sub::first-letter{ font-size: 32px;}
.sec_single .box_btn{ text-align: center; margin: 20px auto 0;}
}

/* ---------------------------------------------------
	Global Footer (/services/の下層ページで適用されるフッター) Overwrite
------------------------------------------------------ */
.ft_serv_01 .ft_logo{ width: 380px;}
.ft_serv_01 .ft_serv_01_in{ width: 820px;}
.ft_serv_01 .ft_links ul{ flex-direction: row;}
.ft_serv_01 .ft_links ul li{ padding: 5px 0; margin: 0 30px 0 0;}

@media screen and (max-width: 600px) {
.ft_serv_01 .ft_logo{ width: 90%;}
.ft_serv_01 .ft_serv_01_in{ width: 90%;}
.ft_serv_01 .ft_links ul{ flex-direction: column;}
.ft_serv_01 .ft_links ul li{ padding: 5px 0; margin: 0;}
}