@charset "utf-8";
@import url('../cmmn/css/common.css?ver20250830001');

/* 일반 */
.clear {clear:both;}
.show {display:block;}
.hide {display:none;}
.mgt-0 {margin-top:0;}
.mgb-0 {margin-bottom:0;}
.mgt-5 {margin-top:5px;}
.mgb-5 {margin-bottom:5px;}
.mgt-10 {margin-top:10px;}
.mgb-10 {margin-bottom:10px;}
.mgt-15 {margin-top:15px;}
.mgb-15 {margin-bottom:15px;}
.mgl-blank {margin-left:4px;}
.mgr-blank {margin-right:4px;}
.float-left {float:left;}
.float-right {float:right;}
.align-left {text-align:left;}
.align-right {text-align:right;}
.align-center {text-align:cneter;}
.relative {position:relative;}
.relative .float-right {position:absolute; right:0; bottom:10px; z-index:10;}
.wx5 {width:5px !important;}
.wx22 {width:22px !important;}
.wx30 {width:30px !important;}
.wx35 {width:35px !important;}
.wx40 {width:40px !important;}
.wx45 {width:45px !important;}
.wx49 {width:49px !important;}
.wx50 {width:50px !important;}
.wx55 {width:55px !important;}
.wx60 {width:60px !important;}
.wx61 {width:61px !important;}
.wx62 {width:62px !important;}
.wx63 {width:63px !important;}
.wx65 {width:65px !important;}
.wx70 {width:70px !important;}
.wx75 {width:75px !important;}
.wx80 {width:80px !important;}
.wx85 {width:85px !important;}
.wx90 {width:90px !important;}
.wx95 {width:95px !important;}
.wx100 {width:100px !important;}
.wx110 {width:110px !important;}
.wx115 {width:115px !important;}
.wx120 {width:120px !important;}
.wx125 {width:125px !important;}
.wx130 {width:130px !important;}
.wx135 {width:135px !important;}
.wx140 {width:140px !important;}
.wx150 {width:150px !important;}
.wx160 {width:160px !important;}
.wx165 {width:165px !important;}
.wx180 {width:180px !important;}
.wx190 {width:190px !important;}
.wx200 {width:200px !important;}
.wx250 {width:250px !important;}
.wx300 {width:300px !important;}
.wx310 {width:310px !important;}
.wx350 {width:350px !important;}
.wx380 {width:380px !important;}
.wx400 {width:400px !important;}
.wx450 {width:450px !important;}

.wp2 {width:2%}
.wp3 {width:3%}
.wp4 {width:4%}
.wp5 {width:5%}
.wp6 {width:6%}
.wp7 {width:7%}
.wp8 {width:8%}
.wp9 {width:9%}
.wp10 {width:10%}
.wp11 {width:11%}
.wp12 {width:12%}
.wp13 {width:13%}
.wp14 {width:14%}
.wp15 {width:15%}
.wp17 {width:17%}
.wp20 {width:20%}
.wp22 {width:22%}
.wp23 {width:23%}
.wp24 {width:24%}
.wp25 {width:25%}
.wp29 {width:29%}
.wp30 {width:30%}
.wp35 {width:35%}
.wp40 {width:40%}
.wp45 {width:45%}
.wp47 {width:47%}
.wp50 {width:50%}
.wp60 {width:60%}
.wp70 {width:70%}
.wp80 {width:80%}
.wp85 {width:85%}
.wp90 {width:90%}

