@charset "UTF-8";

@font-face {
     font-family: 'Noto Sans KR';
     font-style: normal;
     font-weight: 300;
     src: local('※'),
     url('../fonts/NotoSansKR-DemiLight.woff2') format('woff2'),
     url('../fonts/NotoSansKR-DemiLight.woff') format('woff'),
     url('../fonts/NotoSansKR-DemiLight.otf') format('opentype');
   }

@font-face {
     font-family: 'Noto Sans KR';
     font-style: normal;
     font-weight: 400;
     src: local('※'),
     url('../fonts/NotoSansKR-Light.eot'),
     url('../fonts/NotoSansKR-Light.eot#iefix') format('embedded-opentype'),
     url('../fonts/NotoSansKR-Light.woff') format('woff'),
     url('../fonts/NotoSansKR-Light.otf') format('opentype');
     /*unicode-range: U+1100-11FF, U+3130-318F, U+A960-A97F, U+AC00-D7A3, U+D7B0-D7FF;*/
 }

 @font-face {
     font-family: 'Noto Sans KR';
     font-style: normal;
     font-weight: 500;
     src: local('※'),
     url('../fonts/NotoSansKR-Regular.eot'),
     url('../fonts/NotoSansKR-Regular.eot#iefix') format('embedded-opentype'),
     url('../fonts/NotoSansKR-Regular.woff') format('woff'),
     url('../fonts/NotoSansKR-Regular.otf') format('opentype');
     /*unicode-range: U+1100-11FF, U+3130-318F, U+A960-A97F, U+AC00-D7A3, U+D7B0-D7FF;*/
 }

 @font-face {
     font-family: 'Noto Sans KR';
     font-style: normal;
     font-weight: 600;
     src: local('※'),
     url('../fonts/NotoSansKR-Medium.eot'),
     url('../fonts/NotoSansKR-Medium.eot#iefix') format('embedded-opentype'),
     url('../fonts/NotoSansKR-Medium.woff') format('woff'),
     url('../fonts/NotoSansKR-Medium.otf') format('opentype');
     /*unicode-range: U+1100-11FF, U+3130-318F, U+A960-A97F, U+AC00-D7A3, U+D7B0-D7FF;*/
 }

 @font-face {
     font-family: 'Noto Sans KR';
     font-style: normal;
     font-weight: 700;
     src: local('※'),
     url('../fonts/NotoSansKR-Bold.eot'),
     url('../fonts/NotoSansKR-Bold.eot#iefix') format('embedded-opentype'),
     url('../fonts/NotoSansKR-Bold.woff') format('woff'),
     url('../fonts/NotoSansKR-Bold.otf') format('opentype');
     /*unicode-range: U+1100-11FF, U+3130-318F, U+A960-A97F, U+AC00-D7A3, U+D7B0-D7FF;*/
 }

 @font-face {
    font-family: 'Gmarket Sans';
    font-style: normal;
    font-weight: 700;
    src: local('※'),
    url('../fonts/GmarketSans-Bold.eot'),
    url('../fonts/GmarketSans-Bold.woff') format('woff'),
    url('../fonts/GmarketSans-Bold.otf') format('opentype');
    /*unicode-range: U+1100-11FF, U+3130-318F, U+A960-A97F, U+AC00-D7A3, U+D7B0-D7FF;*/
}

 /********* reset.css **********/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ul, ol, li,
fieldset, form, label, legend, input, select, textarea, button,
table, tr, td, thead, tbody, tfoot,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, main,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
    font-size: 100%;
    font-weight: 300;
    font-family: 'Noto Sans KR';
	box-sizing:border-box;

}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
input[type=text]::-ms-clear {display: none; width: 0; height: 0;}
 input[type=password]::-ms-reveal {display: none; width: 0; height:0;}
 input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #f3f2f2 inset;
 }
 input:focus::-webkit-input-placeholder { color: transparent; }
 input:focus::-moz-placeholder { color: transparent; }
 input:focus:-ms-input-placeholder { color: transparent; }
  input:focus::-ms-input-placeholder { color: transparent; }
