@charset "utf-8";


/*-------------------------------------------------------------------
	분류그룹 : Normalize
	속성순서 : 레이아웃, 박스 모델, 배경, 폰트/정렬, 기타
-------------------------------------------------------------------*/
/* ------ font ------ */
html {font-size: 62.5%;}
body {font-size: 1.6rem; line-height: 1.5;}
* {line-height: 1.5;}

/* ------ all style ------ */
* {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
html, body {color:#000; word-break: keep-all; overflow-wrap: break-word; font-family: 'Pretendard GOV','Pretendard', 'Noto Sans KR', sans-serif;}
html, body {-webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; -o-text-size-adjust: none;} /* 폰트확대X */

/* ------ tag ------ */
body, div, p, h1, h2, h3, h4, h5, h6,
ul, ol, li, dl, dt, dd, table, th, td,
form, fieldset, legend, input, textarea, a, button, select,
span, strong, em, label, ::before, ::after {margin:0px; padding:0px; line-height: inherit; box-sizing: border-box;}
header, footer, article, aside, details, figcaption, figure, hgroup, main, menu, nav, section {display: block; margin:0px; padding:0px;}
pre {font-family: inherit;}
table, th, td {border-spacing: 0px; border-collapse:collapse;}
img, fieldset {max-width: 100%; border: 0px;}
em {font-style: normal;}
/* ------ list ------ */
ul, ol, dl, dt, dd {list-style:none;}
/* ------ link ------*/
a, a:link, a:visited, a:active, a:hover, a:focus {color: inherit; text-decoration:none;}
/* ------ form ------ */
input, textarea, select, button {border: 0; font-family: inherit;}
input[type=text], input[type=tel], input[type=password], input[type=file], input[type=number], input[type=email], input[type=date], input[type=search], select,
textarea {vertical-align:middle; -webkit-box-shadow: none; box-shadow: none; appearance: none; -webkit-appearance: none; -moz-appearance: none;}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {-webkit-box-shadow: 0 0 0 30px #ffffff inset !important; -webkit-text-fill-color: inherit; transition: background-color 5000s ease-in-out 0s;} /* 자동완성 */
input[type="text"]::-ms-clear {display: none;}
input[type="number"] {-moz-appearance: textfield;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {margin: 0; appearance: none; -webkit-appearance: none;}
input[type="text"]::placeholder {color:gray; font-style:italic;}
textarea::placeholder {color:gray; font-style:italic;}
button, input[type="button"], input[type="submit"] {cursor: pointer;}
/* IE 10, 11의 네이티브 화살표 숨기기 */
select::-ms-expand {display: none;}


/*-------------------------------------------------------------------
	@공통변수
-------------------------------------------------------------------*/
:root {
    /* ------ 여백 ------ */
    --sp-0 : 0;
    --sp-02 : 0.2rem;
    --sp-04 : 0.4rem;
    --sp-08 : 0.8rem;
    --sp-10 : 1rem;
    --sp-12 : 1.2rem;
    --sp-16 : 1.6rem;
    --sp-20 : 2rem;
    --sp-24 : 2.4rem;
    --sp-28 : 2.8rem;
    --sp-32 : 3.2rem;
    --sp-36 : 3.6rem;
    --sp-40 : 4rem;
    --sp-44 : 4.4rem;
    --sp-48 : 4.8rem;
    --sp-52 : 5.2rem;
    --sp-56 : 5.6rem;
    --sp-60 : 6rem;
    --sp-64 : 6.4rem;
    --sp-68 : 6.8rem;
    --sp-72 : 7.2rem;
    --sp-76 : 7.6rem;
    --sp-80 : 8rem;
    --sp-84 : 8.4rem;
    --sp-88 : 8.8rem;
    --sp-92 : 9.2rem;
    --sp-96 : 9.6rem;
    --sp-100 : 10rem;

    /* ------ 색상 ------ */
    --color-white: #ffffff;
    --color-black: #000000;

    --color-danger: #E8003B;
    --color-danger-5: #FEECF0;
    --color-danger-10: #FCD4DE;
    --color-danger-20: #F799B1;
    --color-danger-30: #F36689;
    --color-danger-50: #E8003B;
    --color-danger-40: #EF3E5E;
    --color-danger-60: #D50136;
    --color-danger-70: #BD0023;
    --color-danger-80: #5E0018;
    --color-danger-90: #2F000C;

    --color-warning: #FFB724;
    --color-warning-5: #FFF8E9;
    --color-warning-10: #FFEAC1;
    --color-warning-20: #FFE2A7;
    --color-warning-30: #FFD47C;
    --color-warning-50: #FFB724;
    --color-warning-40: #FFC550;
    --color-warning-60: #98690A;
    --color-warning-70: #66490E;
    --color-warning-80: #4D370B;
    --color-warning-90: #332507;

    --color-success: #008A1E;
    --color-success-5: #EEF7F0;
    --color-success-10: #CEE9D4;
    --color-success-20: #B2DCBB;
    --color-success-30: #8CCA99;
    --color-success-40: #33A14B;
    --color-success-50: #008A1E;
    --color-success-60: #006E18;
    --color-success-70: #005312;
    --color-success-80: #00370C;
    --color-success-90: #002207;

    --color-info: #2768FF;
    --color-info-5: #E9F0FF;
    --color-info-10: #D4E1FF;
    --color-info-20: #A9C3FF;
    --color-info-30: #7DA4FF;
    --color-info-40: #5286FF;
    --color-info-50: #2768FF;
    --color-info-60: #1F53CC;
    --color-info-70: #173E99;
    --color-info-80: #0C1F4D;
    --color-info-90: #040A1A;

    /* 색상 > primary */
    --color-primary: #246BEB;
    --color-primary-5: #EFF5FF;
    --color-primary-10: #D3E1FB;
    --color-primary-20: #A7C4F7;
    --color-primary-30: #7CA6F3;
    --color-primary-40: #5089EF;
    --color-primary-50: #246BEB;
    --color-primary-60: #1D56BC;
    --color-primary-70: #16408D;
    --color-primary-80: #0E2B5E;
    --color-primary-90: #07152F;
    /* 색상 > secondary */
    --color-secondary: #003675;
    --color-secondary-5: #EDF1F5;
    --color-secondary-10: #CDD7E4;
    --color-secondary-20: #B4C4D6;
    --color-secondary-30: #99B0CB;
    --color-secondary-40: #2A5C96;
    --color-secondary-50: #003675;
    --color-secondary-60: #002B5E;
    --color-secondary-70: #002046;
    --color-secondary-80: #00162F;
    --color-secondary-90: #000B17;
    /* 색상 > point */
    --color-point: #E71825;
    --color-point-5: #FDF2F3;
    --color-point-10: #FAD1D3;
    --color-point-20: #F5A3A8;
    --color-point-30: #F1747C;
    --color-point-40: #EC4651;
    --color-point-50: #E71825;
    --color-point-60: #B9131E;
    --color-point-70: #8B0E16;
    --color-point-80: #5C0A0F;
    --color-point-90: #2E0507;

    /* 색상 > gray */
    --color-gray-5: #F8F8F8;
    --color-gray-10: #F0F0F0;
    --color-gray-20: #E4E4E4;
    --color-gray-30: #D8D8D8;
    --color-gray-40: #C6C6C6;
    --color-gray-50: #8E8E8E;
    --color-gray-60: #717171;
    --color-gray-70: #555555;
    --color-gray-80: #2D2D2D;
    --color-gray-90: #1D1D1D;

	--color-main : #0f49b5;
    --color-main-5 : #f7f9fd;
    --color-main-10 : #e7f0fb;
    --color-main-20 : #cde1f8;
    --color-main-30 : #80aee4;
	--color-main-40 : #2f79cf;
    --color-main-50 : #0f49b5;
	--color-main-60 : #003284;
	--color-main-70 : #031c70;
	--color-main-80 : #06065c;
	--color-main-90 : #030337;
    
	--color-important : #ed0101;

    --color-gray-blue : #6b7e9e;
    --color-gray-blue-5 : #f6f8fc;
    --color-gray-blue-10 : #eef1f7;
    --color-gray-blue-20 : #d6dce8;
    --color-gray-blue-30 : #b1b9cf;
    --color-gray-blue-40 : #8a96b2;
    --color-gray-blue-50 : #6b7e9e;
    --color-gray-blue-60 : #576689;
    --color-gray-blue-70 : #3f4e73;
    --color-gray-blue-80 : #2b395d;
    --color-gray-blue-90 : #1b2747;

    /* ------ border ------ */
    --radius-1: 0.1rem;
    --radius-2: 0.2rem;
    --radius-4: 0.4rem;
    --radius-6: 0.6rem;
    --radius-8: 0.8rem;
    --radius-10: 1rem;
    --radius-12: 1.2rem;
    --radius-full: 9999px;

    /* ------ 서체 ------ */
    --fz-display-sm: 4rem;
    --fz-display-md: 5rem;
    --fz-display-lg: 6.6rem;
    --fz-heading-sm: 3.2rem;
    --fz-heading-md: 4rem;
    --fz-heading-lg: 5rem;
    --fz-title-xsm: 1.5rem;
    --fz-title-sm: 1.7rem;
    --fz-title-md: 1.9rem;
    --fz-title-lg: 2.1rem;
    --fz-title-xlg: 2.5rem;
    --fz-title-xxlg: 3.2rem;
    --fz-body-sm: 1.5rem;
    --fz-body-md: 1.7rem;
    --fz-body-lg: 1.9rem;
    --fz-link-sm: 1.5rem;
    --fz-link-md: 1.7rem;
    --fz-link-lg: 1.9rem;
    --fz-detail-sm: 1.3rem;
    --fz-detail-md: 1.5rem;
    --fz-detail-lg: 1.7rem;
    --fz-label-xsm: 1.3rem;
    --fz-label-sm: 1.5rem;
    --fz-label-md: 1.7rem;
    --fz-label-lg: 1.9rem;

    --mobile-fz-display-sm: 2.5rem;
    --mobile-fz-display-md: 3.2rem;
    --mobile-fz-display-lg: 4rem;
    --mobile-fz-heading-sm: 2.5rem;
    --mobile-fz-heading-md: 3.2rem;
    --mobile-fz-heading-lg: 4rem;
    --mobile-fz-title-xxlg: 2.5rem;
}



/*-------------------------------------------------------------------
    분류이름: FAQ 게시판 목록
    분류그룹: 게시판 > 게시판 목록 구성 (중단)
-------------------------------------------------------------------*/
.bod-list-wrap .bod-list-body .bod-faq-list {display: block; border-top: 2px solid var(--color-secondary-90);}
.bod-list-wrap .bod-list-body .bod-faq-list .mark {display: flex; position: relative; width: var(--sp-36); height: var(--sp-36); border-radius: 50%; background-color: var(--color-main-60); line-height: 1; font-weight: 700; font-size: 1.7rem; color: var(--color-white); align-items: center; justify-content: center; flex-shrink: 0;}

.bod-list-wrap .bod-list-body .bod-faq-list .list {display: block;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li {width: 100%;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question {display: flex; position: relative; width: 100%; height: auto; padding: var(--sp-16) var(--sp-40) var(--sp-16) var(--sp-24); border-bottom: 1px solid var(--color-gray-40); background-color: var(--color-white); font-size: 1.7rem; color: var(--color-gray-80); align-items: center;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question::before {content:""; display: block; width: var(--sp-68); height: 100%;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .num {display: flex; position: absolute; top: var(--sp-16); left: var(--sp-24); width: var(--sp-68); height: calc(100% - 3.2rem); font-weight: 400; font-size: inherit; color: inherit; text-align: left; align-items: center;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .mark {margin-right: var(--sp-40);}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .category {display: block; min-width: 12rem; margin-right: var(--sp-40); font-weight: 400; font-size: inherit; color: inherit; word-break: break-word; flex-shrink: 0;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .tit {display: block; overflow: hidden; font-weight: 500; font-size: inherit; color: inherit; text-align: left; width: 100ch;}

.bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area {display: none; padding: var(--sp-16) var(--sp-24) var(--sp-16) var(--sp-92); border-bottom: 1px solid var(--color-gray-30); background-color: rgba(15, 73, 181, 0.03);}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con {display: flex;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .mark {margin-right: var(--sp-40);}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .txt {display: block; margin-top: auto; margin-bottom: auto; font-weight: 600; font-size: 1.7rem; color: var(--color-gray-80);}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .txt .btn-link {display: inline-block; position: relative; padding-right: var(--sp-20); font-weight: 500; font-size: inherit; color: var(--color-main); text-decoration: underline; background:url(../images/board/i_link.svg) no-repeat right center / 1.8rem;}

/*-------------------------------------------------------------------
	@variation
-------------------------------------------------------------------*/
.bod-list-wrap .bod-list-body .bod-faq-list .mark[data-s-type="q"] {background-color: var(--color-main-60);}
.bod-list-wrap .bod-list-body .bod-faq-list .mark[data-s-type="a"] {background-color: var(--color-main-40);}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question.fold::after {content:""; position: absolute; top: calc(50% - 0.8rem); right: var(--sp-16); width: var(--sp-16); height: var(--sp-16); background: url(../images/common/i_arr_up.svg) no-repeat center / var(--sp-16); transform: rotate(180deg);}
/*-------------------------------------------------------------------
	@interaction
-------------------------------------------------------------------*/
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question {transition: color 0.3s;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question:focus-visible,
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question:hover,
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question.active {font-weight: 600; color: var(--color-main);}

/* fold */
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question.fold::after {transition: transform 0.3s;}
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question.fold.active::after {transform: rotate(0);}

/* accessibility */
.bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question:focus-visible {outline: 2px dashed var(--color-main); outline-offset: -0.4em;}


/* paging */
.accessibility-hidden {position: absolute;overflow: hidden;width: 1px;height: 1px; clip: rect(1px 1px 1px 1px)}
.paging {margin: 20px 0;text-align: center;font-size: 1.077em}
.paging a, .paging span {display: inline-block;padding:6px 10px;}
.paging a.paging-navi {width: 36px;height: 36px; line-height: 36px;padding: 0;border: 1px solid #b3b3b3}
.paging span {margin-right: 2px;border-bottom: 2px solid #e50013;color: #e50013;font-weight: 600}

/*-------------------------------------------------------------------
	@media
-------------------------------------------------------------------*/
@media screen and (max-width: 1200px){
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .mark {margin-right: var(--sp-24);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .category {margin-right: var(--sp-24);}

    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .mark {margin-right: var(--sp-24);}
}
@media screen and (max-width: 1024px){
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question {font-size: 1.5rem;}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question::before {width: var(--sp-48);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .num {width: var(--sp-48);}

    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area {padding: var(--sp-16) var(--sp-24) var(--sp-16) var(--sp-72);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .txt {font-size: 1.5rem;}
}
@media screen and (max-width: 768px){
    .bod-list-wrap .bod-list-body .bod-faq-list .mark {width: var(--sp-28); height: var(--sp-28);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question {padding: var(--sp-12) var(--sp-40) var(--sp-12) var(--sp-20); flex-wrap: wrap;}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question::before {display: none;}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .mark {margin-right: var(--sp-12);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .num {position: relative; top: auto; left: auto; height: auto; width: auto; min-width: var(--sp-20); margin-right: var(--sp-12);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .category {margin-right: var(--sp-12); text-align: left;}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question .tit {width: 100%; margin-top: var(--sp-08); font-size: 1.5rem; order: 3;}

    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area {padding: var(--sp-12) var(--sp-20);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .mark {margin-right: var(--sp-12);}
}
@media screen and (max-width: 425px){
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question {padding: var(--sp-12) var(--sp-32) var(--sp-12) var(--sp-16);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .btn-question.fold::after {right: var(--sp-08);}

    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area {padding: var(--sp-12) var(--sp-16);}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con {display: block;}
    .bod-list-wrap .bod-list-body .bod-faq-list .list > li .answer-area .area-con .mark {margin-bottom: var(--sp-08); margin-right: 0;}
}
/*-------------------------------------------------------------------
    분류이름: 게시판 목록 구성 (상단)
    분류그룹: 게시판
-------------------------------------------------------------------*/
.bod-list-wrap .bod-list-head {display: block;}
.bod-list-wrap .bod-list-head .head-category {display: block;}
.bod-list-wrap .bod-list-head .head-category .list {display: flex; overflow-y: hidden; overflow-x: auto; margin-bottom: var(--sp-40); gap: var(--sp-04);}
.bod-list-wrap .bod-list-head .head-category .list > li {display:block; flex: 1 0 0;}
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category {display: flex; position: relative; width: 100%; min-height: var(--sp-48); height: 100%; padding: 0 var(--sp-16); border: 1px solid transparent; border-radius: var(--radius-6); background-color: var(--color-gray-5); font-weight: 500; font-size: 1.6rem; text-align: center; white-space: nowrap; cursor: pointer; align-items: center; justify-content: center}

/* 정렬 및 조건 */
.bod-list-wrap .bod-list-head .head-function {display: flex; padding-bottom: var(--sp-12); justify-content: space-between; align-items: center;}
.bod-list-wrap .bod-list-head .head-function .total {display: block; color: var(--color-gray-70);}
.bod-list-wrap .bod-list-head .head-function .total em {font-weight: 700; color: var(--color-danger);}
.bod-list-wrap .bod-list-head .head-function .utils {display: flex; margin-left: auto; gap: 0 var(--sp-20); align-items: center; flex-shrink: 0;}
.bod-list-wrap .bod-list-head .head-function .utils .condition {display: flex; gap: var(--sp-08); align-items: center;}
.bod-list-wrap .bod-list-head .head-function .utils .condition .item {display: block;}
.bod-list-wrap .bod-list-head .head-function .utils .condition .btn-apply {min-width: var(--sp-72); width: 100%; justify-content: center;}

.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list {display: flex; gap: var(--sp-04); flex-shrink: 0;}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li {display: block;}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view {display: flex; position: relative; width: var(--sp-32); height: var(--sp-32); border: 1px solid var(--color-gray-40); border-radius: 0.4rem; background-color: #fff; align-items: center; justify-content: center;}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view::before {content:""; display: block; width: var(--sp-20); height: var(--sp-20); background-repeat: no-repeat; background-position: center; background-size: contain;}

/* 버튼 모음 */
.bod-list-wrap .bod-list-head .head-function .utils .btn-utils {display: flex; gap: var(--sp-08); align-items: center;}
.bod-list-wrap .bod-list-head .head-function .utils .btn-utils .btn {vertical-align: middle;}
.bod-list-wrap .bod-list-head .head-function .utils .btn-utils .btn-list {display: block; width: var(--sp-72); height: var(--sp-36); border-radius: 0.4rem; border: 1px solid var(--color-main); background-color: var(--color-main); color: var(--color-white);}
.bod-list-wrap .bod-list-head .head-function .utils .btn-utils .btn-icon {display: block; width: var(--sp-32); height: var(--sp-32); border: 1px solid var(--color-gray-40); border-radius: var(--sp-04); background-color: transparent; background-repeat: no-repeat; background-position: center; background-size: 2.4rem;}
/*-------------------------------------------------------------------
@variation
-------------------------------------------------------------------*/
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view[data-view-type="a"]::before {background-image: url(../images/board/i_view_a.svg);}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view[data-view-type="b"]::before {background-image: url(../images/board/i_view_b.svg);}

/* 다운로드 (모달) */
.bod-list-wrap .bod-list-head .head-function .utils .btn-utils .btn-icon.btn-download {background-image: url(../images/common/i_down.svg);}
/*-------------------------------------------------------------------
    @interaction
-------------------------------------------------------------------*/
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category {transition: border 0.3s, background 0.3s, color 0.3s;}
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category:focus-visible {outline: 2px solid var(--color-primary); outline-offset: -0.4em;}
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category:hover {background-color: var(--color-main-10);}
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category.active {border-color: var(--color-main); background-color: #fff; font-weight: 700; color: var(--color-main);}
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category::after {transition: left 0.3s, width 0.3s;}
.bod-list-wrap .bod-list-head .head-category .list > li > .btn-category.active::after {left: 0; width: 100%;}

.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view {transition: border 0.3s, background 0.3s;}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view:focus-visible,
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view:hover {border-color: var(--color-main-40); background-color: var(--color-primary-5);}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view.active {border-color: var(--color-main-40); background-color: var(--color-main-40);}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view[data-view-type="a"].active::before {background-image: url(../images/board/i_view_a_white.svg);}
.bod-list-wrap .bod-list-head .head-function .utils .list-view > .list > li .btn-view[data-view-type="b"].active::before {background-image: url(../images/board/i_view_b_white.svg);}

/*-------------------------------------------------------------------
	@media
-------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
    .bod-list-wrap .bod-list-head .head-category .list > li > .btn-category {min-height: var(--sp-40); padding: 0 var(--sp-08); font-size: 1.5rem;}
}
@media screen and (max-width: 768px) {
    .bod-list-wrap .bod-list-head .head-category .list {margin-bottom: var(--sp-24);}

    .bod-list-wrap .bod-list-head .head-function {display: block;}
    .bod-list-wrap .bod-list-head .head-function .total {margin-bottom: var(--sp-08);}
    .bod-list-wrap .bod-list-head .head-function .utils {gap: var(--sp-16);}
    .bod-list-wrap .bod-list-head .head-function .utils .condition {flex-grow: 1;}
    .bod-list-wrap .bod-list-head .head-function .utils .condition .item.w-100 {flex-grow: 1; flex-basis: 0;}

    .bod-list-wrap .bod-list-head .head-function .utils .btn-utils {width: 100%;}
    .bod-list-wrap .bod-list-head .head-function .utils .btn-utils .btn-return {margin-left: auto;}
}
@media screen and (max-width: 425px) {
    .bod-list-wrap .bod-list-head .head-function .utils {display: block;}
    .bod-list-wrap .bod-list-head .head-function .utils .list-view {margin-top: var(--sp-08);}
    .bod-list-wrap .bod-list-head .head-function .utils .list-view > .list {justify-content: flex-end;}

    .bod-list-wrap .bod-list-head .head-function .utils .condition {display: block;}
    .bod-list-wrap .bod-list-head .head-function .utils .condition .item {width: 100%;}
    .bod-list-wrap .bod-list-head .head-function .utils .condition .item + .item {margin-top: var(--sp-08);}
}