/* benefitmore_complex_list */

.bm-complex-list {
	padding: 0 !important;
}

.bm-complex-list >.bh_wrap {
	max-width: 100%;
	padding: 0;
	margin: 0;
}

.bm-complex-list .chip-row {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 20px;
	@media (max-width: 992px){
		gap: 5px;
		margin-bottom: 15px;
	}
}

.bm-complex-list .chip {
	padding: 10px 20px;
	border-radius: 100px;
	border: 1px solid var(--bh_color_gray_300);
	font-weight: 500;
	font-size: 16px;
	cursor: pointer;
	font-family: inherit;
	color: inherit;
	transition: .3s;
	color: var(--bh_color_gray_600);
	@media (max-width: 992px){
		padding: 5px 10px;
		font-size: 14px;				
	}
}

.bm-complex-list .chip.active {
	background: var(--bh_color_gray_900);
	color: var(--bh_color_static_white);
	border-color: var(--bh_color_gray_900);
}

.bm-complex-list .chip:hover {
	color: var(--bh_color_gray_900);
	border-color: var(--bh_color_gray_900);
}

.bm-complex-list .chip.active:hover {
		background: var(--bh_color_gray_900);
	color: var(--bh_color_static_white);
	border-color: var(--bh_color_gray_900);
}

.bm-complex-list .search-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 30px;
	@media (max-width: 992px){
		width: 100%;
		gap: 5px;
		margin-bottom: 15px;
		    flex-wrap: wrap;
	}
}

.bm-complex-list .bm-field {
	width: 100%;
	height: 47px;
	border-radius: 5px;
	border: 1px solid var(--bh_color_gray_300);
	padding: 8px 20px;
	font-size: 18px;
	color: var(--bh_color_gray_600);
	font-family: inherit;
	box-sizing: border-box;
	outline: 0;

	/* 기본 화살표 제거 */
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	@media (max-width: 992px){
		width: 70%;
		height: 36px;
		padding: 4px 10px;
		font-size: 14px;
	}
}

.bm-complex-list .bm-field.down_icon{
	background: no-repeat url("/assets/images/icon/arrow-down-s-line.png") center right 20px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	max-width: 180px;
	background-size: 20px;
	@media (max-width: 992px){
		background: no-repeat url("/assets/images/icon/arrow-down-s-line.png") center right 10px;
		width: calc((100% - 5px) / 2);
		max-width: unset;
		background-size: 16px;
	}
}

/* IE */
.bm-complex-list .bm-field.down_icon::-ms-expand {
	display: none;
}

/* 선택 후 */
.bm-complex-list .bm-field.down_icon.is-selected {
	color: var(--bh_color_gray_900);
}

.bm-complex-list .bm-search-btn {
	padding: 10px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 47px;
	border: none;
	border-radius: 5px;
	color: var(--bh_color_main);
	font-size: 18px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
	border: 1px solid var(--bh_color_main);
	transition: .3s;
	&:hover {
		background-color: var(--bh_color_main);
		color: var(--bh_color_white);
	}
	@media (max-width: 992px){
		height: 36px;
		gap: 5px;
		padding: 5px 10px;
		width: 20%;
		font-size: 14px;
	}
}

.bm-complex-list .bm-search-btn i {
	font-size: 20px;
	line-height: 1;
	@media (max-width: 992px){
		font-size: 14px;
	}
}

.bm-complex-list .apt-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	@media (max-width: 992px) {
		display: flex;
		flex-direction: column;
		gap: 15px;
	}
}

.bm-complex-list .apt-card {
	background: var(--bh_color_white);
	border: 1px solid var(--bh_color_gray_300);
	border-radius: 5px;
	padding: 30px;
	transition: 0.3s;
	display: grid;
	@media (max-width: 992px) {
		padding: 15px;
		display: block;
	}
}

.bm-complex-list .apt-card:hover {
	border-color: var(--bh_color_gray_600);
}

.bm-complex-list .apt-top {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	align-items: flex-start;
	margin-bottom: 10px;
	@media (max-width: 992px){
		margin-bottom: 5px;
		/* flex-direction: column; */
	}
}

.bm-complex-list .apt-region {
	color: var(--bh_color_gray_600);
	font-size: 14px;
	font-weight: 500;
}

.bm-complex-list .apt-name {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: normal;
}

.bm-complex-list .badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}

.bm-complex-list .badge-green {
	background: rgba(0, 152, 0, 0.1);
	color: #009800;
}

.bm-complex-list .apt-meta {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 25px;
	@media (max-width: 992px){
		margin-bottom: 15px;
	}
}

.bm-complex-list .meta-pill {
	padding: 5px 10px;
	border-radius: 100px;
	border: 1px solid var(--bh_color_gray_400);
	font-size: 12px;
	color: var(--bh_color_gray_600);
	font-weight: 500;
}

.bm-complex-list .progress {
	height: 6px;
	background: var(--bh_color_gray_300, #e0e0e0);
	border-radius: 0;
	overflow: hidden;
	margin-bottom: 5px;
}

.bm-complex-list .progress .fill {
	height: 100%;
	border-radius: 0;
	background: linear-gradient(
	90deg,
	#B7D5FF 0%,
	#9CC0F4 12%,
	#6E98D8 48%,
	#3C6FBE 78%,
	#1E57AD 100%
	);
}

.bm-complex-list .steps {
	display: flex;
	justify-content: space-between;
	font-size: 10px;
	font-weight: 700;
	color: var(--bh_color_gray_600);
	margin-bottom: 23.5px;
}

.bm-complex-list .goal-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	margin-bottom: 10px;
	@media (max-width: 992px){
		margin-bottom: 5px;
	}
}

