@charset "utf-8";

/*
*--------------------------------------------*
|             Responsive Variable            |
*--------------------------------------------*
*/
:root {
	--pd-bg-base: #fff;
    --pd-text-base: 16px;
    --pd-font-color-base: #1e2124;
    --pd-pc-width-base: 1200px;

    --transition-speed: 0.25s;
    --transition-ease: ease-in-out; 
    --transition-linear: linear; 

    --pd-bdrs-base: 3px;
}

html, body { font-family: PretendardGOV; font-size: var(--pd-text-base); }
body{ color: var(--pd-font-color-base);}
header, main, footer{ position: relative; z-index: 2; }
/*.body-container{ overflow: hidden;}*/

/*
*--------------------------------------------*
|                   Common                   |
*--------------------------------------------*
*/
* { margin: 0; padding: 0; font-family: Pretendard Variable; box-sizing: border-box;}
.common-loading-bar{ display: none; z-index: 99999; position: absolute; top: 50%; left: 50%; margin: 37px 0 0 -25px; width: 50px; height: 50px; }
.common-loading-bar:after{ content: ""; background-image: url(https://assets.nflxext.com/en_us/pages/wiplayer/site-spinner.png); background-repeat: no-repeat; background-position-x: 50%; background-position-y: 50%; -moz-background-size: 100%; -o-background-size: 100%; background-size: 100%; position: absolute; margin: -6px; width: inherit; height: inherit; animation: nfLoader-spin 1.1s linear infinite,1!important; -webkit-animation: nfLoader-spin 1.1s linear infinite,1!important; }
@keyframes nfLoader-spin {
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes nfLoader-spin {
  100% {
    -webkit-transform: rotate(360deg);
  }
}
body{ position: relative; }
.for-pc{ display: block !important; }
.for-mo{ display: none !important; }
.for-tb{ display: none !important; }

.visually-hidden{ position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip: rect(0 0 0 0); clip-path: inset(100%); overflow: hidden; white-space: nowrap; }
.wrong-message{ display: none; position: relative; margin-top: -4px; width: 100%; padding-left: 22px; color: #bd2c0f; font-size: 14px; font-weight: normal; line-height: 1.5; letter-spacing: normal; text-align: left; box-sizing: border-box; }
.wrong-message::before{ content: ""; width: 16px; height: 16px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); background: url("/images/common/icons/icon_wrong_message.png") no-repeat center center / cover; }

.check-box label{ display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: normal; letter-spacing: normal; text-align: left; color: #131416; cursor: pointer; }
.check-box label .check{ flex-shrink: 0; position: relative; display: inline-block; width: 18px; height: 18px; border: 1px solid #cdd1d5; border-radius: 4px; background-color: #fff;}
.check-box input[type="checkbox"]:checked + label .check{ display: inline-block; border: none; }
.check-box input[type="checkbox"]:checked + label .check::after{ content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background: url("/images/common/icons/common_checked.png") no-repeat center center / cover; }

.radio-box-wrap{ display: flex; flex-direction: column; align-items: flex-start; }
.radio-box-wrap .radio-box{ display: flex; align-items: center; }
.radio-box-wrap label{ display: flex; align-items: center; gap: 8px; color: #131416; font-size: 16px; font-weight: normal; line-height: normal; letter-spacing: normal; text-align: left; cursor: pointer; }
.radio-box-wrap input[type="radio"] + label .icon.radio{ width: 20px; height: 20px; border-radius: 100%; border: 1px solid #cdd1d5; }
.radio-box-wrap input[type="radio"]:checked + label .icon.radio{ position: relative; background-color: #fff; border: 1px solid #149174; }
.radio-box-wrap input[type="radio"]:checked + label .icon.radio::before{ content: ""; position: absolute; width: 10px; height: 10px; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 1px solid #149174; border-radius: 100%; background-color: #149174; }

.common-textarea{ padding: 20px; color: #bcbcbc; font-size: 16px; font-weight: normal; line-height: 1.6; letter-spacing: -0.32px; text-align: left; border-radius: var(--pd-bdrs-base8); border: solid 1px #414141; background-color: rgba(255, 255, 255, 0.05); box-sizing: border-box !important; resize: none; }
.common-textarea:focus{ border: 1px solid #149174;  }

.file-list{ margin-top: 20px; padding: 22px 0; color: #464c53; border-top: 1px solid #cdd1d5; border-bottom: 1px solid #cdd1d5;}
.file-list > a{ display: flex; align-items: center; gap: 10px; color: #464c53 !important; }
.file-list .file-icon { display: inline-block; width: 20px; height: 20px; background: url("/images/common/icons/common-icon-download.svg") no-repeat 50% 50%; vertical-align: middle; }
.reply-area .file-list { border-bottom: 0;}

.k-datepicker{ width: 140px; height: 44px; color: var(--white) !important; border-radius: var(--pd-bdrs-base4) !important; border: solid 1px #808080 !important; background-color: #0e0e0e !important; }
.k-datepicker .k-button-md.k-icon-button{ background-color: #0e0e0e !important; }
.k-datepicker .k-button-md.k-icon-button .k-button-icon{ width: 24px; height: 24px; background: url("/images/common/icons/common-icon-calendar.png"); }
.k-datepicker .k-button-md.k-icon-button .k-button-icon > svg{ display: none; }
.k-input-md .k-input-inner{ font-size: 14px; font-weight: normal; letter-spacing: -0.2px; }

/*
*--------------------------------------------*
|                    Gnb                     |
*--------------------------------------------*
*/
.logo{ width: 79px; margin-right: 164px; }
.logo *{ width: 100%; }
.logo > a{ display: inline-block;}
.gnb{ z-index: 10; position: fixed; top: 0; left: 0; padding: 0 10px; width: 100%; height: fit-content; transition: all var(--transition-speed); border-bottom: 1px solid #e6e8ea; background: #fff;}
.gnb-inner{ display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; width: var(--pd-pc-width-base); }
.gnb.fixed{ background-color: var(--pd-bg-base); }
.gnb .h-login{ font-size: 16px; font-weight: bold; letter-spacing: normal; color: #1e2124;}
.h-login .icon-login{ display: inline-block; margin-right: 8px; width: 20px; height: 20px; vertical-align: sub; background: url("/images/common/icons/gnb_icon_login.png") no-repeat center center / cover; }
.h_logout .icon-logout{ display: inline-block; margin-right: 8px; width: 20px; height: 20px; vertical-align: sub; background: url("/images/common/icons/gnb_icon_logout.png") no-repeat center center / cover; }
.gnb .btn-admin{ width: 24px; height: 25px; background: url(/images/common/common-icon-settings.png) no-repeat center center; }
.gnb .menu-list ul{ display: flex; }
.gnb .menu-list ul > li { flex-shrink: 0; min-width: 175px; }
.gnb .menu-list ul > li > a { position: relative;}
.gnb .menu-list ul > li > a:before { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 0; background-color: #149174;}
.gnb .menu-list ul > li > a.active:before{ height: 2px;}
.gnb .menu-list ul li a{ color: var(--pd-font-color-base); font-size: 18px; font-weight: bold; letter-spacing: normal; }
.gnb .menu-list ul > li > a{ display: block; line-height: 105px; height: fit-content; padding: 0 16px; text-align: center; }
.logo, .gnb .menu-list ul > li > a, .gnb .util{ line-height: 105px; }
.gnb .util{ margin-left: auto; display: flex; align-items: center; gap: 15px; height: 105px; }
.gnb .util > li{ display: flex; align-items: center; height: 100%; }
.gnb .util [class^="btn-"]{ width: 32px; height: 36px; }
.gnb .util .search-wrap{ display: flex; justify-content: flex-end; position: relative; width: fit-content; height: 44px; }
.gnb .util .search-wrap .input-search{ opacity: 0; visibility: hidden; width: 32px; height: 100%; padding: 7px 8px; transition: all var(--transition-speed); }
.gnb .util .search-wrap.active .input-search{ opacity: 1; visibility: visible; width: 360px; padding-left: 36px; padding-right: 34px; background-color: rgba(255, 255, 255, 0.15); border-radius: var(--pd-bdrs-base); }
.gnb .util .search-wrap.active .input-search::placeholder{ font-size: 0.9375rem; font-weight: 500; letter-spacing: normal; }
.gnb .util .search-wrap .btn-search{ position: absolute; top: 50%; left: 0; transform: translateY(-50%); background: url("/images/common/icon-comm-gnb-search.png") no-repeat center center / 70%; }
.gnb .util .search-wrap .btn-cancle{ width: 24px; height: 24px; display: none; position: absolute; top: 50%; transform: translateY(-50%); right: 8px; background: url("/images/common/icons/search-icon-cancle.png") no-repeat center center / cover; }
#headerGnb nav li ol{ display: none; background: #fff; width: 100%; height: fit-content; padding: 39px 0 32px; }
#headerGnb nav li ol li:not(:last-child){ margin-bottom: 10px;}
#headerGnb nav li ol li a{ display: inline-block; padding: 9px 0; width: 100%; font-size: 16px; font-weight: normal; letter-spacing: normal; text-align: center; color: #1e2124; text-align: center;}
#headerGnb nav li ol li:hover a{ font-weight: bold; color: #149174;}

/*
*--------------------------------------------*
|                   Swiper                   |
*--------------------------------------------*
*/
.swiper-container{ position: relative; }
.swiper-slide{ opacity: 1; transition: opacity var(--transition-speed) var(--transition-ease); cursor: pointer; }
.swiper-slide.swiper-slide-prev{ opacity: 0.5 !important; }
.swiper-slide .contents-wrap{ position: relative; overflow: hidden; border-radius: var(--pd-bdrs-base); aspect-ratio: 2 / 3; }
.swiper-slide .contents-wrap > img{ width: 100%; height: 100%; object-fit: cover; }
.common-swiper-wrap .swiper-button-next,
.common-swiper-wrap .swiper-button-prev{ width: 32px !important; height: 32px !important; }
.common-swiper-wrap .swiper-button-next{ right: 10px !important; }
.common-swiper-wrap .swiper-button-prev{ left: -40px !important; }
.common-swiper-wrap .swiper-button-prev:after, 
.common-swiper-wrap .swiper-button-next:after{ content: "" !important; width: 100%; height: 100%; background: url("/images/common/common-sprites-slide.png") no-repeat center center / 104px 52px !important; }
.common-swiper-wrap .swiper-button-prev:after{ background-position: -62px -10px !important; }
.common-swiper-wrap .swiper-button-next:after{ background-position: -10px -10px !important; }


/*
*--------------------------------------------*
|                   Kendo                    |
*--------------------------------------------*
*/
/* kendo datepicker */
.k-datepicker.datepicker{ border-color: #ced4da;}
.datepicker-40{ height: 40px; font-size: 14px; letter-spacing: -0.28px; padding: 10px 15px; border-radius: 4px;}
.datepicker-50{ height: 50px; font-size: 15px; letter-spacing: -0.3px; padding: 15px 20px; border-radius: 6px;}
.datepicker-60{ height: 60px; font-size: 18px; letter-spacing: -0.36px; padding: 18px 20px; border-radius: 8px;}
.k-datepicker.datepicker .k-input-inner{ height: auto; padding: 0;}
.k-datepicker.datepicker .k-input-button{ width: 24px; height: 20px; background: url(../../images/sub/icon_datepicker.png) no-repeat 50% 50%;}
.k-datepicker.datepicker .k-input-button > .k-icon{ display: none;}

/* kendo datetimepicker */
.k-datetimepicker.datetimepicker{ border-color: #ced4da;}
.k-datetimepicker.datetimepicker.datetimepicker-40{ padding-right: 10px;}
.k-datetimepicker.datetimepicker.datetimepicker-50{ padding-right: 15px;}
.k-datetimepicker.datetimepicker.datetimepicker-60{ padding-right: 15px;}
.datetimepicker-40{ height: 40px; font-size: 14px; letter-spacing: -0.28px; border-radius: 4px;}
.datetimepicker-50{ height: 50px; font-size: 15px; letter-spacing: -0.3px; border-radius: 6px;}
.datetimepicker-60{ height: 60px; font-size: 18px; letter-spacing: -0.36px; border-radius: 8px;}
.k-datetimepicker.datetimepicker .k-input-inner{ height: auto; padding: 0;}
.k-datetimepicker.datetimepicker.datetimepicker-40 .k-input-inner{ padding: 10px 15px;}
.k-datetimepicker.datetimepicker.datetimepicker-50 .k-input-inner{ padding: 15px 20px;}
.k-datetimepicker.datetimepicker.datetimepicker-60 .k-input-inner{ padding: 18px 20px;}
.k-datetimepicker.datetimepicker .k-input-button{ width: auto; height: 100%; padding: 0 5px;}
.k-datetimepicker.datetimepicker .k-input-button > .k-icon{ width: 24px; height: 24px;}
.k-datetimepicker.datetimepicker .k-input-button > .k-icon::before{ width: 24px; height: 24px; padding: 0; content: '';}
.k-datetimepicker.datetimepicker .k-input-button > .k-icon.k-i-clock{ background: url(../../images/sub/icon_datetimepicker.png) no-repeat 50% 50%;}
.k-datetimepicker.datetimepicker .k-input-button > .k-icon.k-i-calendar::before{ background: url(../../images/sub/icon_datepicker.png) no-repeat 50% 50%;}

/* kendo grid */
.k-grid.grid-default{ width: 100%; border: none; border-top: 1px solid #000; border-radius: 0; box-shadow: none;}
.k-grid.grid-default .k-grid-header{ border-radius: 0; background-color: #fafafa;}
.k-grid.grid-default .k-grid-header .k-grid-header-wrap{ border: none;}
.k-grid.grid-default .k-grid-header th.k-header{ padding: 22px; line-height: 25px; font-size: 18px; color: #000; font-weight: 700; letter-spacing: -0.36px; border: none; border-bottom: 1px solid #eee; background: #fafafa;}
.k-grid.grid-default tr:hover{ background: none;}
.k-grid.grid-default tr.k-alt{ background: none;}
.k-grid.grid-default tr.k-state-selected{ background: none; box-shadow: none;}
.k-grid.grid-default tr td{ padding: 22px; line-height: 25px; font-size: 18px; color: #6c757d; letter-spacing: -0.36px; font-weight: 400; border: none; border-bottom: 1px solid #eee;}
.k-grid.grid-default tr td a{ color: #212529; text-decoration: none;}
.k-grid.grid-default tr td:hover a{ text-decoration: underline;}
.k-grid.grid-default tr td span.icon-file{ display: inline-block; width: 24px; height: 24px; vertical-align: middle; margin-left: 10px; background: url(../../images/sub/icon_file.png) no-repeat 50% 50% / cover;}
.k-grid.grid-default td.k-state-selected:hover, .k-grid.grid-default tr.k-state-selected:hover td, .k-grid.grid-default td.k-state-focused{ background: none; box-shadow: none;}
.k-grid-content-expander{ height: 0;}
.k-grid-norecords{ justify-content: center;}
.k-grid-norecords .no-data-cont{ display: flex; align-items: center; height: 100px;}

.k-grid-pager { display: flex !important; justify-content: center; margin-top: 48px; border: 0;text-align:center;width:100%;border-radius:0;line-height:1;padding:0;border:none;background:#fff;box-shadow:none;}
.k-grid-pager > a.k-link{display:inline-block;float:none;min-width:inherit;height:24px;border:none;border-radius:0;font-size:0;line-height:0}
.k-grid-pager > a.k-link span{width:24px;height:24px;text-indent:-9999px;display:block;background-repeat:no-repeat;background-position:center center;background-size:auto}
.k-grid-pager > ul.k-pager-numbers{display:inline-block;float:none}
.k-grid-pager > ul.k-pager-numbers li{float:left;width:24px;height:24px;position:relative;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;box-sizing:border-box}
.k-grid-pager > ul.k-pager-numbers li > a{ display: inline-block;width:100%;line-height:22px;color:#9e9e9e;box-shadow:none;font-size:12px;margin:0;border:none; border-right: 1px solid #e9e9e9; border-radius:0;min-width:inherit;background:none; box-sizing: border-box;}
.k-grid-pager > ul.k-pager-numbers li span{display:inline-block;width:100%;line-height:22px;color:#9e9e9e;box-shadow:none;font-size:12px;margin:0;border:none;border-radius:0;min-width:inherit;background:none}
.k-grid-pager > ul.k-pager-numbers li span.k-state-selected{background:#9e9e9e;color:#fff}
.k-grid-pager .k-pager-sizes, .k-grid-pager .k-pager-info{display:none}

.k-pager-numbers-wrap .k-icon-button .k-icon svg{ display: none !important; }
.k-pager-numbers-wrap .k-icon-button .k-icon.k-svg-i-caret-alt-to-left{ background: url("/images/common/icons/common_pager_first.png") no-repeat center center;}
.k-pager-numbers-wrap .k-icon-button .k-icon.k-svg-i-caret-alt-left{ background: url("/images/common/icons/common_pager_left.png") no-repeat center center;}
.k-pager-numbers-wrap .k-icon-button .k-icon.k-svg-i-caret-alt-to-right{ background: url("/images/common/icons/common_pager_last.png") no-repeat center center;}
.k-pager-numbers-wrap .k-icon-button .k-icon.k-svg-i-caret-alt-right{ background: url("/images/common/icons/common_pager_right.png") no-repeat center center;}
.k-pager-numbers button{ width: 40px; height: 40px; font-size: 16px; font-weight: normal; letter-spacing: normal; text-align: center; color: #464c53;}
.k-pager-numbers .k-selected{ font-size: 16px; font-weight: bold; color: #fff; border-radius: 6px; background-color: #149174 !important; }
.k-pager-numbers .k-disabled.k-pager-nav{ opacity: 0.5;}

/* grid template */
.k-grid.grid-template{ border: none; border-radius: 0; box-shadow: none;}
.k-grid.grid-template .k-grid-header{ display: none;}
.k-grid.grid-template tr td{ border: none;}
.k-grid.grid-template tr.k-state-selected{ border: none; background: none; box-shadow: none!important;}
.k-grid.grid-template tr.k-state-selected:hover{ border: none;}
.k-grid.grid-template tr.k-state-selected:hover td{ border: none; background: none;}
.k-grid.grid-template tr.k-state-selected:hover td.k-state-focused, .k-grid.grid-template tr:hover .k-state-focused.k-state-selected{ border: none; background: none; box-shadow: none!important;}
.k-grid.grid-template tr.k-state-selected td.k-state-focused{ border: none; background: none; box-shadow: none!important;}
.k-grid.grid-template tr td.k-state-focused{ border: none; background: none; box-shadow: none!important;}
.k-grid.grid-template tr:hover{ background: none;}

/* table-column */
table.table-column{ width: 100%; border-top: 1px solid #000;}
table.table-column tr th{ padding: 20px; line-height: 22px; text-align: center; font-size: 16px; color: #000; font-weight: 400; letter-spacing: -0.32px; border-bottom: 1px solid #eee; background: #f8f8f8; box-sizing: border-box;}
table.table-column tr td{ padding: 22px; line-height: 24px; text-align: center; font-size: 16px; color: #6c757d; font-weight: 400; border-bottom: 1px solid #eee; background: #fff; box-sizing: border-box;}
table.table-column tr td input[type=checkbox]+label{ justify-content: center;}

/* kendoDialog */
.k-dialog .k-dialog-close{ top: 13px; right: 12px; width: 28px; height: 28px; padding: 0; border-radius: 0; background: url(../../images/common/btn_dialog_close.png) no-repeat 50% 50%!important;}
.k-dialog .k-dialog-close > span{ display: none;}
.k-dialog .dialog-content{ padding: 53px 30px 30px;}
.k-dialog .dialog-content > img{ display: block; margin: 0 auto 16px;}
.k-dialog .dialog-content > p{ line-height: 33px; text-align: center; font-size: 24px; color: #000; font-weight: 600;}
.k-dialog .dialog-content > p > span{ color: #001f90; font-weight: 700;}
.k-dialog .dialog-content > span{ display: block; margin-top: 10px; line-height: 29px; text-align: center; font-size: 18px; color: #6c757d; font-weight: 400; letter-spacing: -0.36px;}
.k-dialog .k-dialog-buttongroup{ border: none; padding: 0 30px 25px;}
.k-dialog .k-dialog-buttongroup > button{ height: 50px; font-size: 16px; color: #212529; border-radius: 6px; border: 1px solid #c0c0c0; background: #fff;}
.k-dialog .k-dialog-buttongroup > button.k-button-solid-primary{ color: #fff; border: none; background: #001f90;}

.k-dialog .dialog-content.type2{ padding: 25px 30px; }

.k-dialog .k-window-content .info-box{ display: inline-block; width: 100%; padding: 25px; border-radius: 4px; background: #f8f8f8; box-sizing: border-box;}
.k-dialog .k-window-content .info-box > h3{ float: left; line-height: 34px; text-align: left; font-size: 18px; color: #212529; font-weight: 600;}
.k-dialog .k-window-content .info-box > h3 > i{ display: inline-block; width: 34px; height: 34px; vertical-align: middle; margin-right: 12px; border-radius: 100%; background: url(../../images/sub/icon_alert.png) no-repeat 50% 50% #fff;}
.k-dialog .k-window-content .info-box > ul{ float: left; width: 100%; margin-top: 6px;}
.k-dialog .k-window-content .info-box > ul > li{ float: left; display: flex; gap: 8px; width: 100%;}
.k-dialog .k-window-content .info-box > ul > li > p{ line-height: 27px; text-align: left; font-size: 16px; color: #6c757d; font-weight: 400;}
.k-dialog .k-window-content .info-box > ul > li > p > span{ color: #212529; font-weight: 600;}

/* file-upload */
.file-upload{ width: 100%;}
.file-upload .k-upload{ border-radius: 0; box-shadow: none;}
.file-upload .k-dropzone{ justify-content: start; padding: 12px 15px; background: #fafafa;}
.file-upload .k-upload .k-upload-button{ width: 124px; min-width: 124px; height: 50px; padding: 19px 25px; margin-right: 20px; line-height: 19px; text-align: center; font-size: 16px; color: #212529; font-weight: 700; letter-spacing: -0.32px; border-radius: 6px; box-sizing: border-box;}
.file-upload .k-dropzone .k-dropzone-hint{ margin-left: 0; font-size: 18px; color: #212529; font-weight: 400; font-style: normal; letter-spacing: -0.36px;}

/* file-grid */
.k-grid.file-grid{ width: 100%; padding: 22px 0; border-bottom: 1px solid #eee!important;}
.k-grid.file-grid .k-grid-norecords{ padding: 50px 0;}
.k-grid.file-grid tr td.file-td{ width: 100%;}
.k-grid.file-grid tr td.file-td .file-box{ display: flex; justify-content: start; align-items: center; width: 100%; margin-bottom: 4px;}
.k-grid.file-grid tr td.file-td:last-child .file-box{ margin-bottom: 0;}
.k-grid.file-grid tr td.file-td .file-box > i.file-icon{ display: inline-block; width: 24px; height: 24px; margin-right: 10px; background: url(../../images/sub/icon_download.png) no-repeat 50% 50%;}
.k-grid.file-grid tr td.file-td .file-box > p{ line-height: 23px; text-align: left; font-size: 18px; color: #222; font-weight: 400; letter-spacing: -0.36px; cursor: pointer;}
.k-grid.file-grid tr td.file-td .file-box > p:hover{ text-decoration: underline;}
.k-grid.file-grid tr td.file-td .file-box > span{ margin-left: 20px; line-height: 23px; text-align: left; font-size: 18px; color: #222; font-weight: 400; letter-spacing: -0.36px;}
.k-grid.file-grid tr td.file-td .file-box > button{ width: 20px; height: 20px; margin-left: 15px; border: none; background: url(../../images/sub/btn_del_file.png) no-repeat 50% 50%; cursor: pointer;}
.k-grid.file-grid .grid-btn-box .btn_inner { padding: 0 16px;}

/* kendo dropdownlist */
.k-dropdown.dropdownlist{ border-color: #ddd;}
.k-picker.dropdownlist, .k-widget.k-picker.dropdownlist{ border-color: #ddd;}
.k-dropdown.dropdownlist:focus{ box-shadow: none;}
.k-dropdown.dropdownlist.k-hover{ border-color: #222; background: #fff;}
.k-dropdown.dropdownlist.k-state-border-down{ box-shadow: none;}
.k-dropdown.dropdownlist.k-state-border-down:focus{ box-shadow: none;}
.k-dropdown.dropdownlist.k-disabled{ background: #fafafa;}
.k-dropdown.dropdownlist.k-disabled .k-input-inner{ color: #c0c0c0;}
.k-dropdown.dropdownlist .k-input-button{ width: 60px; height: 100%;}
.k-dropdownlist .k-input-button .k-icon { width: 20px; height: 20px; background: url(../../images/common/icons/icon_btn_dropdown.png) no-repeat 50% 50% / cover;}
.k-dropdownlist .k-input-button .k-icon svg{ display: none;}

/* select box */
select.dropdownlist{ position: relative; width: 100%; padding-left: 12px; font-size: 18px; color: #222; letter-spacing: -0.36px; border-radius: 8px; border-color: #ddd; cursor: pointer; appearance: none; outline: 0; background: url(../../images/common/icon_btn_dropdown.png) no-repeat 98% 50%;}
select.dropdownlist::-ms-expand { display: none; }

/*
*--------------------------------------------*
|                  Dropdown                  |
*--------------------------------------------*
*/
.dropdown{ display: inline-block; position: relative; }
.dropdown .dropdown-btn{ display: flex; align-items: center; justify-content: space-between; min-width: 205px; height: 48px; line-height: 48px; padding: 0 16px; border-radius: 6px; border: solid 1px rgba(255, 255, 255, 0.25); background-color: rgba(255, 255, 255, 0.05); font-size: 16px; font-weight: normal; letter-spacing: normal; color: #fff;}
.dropdown .dropdown-btn .icon-dropdown-arrow{ display: inline-block; width: 20px; height: 20px; background: url("/images/common/icons/dropdown_arrow_up.png") no-repeat center center / cover; transition: rotate 0.25s ease-in-out;}
.dropdown .dropdown-btn.active .icon-dropdown-arrow{ transform: rotate(180deg); }
.dropdown .dropdown-menu{ z-index: 10; display: none; position: absolute; top: 100%; left: 0; width: 100%; max-height: 350px; overflow-y: auto; border: 1px solid #808080; background-color: var(--pd-bg-base); }
.dropdown .dropdown-menu.bot-open{ top: initial; bottom: 100%; }
.dropdown .dropdown-menu a{ display: inline-block; padding: 12px 15px; width: 100%; color: #1e2124; font-size: 16px; font-weight: normal; letter-spacing: normal; text-align: left; }
.dropdown .dropdown-menu a:hover{ background-color: #2a2a2a; color: #fff;}
/*.k-list-item:hover,*/
/*.k-list-item.k-hover { background-color: #F8F6FB; color: #000;}*/

/*
*--------------------------------------------*
|                   Popup                    |
*--------------------------------------------*
*/
.k-window{ border: none !important; border-radius: 12px; background-color: #fff; }
.k-window-titlebar{ padding: 16px 24px !important; border: none; border-bottom: 1px solid #cdd1d5; background-color: #fff !important; }
.k-window-title { font-size: 20px; font-weight: bold; color: #1e2124;}
.k-window-title .k-window-action{ width: 22px !important; height: 22px !important; margin: unset !important; -webkit-margin-end: unset !important; margin-inline-end: unset !important; opacity: 1 !important; }
.k-window-titlebar-action .k-icon{ width: 100% !important; height: 100% !important; }
.k-window-titlebar-action .k-icon::before{ content: "" !important; position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; background: url("/images/common/icons/icon-close.svg") no-repeat center center / cover !important; }
.k-window-content.kendo-window{ padding: 0 !important; border-radius: 4px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);}
.k-window-content.kendo-window .popup-content { padding: 24px !important;}
.k-window-content.kendo-window.style2{ padding: 0 20px 20px 20px !important; } 
.k-window-content.kendo-window.style3{ padding: 0 !important; } 
.k-window .popup-content{ width: 100%; }
.k-window .popup-btn{ width: 100%; background-color: #fff; border-radius: 0 0 4px; overflow: hidden; }
.k-window .popup-btn .btn-default{ display: inline-block; height: 48px; line-height: 48px; padding: 0 10px; color: var(--white); font-size: 16px; font-weight: 500; letter-spacing: normal; text-align: center; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.2); border-radius: var(--pd-bdrs-base4); }
.k-window-content.kendo-window.style2 .popup-btn button,
.k-window-content.kendo-window.style2 .popup-btn .btn-default{ width: 140px; }
.pop-common-tit{ margin-bottom: 16px; color: var(--white); font-size: 16px; font-weight: normal; }
.pop-common-desc{ color: #d2d2d2; font-size: 15px; font-weight: normal; line-height: 1.6; letter-spacing: -0.3px; }
.common-scroll{ height: 66.69vh; overflow-y: auto; }
.popup-scroll-wrap{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; }
.cookie-check.check-box{ display: flex; justify-content: flex-end; margin-top: 10px;}
.popup-foot { padding: 16px; background: #fafafa;}
.popup-foot .btnBox-wrap { display: flex; justify-content: center; align-items: center; gap: 8px;}
.popup-foot [class*="btn-"] { display: flex; justify-content: center; align-items: center; width: 120px; height: 48px; border-radius: 6px;}

/*
*--------------------------------------------*
|                   Footer                   |
*--------------------------------------------*
*/
footer{ padding: 44px 0; background-color: #161d2a;}
.footer-inner{ width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.footer-inner .footer-logo{ width: 79px;}
.footer-inner .footer-logo > img{ width: 100%;}
.footer-inner .nav .btn-wrap{ margin-bottom: 20px; display: flex; align-items: center; gap: 40px;}
.footer-inner .nav .btn-wrap a{ font-size: 14px; font-weight: normal; line-height: 1.5; letter-spacing: normal; color: rgba(255, 255, 255, 0.75);}
.footer-inner .nav .btn-wrap a.common-bold{ font-weight: bold; color: #fff;}
.footer-inner .nav address p{ font-size: 14px; font-weight: normal; line-height: 1.5; letter-spacing: normal; color: rgba(255, 255, 255, 0.75); word-break: keep-all;} 
.footer-inner .mid-wrap{ display: flex; align-items: center; gap: 8px;}
.footer-inner .mid-wrap .btn-footer{ display: flex; align-items: center; gap: 4px; justify-content: center; padding: 0 12px; min-width: 130px; height: 40px; line-height: 40px; border-radius: 6px; border: solid 1px rgba(255, 255, 255, 0.25); font-size: 14px; font-weight: normal; letter-spacing: normal; text-align: center; color: #fff;}
.footer-inner .mid-wrap .icon-arrow-right{ display: inline-block; width: 16px; height: 16px; background: url("/images/common/icons/icon_right_arrow.png") no-repeat center center / cover;}

/*
*--------------------------------------------*
|        이용약관, 개인정처리방침 Popup        |
*--------------------------------------------*
*/
.k-window-content.kendo-window.terms-privacy{ padding: 0 20px 20px 20px !important; background-color: #181818 !important; }
.terms-privacy .acc-header, .terms-privacy .accordian-section:not(:last-child){ margin-bottom: 30px; }
.terms-privacy .acc-header-summary{ color: #d2d2d2; font-size: 15px; font-weight: normal; line-height: 1.5; letter-spacing: normal; text-align: left; }
.terms-privacy .acc-section-title{ padding: 12px 0; color: var(--white); font-size: 16px; font-weight: 500; line-height: 1.3; letter-spacing: normal; text-align: left; border-bottom: 1px solid #404040; }
.terms-privacy .acc-list-item button{ display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 12px 10px; color: #d2d2d2; font-size: 16px; font-weight: normal; line-height: 1.5; letter-spacing: -0.32px; text-align: left; box-sizing: border-box; border-bottom: 1px solid #404040; }
.terms-privacy .acc-list-item button.active{ border-bottom: none; }
.terms-privacy .acc-list-item button .icon-acc-arrow{ display: inline-block; width: 28px; height: 28px; background: url("/images/common/icons/icon-acc-arrow.png") no-repeat center center / cover; transition: all var(--transition-speed) var(--transition-linear); }
.terms-privacy .acc-list-item button.active .icon-acc-arrow{ transform: rotate(180deg); }
.terms-privacy .acc-item-content{ display: none; padding: 18px 20px; color: #d2d2d2; font-size: 15px; font-weight: normal; line-height: 1.65; letter-spacing: -0.3px; text-align: left; border-radius: var(--pd-bdrs-base4); background-color: #2a2a2a; }
.terms-privacy .acc-item-content.active{ display: block; }



/*
*--------------------------------------------*
|        callout        |
*--------------------------------------------*
*/
.callout { display: flex; flex-direction: column; padding: 28px; border-radius: 12px;}
.callout > div { display: flex; gap: 8px; align-items: center;}
.callout.success { background: #f3f7f6;}
.callout.success strong { font-size: 14px; font-weight: bold; color: #149174;}
.callout.warring { background: #fbeff0;}
.callout.warring strong { font-size: 18px; font-weight: bold; color: #d63d4a;}

[class*="-message"] { margin-top: 10px;}

/*
*--------------------------------------------*
|        Form        |
*--------------------------------------------*
*/
.col-form-wrap { display: flex; flex-direction: column; border-top: 1px solid #1e2124;}
.col-form-wrap dl { display: flex; flex-direction: column; gap: 8px; padding: 16px 4px; border-bottom: 1px solid #cdd1d5;}
.col-form-wrap dl dt { font-size: 14px; font-weight: bold; color: #1e2124;}
.col-form-wrap dl dd {}
.col-form-wrap .callout { margin-top: 16px; padding: 16px 12px; border-radius: 6px;}
.col-form-wrap .callout > div { align-items: normal; vertical-align: text-top;}
.k-textbox { padding: 0 16px; height: 48px; line-height: 48px; font-size: 16px; border-radius: 6px; border: solid 1px #cdd1d5; background-color: #fff; box-sizing: border-box; }
.k-textbox:disabled{ border: 1px solid #cdd1d5; background-color: #f4f5f6; cursor: default;}
.k-textbox::placeholder{ color: #bdbcbb; font-size: 14px; font-weight: 500; letter-spacing: normal; }
.k-textbox:focus[type="text"],
.k-textbox:focus[type="password"],
.k-textbox:focus[type="email"],
.k-textbox:focus[type="search"]{ border-color: #149174; }

/*
*--------------------------------------------*
|        Icon        |
*--------------------------------------------*
*/
[class*="icon"] { display: inline-flex; align-items: center; justify-content: center; background-size: contain; background-position: center; background-repeat: no-repeat;}
.icon-alert-circle { width: 24px; height: 24px; background-image: url("../images/common/icons/icon-alert-circle.svg");}
.icon-alert-circle-success { width: 24px; height: 24px; background-image: url("../images/common/icons/icon-alert-circle-success.svg");}

/*
*--------------------------------------------*
|                    Media                   |
*--------------------------------------------*
*/
@media screen and (max-width: 1200px) {
    /* Common */
    .for-pc{ display: none !important; }
    .for-mo{ display: block !important; }
    .user-container{ margin-top: 0;}
    .common-sub-section-wrap{ margin-top: 92px;}
    .radio-box-wrap label{ gap: 8px; font-size: 12px;}
    .radio-box-wrap input[type="radio"] + label .icon.radio{ width: 18px; height: 18px;}
    .radio-box-wrap input[type="radio"]:checked + label .icon.radio::before{ width: 10px; height: 10px;}

    /* Gnb */
    .mo-gnb{ border-bottom: none; z-index: 10; position: fixed; top: 0; left: 0; width: 100%; height: 72px; background: #fff;}
    .mo-gnb .gnb-inner{ gap: unset; align-items: center; width: 100%; height: 100%; padding: 0 20px; border-bottom: solid 1px #cdd1d5;}
    .mo-gnb .logo{ width: 52.7px;}
    .mo-gnb .logo, .mo-gnb .menu-list ul > li > a, .mo-gnb .util{ line-height: normal;}
    .gnb-toggle-menu{ position: relative; width: 24px; height: 19px;}
    .gnb-toggle-menu::before, .gnb-toggle-menu::after, .gnb-toggle-menu .bar{ left: 0; right: 0; width: 100%; height: 2px; background-color: #3F4249; border-radius: 2px; transition: all 0.25s ease-in-out;}
    .gnb-toggle-menu::before{ content: ""; position: absolute; top: 0;}
    .gnb-toggle-menu::after{ content: ""; position: absolute; top: calc(100% - 2px);}
    .gnb-toggle-menu .bar{ position: absolute; top: 50%; transform: translateY(-50%);}
    
    .gnb-toggle-menu.active::before { top: calc(50% - 1px); transform: rotate(45deg);}
	.gnb-toggle-menu.active::after { top: calc(50% - 1px); transform: rotate(-45deg);}
	.gnb-toggle-menu.active .bar { opacity: 0;}

	#moGnbMenu{ left: -100vw; position: relative; display: flex; flex-direction: column; padding: 0 16px; height: 100vh; transition: right 0.25s ease-in-out;}
	#moGnbMenu.active{ position: absolute; left: 0; right: 0; top: 72px; width: 100%; height: 100vh; background: #fff;}
	#moGnbMenu .mo-user-menu{ order: 2; overflow-y: auto; max-height: 80%;}
	#moGnbMenu .util{ order: 1; padding: 16px 0; border-bottom: solid 1px #cdd1d5;}
	#moGnbMenu .h-login{ display: flex; align-items: center; font-size: 24px; font-weight: bold; line-height: 1.5; letter-spacing: normal; text-align: left; color: #1e2124;}
	#moGnbMenu .h-login .icon-login{ display: none;}
    #moGnbMenu .menu-1depth{ padding: 16px 0 10px; border-bottom: 1px solid #e6e8ea;}
    #moGnbMenu .menu-1depth > a{ font-size: 14px; font-weight: bold; line-height: 1.5; letter-spacing: normal; text-align: left; color: #1e2124;}
    #moGnbMenu .menu-1depth ol li > a{ position: relative; width: 100%; display: inline-block; padding: 6px 8px; font-size: 16px; font-weight: normal;  line-height: 1.5; letter-spacing: normal; text-align: left; color: #1e2124;}
    #moGnbMenu .menu-1depth ol li > a::before{ content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 100%; background-color: #1e2124;}
    #moGnbMenu .icon-gnb-right-arrow{ display: inline-block; width: 24px; height: 24px; background: url("/images/common/icons/icon-gnb-right-arrow.png") no-repeat center center;}
    #moGnbMenu .user-info-wrap{ display: flex; align-items: center; gap: 8px;}
    #moGnbMenu .user-info-wrap .user-info{ font-size: 24px; font-weight: bold; line-height: 1.5; letter-spacing: normal; text-align: left; color: #1e2124;}
    #moGnbMenu .user-info-wrap .user-info strong{ color: #149174;}
    #moGnbMenu .user-info-wrap .h_logout{ height: 32px; line-height: 32px; border-radius: 6px; border: solid 1px #cdd1d5; font-size: 14px; padding: 0 10px; font-weight: bold;  color: #1e2124; background-color: #fff;}
    
    /* Footer */
    footer{ padding: 28px 22px; z-index: 1;}
    .footer-inner{ flex-direction: column; width: 100%;}
    .footer-inner .footer-logo{ width: 63.2px;}
    .footer-inner .nav{ margin: 24px auto 20px;}
    .footer-inner .nav .btn-wrap{ justify-content: center;}
    .footer-inner .mid-wrap{ margin-bottom: 20px; width: 100%;}
    .footer-inner .mid-wrap .btn-footer{ min-width: auto; flex: 1;}
    .footer-inner .dropdown{ width: 100%;}
    .footer-inner .dropdown .dropdown-btn{ min-width: 100%;}

    .callout { padding: 20px 16px; border-radius: 6px;}
    .callout.warring strong { font-size: 14px;}
}

@media screen and (max-width: 767px) {
}