@charset "utf-8";

@font-face{
    font-family:'Noto Sans Korean';
    font-style:normal;
    font-weight:200;
    src:url(/_font/NotoSansKR-Thin-Hestia.eot),
    url(/_font/NotoSansKR-Thin-Hestia.eot?#iefix) format('embedded-opentype'),
    url(/_font/NotoSansKR-Thin-Hestia.woff) format('woff'),
    url(/_font/NotoSansKR-Thin-Hestia.otf) format('opentype');
}

@font-face{
    font-family:'Noto Sans Korean';
    font-style:normal;
    font-weight:300;
    src:url(/_font/NotoSansKR-Light-Hestia.eot),
    url(/_font/NotoSansKR-Light-Hestia.eot?#iefix) format('embedded-opentype'),
    url(/_font/NotoSansKR-Light-Hestia.woff) format('woff'),
    url(/_font/NotoSansKR-Light-Hestia.otf) format('opentype');
}

@font-face{
    font-family:'Noto Sans Korean';
    font-style:normal;
    font-weight:350;
    src:url(/_font/NotoSansKR-DemiLight-Hestia.eot),
    url(/_font/NotoSansKR-DemiLight-Hestia.eot?#iefix) format('embedded-opentype'),
    url(/_font/NotoSansKR-DemiLight-Hestia.woff) format('woff'),
    url(/_font/NotoSansKR-DemiLight-Hestia.otf) format('opentype');
}

@font-face{
    font-family:'Noto Sans Korean';
    font-style:normal;
    font-weight:400;
    src:url(/_font/NotoSansKR-Regular-Hestia.eot),
    url(/_font/NotoSansKR-Regular-Hestia.eot?#iefix) format('embedded-opentype'),
    url(/_font/NotoSansKR-Regular-Hestia.woff) format('woff'),
    url(/_font/NotoSansKR-Regular-Hestia.otf) format('opentype');
}

@font-face{
    font-family:'Noto Sans Korean';
    font-style:normal;
    font-weight:500;
    src:url(/_font/NotoSansKR-Medium-Hestia.eot),
    url(/_font/NotoSansKR-Medium-Hestia.eot?#iefix) format('embedded-opentype'),
    url(/_font/NotoSansKR-Medium-Hestia.woff) format('woff'),
    url(/_font/NotoSansKR-Medium-Hestia.otf) format('opentype');
}

@font-face{
    font-family:'Noto Sans Korean';
    font-style:normal;
    font-weight:700;
    src:url(/_font/NotoSansKR-Bold-Hestia.eot),
    url(/_font/NotoSansKR-Bold-Hestia.eot?#iefix) format('embedded-opentype'),
    url(/_font/NotoSansKR-Bold-Hestia.woff) format('woff'),
    url(/_font/NotoSansKR-Bold-Hestia.otf) format('opentype');
}

/* Default Setting */
html, body{height:100%;}
html, body, section, header, nav, footer, article, address, h1, h2, h3, h4, h5, h6, p, dt, dd, dl, ul, li, span, strong, div, table, td, input, fieldset, textarea, select, a, img, button{padding:0; margin:0; font-family:'Noto Sans Korean', 'Malgun Gothic', Dotum, '돋움',Helvetica,AppleSDGothicNeo,sans-serif; font-weight:350; box-sizing:border-box;}
body{font-size:14px; color:#333; overflow-x:hidden; overflow-y:auto; letter-spacing:-0.5px;}
li{list-style:none;}
img{ vertical-align:top; border:none; max-width:100%;}
a{color:#333; text-decoration:none;}
table{ width: 100%; border-collapse:collapse;}
button{border:none; background:none; cursor:pointer;}
.hidden{width:1px; height:1px; margin:-1px; overflow:hidden; position:absolute; clip:rect(0 0 0 0);}
.ir{display:block; width:100%; height:100%; z-index:-1; font-size:0; overflow:hidden; position:relative;}
caption{width:0; height:0; overflow:hidden; font-size:0; text-indent:-9999px;}
.mobile{display:none !important;}

#skip_navigation{display:none;}

/* Mobile GNB Dummy */
#wrap.active:after{display:block;}
#wrap:after{display:none; content:""; width:100%; height:100%; background-color:rgba(0,0,0,0.7); position:fixed; top:0; left:0; z-index:98;}

/* Common header */
header{width:100%; position:absolute; top:0; left:0; z-index:99; border-bottom:1px solid rgba(255,255,255,0.2); background-color:rgba(255,255,255,0); transition:all 0.3s;}
header section{width:100%; max-width:1400px; height:120px; margin:0 auto; position:relative; z-index:99; transition:all 0.3s;}
#logo h1{margin-top:-10px; position:absolute; top:50%; left:0;}
#logo h1 a{display:block; width:447px; height:55px; background:url(/_res/safe/img/logo.png) no-repeat 0 0/447px 110px; text-indent:-9999px;}
#gnb{padding-top:40px;}
#gnb nav{float:right;}
#gnb nav > div{position:absolute; top:15px; right:0;}
#gnb nav > div a{padding:0 15px; font-size:15px; color:#d1d1d1;}
#gnb nav > div a:hover, header section nav > div a:focus{text-decoration:underline;}
#gnb nav > div a:last-child{padding-right:0;}
#gnb nav > div p{display:inline-block; padding-left:27px; font-size:15px; font-weight:500; color:#d1d1d1; position:relative;}
#gnb nav > div p:before{content:""; width:24px; height:24px; position:absolute; top:50%; left:0; margin-top:-12px; background:url(/_res/safe/img/bg_top_icon.png) no-repeat 0 0;}
#gnb nav > div p span{font-weight:700; color:#194895;}
#gnb nav > ul{float:right;}
#gnb nav > ul > li{float:left; position:relative;}
#gnb nav > ul > li > a{display:block; padding:0 28px; height:80px; line-height:80px; font-size:22px; color:#fff;}
#gnb nav > ul > li:last-child > a{padding-right:0;}
#gnb nav > ul > li > ul{visibility:hidden; min-width:220px; max-height:0; overflow:hidden; position:absolute; top:80px; left:50%; border-top:4px solid #194895; background-color:#f7f7f7; transition:all 0.2s; transform:translateX(-50%);}
#gnb nav > ul > li.active > ul{visibility:visible; max-height:400px;}
#gnb nav > ul > li > ul li a{display:block; height:50px; line-height:50px; font-size:18px; font-weight:350; color:#333; text-align:center;}
#gnb nav > ul > li > ul li a:hover, header section nav > ul > li > ul li a:focus{color:#fff; background-color:#194895;}
#gnb nav.active{visibility:visible; max-height:500px; opacity:1;}
#gnb_control{display:none; width:40px; height:40px; margin-top:-20px; position:absolute; top:50%; right:5px; border:none; background-color:#fff; transition:all 0.3s;}
#gnb_control span{width:22px; height:3px; background-color:#333; position:absolute; top:50%; left:50%; margin-top:-1.5px; margin-left:-11px; text-indent:-9999px; transition:all 0.3s;}
#gnb_control:before, #gnb_control:after{content:""; width:22px; height:3px; background-color:#333; position:absolute; left:50%; margin-left:-11px; transition:all 0.3s;}
#gnb_control:before{top:10px;}
#gnb_control:after{bottom:9px;}
#gnb_control.active span{opacity:0;}
#gnb_control.active:before{width:15px; height:2px; margin-left:-8px; top:19px; transform:rotate(45deg);}
#gnb_control.active:after{width:15px; height:2px; margin-left:-8px; bottom:19px; transform:rotate(-45deg);}

/* Header Active Design */
header.active{border-bottom:1px solid #d7d7d7; background-color:#fff;}
header.active #logo h1 a{background-position:0 -55px;}
header.active #gnb nav > ul > li > a{color:#333;}
header.active #gnb nav > ul > li:nth-child(4):before, header.active #gnb nav > ul > li:nth-child(5):before{background-position:-21px 0;}

/* Header Fixed Design */
header.fixed{position:fixed; border-bottom:1px solid #d7d7d7; background-color:#fff;}
header.fixed #logo h1 a{background-position:0 -55px;}
header.fixed #gnb nav > div a{color:#666;}
header.fixed #gnb nav > ul > li > a{color:#333;}
header.fixed #gnb nav > ul > li:nth-child(4):before, header.fixed #gnb nav > ul > li:nth-child(5):before{background-position:-21px 0;}

/* Sub header */
#wrap.sub header{position:static; background-color:#fff;}

#quick_menu{position:relative; border-top:1px solid #484848; border-bottom:1px solid #484848; background-color:#1a1a1a; z-index:1;}
#qnb{width:100%; max-width:1400px; margin:0 auto;}
#qnb > ul{height:50px; border-left:1px solid #484848; border-right:1px solid #484848;}
#qnb > ul > li{width:25%; float:left; position:relative;}
#qnb > ul > li > a{display:block; height:50px; line-height:50px; padding-left:25px; font-size:16px; color:#c8c8c8; border-left:1px solid #484848; position:relative;}
#qnb > ul > li > a:after{content:''; width:10px; height:7px; position:absolute; top:50%; right:20px; margin-top:-3.5px; background:url(/_res/safe/img/bg_qnb_arrow.png) no-repeat 0 0; transition:all 0.3s;}
#qnb > ul > li.active > a:after{transform:rotate(180deg);}
#qnb > ul > li:first-child > a{border-left:none;}
#qnb > ul > li > ul{visibility:hidden; width:100%; max-height:0; overflow-y:auto; position:absolute; bottom:50px; left:0; z-index:2; border:1px solid #444; transition:all 0.3s;}
#qnb > ul > li.active > ul{visibility:visible; max-height:400px;}
#qnb > ul > li > ul > li > a{display:block; height:40px; line-height:40px; padding:0 20px; font-size:16px; color:#c8c8c8; background-color:#1a1a1a;}
#qnb > ul > li > ul > li > a:hover, #qnb > ul > li > ul > li > a:focus{background-color:#3c3c3c; color:#fff;}

footer{position:relative; background-color:#1a1a1a; z-index:1;}
#footer{width:100%; max-width:1400px; margin:0 auto; padding:35px 0; position:relative;}
#footer > ul{overflow:hidden; padding-bottom:10px;}
#footer > ul li{float:left; padding:0 10px;}
#footer > ul li:first-child{padding-left:0;}
#footer > ul li:first-child a{color:#2aaec6;}
#footer > ul li a{font-size:16px; color:#a7a7a7;}
#footer > ul li a:hover, #footer > ul li a:focus{text-decoration:underline;}
#footer > address p span{font-size:16px; color:#909090; font-style:normal;}
#footer > address p.contact{padding-bottom:2px;}
#footer > address p.contact > span{margin-right:20px;}
#footer > address p.contact > span:last-child{margin-right:0;}

/* 테이블 */
table{width:100%; border-top:1px solid #d7d7d7;}
table.type_board{border-top:2px solid #333 !important;}
#contents div.jwxe_board table.type_board tbody td > span.secret{display:inline-block !important;}
table.type_horizontal{table-layout:fixed; border-left:1px solid #d7d7d7; font-size:18px;}
table.type_horizontal thead tr th{padding:15px; font-size:16px; font-weight:500; text-align:center; border-bottom:1px solid #d7d7d7; border-right:1px solid #d7d7d7; background-color:#f8f8f8; box-sizing:border-box;}
table.type_horizontal tbody tr td{padding:15px; font-size:16px; color:#393939; font-weight:350; line-height:160%; border-bottom:1px solid #d7d7d7; border-right:1px solid #d7d7d7; text-align:center; word-break:keep-all; box-sizing:border-box;}
table.type_horizontal tbody tr td.al_left{text-align:left;}
table.type_vertical{font-size:18px;}
table.type_vertical tbody tr th{padding:15px; height:50px; font-size:16px; font-weight:500; text-align:center; border-bottom:1px solid #d7d7d7; border-right:1px solid #d7d7d7; background-color:#f8f8f8; box-sizing:border-box;}
table.type_vertical tbody tr td{padding:15px; font-size:16px; color:#393939; font-weight:300; line-height:160%; letter-spacing:0; border-bottom:1px solid #d7d7d7; border-right:1px solid #d7d7d7; word-break:keep-all; box-sizing:border-box;}

/* 메인_비쥬얼 */
#main_visual{position:relative; overflow:hidden;}
#main_visual:before{content:""; width:100%; height:100%; position:absolute; top:50%; left:50%; background:url(/_res/safe/img/main_visual.jpg) no-repeat 50% 50%/cover; transform:translate(-50%, -50%) scale(1) perspective(500px) rotate(.001deg); animation:visual_animation 30s ease-in-out infinite;}
#main_visual > div{position:relative; width:100%; max-width:1400px; height:45vw; margin:0 auto;}
#main_visual > div div.textbox{padding-top:290px;}
#main_visual > div div.textbox h2{font-size:60px; letter-spacing:-0.5px; color:#000; font-weight:700; line-height:1.75;}
#main_visual > div div.textbox p{font-size:36px; letter-spacing:-1.5px; color:#000; font-weight:500; line-height:1.35;}
#main_visual > div div.textbox p br:last-child{display:none;}
@keyframes visual_animation{
    0%, 0.01%{transform:translate(-50%, -50%) scale(1) perspective(500px) rotate(.001deg);}
    50%{transform:translate(-50%, -50%) scale(1.2) perspective(500px) rotate(.001deg);}
    100%{transform:translate(-50%, -50%) scale(1) perspective(500px) rotate(.001deg);}
}
 
/* 메인_게시판 */
#main_board{padding:90px 0;}
#main_board > div{position:relative; width:100%; max-width:1400px; margin:0 auto; position:relative;}
#main_board > div .section{margin-top:0;}
#main_board > div .section ul{position:absolute; top:-170px; left:0; width:100%; height:170px; overflow:hidden;}
#main_board > div .section ul li{position:relative; width:33.3%; height:100%; float:left; transition:all .3s;}
#main_board > div .section ul li:first-child{
  background: -moz-linear-gradient(left,  #1c9ad6 0%, #1c9ad6 50%, #1c9ad6 100%);
  background: -webkit-linear-gradient(left,  #1c9ad6 0%,#1c9ad6 50%,#1c9ad6 100%);
  background: linear-gradient(to right,  #1c9ad6 0%,#1c9ad6 50%,#1c9ad6 100%);
}
#main_board > div .section ul li:nth-child(2){background-color:#194895;}
#main_board > div .section ul li:nth-child(3){background-color:#225fc2;}
#main_board > div .section ul li a:before, #main_board > div ul li a:after{content:""; position:absolute; transition:all .3s;}
#main_board > div .section ul li a:before{top:50%; left:25px; width:72px; height:72px; transform:translateY(-50%); background:url(/_res/safe/img/icon_deco.png) no-repeat;}
#main_board > div .section ul li:nth-child(2) a:before{background-position:-72px 0;}
#main_board > div .section ul li:nth-child(3) a:before{background-position:-144px 0;}
#main_board > div .section ul li a:after{bottom:50px; right:50px; background:url(/_res/safe/img/icon_link_arrow.png) no-repeat; width:81px; height:23px; transition:all .3s;}
#main_board > div .section ul li a{padding:40px 70px 40px 110px; display:block; width:100%; height:100%; font-size:30px; color:#fff; font-weight:300; line-height:1.3; transition:all .2s;}
#main_board > div .section ul li a:hover, #main_board > div .section ul li a:focus{transform:scale(1.05);}
#main_board > div .section ul li a strong{display:block; font-weight:700;}
#main_board > div h3{display:inline-block; padding-top:140px; padding-bottom:95px; font-size:34px; font-weight:700; letter-spacing:-0.5px;}
#main_board > div ul.tabs{display:flex; margin-top:140px; float:right;}
#main_board > div ul.tabs li{padding:0 30px; position:relative;}
#main_board > div ul.tabs li.active{font-weight:700;}
#main_board > div ul.swiper-wrapper{justify-content:initial;}
#main_board > div ul.swiper-wrapper > li.empty{margin:0 auto; padding:140px 0; font-size:20px; text-align:center;}
#main_board > div ul.tabs li:before{content:""; width:1px; height:18px; position:absolute; left:0; top:20px; border-right:1px solid #d1d1d1; background-color:#a0a0a0;}
#main_board > div ul.tabs li:first-child:before{display:none;}
#main_board > div ul.tabs li button{padding:10px; font-size:24px; color:#5d5d5d;}
#main_board > div ul.tabs li button:after{content:""; display:block; width:100%; height:4px; margin-top:10px;}
#main_board > div ul.tabs li.active button{font-weight:500; color:#000;}
#main_board > div ul.tabs li.active button:after{background-color:#194895;}
div.notice_swiper{display:none; width:100%; padding:0 100px; position:relative;}
div.notice_swiper.active{display:block;}
div.notice_swiper ul li{max-width:370px;}
div.notice_swiper ul li a{display:block; height:335px; padding:45px 40px; border:1px solid #e6e6e6; background-color:#f9f9f9; transition:all 0.3s;}
div.notice_swiper ul li a{display:flex; flex-flow:row wrap; align-items:center; overflow:hidden;}
div.notice_swiper ul li a{display:block; height:310px; padding:40px; position:relative; background-color:#f9f9f9; border:1px solid #e6e6e6; transition:all 0.3s;}
div.notice_swiper ul li a:after{content:""; width:27px; height:24px; position:absolute; bottom:-1px; right:-1px; background:url(/_res/sch/img/bg_main_recent_board_edge.png) no-repeat 100% 100%;}
div.notice_swiper ul li a span{display:block; font-size:16px; font-weight:700; color:#0255a9; text-transform:uppercase; letter-spacing:0;}
div.notice_swiper ul li a span strong{padding-right:5px; font-size:36px; font-weight:700; letter-spacing:-2px;}
div.notice_swiper ul li a h6{max-height:60px; min-height:30px; line-height:30px; margin:15px 0; font-size:24px; font-weight:500; color:#333; overflow:hidden; word-break:keep-all;}
div.notice_swiper ul li.latest h6:after{content:"N"; display:inline-block; width:23px; height:23px; line-height:23px; margin-left:5px; font-size:12px; font-weight:700; color:#fff; text-align:center; vertical-align:3px; border-radius:50%; background-color:#88c12f;}
div.notice_swiper ul li a p{height:78px; line-height:26px; font-size:16px; color:#5e5e5e; overflow:hidden;}
div.notice_swiper ul li a:hover, #main_div4 section > div.notice ul li a:focus{background-color:#ebebeb; border:1px solid #dadada;}
div.notice_swiper div.control button{width:50px; height:50px; position:absolute; top:130px; border:1px solid #898989; background-color:transparent; transition:0.3s all;}
div.notice_swiper div.control button.prev{left:0;}
div.notice_swiper div.control button.next{right:0;}
div.notice_swiper div.control button span{display:block; width:30px; height:1px; position:absolute; top:50%; left:50%; font-size:1px; color:transparent; background-color:#898989; transform:translateX(-50%);}
div.notice_swiper div.control button span:before, div.notice_swiper div.control button span:after{content:""; width:12px; height:1px; position:absolute; background-color:#898989;}
div.notice_swiper div.control button.prev span:before{top:-5px; left:-1px; transform:rotate(-45deg);}
div.notice_swiper div.control button.prev span:after{bottom:-5px; left:-1px; transform:rotate(45deg);}
div.notice_swiper div.control button.next span:before{top:-5px; right:-1px; transform:rotate(45deg);}
div.notice_swiper div.control button.next span:after{bottom:-5px; right:-1px; transform:rotate(-45deg);}
div.notice_swiper div.control button:hover, div.notice_swiper div.control button:focus{background-color:#2959b0; border-color:#2959b0;}
div.notice_swiper div.control button:hover span:before, div.notice_swiper div.control button:focus span:before, div.notice_swiper div.control button:hover span:after, div.notice_swiper div.control button:focus span:after, div.notice_swiper div.control button:hover span, div.notice_swiper div.control button:focus span{background-color:#fff;}
div.notice_swiper div.pagination{margin-top:60px; text-align:center;}
div.notice_swiper span.swiper-pagination-bullet{display:inline-block; width:30px; height:30px; position:relative; cursor:pointer;}
div.notice_swiper span.swiper-pagination-bullet:before{content:""; width:12px; height:12px; position:absolute; top:50%; left:50%; border:1px solid #606060; border-radius:50%; transform:translate(-50%, -50%);}
div.notice_swiper span.swiper-pagination-bullet-active:before{border-color:#2959b0; background-color:#2959b0;}
div.no_swiper ul.swiper-wrapper{display:block;}
div.no_swiper ul.swiper-wrapper li{max-width:100%;}
div.no_swiper div.control{display:none;}

/* 메인_안전 신문고 */
#main_suggest{background:url(/_res/safe/img/main_visual_02.jpg) no-repeat 50% 50%;}
#main_suggest > div{padding-top:90px; padding-bottom:101px; width:100%; max-width:1400px; margin:0 auto; position:relative; overflow:hidden;}
#main_suggest > div > h3{margin-bottom:10px; font-size:34px; font-weight:700; letter-spacing:-0.5px; color:#000;}
#main_suggest > div > p{display:inline-block; font-size:22px;}
#main_suggest > div > p br{display:none;}
#main_suggest > div > p strong{font-weight:700;}
#main_suggest > div > a{position:absolute; display:inline-block; width:250px; height:70px; top:50%; right:0; line-height:70px; background-color:#194895; font-size:21px; color:#fff; text-align:center; transform:translateY(-50%); transition:all .3s;}
#main_suggest > div > a span{position:relative; margin-left:-10px; display:inline-block;}
#main_suggest > div > a span:before{content:""; position:absolute;display:inline-block; top:50%; right:-18px; width:10px; height:10px; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:translateY(-50%) rotate(315deg); transition:all .3s;}
#main_suggest > div > a:hover, #main_suggest > div > a:focus{background-color:#225fc2;}
#main_suggest > div > a:hover span:before, #main_suggest > div > a:focus span:before{right:-25px;}

/* Swiper */
.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
.swiper-container-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
  justify-content:space-between;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}
.swiper-container-multirow-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}
.swiper-container-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-container-pointer-events {
  touch-action: pan-y;
}
.swiper-container-pointer-events.swiper-container-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}

/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

/* Sub Layout */
#sub_visual{height:364px; background:url(/_res/safe/img/sub_visual_01.jpg) no-repeat 50% 50%/cover;}
#sub_visual div{width:100%; max-width:1400px; padding-top:200px; margin:0 auto;}
#sub_visual div h2{display:inline-block; font-size:40px; font-weight:700; color:#fff;}
#sub_visual div.breadcrum{width:auto; padding-top:30px; float:right;}
#sub_visual div.breadcrum ul{display:flex; gap:33px;}
#sub_visual div.breadcrum ul li, #sub_visual > div div.breadcrum ul li a{position:relative; font-size:16px; font-weight:300; color:#fff; text-shadow:1px 1px 3px rgb(0 0 0 / 80%);}
#sub_visual div.breadcrum ul li:not(:first-child):before{content:""; width:10px; height:10px; position:absolute; top:50%; left:-25px; border-top:1px solid rgba(255, 255, 255, 0.5); border-right:1px solid rgba(255, 255, 255, 0.5); transform:translateY(-50%) rotate(45deg);}
#sub_visual div.breadcrum ul li:first-child a:before{content:""; display:block; width:18px; height:19px; position:absolute; top:50%; left:0; background:url(/_res/sw/img/bg_breadcrum.png) no-repeat 50% 50%/19px 21px; transform:translateY(-50%);}
#sub_visual div.breadcrum ul li:first-child a span{opacity:0;}
#sub_visual div.breadcrum ul li ul{display:none;}

#snb{margin-top:-40px;}
#snb div{width:100%; max-width:1400px; margin:0 auto; position:relative; background-color:#fff;}
#snb div > ul{display:table; width:100%; table-layout:fixed; border:1px solid #d7d7d7; border-bottom:none;}
#snb div > ul > li{display:table-cell; position:relative; vertical-align:top; border-bottom:1px solid #d7d7d7;}
#snb div > ul > li:before{content:""; width:1px; height:20px; position:absolute; top:50%; left:0; background-color:#b7b7b7; transform:translateY(-50%);}
#snb div > ul > li:first-child:before{display:none;}
#snb div > ul > li > a{display:block; height:80px; line-height:80px; font-size:20px; font-weight:500; color:#333; text-align:center;}
#snb div > ul > li > a.active{font-weight:700; color:#2959b0; border-bottom:2px solid #2959b0;}
#snb div > ul > li ul{min-width:100%; max-width:1000px; position:absolute; top:100px; left:50%; text-align:center; transform:translateX(-50%);}
#snb div > ul > li ul li{display:inline-block; margin:0 15px; position:relative;}
#snb div > ul > li ul li a{font-size:20px; color:#333;}
#snb div > ul > li ul li a.active{color:#2959b0;}

#sub_title{width:100%; max-width:1400px; margin:130px auto 85px; position:relative;}
#sub_title h3{font-size:35px; font-weight:700; color:#333; text-align:center; line-height:35px;}
#sub_title h3 span{display:block; width:42px; height:14px; margin:0 auto 15px; position:relative; background-color:#00677e;}
#sub_title h3 span:before{content:""; width:14px; height:14px; position:absolute; top:0; left:0; background-color:#92c83e;}
#sub_title h3 span:after{content:""; width:14px; height:14px; position:absolute; top:0; right:0; background-color:#2ac4f4;}

#sub_contents{width:100%; max-width:1200px; margin:0 auto; padding-bottom:150px; position:relative;}
#sub_contents div.jwxe_board div.board_view div.board_title{border-top:2px solid #000;}
#sub_contents div.lang{height:60px; position:absolute; top:-140px; right:0; border:1px solid #acacac;}
#sub_contents div.lang a, #sub_contents div.lang span{display:block; width:100px; float:left; font-size:20px; font-weight:350; color:#8d8d8d; line-height:58px; text-align:center;}
#sub_contents div.lang span{position:relative; color:#055597;}
#sub_contents div.lang span:before{content:""; width:100%; height:100%; position:absolute; top:-1px; left:-1px; border:1px solid #0063b5; z-index:1;}
#sub_contents h4{position:relative; font-size:30px; font-weight:bold; margin-bottom: 30px;}
#sub_contents h4:before{content:""; position:absolute; top:-10px; left:0; width:42px; height:4px; background-color:#194895;}

/* 비전 및 추진체계 */
div.section{margin-top:120px;}
#sub_010101 .section1 .sub_img{position:relative; width:99%; height:280px; background:url("/_res/safe/img/sub_bg_01.jpg") no-repeat;}
#sub_010101 .section1 .sub_img:before{content:""; position:absolute; top:10px; right:-10px; width:100%; height:100%; background-color:#194895; z-index:-1;}
#sub_010101 .section1 .sub_img > p{padding-left:50px; padding-top:120px; font-size:28px; color:#fff;}
#sub_010101 .section1 .sub_img > p strong{font-weight:700;}
#sub_010101 .section1 dl.box{margin-top:70px; width:100%; border-bottom:1px solid #d7d7d7; overflow:hidden;}
#sub_010101 .section1 dl.box dt.title{padding:45px 70px; width:350px; min-height:170px; font-size:35px; font-weight:700; line-height:100%; border-top:2px solid #000; float:left}
#sub_010101 .section1 dl.box dd{padding:45px 55px 45px 110px; width:calc(100% - 350px); min-height:170px; font-size:18px; letter-spacing:0.5px; color:#393939; border-top:1px solid #d7d7d7; float:left;}
#sub_010101 .section1 dl.box dd:nth-of-type(3) ul li:last-child:before{display:none;}
#sub_010101 .section1 dl.box dd > ul > li{position:relative; padding-left:10px;}
#sub_010101 .section1 dl.box dd > ul > li:before{content:"-"; position:absolute; top:0; left:0;}
#sub_010101 .safety_system { display: block; margin: auto; }
#sub_010101 .safety_table { table-layout: fixed; } 
#sub_010101 .safety_table .safety_title { background-color: #32539A; } 
#sub_010101 .safety_table tr th { padding: 15px; border: 1px solid #d4d4d4; color: #ECF0F6; font-weight: bold; font-size: 18px; text-align: center; } 
#sub_010101 .safety_table tr td:first-child, #sub_010101 .safety_table tr th:first-child { border-left: none; } 
#sub_010101 .safety_table tr td:last-child, #sub_010101 .safety_table tr th:last-child { border-right: none; } 
#sub_010101 .safety_table tr td { padding: 15px; border: 1px solid #d4d4d4; color: #696969; font-size: 16px; line-height: 1.5; text-align: center; }
#sub_010101 .safety_table .left { text-align: left; }

/* 안전보건방침 */
#sub_010201 > div{position:relative; display:flex; flex-flow:column; align-items:center;}
#sub_010201 > div > div{width:100%; }
#sub_010201 > div div.gradient{position:relative; height:110px; background:rgb(124,182,11); background:linear-gradient(90deg, rgba(124,182,11,1) 0%, rgba(2,125,152,1) 91%, rgba(2,125,152,1) 100%); border:none;}
#sub_010201 > div div.gradient:before{content:""; position:absolute; top:50%; left:50px; width:120px; height:50px; background:url(/_res/safe/img/sub_bg_logo.png) no-repeat;  transform:translateY(-50%);}
#sub_010201 > div div.text{padding:80px 110px 90px; border-bottom:1px solid #d7d7d7; border-left:1px solid #d7d7d7; border-right:1px solid #d7d7d7;}
#sub_010201 > div div.text h4{padding-bottom:70px; font-size:43px; font-weight:700; letter-spacing:30px; text-align:center;}
#sub_010201 > div div.text h4:before{position:static;}
#sub_010201 > div div.text > p{font-size:29px; font-weight:700; line-height:1.5;}
#sub_010201 > div div.text ol{padding-left:35px; margin:50px 0 60px;}
#sub_010201 > div div.text ol > li{font-size:26px; line-height:1.75; list-style:auto;}
#sub_010201 > div div.text ol > li strong{font-weight:500;}
#sub_010201 > div div.text span.date{display:block; margin-bottom:35px; font-size:25px; font-weight:500; letter-spacing:1px; text-align:center;}
#sub_010201 > div div.text span.sign { display: flex; justify-content: center; font-weight: 300; font-size: 26px; text-align: center; } 
#sub_010201 > div div.text span.sign strong{margin-left:20px; font-size:28px; font-weight:500; letter-spacing:10px;}
#sub_010201 > div.section1 div.text span.sign img{margin-top:-25px;}
#sub_010201 > div.section2 div.text span.sign img{margin-top:-13px;}
#sub_010201 a.download{display:inline-block; padding:0 30px; margin-top:35px; width:245px; height:70px; line-height:70px; background-color:#194895; text-align:center; transition:all .3s;}
#sub_010201 a.download span{position:relative; margin-right:20px; display:inline-block; font-size:21px; color:#fff; transition:all .3s;}
#sub_010201 a.download span:before{content:""; position:absolute; top:50%; right:-24px; width:14px; height:19px; transform:translateY(-50%); background:url(/_res/safe/img/icon_download.png) no-repeat;}
#sub_010201 a.download:hover, #sub_010201 a.download:focus{background-color:#225fc2;}

/* 게시판 - 산업재해 및 안전사고 현황 */
#sub_020101 .section h4{margin-bottom:20px;}
#sub_020101 .section > span{display:block; margin-bottom:5px; font-size:16px; font-weight:300; text-align:right;}

/* 게시판 - 감염병 발생 현황 */
#sub_020201 .section h4{margin-bottom:20px;}
#sub_020201 .section > span{display:block; margin-bottom:5px; font-size:16px; font-weight:300; text-align:right;}
#sub_020201 .section table colgroup col.subject{width:10%;}
#sub_020201 .section table colgroup col.case{width:8%;}
#sub_020201 .section table tbody tr th{padding:15px; font-size:16px; font-weight:500; text-align:center; border-bottom:1px solid #d7d7d7; border-right:1px solid #d7d7d7; background-color:#f8f8f8; box-sizing:border-box;}

/* 안전 신문고 - 아차사고 사례 발굴 */
#sub_contents #sub_040101 h4{margin-bottom:20px;}
#sub_040101 > p{font-size:18px; letter-spacing:-0.5px;}
#sub_040101 .box{position:relative; margin-top:35px; margin-bottom:105px; padding:55px 50px; width:100%; height:auto; min-height:330px; background-color:#f7f7f7;}
#sub_040101 .box ul > li{position:relative; padding-left:10px; font-size:18px; font-weight:300; letter-spacing:0; line-height:1.7;}
#sub_040101 .box ul > li:before{content:"-"; position:absolute; top:0; left:0;}
#sub_040101 .box ul > li strong{font-weight:500;}
#sub_040101 .box ul > li > a{color:#0d26c0;}
#sub_040101 .box ul > li > a:hover, #sub_040101 .box ul > li > a:focus{text-decoration:underline;}
#sub_040101 .box a.download{position:absolute; bottom:50px; left:50%; transform:translateX(-50%); display:inline-block; padding:0 28px; margin-top:35px; width:auto; height:50px; line-height:50px; background-color:#194895;}
#sub_040101 .box a.download span{position:relative; margin-right:20px; display:inline-block; font-size:16px; color:#fff;}
#sub_040101 .box a.download span:before{content:""; position:absolute; top:50%; right:-24px; width:14px; height:19px; transform:translateY(-50%); background:url(/_res/safe/img/icon_download.png) no-repeat;}

/* 안전 신문고 - 안전개선 제안 */
#sub_contents #sub_040201 h4{margin-bottom:20px;}
#sub_040201 .box{position:relative; margin-top:35px; margin-bottom:105px; padding:55px 50px; width:100%; height:auto; min-height:330px; background-color:#f7f7f7;}
#sub_040201 .box ul > li{position:relative; padding-left:10px; font-size:18px; font-weight:300; letter-spacing:0; line-height:1.7;}
#sub_040201 .box ul > li strong{font-weight:500;}
#sub_040201 .box ul > li > a{color:#0d26c0;}
#sub_040201 .box ul > li > a:hover, #sub_040101 .box ul > li > a:focus{text-decoration:underline;}
#sub_040201 .box ul > li:before{content:"-"; position:absolute; top:0; left:0;}
#sub_040201 .box a.download{position:absolute; bottom:50px; left:50%; transform:translateX(-50%); display:inline-block; padding:0 28px; margin-top:35px; width:auto; height:50px; line-height:50px; background-color:#194895;}
#sub_040201 .box a.download span{position:relative; margin-right:20px; display:inline-block; font-size:16px; color:#fff;}
#sub_040201 .box a.download span:before{content:""; position:absolute; top:50%; right:-24px; width:14px; height:19px; transform:translateY(-50%); background:url(/_res/safe/img/icon_download.png) no-repeat;}

/* 안전보건관계법령 */
#sub_050101 table.type_horizontal colgroup col.name{width:25%;}
#sub_050101 table.type_horizontal colgroup col.agency{width:18%;}
#sub_050101 table.type_horizontal tbody tr td.al_left{padding:45px 60px;}
#sub_050101 table.type_horizontal tbody tr td{letter-spacing:0;}
#sub_050101 table.type_horizontal tbody tr td > a{display:block; width:100%; height:100%; line-height:1.35;}
#sub_050101 table.type_horizontal tbody tr td > a > img{padding-top:5px; padding-left:3px;}
#sub_050101 table.type_horizontal tbody tr td a:hover, #sub_050101 table.type_horizontal tbody tr td a:focus{color:#194895; text-decoration:underline;}
#sub_050101 > p{margin-top:20px; font-size:16px; font-weight:300; color:#393939;}
#sub_050101 > p a{color:#393939;}
#sub_050101 > p a:hover, #sub_050101 > p a:focus{text-decoration:underline;}

/* PC Mini & Tablet */
@media all and (min-width:768px) and (max-width:1399px){
    body{-webkit-text-size-adjust:100%; overflow-x:hidden;}

    #wrap.active #main_visual, #wrap.active #contents, #wrap.active #sub_contents, #wrap.active #quick_menu, #wrap.active footer, #sub_visual, #snb{display:none;}

    /* Common header */
    header{overflow:hidden;}
    header section{height:auto; padding:0;}
    #logo{height:70px; position:relative; background-color:#fff; z-index:999;}
    #logo h1{left:15px; margin-top:-12px;}
    #logo h1 a{width:300px; height:37px; background-position:0 0; background-size:300px 74px;}
    #gnb_control{display:block;}

    #gnb{width:100%; height:100vh; padding:0; position:absolute; top:-100vh; left:0; background-color:#194895; transition:all 0.3s;}
    #gnb.active{max-height:inherit; top:0;}
    #gnb nav{width:100%; padding-top:110px; float:none;}
    #gnb nav > div{width:100%; top:inherit; bottom:30px; text-align:center;}
    #gnb nav > div a{font-weight:400; color:#fff;}
    #gnb nav > div a:before{background-color:#ddd;}
    #gnb nav > div p{display:none;}
    #gnb nav > ul{display:table; table-layout:fixed; width:100%; float:none;}
    #gnb nav > ul > li{display:table-cell; float:none;}
    #gnb nav > ul > li:first-child{width:22%;}
    #gnb nav > ul > li > a{height:70px; line-height:70px; padding:0; font-size:18px; color:#fff; text-align:center; background-color:#194895;}
    #gnb nav > ul > li > ul{visibility:visible; min-width:100%; max-height:inherit; overflow:hidden; position:static; border-top:none; background-color:transparent; transform:translateX(0);}
    #gnb nav > ul > li > ul li{margin:15px 0; text-align:center;}
    #gnb nav > ul > li > ul li a{padding:0; font-size:16px; color:#fff;}
    #gnb nav > ul > li > ul li a:before{display:none;}
    #gnb nav > ul > li > ul li a:hover, header section nav > ul > li > ul li a:focus{color:#fff;}
    #gnb nav > ul > li > ul li a.active{font-weight:700; text-decoration:underline;}
    #wrap.active header{padding:0; overflow:visible; position:absolute; border-bottom:none;}
    #wrap.active header section{height:auto;}
    #wrap.active header #logo{background-color:#fff; z-index:999;}

    /* Header Fixed Design */
    header.active{padding:0 30px; position:fixed; border-bottom:1px solid #d7d7d7; background-color:#fff;}
    header.active section{max-width:100%; height:80px;}
    header.active #gnb{padding-top:0;}
    header.active #gnb nav > div{position:static; float:right; padding-top:27px; margin-left:60px;}
    header.active #gnb nav > ul > li > a{padding:0 30px; font-size:18px;}
    header.active #gnb nav > ul > li:last-child > a{padding-right:0;}
    header.active #gnb nav > ul > li > ul{border-top:1px solid #d7d7d7;}
    header.fixed #logo h1 a{background-position:0 -37px;}
    header.fixed #gnb nav > ul > li > a{color:#fff;}

    #footer{padding:25px 20px;}

    #qnb > ul > li > a{font-size:13px; padding:0 15px;}
    #qnb > ul > li > a:after{right:15px;}
    #qnb > ul > li > ul > li > a{font-size:13px; padding:0 15px;}

    /* 메인_비쥬얼 */
    #main_visual:before{background:url(/_res/safe/img/main_visual.jpg) no-repeat 50% 50%/cover;}
    #main_visual > div{max-width:100%; height:75vw;}
    #main_visual > div div.textbox{padding:160px 30px 0;}
    #main_visual > div div.textbox h2{font-size:40px; letter-spacing:0;}
    #main_visual > div div.textbox p{font-size:30px; letter-spacing:-1px;}

    /* 메인_게시판 */
    #main_board{padding:100px 30px 45px;}
    #main_board > div{max-width:100%;}
    #main_board > div .section ul{top:-200px; height:150px;}
    #main_board > div .section ul li a:before{top:42%; left:17px; width:60px; height:60px; background-size:180px 60px;}
    #main_board > div .section ul li:nth-child(2) a:before{background-position:-60px 0;}
    #main_board > div .section ul li:nth-child(3) a:before{background-position:-120px 0;}
    #main_board > div .section ul li a{padding:30px 45px 30px 90px; font-size:22px; -ms-word-break:keep-all; word-break:keep-all;}
    #main_board > div .section ul li a:after{bottom:25px; right:25px; width:65px; height:18px; background-size:65px 18px;}
    #main_board > div h3{padding-top:0; padding-bottom:50px; font-size:30px; letter-spacing:0;}
    #main_board > div ul.tabs{margin-top:0;}
    #main_board > div ul.tabs li{padding:0 30px;}
    #main_board > div ul.swiper-wrapper > li.empty{margin:0 auto; padding:140px 0; font-size:20px;}
    #main_board > div ul.tabs li:before{height:18px; position:absolute; left:0; top:20px;}
    #main_board > div ul.tabs li:first-child:before{display:none;}
    #main_board > div ul.tabs li button{padding:10px; font-size:24px;}
    #main_board > div ul.tabs li button:after{height:4px; margin-top:10px;}
    div.notice_swiper{padding:0;}
    div.notice_swiper ul li{max-width:370px;}
    div.notice_swiper ul li a{height:310px; padding:40px;}
    div.notice_swiper ul li a:after{width:27px; height:24px;background:url(/_res/sch/img/bg_main_recent_board_edge.png) no-repeat 100% 100%;}
    div.notice_swiper ul li a span{display:block; font-size:16px; text-transform:uppercase; letter-spacing:0;}
    div.notice_swiper ul li a span strong{padding-right:5px; font-size:36px; font-weight:700; letter-spacing:-2px;}
    div.notice_swiper ul li a h6{max-height:60px; min-height:30px; line-height:30px; margin:15px 0; font-size:24px}
    div.notice_swiper ul li.latest h6:after{width:23px; height:23px; line-height:23px; margin-left:5px; font-size:12px; font-weight:700; color:#fff; text-align:center; vertical-align:3px;}
    div.notice_swiper ul li a p{height:78px; line-height:26px; font-size:16px;}
    div.notice_swiper div.control button{width:50px; height:50px; position:absolute; top:130px;}
    div.notice_swiper div.control button span{display:block; width:30px; height:1px; position:absolute; top:50%; left:50%; font-size:1px; color:transparent; background-color:#898989; transform:translateX(-50%);}
    div.notice_swiper div.pagination{margin-top:60px;}
    div.notice_swiper span.swiper-pagination-bullet{width:30px; height:30px;}
    div.notice_swiper span.swiper-pagination-bullet:before{width:12px; height:12px;}

    /* 메인_안전 신문고 */
    #main_suggest > div{padding:45px 30px; max-width:100%;}
    #main_suggest > div > h3{margin-bottom:10px; font-size:34px; letter-spacing:-0.5px;}
    #main_suggest > div > p{font-size:20px;}
    #main_suggest > div > a{width:220px; height:50px; right:30px; line-height:50px; font-size:18px;}
    #main_suggest > div > a span{margin-left:-10px;}
    #main_suggest > div > a span:before{right:-18px; width:10px; height:10px;}
    #main_suggest > div > a:hover span:before, #main_suggest > div > a:focus span:before{right:-25px;}

    /* Sub Layout */
    #sub_visual{height:35vw; margin-top:71px; background-size:cover;}
    #sub_visual div{display:flex; align-items:center; height:100%; padding:0 20px;}
    #sub_visual div h2{font-size:34px;}

    #snb{margin-top:0;}
    #snb div > ul{display:block; height:60px; position:relative; text-align:center; border-left:none; border-right:none;}
    #snb div > ul > li{display:inline-block; position:static;}
    #snb div > ul > li:before{display:none;}
    #snb div > ul > li > a{height:60px; line-height:60px; padding:0 20px; position:relative; font-size:16px;}
    #snb div > ul > li > a:before{content:""; width:1px; height:16px; position:absolute; top:50%; left:0; background-color:#b7b7b7; transform:translateY(-50%);}
    #snb div > ul > li > a:first-child:before{display:none;}
    #snb div > ul > li ul{top:70px; min-width:100vw; left:0; transform:translateX(0);}
    #snb div > ul > li ul li{margin:0 10px;}
    #snb div > ul > li ul li a{font-size:15px;}
    #snb div > ul > li ul li a.active:before{bottom:-8px;}
    
    #snb.active div > ul{height:auto;}
    #snb.active div > ul > li > a{display:block;}
    #snb.active div > ul > li ul{display:none;}
    
    #sub_title{margin:100px auto 55px;}
    #sub_title h3{font-size:28px; line-height:40px;}
    #sub_title h3 span{width:39px; height:13px; margin:0 auto 15px;}
    #sub_title h3 span:before, #sub_title h3 span:after{width:13px; height:13px;}

    #sub_contents{padding:0 20px 50px;}
    #sub_contents div.lang{height:50px; top:-105px; right:26px;}
    #sub_contents div.lang a, #sub_contents div.lang span{width:80px; font-size:17px; line-height:48px;}
    #sub_contents h4{font-size:24px;}

    /* 사업단 안내 */
    div.section{margin-top:35px;}
    div.intro div.box.type1:before{width:50%; height:27vw; margin-left:35px;}
    div.intro div.box.type1 p{padding-top:19px; font-size:17px; line-height:28px;}
    div.intro div.box.type1 p.desc{font-size:26px; line-height:34px;}
    div.intro div.box.type1 p.desc br{display:none;}
    div.intro div.box.type1 p strong{font-weight:700; text-decoration:underline;}
    div.intro div.box.type1 p strong:before{display:none;}

    div.intro div.box.type2{margin-top:40px; padding:50px 0;}
    div.intro div.box.type2 h5{line-height:32px; font-size:32px;}
    div.intro div.box.type2 div.top p{font-size:20px;}
    div.intro div.box.type2 div.top div{width:680px; margin:50px auto 0;}
    div.intro div.box.type2 div.top div span{width:160px; height:160px; padding-top:50px; font-size:22px; line-height:26px;}
    div.intro div.box.type2 div.top div strong{width:350px; height:215px; padding-top:72px; font-size:26px; line-height:32px;}
    div.intro div.box.type2 div.top div strong:before, div.intro div.box.type2 div.top div strong:after{height:62px; background-size:350px 62px;}
    div.intro div.box.type2 div.bot{width:100%; margin:50px auto 0;}
    div.intro div.box.type2 div.bot ul{margin-top:40px;}
    div.intro div.box.type2 div.bot ul li{font-size:18px;}

    div.vision p{font-size:17px; padding-top:13px; line-height:28px;}
    div.vision table{display:block; margin-top:25px;}
    div.vision table tbody{display:block;}
    div.vision table tr{display:block; padding:20px; border-top:1px solid #d7d7d7;}
    div.vision table tr:first-child{border-top:none;}
    div.vision table tr th{display:block; width:100%; padding:0 0 10px 0; font-size:24px; line-height:28px; border-top:none;}
    div.vision table tr th br{display:none;}
    div.vision table tr td{display:block; padding:0; font-size:20px; text-align:left; word-break:keep-all; border-top:none;}
    div.vision table td.goal > ul{margin-top:15px;}
    div.vision table td.goal > ul > li{padding:10px; font-size:15px; line-height:22px;}
    div.vision table td.goal > ul > li strong{font-size:18px; padding-bottom:5px; text-align:center;}
    div.vision table td.goal2{text-align:left;}
    div.vision table td.goal2 > ul > li{margin-top:15px;}
    div.vision table td.goal2 > ul > li:first-child{margin-top:15px;}
    div.vision table td.goal2 > ul > li strong{font-size:18px;}
    div.vision table td.goal2 > ul > li p{font-size:16px; line-height:22px;}
    div.vision table td.goal2 > ul > li ul li{padding-left:10px; font-size:16px; line-height:22px;}

    div.vision table td.task ul{padding-left:0;}
    div.vision table td.task ul li{padding-left:10px; float:none; font-size:16px; line-height:22px;}
    div.vision table td.task ul li:nth-child(3n+1){width:300px;}
    div.vision table td.task ul li:nth-child(3n+2){width:500px;}
    div.vision table td.task2 > ul{margin-top:15px;}
    div.vision table td.task2 > ul > li{padding-right:10px;}
    div.vision table td.task2 > ul > li ul li{padding-left:8px; margin-top:5px; font-size:14px; line-height:20px;}

}

/* Mobile */
@media all and (max-width:767px){
    body{-webkit-text-size-adjust:100%; overflow-x:hidden;}
    .mobile{display:block !important;}
    img.web{display:none;}
    
    #wrap.active #main_visual, #wrap.active #contents, #wrap.active #sub_contents, #wrap.active #quick_menu, #wrap.active footer{display:none;}

    header{overflow:hidden;}
    header section{height:auto; padding:0;}
    #logo{height:70px; position:relative; background-color:#fff; z-index:999;}
    #logo h1{left:20px; margin-top:-10px;}
    #logo h1 a{width:300px; height:37px; background-position:0 -37px; background-size:300px 74px;}
    header.fixed #logo h1 a{background-position:0 -37px;}
    header.fixed #gnb nav > ul > li > a{color:#fff;}
    header.fixed #gnb nav > div a{color:#d1d1d1;}
    header.fixed #gnb nav > div a:first-child{position:relative;}
    header.fixed #gnb nav > div a:first-child:before{content:""; position:absolute; top:6px; right:-2px; width:1px; height:12px; background-color:#d1d1d1;}
    #gnb_control{display:block; right:10px;}
    #gnb{width:100%; height:calc(100vh - 70px); position:absolute; top:70px; right:-100%; background-color:#f1f1f1; transition:all 0.3s;}
    #gnb.active{max-height:inherit; right:0; padding-top:20px; background-color:#194895;}
    #gnb nav{float:none;}
    #gnb nav > div{position:inherit; display:flex; width:100%; text-align:center;}
    #gnb nav > div a{width:50%;}
    #gnb nav > ul{flex-direction:column; margin-top:20px; float:none;}
    #gnb nav > ul > li{width:100%;}
    #gnb nav > ul > li > a{height:60px; line-height:60px; padding:0 20px; font-size:17px; font-weight:500; color:#fff; background-color:#194895;}
    header.active #gnb nav > ul > li > a.active{color:#fff; background-color:#194895;}
    #gnb nav > ul > li > ul{min-width:100%; width:100%; position:static; background-color:#fff; transform:translateX(0);}
    #gnb nav > ul > li:last-child > ul{margin:0;}
    #gnb nav > ul > li > ul > li > a{padding:0 20px; height:65px; line-height:65px; font-size:15px; color:#000; text-align:left; position:relative; font-weight:350;}
    #gnb nav > ul > li > a:after{width:22px; height:11px; background:url(/_res/premedicine/img/bg_gnb_mobile_arrow.png) no-repeat 50% 50%/22px auto; position:absolute; top:27px; right:20px; margin-top:-4.5px; content:""; transform:rotate(-180deg) translateY(-2px); transition:all 0.5s;}
    #gnb nav > ul > li > ul > li > a.active{font-weight:700; background-color:#f7f7f7;}
    #gnb nav > ul > li > a.active:after{transform:rotate(0deg);}
    #gnb nav > ul > li > a + ul{visibility:hidden;}
    #gnb nav > ul > li > a.active + ul{visibility:visible; max-height:500px; padding:0; transition:all 1s; border-top:none;}
    #wrap.active header{padding:0; overflow:visible; position:absolute; border-bottom:none;}
    #wrap.active header #logo{border-bottom:1px solid #d7d7d7;}
    #wrap.active header #gnb > ul{margin:0;}
    #snb.hide, #sub_visual.hide{display:none;}

    #qnb{max-width:100%;}
    #qnb > ul{height:inherit; border-left:none; border-right:none;}
    #qnb > ul > li{width:100%; float:none; border-bottom:1px solid #444; background-position:95% 50%; background-size:7px auto;}
    #qnb > ul > li > a{height:50px; line-height:50px; padding:0 20px; font-size:14px; color:#d0d0d0;}
    #qnb > ul > li > ul{position:static; border:none; -webkit-overflow-scrolling:touch;}
    #qnb > ul > li > ul > li > a{height:30px; line-height:30px; font-size:13px;}

    #footer{padding:20px 15px;}
    #footer > ul{text-align:center; padding-bottom:15px; font-size:0;}
    #footer > ul li{display:inline-block;}
    #footer > ul li a{font-size:13px;}
    #footer > address p span{font-size:12px;}
    #footer > address p.contact{padding-bottom:5px;}
    #footer > address p.contact span:first-child{display:block;}
    #footer > address p.copyright span{display:block;}

    /* 테이블 */
    table.type_horizontal thead tr th{padding:10px 7px; font-size:14px;}
    table.type_horizontal tbody tr th{padding:7px; font-size:14px;}
    table.type_horizontal tbody tr td{padding:7px; font-size:14px; letter-spacing:-0.5px;}
    table.type_vertical tbody tr th{padding:10px 7px; font-size:14px;}
    table.type_vertical tbody tr td{padding:7px; font-size:14px; letter-spacing:-0.5px;}

    /* 메인_비쥬얼 */
    #main_visual:before{background:url(/_res/safe/img/m_main_visual.jpg) no-repeat 50% 50%/cover;}
    #main_visual > div{max-width:100%; height:450px; padding:0 20px;}
    #main_visual > div div.textbox{padding-top:150px;}
    #main_visual > div div.textbox h2{font-size:35px; letter-spacing:-0.5px;}
    #main_visual > div div.textbox p{font-size:22px; letter-spacing:-1.5px;}
    #main_visual > div div.textbox p br:last-child{display:block;}
    
    /* 메인_게시판 */
    #main_board{padding:150px 20px 90px;}
    #main_board > div{padding:65px 0 0 0; max-width:100%;}
    #main_board > div .section ul{top:-215px; height:auto;}
    #main_board > div .section ul li{width:100%; height:85px; float:none;}
    #main_board > div .section ul li a:before{left:23px; width:35px; height:35px; background-size:105px 35px;}
    #main_board > div .section ul li:nth-child(2) a:before{background-position:-35px 0;}
    #main_board > div .section ul li:nth-child(3) a:before{background-position:-70px 0;}
    #main_board > div .section ul li a:after{bottom:22px; right:27px; width:41px; height:12px; background-size:41px 12px;}
    #main_board > div .section ul li a{padding:22px 70px; font-size:16px; line-height:1.3;}
    #main_board > div .section ul li a strong{letter-spacing:0; font-weight:500;}
    #main_board > div h3{padding-top:0; padding-bottom:40px; font-size:25px; letter-spacing:-0.5px;}
    #main_board > div ul.tabs{margin-top:8px; position:static; justify-content:center; float:right;}
    #main_board > div ul.tabs li{padding:0;}
    #main_board > div ul.swiper-wrapper{flex-direction:column; width:100% !important; gap:25px;}
    #main_board > div ul.swiper-wrapper > li.empty{padding:70px 0; font-size:14px;}
    #main_board > div ul.tabs li:before{height:10px; top:7px; background-color:#959595;}
    #main_board > div ul.tabs li button{padding:0 18px 0; font-size:16px;}
    #main_board > div ul.tabs li:last-child button{padding-right:0;}
    #main_board > div ul.tabs li button:after{height:2px; margin-top:6px;}

    div.notice_swiper{padding:0;}
    div.notice_swiper ul li{width:100% !important;}
    div.notice_swiper ul li a{height:100%; padding:27px 22px;}
    div.notice_swiper ul li a > div > div span{font-size:9px; letter-spacing:0; line-height:1;}
    div.notice_swiper ul li a > div strong.date{padding-right:5px; font-size:22px; letter-spacing:0; line-height:100%;}
    div.notice_swiper ul li a > div > div{padding-top:2px;}
    div.notice_swiper ul li a h6{max-height:20px; min-height:20px; line-height:20px; margin:4px 0 0; font-size:15px; white-space:nowrap; text-overflow:ellipsis;}
    div.notice_swiper ul li.latest h6:after{content:"N"; display:inline-block; width:18px; height:18px; line-height:18px; margin-left:5px; font-size:10px; font-weight:700; color:#fff; text-align:center; vertical-align:3px; border-radius:50%; background-color:#88c12f;}
    div.notice_swiper ul li a p{display:none;}
    div.notice_swiper div.control{display:none;}
    div.notice_swiper ul li a{height:auto; padding:20px;}
    div.notice_swiper ul li a:after{width:15px; height:13px; background-size:15px 13px;}
    div.notice_swiper ul li a span{font-size:14px;}
    div.notice_swiper ul li a span strong{padding-right:5px; font-size:25px;}
    div.notice_swiper ul li a h6{min-height:24px; max-height:48px; line-height:24px; margin:12px 0; font-size:18px;}
    div.notice_swiper ul li.latest h6:after{width:18px; height:18px; line-height:18px; font-size:11px;}
    div.notice_swiper ul li a p{display:none;}
    div.notice_swiper div.pagination{display:none;}
    div.no_swiper ul.swiper-wrapper{display:block;}
    div.no_swiper ul.swiper-wrapper li{max-width:100%;}
    div.no_swiper ul.swiper-wrapper li + li{margin-top:20px;}

    /* 메인_안전 신문고 */
    #main_suggest{background:url(/_res/safe/img/m_main_visual_02.jpg) no-repeat; background-size:cover;}
    #main_suggest > div{padding:55px 20px 75px; max-width:100%;}
    #main_suggest > div > h3{font-size:25px; letter-spacing:-0.5px; text-align:center;}
    #main_suggest > div > p{width:100%; margin-top:10px; font-size:16px; line-height:1.35; text-align:center;}
    #main_suggest > div > a{position:inherit; margin-top:37px; width:158px; height:50px; line-height:50px; font-size:14px; left:50%; transform:translate(-50%, 0);}
    #main_suggest > div > p strong{font-weight:500;}
    #main_suggest > div > p br{display:block;}
    #main_suggest > div > a span{margin-left:-10px;}
    #main_suggest > div > a span:before{right:-18px; width:6px; height:6px;}

    /* Sub Layout */
    #sub_visual{height:49vw; margin-top:71px; background-size:cover; background-position:70% 0;}
    #sub_visual div{padding:50px 20px 0;}
    #sub_visual div h2{display:block; font-size:30px;}
    #sub_visual div.breadcrum{padding:16px 0 0 0; float:left;}
    #sub_visual div.breadcrum ul{gap:25px;}
    #sub_visual div.breadcrum ul li, #sub_visual > div div.breadcrum ul li a{font-size:14px;}
    #sub_visual div.breadcrum ul li:not(:first-child):before{width:8px; height:8px; left:-20px;}
    #sub_visual div.breadcrum ul li:first-child a:before{width:16px; height:17px; background:url(/_res/sw/img/bg_breadcrum.png) no-repeat 50% 50%/16px 17px;}

    #snb{padding:0 20px; position:relative; margin-top:-30px; z-index:2;}
    #snb div{height:0;}
    #snb div > ul{display:block; height:62px; padding-top:60px; position:absolute; top:0; left:0; background-color:#fff; transition:0.3s all;}
    #snb div > ul > li{display:block; position:static;}
    #snb div > ul > li:before{display:none;}
    #snb div > ul > li > a{display:none; width:100%; height:60px; line-height:60px; padding:0 20px; position:relative; font-size:18px; text-align:left;}
    #snb div > ul > li > a.active{display:block; position:absolute; top:0; left:0; border-bottom:none;}
    #snb div > ul > li > a.active:before{content:""; position:absolute; left:0; bottom:-2px; height:2px; width:100%; background-color:#194895;}
    #snb div > ul > li > a.active:after{content:""; width:12px; height:7px; position:absolute; top:50%; right:20px; background:url(/_res/safe/img/bg_snb_arrow.png) no-repeat 50% 50%/12px 7px; transform:translateY(-50%);}
    #snb div > ul > li ul{top:75px;}
    #snb div > ul > li ul li{margin:0 10px;}
    #snb div > ul > li ul li a{font-size:17px;}
    #snb div > ul > li ul li a.active:before{bottom:-7px;}
    
    #snb.active div > ul{height:auto;}
    #snb.active div > ul > li > a{display:block;}
    #snb.active div > ul > li ul{display:none;}
    
    #sub_title{margin:62px auto;}
    #sub_title h3{font-size:30px; line-height:30px; padding-top:65px;}
    #sub_title h3 span{width:30px; height:10px; margin:0 auto 20px;}
    #sub_title h3 span:before, #sub_title h3 span:after{width:10px; height:10px;}

    #sub_contents{padding:0 20px 50px;}
    #sub_contents div.lang{width:140px; height:40px; margin:0 auto; position:static; border:1px solid #acacac;}
    #sub_contents div.lang a, #sub_contents div.lang span{width:50%; font-size:14px; line-height:38px;}
    #sub_contents h4{font-size:24px;}
    #sub_contents h4:before{height:3px; width:32px;}

    /* 비전 및 추진체계 */
    #sub_contents div.section{margin-top:80px;}
    #sub_contents div.section:first-child{margin-top:0; padding-top:10px;}
    #sub_010101 .section1 .sub_img{height:104px; background:url("/_res/safe/img/m_sub_bg_01.jpg") no-repeat; background-size:cover;}
    #sub_010101 .section1 .sub_img:before{top:5px; right:-5px;}
    #sub_010101 .section1 .sub_img > p{padding-left:17px; padding-top:44px; font-size:14px; letter-spacing:0;}
    #sub_010101 .section1 dl.box{margin-top:50px; border-top:2px solid #000; border-bottom:1px solid #d7d7d7;}
    #sub_010101 .section1 dl.box dt.title{padding:0; width:100%; min-height:auto; font-size:22px; float:none; border:none;}
    #sub_010101 .section1 dl.box dt.title:first-of-type{padding-top:30px;}
    #sub_010101 .section1 dl.box dd{padding:10px 0 45px; width:100%; min-height:auto; font-size:15px; letter-spacing:0.5px; color:#393939; border-top:none; float:none;}
    #sub_010101 .section1 dl.box dd:last-of-type{padding-bottom:22px;}
    #sub_010101 .section1 dl.box dd > ul > li{padding-left:7px;}
    #sub_010101 .section2 img.mobile{display:block;}
    #sub_010101 .safety_table tr th { font-size: 16px; } 
    #sub_010101 .safety_table tr td { padding: 10px; font-size: 14px; } 

    /* 안전보건방침 */
    #sub_010201 > div div.gradient{height:42px;}
    #sub_010201 > div div.gradient:before{left:15px; width:60px; height:21px; background-size:60px 21px;}
    #sub_010201 > div div.text{padding:45px 22px 55px;}
    #sub_010201 > div div.text h4{padding-bottom:40px; font-size:20px; letter-spacing:0px;}
    #sub_010201 > div div.text > p{font-size:15px; letter-spacing:-0.5px; word-break:keep-all;}
    #sub_010201 > div div.text > p br{display:none;}
    #sub_010201 > div div.text ol{padding-left:13px; margin:38px 0 50px;}
    #sub_010201 > div div.text ol > li{margin-bottom:20px; font-size:14px; line-height:1.5;}
    #sub_010201 > div div.text ol > li:last-child{margin-bottom:0;}
    #sub_010201 > div div.text span.date{margin-bottom:20px; font-size:14px; letter-spacing:1px;}
    #sub_010201 > div div.text span.sign{font-size:14px;}
    #sub_010201 > div div.text span.sign strong{margin-left:8px; font-size:14px; letter-spacing:7px;}
    #sub_010201 > div.section1 div.text span.sign img{margin-top:-3px; width:40px; height:31px;}
    #sub_010201 > div.section2 div.text span.sign img{margin-top:2px; width:40px; height:15px;}
    #sub_010201 div > a.download{padding:0 20px; margin-top:20px; width:158px; height:50px; line-height:50px;}
    #sub_010201 div > a.download span{margin-right:10px; font-size:14px;}
    #sub_010201 div > a.download span:before{right:-18px; width:10px; height:14px; background-size:contain;}

    /* 게시판 - 산업재해 및 안전사고 현황 */
    #sub_020101 .section{overflow-x:scroll;}
    #sub_020101 .section h4{margin-bottom:10px;}
    #sub_020101 .section > span{margin-bottom:5px; font-size:14px;}
    #sub_020101 .section table{table-layout:inherit;}

    /* 게시판 - 감염병 발생 현황 */
    #sub_020201 .section{overflow-x:scroll;}
    #sub_020201 .section h4{margin-bottom:10px;}
    #sub_020201 .section > span{margin-bottom:5px; font-size:14px;}
    #sub_020201 .section table{table-layout:inherit;}
    #sub_020201 .section table tbody tr th{padding:10px 7px; font-size:14px;}

    /* 안전 신문고 - 아차사고 사례 발굴 */
    #sub_contents #sub_040201 h4{margin-bottom:10px;}
    #sub_040101 > p{font-size:16px; letter-spacing:0;}
    #sub_040101 .box{margin-top:20px; margin-bottom:50px; padding:30px 25px; min-height:200px;}
    #sub_040101 .box ul > li{padding-left:8px; font-size:15px; letter-spacing:-0.5px;}
    #sub_040101 .box a.download{position:relative; bottom:inherit; padding:0 20px; margin-top:20px; width:158px; height:50px; line-height:50px; text-align:center;}
    #sub_040101 .box a.download span{margin-right:10px; font-size:14px;}
    #sub_040101 .box a.download span:before{right:-18px; width:10px; height:14px;  background-size:contain;}

    /* 안전 신문고 - 안전개선 제안 */
    #sub_contents #sub_040201 h4{margin-bottom:10px;}
    #sub_040201 .box{margin-top:20px; margin-bottom:50px; padding:30px 25px; min-height:200px;}
    #sub_040201 .box ul > li{padding-left:8px; font-size:15px; letter-spacing:-0.5px;}
    #sub_040201 .box a.download{position:relative; bottom:inherit; padding:0 20px; margin-top:20px; width:158px; height:50px; line-height:50px; text-align:center;}
    #sub_040201 .box a.download span{margin-right:10px; font-size:14px;}
    #sub_040201 .box a.download span:before{right:-18px; width:10px; height:14px;  background-size:contain;}

    /* 안전보건관계법령 */
    #sub_050101{overflow-x:scroll;}
    #sub_050101 table.type_horizontal colgroup col.agency{width:25%;}
    #sub_050101 table.type_horizontal tbody tr td.al_left{padding:5px 10px;}
    #sub_050101 table.type_horizontal tbody tr td.m_left{text-align:left;}
    #sub_050101 table.type_horizontal tbody tr td{letter-spacing:0; word-break:break-all; line-height:1.4;}
    #sub_050101 table.type_horizontal tbody tr td p > br{display:none;}
    #sub_050101 table.type_horizontal tbody tr td > a{word-break:break-all;}
    #sub_050101 table.type_horizontal tbody tr td > a > img{padding-top:5px; padding-left:1px;}
}