@charset "utf-8";
html.mobile .web_only {display:none;}
html.web .mobile_only {display:none;}
body {  font-family: "OpenSans","NotoKrR";font-size:14px; font-weight:600;}

/*레이아웃*/
#wrap {margin:0 auto; width:100%;}
#header{position:relative; width:100%; min-height:140px; background: #fff;}
#header_sub{position:relative; width:100%; background: #fff;border-bottom:1px solid #e7e7e7;}
#nav{ width:100%; height:58px; border-top:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7;}
#container{width: 1500px; margin: 0 auto; padding-top:60px; }
#contents{margin:0 auto; box-sizing: border-box; width:1500px; margin:0 auto;}
#contents div.top{height:100px;display:none;}

.cont_left{float:left; width:1000px;}
.cont_right{float:right; width:390px;}


button.basic_btn{height:30px; line-height: 30px; background: #000; color:#fff; padding:0 28px;  box-sizing: border-box; }
button.del_btn{width: 18px; height:18px; background:url('../../images/delete.png')no-repeat 0 3px; background-size: 18px 18px;}
button.search_btn{width: 20px; height:30px; background:url('../../images/search_icon.png')no-repeat 0 5px; background-size: 20px 20px;}

/*header*/
.head{position: relative; display: flex; align-items: center; justify-content: space-between; width:1500px; height:80px; margin:0 auto;}
.user_info{color:#000;}
.admin_btn{width:70px; height:22px; line-height: 22px;font-size:12px; margin-right:10px; background:#7d7d7d; color:#fff; font-weight: 400; text-align: center; }
.log_btn{width:75px; height:20px; font-size:11px; margin-left: 10px; border:1px solid #d2d2d2;background:#fff; color:#000;font-weight: 600;text-align: center;}

.nav_box{display: flex; align-items: center; justify-content: space-between; width:1500px; height:58px; color:#bebebe; font-weight: normal; margin:0 auto;}

.nav_l{ display: flex; align-items:top; height:30px; }
.m_nav{display:inline-block; margin-right: 30px; line-height: 30px; font-size:14px;   }
.nav_now{color:#e51937; font-weight: 700; line-height: 10px; font-size:14px;vertical-align: baseline; }

.m_sel{display:inline-block;}

.nav_r > ul{ height:30px; display:flex; align-items: top;}
.nav_r > ul > li{display: inline-block; height:30px; line-height:28px; color:#000; margin-left: 5px; }
.nav_r li.s_tit{margin-right: 5px;}

/* container */
.cont_left h2{width:100%; font-size:36px; color:#3a3a3a; text-align: center; margin-bottom: 50px;}
.cont_right h3{width:100%; font-size:24px; color:#3a3a3a; text-align: center; margin-bottom: 34px; font-weight: 600;}


/*나의진행현황*/
.cont_left .contl_top{width:100%; height:400px; border-bottom:1px solid #e7e7e7;}
.cont_left .contl_top .contl_l{float:left; font-weight: 700;margin-top:20px;margin-left:40px;}
.cont_left .contl_top .contl_l .circle{position: relative; display:inline-block; width:220px; height:220px; border:1px solid #dcdcdc; border-radius: 110px; 
	margin-left:-20px; text-align: center; font-size:24px;  color:#d3d3d3; padding-top:90px; box-sizing: border-box;}
.cont_left .contl_top .contl_l .on{color:#112d4e;}
.cont_left .contl_top .contl_l .circle .check{position: absolute; top:14px; right:20px; width:97px; height:72px; background: url('../../images/cir_check.png'); background-size:97px 72px; }
.cont_left .contl_top .contl_l .circle:first-child{margin-left:0;}
.cont_left .contl_top .contl_r{float:right;}
.cont_left .contl_top .contl_r ul.r_box{width:180px;}
.cont_left .contl_top .contl_r ul.r_box li{width:100%;  padding:10px 0;border-bottom: 1px solid #3a3a3a; }
.cont_left .contl_top .contl_r ul.r_box li a{width: 100%; color:#3a3a3a;}
.cont_left .contl_top .contl_r ul.r_box li a .on{color:#b80a24;}
.cont_left .contl_top .contl_r ul.r_box li.disable {opacity: 0.2; }
.cont_left .contl_top .contl_r ul.r_box li .p01{font-size:24px; line-height:36px;}
.cont_left .contl_top .contl_r ul.r_box li .p02{ position:relative; font-size:18px; line-height: 24px; text-align: right; vertical-align: center;}
.cont_left .contl_top .contl_r ul.r_box li .p02:before{position: absolute; top:0; left:82px;display: inline-block; content: ""; width:24px; height:24px; 
background: url('../../images/arrow_icon.png')no-repeat; }

/*나의진행현황-평가자*/
.cont_left .contl_top .contl_l a.circle {position: relative; display:inline-block; width:220px; height:220px; border:1px solid #dcdcdc; border-radius: 110px; 
	margin-left:-20px; text-align: center; font-size:24px;  color:#d3d3d3; padding-top:60px; box-sizing: border-box;}
.cont_left .contl_top .contl_l a.circle .cir_01{color:#006ae1;}
.cont_left .contl_top .contl_l a.circle .cir_02{color:#112d4e;}
.cont_left .contl_top .contl_l a.circle .cir_03{color:#d3d3d3;}
.cont_left .contl_top .contl_l a.circle p.txt_no{font-size:36px; line-height:46px; margin-bottom:10px;font-weight: 800; }
.cont_left .contl_top .contl_l a.circle p.txt_b{font-size:24px;}
.cont_left .contl_top .contl_r .r_box2{display: flex; align-items: flex-end; width:180px; height:200px; }
.cont_left .contl_top .contl_r .r_box2 button.p02{ width:110px; height:30px; background: url('../../images/arrow_icon.png')no-repeat 0 2px; background-size: 24px 24px; font-size:18px; line-height: 24px; font-weight:500; text-align: right; }


/*나의평가자*/
.cont_left .contl_bt{width:100%;padding:70px 0 40px 0;  margin-bottom: 20px;}
.cont_left .contl_bt .main_btn{width:120px; height:48px;line-height: 48px; margin-top:5px; font-size:14px; color:#fff; text-align:center; background:#404040; border-radius: 24px; }
.cont_left .contl_bt li{float:left; width:276px; margin:30px 70px 10px 0;}
.cont_left .contl_bt li:nth-child(3n){margin-right: 0;}
.cont_left .contl_bt li span.m1{float:left; color:#939393;font-weight: 500;}
.cont_left .contl_bt li span.m1 p:first-child{font-size:22px;color:#3a3a3a; font-weight: 700;}
.cont_left .contl_bt li span.m1 p:nth-child(2){font-size:16px;}
.cont_left .contl_bt li a{ float:right; }

/*나의평가대상-평가자*/
.cont_left .contl_bt li .pic{float:left; margin-right: 20px;}
.cont_left .contl_bt li .pic img{border-radius: 100%;}
.cont_left .contl_bt li span.m2{float:left; }
.cont_left .contl_bt li span.m2 p.txt01{font-size:24px; line-height: 30px; font-weight: 600;}	
.cont_left .contl_bt li span.m2 p.txt02{font-size:14px; line-height: 22px; color:#3a3a3a; font-weight: 700;}	
.cont_left .contl_bt li span.m2 p.txt03{font-size:14px; line-height: 18px; color:#939393; font-weight: 500;}	

.cont_left .contl_bt li span.m2 p.p_1st{color:#ff5043;}
.cont_left .contl_bt li span.m2 p.p_2st{color:#37c89a;}
.cont_left .contl_bt li span.m2 p.p_last{color:#717171;}


/*공지사항*/
.cont_right .contr_top{height:250px;}
.cont_right .contr_top p{font-size:16px; line-height:30px; }
.cont_right .contr_top p:before{content:""; display:inline-block; width:3px; height:3px; margin:0 5px 3px 0; background:#3a3a3a;}

/*배너버튼들*/
.cont_right .contr_bt .bannerT_btn{position: relative; width:100%; height:63px; line-height:66px; text-align: center; background: #f7f7f7;}
.cont_right .contr_bt a{font-size:24px; text-align: center; font-weight: 500; margin-top: 10px;}
.cont_right .contr_bt .banner_btn{position: relative; float:left;display: flex; align-items: center; justify-content: center; width:189px; height:126px; background: #f7f7f7;}
.cont_right .contr_bt .banner_btn p{line-height: 24px; }
.cont_right .contr_bt .banner_btn img, .cont_right .contr_bt .bannerT_btn img{position: absolute; bottom:0; right:0; }
.cont_right .contr_bt .banner_btn .under_txt{color:#909090; font-size:14px;line-height: 14px;}
.cont_right .contr_bt .b01,.cont_right .contr_bt .b03,.cont_right .contr_bt .b05{margin-right: 11px;}


/*search박스*//*input은 table.css에~ */
.search{position:relative; width:100%; background: #f3f3f3; padding:17px 25px; margin-top:15px; 
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px; box-sizing: border-box;}

.search h2{float:left; display: inline; font-size:16px; line-height: 30px; }

.search ul{display: inline;  margin-left:5px;}
.search li{display: inline-block;   }
.search .search_r{line-height: 30px; position: absolute;top:17px; right:30px; font-size:14px; font-weight: bold;}
.search .search_r a{margin-right:10px;}
.search .s_h{line-height: 28px; font-weight:bold;  font-size:14px; margin:0 3px;}

/*search박스*//*input은 table.css에~ */
#search{width:1500px; margin:13px auto;}
#search > ul{ height:30px; display:flex; align-items: top;}
#search > ul > li{display: inline-block; height:30px; line-height:28px; color:#000; margin-left: 5px; }
#search li.s_tit{margin-right: 5px;}

.error_wrap{width: 100vw;height: 100vh;  text-align: center;vertical-align: middle; display: table-cell;}
.error_m{display:inline-block; text-align:left;}
.error_m h2{color:#e71c39;margin-bottom:10px;}
.error_m p{ line-height: 24px;}
.error_m p.l_link{ margin-top: 10px; font-size:15px;  }
.error_m p a{font-size:15px;line-height: 24px;color:#1d5bc0;}
.error_m p a:hover{text-decoration: underline;}


/**admin_appraisee**/
.dday{height:285px; line-height:260px; text-align: center; font-size:24px; }
.dday .big_ddaytxt{font-size:48px; font-weight: bold; }
.dday .red_ddaybox{margin-left:20px; padding:12px 30px 8px 20px; background: #e71c39; font-size:48px; font-weight: bold; color:#fff;}

.cont{position:relative; height:330px; border-top:1px solid #e71c39; border-bottom:1px solid #ccc;border-left:1px solid #ccc; border-right:1px solid #ccc;}
.cont h3{ margin:30px 0; text-align: center; font-size:24px; }

.cont .cont_05 {width:549px; height:140px; margin:0 auto; text-align: center;}
.cont .cont_05 .circle{padding-top:25px; width:130px; height:130px; text-align: center; display:inline-block; 
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;}
.cont .cont_05 .circle p{line-height:40px;color:#3a3a3a;font-size:18px; font-weight:bold;}
.cont .cont_05 .cir_01{ border:5px solid #3f72af;}
.cont .cont_05 .cir_02{ border:5px solid #112d4e;}
.cont .cont_05 .cir_03{ border:5px solid #a49a9a;}

.cont .cont_05 .cir_ing{border:5px solid #112d4e;}

.cont_05 button.cir_btn {margin-top:20px; width:214px; height:52px;line-height:50px; background: #e71c39;color: #fff; font-weight:bold; font-size:22px; text-align: center;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;}


.priority{font-size:12px;font-weight: 500; display: inline-block; width:16px; height:14px; text-align: center; line-height: 10px; color:#fff; background: #333;border-radius: 3px;}