@charset "utf-8";
/* CSS Document */

/*# sourceURL=/np/datas/css/common.css */
/*@ sourceURL=/np/datas/css/common.css */

/*html{overflow-y: scroll; overflow-x: hidden;}*/
html{overflow-y: scroll;}
body{position:relative; -webkit-print-color-adjust: exact;}
.hide{position:absolute; display:block; overflow:hidden; border:0; width:1px; height:1px; clip: rect(1px, 1px, 1px, 1px); clip-path:inset(50%);}
.tie{display:inline-block;}
.left{text-align:left !important;}
.center{text-align:center !important;}
.right{text-align:right !important;}
a{display:block;}
/*a:focus{outline:1px dotted rgba(19, 196, 197, 0.9) !important;}*/
.ma60{margin-bottom:60px !important;}
.ma30{margin-bottom:30px !important;}
.ma10{margin-bottom:10px !important;}
.ma0{margin-bottom:0px !important;}
.ma00{margin:0px !important;}
.maM20{margin-top:-20px !important;}
.maCe{margin:0 auto !important; display:block;}
.red{color:#e9310f !important; }
.gray{color:#bbb !important; }
.blue{color:#2a6de8 !important; }
.sky{color:#2e90ca !important; }
.green{color:#6abf49 !important; }
.centerBox{width:100%; text-align:center; margin:15px 0;}
.rightBox{width:100%; text-align:right; margin:15px 0;}
.bold{font-weight:bold !important; color:#222;}
.imgCenter{margin:0 auto; max-width:100%; display:block;}
.imgMax{margin:15px 0 40px 0; max-width:100%; display:block;}
.paLe{padding-left:20px !important;}

/* input{height:24px; line-height:24px; padding-left:10px; border:1px solid #ddd; vertical-align:middle; font-family:'malgun gothic','맑은고딕','돋움','Sans-serif',arial;} */
input:-ms-input-placeholder { color: #aaa; }
input::-webkit-input-placeholder { color: #aaa; } 
input::-moz-placeholder { color: #aaa; }
/*인풋 기본 스타일*/


.bx-wrapper{margin:0 auto;} 
.bx-wrapper .bx-viewport{border:none; left:0px; box-shadow:none;}
/*슬라이더 리셋*/

#skip_navigation {position:absolute; float:left; top:0px; left:0px; width:200px; font-size:14px; font-weight:bold; padding-left:10px; height:20px; z-index:9999;}
#skip_navigation a { position:absolute; display:block; height:0; overflow:hidden;}
#skip_navigation a:hover, #skip_navigation a:focus, #skip_navigation a:active { height:auto; background:#333; color:#f9f9f9; padding:10px 10px 10px 10px; }
/*스킵네비*/

.headerMBg{background-color:#fff;}
footer{background-color:#efebeb;}
footer .footerList{background-color:#0f4c81;}
footer .footerList ul li{display:inline-block; margin-right:20px;}
footer .footerList ul li a{display:block; line-height:50px; color:#fff;}
footer .footerAdd:after{content:''; display:block; visibility:hidden; clear:both;}
footer .footerAdd {padding:25px 0; position:relative;}
footer .footerAdd > a{position:absolute; bottom:10px; right:10px;}
footer .footerAdd > div:first-of-type{float:left; width:240px;}
footer .footerAdd > div:nth-of-type(2){float:left; width:1000px;}
footer .footerAdd > div:nth-of-type(2) address{color:#575863; line-height:24px; padding-top:6px; margin-bottom:25px;} 
footer .footerAdd > div:nth-of-type(2) address span{ font-weight:bold;} 
footer .footerAdd > div:nth-of-type(2) .copyright{color:#575863; font-size:13px; padding-right:80px;} 
footer .footerAdd > div:last-of-type{position:absolute; top:31px; right:0; width:360px;}
footer .siteList{display:none;}
footer .siteList:after{content:''; display:block; visibility:hidden; clear:both;}
footer .siteList select{float:left; border:1px solid #fff; height:50px; line-height:50px; padding:10px 20px; width:250px; box-sizing:border-box; background:#546f91 url("/np/resources/images/common/FooSchBul.png") 92% center no-repeat; color:#fff;}    
footer .siteList select option{color:#fff; line-height:30px; padding:10px 20px; display:inline-block;}     
footer .siteList a{float:left; background-color:#c5c5c5; height:50px; line-height:48px; font-weight:bold; font-size:18px; width:100px; border:1px solid #fff; box-sizing:border-box; text-align:center; display:block; margin-left:10px;} 
footer .footerAdd > a{position:absolute; bottom:10px; right:10px;}
/*푸터*/

.bannerBox{padding:15px 0; text-align:left; border-top:1px solid #ddd; background-color:#f9f9f9;}
.bannerAreaIn{width:1130px; margin:0 auto; background-color:transparent;}
.bannerAreaIn .bx-viewport{background-color:transparent;}
.bannerAreaIn li{border-right:1px solid #ddd; height:36px; padding:1px;}
.bannerAreaIn img{width:219px; height:34px; transform:scale(1,1); transition-duration:0.5s;}
.bannerAreaIn img:hover {opacity:0.8;transform:scale(0.9,0.9);}


@keyframes rot{ 
    from {
        transform: rotateX(0deg);
    }

    to {
        transform: rotateX(360deg);
    }
}
.bannerArea .bx-wrapper .bx-prev{left:-32px; background:url("/np/resources/images/common/bannerL.png") no-repeat;}
.bannerArea .bx-wrapper .bx-next{right:-32px; background:url("/np/resources/images/common/bannerR.png") no-repeat;}
.bx-wrapper .bx-controls-direction a{z-index:990;}
/*배너*/
.posterBox{width:100%; max-width:400px;}
.guideBox{display: flex; justify-content: space-between;}

@media all and (max-width:1400px) {   
    /*.headerArea{width:100%; position:fixed; top:0; z-index:9997;}*/
    header{position:relative; height:50px; border-bottom:1px solid #ccc;}
    header .topArea{display:none;}
    header .middleArea{height:50px; position:relative;}
    header .middleArea h1{padding:10px 0; width:140px;}
    header .middleArea h1 img{width:140px;}
    header .middleArea > a{display:none;}
    .lnbBtn,.lnb-bg,.lnb,.searchBtn{display:block; z-index:9;}
    .dep1, .headerSearch{display:none;}
    .searchBtn{position:absolute; top:0px; right:45px; cursor:pointer;}  
    /*.searchBannerBtn{position:absolute; top:10px; right:125px; cursor:pointer; display:none;}*/  
    .lnbBtn{position:absolute; top:0px; right:0px; cursor:pointer;}   
    .headerSearch2{position:absolute; top:-220px; height: 80px; width: 100%; background: #f1f1f1; box-shadow:0px 5px 5px rgba(0,0,0,0.3) ; z-index:9999; box-sizing:border-box; padding:15px;}
    .headerSearch2 .searchBox{border-bottom:3px solid #546f91; position:relative; padding:2px 0;}
    .headerSearch2 .searchBox input{width:100%; line-height:45px; height:45px; font-size:14px; background-color:transparent; box-sizing:border-box; border:none; padding-left:4px;}
    .headerSearch2 .searchBox a{position:absolute; top:0; right:0; display:block;}
    .headerSearch2 .searchCBtn{background-color:#fff; position:absolute; top:-51px; right:45px;}
    /*헤더 검색*/
    .lnb {position: fixed; top: 0; right: -320px; width: 300px; height: 100%; overflow-y: auto; background: #eee; box-shadow:0px 0px 20px rgba(0,0,0,0.5) ; z-index:9999;}
    .lnb .lnb-title { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-indent:10px; }
    .lnb .lnb-title div { height: 70px; line-height: 70px; background: #546f91;}
    .lnb .lnb-title div> a {display:inline-block; padding-left:3px; font-size: 15px; line-height: 70px; color: #fff; }
    .lnb .lnb-title div span {float: right; height: 100%;  }
    .lnb .lnb-title ul { height: 44px; background: #e8f0f9; padding:10px; box-sizing:border-box; text-align:right;}
    .lnb .lnb-title ul li{display:inline-block;}
    .lnb .lnb-title ul li a{display:block; line-height:24px; height:24px; margin-left:3px;}
    .lnb .lnb-title ul li a img{display:inline-block; vertical-align:top;}
    .lnb > ul > li {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 16px; line-height: 45px; text-indent:13px; background: #fff; border-top: 1px solid #ccc;}
    .lnb > ul > li:last-of-type {border-bottom: 1px solid #ccc;}
    .lnb > ul > li > a{ display:block; color:#333; padding-left:10px; background:url("/np/resources/images/common/navB.png") 96% center no-repeat;}
    
    .lnb > ul > li > a:active, .lnb > ul > li > a:focus, .lnb > ul > li > a:hover, .lnb > ul > li > a.active{color:#fff; background:#29405e url("/np/resources/images/common/navW.png") 96% center no-repeat; }
    .lnb > ul > li ol { display:none; }
    .lnb > ul > li > ol > li { line-height: 40px; background: #eee; }
    .lnb > ul > li > ol > li > a{font-size:14px; padding-left:17px; color:#333; display:block;}
    .lnb > ul > li > ol > li > a.d2{background:url("/np/resources/images/common/navS.png") 96% center no-repeat;}    
    .lnb > ul > li > ol > li > a:active, .lnb > ul > li > ol > li > a:focus, .lnb > ul > li > ol > li > a:hover, .lnb > ul > li > ol > li > a.active{color:#fff; background:#95a6ba; }
    .lnb > ul > li > ol > li > a.d2:active, .lnb > ul > li > ol > li > a.d2:focus, .lnb > ul > li > ol > li > a.d2:hover, .lnb > ul > li > ol > li > a.d2.active{background:#95a6ba url("/np/resources/images/common/navSW.png") 96% center no-repeat; }
    .lnb > ul > li > ol > li > a.siteNew:active, .lnb > ul > li > ol > li > a.siteNew:focus, .lnb > ul > li > ol > li > a.siteNew:hover, .lnb > ul > li > ol > li > a.siteNew.active{background:#95a6ba url("/np/resources/images/common/outW.png") 93% center no-repeat; }
    .lnb > ul > li > ol > li > ol { border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
    .lnb > ul > li > ol > li > ol li{ background: #fff; }
    .lnb > ul > li > ol > li > ol li a:before { content: "· "; }
    .lnb > ul > li > ol > li > ol  li a{font-size:14px; line-height:16px; padding:11px 40px; color:#777; display:block; text-indent:-8px;}
    .lnb-bg { position: fixed; top: 0; bottom:0; right:0; left: 0; z-index: 9998; display: none; background: rgba(0, 0, 0, 0.6);}
    /*헤더*/
        
    footer .footerList ul li{margin-right:10px;}
    footer .footerList ul li a{ line-height:40px; font-size:14px;}
    footer .footerAdd > div:first-of-type{display:none;}
    footer .footerAdd > div:nth-of-type(2){width:100%;} 
    footer .footerAdd > div:nth-of-type(2) address{ padding-top:0px; margin-bottom:15px;}
    footer .footerAdd > div:last-of-type{position:absolute; top:20px; left:0; width:100%;}
    footer .siteList select{ height:45px; line-height:23px; width:80%; background:#546f91 url("/np/resources/images/common/FooSchBul.png") 95% center no-repeat;}    
    footer .siteList a{height:45px; line-height:43px; width:18%; margin-left:2%;} 
    /*푸터*/
    }
/*태블릿모바일*/
@media all and (max-width:767px) {   
    html { font-size: 14px; }
    .contents, .pageInfo {width:92%; margin:0 auto;}
     
    #skip_navigation{display:none;}

    .bannerAreaIn{width:86%;}
    /*배너*/ 
}
/*mobile*/
@media all and (min-width:768px) and (max-width:1400px) {
    .contents, .pageInfo {width:95%; margin:0 auto;}
  

    .bannerAreaIn{width:95%;}
    /*배너*/ 
    
}
/*tablet*/
@media all and (min-width:1241px) { 
    .contents, .pageInfo, .guideBox {max-width:1400px; margin:0 auto;}
    header .topArea{width:100%; background-color:#e8f0f9; border-bottom:1px solid #c5ccd4; height:40px; }
    header .topArea .guideBox{position:relative;}
    header .topArea .guideBox > a{display:block; line-height:30px; padding-top:4px; font-size:10px; font-weight:bold; color:#777; width:150px;}
    header .topArea .guideBox > ul{position:absolute; top:8px; right:0;}
    header .topArea .guideBox > ul:after{content:''; display:block; visibility:hidden; clear:both;}
    header .topArea .guideBox > ul li{float:left;}
    header .topArea .guideBox > ul li a{display:block; line-height:24px; height:24px; font-size:13px; color:#666; margin-left:14px;}
    header .topArea .guideBox > ul li a img{display:inline-block; vertical-align:top;}
    header .topArea .guideBox > ul li:nth-of-type(9) a, header .topArea .guideBox > ul li:nth-of-type(10) a{border:1px solid #666; box-sizing:border-box; width:24px; line-height:16px; text-align:center; font-size:26px;}
    header .topArea .guideBox > ul li:nth-of-type(10) a{margin-left:3px;}

    header .middleArea{height:84px; position:relative;}
    header .middleArea h1{display:inline-block; margin-top:18px;}
    header .middleArea a{display:inline-block; margin-left:10px;}
    .headerSearch{position:absolute; top:14px; right:0;}
    .headerSearch .searchBox{border-bottom:3px solid #546f91;}
    .headerSearch .searchBox input{width:270px; line-height:45px; height:45px; font-size:14px; background-color:transparent; border:none; padding-left:4px;}
    
	.lnbBtn, .lnb-bg,.lnb, .searchBtn, .searchCBtn, .headerSearch2{display:none;}
    .navBg{background-color:#0f4c81; width:100%; height:52px; position:relative;}
    .dep1{position:absolute; top:0; left:50%; margin-left:-620px; width:1400px;  z-index:1050;}    
    /*.dep1::before{content:''; width:2000px; position:absolute; top:-3px; height:58px; background-color:#29405e; box-shadow:rgba(0, 0, 0, 0.5) 1px 1px 7px; right:830px; z-index:100;}*/
    .dep1 > ul{position:absolute; top:0; left:50%; margin-left:-620px; width:1400px;  z-index:200;}
    .dep1 > ul > li{float:left; width:16.6%; text-align:center;}    
    .dep1 img{vertical-align:0px;}    
    .dep1 > ul > li > a{text-align:center; line-height:52px; font-size:20px; color:#fff; padding:0px 20px; border-radius:7px; z-index:200;}  
    .dep1 > ul > li:hover > a, .dep1 > ul > li:hover > a:focus{font-weight:bold; }  
    .dep1 > ul > li > .navListArea{position:absolute; top:52px; left:50%; margin-left:-2000px; height:0; overflow:hidden; width:4000px; z-index:1050; box-sizing:border-box; background:linear-gradient(to left, #eaedf0 2205px, transparent 2206px , transparent), linear-gradient(transparent 3px, #eaedf0 6px ,#eaedf0); }
    .dep1 > ul > li > .navListArea.navListShow, .dep1 > ul > li.active > .navListArea{height:auto;}
    .dep1 > ul > li > .navListArea > ol{width:1400px; margin:0 auto; z-index:1060; text-align:left; box-sizing:border-box; padding:15px 0; height:0; overflow:hidden;}
    .dep1 > ul > li.active > .navListArea > ol, .dep1 > ul > li > .navListArea.navListShow > ol{height:auto; padding:22px 0;}
    .dep1 > ul > li > .navListArea > ol > li{width:100%; padding:15px 0; box-sizing:border-box; border-bottom:1px solid #ddd;}
    .dep1 > ul > li > .navListArea > ol > li:last-of-type{border-bottom:none;}
    .dep1 > ul > li > .navListArea > ol > li:after{content:''; display:block; visibility:hidden; clear:both;}
    .dep1 > ul > li > .navListArea > ol > li > a{float:left; box-sizing:border-box; line-height:42px; width:210px; font-size:18px; font-weight:bold; vertical-align:top;}

    .dep1 > ul > li > .navListArea > ol > li > ol{float:left; width:1030px; vertical-align:top; }
    .dep1 > ul > li > .navListArea > ol > li > ol li{width:25%; float:left; vertical-align:top; padding:3px; box-sizing:border-box;}
    .dep1 > ul > li > .navListArea > ol > li > ol li.longTitle{width:50%;}
    .dep1 > ul > li > .navListArea > ol > li > ol li a::before{content:'· ';}
    .dep1 > ul > li > .navListArea > ol > li > ol li a{display:block; border:1px solid #fff; line-height:38px; padding-left:10px; font-size:15px; box-sizing:border-box; letter-spacing:-1px;}
    .dep1 > ul > li > .navListArea > ol > li > ol li a:hover,.dep1 > ul > li > .navListArea > ol > li > ol li a:focus{background-color:#fff;} 
    /*헤더*/
   
    .bannerArea .bx-wrapper .bx-prev{left:-55px;}
    .bannerArea .bx-wrapper .bx-next{right:-55px;}
    /*배너존*/
}
/*pc*/