File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
.nav-header h1 a img {
width: 218px !important;
margin-left: 12px !important;
}
.nav-header h1 a {
height: auto !important;
}
.nav-header{background:#fff!important}
@charset 'utf-8';
html{overflow-y:scroll;}
body{min-width:320px;}
html,body,#wrapper{height:100%;}
/* ******************************************************************************************************
사이드 네비게이션
****************************************************************************************************** */
.nav-collapse-btn{position: relative;height:100%;color:transparent;}
.nav-collapse-btn > span{position:absolute;left:50%;top:50%;display:block;width:13px;height:2px;margin:-1px 0 0 -6.5px;background:#a7abb7;}
.nav-collapse-btn > span:before,
.nav-collapse-btn > span:after{content:'';display:block;position:absolute;left:0;width:100%;height:100%;background:#a7abb7;}
.nav-collapse-btn > span:before{top:-4px;}
.nav-collapse-btn > span:after{top:4px;}
.setting-list{display:none;position:absolute;z-index:100;top:100%;width:100%;max-height:600px;overflow-y:auto;background:#fff;border:1px solid #e2e2e2;border-radius:0 0 3px 3px;border-radius:3px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(140,140,140,0.5);
-moz-box-shadow: 0px 0px 5px 0px rgba(140,140,140,0.5);
box-shadow: 0px 0px 5px 0px rgba(140,140,140,0.5);}
.setting-list li{border-bottom:1px solid #e2e2e2;}
.setting-list li:last-child{border-bottom:0;}
.setting-list li > button,
.setting-list li > a{display:block;text-align:center;width:100%;padding:11px 5px;color:#4a4a4a;font-weight:700;word-break: keep-all;}
/* 네비 전체박스 */
.nav-container{position: fixed;top:0;z-index:101;width:250px;height:100%;background:#2f3541;}
html.DirectionLeft .nav-container{left:0;}
html.DirectionRight .nav-container{right:0;}
html.DirectionRight .nav-container::-webkit-scrollbar { display: none;}
html.DirectionRight .nav-container{-ms-overflow-style: none;}
.nav-container.overflowY{overflow-y:auto;}
.nav-container .nav-header h1{margin:0;}
.nav-container.close{width:65px;}
.nav-container.close .nav-header{padding:15px;text-align:center;}
.nav-container.close .nav-header h1,
.nav-container.close .nav-header .page-settings{display:none;}
.nav-container.close .nav-header .nav-collapse-btn{position:relative;top:auto;left:auto;right:auto;}
.nav-container.close .main-menu > ul > li > a{color:transparent;line-height:0;text-indent:0;padding-top:15px;}
.nav-container.close .main-menu > ul > li > a > i{display:block;margin:0 auto;top:0;}
.nav-container.close .main-menu > ul > li > a > span.main-menu-arr{display:none;}
.nav-container.close .main-menu > ul > li{position: relative;}
.nav-container.close .main-menu > ul > li > ul{display:none;position: absolute;top:0;width:210px;}
.nav-container.close .main-menu > ul > li > a > img{display: block;margin: 0 auto;}
html.DirectionLeft .nav-container.close .main-menu > ul > li > ul{left:100%;}
html.DirectionRight .nav-container.close .main-menu > ul > li > ul{right:100%;}
.nav-container.close .main-menu > ul > li > ul > li > a{padding-left:30px;}
.main-menu li{list-style:none;}
.main-menu > ul > li > a.on{background:#676FB2}
/* 로고, 스킨, 설정, 메뉴 버튼 */
.nav-header{position: relative;padding:56px 0 16px 0;z-index:10;background:#2f3541;}
.nav-header h1 a{display:block;height:33px;font-size:0;}
.nav-header h1 a img{width: 176px;height: auto;display: block;margin-left: 29px;}
.nav-header .nav-collapse-btn{position: absolute;right:9px;top:9px;width:33px;height:30px;border:1px solid #595d67;border-radius:3px;text-indent: -999em;}
.nav-header .page-settings{position:absolute;right:56px;top:14px;}
.nav-header .page-settings > ul > li{position:relative;float:left;list-style:none;}
.nav-header .page-settings > ul > li > button{line-height:17px;color:transparent;overflow:hidden;text-indent: -999em;}
.nav-header .page-settings > ul > li.skin > button{width:19px;height:17px;margin-right:13px;background: url(/img/icon-color.png) 0 0 no-repeat;background-size:19px 17px;}
.nav-header .page-settings > ul > li.admin > button{width:19px;height:17px;margin-right:13px;background: url(/img/icon-admin.png) 0 0 no-repeat;background-size:19px 17px;}
html.ie8 .nav-header .page-settings > ul > li.skin > button{background: url(/img/ie8-icon-color.png) 0 0 no-repeat;}
html.ie8 .nav-header .page-settings > ul > li.admin > button{background: url(/img/ie8-icon-admin.png) 0 0 no-repeat;}
.nav-header .page-settings > ul > li.skin > ul > li > a{position:relative;padding-left:0;padding-right:0;text-align:left;text-indent:35px;color:#505050;}
.nav-header .page-settings > ul > li.skin > ul > li > a:before{content:'';position: absolute;top:13px;left:19px;display:block;width:12px;height:12px;margin-right:4px;background:red;}
.nav-header .page-settings > ul > li.skin > ul > li.current-skin > a:before{background:#2f3541;}
.nav-header .page-settings > ul > li.skin > ul > li.default > a:before{background:#a8acb8;}
.nav-header .page-settings > ul > li.skin > ul > li.black > a:before{background:#000000;}
.nav-header .page-settings > ul > li.skin > ul > li.blue > a:before{background:#084184;}
.nav-header .page-settings > ul > li.skin > ul > li.red > a:before{background:#ca2919;}
.nav-header .page-settings > ul > li.skin > ul > li.green > a:before{background:#25ba9c;}
.nav-header .page-settings > ul > li.config > button{width:17px;height:17px;background: url(/img/icon-setting.png) 0 0 no-repeat;background-size:17px 17px;}
html.ie8 .nav-header .page-settings > ul > li.config > button{background: url(/img/ie8-icon-setting.png) 0 0 no-repeat;}
.nav-header .page-settings > ul > li.config > ul > li > a{color:#525252;}
.nav-header .page-settings > ul > li > ul{width:140px;top:30px;overflow:visible;}
html.DirectionLeft .nav-header .page-settings > ul > li > ul{left:-16px;}
html.DirectionRight .nav-header .page-settings > ul > li > ul{right:-16px;}
.nav-header .page-settings > ul > li > ul:after{content:'';display:block;position: absolute;top:-7px;width: 0;height: 0;border-style: solid;border-width: 0 5.5px 8px 5.5px;border-color: transparent transparent #ffffff transparent;}
html.DirectionLeft .nav-header .page-settings > ul > li > ul:after{left:18px;}
html.DirectionRight .nav-header .page-settings > ul > li > ul:after{right:18px;}
html.DirectionRight .nav-header .page-settings > ul > li.skin > ul:after{right:32px;}
/* 메인 메뉴 */
.main-menu-wrap{width:100%;}
.main-menu-wrap .mCSB_inside >.mCSB_container{position: absolute !important;width:100%;margin:0;}
.main-menu-wrap .mCSB_scrollTools .mCSB_draggerRail{display:none;}
.main-menu-wrap .mCSB_scrollTools{width:4px;right:3px;opacity:0;}
.main-menu-wrap .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{border-radius:0;background-color:rgb(167,171,183);background-color:rgba(167,171,183,1);}
.main-menu-wrap .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:rgb(167,171,183);background-color:rgba(167,171,183,1);}
.main-menu{width:100%;}
.main-menu a{color:#fff;}
.main-menu > ul > li{border-bottom:1px solid #3d434f;}
.main-menu > ul > li:first-child{border-top:1px solid #3d434f;}
.main-menu > ul > li > ul{/* visibility:hidden;opacity:0;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s; */}
.main-menu > ul > li > ul.open{/* visibility:visible;opacity:1; */}
.main-menu > ul > li > ul > li:hover > a,
.main-menu > ul > li > ul > li > a.on{background:#656996;box-shadow: 0px 1px 6px 0px rgba(17, 17, 17, 0.75);-moz-box-shadow: 0px 1px 6px 0px rgba(17, 17, 17, 0.75);-webkit-box-shadow: 0px 1px 6px 0px rgba(17, 17, 17, 0.75);}
.main-menu > ul > li > a{position:relative;display:block;width:100%;height:49px;line-height:49px;text-indent:30px;overflow:hidden;}
.main-menu > ul > li > a > span.main-menu-arr{content:'';display:block;position:absolute;top:20px;right:30px;width:6px;height:9px;background: url(/img/icon-menu-arr-right.png) 0 0 no-repeat;background-size:6px 9px;}
.main-menu > ul > li > a > img{vertical-align: middle;margin-right: 20px;}
.main-menu > ul > li.current-tab > a > span.main-menu-arr{width:9px;height:6px;right:29px;background: url(/img/icon-menu-arr-down.png) 0 0 no-repeat;background-size:9px 6px;}
/* html.ie8 .main-menu > ul > li > a > span.main-menu-arr,
html.ie9 .main-menu > ul > li > a > span.main-menu-arr{display:none;} */
html.ie8 .main-menu > ul > li > a > span.main-menu-arr{background: url(/img/ie8-icon-menu-arr-right.png);}
html.ie8 .main-menu > ul > li.current-tab > a > span.main-menu-arr{background: url(/img/ie8-icon-menu-arr-down.png);}
.main-menu > ul > li > a > i{position:relative;top:-1px;display:inline-block;vertical-align:middle;margin-right:12px;}
.main-menu > ul > li:first-child > a > i{width:18px;height:18px;background-position:-5px -132px}
.main-menu > ul > li:nth-child(2) > a > i{width:18px;height:17px;background-position:-34px -132px}
.main-menu > ul > li:nth-child(3) > a > i{width:17px;height:17px;background-position:-59px -132px}
.main-menu > ul > li:nth-child(4) > a > i{width:16px;height:16px;background-position:-86px -132px}
.main-menu > ul > li:nth-child(5) > a > i{width:18px;height:18px;background-position:-112px -132px}
.main-menu > ul > li:nth-child(6) > a > i{width:17px;height:17px;background-position:-140px -132px}
.main-menu > ul > li:last-child > a > i{width:17px;height:17px;background-position:-167px -132px}
.main-menu > ul > li > ul{display:none;background:#2c303b;padding:11px 0}
.main-menu > ul > li > ul > li{background:transparent; /*IE9.js bug*/ }
.main-menu > ul > li > ul > li > a{display:block;padding:9px 0 9px 60px;font-size:12px;line-height:1;}
.main-menu > ul > li > ul > li:last-child{margin-bottom:0;}
.nav-bottom{display:none;}
/* ******************************************************************************************************
본문
****************************************************************************************************** */
.view-container{position:relative;height:100%;}
html.DirectionLeft .view-container{margin-left:250px;}
html.DirectionRight .view-container{margin-right:250px;}
.view-container.scrollLock{position: fixed;left:0;top:0;right:0;bottom:0;}
html.DirectionLeft .view-container.close{margin-left:65px;}
html.DirectionRight .view-container.close{margin-right:65px;}
.page-content-wrap{margin:-39px 0 -60px 0;min-height:100%;}
.page-content{padding:39px 1.25% 60px 1.25%;}
/* 헤더 */
.header{position:relative;background:#fff;}
.header.set-fixed{position: fixed;top: 0;left: 0;z-index: 21;width: 100%;height: 39px;}
.header .user-info{position:relative;height:39px;background:#676fb2;}
.user-info .nav-collapse-btn{position: absolute;top:0;display:none;background:#2f3541;}
html.DirectionLeft .user-info .nav-collapse-btn{left:0;}
html.DirectionRight .user-info .nav-collapse-btn{right:0;}
.user-info .nav-collapse-btn > span{width:15px;}
.user-info .site-setting{float:left;position:relative;min-width:192px;height:100%;}
.user-info .site-setting > button{width:100%;height:100%;color:#fff;border-right:1px solid #767fba;text-align:center;padding:0 35px 0 10px;
background:url(/img/site_list_arr.png) no-repeat 93% 18px;background-size:9px 6px;word-break:keep-all;}
.ie8 .user-info .site-setting > button,
.ie9 .user-info .site-setting > button{border:0;}
.user-info .site-setting .site.setting-list{border-top:0;border-radius:0 0 3px 3px;}
.setting-list li{list-style:none;}
.user-info .user-push{float:left;height:100%;padding-top:11px;}
.user-info .user-push > ul > li{float:left;padding:0 14px;}
.user-info .user-push > ul > li > a{position:relative;display:block;font-size:0;color:transparent;}
.user-info .user-push > ul > li > a > span{position: absolute;top:-4px;width:18px;height:18px;border-radius:50%;color:#fff;text-align:center;line-height:17px;font-size:11px;font-weight:700;}
.user-info .user-push > ul > li.error > a{width:17px;height:18px;background-position:-59px -102px;}
.user-info .user-push > ul > li.favorite > a{width:19px;height:19px;background-position:-5px -103px;}
.user-info .user-push > ul > li.alarm > a{width:15px;height:18px;background-position:-34px -102px;}
.user-info .user-push > ul > li.error > a > span{left:11px;background:#04b8ed;}
.user-info .user-push > ul > li.favorite > a > span{left:15px;background:#f44a39;}
.user-info .user-push > ul > li.alarm > a > span{left:10px;background:#f4db39;}
.user-info .user-state{float:right;padding-top:14px;line-height:1;height:100%;}
.user-info .user-state li{list-style:none;}
.user-info .user-state > ul > li{position:relative;float:left;color:#d8dcff;font-size:12px;}
.user-info .user-state > ul > li.user-name{position:relative;padding-right:27px;}
.user-info .user-state > ul > li.user-name:after{content:'';font-size:0;position:absolute;right:0;top:0;display:block;width:1px;height:13px;background:#e2e2e2;}
.user-info .user-state > ul > li.logout > a{padding:0 57px 0 27px;color:#d8dcff;background:url(/img/logout_top.png) no-repeat 83px 50%;}
.user-info .user-state > ul > li > strong{color:#fff;}
.user-info .user-state > ul > li > .user-picture{position: relative;top:-5px;right:6px;display:block;float:left;width:22px;height:22px;background-color:#a7abb6;border-radius:50%;text-align:center;overflow:hidden;vertical-align:middle;}
.user-info .user-state > ul > li > .user-picture img{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;}
html.ie8 .user-info .site-setting > button{padding:0 20% 0 10%;text-align:left;background: url(/img/ie8-site_list_arr.png) no-repeat 89.58% 18px;}
/* ******************************************************************************************************
푸터
****************************************************************************************************** */
.footer{height:60px;text-align:center;color:#898989;}
.footer strong{color:#838bd2;}
/* 레이아웃 속성 */
.tab-menu-wrap .tab-menu{margin-bottom:-1px;}
.tab-menu-wrap .tab-menu a{border-radius:0}
.tab-menu-wrap .tab-menu a.on,
.tab-menu-wrap .tab-menu a:hover{border-bottom-width:3px;}
.tab-menu-wrap .tab-menu:last-child{margin-bottom:0;}
.tab-menu-wrap .tab-menu:last-child a.on,
.tab-menu-wrap .tab-menu:last-child a:hover{border-bottom-width:2px;}
.tab-menu{position: relative;top: 1px;overflow:hidden;}
.tab-menu a{border: 1px solid #dcdcdc;font-size: 14px;color: #000;padding:0 10px;width:160px;min-width:80px;height: 41px;
border-radius:4px 4px 0 0 ;display: block;text-align: center;line-height: 41px;float: left;margin-right: 5px;
background: rgba(250,250,250,1);
background: -moz-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(233,233,233,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(250,250,250,1)), color-stop(100%, rgba(233,233,233,1)));
background: -webkit-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(233,233,233,1) 100%);
background: -o-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(233,233,233,1) 100%);
background: -ms-linear-gradient(top, rgba(250,250,250,1) 0%, rgba(233,233,233,1) 100%);
background: linear-gradient(to bottom, rgba(250,250,250,1) 0%, rgba(233,233,233,1) 100%);
}
.tab-menu a:hover{background:#fff;color: #676fb2;border-bottom: 2px solid #676fb2;}
.tab-menu a.on{background:#fff;color: #676fb2;border-bottom: 2px solid #676fb2;}
.layout-content{background: #fff;border: 1px solid #dcdcdc;border-radius:0 0 4px 4px;clear: both;}
.layout-content .layout-title{height: 70px;border-bottom: 1px solid #dcdcdc;padding-left: 20px;}
.layout-content .layout-title .editor-util-btn{float: right;}
.layout-content .layout-title .editor-full-btn{width: 40px;height: 40px;text-indent: -9999em;border-radius: 2px;background: #4e5486 url(/img/editor-arr.png) center no-repeat;background-size:50%;float: left;margin-top: 15px;margin-right: 10px;}
.layout-content .layout-title > button{font-weight: 600;height: 100%;width: 70px;}
.layout-content .layout-title > button.on{color: #676fb2;}
.layout-content .layout-title > button > div{border: 1px solid #dcdcdc;width: 22px;height: 22px;margin: 0 auto;margin-bottom: 8px;border-radius: 2px}
.layout-content .layout-title > button > div span{display: block;}
.layout-content .layout-title > button > div span:nth-child(1){height: 6px;border-bottom: 1px solid #dcdcdc;}
.layout-content .layout-title > button > div span:nth-child(2){height: 10px;border-bottom: 1px solid #dcdcdc;}
.layout-content .layout-title > button > div span:nth-child(3){height: 4px;}
.layout-content .layout-title > button .active-span{background: #c9caca;}
.layout-content .layout-title > button.on .active-span{background: #676fb2;}
.layout-content .layout-title > .skin-tab > .skin-div{width: 40px;height: 40px;margin-bottom: 0;padding-top: 5px;line-height:1}
.layout-content .layout-title > .skin-tab > .skin-div > span{border-bottom: 0 none;height: auto;}
.layout-content .layout-title > .skin-tab > .skin-div > p{margin-top: 4px;}
.layout-content .layout-title > .skin-tab.on > .skin-div > p,
.layout-content .layout-title > .skin-tab.on > .skin-div > span{color: #676fb2;}
.layout-content .editor{padding: 10px;overflow: hidden;}
.layout-content .layout-footer{border-top: 1px solid #dcdcdc;padding: 30px 30px;}
.layout-content .layout-footer .layout-skin-list{width: 162px;}
html.ie8 .layout-content .layout-title .editor-full-btn{background: #4e5486 url(/img/ie8-editor-arr.png) center no-repeat;}
/* ******************************************************************************************************
레이아웃 속성 관리 전체화면
****************************************************************************************************** */
.layout-content.siteLayOutSet{position:fixed;top:39px;right:0;bottom:0;left:0;z-index:20}
.layout-content.siteLayOutSet + .btn-area{position:fixed;width:100%;left:0;bottom:10px;z-index:25;margin-top:0;}
.layout-content.siteLayOutSet .editor,
.layout-content.siteLayOutSet .editor .iframe{height:auto;}
/* ******************************************************************************************************
버튼 스타일
****************************************************************************************************** */
.btn-area {margin-top:20px;text-align:center;}
.btn-area.al{text-align:left;}
.btn-area.ar{text-align:right;}
/*.btn-area:after {content:'';display:block;clear:both;}*/
.btn-area button,
.btn-area a{position:relative;outline: none;border: none;display: inline-block;position: relative;color:#fff;margin: 0 5px;border-radius:3px;vertical-align:middle;}
.btn-area button:after,
.btn-area a:after{content: '';display: block;position: absolute;z-index: -1;}
.btn-area button:active,
.btn-area a:active{top: 5px;box-shadow: 0 0 0;}
.btn-area .btn-normal{min-height:28px;padding:5px 20px;line-height: normal;margin-bottom: 5px;}
.btn-area .gray {background: #545454;box-shadow: 0 5px 0 #5F5F5F}
.btn-area .lightgray {background: #7e7e7e;box-shadow: 0 5px 0 #5F5F5F}
.btn-area .violet{background: #5e66ab;box-shadow: 0 5px 0 #474B7B}
.btn-area .red{background: #a72000;box-shadow: 0 5px 0 #6a1400}
html.ie8 .btn-area {text-align:center;}
html.ie8 .btn-area button {text-align:center;}
html.ie8 .btn-area button:active{top: 0;}
/* ******************************************************************************************************
북마크 버튼
****************************************************************************************************** */
.bookmark-list-pc{/* position: fixed;bottom: 100px;right: 21px; */float: left;margin-top: 15px;margin-right: 15px;width: 40px;height: 40px;}
.bookmark-list-pc button{text-indent: -9999em;position: relative;width: 40px;height: 40px;background: #4e5486;border-radius: 3px;z-index: 50;}
.bookmark-list-pc button:before{content: '';display: block;position: absolute;top: 50%;left: 50%;margin-left: -1.5px;margin-top: -11px;width: 3px;height: 22px;background: #fff;transition: all 0.3s ease;}
.bookmark-list-pc button:after{content: '';display: block;position: absolute;top: 50%;left: 50%;margin-left: -11px;margin-top: -1.5px;width: 22px;height: 3px;background: #fff;transition: all 0.3s ease;}
.bookmark-list-pc button.on:before{-webkit-transform: rotateZ(315deg);transform: rotateZ(315deg);}
.bookmark-list-pc button.on:after{-webkit-transform: rotateZ(315deg);transform: rotateZ(315deg);}
.bookmark-list-pc > ul{position: relative;top: -59px;right: 0;z-index: 10;}
.bookmark-list-pc ul li{position: absolute;top: 0;right: 0;opacity: 0;transition:all .3s ease;width: 59px;height: 59px;display: table;}
.bookmark-list-pc ul li a{display: block;width: 100%;height: 100%;color:#fff;font-size: 12px;border-radius: 3px;background: #6f75ad 0 0 no-repeat;text-align: center;display: table-cell;vertical-align: middle;}
.bookmark-list-pc ul li a img{display: block;margin: 0 auto;margin-bottom: 8px;box-sizing:border-box;}
.bookmark-list-pc ul.open > li{opacity: 1;z-index: 100;}
.bookmark-list-pc > ul > li img{padding-top: 0;height: auto;width: 20px;}
.bookmark-list-pc.site-menu > ul > li img{padding-top: 0;height: auto;width: 30px;}
.bookmark-list-pc.bbs .sub-category ul{opacity: 0;position: absolute;bottom: 0;right: 0;-webkit-transition: all .3s ease;transition: all .3s ease;width: 100%;height: 100%;}
.bookmark-list-pc.bbs .sub-category ul.sub-open{opacity: 1;}
.bookmark-list-pc.bbs ul.open .sub-category li:nth-child(1){top: 200px;right: -64px;opacity: 1;}
.bookmark-list-pc.bbs ul.open .sub-category li:nth-child(2){top: 200px;right: 0;opacity: 1;}
.bookmark-list-pc .line01{position: absolute;display: block;height: 3px;width: 123px;background: #cdcdcd;right: 0;top: -270px;-webkit-transition: all .3s ease;transition: all .3s ease;opacity: 1;}
html.ie8 .bookmark-list-pc button.on{background: #4e5486 url(/img/bookmark-pc-x.png) center no-repeat;background-size:40%;}
html.ie8 .bookmark-list-pc button.on:before{display: none;}
html.ie8 .bookmark-list-pc button.on:after{display: none;}
html.ie8 .bookmark-list-pc.bbs .open .sub-category li{top: 200px;right: -64px;opacity: 1;}
html.ie8 .bookmark-list-pc.bbs .open .sub-category li + li{top: 200px;right: 0;opacity: 1;}