@charset "UTF-8";

/*TEXT*/
em{font-style: normal;}
.em.weight{color: #e52626;}
.em.weighty{color: #02ab56;}
.aside-right{float: right;}
.main .aside-right{float: none;position: absolute; right: 20px; top: 50%; transform: translate(0, -50%);}


/* TABLE */
.data-table{width: 100%; border-top: 1px solid #e2e2e2;border-collapse: collapse;border-spacing: 0; table-layout: fixed;}
.data-table th {font-size: 15px; background: #fafafa; border-bottom: 1px solid #e2e2e2; padding: 14px 5px; font-weight: 400;}
.data-table td {font-size: 15px; border-bottom: 1px solid #e2e2e2; padding: 14px 5px; text-align: center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.data-table td.new {color: #f0331d;}
.data-table td .clamp {text-align: left; width: 800px; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.data-table.basic tbody tr:hover {background-color: #f6ffee;}

/*BTN*/
button, input[type=button]{border: 0 none;}
.btn{display: inline-block; vertical-align: top; text-align: center;  *zoom: 1; font-size: 16px; box-sizing: border-box; width: auto;cursor: pointer;}
.btn.small{height: 30px; line-height: 28px; padding: 0 15px; font-size: 14px; width: auto; font-weight: 300}
.btn.medium{height: 40px; line-height: 38px; padding: 0 17px;}
.btn.large{height: 47px; line-height: 45px; padding: 0 17px;}
.btn.x-large{height: 60px; line-height: 60px; font-size: 18px;}
.btn.type01{border-radius: 5px; -webkit-border-radius: 5px; color: #222222; background-color: #ffffff; border: 1px solid #cccccc;}
.btn.type01:hover{border: 1px solid #222222;}
.btn.type02{border-radius: 5px; -webkit-border-radius: 5px; color: #ffffff; background-color: #999999; font-weight: 400;}
.btn.type03{border-radius: 5px; -webkit-border-radius: 5px; color: #ffffff; background-color: #666666; font-weight: 400;}
.btn.type04{border-radius: 5px; -webkit-border-radius: 5px; color: #ffffff; background-color: #ef7e34; font-weight: 400;}
.btn.type04:hover{background-color: #02ab56;}
.btn.type05{border-radius: 5px; -webkit-border-radius: 5px; color: #ffffff; background-color: #02ab56;}
.btn.type06{border-radius: 5px; -webkit-border-radius: 5px; color: #87dca6; background-color: #05762f;}
.btn.sorting:after{content: ''; display: inline-block; margin-left: 5px; padding-bottom: 2px; width: 11px; height: 8px; background: url(../images/common/ico_arrow_01.svg) 0 0 no-repeat; background-size: 11px 8px; }
.btn.sorting.rise:after{ background: url(../images/common/ico_rise.svg) 0 0 no-repeat; background-size: 11px 8px;}
.btn.like{position: absolute; right: 0; top: 5px; padding: 0 15px; min-width: 114px; height: 44px; font-size: 15px; line-height: 44px; background: #fff; border: 1px solid #ddd; border-radius: 30px}
.btn.like:hover {border: 1px solid #222222;}
.ico.back+.tab{margin-left: 15px;}
.btn-area.large{text-align: center;}
.btn-area.large .btn-left{float: left}
.btn-area.large .btn-right{float: right}
.btn-area.large .btn+.btn{margin-left: 5px;}
.btn-area.large .choice{line-height: 30px; font-size: 16px; margin-right: 20px;}
.btn-area.large .choice .num{color: #222; font-weight: 500;}
.num input{text-align: center;}
.btn.add-img {padding: 10px; height: 38px; line-height: 38px;}
.icon-toggle {display: block; width: 64px; height: 36px; background: url('../images/common/toggle_off.png') 0 0 no-repeat; background-size: 64px 36px;}
.icon-toggle.active {background: url('../images/common/toggle_on.png') 0 0 no-repeat; background-size: 64px 36px;}


/* TAB */

.tab-wrap .tab{display: inline-block; vertical-align: middle;}
.tab:after{content: ''; display: block; clear: both}
.tab li{display: block; float: left; width: 190px; padding-right: 5px; text-align: center; box-sizing: border-box;}
.tab li a{display: block;line-height: 60px;width: 100%; text-align: center;font-size: 16px;background: #e2e2e2; border-top-left-radius: 5px; border-top-right-radius: 5px;}
.tab li.active a {background: #fff; color: #222222; font-weight: 500;}

.tab.small{width: 100%}
.tab.small li a{height: 45px; line-height: 45px;  border-radius: 5px; background: #ffffff;border: 1px solid #cccccc;}
.tab.small li.active a{background: #02ab56; color: #fff;}

.tab-data li{display: inline-block; }
.tab-data li+li{padding-left: 15px; margin-left: 10px; border-left: 1px solid #e2e2e2;}
.tab-data li.active{color: #02ab56; font-weight: 600;}

.content-primary:after{content: ''; display: block; clear: both}

/* ICON */
.ico{display: inline-block; width: 22px; height: 18px; background-size: 100%; vertical-align: middle;}
.ico.img{display: block; margin: 0 auto; width: 18px; height: 16px; background-image: url(../images/common/ico_img.png)}
.ico.one{display: block; margin: 0 auto; width: 18px; height: 16px; background-image: url(../images/common/ico_one.png)}
.ico.notice{display: block; margin: 0 auto; width: 22px; height: 18px; background-image: url(../images/common/ico_notice.svg)}
.ico.talk{display: block; margin: 0 auto; width: 21px; height: 18px; background-image: url(../images/common/ico_talk.svg)}
.ico.new{display: block; position: absolute; top: -10px; right: 0; margin: 0 auto; width: 17px; height: 17px; font-size: 12px; font-weight: 500; text-align: center; line-height: 17px; background-color: #f0331d; color: #ffffff; border-radius: 17px;}
.ico.setting{display: block; margin: 0 auto; width: 18px; height: 18px; background-image: url(../images/common/ico_setting.svg)}
.ico.logout{display: block; margin: 0 auto; width: 18px; height: 18px; background-image: url(../images/common/ico_logout.svg)}
.ico.del{width: 24px; height: 24px; background-image: url(../images/common/ico_del.svg)}
.ico.facebook{width: 44px; height: 44px; background-image: url(../images/common/ico_facebook.png);}
.ico.mail{width: 44px; height: 44px; background-image: url(../images/common/ico_mail.png);}
.ico.del{width: 24px; height: 24px; background-image: url(../images/common/ico_del.svg);}
.ico.back{width: 44px; height: 44px; background-image: url(../images/common/ico_back.svg);}
.ico.back:hover{width: 44px; height: 44px; background-image: url(../images/common/ico_back_hover.svg);}
.ico.back2{width: 28px; height: 28px; vertical-align: sub; background-image: url(../images/common/ico_back2.svg);}
.ico.back2:hover{width: 28px; height: 28px; vertical-align: sub; background-image: url(../images/common/ico_back2_hover.svg);}
.ico.star{width: 14px; height: 14px; background-image: url(../images/common/ico_star.svg); vertical-align: 0;}
.ico.except{width: 12px; height: 3px; background-color: #222222; }
.ico.tip{width: 24px; height: 24px; background-image: url(../images/common/ico_tip.svg);}
.ico.tip:hover{width: 24px; height: 24px; background-image: url(../images/common/ico_tip_hover.svg);}
.ico.key{width: 15px; height: 19px; background-image: url(../images/common/ico_key.png);vertical-align: -2px;}
.ico.update{width: 17px; height: 17px; background-image: url(../images/common/ico_update.png);vertical-align: -2px;}
.ico.save{width: 18px; height: 18px; background-image: url(../images/common/ico_edit.png);vertical-align: -3px;}
.ico.download{width: 28px; height: 28px; background-image: url(../images/common/ico_download.svg);}
.ico.time{width: 16px; height: 15px; background-image: url(../images/common/ico_time.png);}

/*form*/
.select{padding: 0 20px 0 10px; height: 38px; border-radius: 5px; border: 1px solid #cccccc; box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.05); background-color: #ffffff; }
select{position: relative;-webkit-appearance: none; -moz-appearance: none;appearance: none; padding: 0 20px 0 10px; box-sizing: border-box; background: #fff url(../images/common/select.png) 95% 15px no-repeat !important;}
select::-ms-expand {
   display: none;
}
.radio-box,
.check-box{display: inline-block;}
.radio-box+.radio-box{margin-left: 10px}
input[type="checkbox"],input[type="radio"]{ display:none;}
input + label{display:inline-block; padding-left: 29px;position: relative; text-align: center;}
input[type="checkbox"] + label:before{content: ''; display: inline-block;position: absolute; left:0; top: 50%; margin-top: -12px; width: 24px; height: 24px; background: url(../images/common/check-off.svg) 0 0 no-repeat; background-size: 24px auto;}
input[type="checkbox"]:checked+label:before{background: url(../images/common/check-on.svg);}
input[type="radio"] + label:before{content: ''; display: inline-block;position: absolute; left: 0; top: 50%; margin-top: -12px; width: 24px; height: 24px;  background: url(../images/common/radio-off.svg) 0 0 no-repeat; background-size: 24px auto;}
input[type="radio"]:checked+label:before{background: url(../images/common/radio-on.svg);}

.check-box.type02 input[type="checkbox"] + label:before{background: url(../images/common/check-off02.png); background-size: 24px; color: #fff; }
.check-box.type02 input[type="checkbox"]:checked+label:before{background: url(../images/common/check-on02.png); background-size: 24px; color: #fff; }
.data-table input[type="checkbox"] + label:before{margin-top: -17px;}
.data-table input[type="radio"] + label:before{margin-top: -17px;}

input{border: 0 none; height: 40px; width: 100%;  background: transparent; padding: 0 10px; box-sizing: border-box;}
.input-text{display: inline-block; font-size: 16px; height: 40px; line-height: 40px; border: 1px solid #cccccc; border-radius: 5px; background: #ffffff; box-sizing: border-box;}
.input-text.ct{text-align: center;}
input::placeholder{color: #666666;}
input:disabled {background-color: #ffffff; color: #999999;}

.text-area{width: 100%; border: 1px solid #cccccc;}
.noresize {resize: none;}
.input-date{display: inline-block; padding: 0 10px;}
.input-date .input-text{width: 120px; font-size: 16px;}
.input-date .ui-datepicker-trigger{padding: 11px; border-radius: 5px; background: #fafafa; border: 1px solid #cccccc; vertical-align: top; margin-left: 5px;}
.input-date .ui-datepicker-trigger:hover {border: 1px solid #222222; }
.input-date .btn-date {width: 40px; padding: 0; height: 40px; line-height: 39px; border-radius: 5px; background: #fafafa; border: 1px solid #cccccc; vertical-align: top; margin-left: 1px;}
.input-date .btn-time {padding: 10px 1px; height: 40px; line-height: 40px; border-radius: 5px; background: #fafafa; border: 1px solid #cccccc; vertical-align: top; }
.input-date .btn-time:hover {border: 1px solid #222222; }
.input-date .hypen{display: inline-block;}

.search{position: relative; width: 230px; border-bottom: 2px solid #666666; display: inline-block;}
.search + .keyword {margin-left: 20px;}
.search .btn-search{position: absolute; right: 0; top: 9px; display: inline-block; vertical-align: middle; }
.label {color: #666666;}
.label .num{display: block; color: #222222;}
/* .search input:focus + .btn-search+ .result-list{ display: block;}  */
.result-list{display: none;position: absolute; left: 0; top: 42px; width: 100%;background: #f1f4f4; border: 1px solid #cccccc; z-index: 1;box-sizing: border-box;max-height: 400px;
overflow-y: scroll;}
.result-list li{height: 40px; line-height: 40px; padding-left: 15px; box-sizing: border-box;}
.result-list li+li{border-top: 1px solid #ccc;}
.result-list li:hover{color: #222; background: #fff; font-weight: 500}

.fieldset+.fieldset{margin-top: 10px}
.fieldset.large {position: relative;}
.fieldset.large .check-box+.check-box{margin-left: 23px;}
.fieldset.large .field{position: relative; padding-left: 120px; min-height: 58px; padding-right: 190px; color: #666;}
.fieldset.large .num{color: #222222; font-weight: 500}
.fieldset.large .field h3{position: absolute; left: 0; line-height: 58px; font-size: 13px; font-weight: 500; color: #222}
.fieldset.large .field .insert{display: inline-block; border-radius: 30px; padding: 9px 52px; margin:5px 0; background: #e2e2e2;margin-right: 3px;}
.fieldset.large .field+.field{margin-top: 5px;}
.fieldset.large .search-tab{position: relative; padding-left: 120px; min-height: 58px; padding-right: 190px; color: #666;padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #ccc}
.fieldset.large .search-tab h3{position: absolute; left: 0; line-height: 58px; font-size: 13px; font-weight: 500; color: #222}
.fieldset.large .search-tab .search-btn-area a{display: inline-block; line-height: 16px; padding: 14px 0; width: 130px; text-align: center; background: #e2e2e2; border-radius: 30px;}
.fieldset.large .search-tab .search-btn-area a .num{display: block;}
.fieldset.large .search-tab .search-btn-area a.active{background: #02ab56; color: #76f3a7}
.fieldset.large .search-tab .search-btn-area a.active .num{color: #ffffff;}
.fieldset.large .search-tab .search-data {position: absolute; right: 0; top: 10px;}
.fieldset.large .search-tab .btn.large {position: absolute; right: 0; top: 10px; width: 150px;}

.search-form{padding: 20px 0;}
.field-wrap{position: relative; border-bottom: 1px solid #ccc; padding-bottom: 20px;}
.fieldset.large .send{font-size: 15px; position: absolute; right: 0; top: 0; height: 130px; padding-top: 15px; padding-left: 20px; border-left: 1px solid #e2e2e2; box-sizing: border-box;}
.fieldset.large .send.single {padding-top: 40px;}
.fieldset.large .send.line {height: 60px; padding-top: 6px;}
.fieldset.large .send span{line-height: 44px;}
.fieldset.large .send .num{display: inline-block; width: 80px; height: 44px; background: #ffffff; border-radius: 22px; text-align: center; margin-left: 10px;}
.fieldset.large .send .btn.large{width: 150px;}
.fieldset.large .send div + .btn.large{margin-top: 10px;}
.result{height: 40px;margin-bottom: 10px; font-size: 16px;}
.result .left{float: left; padding-top: 7px;}
.result .right{float: right}
.result .value{display: inline-block; line-height: 38px; vertical-align: top; margin-right: 15px;}
.result .num{vertical-align: top; color: #222; }
.keyword {line-height: 40px; display: inline-block; color: #222222; font-weight: 600;}
.keyword + .keyword {margin-left: 20px;}

/* PAGINATION */
.pagination{text-align: center; margin-top: 30px; font-size: 0;}
.pagination .page, .pagination a, .pagination strong{display: inline-block; font-size: 16px; line-height: 25px; margin: 0 2px;}
.pagination .page {font-size: 0;vertical-align: top; margin: 0 10px;}
.pagination .page strong{padding-bottom: 0px;color: #02ab56; line-height: 25px;padding: 0 5px;font-weight: normal;}
.pagination .page a{line-height: 25px; padding: 0 5px;color: #aaa;}
.pagination .page a:hover{color: #02ab56;}
.pagination .first{width: 25px; height: 25px;  background: url("../images/common/btn_first.svg") 0 center no-repeat;  font-size: 0; line-height: 999em; text-indent: 999em; overflow: hidden;}
.pagination .next{width: 25px; height: 25px;  background: url("../images/common/btn_next.svg") 0 center no-repeat;  font-size: 0; line-height: 999em; text-indent: 999em; overflow: hidden;}
.pagination .prev{width: 25px; height: 25px;  background: url("../images/common/btn_prev.svg") 0 center no-repeat;  font-size: 0; line-height: 999em; text-indent: 999em; overflow: hidden;}
.pagination .last{width: 25px; height: 25px;  background: url("../images/common/btn_last.svg") 0 center no-repeat;  font-size: 0; line-height: 999em; text-indent: 999em; overflow: hidden;}
.pagination + .btn-area {position: relative; width: 100%; bottom: 30px; box-sizing: border-box; }


/*팝업*/
.dimmed{display: block; position: fixed;top: 0; left: 0;width: 100%;height: 100%;background-color: #000;opacity: 0.8;filter: alpha(opacity=80);z-index: 5;}
.layer-popup{display: none; position: relative; left: 0; right: 0; width: 100%; height: 100%;z-index: 9;}
.popup-wrap{position: fixed; height: 203px; width: 450px; margin: 0 auto; box-sizing: border-box; z-index: 10}
.popup-wrap .text{font-size: 20px; line-height: 25px; text-align: center; color: #222; padding-top: 50px;}
.popup-wrap .btn-area{margin: 23px auto 0; text-align: center;}
.popup-close{display: inline-block; position: absolute; right: 10px; top: 10px; width: 20px; height: 20px; background: url(../../@resource/images/common/popup_close.svg) 0 0 no-repeat; background-size: 20px auto; text-indent: 999; line-height: 999em; overflow: hidden; font-size: 1px;}
#popup-photo.layer-popup {}
#popup-photo.layer-popup .popup-wrap {width: 850px; height: 610px;}
#popup-photo.layer-popup .popup-wrap .photo-wrap {position: relative; width: 730px; height: 435px; margin: 60px auto 30px; border-radius: 6px; overflow: hidden;}
#popup-photo.layer-popup .popup-wrap .photo-wrap img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 110%; height: auto;}

/**/
.warn{color: #ff586a}
.expect{color: #9ae03c}
.caution{color: #ed7e00}
.interest{color: #e9b500}
.usual{color: #8cc726}
.activity{color: #8e4eca}
.accc{color:#da72db}
.downaccc{color:#0090d3}

.condition{float: left;width: 170px; max-height: 750px; overflow: auto;}
.condition li{height: 50px; line-height: 50px; width: 150px; border: 1px solid #e2e2e2; box-sizing: border-box;overflow: hidden;}
.condition li+li{border-top: 0 none;}
.condition li a{display: inline-block;width: 100%; height: 100%;padding-left: 20px; box-sizing: border-box; color: #222222;}
.condition li.warn a{border-left: 10px solid #ff2929;}
.condition li.caution a{border-left: 10px solid #ff5893;}
.condition li.interest a{border-left: 10px solid #e99f00;}
.condition li.usual a{border-left: 10px solid #8cc726;}
.condition li.downaccc a{border-left: 10px solid #d9231a;}
.condition li.downacccl a{border-left: 10px solid #007ac8;}


.condition li.active a{color: #ffffff}
.condition li.warn.active{background: #ff2929;}
.condition li.caution.active{background: #ff5893;}
.condition li.interest.active{background: #e99f00;}
.condition li.usual.active{background: #8cc726;}
.condition li.downaccc.active{background: #d9231a;}
.condition li.downacccl.active{background: #007ac8;}

/* 타이틀 */
.section-wrap:after{content: ''; display: block; clear: both;}
.section-header{position: relative; color: #222222; border-bottom: 1px solid #e2e2e2; padding-bottom: 10px;}
.section-title{position: relative; color: #222222; font-size: 18px; font-weight: bold;}
.section-title a{margin-left: 10px}
.content-title{position: relative; font-size: 14px;  line-height: 28px;}
.content-title a{position: absolute; right: -4px; top: 0;}
.section-header + .cont{margin-top: 20px}
.cont.cont-box {width: 100%; min-height: 700px; margin-top: 5px; padding: 40px; box-sizing: border-box; border: 1px solid #e2e2e2; background: #fafafa; border-radius: 5px;}
.cont.cont-box .header {margin-bottom: 40px;}



/*login*/
html.login{background: #10a849}
.login-wrap .btn.x-large{width: 100% ; border: 0 none; color: #222; font-weight: 600; font-size: 18px; vertical-align: middle;}
.login-wrap .btn.x-large .key{margin-right: 5px;}
.login-wrap{width: 300px; margin: 10% auto 0;}
.login-wrap h1{width: 217px; margin: auto;}
.login-wrap h1 img{width: 217px; text-align: center;}
.login-wrap .input-text{height: 60px; list-style: 58px; background: #2fb963; border: 0 none; text-align: center; color: #ffffff; font-size: 18px}
.login-wrap input::placeholder{color: #9bffc0;}
.login-wrap .insert{margin-bottom: 10px;}
.login-wrap .check-box.type02 .label{text-align: center; margin-top: 20px; margin-left: 25px; color: #fff; font-size: 16px;}
.login-wrap .btn.type06{width: 147px; height: 34px; line-height: 34px; font-size: 14px; padding: 0 9px; margin-top: 10px;}
.login-wrap .selectric-type02{ margin-top: 20px }
.login select{background-color:#10a849 !important;}
.tip-wrap{position: absolute; right: 0; top: 0;}
.tip-notice{position: absolute; right: 45px; top: 50%; min-width: 320px; border: 1px solid #ddd; background: #f6ffee; border-radius: 5px; padding: 13px 20px;  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.05); background-color: #f6ffee; font-size: 16px; font-weight: 300; letter-spacing: -0.05em; transform: translate(0, -50%); z-index: 1; box-sizing: border-box;}
.tip-notice:after{content: ''; display: block; position: absolute; width: 17px; height: 26px; right: -17px; top: 50%; margin-top: -15px; background: url('../images/common/bg_tip.png') 0 0 no-repeat;}
.status .section-left{float: none; padding-left: 200px;}
.status .section-graph{float: none; padding-left: 200px;}
.status .tab-data{float: left; padding-top: 10px; padding-bottom: 20px;}
.status .tab-data li a {font-size: 16px; font-weight: 300;}
.status .tab-data li.active a {font-weight: 500;}
.status .data-fieldset{float: right;}
.section-wrap .section-graph + .section-graph{margin-top: 60px;}
.section-wrap .cont{position: relative;}
.section-wrap .cont .column {}
.section-wrap .cont .column:after {content: ''; display: block; clear: both;}
.section-wrap .cont .column .cont-wrap {float: left; width: 563px;}
.section-wrap .cont .column .cont-wrap + .cont-wrap { float: right; width: 633px;}
.section-wrap .cont.cont-box .column {}
.section-wrap .cont.cont-box .column .cont-wrap {width: 632px;}
.section-wrap .cont.cont-box .column .cont-wrap + .cont-wrap {width: 364px;}
.section-wrap .aside-right{clear: right; padding: 10px 75px 20px 0}
.section-wrap .graph{ width: 1100px; overflow: auto;}

.section-wrap .graph:after{content: ''; display: block;clear: both}
.section-wrap .graph .time{float: left; }
.section-wrap .graph .time li{text-align: center; font-size: 12px;  width: 20px; line-height: 22px; vertical-align: middle; padding-right: 10px; vertical-align: bottom;}
/*main*/
.main section{width: 100%; margin-bottom: 20px;}
.main section.left{float: left; width: 49%; margin-bottom: 20px;}
.main section.right{float: right; width: 49%; height: 481px}
.main .section-header{padding:  0 20px;}
.main .section-title{height: 70px; line-height: 70px;}
.main .section-title .aside-right{font-size: 16px; float: right; padding: 0; font-weight: 300;}
.main .section-title .aside-right .ico {margin-right: 5px;}
.main .cont{padding: 40px; margin-top: 0; height: 410px; width: 100%; box-sizing: border-box;}
.main .cont h3.cont-tit {font-size: 20px; line-height: 20px; color: #222222; font-weight: 500; text-align: center;}
.main .cont .chart h3.cont-tit.left {position: absolute;}
.main .cont01{height: 410px;}
.main .cont01 .chart{text-align: center;}
.main .data-list {text-align: center; margin: 0 auto; margin-bottom: 35px; }
.main .data-list li {display: inline-block; margin: 0 30px;}
.main .data-list li .label{display: block;font-size: 22px; color: #222; text-align: center; font-weight: 500;}
.main .data-list li .label + .btn {margin-top: 10px;}
.main .information .section-header .section-title{height: auto;font-size: 40px; line-height: 47px; padding: 20px 20px 0; font-weight: 300;}
.main .section-header strong{font-weight: 600}
.main .section-header .summary{display: block; font-size: 16px; padding: 10px 20px 20px; font-weight: 300;}
.main .section-header .info-add{width: 128px; height: 128px; padding-top: 25px; box-sizing: border-box; border: 1px solid #cccccc; text-align: center; overflow: hidden; border-radius: 64px;}
.main .section-header .info-add:hover{border: 1px solid #222222;}
.main .section-header .info-add span{display: block; font-size: 16px; font-weight: 500; margin-top: 5px;}
.main .section.data{min-height: 214px}
.main .report.left {width: 605px; height: 480px;}
.main .report.right {float: right;}
.main .report.w30 {width: 562px;}
.main .report.w70 {width: 766px;}
.main .due-date.right {width: 800px; height: 486px;}

.due-date .cont{padding-right: 0;}
.due-date .calendar{float: left}
.due-date .table-wrap{width: 360px; margin-left: 20px; display: inline-block; float: left}
.due-date .table-wrap .date{display: block; font-size: 20px; color: #222; text-align: center;}
.due-date .table-wrap .summary{display: block; font-size: 14px; color: #222; margin-bottom: 30px; text-align: center;}

.due:before{content: ''; display: inline-block; width: 16px; height: 16px; border-radius: 16px; margin-right: 5px; background-color: #ffc800;}
.due.type01:before{background-color: #ffc800;}
.due.type02:before{background-color: #e36817;}
.due.type03:before{background-color: #9ae03c;}
.due.type04:before{background-color: #61bbe8;}
.due.type05:before{background-color: #aa55ff;}
.btn-more:after{content: '';display: inline-block; margin-left: 5px; vertical-align: 2px; border-top: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid #222;}

.report .cont .chart .cont-tit {padding-bottom: 50px;}
.report .cont .chart .cont-tit.pr {padding-bottom: 50px; padding-right: 70px;}
.report .cont.single .chart {text-align: center;}
.report .cont.second .chart {width: 38%; float: left; text-align: center;}
.report .cont.second .chart + .chart {width: 56%; margin-left: 30px;}
.report .cont.third {}
.report .cont.third:after {display: block; content: ''; display: block;}
.report .cont.third .chart {float: left; text-align: center; height: 100%; vertical-align: bottom;}
.report .cont.third .chart + .chart {margin-left: 60px;}
.report .cont.third .chart.chart01 {width: 27%;}
.report .cont.third .chart.chart02 {width: 27%;}
.report .cont.third .chart.chart03 {width: 36%;}

/* 번식 이력 */
.date-list{position: relative;margin-top: 15px; z-index: 1; height: 705px; overflow: auto; padding-right: 20px;}
/*.date-list:after{content: ''; display: block; width: 1px; height: 700px; background: #e2e2e2; position: absolute; left: 6px; top: 13px; z-index: -1;}*/
.date-list .year{display: inline-block; font-size: 18px; font-weight: 600; color: #222;}
.date-list .year:before{content: ''; display: inline-block; width: 13px; height: 13px; border-radius: 7px; background: #02ab56; margin-right: 7px;}
.date-list .insert{padding-left: 31%; margin-top: 5px;}
.date-list .insert .insert-line {border: 1px solid #cccccc; background-color: #fafafa; border-radius: 5px; padding: 10px 5px;}
.date-list .insert .insert-line .input-text {background: none; border: none; line-height: 16px; height: 16px;}
.date-list li{position: relative;}
.date-list >li:after{content: ''; display: block; width: 1px; height: 110%; background: #e2e2e2; position: absolute; left: 6px; top: 13px; z-index: -1;}
.date-list li + li .year {margin-top: 30px;}
.date-info {margin-top: 28px;}
.date-info input:disabled {color: #222222; font-weight: 300; background-color: #fafafa;}
.date-info li+li{}

.date-info li:after{content: ''; display: block; clear: both;}
.date-info li+li{margin-top: 30px}
.date-info li div:after{content: ''; display: block; clear: both;}
.date-info .date:before{content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 7px; background: #fff; margin-right: 8px; border: 1px solid #cccccc;}
.date-info .date{float: left; font-size: 16px; color: #222; font-weight: 300;}
.date-info .text{position: relative; float: left; font-size: 18px; color: #222; margin-left: 10px;}
.date-info .save{float: right; margin-top: 6px;}
.save-data{float: left;}
.date-info li.active {}
.date-info li.active .date:before{background-color: #cccccc;}
.date-info li.active .date{font-weight: 500;}
.date-info li.active .text{font-weight: 500; padding-left: 16px;}
.date-info li.active .text:before {content: ''; display: block; position: absolute; left: 3px; top: 9px; width: 7px; height: 9px; background: url('../images/common/arrow_green.png') 0 0 no-repeat; background-size: 7px 9px;}
.date-info li.active .save{background-image: url(../images/common/ico_edit_active.png);}
.date-info li.active .input-text,
.date-info li.active .insert-line {border: 2px solid #02ab56;}

/*스크롤*/
.mCustomScrollbar::-webkit-scrollbar{width: 6px; height: 5px;}
.mCustomScrollbar::-webkit-scrollbar-track {background-color:#f2f2f2;}
.mCustomScrollbar::-webkit-scrollbar-thumb {background-color:#999999;border-radius: 10px;}
.mCustomScrollbar::-webkit-scrollbar-thumb:hover {background: #999999;}
.mCustomScrollbar::-webkit-scrollbar-button:start:decrement,
.mCustomScrollbar::-webkit-scrollbar-button:end:increment{width:6px;height:0;background:#999999;}




.mCustomScrollbar{
scrollbar-3dlight-color: #f2f2f2;
scrollbar-arrow-color: #999999;
scrollbar-darkshadow-color: #f2f2f2;
scrollbar-face-color: #999999;
scrollbar-highlight-color: #f2f2f2;
scrollbar-shadow-color: #fff;
scrollbar-track-color: #f2f2f2;
}




.sorting.unseleted:after {
/* this selector is more specific, so it takes precedence over the other :after */
	background:none;
}

.sorting.rise.unseleted:after {
/* this selector is more specific, so it takes precedence over the other :after */
	background:none;
}