﻿

/*---------------------------------------------
 faqList
 ---------------------------------------------*/
/*サブカテゴリ表示*/
.faq #main-contents{
	width: 100%;
	margin: 0 auto;
}
.faq #main-contents .subMenuList,
.faq #main-contents .subMenuList.nextCate{
	width: 80%;
	margin: 0 auto;
	padding-top: 0;
}
.faq #main-contents .subMenuList.nextCate{
	padding: 2rem 0;
	margin-bottom: 2rem;
}
.faq #main-contents .subMenuList li,
.faq #main-contents .subMenuList.nextCate li{
	width: calc(25% - 1rem);
	max-width: 25%;
}
.faq #main-contents .subMenuList.btn_faqLink{
	padding-top: 2rem;
	padding-bottom: 0;
	justify-content: flex-start;
}
.faq #main-contents .subMenuList.btn_faqLink > .btn_faq a{
	padding-left: 4rem;
	padding-right: 1rem;
	background-position: 1rem center;
}
.faq #main-contents .subMenuList a > span.cateName{
	height: auto;
	padding: 1.5rem 1rem;
	width: 100%;
	min-height: 4.5rem;
}
.faq .faq_box_wrapper .nextCateMenu{
	padding-bottom: 2rem;
}
.faq .faq_box_wrapper .nextCateMenu li{
	position: relative;
	background-color: #e6f3fb;
	border-radius: 10px;
	margin-bottom: 1rem;
}
.faq .faq_box_wrapper .nextCateMenu li:after{
	content: '';
    width: 1.2rem;
    height: 1.2rem;
    border: 0px;
    border-top: solid 2px #0095da;
    border-right: solid 2px #0095da;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 1.8rem;
    margin-top: -7px;
}
.faq .faq_box_wrapper .nextCateMenu li:hover{
	background-color: #c8e6f9;
}
.faq .faq_box_wrapper .nextCateMenu li a{
	display: block;
	color: #0095da;
	padding: 1rem;
	padding-right: 2rem;
}
.faq .faq_box_wrapper .nextCateMenu li a span{
	font-size: 1.6rem;
	font-weight: bold;
}
.faq .faq_box_wrapper h3.topCateTtl{
	color: #0095da;
	font-weight: bold;
	padding-left: 0.5vw;
}
.faq .faq_box_wrapper h3.topCateTtl span{
	display: none;
}
.faq .faq_box_wrapper h3.topCateTtl a{
	position: relative;
	display: inline-block;
	text-decoration: none;
	padding: 0 0.5rem;
	text-indent : -1rem;
	padding-left : 2.5rem;
}
.faq .faq_box_wrapper h3.topCateTtl a:first-child{
	text-indent : -2.5rem;
	margin-right: -0.5rem;
}
.faq .faq_box_wrapper h3.topCateTtl a:not(:first-child):after{
	content: "";
	position: absolute;
	top: 50%;
	left: -1.5rem;
	transform: translate(0, -50%) rotate(45deg);
	-webkit-transform: translate(0, -50%) rotate(45deg);
	-ms-transform: translate(0, -50%) rotate(45deg);
	width: 0.7rem;
	height: 0.7rem;
	margin-left: 1.5rem;
	margin-right: 1.5rem;
	border-top: 1px solid #0095da; 
	border-right: 1px solid #0095da;
}
.faq .faq_box_wrapper h3.topCateTtl a:hover{
	color: #0095da;
	text-decoration-line: underline;
	text-decoration-color: #0095da;
}
.faq .btn_faqLink.btm_box{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width: 80%;
	max-width: 1024px;
	margin: 0 auto;
}
.faq .btn_faqLink.btm_box > li{
	width: 270px;
	margin: 0;
	margin-bottom: 2rem;
	text-align: left;
}
.faq .btn_faqLink.btm_box .btn_faq:nth-of-type(2){
	width: 340px;
}
.faq .btn_faqLink.btm_box .btn_faq a,
.faq .btn_faqLink.btm_box .btn_contact a{
	width: 100%;
	padding-right: 2rem;
	white-space: nowrap;
	text-align: center;
	/*background-image: none;*/
}
/*サブカテゴリ表示 END
 ---------------------------------------------*/
