@charset "UTF-8";


/*** layout ***/
.faq #container {
	padding-bottom: 0;
}

.faq #wrap {
	background-color: #F9FAFB;
}

.content_top {
	background-color: #fff;
	padding-bottom: 50px;
}

.content_list {
	padding: 50px 0 140px;
}


/*** content_top ***/
/* nav */
.box_nav .nav_depth1 .tab_list {
	gap: 0 24px;
}

.box_nav .nav_depth1 .tab_item a {
	font-size: 22px;
	font-weight: 600;
	color: #bbb;
}

.box_nav .nav_depth2 {
	margin-top: 20px;
}

.box_nav .nav_depth2 .tab_list {
	gap: 0 20px;
}

.box_nav .nav_depth2 .tab_list > li{
    flex: 0 0 auto;
}

.box_nav .nav_depth1 .tab_item.active a,
.box_nav .nav_depth2 .tab_item.active a,
.box_nav .nav_depth1 .tab_item a:hover,
.box_nav .nav_depth2 .tab_item a:hover{
	color: #ff6121;
}

.box_nav .nav_depth2 .tab_item a {
	font-size: 16px;
	font-weight: 500;
	color: #888;
}

.box_nav .tab_list {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
}

/* search */
.box_search {
	margin-top: 24px;
}

.box_search .form {
	display: flex;
	align-items: center;
	gap: 0 10px;
	width: 100%;
	height: 48px;
	padding: 0 20px;
	background-color: #F9FAFB;
	border-radius: 6px;
	box-sizing: border-box;
}

.box_search i {
	width: 20px;
	height: 20px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23A0A0A0' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain;
	flex-shrink: 0;
	opacity: 0.6;
}

.box_search input[type="search"] {
	flex: 1;
	border: none;
	background: transparent;
	outline: none;
	font-size: 15px;
	color: #333;
	padding: 0;
}

.box_search input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: none;
	appearance: none;
	display: inline-block;
	height: 16px;
	width: 16px;
	border-radius: 50%;
	background: #ccc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E") no-repeat center / 10px;
	cursor: pointer;
}

.box_search input::placeholder {
	color: #bbb;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}


/*** content_list ***/
/* faq_list */
.faq_list {
	display: flex;
	flex-direction: column;
	gap: 10px 0;
}

.faq_list .acco_head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 24px 40px;
	background-color: #fff;
	border-radius: 10px;
	cursor: pointer;
}

.faq_list .acco_head .acco_tit_wrap p{
    display: inline-block;
    width: 200px;
    font-size: 14px;
    color: #666;
    line-height: 24px;
}

/* mobile */
.faq_list .acco_head .acco_tit_wrap p.faq_name {
    display: block;
    font-size: 11px;
    line-height: 1;
    padding-bottom: 3px;
}

.faq_list .acco_head .acco_tit_wrap p > i{
    vertical-align: baseline;
}

.faq_list .acco_tit {
	font-size: 16px;
	font-weight: 600;
	color: #333;
}

.faq_list .acco_btn {
	width: 20px;
	height: 20px;
	display: block;
	background: url("/assets/images/ico_acco_arrow.png") no-repeat center /
		contain;
	transition: all 0.3s ease-in-out;
	flex-shrink: 0;
}

.faq_list .acco_body {
	height: 0;
	padding: 0 40px;
	overflow: hidden;
	opacity: 0;
	color: #666;
	font-size: 15px;
	background-color: #fcfdfd;
	word-break: keep-all;
	white-space: pre-line;
	transition: all 0.3s ease-in-out;
}

.view .faq_list .acco_body{
    background-color: #F9FAFB;
}

/* active */
.faq_item.active .acco_head {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	box-shadow: 0 -6px 24px -12px rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid #e8e8e8;
}

.faq_item.active .acco_btn {
	transform: rotate(180deg);
}

.faq_item.active .acco_body {
	height: auto;
	padding: 20px 40px 24px;
	opacity: 1;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	box-shadow: 0 12px 24px -12px rgba(0, 0, 0, 0.1);
	white-space: pre-line;
}

/* page */
.content_list .pg_wrap {
	padding-top: 0;
	margin-top: 50px;
}

.content_list .pg {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 4px;
}

.content_list .pg .pg_current {
	background-color: #333 !important;
	border: 1px solid #333 !important;
	color: #fff;
}

.content_list .pg a,
.content_list .pg span,
.content_list .pg strong {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 0;
	width: 32px;
	height: 32px;
	background: #fff;
	border: 1px solid #ddd !important;
	border-radius: 50px;
}
.pg_start,
.pg_next,
.pg_prev,
.pg_end {
	text-indent: -9000px;
	overflow: hidden;
}

.content_list .pg a:hover,
.content_list .pg span:hover {
	background-color: #eee;
}

.content_list .pg .pg_start {
	background: url(/img/sprite_pg.png) no-repeat left -149px top -2px / 290px;
}

.content_list .pg .pg_prev {
	background: url(/img/sprite_pg.png) no-repeat left -185px top -2px / 290px;
}

.content_list .pg .pg_next {
	background: url(/img/sprite_pg.png) no-repeat left -222px top -2px / 290px;
}

.content_list .pg .pg_end {
	background: url(/img/sprite_pg.png) no-repeat left -258px top -2px / 290px;
}

/*** faq_noresult ***/
.content_list .faq_noresult {
	padding: 100px 0;
	text-align: center;
}
.content_list .faq_noresult .search_none {
	width: 100px;
	height: 100px;
	background-size: 265px;
	background-position: 7px -116px;
}
.content_list .faq_noresult .ff_NSR {
	margin-top: 30px;
	font-size: 20px;
	color: #666;
	font-weight: 500;
}
.content_list .faq_noresult .sub_txt {
	display: block;
	font-size: 16px;
	font-weight: 400;
	color: #888;
}

.content_list .faq_noresult .search_text {
	display: inline-block;
	word-wrap: break-word;
	max-width: 100%;
}



/* media */
@media (max-width: 768px) {
	.content_top .inner {
		padding: 40px 20px 30px;
	}

	.content_top {
		padding-bottom: 0;
	}

	.box_nav .tab_list {
		overflow-x: auto;
		gap: 0 20px;
	}

	.box_nav .nav_depth1 .tab_item a {
		font-size: 18px;
		white-space: nowrap;
	}

	.box_nav .nav_depth2 {
		margin-top: 12px;
	}

	.box_nav .nav_depth2 .tab_list {
		gap: 0 16px;
	}

	.box_nav .nav_depth2 .tab_item a {
		font-size: 14px;
	}

	.content_list {
		padding: 10px 0 30px;
	}

	.faq_list .acco_tit {
		font-size: 14px;
		font-weight: 500;
	}

	.faq_list .acco_head {
		padding: 16px 20px;
		border-radius: 0;
		gap: 0 8px;
	}

	.faq_list .acco_body {
		padding: 0 20px;
		font-size: 14px;
	}

	.faq_item.active .acco_body {
		padding: 10px 20px 20px;
		border-radius: 0;
	}

	.faq_list .acco_btn {
		width: 16px;
		height: 16px;
	}

	.content_list .pg_wrap {
		margin-top: 20px;
	}

	.content_list .faq_noresult {
		padding:100px 20px;
	}

	.content_list .faq_noresult .search_none {
		width: 80px;
		height: 80px;
		background-size: 220px;
		background-position: 3px -98px;
	}
	.content_list .faq_noresult .ff_NSR {
		margin-top: 20px;
		font-size: 16px;
	}
	.content_list .faq_noresult .sub_txt {
		margin-top: 2px;
		font-size: 14px;
	}
}