@charset "utf-8";

.index-area{
	display: flex;
	justify-content: space-between;
	padding: 100px 0 120px;
}

.contents-left {
	width: 300px;
}

.contents-right {
	width: 820px;
}



@media screen and (max-width: 768px) {
	
	.index-area{
		display: block;
		padding: 30px 0 80px;
	}

	.contents-left {
		width: 100%;
	}
	.contents-right {
		width: 100%;
	}
	
}

/* -------------------------------------------------------------- 
	index-area
-------------------------------------------------------------- */

.index-area .list{
	background: #F5F6F7;
}

.index-area .list a{
	display: block;
	border-bottom: #fff solid 1px;
	padding: 15px 20px;
	position: relative;
}
.index-area .list p{
	font-size: 1.5rem;
	line-height: 1.8;
}
.index-area .list p.column2{
	font-size: 1.4rem;
}

.index-area .list a::before{
	content: '';
	font-family: 'FontAwesome';
	font-size: 1.4rem;
    position: absolute;
    left: 0;
	top: 28px;
	background: var(--red);
	width: 8px;
	height: 1px;
}
.index-area .list a::after{
	content: '\f054';
	font-family: 'FontAwesome';
	font-size: 1.4rem;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	color: #7C7C84;
}


.index-area .cate-title{
	font-weight: 500;
	background: var(--red);
	padding: 15px;
	color: #fff;
	display: block;
}



@media screen and (max-width: 768px) {
	.index-area .list{
		display: block;
	}
	.index-area .list a{
		width: 100%;
		display: block;
		height: 100%;
		padding: 15px 15px;
		border-bottom: #fff solid 2px;
	}	
	.index-area .list a p{
		font-size: 1.6rem;
		line-height: 1.5;
	}
	.index-area .list p.column2{
		font-size: 1.6rem;
	}
	
	.index-area .cate-title{
		/*background: #fff;
		color: #333;*/
		display: block;
		text-align: left;
	}
	
	.index-area .more_btn02{
		width: 100%;
		border-radius: 0;
		/*border: 1px #666 solid;*/
	}
	
	.index-area .more_btn02::after {
        background: url("../img/icon_plus_wht.png") no-repeat 0 0;
		background-size: 24px 24px;
    }
	
	.index-area .more_btn02.open::after {
        background: url("../img/icon_minus_wht.png") no-repeat 0 0;
		background-size: 24px 24px;
    }
	
	
}



/* -----------------------------------------------------------
    Q&A
-------------------------------------------------------------- */
.faq-area {
	/*padding: 100px 0 120px;*/
	position: relative;
}
.faq-box{
	margin: 0 auto;
	/*width: 1000px;*/
}

.faq-heading {
    margin: 50px 0 20px 0;
	font-size: 2.6rem;    
    font-weight: bold;
    line-height: 1.5;
	position: relative;
}

.faq-heading.t {
    margin: 0 0 20px 0;
}

.faq-box dl{
	border-bottom: 1px solid #ddd;
}

.faq-q{
	border-top: 1px solid #ddd;
	padding: 25px 35px 28px 60px;
    position: relative;
    cursor: pointer;
}
.faq-q h3{
	font-size: 2rem;
	line-height: 1.5;
	font-weight: 500;
}
.faq-a{
	display: none;
	line-height: 1.8;
	position: relative;
	padding: 0 35px 30px 60px;
}

.faq-q::before,
.faq-a::before{
	display: block;
	position: absolute;
	left: 20px;
	font-size: 2.4rem;
	color: var(--red);
	font-family: var(--josefin);
}
.faq-q::before{
	content: 'Q';
	top: 32px;
}
.faq-a::before{
	content: 'A';
	top: -4px;
	left: 22px;
	color: #007DD8;
}

.faq-box .accordion-icon {
	right: 0;
}

.faq-box .faq-a .basic-txt:nth-child(n+2){
	margin: 15px 0 0;
}
.faq-box .btn-more{
	margin: 15px 0 0;
	text-align: left;
}


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

	.faq-area {
		/*padding: 50px 20px 60px;*/
	}
	.faq-box{
		width: auto;
	}
	
	.faq-heading{
		margin: 50px 0 15px 0;
        font-size: 2.2rem;
	}
	
	.faq-heading.t{
		margin: 40px 0 15px 0;
        font-size: 2.2rem;
	}
	
	.faq-q{
		padding: 20px 20px 20px 30px;
	}
	.faq-q h3{
		font-size: 1.8rem;
	}
	.faq-a{
		padding: 0 20px 20px 30px;
	}
	.faq-q::before,
	.faq-a::before{
		left: 0;
		font-size: 2rem;
	}
	.faq-q::before{
		top: 26px;
	}
	.faq-a::before{
		top: 0px;
		left: 2px;
	}
	
	.faq-box .btn-more{
		margin: 15px auto 0;
		text-align: center;
	}
	
	
}