/* 버튼 */
.button-00 {height:26px; padding:0 8px; font-size:12px; font-weight:bold; line-height:12px; border:1px solid #aaa;; background-color:#fff; cursor:pointer; border-radius:2px;}
.button-00:hover {border-color:#333;}
.button-00.focus {color:#fff; border-color:#178f4c; background-color:#10ac55;}
.button-00.focus:hover {border-color:#1d7745;}
.button-00.focus[disabled="disabled"] {border-color:#666 !important; background-color:#888 !important; color:#fff; cursor:default;}
.button-00.focus.cncl {border-color:#333; background-color:#666;}
.button-00.focus.cncl:hover {border-color:#000;}
.button-00.focus.stlt {border-color:#679025; background-color:#6d9d21;}
.button-00.focus.stlt:hover {border-color:#577e19;}
.button-00.focus.tobe {border-color:#017013; background-color:#038518;}
.button-00.focus.tobe:hover {border-color:#005d0f;}
.button-00.focus.expt {border-color:#0174c2; background-color:#0083db;}
.button-00.focus.expt:hover {border-color:#016bb2;}
.button-00.focus.rtns {border-color:#ff0900; background-color:#ff4500;}
.button-00.focus.rtns:hover {border-color:#ff0000;}
.button-00.focus.ordr {border-color:#0174c2; background-color:#0083db;}
.button-00.focus.ordr:hover {border-color:#016bb2;}
.button-00.focus.exch {border-color:#017013; background-color:#038518;}
.button-00.focus.exch:hover {border-color:#005d0f;}
.button-00.focus.stop {border-color:#333; background-color:#666;}
.button-00.focus.stop:hover {border-color:#000;}
.button-00.black {color:#fff; border-color:#333; background-color:#666;}
.button-00.black:hover {border-color:#000;}
.button-01 {height:26px; padding:0 8px 0 18px; font-size:12px; font-weight:bold; line-height:12px; border:1px solid #aaa;; background-color:#fff; background-image:url(../images/bg_button_01.png); background-repeat:no-repeat; background-position:8px 9px; cursor:pointer; border-radius:2px;}
.button-01:hover {border-color:#333;}
.button-02 {background-image:url(../images/bg_button_02.png);}
.button-03 {background-image:url(../images/bg_button_03.png);}
.button-04 {background-image:url(../images/bg_button_04.png);}
.button-05 {background-image:url(../images/bg_button_05.png);}
.button-00[disabled="disabled"],
.button-01[disabled="disabled"] {opacity:0.6; color:#666; border-color:#888 !important; background-color:#aaa; cursor:default;}

/* 설명 */
.description {clear:both; border-style:solid; border-color:#93c293; border-width:1px; background-color:#eafdea;}
.description.m {margin-top:10px;}
.description strong {display:block; padding:10px; padding-bottom:0;}
.description ul {padding:10px;}
.description ul li {padding-left:7px; margin-top:7px; font-size:12px; line-height:14px; background:url(../images/bg_li.png) no-repeat 0 6px;}
.description ul li:first-child {margin-top:0;}
.description ul li em {font-weight:bold;}
.description ul li em.green {color:#008000; text-decoration:underline;}
.description ul.none li {padding-left:0; background:none;}

/* 페이징 */
.paging {width:100%; margin-top:30px; text-align:center;}
.paging a,
.paging span {display:inline-block; height:14px; padding:3px 4px 4px 4px; line-height:14px; text-decoration:none; font-weight:bold; vertical-align:middle;}
.paging a.on {color:#ff4500; font-weight:bold;}
.paging a.img,
.paging span.img {width:21px; height:21px; padding:0; overflow:hidden; font-size:0; line-height:0; background-image:url(../images/bg_paging.png); background-repeat:no-repeat; cursor:default;}
.paging a.img.on {cursor:pointer;}
.paging a.img.first,
.paging span.img.first {margin-right:4px; background-position:0 -66px;}
.paging a.img.first.on {background-position:0 -44px;}
.paging a.img.prev,
.paging span.img.prev {margin-right:4px; background-position:0 -22px;}
.paging a.img.prev.on {background-position:0 0;}
.paging a.img.next,
.paging span.img.next {margin-left:4px; background-position:-22px -22px;}
.paging a.img.next.on {background-position:-22px 0;}
.paging a.img.last,
.paging span.img.last {margin-left:4px; background-position:-22px -66px;}
.paging a.img.last.on {background-position:-22px -44px;}

.layout {display:flex; align-items:flex-start;}

/* 좌측 */
.layout > .left-area {width:250px; min-height:100vh; background-color:#eeeef6; border-right:1px solid #e4e2e0; box-shadow:8px 0 12px #e4e2e0; box-sizing:border-box;; z-index:900;}
.layout > .left-area h1 {display:flex; justify-content:center; align-items:center; width:100%; height:80px; letter-spacing:-1px; word-break:keep-all; background-color:#dcdedf;}
.layout > .left-area h1 a {font-size:24px; line-height:30px; text-decoration:none;}
.layout > .left-area h1 a:hover {color:#333;}
.layout > .left-area ul.menu {padding:15px;}
.layout > .left-area ul.menu li {margin-top:5px;}
.layout > .left-area ul.menu li:first-child {margin-top:0;}
.layout > .left-area ul.menu li a {display:flex; justify-content:space-between; align-items:center; padding:0 10px; text-decoration:none; font-weight:bold; font-size:15px; line-height:35px; border-bottom-width:1px;}
.layout > .left-area ul.menu li a em {display:inline-block; width:20px; height:16px; background:url(../images/ic_menu.png) no-repeat center center; filter:grayscale(100%); opacity:0;}
.layout > .left-area ul.menu li a.hover {color:#3759b1;}
.layout > .left-area ul.menu li a:hover em,
.layout > .left-area ul.menu li a.hover em {transform:rotate(180deg); filter:grayscale(0); opacity:1; transition:all 0.3s;}
.layout > .left-area ul.menu li ul {display:none; margin-left:15px; margin-top:10px;}
.layout > .left-area ul.menu li ul.on {display:block;}
.layout > .left-area ul.menu li ul li a {border-style:none; background:none;}
.layout > .left-area ul.menu li ul li a em {background-image:url(../images/bl_selected.png);}
.layout > .left-area ul.menu li ul li a.hover em,
.layout > .left-area ul.menu li ul li a:hover em {transform:rotate(0);}
.layout > .left-area ul.menu li ul li ul {padding:15px 0 15px 15px; margin:0; background-color:#e4e4ef;}
.layout > .left-area ul.menu li ul li ul li a {padding:5px 10px; font-size:14px; line-height:16px;}
.layout > .left-area ul.menu li ul li ul li a em {background-image:url(../images/ic_arrow_right.png);}

/* 내용 */
.layout > .content-area {width:calc(100% - 250px); z-index:800;}
.layout > .content-area .util {display:flex; justify-content:space-between; align-items:center; height:80px; background-color:#eeeef6;}
.layout > .content-area .util div {height:35px; padding-left:45px; margin-left:35px; font-size:14px; font-weight:bold; line-height:35px; background:url(../images/user.png) no-repeat left center; background-size:35px;}
.layout > .content-area .util div strong {color:#3759b1;}
.layout > .content-area .util ul {display:flex; align-items:center; margin-right:15px;}
.layout > .content-area .util ul li {margin-left:10px;}
.layout > .content-area .util ul li:before {display:inline-block; width:1px; height:11px; margin-right:10px; content:''; background-color:#999;}
.layout > .content-area .util ul li:first-child {margin-left:0;}
.layout > .content-area .util ul li:first-child:before {display:none;}
.layout > .content-area .util ul li a {font-size:14px; font-weight:bold; line-height:24px; text-decoration:none;}
.layout > .content-area .container {padding:35px 15px 35px 35px;}
.layout > .content-area .container h2 {display:block; font-size:18px; line-height:20px;}
.layout > .content-area .container h3 {display:block; padding-left:8px; background:url(../images/bg_h3.png) no-repeat left center;}
.layout > .content-area .container .location {display:flex; justify-content:space-between; align-items:center; margin-bottom:30px;}
.layout > .content-area .container .location dl dt {display:none;}
.layout > .content-area .container .location dl dd {cursor:default;}
.layout > .content-area .container .location dl dd a {display:inline-block; padding-left:11px; margin-left:5px; color:#666; text-decoration:none; background-image:url(../images/ic_tree.png); background-repeat:no-repeat; background-position:left center; vertical-align:middle; background-size:6px 10px;}
.layout > .content-area .container .location dl dd a.home {padding-left:0; margin-left:0; background-image:none;}
.layout > .content-area .container .location dl dd a:last-child {margin-right:0;}
.layout > .content-area .container .contents {height:auto;}

/* 데이터 */
.common-data {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#fff; background-color:rgba(255, 255, 255, 0.5); z-index:930;}
.common-data.on {display:block;}
.common-data .common-data-header {
	position:relative;
	width:800px;
	padding:15px;
	padding-bottom:0;
	margin:0 auto;
	margin-top:150px;
	background-color:#fff;
	border:1px solid #ddd;
}
.common-data .common-data-header h2 {position:relative; padding:8px; padding-top:0; margin:0; font-size:14px; line-height:20px; background:url(../images/bg_h2.png) no-repeat left 5px;}
.common-data .common-data-header h2 a {display:block; position:absolute; right:0; top:0; width:20px; height:20px; font-size:0; line-height:0; background:url(../images/ic_close.png) no-repeat center center; background-size:contain;}
.common-data .common-data-body {
	width:800px;
	max-height:calc(100vh - 385px);
	max-height:-moz-calc(100vh - 385px);
	max-height:-webkit-calc(100vh - 385px);
	padding:15px;
	margin:0 auto;
	background-color:#fff;
	overflow-y:auto;
	border:1px solid #ddd;
	border-top-style:none;
}
.common-data .common-data-body .text {margin-bottom:15px; white-space:pre-wrap; line-height:180%; word-break:break-all;}

/* 사유 */
.reason-layer {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#fff; background-color:rgba(255, 255, 255, 0.5); z-index:999;}
.reason-layer.on {display:block;}
.reason-layer .input-form {
	display:block;
	width:500px;
	height:270px;
	padding:0;
	margin:0 auto;
	margin-top:calc((100vh - 270px) / 2);
	background-color:#fff;
	border:1px solid #000;
	box-sizing:border-box;
	border-radius:3px;
}
.reason-layer .input-form h2 {padding:0 15px; font-size:18px; line-height:50px; background-color:#333; color:#fff; z-index:998; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:50px;}
.reason-layer .input-form form {padding:15px;}
.reason-layer a.close {position:absolute; right:15px; top:15px; line-height:20px;}
.reason-layer.masking .input-form {
	height:180px;
	margin-top:calc((100vh - 180px) / 2);
}

/* 비밀번호변경 */
.password-layer {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#fff; background-color:rgba(255, 255, 255, 0.5); z-index:999;}
.password-layer.on {display:block;}
.password-layer .input-form {
	display:block;
	width:500px;
	height:310px;
	padding:0;
	margin:0 auto;
	margin-top:calc((100vh - 310px) / 2);
	background-color:#fff;
	border:1px solid #000;
	box-sizing:border-box;
	border-radius:3px;
}
.password-layer .input-form h2 {padding:0 15px; font-size:18px; line-height:50px; background-color:#333; color:#fff; z-index:998; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:50px;}
.password-layer .input-form form {padding:15px;}
.password-layer a.close {position:absolute; right:15px; top:15px; line-height:20px;}