.bm-complex-list .goal {
	border: 1px solid var(--bh_color_gray_300);
	border-radius: 5px;
	aspect-ratio: 97 / 76;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: var(--bh_color_gray_50);
	text-align: center;
}

.bm-complex-list .goal strong {
	display: block;
	font-size: 14px;
	font-weight: 700;
}

.bm-complex-list .goal span {
	font-size: 10px;
	font-weight: 500;
	color: var(--bh_color_gray_600);
}

/* 달성 구간: 연한 파랑 → 중간 파랑 → 진한 파랑 */
.bm-complex-list .goal:first-child.goal-done {
    background: #ebf3ff !important;
    border-color: #b8d5ff !important;
}

.bm-complex-list .goal.goal-done strong{
	color: #0d47a2 !important;
}

.bm-complex-list .goal.goal-done span{
	color: rgba(13, 71, 162, 0.6) !important;

}

.bm-complex-list .goal-achieved {
	background: #ebf3ff !important;
	border-color: #b8d5ff !important;
}

.bm-complex-list .goal:nth-child(2).goal-done {
	background: #dae9ff !important;
	border-color: #7fadf0 !important;
}

.bm-complex-list .goal:nth-child(3).goal-done {
	background: #a6caff !important;
	border-color: #568ddd !important;
}

.bm-complex-list .goal-achieved strong,
.bm-complex-list .goal-achieved-mid strong,
.bm-complex-list .goal-achieved-deep strong {
	color: #0d47a2 !important;
}

.bm-complex-list .goal-achieved span,
.bm-complex-list .goal-achieved-mid span,
.bm-complex-list .goal-achieved-deep span {
	color: rgba(13, 71, 162, 0.6) !important;
}

.bm-complex-list .goal-achieved-mid {
	background: #dae9ff !important;
	border-color: #7fadf0 !important;
}

.bm-complex-list .goal-achieved-deep {
	background: #a6caff !important;
	border-color: #568ddd !important;
}

/* 이전 달성 구간(현재 최고 구간이 아님) */
/* .bm-complex-list .goal-done {
	background: var(--bh_color_gray_100, #f5f5f5) !important;
	border-color: var(--bh_color_gray_300, #e0e0e0) !important;
}

.bm-complex-list .goal-done strong {
	color: var(--bh_color_gray_900, #1a1a1a) !important;
}

.bm-complex-list .goal-done span {
	color: var(--bh_color_gray_600, #6b6b6b) !important;
} */

.bm-complex-list .apt-copy {
	font-size: 14px;
	font-weight: 500;
	color: var(--bh_color_gray_900);
	background: rgba(253, 238, 234, 0.2);
	border: 1px solid var(--bh_color_main_100);
	
	border-radius: 5px;
	padding: 10px 15px;
	margin-bottom: 20px;
	@media (max-width: 992px){
		margin-bottom: 10px;	
	}
}

.bm-complex-list .apt-copy b {
	color: var(--bh_color_main, #e8502a);
}

.bm-complex-list .apt-actions {
	display: flex;
	gap: 10px;
}

.bm-complex-list .btn-s {
	min-height: 44px;
	flex: 1;
	border-radius: 5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	font-weight: 700;
	border: 1px solid transparent;
	cursor: pointer;
	font-family: inherit;
	transition: 0.3s;
	text-decoration: none;
	@media (max-width: 992px){
		min-height: 36px;
		font-size: 14px;
	}
}

.bm-complex-list .btn-s.fill {
	background: var(--bh_color_white);
	color: var(--bh_color_main);
	border-color: var(--bh_color_main);
}

.bm-complex-list .btn-s.fill i {
	font-size: 18px;
	line-height: 1;
	margin-left: 10px;
	@media (max-width: 992px){
		margin-left: 5px;
		font-size: 18px;
	}
}

.bm-complex-list .btn-s.fill:hover {
	background: var(--bh_color_main);
	border-color: var(--bh_color_main);
	color: var(--bh_color_static_white);
}

.bm-complex-list .btn-s.line {
	background: var(--bh_color_static_white);
	border-color: var(--bh_color_gray_300);
	color: var(--bh_color_gray_600);
}

.bm-complex-list .btn-s.line:hover {
	background: var(--bh_color_gray_100);
	color: var(--bh_color_gray_600);
}

.bm-complex-list .bm-complex-empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 40px 20px;
	text-align: center;
	color: var(--bh_color_gray_600, #6b6b6b);
	border: 1.5px dashed var(--bh_color_gray_300, #e0e0e0);
}

.bm-complex-list .bm-complex-pager{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
	margin-top: 50px;
	@media (max-width: 992px){
		margin-top: 20px;
		gap: 10px;
	}
}

.bm-complex-list .bm-complex-pager button {
	font-size: 24px;
	line-height: 1;
	color: var(--bh_color_gray_500);
	@media (max-width: 992px){
		font-size: 20px;
	}
}

.bm-complex-list .bm-complex-pager button:disabled{
    opacity:.4;
    cursor:default;
} 

.bm-complex-list .bm-complex-pager .pager-numbers{
    display: flex;
    gap: 10px;
	@media (max-width: 992px){
		gap: 5px;
	}
}

.bm-complex-list .bm-complex-pager .pager-numbers button{
    width: 32px;
    height: 32px;
	border: none;
    background: transparent;
    color: var(--bh_color_gray_500);
    cursor: pointer;
    border-radius: 50%;
	font-size: 16px;
	font-weight: 500;
	@media (max-width: 992px){
		width: 28px;
		height: 28px;

	}
}

.bm-complex-list .bm-complex-pager .pager-numbers button.active{
    background: var(--bh_color_main);
    color: var(--bh_color_white);
}