.faq .faqList{
	width: 80%;
	margin: 5rem auto;
}
.faq .faqList *, .faqList *:after, .faqList *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.faq .faqList .faq_box_wrapper {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 0 0 1em 0;
	color: #1b2538;
}
.faq .faqList .faq_box_wrapper input {
	position: absolute;
	opacity: 0;
}
/* 質問 */
.faq .faqPage .faq_box_wrapper p.qa_topic,
.faq .faqPage .faq_box_inner p.question,
/*.faq .faqList .faq_box_wrapper label,
*/.faq .faqList .faq_box_inner label {
	font-size: 2.2rem;
	line-height: 2rem;
	padding: 1.5rem 2.5rem;
	/*text-indent: 1rem;*/
}
.faq .faqPage .faq_box_wrapper p.qa_topic:hover,
.faq .faqPage .faq_box_inner p.question:hover,
/*.faq .faqList .faq_box_wrapper label,
*/.faq .faqList .faq_box_inner label:hover {
	cursor: pointer;
}
.faq .faqPage .faq_box_inner p.question,
.faq .faqList .faq_box_inner label {
	position: relative;
	display: block;
	margin: 0;
	font-size: 1.6rem;
	font-weight: normal;
	line-height: 3rem;
	padding-right: 5rem;
	
	padding-left: 6rem;
	text-indent: -2rem;
}
.faq .faqPage .faq_box_inner p.question{
	padding-left: 6rem;
	padding-right: 2rem;
}
.faq .faqList .faq_box_inner .faq_answer > p{
	font-size: 1.6rem;
}
.faq .faqPage .faq_box_wrapper p.qa_topic,
.faq .faqList .faq_box_wrapper p.qa_topic,
.faq .faqList .faq_box_wrapper label.qa_topic{
	font-size: 2.2rem;
	font-weight: bold;
	padding-left: 0.5vw;
	margin-bottom: 3rem;
	display: flex;
	align-items: center;
	border-bottom: 2px solid #0095da;
	color: #0095da;
}
.faq .faqPage .faq_box_inner p.question::before,
.faq .faqList .faq_box_inner label::before {
	line-height: 3rem;
	margin-left: -2rem;
	padding: 1.5rem 0;
	padding-right: 4rem;
	content: ' ';
	background: url("../image/icon_q.svg") 0 center no-repeat;
	background-size: auto 3rem;
}
.faq .faqList .faq_box_wrapper label:hover,
.faq .faqList .faq_box_inner label:hover {
	/*transition: all 0.3s;
	color: #0095da;*/
	font-weight: bold;
}
/* --質問の＋アイコン */
/*.faqList .faq_box_wrapper label::after,*/
.faq .faqList .faq_box_inner label::after {
	content: "";
	display: block;
	position: absolute;
	top: 1.5rem;
	right: 1.4rem;
	width: 1.2rem;
	height: 1.2rem;
	border-top: 2px solid #0095da;
	border-right: 2px solid #0095da;
	transform-origin:50% 50%;
	/*-webkit-transform:  translate(-50%,0) rotate(135deg);
	-ms-transform:  translate(-50%,0) rotate(135deg);
	transform:  translate(-50%,0) rotate(135deg);*/
	-webkit-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	transform: rotate(135deg);
}
/* 答え */
.faq .faqList .faq_box_wrapper .faq_box,
.faq .faqList .faq_box_inner .faq_answer {
	/*position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 2.5em;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;*/
	
}
.faq .faqList .faq_box_inner .faq_answer{
	display: none;
}
.faq .faqPage .faq_box_wrapper p.qa_topic,
.faq .faqPage .faq_box_wrapper p.question{
	cursor: default;
}
.faq .faqPage .faq_box_wrapper input:checked ~ .faq_box {
	max-height: 55em;
	border: 10px solid rgba(27,37,56,0.1);
}
.faq .faqPage .faq_box_inner .faq_answer {
	background: #e6f3fb;
	padding: 1.5rem 2rem;
	padding-right:0; 
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
}
.faq .faqPage .faq_box_inner .faq_answer::before{
	line-height: 3rem;
	padding: 2.2rem 0;
	padding-right: 4rem;
	content: ' ';
	background: url("../image/icon_a.svg") 0 center no-repeat;
	background-size: auto 3rem;
}

