@charset "utf-8";
/* CSS Document */

/*ラベル*/
.box_title1{
	padding: 20px 30px 30px 20px;
	width: 100%;
	box-sizing: border-box;
    display: block;
    cursor :pointer;
    transition: all 0.5s;
	position: relative;
	border-bottom: 1px solid #121235;
}
.box_wrap .box_title1:first-of-type{border-top: 1px solid #121235;}
.box_title1:hover{	background: #0d0d26;}
.box_title1::before{
	content: "Q.";
	padding-right: 8px;
	color: #2e2e93;
	font-size: 30px;
}
.box_title1.active{	background: #0d0d26;}

.box_txt1::before{
	content: "A.";
	padding-right: 15px;
	color: #525263;
	font-size: 22px;
}
/*アイコンを表示*/
.box_title1::after {
	content: "";
	background-image: url(../img/plus.png);
	background-size: cover;
	width: 20px;
	height: 20px;
	position: absolute;
	right: 20px;
	top: 38px;
}

/*中身を非表示にしておく*/
.accbox .box_txt1{
	display: none;
	padding: 20px;
}

/*クリックで中身表示*/
.cssacc:checked + label + .accshow {
    height: auto;
    padding: 20px;
    opacity: 1;
}

.accbox .accshow p {
}

/*アイコンを入れ替える*/
.active::after{
	content: "";
	background-image: url(../img/minus.png);
	background-size: cover;
	width: 20px;
	height: 20px;
	position: absolute;
	right: 20px;
	top: 38px;}



/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
	.box_title1::before{font-size: 20px;}
	.box_txt1::before{font-size: 20px;}
	.box_title1::after {top: 30px;}
}
/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
	.box_title1{padding: 20px 35px 30px 20px;}
	.box_title1{font-size: 14px;}
	.box_txt1{font-size: 14px;}
	.box_title1::after{ width: 14px; height: 14px;top: 33px;}
}