@charset "utf-8";

/* dashboard 전체 */

/* dashboard_wrap */
.dashboard_wrap .dashboard_list{padding-left:31px; box-sizing: border-box; margin-bottom:50px;}
.dashboard_wrap .dashboard_inner{height:100%;}
.dashboard_wrap h5{font-size:17px; font-size:1.7rem; line-height:23px; line-height:2.3rem; letter-spacing: -0.045em; color:#1e1e2d; font-weight:500;}
.dashboard_wrap .h_desc5{font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; letter-spacing: -0.02em; color:#616dab; font-weight:400;}
.box_style_0_con .dashboard_contents_inner{text-align: center;}

/* traffic 트래픽 현황 */
.box_style_0_con .traffic_chart{}
.box_style_0_con .traffic_info_con{font-size:0; line-height:0; display:inline-block;}
.box_style_0_con .traffic_info_list{display:block; vertical-align:middle; position: relative; width:100%; box-sizing: border-box; text-align: left; overflow: hidden;}
.box_style_0_con .traffic_info_list:after{content:""; position: absolute; top:6px; right:0; border-right:1px solid #dde5ff; height:18px; display:none;}
.box_style_0_con .traffic_info_list:first-child{padding-left:0;}
.box_style_0_con .traffic_info_list:last-child{padding-right:0;}
.box_style_0_con .traffic_info_list:last-child:after{display:none;}
.box_style_0_con .traffic_title{min-width: 70px; font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.045em; color:#1e1e2d; font-weight:400;
    display:inline-block; vertical-align: middle; margin-top: 6px; margin-right:13px; float:left;}
.box_style_0_con .traffic_data{font-size:25px; font-size:2.5rem; line-height:31px; line-height:3.1rem; letter-spacing: 0; color:#eb55c9; font-weight:500;
    display:inline-block; vertical-align: middle; float:right;}
.box_style_0_con .traffic_data.type_2{color:#6d13ff;}

/* info_list_con 기본 설정 */
.box_style_0_con .info_list_style_con{width:calc(100% + 31px); margin-left:-31px; overflow: hidden;}
.box_style_0_con .info_list_style_con.type_2{}
.box_style_0_con .info_list_style_con.type_2 .info_list{width:50%;}
.box_style_0_con .info_list_style_con.type_2 .info_list:nth-child(3n+1):after{display:block;}
.box_style_0_con .info_list_style_con.type_2 .info_list:nth-child(2n+1):after{display:none;}
.box_style_0_con .info_list{float:left; width:33.33%; padding-left:31px; box-sizing: border-box; position: relative; text-align: left;}
.box_style_0_con .info_list.complete .info_desc{color:#6d13ff;}
.box_style_0_con .info_list:after{content:""; position: absolute; top:4px; left:0; height:calc(100% - 10px); border-right:1px solid #dde5ff;}
.box_style_0_con .info_list:first-child:after{display:none;}
.box_style_0_con .info_list:nth-child(3n+1):after{display:none;}
.box_style_0_con .info_title{font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; letter-spacing: -0.02em; color:#1e1e2d; font-weight:400; margin-bottom:11px;}
.box_style_0_con .info_title.margin_helve{margin-bottom: 15px;}
.box_style_0_con .info_desc{font-family: 'Roboto', 'Noto Sans KR'; font-size:17px; font-size:1.7rem; line-height:23px; line-height:2.3rem; letter-spacing: -0.045em; color:#a3acd6; font-weight:500;}
.box_style_0_con .info_desc.font_roboto{letter-spacing: 0;}
.traffic_log .btn_style_1_con{left:0; width:100%;}
.box_style_0_con.site_info .btn_style_1_con{left:0; width:100%;}

/* domain_setting_con 도메인 설정 */
.box_style_0_con .domain_setting_title_con{font-size:0; line-height:0; margin-bottom:68px;}
.box_style_0_con .domain_name{font-size:19px; font-size:1.9rem; line-height:27px; line-height:2.7rem; letter-spacing: 0; color:#6d13ff; font-weight:500;
    display:inline-block; vertical-align: middle; background-image: url('../img/domain_icon.png'); background-repeat: no-repeat; background-position: left top; padding-left:39px; margin-right:12px; margin-left:12px; margin-top:6px; margin-bottom:5px;}
.box_style_0_con .domain_setting_title_con .btn_style_1_con{display:inline-block; vertical-align: middle; margin-right:12px; margin-left:12px; margin-top:5px; margin-bottom:5px;}

/* contents_style_0_wrap 방문자 통계 */
.box_style_0_con .contents_style_0_wrap{font-size:0; line-height:0;}
.box_style_0_con.visit_log  .box_style_0_contents_con{margin-top:-1px;}
.contents_style_0_wrap .contents_style_0_con{overflow: hidden; margin-bottom:67px;}
.contents_style_0_wrap .contents_style_0_list{width:33.3%; float:left; box-sizing: border-box; border-top:3px solid transparent; padding-top:20px; position: relative; transition:all .2s;}
.contents_style_0_wrap.type_2 .contents_style_0_con{display:inline-block;}
.contents_style_0_wrap.type_2 .contents_style_0_list{width:auto; border-top:none; padding-top:0; padding-right:30px; padding-left:30px;}
.contents_style_0_wrap.type_2 .contents_style_0_list:before{display:block;}
.contents_style_0_wrap.type_2 .contents_style_0_list:after{display:none;}
.contents_style_0_wrap .contents_style_0_list:before{content:""; position: absolute; top:0; right:0; height:calc(100% - 2px); border-right:1px solid #edf1ff; display:none; transition:all .2s;}
.contents_style_0_wrap .contents_style_0_list:after{content:""; position: absolute; top:-3px; left:0; width:100%; border-bottom:1px solid #edf1ff;}
.contents_style_0_wrap .contents_style_0_list:hover{border-top-color:#6d13ff;}
.contents_style_0_wrap .contents_style_0_list:hover:before{display:block;}
.contents_style_0_wrap .contents_style_0_list:hover:after{border-bottom:none; border-left:1px solid #edf1ff; top:0; width:auto; left:-1px; height:calc(100% - 2px);}
.contents_style_0_wrap .contents_style_0_list.active{border-top-color:#6d13ff;}
.contents_style_0_wrap .contents_style_0_list.active:before{display:block;}
.contents_style_0_wrap .contents_style_0_list.active:after{border-bottom:none; border-left:1px solid #edf1ff; top:0; width:auto; left:-1px; height:calc(100% - 2px);}
.contents_style_0_wrap .contents_style_0_list:last-child:before{display:none !important;}
.contents_style_0_wrap .contents_style_0_title{font-size:12px; font-size:1.2rem; line-height:18px; line-height:1.8rem; letter-spacing: -0.02em; color:#a3acd6; font-weight:400;
    margin-bottom:9px; transition:all .2s;}
.contents_style_0_wrap.type_2 .contents_style_0_title{color:#1e1e2d;}
.contents_style_0_wrap .contents_style_0_list:hover .contents_style_0_title{color:#6d13ff;}
.contents_style_0_wrap.type_2 .contents_style_0_list:hover .contents_style_0_title{color:#1e1e2d;}
.contents_style_0_wrap .contents_style_0_list.active .contents_style_0_title{color:#6d13ff;}
.contents_style_0_wrap .contents_style_0_list:hover .contents_style_0_cnt{color:#6d13ff;}
.contents_style_0_wrap.type_2 .contents_style_0_list:hover .contents_style_0_cnt{color:#1e1e2d;}
.contents_style_0_wrap .contents_style_0_list.active .contents_style_0_cnt{color:#6d13ff;}
.contents_style_0_wrap .contents_style_0_cnt{font-size:20px; font-size:2.0rem; line-height:20px; line-height:2.0rem; color:#a3acd6; font-weight:500;}
.contents_style_0_wrap.type_2 .contents_style_0_cnt{color:#1e1e2d;}
.contents_style_0_wrap .contents_style_0_percent{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; color:#a3acd6; font-weight:500;
    padding-left:15px; background-repeat: no-repeat; background-position: left top 3px; display:inline-block; vertical-align: middle; margin-top:7px; transition:all .2s;}
.contents_style_0_wrap .contents_style_0_list:hover .contents_style_0_percent{color:#6d97f2;}
.contents_style_0_wrap .contents_style_0_list:hover .contents_style_0_percent.up{background-image: url('../img/contents_style_0_up_h.png');}
.contents_style_0_wrap .contents_style_0_list:hover .contents_style_0_percent.down{background-image: url('../img/contents_style_0_down_h.png');}
.contents_style_0_wrap.type_2 .contents_style_0_list:hover .contents_style_0_percent{color:#6d97f2;}
.contents_style_0_wrap.type_2 .contents_style_0_list:hover .contents_style_0_percent.up{background-image: url('../img/contents_style_0_up_2.png');}
.contents_style_0_wrap.type_2 .contents_style_0_list:hover .contents_style_0_percent.down{background-image: url('../img/contents_style_0_down_2.png');}
.contents_style_0_wrap .contents_style_0_list.active .contents_style_0_percent{color:#6d97f2;}
.contents_style_0_wrap .contents_style_0_percent.up{background-image: url('../img/contents_style_0_up.png');}
.contents_style_0_wrap.type_2 .contents_style_0_percent.up{background-image: url('../img/contents_style_0_up_2.png'); color:#6d97f2;}
.contents_style_0_wrap .contents_style_0_list.active .contents_style_0_percent.up{background-image: url('../img/contents_style_0_up_h.png');}
.contents_style_0_wrap .contents_style_0_percent.down{background-image: url('../img/contents_style_0_down.png');}
.contents_style_0_wrap.type_2 .contents_style_0_percent.down{background-image: url('../img/contents_style_0_down_2.png'); color:#ee5e5e;}
.contents_style_0_wrap .contents_style_0_list.active .contents_style_0_percent.down{background-image: url('../img/contents_style_0_down_h.png');}
.contents_style_0_wrap .contents_style_0_small_text{font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; letter-spacing: -0.02em; font-weight:400; font-family:"Noto Sans KR";}
.box_style_0_con .visit_log_contents_con{margin-bottom:61px; padding-right:44px; padding-left:44px;}

/* recent_news_list_con 최근 소식*/
.recent_news_list_con{height:100%;}
.recent_news_list_con .recent_news_list{border-bottom:1px solid #edf1ff; width:100%; height:25%; box-sizing: border-box; padding-left:45px; padding-right:45px; overflow: hidden; text-align: left; display:table;
    padding-top:33px; padding-bottom:31px;}
.recent_news_list_con .recent_news_inner{display:table-cell; vertical-align: middle;}
.recent_news_list_con .recent_news_list:last-child{border-bottom:none;}
.recent_news_list_con .recent_news_list:hover .recent_news_title{color:#6d13ff;}
.recent_news_list_con .recent_news_list_title{float:left; width:113px; font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; letter-spacing: -0.02em; color:#1e1e2d; font-weight:400; margin-top: 2px;}
.recent_news_list_con .recent_news_text_box{width:calc(100% - 133px); float:left;}
.recent_news_list_con .recent_news_title{font-size:17px; font-size:1.7rem; line-height:23px; line-height:2.3rem; letter-spacing: -0.045em; color:#616dab; font-weight:500; margin-bottom:13px; transition:all .2s;}
.recent_news_list_con .recent_news_desc{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.02em; color:#a3acd6; font-weight:400; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; margin-bottom:12px;}
.recent_news_list_con .recent_news_desc br{display:none;}
.recent_news_list_con .recent_news_date{font-size:13px; font-size:1.3rem; line-height:19px; line-height:1.9rem; letter-spacing: 0; color:#a3acd6; font-weight:500;}
.recent_news_list_con .recent_news .dashboard_contents_inner{height:100%;}


.agent_log_wrap .point_0{color:#6acb59 !important;}
.agent_log_wrap .point_1{color:#6af0d9 !important;}
.agent_log_wrap .point_2{color:#2732fa !important;}
.agent_log_wrap .point_3{color:#969cfc !important;}
.agent_log_wrap .bg_point_0{background-color:#6acb59; !important;}
.agent_log_wrap .bg_point_1{background-color:#6af0d9; !important;}
.agent_log_wrap .bg_point_2{background-color:#2732fa; !important;}
.agent_log_wrap .bg_point_3{background-color:#969cfc; !important;}

.agent_log_wrap .participation_rate_wrap .participation_rate_con{width: 220px; height: 220px;}
.agent_log_wrap .participation_rate_con .circle{width: 170px; height: 170px; top: 20px; left: 20px;}
.agent_log_wrap .participation_rate_con .title{font-size:22px; font-size:2.2rem; line-height:28px; line-height:2.8rem; letter-spacing: -0.025em; /*font-weight: 300;*/ font-weight: 400;}
.agent_log_wrap .participation_rate_con .rate{font-size:100px; font-size:10.0rem; line-height:106px; line-height:10.6rem; letter-spacing: 0.0em; font-weight: 300;}
/*
 make each pie piece a rectangle twice as high as it is wide.
 move the transform origin to the middle of the left side.
 Also ensure that overflow is set to hidden.
*/
.pie_wrap{position: absolute; top:0; left:-52.5px;}
.pie {
    position:absolute;
    width:105px;
    height:210px;
    overflow:hidden;
    left:157.5px;
    -moz-transform-origin:left center;
    -ms-transform-origin:left center;
    -o-transform-origin:left center;
    -webkit-transform-origin:left center;
    transform-origin:left center;
}
/*
  unless the piece represents more than 50% of the whole chart.
  then make it a square, and ensure the transform origin is
  back in the center.

  NOTE: since this is only ever a single piece, you could
  move this to a piece specific rule and remove the extra class
*/
.pie.big {
    width:210px;
    height:210px;
    left:52.5px;
    -moz-transform-origin:center center;
    -ms-transform-origin:center center;
    -o-transform-origin:center center;
    -webkit-transform-origin:center center;
    transform-origin:center center;
}
/*
  this is the actual visible part of the pie.
  Give it the same dimensions as the regular piece.
  Use border radius make it a half circle.
  move transform origin to the middle of the right side.
  Push it out to the left of the containing box.
*/
.pie:before {
    content:"";
    position:absolute;
    width:105px;
    height:210px;
    left:-105px;
    border-radius:105px 0 0 105px;
    -moz-transform-origin:right center;
    -ms-transform-origin:right center;
    -o-transform-origin:right center;
    -webkit-transform-origin:right center;
    transform-origin:right center;

}
/* if it's part of a big piece, bring it back into the square */
.pie.big:before {
    left:0px;
}
/*
  big pieces will also need a second semicircle, pointed in the
  opposite direction to hide the first part behind.
*/
.pie.big:after {
    content:"";
    position:absolute;
    width:105px;
    height:210px;
    left:105px;
    border-radius:0 105px 105px 0;
}
/*
  add colour to each piece.
*/
/* mobile */
.pie:nth-of-type(1):after,
.pie:nth-of-type(1):before {
    background-color:#6af0d9;
}
/* pc */
.pie:nth-of-type(2):before,
.pie:nth-of-type(2):after {
    background-color:#2732fa;
}
.pie:nth-of-type(3):after,
.pie:nth-of-type(3):before {
    background-color:#969cfc;
}


@media all and (min-width:992px){
    .box_style_0_con .recent_news_list{padding-top:0; padding-bottom:0;}

    .contents_style_0_wrap .contents_style_0_list{padding-top:31px;}
    .contents_style_0_wrap .contents_style_0_title{font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; margin-bottom:13px;}
    .contents_style_0_wrap .contents_style_0_cnt{font-size:25px; font-size:2.5rem; line-height:25px; line-height:2.5rem;}
    .contents_style_0_wrap.type_2 .contents_style_0_list{padding-right:50px; padding-left:50px;}
}

@media all and (min-width:1200px){
    .box_style_0_con .traffic_info_con{display:block;}
    .box_style_0_con .traffic_info_list{display:inline-block; padding-left:25px; padding-right:26px; width:50%;}
    .box_style_0_con .traffic_info_list:after{display:block;}
    .box_style_0_con .traffic_info_list:first-child{text-align: right;}
    .box_style_0_con .traffic_info_list:last-child{text-align: left;}
    .box_style_0_con .traffic_title{float:none; min-width: auto; margin-top: 0;}
    .box_style_0_con .traffic_data{float:none;}
}

@media all and (min-width:1600px){
    .traffic_log .dashboard_contents_inner{padding-bottom:60px;}
    .traffic_log .btn_style_1_con{position: absolute; bottom:30px;}
    .box_style_0_con.site_info .btn_style_1_con{position: absolute; bottom:0px;}
}