/* 質問を開いた時の仕様 */
/* --答えの高さ */
.faq .faqList .faq_box_wrapper input:checked ~ .faq_box {
	max-height: 55em;
	border: 10px solid rgba(27,37,56,0.1);
}
.faq .faqList .faq_box_inner input:checked ~ .faq_answer {
	/*max-height: 40em;*/
	background: #e6f3fb;
	padding: 1.5rem 2rem;
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.faq .faqList .faq_box_inner input:checked ~ .faq_answer::before{
	/*display: none;*/
	line-height: 3rem;
	padding: 2.2rem 0;
	padding-right: 4rem;
	content: ' ';
	background: url("../image/icon_a.svg") 0 center no-repeat;
	background-size: auto 3rem;
	/*content: 'A';
	font-size: 2.5rem;
	position: absolute;
	top: 50%;
	display: flex;
	align-items: center;
	margin-left: -0.25rem;
	padding: 0;
	transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);*/
}
/* 質問をクリックした時のアイコンの動き */
.faq .faqList .faq_box_wrapper input:checked ~ label {

	/*border-radius: 0.5em 0.5em 0 0;*/
}
.faq .faqList .faq_box_inner input:checked ~ label {
	background-color: #e6f3fb;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	font-weight: bold;
}
.faq .faqList .faq_box_wrapper input:checked ~ .faq_box{
	margin-top: 1em;
	padding-left: 0;
	border: 0;
}
.faq .faqList .faq_box_inner input:checked ~ .faq_answer > p{
	display: inline-block;
	margin-left: 4rem;
}
.faq .faqList .faq_box_inner input:checked ~ .faq_answer > p:first-of-type(1){
	margin-top: -3rem;
}
.faq .faqPage .faq_box_inner,
.faq .faqList .faq_box_inner {
	width: 100%;
	margin: 0 auto 1rem auto;
}
/* 質問をクリックした時の+の動き */
.faq .faqList .faq_box_wrapper input[type=checkbox]:checked + label::after {
	top: 2.5rem;
	-webkit-transform: rotateZ(-45deg);
	transform: rotateZ(-45deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}
.faq .article_container .faq_box_wrapper .faq_box_inner .faq_answer_inner{
	width: calc(100% - 6rem);
}

/* ▲▲▲ Q&A ▲▲▲ */
/*---------------------------------------------
 faqList
 ---------------------------------------------*/
.faq .faqList h3.ttl_faq{
	font-size: 2.5rem;
	border-bottom: 2px solid #0095da;
	margin-bottom: 3rem;
	padding-left: 2rem;
}
.faq .faqList dl.faqList_box{
	width: 90%;
	margin: 0 auto;
	margin-bottom: 3rem;
}
.faq .faqList dt{
	position: relative;
	font-size: 1.6rem;
	margin-bottom: 2rem;
}
.faq .faqList dt:before{
	font-size: 2.5rem;
    margin-left: -2rem;
    padding-right: 0.5rem;
	content: 'Q';
	/*position: absolute;
	content: 'Q';
	margin: auto;
	top: 50%;
	left: -2.5rem;
	transform: translate(0 ,-50%);
	-webkit-transform: translate(0 ,-50%);
	-ms-transform: translate(0 ,-50%);
	width: 1.8rem;
	height: 1.8rem;*/
	/*background: url("../2022_tmpl_img/icon_all.svg") no-repeat;
	background-size: 1.8rem auto;	*/
}
.faq .faqList dl dt a:hover{
	text-decoration: none;
}
.faq .faqList dl dt a:hover{
	border-bottom: 1px sodtd #0095da;
	color: #0095da;
}
.faq .faqList dd.answer{
	position: relative;
	background-color: #e6f3fb;
}
.faq .faqList dd.answer:before{
	font-size: 2.5rem;
    margin-left: -2rem;
    padding-right: 0.5rem;
	content: 'A';
    /*font-size: 2.5rem;
    position: absolute;
    top: 50%;
    display: flex;
    align-items: center;
    margin-left: -0.25rem;
    padding: 0;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);*/
}
.faq .btn_faqLink{
	padding-top: 5rem;
}

/*---------------------------------------------
 faq_box_inner
 	list
 ---------------------------------------------*/
.faq .faqList .faq_box_inner ul {
	margin: 1rem 0;
	list-style-position: outside;
}
.faq .faqList .faq_box_inner ul.minContents {
	margin-bottom: 30vh;
}
.faq .faqList .faq_box_inner ul.minContents > li{
	margin-top: 3rem;
}
.faq .faqList .faq_box_inner ul.ul100{
	padding-bottom: 2rem;
}
.faq .faqList .faq_box_inner ul.ul100 > li{
	margin-bottom: 1rem;
}
.faq .faqList .faq_box_inner ul.ul100 > li > a{
	font-size: 1.6rem;
	font-weight: bold;
	color: #0095da;
}
.faq .faqList .faq_box_inner td ul {
	margin-bottom: 1rem;
}

.faq .faqList .faq_box_inner ul li{
	margin: 1rem;
	padding-left: 2rem;
	background: url("../image/arrow_blue.svg") 0 0.5rem no-repeat;
	background-size: 1.5rem;
}
.faq .faqList .faq_box_inner ol > li{
	margin: 2rem 0;
}
.faq .faqList .faq_box_inner ul.non_icon li{
	background: none;
	padding-left: 0;
}
.faq .faqList .faq_box_inner ul.cmn_list_arrow li{
	margin: 1rem;
	padding-left: 1.5rem;
	background: url("../image/arrow-right_blue_bold.svg") 0 0.75rem no-repeat;
	background-size: 0.75rem;
}
.faq .faqList .faq_box_inner ul.cmn_list_circle,
.faq .faqList .faq_box_inner ul.cmn_list_circle_small li,
.faq .faqList .faq_box_inner ul.cmn_list_square{
	text-align: left;
}
.faq .faqList .faq_box_inner ul.cmn_list_circle li,
.faq .faqList .faq_box_inner ul.cmn_list_circle_small li,
.faq .faqList .faq_box_inner ul.cmn_list_square li{
	position: relative;
	margin: 1rem;
	margin-left: 0;
	padding-left: 2.5rem;
	background: none;
}
.faq .faqList .faq_box_inner ul.cmn_list_circle li:before,
.faq .faqList .faq_box_inner ul.cmn_list_circle_small li:before,
.faq .faqList .faq_box_inner ul.cmn_list_square li:before{
	content: "";
	position: absolute;
	left: 1rem;
	display: block;
	width: 0.75rem;
	height: 0.75rem;
	background: #0095da;
	top: 1rem;
}
.faq .faqList .faq_box_inner ul.cmn_list_circle li:before{
	border-radius: 50%;
}
.faq .faqList .faq_box_inner ul.cmn_list_circle_small li:before{
	border-radius: 50%;
	width: 0.5rem;
	height: 0.5rem;
	top: 1.225rem;
}
.faq .faqList .faq_box_inner ul ol li {
	background: none;
}
.faq .faqList .faq_box_inner ul ol ul li {
	background: url("../image/arrow_blue.svg") 0 0.25rem no-repeat;
	background-size: 2rem;
}
.information .faq .faqList .faq_box_inner > ul > li > p{
	margin-left: 0;
}
.faq .faqList .faq_box_inner td li {
	margin-bottom: 0px;
}
.faq .faqList .faq_box_inner ol {
	margin: 3rem 0;
	margin-left: 3.2rem;
	list-style-position: inside;
	list-style-type: decimal;
}

.faq .faqList .faq_box_inner ol ul li {
	padding-left: 2.5rem;
}

.faq .faqList .faq_box_inner ol strong{
	font-weight: bold;
	color: #0095da;
}
.faq .faqList .faq_box_inner ol.no_tb_margin{
	margin: 0;
}

.faq .faqList .faq_box_inner ol.subList{
	margin: 0;
	margin-left: 1.6rem;
}
.faq .faqList .faq_box_inner ol.subList li:before{
	content: none;
}
.faq .faqList .faq_box_inner ol.subList li {
	margin: 0;
	padding-left: 0;
}

.faq .faqList .faq_box_inner dl {
	margin: 3rem 1.6rem;
}

.faq .faqList .faq_box_inner dl dt {
	margin: 2rem 0 1rem 0;
	padding: 1rem;
	background: #c8e6f9;
}

.faq .faqList .faq_box_inner dl dd {
	margin: 1rem;
}

/*-------------------------------------------------------------
 faq_box_inner
	p,a ,em
-------------------------------------------------------------*/
.faq .faqList .faq_box_inner p {
	font-size: 1.6rem;
	margin: 1rem 3.2rem;
	margin-left: 0;
}
.faq .faqList .faq_box_inner p.img_container{
	display: flex;
	justify-content: flex-start;
}
.faq .faqList .faq_box_inner p+hr,
.faq .faqList .faq_box_inner ul+h5,
.faq .faqList .faq_box_inner ul+h6,
.faq .faqList .faq_box_inner p+h5,
.faq .faqList .faq_box_inner p+h6 {
	margin-top: 3rem;
}
.faq .faqList .faq_box_inner em {
	font-weight: bold;
}

.faq .faqList .faq_box_inner td p {
	margin: 0px;
	padding: 0px;
	margin-left: 3.2rem;
}

.faq .faqList .faq_box_inner strong,
.faq .faqList .faq_box_inner strong span{
	font-weight: bold;
}

.faq .faqList .faq_box_inner p.right-align {
	text-align: right;
}

.faq .faqList .faq_box_inner p.center-align {
	text-align: center;
}
/*-------------------------------------------------------------
div.faq
	address
-------------------------------------------------------------*/
.faq  div.faq_answer address {
	display: inline-block;
	text-align: left;
	margin: 2rem 0;
	margin-top: 0;
	margin-left: 3.2rem;
	padding: 1rem 3rem;
	border: 1px solid #0095da;
	background-color: #c8e6f9;
}

@media screen and (max-width: 1024px){
	.faq .categorySubmenu{
		width: 100%;
	}
	.faq #main-contents .subMenuList{
		width: 90%;
	}
	.faq .article_container .btn_faqLink{
		max-width: none;
		width: 80%;
		margin: 0 auto;
	}
	.faq .article_container .btn_faqLink li{
		width: 340px;
	}
	.faq .faqList{
		width: 90%;
	}
	.faq .btn_faqList{
		width: 80%;
		margin: 0 auto;
	}
	.faq .subMenuList{
		justify-content: flex-start;
	}
	.faq #main-contents .subMenuList{
		padding-bottom: 2rem;
	}
	.faq #main-contents .subMenuList li{
		width: calc(33.33333333% - 0.5rem);
		max-width: none;
		margin-bottom: 0.5rem;
		margin-left: 0.5rem;
	}
	.faq .btn_faqLink li a{
		text-align: center;
		font-size: 1.4rem;
		padding: 1rem 4rem;
		background-position: 1rem center;
	}
	.faq .subMenuList.btn_faqLink li a{
		text-align: left;
	}
	.faq .btn_faqLink .btn_faq,
	.faq .btn_faqLink .btn_contact{
		min-width: 0;
		width: 340px;
		margin-bottom: 1rem;
	}
	.faq .btn_faqLink .btn_faq a,
	.faq .btn_faqLink .btn_contact a{
		padding: 1rem 4rem;
		background-position: 1rem center;
	}
	.faq #main-contents .subMenuList.btn_faqLink > .btn_faq a,
	.faq #main-contents .subMenuList a > span.cateName{
		font-size: 1.6rem;
		background-size: 1.4rem;
		padding-left: 3rem;
	}
	.faq #main-contents .subMenuList a > span.cateName{
		padding: 1.25rem 1rem;
	}
	.faq .faqPage .faq_box_inner p.question,
	.faq .faqList .faq_box_inner label {
		padding-left: 6rem;
		text-indent: -2rem;
		/*margin-left: 3rem;*/
	}
	/*-------------------------------------------------------------
	div.faq
		address
	-------------------------------------------------------------*/
	.faq  div.faq_answer address {
		margin: 0;
		padding: 1.6rem;
	}
}
@media screen and (max-width: 599px){
	.faq #main-contents .subMenuList li{
		width: 100%;
		max-width: none;
		margin-bottom: 0.5rem;
	}
	.faq .faqList .faq_box_inner label::after{
		width: 1.2rem;
		height: 1.2rem;
	}
	.faq .faqList .faq_box_inner p {
		margin: 1rem 0rem;
	}
	/*-------------------------------------------------------------
	div.faq
		address
	-------------------------------------------------------------*/
	.faq  div.faq_answer address {
		margin: 0;
		padding: 0.5rem;
		padding-bottom: 1.6rem;
	}
}