h1,h2,h3,h4,h5,h6 {font-size:1em; font-weight:normal;}
em, b, i {font-style: normal;}
ul,ol,li {list-style-type:none;}
ul:after,ol:after{display: block; content:""; clear: both;}
a {color: #333; text-decoration:none; display: block;}
img {max-width:100%; max-height:100%; border:0 none; vertical-align:top;}
address {font-style:normal;}
fieldset{border: none;}
legend{border: none; position: absolute; overflow: hidden; width: 1px; height: 1px; margin: -1px; clip: rect(0,0,0,0);font-size: 1px;}
caption {height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px;}
/* 에디터 삽입 컨텐츠 내 테이블 스타일 적용을 위해 주석처리.
table {width:100%; border-spacing: 0; border-collapse:collapse; table-layout:fixed;}
*/
button {margin:0; padding:0; background-color:transparent; border:0 none; box-sizing:border-box; font-family:inherit; font-size:inherit; cursor:pointer;}
input {border: 0 none; padding:0; box-sizing:border-box; font-family:inherit; font-size: inherit;}
input:focus,button:focus {outline:none;}
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="image"],input[type="tel"], textarea {-webkit-appearance:none; -webkit-border-radius:0;} /* IOS default style reset */
input[type="reset"] {cursor: pointer;}
/* input{-webkit-appearance: none; -moz-appearance: none; appearance: none;} */
input:disabled {background-color: #e5f0ff !important;}
/* input:read-only {background-color: #edeef0 !important;} */
input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #777;}
input::-moz-placeholder { /* Firefox 19+ */ color: #777;}
input:-ms-input-placeholder { /* IE 10+ */ color: #777;}
input:-moz-placeholder { /* Firefox 18- */ color: #777;}
textarea {width:100%; font-family: inherit; font-size: inherit; box-sizing:border-box; resize: none;}
textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #777;}
textarea::-moz-placeholder { /* Firefox 19+ */ color: #777;}
textarea:-ms-input-placeholder { /* IE 10+ */ color: #777;}
textarea:-moz-placeholder { /* Firefox 18- */ color: #777;}
select {background-color: #fff; -webkit-border-radius: 0; /* IOS default style reset */ color: #555; font-family: inherit; font-size: inherit; cursor:pointer;}
select::-ms-expand {background-color: #fff; border-width: 0;}

/* 에디터 삽입 컨텐츠 리셋스타일 제거. */
.editor_view ol, .editor_view ol > li {list-style-type: decimal;}
.editor_view ul, .editor_view ul > li {list-style-type: disc;}
.editor_view ol, .editor_view ul {padding-left: 19px;}
.editor_view i, .editor_view em {font-style: italic;}
.editor_view b, .editor_view strong {font-weight: bold;}

/*20250929 관리자 팝업 수정  */
.editor_view { min-height: 390px; padding: 40px 25px; line-height: 1.5; color: #444; border-bottom: 1px solid #222; }

/* tableA */
.tableA{width: 100%; table-layout: fixed; border-spacing: 0; border-collapse: collapse; border-top: 2px solid #36506b;}
.tableA th, .tableA td{border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.tableA th:last-child, .tableA td:last-child{border-right-width: 0;}
.tableA thead th{padding: 10px 15px; text-align: center; font-size: 15px; font-weight: 600; background: #f7f7f7; border-bottom: 1px solid #d3d7da;}
.tableA td{padding: 10px 15px; text-align: center; font-size: 14px; font-weight: 500; color: #444; border-bottom: 1px solid #d3d7da;}
.tableA .tbl_tit{text-align: left;}
.tableA .tbl_tit a{display: block; max-height: 43px; padding-bottom: 1px; color: #444; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.tbl_file .icon_file{display: inline-block; width: 26px; height: 26px; margin: 0 3px; font-size: 0; background: url(../images/login/sub/icon_file.png) no-repeat center / 23px auto; vertical-align: middle;}
.tableA .icon_notice{display: inline-block; width: 24px; height: 24px; font-size: 0; background: url(../images/login/sub/icon_notice.png) no-repeat; vertical-align: middle;}
.tableA .list > li{position: relative; font-size: 14px; font-weight: 500; color: #000; padding-left: 8px; text-align: left; float: left; width: 50%; line-height: 1.6em;}
.tableA .list > li::before{content: ''; position: absolute; left: 0; top: 12px; z-index: 1; width: 4px; height: 1px; background-color: #444;}
.tableA .dw_btn{display: inline-block; vertical-align: middle; font-size: 13px; font-weight: 500; padding: 0 15px; line-height: 28px; border: 1px solid #666; border-radius: 3px;}
.tableA>tbody td span{display: none;}

/* popup */
.pop_wrap{display: none; padding: 100px 30px 40px; text-align: center; font-size: 0; background: rgba(0, 0, 0, 0.8); overflow: auto; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 600; font-size: 0; }
.pop_wrap:before{content: ''; display: inline-block; height: 100%; vertical-align: middle; }
.pop_wrap > .va_m{display: inline-block; vertical-align: middle; }
.pop_wrap .pop_box{display: inline-block; width: 100%; max-width: 820px; font-size: 16px; text-align: left; position: relative; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); vertical-align: middle;}
.pop_wrap .pop_box.certi{max-width: 620px;}
.pop_wrap .pop_box > .con_box .pop_tit{display: block; padding: 17px 30px; font-size: 20px; font-weight: 600; color: #fff; background: #06a29f url("../images/login/pop_bg.png") no-repeat right bottom; border-top-left-radius: 30px; border-top-right-radius: 30px;}
.pop_wrap .pop_box > .con_box .con_each{padding: 30px; background: #fff; border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; }
.pop_wrap .pop_box > .con_box .con_each .input_box{padding: 0 0 20px 0;}
.pop_wrap .pop_box > .con_box .con_each .input_box input{width: 100%; padding: 0 160px 0 25px; color: #222;}
.pop_wrap .pop_box > .con_box .con_each .input_box button{position: absolute; right: 0; top: 0; z-index: 1; width: 140px; padding: 0; height: 48px; background: #224361; font-size: 15px; font-weight: 400; color: #fff; border-radius: 25px;}
.pop_wrap .pop_box > .con_box .con_each .input_box span{font-size: 13px; font-weight: 500; color: #db375d; margin-top: 10px;}
.pop_wrap .pop_box > .con_box .con_each .bg_box{display: block; margin-bottom: 30px; padding: 20px; font-size: 1.125em; font-weight: 500; text-align: center; background: #f5f7f9; border-radius: 10px;}
.pop_wrap .pop_box > .con_box .img_top_box .img_box{float: left; width: 255px; height: 155px; overflow: hidden; border-radius: 10px; }
.pop_wrap .pop_box > .con_box .img_top_box .con_box{float: left; width: calc(100% - 255px); padding-left: 25px;}
.pop_wrap .pop_box > .con_box .img_top_box .con_box .tit1{display: block; margin-bottom: 15px; padding-bottom: 16px; font-size: 1.25em; font-weight: 500; position: relative;}
.pop_wrap .pop_box > .con_box .img_top_box .con_box .tit1:after{content: ''; display: block; width: 24px; height: 1px; background: #aaa; position: absolute; bottom: 0; left: 0;}
.pop_wrap .pop_box .btn_box { width: 100%; text-align: center; position: absolute; top: -65px; left: 0;}
.pop_wrap .pop_box .btn_box .pop_x {display: inline-block; padding: 12px 30px; margin: 0 5px; color: #fff; border: 1px solid #fff; border-radius: 30px;}
.pop_wrap .pop_box .btn_box .pop_x .ico{display: inline-block; padding-right: 20px; position: relative;}
.pop_wrap .pop_box .btn_box .pop_x .ico:after{content: ''; display: block; width: 12px; height: 12px; background: url("../images/login/pop_x.png") no-repeat; position: absolute; top: 50%; margin-top: -5px; right: 0; -webkit-transition: all 0.3s; transition: all 0.3s; }

body{background: url(../images/login/bg.jpg) no-repeat center center fixed; max-width: 2000px; overflow-x: hidden; background-size: cover; margin: 0 auto;}
#wrapper{display: table; width: 100%; height: 100vh;}
.cell{display: table-cell;  vertical-align: middle;}
.contents{max-width: 1200px; margin: auto; }
.contents h2{position: relative; left: 0; top: 0; z-index: 3; width: 100%; height: 68px; font-size: 0; margin: 0 auto; text-align: center; background: url('../images/login/cmslogin.png') no-repeat center top / contain;}
.contents > ul, .contents > .key_secu{box-shadow: 5px 0px 16px rgba(0,0,0,0.15); border-radius: 30px 0 30px 0; background: #fff; z-index: 1; overflow: hidden;}
.contents > ul > li.left_area{float: left; width: 40%; height: 352px; padding: 35px;}
.contents > ul > li.right_area{position: relative; float: right; width: 60%; text-align: center;}
.contents > ul > li.right_area::before{content: ''; position: absolute; left: 0; top: 0; z-index: 1; width: 64px; height: 100%; background: url('../images/login/shadow.png') no-repeat center top / auto 100%;}
.contents > ul > li.right_area .link_cont{border-right: 1px solid #ddd;}
.contents > ul > li.right_area .link_cont *{transition: 0.3s;}
.contents > ul > li.right_area .link_cont > li{position: relative; float: left; width: 33.33%; border: 1px solid #ddd; border-right: 0; border-top: 0;}
.contents > ul > li.right_area .link_cont > li > a{height: 228px; padding: 40px 0;}
.contents > ul > li.right_area .link_cont > li:first-child{border-left: 0;}
.contents > ul > li.right_area .link_cont > li h4 b{position: relative; display: block; font-size: 18px; font-weight: 600; color: #222;}
.contents > ul > li.right_area .link_cont > li h4 b::after{content: ''; display: block; margin: 14px auto 12px auto; width: 16px; height: 1px; background-color: #777;}
.contents > ul > li.right_area .link_cont > li h4{font-size: 14px; font-weight: 500; color: #444; line-height: 1.4em;}
.contents > ul > li.right_area .link_cont > li i{position: absolute; left: 50%; margin-left: -13px; bottom: 40px; z-index: 3; width: 26px; height: 26px; border-radius: 50%; background: url('../images/login/arrow_lg.png') no-repeat center center #76797a; font-size: 0;}
.contents > ul > li.right_area .help{position: relative; background-color: #eef2f4; text-align: left; padding: 26px 30px;}
.contents > ul > li.right_area .help h4 em{font-size: 16px; font-weight: 600; color: #222; display: block; margin-bottom: 8px;}
.contents > ul > li.right_area .help h4{font-size: 14px; font-weight: 500; color: #444;}
.contents > ul > li.right_area .help h4 > b{display: block; font-size: 14px; font-weight: bold; font-family: Arial; color: #222;}
.contents > ul > li.right_area .help span{position: absolute; right: 30px; bottom: 24px; z-index: 3; font-size: 20px; font-weight: bold; font-family: Arial; color: #8b8d8e;}
.contents > ul > li.right_area .help span > em{display: block; font-size: 34px; font-weight: bold; font-family: Arial; color: #006aae;}
.contents .key_secu{padding: 30px; margin-top: 15px;}
.contents .key_secu h5{font-size: 20px; font-weight: 600; color: #222; margin-bottom: 10px;}
.contents .key_secu > ul{margin-bottom: 15px;}
.contents .key_secu > ul > li{position: relative; font-size: 14px; font-weight: 400; color: #000; padding-left: 8px; line-height: 1.6em;}
.contents .key_secu > ul > li::before{content: ''; position: absolute; left: 0; top: 10px; z-index: 1; width: 3px; height: 3px; border-radius: 50%; background-color: #444;}

.contents h3{font-size: 0; line-height: 0;}
.contents h3 img{vertical-align: bottom;}
.contents h3 span{display: block; margin-top: 10px; font-size: 13px; font-weight: 500; color: #3f3f3f; line-height: 1.2em;}
.contents h3 span em{font-size: inherit; font-weight: 600; color: #db375d;}
.input_box{padding: 18px 0 15px 0;}
.id_name{position: absolute; z-index: 1; left: 118px; color: #999; top: 124px;}
.id_pass{position: absolute; z-index: 1; left: 118px; color: #999; top: 182px;}
.input_box input{width: 100%; height: 48px; border-radius: 25px; position: relative; color: #999; padding-left: 60px; background:#f0f0f0}
.input_box div{position: relative; margin-top: 10px;}
.input_box div:first-child{margin-top: 0;}
.input_box div img{position: absolute; z-index: 5; left: 25px; top: 50%; margin-top: -8px;}
form .log_btn{width: 100%; height: 52px; text-align: center; background: linear-gradient(to right, #15b855, #02d2ce); font-size: 18px; font-weight: 500; color: #fff; margin-bottom: 15px; border-radius: 32px;}
input[type="checkbox"]{background: url(../images/login/check2.png) no-repeat center; width: 22px; height: 22px; vertical-align: middle;}
input[type="checkbox"]:checked{background: url(../images/login/check.png) no-repeat center;}
.check_label{vertical-align: middle; padding-left: 5px; font-size: 14px; column-rule-color: #999;}
.clear_btn{position: absolute; right: 35px; top: 14px; background: url(../images/login/x_btn.png) no-repeat center center;  width: 24px; height: 24px; font-size: 0; cursor: pointer; display: none;}
.clear_btn2{position: absolute; right: 35px; top: 14px; background: url(../images/login/x_btn.png) no-repeat center center;  width: 24px; height: 24px; font-size: 0; cursor: pointer; display: none;}
.active{display: block;}

@media screen and (min-width: 1097px){
.contents > ul > li.right_area .link_cont > li:hover, .contents > ul > li.right_area .link_cont > li:focus{background-color: #f6f6f6;}
}

@media screen and (max-width: 1096px){
.contents{width: calc(100% - 60px); margin: 30px 30px 0 30px; max-width: none;}
.contents h2{height: 36px;}
.contents > ul > li.right_area .link_cont > li{width: 100%; text-align: left; border-left: 0;}
.contents > ul > li.right_area .link_cont > li > a{height: auto; padding: 20px 25px;}
.contents > ul > li.right_area .link_cont > li h4{padding-right: 45px;}
.contents > ul > li.right_area .link_cont > li h4 > br{display: none;}
.contents > ul > li.right_area .link_cont > li h4 b{font-size: 16px; margin-bottom: 10px;}
.contents > ul > li.right_area .link_cont > li h4 b::after{display: none;}
.contents > ul > li.right_area .link_cont > li i{left: auto; right: 25px; bottom: 16px; margin-left: 0; width: 22px; height: 22px; background-size: auto 8px;}
.contents > ul > li.right_area .help span{font-size: 14px;}
.contents > ul > li.right_area .help span > em{font-size: 28px;}

}

@media screen and (max-width: 980px){
.contents > ul > li.left_area, .contents > ul > li.right_area{width: 50%;}
.contents > ul > li.right_area .help{padding: 26px 24px;}
.contents > ul > li.right_area .help span{position: static;}
.contents > ul > li.right_area .help span > em{display: inline-block;}
.contents > ul > li.right_area .help span{font-size: 14px;}
.contents > ul > li.right_area .help span > em{font-size: 18px; margin-top: 10px;}
}

@media screen and (max-width: 900px){
.contents > ul > li.left_area{padding: 30px 30px 0; height: auto;}
.contents > ul > li.left_area, .contents > ul > li.right_area{width: 100%;}
.contents > ul > li.right_area .link_cont > li i{top:50%; margin-top: -11px;}
}

@media screen and (max-width: 720px){
.contents{width: calc(100% - 30px); margin: 30px 15px 0 15px; max-width: none;}
.tableA{display: block; width: 100%;}
.tableA>thead, .tableA>thead th{display: none;}
.tableA>tbody, .tableA>tbody>tr, .tableA>tbody td{display: block; width: 100%; border-width: 0;}
.tableA>tbody>tr{padding: 0 15px; border-bottom: 1px solid #d3d7da; position: relative;}
.tableA>tbody td{padding: 15px 0; text-align: left; font-size: 14px; border-bottom: 1px solid #ddd;}
.tableA>tbody td span{font-size: 16px; font-weight: 600; color: #222; display: block; margin-bottom: 8px;}
.tableA>tbody>tr td:last-child span{display: none;}
.tableA>tbody>tr td:last-child{border-bottom-width: 0;}
}

@media screen and (max-width: 600px){
form .log_btn{font-size: 16px; height: 44px; margin-bottom: 8px;}
.contents .key_secu{padding: 20px; height: 350px; overflow-y: auto;}
.contents .key_secu h5{font-size: 16px; margin-bottom: 5px;}
.contents > ul > li.left_area{padding: 24px 24px 10px 24px;}
.contents > ul > li.right_area .help{padding: 16px 24px;}
.contents > ul > li.right_area .link_cont > li h4 b{margin-bottom: 5px;}
.pop_wrap .pop_box > .con_box .pop_tit{padding: 12px 25px; font-size: 16px;}
.pop_wrap .pop_box .btn_box .pop_x{padding: 8px 25px;}
}

 @media screen and (max-width: 500px){
.contents{width: calc(100% - 40px); margin: 40px 20px; max-width: none;}
.contents > div{padding: 30px;}
.contents h2{display: none;}
h3 img{width: 100px; display: block;}
h3 span{}
.clear_btn,.clear_btn2{right: 13px;}
}

@media screen and (max-width: 500px){
.input_box input{font-size: 14px; height: 38px; padding-left: 50px;}
.pop_wrap .pop_box > .con_box .con_each{padding: 20px;}
.pop_wrap .pop_box > .con_box .con_each .input_box input{padding: 0 100px 0 25px;}
.pop_wrap .pop_box > .con_box .con_each .input_box button{font-size: 13px; font-weight: 500; width: 100px; height: 38px;}
.pop_wrap .pop_box > .con_box .con_each .input_box span{font-size: 12px;}
}