@charset "utf-8";

@media screen and (max-width: 1200px) {

    /* login */
    #login {height: calc(100vh - 35px)}
    #login .wrap {width: 90%; margin: 0 auto; padding: 25px 20px}
    #login .wrap .head {padding-bottom: 10px}
    #login .wrap .head img {height: 28px}
    #login .wrap .head h2 {margin-top: 5px; font-size: 15px; line-height: 22px}
    #login .wrap form fieldset {padding-bottom: 35px}

    #login-footer {bottom: 0; line-height: 35px; background: #f9fbfd}
    #login-footer span {font-size: 11px}
    #login .wrap form .inp {height: 42px; line-height: 40px; font-size: 14px}
    #login .wrap form .txt {margin-bottom: 5px}
    #login .wrap form .pas {margin-bottom: 15px}
    #login .wrap form .chk label {font-size: 13px; line-height: 18px}
    #login .wrap form button {height: 40px; line-height: 40px; font-size: 14px}
    #login .wrap form .find {font-size: 13px; line-height: 18px}
    #login .wrap .links {margin-top: 20px}
    #login .wrap .links .box {padding: 15px 20px}
    #login .wrap .links .box:nth-child(odd) {margin-bottom: 10px}
    #login .wrap .links .box dl {background-size: 22px; background-position: right top;}
    #login .wrap .links .box dt {font-size: 14px; line-height: 20px}
    #login .wrap .links .box dd {font-size: 12px; line-height: 18px}
    #login .wrap .links .box dd span {margin-right: 10px}

    /* 기존로그인
    #login{width: auto;margin: 50px auto 0 auto;box-sizing: border-box;padding: 0 20px;}
    #login .head{margin-bottom: 20px;}
    #login .head h1{font-size: 30px;}
    #login .head h2{font-size: 14px;}
    #login fieldset .chk label{font-size: 14px;}

    #login .adminForgotForm{margin-top: 20px;}
    #login .adminForgotForm a{font-size: 14px;}

    #login .btm_links{margin-top: 30px;}
    #login .btm_links li a{padding-left: 0;}
    #login .btm_links li a em{display: none;}
    #login .btm_links li a em i{display: none;}
    #login .btm_links li a p{font-size: 14px;}

    #login-footer ul li{dmargin: 5px;font-size: 13px;}
    #login-footer .copyright{font-size: 11px;} */

    /* layout */
    #header{height: 50px;z-index: 90;position: fixed;right: 0;left: 0;width: 100%;}
    #header > *{float: none;}
    #header .logo{display: none;}
    #header .inner{width: 100%;margin: 0 20px;}
    #header .users{line-height: 50px;z-index: 91;}
    #header .users .name i{font-size: 14px;margin-top: -2px;}

    #header .users .alarm{position: static;margin-left: 10px;}
    #header .users .alarm > button{font-size: 14px;}
    #header .users .alarm.has-new > button:after{right: -4px;}
    #header .users .alarm .feedbox{top: 40px;left: -10px;width: calc(100vw - 20px);height: calc(100vh - 60px);box-sizing: border-box;}
    #header .users .alarm .feedbox h5{font-size: 13px;line-height: 50px;padding: 0 15px;}
    #header .users .alarm .feedbox .btns{top: 10px;right: 15px;}
    #header .users .alarm .feedbox .box{padding: 10px 15px;}
    #header .users .alarm .feedbox ul li{line-height: 24px;}
    #header .users .alarm .feedbox ul li p,
    #header .users .alarm .feedbox ul li strong{font-size: 13px;}
    #header .users .alarm .feedbox ul li span{font-size: 11px;}
    #header .users .alarm .feedbox > em{line-height: 40px;}
    #header .users .alarm > span {bottom: 25px;right: -12px;}

    #header .utl_menu{display: none;}

    #footer-mobile{display: block;text-align: center;font-size: 11px;letter-spacing: -1px;color: #999;padding: 30px 0;background: #f2f3f3;}

    #bodyWrap{display: block;padding-top: 50px;}
    #bodyWrap > *{min-height: 700px;}

    #navigator{display: none;}
    .navigator_wrap_mobile{display: block;position: fixed;top: 0;right: 0;padding-top: 50px;box-sizing: border-box;max-height: 100vh;overflow-y: auto;width: 100%;}
    .navigator_wrap_mobile button{position: absolute;top: 0;right: 0; border: none;width: 50px;height: 50px;background: none;text-align: center;text-indent: -999em;}
    .navigator_wrap_mobile button:after{text-indent: 0;position: absolute;top: 0;left: 0;width: 100%;line-height: 50px;text-align: center;font-size: 18px;color: #fff;font-family: axicon;content: '\e120'}
    .navigator_wrap_mobile.on{background: #3e4957;}
    .navigator_wrap_mobile.on button:after{content: '\f1b5';}
    .navigator_wrap_mobile.on #gnb-mo{display: block;background: #283444;}

    #gnb-mo{width: 100%;background: #1360e7;height: calc(100vh - 50px);overflow-y: auto;box-sizing: border-box;padding: 25px 10px;display: none;}
    #gnb-mo > li{position: relative;}
    #gnb-mo > li:before{content: '';display: block;position: absolute;top: 0;left: 0;width: 0;height: 100%;background: #206ffa;}
    #gnb-mo > li > a{display: block;text-decoration: none;font-size: 14px;line-height: 30px;color: #fff;padding-left: 40px;position: relative;font-weight: bold;}
    #gnb-mo > li > a > i{position: absolute;top: 0;left: 20px;line-height: 30px;}
    #gnb-mo > li > a > i.axi-ion-chevron-down{font-size: 11px !important;opacity: 0.6;}
    #gnb-mo > li > a > em{font-style: normal;display: inline-block;vertical-align: middle;margin-left: 5px;margin-top: -3px;width: 18px;height: 18px;line-height: 18px;text-align: center;border-radius: 50%;background: #206ffa;font-size: 10px;color: #fff;font-weight: bold;letter-spacing: -1px;}
    #gnb-mo > li > ul{padding-left: 40px;display: none;}
    #gnb-mo > li > ul li a{font-size: 14px;line-height: 24px;text-decoration: none;color: #fff;}
    #gnb-mo > li.on{background: rgba(0,0,0,0.1);padding: 15px 0;margin: 10px 0;}
    #gnb-mo > li.on > a{color: #206ffa !important;}
    #gnb-mo > li.on > a > i{transform: rotate(180deg);opacity: 1;}
    #gnb-mo > li.on > ul{display: block;}
    #gnb-mo > li > ul > li.on > a{color: #206ffa !important;}
    #gnb-mo > li.dsbd{padding: 0;margin: 0;}
    #gnb-mo > li.dsbd > a > i{transform: rotate(0);}
    #gnb-mo > li.on.dsbd{padding: 0;background: none;}
    #gnb-mo > li.on.dsbd:before{display: none;}

    #article{width: 100%;min-height: 0;}
    #content{padding: 20px;}

    .sub_title{line-height: 50px;padding: 0 20px;}
    .sub_title h2{font-size: 14px;}
    .sub_title .locations{right: 20px;}
    .sub_title .locations li{margin-left: 20px;font-size: 12px;letter-spacing: -1px;}
    .sub_title .locations li a{font-size: 12px;}
    .sub_title .locations li:before{left: -12px;margin-top: -1px;}
    .sub_title .locations li:first-child:before{display: none;}

    /* inputs */
    input[type=radio] + label {font-size: 13px;margin: 2px 0;}
    input[type=file]{width: 100%;}
    input[type=checkbox] + label {font-size: 13px;margin: 2px 0;}

    /* utility */
    #article .utl_menu_mo{display: block;margin: -2px;padding: 20px;padding-bottom: 10px;line-height: 25px;}
    #article .utl_menu_mo li{display: inline-block;vertical-align: top;margin: 2px;}
    #article .utl_menu_mo li a{text-decoration: none;border: 1px solid #206ffa;border-radius: 2px;padding: 0 20px;font-size: 13px;letter-spacing: -1px;background: #206ffa;color: #fff;line-height: 25px;display: block;}
    #article .utl_menu_mo li.sign a{border-color: #999;color: #333;background: #fff;}

    /* dashboard */
    #dashboard{display: block;}
    #dashboard .lef{width: auto;margin: -20px -20px 0 -20px;}
    #dashboard .lef .box{padding: 20px;padding-top: 65px;margin: 10px 0;float: none;}
    #dashboard .lef .box .tit{line-height: 45px;padding: 0 20px;}
    #dashboard .lef .box .tit h4{font-size: 14px;}
    #dashboard .lef .box .tit .more{right: 20px;}
    #dashboard .lef .box .latest_list li{padding-right: 70px;}
    #dashboard .lef .box .latest_list li .sbj{line-height: 30px;}
    #dashboard .lef .box .latest_list li .ico_new{margin-top: -1px;width: 14px;height: 14px;line-height: 14px;}
    #dashboard .lef .box .latest_list li .ico_qna{width: 55px;line-height: 22px;}
    #dashboard .lef .box .latest_list li .date{line-height: 30px;font-size: 12px;}

    #dashboard .lef .box.total_count_box{height: auto;width: auto;line-height: auto;}
    #dashboard .lef .box.total_count_box .count li{font-size: 13px;line-height: 13px;width: auto;padding: 0 16px;}
    #dashboard .lef .box.total_count_box .count li:before{left: 0;}
    #dashboard .lef .box.total_count_box .count li strong{font-size: 26px;line-height: 26px;}

    #dashboard .lef .box.gateway_buttons{width: auto;min-height: 0;}
    #dashboard .lef .box.gateway_buttons > ul{margin: -2px;}
    #dashboard .lef .box.gateway_buttons > ul li{margin: 2px;width: calc(33.33% - 4px);padding: 0 12px;}
    #dashboard .lef .box.gateway_buttons > ul li p{font-size: 13px;letter-spacing: -1px;}

    #dashboard .lef .box.visit_result{width: auto;height: auto;}
    #dashboard .lef .box.visit_result .tit .tab{margin-left: 15px;}
    #dashboard .lef .box.visit_result .tit .tab li a{width: 45px;font-size: 13px;}
    #dashboard .lef .box.visit_result .site_cat{margin-bottom: 15px;}
    #dashboard .lef .box.visit_result .site_cat li{margin-right: 8px;}
    #dashboard .lef .box.visit_result .site_cat li p{font-size: 13px;letter-spacing: -1px;}
    
    #dashboard .lef .box.visit_result .graph.h200{height: 200px;}
    #dashboard .lef .box.visit_result dl{display: block;}
    #dashboard .lef .box.visit_result dl > *{width: auto;}
    #dashboard .lef .box.visit_result dl dt{display: none;}
    #dashboard .lef .box.visit_result dl dd{padding-left: 0;width: 100%;}
    #dashboard .lef .box.visit_result dl dd .hd p strong{font-size: 24px;line-height: 24px;}
    #dashboard .lef .box.visit_result dl dd .hd em{display: none;}
    #dashboard .lef .box.visit_result dl dd ul li{line-height: 35px;}

    #dashboard .lef .box.inquiry_status{width: auto;height: auto;}

    #dashboard .lef .box.latest_boards{width: auto;height: auto;}
    #dashboard .lef .box.latest_boards .tit{padding: 0 20px;}
    #dashboard .lef .box.latest_boards .tit .slick-prev{width: 20px;height: 45px;left: -40px;}
    #dashboard .lef .box.latest_boards .tit .slick-prev:after{line-height: 45px;}
    #dashboard .lef .box.latest_boards .tit .slick-next{width: 20px;height: 45px;right: -40px;}
    #dashboard .lef .box.latest_boards .tit .slick-next:after{line-height: 45px;}
    #dashboard .lef .box.latest_boards .board_roll .item{margin-right: 20px;}
    #dashboard .lef .box.latest_boards .board_roll .item a{font-size: 14px;}

    #dashboard .rig{width: auto;margin: 0 -20px 0 -20px;}
    #dashboard .rig .my_infobox{height: auto;padding-bottom: 30px;text-align: center;}
    #dashboard .rig .my_infobox .head{padding: 30px 0;}
    #dashboard .rig .my_infobox .head .logo{width: 50px;height: 50px;}
    #dashboard .rig .my_infobox .head .name{margin-top: 10px;}
    #dashboard .rig .my_infobox .head .name strong{font-size: 15px;}
    #dashboard .rig .my_infobox .info{padding: 15px 20px 10px 20px;display: inline-block;}
    #dashboard .rig .my_infobox .info.no-data{width: 100%;box-sizing: border-box;}
    #dashboard .rig .my_infobox .info li{margin: 5px 0;padding-left: 80px;text-align: left;}
    #dashboard .rig .my_infobox .more{margin-top: 5px;}

    #dashboard .rig .webper_box{height: auto;margin: 10px 20px;font-family: empty;font-size: 0;}
    #dashboard .rig .webper_box iframe{width: 100%;height: calc(100vw / 2.55);}
    #dashboard .rig .webper_box.box1{border: none;}

    #dashboard .rig .go_guide_link{padding: 20px;margin-top: 0;margin-bottom: 20px;}
    #dashboard .rig .go_guide_link .slt{height: 45px;margin-top: -1px;}
    #dashboard .rig .go_guide_link .slt > li > a{padding: 0 15px;font-size: 14px;line-height: 45px;}
    #dashboard .rig .go_guide_link .slt > li > a:after{right: 15px;line-height: 45px;}
    #dashboard .rig .go_guide_link .slt > li > ul{top: 45px;min-width: 0;padding: 20px;max-height: 200px;}

    /* sms 발송 화면 */
    #sendbox{display: block;}
    #sendbox > *{padding: 20px 15px;}
    #sendbox .lef{width: auto;margin-bottom: 20px;border-radius: 5px;}
    #sendbox .lef .send_phone{white-space: normal;}
    #sendbox .cen{width: auto;border-radius: 5px;}
    #sendbox .cen .sub-tab{display: block;}
    #sendbox .cen .sub-tab li{width: 50%;}
    #sendbox .cen .sub-tab li a{font-size: 14px;}
    #sendbox .cen fieldset{max-height: 200px;}
    #sendbox .rig{display: none;}

    #sendbox #bookpopup{left: 20px;transform: translate(0, -50%);width: calc(100vw - 40px) !important;height: auto !important;padding-top: 51px;}
    #sendbox #bookpopup .pop-tit{height: 50px;padding: 0 20px;}
    #sendbox #bookpopup .pop-tit h3{font-size: 14px;line-height: 50px;}
    #sendbox #bookpopup .pop-tit .close{width: 48px;height: 48px;line-height: 48px;}
    #sendbox #bookpopup .pop-wrap{padding: 20px;}
    #sendbox #bookpopup table.pop_table tr > *{padding: 10px 5px;}
    #sendbox #bookpopup table.pop_table colgroup{display: none;}

    #sendbox #bookpopup1{left: 20px;transform: translate(0, -50%);width: calc(100vw - 40px) !important;height: auto !important;padding-top: 51px;}
    #sendbox #bookpopup1 .pop-tit{height: 50px;padding: 0 20px;}
    #sendbox #bookpopup1 .pop-tit h3{font-size: 14px;line-height: 50px;}
    #sendbox #bookpopup1 .pop-tit .close{width: 48px;height: 48px;line-height: 48px;}
    #sendbox #bookpopup1 .pop-wrap{padding: 20px;}
    #sendbox #bookpopup1 table.pop_table tr > *{padding: 10px 5px;}
    #sendbox #bookpopup1 table.pop_table colgroup{display: none;}

    #sendbox.kakaoSendbox .lef{width: 100%;margin-bottom: 5px;}
    #sendbox.kakaoSendbox .rig{width: 100%;margin-left: 0;display: block !important;border-radius: 5px;}
    #sendbox.kakaoSendbox .rig .btn-wrap{margin: 0 0 15px 0 !important;}
    #sendbox.kakaoSendbox .rig .btn-wrap p{margin-top: 10px;font-size: 14px;letter-spacing: -1px;color: #666;}
    #sendbox.kakaoSendbox .rig .table-wrap{overflow-x: auto;}
    #sendbox.kakaoSendbox .rig .table-wrap > table td{min-width: 120px;}

    /* subpage */
    #page_notice{padding-left: 15px;font-size: 12px;}
    #page_notice:before{font-size: 12px;margin-top: -1px;}

    #search{padding: 10px;margin: 0 -10px 15px -10px;}
    #search h4{font-size: 14px;}
    #search fieldset{margin: 4px 0;margin-right: 0;display: block;}
    #search fieldset > *{margin: 2px 0;}
    #search hr{display: block;}
    #search input[type=text]{width: 100%;}
    #search input[type=text].keyword{width: 100%;}
    #search input[type=text].keyword.w300{width: 100%;}
    #search fieldset.fd_date{margin: 0 -1px;}
    #search fieldset.fd_date input[datepicker]{width: calc(50% - 2px);margin: 0 1px;}
    #search fieldset.fd_date.date_len1 input[datepicker]{width: calc(100% - 2px);}
    #search fieldset.fd_date button{margin: 0 1px;padding: 0;min-width: 0;font-size: 12px;}
    #search fieldset.fd_date.len6 button{width: calc(16.66% - 2px) !important;}
    #search fieldset.fd_date.len7 button{width: calc(14.28% - 2px) !important;}
    #search fieldset.fd_date.statics button{margin-bottom: 2px;}
    #search fieldset.fd_date.statics button + hr{display: none;}
    #search fieldset.fd_sbm button{width: 100%;}
    #search fieldset.fd_keyword{margin: 0 -1px;margin-top: 4px;}
    #search fieldset.fd_keyword > *{width: calc(50% - 2px) !important;margin: 0 1px 2px 1px;}
    #search fieldset.fd_keyword > button[type=submit]{width: calc(100% - 2px) !important;margin-top: 5px;}
    #search fieldset.fd_setsearch > *{width: 100%;}

    .article_wrap{padding: 0;margin: 10px -20px;border-width: 1px 0 1px 0;}
    .article_wrap.webper_iframe_wrap{padding: 20px;}
    .table_list_wrap{margin: 0;padding-bottom: 40px;overflow-x: auto;}
    .table_list_wrap > table{min-width: 100%;}
    .table_list_wrap > table tr > *{white-space: nowrap;}
    .table_write_wrap{margin: 0;padding-bottom: 40px;}
    .table tr > *{padding: 15px 5px;}
    .table thead th{height: 50px;padding: 0 10px;font-weight: bold;font-size: 12px;}
    .table thead th.tal{padding-left: 10px;}
    .table thead th:before{height: 10px;}
    .table tbody td{padding: 10px;font-size: 13px;}
    .table tbody td.tal{padding-left: 10px !important;}
    .table tbody td a{font-size: 13px;}
    .table select{max-width: calc(100vw - 140px) !important;}
    .table .w33p{width: 30%;min-width: 80px;}
    .table .w50p{width: 45%;min-width: 80px;}
    .table .w100p{width: 100%;min-width: 80px;}
    .table.write thead th{display: none;}
    .table.write tbody th{width: 65px !important;font-size: 13px;padding-right: 0 !important;word-break: break-all;}
    .table.write tbody th button{display: block;margin: 5px 0 0 0 !important;}
    .table.write tbody tr > *{padding: 10px 20px;}
    .table.write tbody td input[type=file] + a{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: calc(100% - 100px);display: inline-block;}
    .inner_table_wrap{overflow-x: auto;max-width: calc(100vw - 135px);}
    .inner_table{min-width: 100%;width: auto;}
    .inner_table tr > *{padding: 10px 10px !important;white-space: nowrap;}
    .table.write .inner_table tbody tr th{width: 70px !important;padding-right: 10px !important;}
    .tbltxt{font-size: 12px;word-break: break-all !important;}
    .tbltxt:before{top: 6px;}
    .tbltxt strong{font-size: 12px;}

    .btn1, .btn2, .btn3, .btn4{min-width: 70px;}
    .exel_download{padding: 0 15px;}

    .article-wait {font-size: 14px;padding: 15px 10px;}
    .article-wait em {font-size: 12px;}

    .static_list{margin: 0 -10px;}
    .static_list li{margin: 2px;width: calc(50% - 4px);min-height: auto;padding: 15px 20px;}
    .static_list li .tit h5{font-size: 13px;}
    .static_list li .tit h5 img{width: auto;height: 10px;}
    .static_list li .cont .count strong{font-size: 18px;line-height: 18px;}
    .static_list li .cont .up_and_down{bottom: auto;top: 50%;transform: translate(0, -50%);}
    .static_list li .cont .up_and_down strong{margin-left: 0;display: block;}
    .static_list li .detail_btns .btns{position: static;}
    .static_list li .detail_btns2{position: static;margin-top: 10px;}

    .static_graph{margin: 0 -10px;}
    .static_graph .box{padding: 15px;padding-top: 65px;margin: 2px;width: calc(100% - 4px) !important;float: none;}
    .static_graph .box.width-full{width: calc(100% - 4px) !important;}
    .static_graph .box .tit{line-height: 50px;padding: 0 20px;}
    .static_graph .box .tit h4{font-size: 13px;color: #333;}
    .static_graph .box.visit_result{width: calc(50% - 20px);height: auto;margin-top: 4px;}
    .static_graph .box.visit_result .site_cat{margin-bottom: 15px;}
    .static_graph .box.visit_result .site_cat li{margin-right: 8px;}
    .static_graph .box.visit_result .site_cat li p{font-size: 13px;}
    .static_graph .box.visit_result dl{display: block;}
    .static_graph .box.visit_result dl > *{width: 100%;}
    .static_graph .box.visit_result dl dt{padding-right: 0;padding-top: 0;margin-bottom: 15px;}
    .static_graph .box.visit_result dl dd{padding-left: 0;overflow: none;}
    .static_graph .box.visit_result dl dd .hd p strong{font-size: 20px;line-height: 20px;}
    .static_graph .box.visit_result dl dd ul li strong{font-size: 14px;}

    .paging a{width: 25px;font-size: 11px;}
    .paging a:first-child{border-radius: 5px 0 0 5px !important;}
    .paging a:after{position: absolute;top: 0;left: 0;width: 100%;height: 100%;line-height: 35px;text-align: center;font-size: 15px;text-indent: 0;}
    .paging a:last-child{border-radius: 0 5px 5px 0 !important;}
    .paging a.active{background: #ffffff;color: #333333 !important;font-weight: 600;}
    .paging a.first,
    .paging a.prev,
    .paging a.next,
    .paging a.last{background: none;font-size: 15px;color: #666666 !important;text-indent: -999em;}
    .paging a.first:after{content: '\f100';text-indent: 0;}
    .paging a.prev:after{content: '\f104';}
    .paging a.next:after{content: '\f105';}
    .paging a.last:after{content: '\f101';}

    .hd_btn_wrap{margin: 0 -10px 5px -10px;}

    .noticebox{padding-left: 60px;margin-bottom: 10px;}
    .noticebox:before{left: 20px;font-size: 25px;}
    .noticebox li{font-size: 12px;}
    .noticebox li:before{top: 6px;}

}