@import url("/00_common/font/SCDream/fonts.css"); 

#wrap { position: relative; overflow:hidden; font-family:"SCDream"; }
.container { position: relative; width:100%; max-width:60rem; margin:0 auto;}
.container:after { content:""; display:block; clear:both; }

/* slick slide common */
.slick-slider { -webkit-transition: all ease-in-out .3s; transition: all ease-in-out .3s; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-slide { display: none; height: 100%; min-height: 1px; vertical-align: middle; }
.slick-list { overflow: hidden; }
.slick-list.dragging { cursor: pointer; }
.slick-initialized .slick-slide { display: inline-block; }
.slick-arrow.slick-hidden { display: none; }
.slick-current { opacity: 1; display: block; }
.slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; }
/* slick arrow show */
.arwShow .slick-arrow.slick-hidden { display: inline-block; }

/* header */
#header { position: relative; margin: 0 auto; height:140px; background: #fff;}
#header:before { position: absolute; top: 80px; left: 0; width: 100%; height: 1px; background: #ccc; z-index:100; content: ""; }
#header .top { width:96%; height: 80px; padding:1.25rem 0 0; text-align:right; }
#header .top:after { clear: both; display: block; content: ""; }
#header h1 { position: absolute; top: 22px; left: 0; }
#header h1 a { display:block; } 
#header .top .top_menu { position: relative; display:inline-block; }
#header .top .top_menu li { float: left; }
#header .top .top_menu li a { position: relative; display: block; padding: 0 10px; line-height: 38px; font-size: 0.7rem; color: #555; font-weight: 600; } 
#header .top .top_menu li.noti a { background:#eff7ff; line-height:27px; margin:5px 8px 0 0; border-radius:27px; color:#747774;  } 
#header .top .top_menu li.new a:before { content:"N"; position:absolute; left:-10px; top:-5px; width:20px; height:20px; background:#2b7bcc; border-radius:50%; font-size:10px; color:#fff; text-align:center; line-height:20px; }
#header .top .top_menu li.noti a strong { color:#2b7bcc; }
#header .top .top_menu li a:hover,
#header .top .top_menu li a:focus { text-decoration:underline; }
#header .top .top_menu li + li a:before { position: absolute; top: 16px; left: 0; width: 4px; height: 4px; background: #9ea6af; border-radius: 50%; content: ""; }
#header .mBtn{ display:none; } 

/* 통합검색 */
.box_search_0 { position:relative; display:inline-block;  width: 220px; height: 37px; overflow: hidden; }
.box_search_0 input { padding:0 10px; width:100%; height: 37px; line-height: 35px; padding-right:37px; border-radius:20px;  font-size: 0.6rem; border: 1px solid #00b9c9; background:#f5fcfd; }
.box_search_0 button { position: absolute; top:0; right:0; padding: 0; width: 37px; height: 37px; line-height:37px; color:#fff; background: #00b9c9; border: none; border-radius:50%; font-size:.9rem; }
.box_search_0 input::-webkit-input-placeholder { color: #555; }
.box_search_0 input::placeholder { color: #555; }

/* web navigation */
/* gnb common */
#nav{ position:relative; width:100%; z-index:99; }
#gnb{ position:relative; height:50px; z-index:2; }
#gnb li a{ position:relative; display:block; font-weight:400; }
#gnb li a span{ position:relative; z-index: 2;}
#gnb .depth01{ width:100%; max-width:60rem; margin:0 auto; z-index:1; }
#gnb .depth01 > ul{ text-align:center; width:100%; font-size:0; line-height:0; }
#gnb .depth01 > ul > li{ display:inline-block; vertical-align:top; font-size:.8rem; line-height:1.6; }
#gnb .depth01 > ul > li.on > a{ color:#005a8b; }
#gnb .depth01 > ul > li > a{ display:flex; width:100%; height:3rem; line-height:1.2; line-height:1.2; justify-content: center; align-items: center; font-size:0.85rem; color:#333; padding:0 3rem; font-weight:600; }
#gnb .depth01 > ul > li > a:before{content:""; position:absolute; left:50%; bottom:0; width:0px; height:4px; z-index: 1; background:#005a8b; }
#gnb .depth01 > ul > li > a > span{ display:inline-block; }
#gnb .depth01 > ul > li > a[target='_blank'] > span:after{ content:"\e980"; display:inline-block; padding-left:.25rem; font-family: 'xeicon'; font-size:.9rem; }
#gnb .depth01 > ul > li.on > a:before{ left:0; width:100%; }
#gnb .depth01.depWidth > ul { display:table; }
#gnb .depth01.depWidth > ul > li{ display:table-cell; }
#gnb .depth01.depWidth > ul > li > a{ padding:0; }
#gnb .depth02{ width:100%; height:auto; text-align:left; }
#gnb .depth02 > ul{ padding:.75rem 0; }
#gnb .depth02 > ul > li.dep:hover:before { color:#fff; }
#gnb .depth02 > ul > li.dep > a{ padding-right:1.25rem; }
#gnb .depth02 > ul > li > a{ color:#111; font-weight:400; padding:.65rem 1rem; font-size:.75rem; outline:none;}
#gnb .depth02 > ul > li > a[target='_blank'] > span:after{ content:"\e980"; display:inline-block; padding-left:.25rem; font-family: 'xeicon'; vertical-align: middle; font-size:.8rem; }
#gnb .depth03{ position:relative; display:none; }
#gnb .depth03 > ul{ padding:.5rem; }
#gnb .depth03 > ul > li + li{margin-top:.25rem;}
#gnb .depth03 > ul > li > a{ font-size:.7rem; padding-left:.5rem; padding-right: 1rem; color:#000; opacity: .8; border-bottom: 1px solid transparent;}
#gnb .depth03 > ul > li > a:before{content:""; position:absolute; left:0; top:.5rem; width:3px; height:3px; border-radius:50%; background:#333;}
#gnb .depth03 > ul > li > a::after{content: '\e93f'; font-family: 'xeicon'; position: absolute; right: 0; top: 0; font-size: 0.7rem;}
#gnb .depth03 > ul > li > a[target='_blank'] > span:after{ content:"\e980"; display:inline-block; padding-left:.15rem; font-family: 'xeicon'; vertical-align: middle; font-size:.7rem; }
#gnb .depth03 > ul > li > a:hover,
#gnb .depth03 > ul > li > a:focus{ opacity: 1; border-bottom: 1px solid #005a8b; color: #005a8b; font-weight: 700;}
#gnb .depth03 > ul > li > a:hover:before,
#gnb .depth03 > ul > li > a:focus:before{background: #005a8b;}
#gnb .active > .depth03{ display:block; }
#gnb:before, #nav a, #gnb li > a:before, #gnb li > a:after, #gnb li > a > span:before{ transition: all .1s; -webkit-transition: all .1s; }

/* gnb : fullDown */
#nav.fullDown #gnb{ height:3rem; overflow:hidden; }
#nav.fullDown #gnb:before{ content:''; position:absolute; left:0; top:calc(3rem - 2px); width:100%; height:2px; background:#005a8b; z-index:2; }
#nav.fullDown #gnb:after{ content:""; position:absolute; left:0; top:1px; width:100%; height:0; background:#fff; z-index:0; opacity: 0; box-shadow:0 5px 10px rgba(0,0,0,0.1); border-bottom: 2px solid #005a8b;}
#nav.fullDown ul,
#nav.fullDown li{ height:100%; }
#nav.fullDown .depth01{ position:relative; height:3rem; }
#nav.fullDown .depth01 > ul{ display:table; }
#nav.fullDown .depth01 > ul > li{ position:relative; display:table-cell; }
#nav.fullDown .depth01 > ul > li.on{background:#f5f5f5; border-right: 1px solid transparent;}
#nav.fullDown .depth01 > ul > li:before{ content:""; position:absolute; right:-2px; top:1px; width:2px; height:calc(3rem - 2px); background:#fff; z-index:1; }
#nav.fullDown .depth01 > ul > li:first-child:after{ content:""; position:absolute; left:-2px; top:1px; width:2px; height:calc(3rem - 2px); background:#fff; z-index:1;}
#nav.fullDown .depth01 > ul > li + li{ border-left:1px solid transparent; }
#nav.fullDown .depth01 > ul > li > a{ background:#fff; }
#nav.fullDown .depth01 > ul > li.on > a{ color:#005a8b !important; font-weight: 700;}
#nav.fullDown .depth02{ position:relative; left:auto; top:auto; opacity: 0; visibility: hidden; transition-delay: .0s; }
#nav.fullDown .depth02 > ul {padding:0.5rem 0 1rem;}
#nav.fullDown .depth02 > ul > li > a{ padding:.35rem 1.5rem .35rem .75rem;}
#nav.fullDown .depth02 > ul > li > a::after{width: 100%; height: 100%; background: #005a8b; position: absolute; top: 0; right: 0; opacity: 0; z-index: 1; transition: width 0.25s; -webkit-transition: width 0.25s; box-shadow: 0 0 0.25rem rgba(0,0,0,0.5); content: '';}
#nav.fullDown .depth02 > ul > li.dep > a:before{content:'\e913'; position:absolute; right:0.5rem; top:0.45rem; font-family: 'xeicon'; font-size:0.7rem; z-index: 2;}
#nav.fullDown .depth03{background:#fff;}
#nav.fullDown .depth03 > ul{padding:.5rem;}
#nav.fullDown .depth03 > ul > li > a{font-size:.7rem;}
/** fullDown:active **/
#nav.fullDown #gnb.active{ height:auto; padding-bottom:1rem;}
#nav.fullDown #gnb.active:after{ height:calc(100% - 1rem + 1px); opacity: 1; }
#nav.fullDown .active .depth01 {height:auto; }
#nav.fullDown .active .depth01 > ul > li:before{height: calc(3rem - 2px);}
#nav.fullDown .active .depth01 > ul > li > a{ color:#000; }
#nav.fullDown .active .depth01 > ul > li{ border-color:#ccc; }
#nav.fullDown .active .depth01 > ul > li.on{border-color: #6795d7;}
#nav.fullDown .active .depth01 > ul > li:first-child.on{border-left: 1px solid #6795d7;}
#nav.fullDown .active .depth01 > ul > li + li > a:before{ opacity: 1; }
#nav.fullDown .active .depth02{ opacity: 1; visibility: visible; }
#nav.fullDown .depth02 > ul > li > a:hover,
#nav.fullDown .depth02 > ul > li > a:focus,
#nav.fullDown .depth02 > ul > li.active > a{color:#fff; background: #005a8b; font-weight: 700;}
#nav.fullDown .depth02 > ul > li.active > a::after{opacity: 1; width: calc(100% + 0.75rem);}
#nav.fullDown .depth02 > ul > li.dep.active > a:before{content:'\e91a';}
/* gnb : oneDown */
#nav.oneDown #gnb{ height:3rem; }
#nav.oneDown #gnb:before{ content:''; position:absolute; left:0; top:calc(2.9rem + 1px); width:100%; height:2px; background:#005a8b; z-index:1; }
#nav.oneDown ul,
#nav.oneDown li{ height:100%; }
#nav.oneDown .depth01{ position:relative; }
#nav.oneDown .depth01 > ul{ width:100%; text-align:center; }
#nav.oneDown .depth01 > ul > li{ position:relative; display:inline-block; float:none; }
#nav.oneDown .depth01 > ul > li > a:before{display:none;}
#nav.oneDown .depth02{ position:absolute; width:120%; left:-10%; top: calc(3rem - 4px); border-left: 1px solid #6694d5; border-right: 1px solid #6694d5; border-top: 4px solid #005a8b; border-bottom: 2px solid #005a8b; opacity: 0; visibility: hidden; transition-delay: .0s; text-align:left; box-shadow: 2px 2px 5px rgba(0,0,0,0.3);}
#nav.oneDown .depth02:before{ content:""; position:absolute; left:0; top:0; width:100%; height:0; background:#f5f5f5; z-index:0; opacity: 0; }
#nav.oneDown .depth02 > ul > li > a{padding:.25rem .5rem;}
#nav.oneDown .depth02 > ul > li > a::after{width: 100%; height: 100%; background: #005a8b; position: absolute; top: 0; right: 0; opacity: 0; z-index: 1; transition: width 0.25s; -webkit-transition: width 0.25s; box-shadow: 0 0 0.25rem rgba(0,0,0,0.5); content: '';}
#nav.oneDown .depth02 > ul > li > a > span{z-index:0; padding:0 .25rem; position: relative; z-index: 2;}
#nav.oneDown .depth02 > ul > li > a > span:before{content:""; position:absolute; left:50%; bottom:0; width:0; height:.5rem; border-radius:.5rem; background:#005a8b; z-index:-1; opacity: 0;}
#nav.oneDown .depth02 > ul > li.dep > a:before{content:'\e913'; position:absolute; right:0.5rem; top:0.4rem; font-family: 'xeicon'; font-size:0.65rem; z-index: 2;}
#nav.oneDown .depth03{background:#fff;}
/** oneDown : active **/
#nav.oneDown .depth01 > ul > li.on > .depth02{ opacity: 1; visibility: visible; display:block; }
#nav.oneDown .depth01 > ul > li.on > .depth02:before{ height:100%; opacity: 1; }
#nav.oneDown .depth02 > ul > li.dep.active > a:before{content:'\e91a';}
#nav.oneDown .depth02 > ul > li > a:hover,
#nav.oneDown .depth02 > ul > li > a:focus,
#nav.oneDown .depth02 > ul > li.dep.active > a{ background: #005a8b; color: #fff;}
#nav.oneDown .depth02 > ul > li > a:hover > span:before,
#nav.oneDown .depth02 > ul > li > a:focus > span:before,
#nav.oneDown .depth02 > ul > li.dep.active > a > span:before{left:0; width:100%; opacity: 0.2;}

#nav.oneDown .depth02 > ul > li.dep.active > a::after{opacity: 1; width: calc(100% + 0.75rem);}

/* gnb : oneFull */
#nav.oneFull #gnb{ height:3rem; }
#nav.oneFull #gnb:before{ content:''; position:absolute; left:0; top:calc(2.9rem + 1px); width:100%; height:2px; background: #005a8b; z-index:1; }
#nav.oneFull ul,
#nav.oneFull li{ height:100%; }
#nav.oneFull .depth01 > ul{ width:100%; text-align:center; font-size:0; line-height:0; }
#nav.oneFull .depth01 > ul > li{ display:inline-block; float:none; vertical-align: top; font-size:.8rem; line-height:1.6; }
#nav.oneFull .depth02{ position:absolute; left:0; top:3rem; opacity: 0; visibility: hidden; transition-delay: .0s; text-align:left; }
#nav.oneFull .depth02:before{ content:""; position:absolute; left:0; top:0; width:100%; height:0; background:#fff; z-index:0; opacity: 0; box-shadow:0 5px 10px rgba(0,0,0,0.1); border-bottom: 2px solid #005a8b;}
#nav.oneFull .depth02 > ul{ width:100%; max-width:60rem; margin:0 auto; font-size:0; line-height:0; }
#nav.oneFull .depth02 > ul > li{ width:25%; display:inline-block; vertical-align: top; padding:.5rem; font-size:.8rem; line-height:1.6; }
#nav.oneFull .depth02 > ul > li.dep > a:before{content:'\e913'; position:absolute; right:0.75rem; top:0.6rem; width:1.5rem; height:1.5rem; line-height:1.5rem; text-align:center; font-family: 'xeicon'; color:#fff; font-size:.85rem; border-radius:50%; background:#005a8b;}
#nav.oneFull .depth02 > ul > li > a{font-size:.75rem; border:2px solid #005a8b; }
#nav.oneFull .depth02 > ul > li > a:hover,
#nav.oneFull .depth02 > ul > li > a:focus,
#nav.oneFull .depth02 > ul > li.dep.active > a{ background: #005a8b; color: #fff; }
#nav.oneFull .depth02 > ul > li > a[target='_blank'] > span:after{display: none;}
#nav.oneFull .depth02 > ul > li > a[target='_blank']::after{content:'\e980'; position:absolute; right:0.75rem; top:0.6rem; width:1.5rem; height:1.5rem; line-height:1.5rem; text-align:center; font-family: 'xeicon'; color:#fff; font-size:.85rem; border-radius:50%; background:#005a8b;}
#nav.oneFull .depth03{ margin:0; opacity: 0; }
#nav.oneFull .depth03 > ul > li > a:before{background:#005a8b;}
/** oneFull:active **/
#nav.oneFull #gnb.active{ height:auto; }
#nav.oneFull .depth02 > ul > li.dep > a:hover:before,
#nav.oneFull .depth02 > ul > li.dep > a:focus::before,
#nav.oneFull .depth02 > ul > li.dep.active > a:before{background:#fff; color: #005a8b;}
#nav.oneFull .depth02 > ul > li.dep.active > a:before{content:"\e91a"; }
#nav.oneFull .depth02 > ul > li > a:hover[target='_blank']::after{background: #fff; color: #005a8b;}
#nav.oneFull .depth02 > ul > li.active .depth03{ opacity:1; display:block; background: #f5f5f5; box-shadow: 0.2rem 0.2rem 0.2rem rgba(0,0,0,0.1);}
#nav.oneFull .depth01 > ul > li.on > .depth02{ opacity: 1; visibility: visible; }
#nav.oneFull .depth01 > ul > li.on > .depth02:before{ height:100%; opacity: 1; transition-delay: 0s; -webkit-transition-delay: 0s; }

/* mobile layout */
#tablet {display: none; width: 100%;}
#tabletHeader {position: fixed; top: 0; left: 0; width: 100%; height:80px; background: #fff; border-bottom: 1px solid #e0e0e0; z-index: 10;}
#tabletLogo {padding: 1.3rem 0 0; text-align: center;}
#tabletLogo a { display:inline-block; }
#tabletLogo a img { vertical-align:middle; }

#header .mBtn{ display:block; position:absolute; top:10px; width:45px; height:45px; line-height:45px; font-size:26px; color:#fff; text-align:center; border-radius: 10px;}
#header .mBtn.mSearch{ right:2%; background: #005a8b; }
#header .mBtn.mNav{ left:2%; background: #fcd462; color:#000; }

#menuOpen {position: fixed; top:16px; left:1rem; z-index: 11; width:2.7rem; height:2.7rem; line-height:2.7rem; }
#menuOpen a { display:block; overflow:hidden; width:100%; height:100%; background:#fff; border-radius:0.5rem; font-size:1.6rem; text-align:center; color: #00bac9; border: 2px solid #00bac9;} 
  
/* mobile 검색영역 */
#searchOpen { position: fixed; right:1rem; top:16px; z-index: 11; width:2.7rem; height:2.7rem; line-height:2.7rem;}
#searchOpen a { display:block; overflow: hidden; width:100%; height:100%; background:#00bac9; border-radius:0.5rem; font-size:1.6rem; color:#fff; text-align:center; } 

#mSearch { opacity:0; visibility:hidden; position: fixed; top:80px; left: 0; z-index: 11; width: 100%; background-color: #fff; box-shadow:5px 5px 10px rgba(0,0,0,0.15); -webkit-transition: 0.25s ease; -ms-transition: 0.25s ease; transition: 0.25s ease; }
#mSearch .con {position:relative; margin:1rem;}
#mSearch .con p { position: relative; border-radius:0.5rem; border:2px solid #00bac9; overflow:hidden;}
#mSearch .con .inputText { width: 100%; padding: 0 53px 0 10px; height:43px; line-height:43px; background: #fff; border:0; }
#mSearch .con .btnSearch { position: absolute; top: 0; right: 0; width:43px; font-size: 1rem; height:43px;line-height:43px; color: #fff; background-color: #00bac9; }
#mSearch .btnSearchClose { position:absolute; right:0; top:-83px; display:block; overflow: hidden; width:2.7rem; height:2.7rem;  border-radius:0.5rem; background:#00bac9; font-size:1.6rem; color:#fff; text-align:center;  }
#mSearch.active {opacity:1; visibility:visible;}

/* moblie navigation  */
#mNavi {position:fixed; top: 0; left: -100%; width:100%; height:100vh; background-color: #fff; transition: 0.25s ease; -webkit-transition: 0.25s ease; z-index:50; overflow-y:auto;} 
#mNavi #mtitle {position: relative; width: 100%; height:80px; /*background: #fff url('/images/template/T0003/main/logo.png') no-repeat left 1rem center;*/ z-index: 12;}
#mNavi #mtitle a {position: absolute; right:1rem; top:1.2rem; width:2rem; height:2rem; background:#fff; border: 2px solid #00bac9; border-radius:50%; text-align:center; font-size:0; line-height:2rem; }
#mNavi #mtitle a:before { content:"\e921"; font-family:"xeicon"; position:absolute; left:0; top:0; width:100%; height:100%; color:#00bac9; font-size:0.9rem; }
#mNavi.active {left: 0;}
#mNavi.active::before {left: 0;}

#mNavi #mgnb {position: relative; z-index: 12;}
#mNavi #mgnb .snb {border-top: 3px solid #ccc; border-bottom: 3px solid #ccc; padding:0.5rem; text-align:center; background:#f5f5f5; } 
#mNavi #mgnb .snb li {display: inline-block; border-bottom:none; }
#mNavi #mgnb .snb li a { position:relative; display: inline-block; padding: 0 1rem; line-height:20px; font-size: 0.7rem; vertical-align: middle;}
#mNavi #mgnb .snb li + li a:before { content:""; position:absolute; left:0; top:0.3rem; width:1px; height:0.5rem; background:#ccc; } 
#mNavi #mgnb .snb li.new a { padding-left:25px; }
#mNavi #mgnb .snb li.new a:before { content:"N"; position:absolute; left:0; top:0; width:20px; height:20px; background:#2b7bcc; border-radius:50%; font-size:10px; color:#fff; text-align:center; line-height:20px; }
#mNavi #mgnb .snb li.noti a strong { color:#00bac9; }

#mNavi #mgnb ul {overflow: hidden}
#mNavi #mgnb ul li {position: relative; border-bottom: 1px solid #ddd; }
#mNavi #mgnb > ul > li > a {display: block; padding: 0 0 0 1rem; height: 2.5rem; line-height: 2.5rem; }
#mNavi #mgnb > ul > li > a:hover, 
#mNavi #mgnb > ul > li > a:focus, 
#mNavi #mgnb > ul > li > a:active {background:#00bac9; color:#fff;}
#mNavi #mgnb > ul > li.row > a { padding-right:2rem; }
#mNavi #mgnb > ul > li.row > a:before { content:"\e913"; position:absolute; right:1rem; top:0; font-family:"xeicon"; }
#mNavi #mgnb > ul > li.on > a:before { content:"\e91a"; }

#mNavi #mgnb ul li ul {display: none; padding:0.5rem 1rem; background-color: #f5f5f5;}
#mNavi #mgnb ul li ul li {border-bottom: 0; background-color: #f5f5f5}
#mNavi #mgnb ul li ul li a {font-size: 0.75rem; padding:0.3rem 0.5rem; }
#mNavi #mgnb ul li ul li a:after { content:""; position:absolute; left:0; top:0.8rem; width:3px; height:3px; background:#555; }
#mNavi #mgnb ul li ul li a:hover,
#mNavi #mgnb ul li ul li a:focus,
#mNavi #mgnb ul li ul li a:active { color:#00bac9; font-weight:700; }
#mNavi #mgnb > ul > li ul li.row > a { padding-right:1rem; }
#mNavi #mgnb > ul > li ul li.row > a:before { content:"\e942"; position:absolute; right:0; top:0.4rem; font-size:1rem; font-family:"xeicon"; }
#mNavi #mgnb > ul > li ul li.on > a:before { content:"\e945"; }

#mNavi #mgnb ul li ul li ul {display: none; padding:0.5rem; background:#fff; }
#mNavi #mgnb ul li ul li ul li a {padding:0.2rem 0 0.2rem 1rem; font-size: 0.7rem; color: #555; background:#fff;}
#mNavi #mgnb ul li ul li ul li a:after { content:""; position:absolute; left:0.5rem; top:0.7rem; width:0.3rem; height:2px; background:#555; }
 

/* mgnb */
#mgnb div,
#mgnb ul{overflow:hidden;}
#mgnb li, 
#mgnb li a{display:block; position:relative;}
#mgnb li a[target='_blank']:after{display:inline-block; padding-left:.25rem; font-family: 'xeicon'; font-weight: 400; content: '\e980'; }
#mgnb li a{ font-weight: 600; font-size:.75rem;}
#mgnb .depth01 > ul > li { border-bottom: 1px solid #ccc; }
#mgnb .depth01 > ul > li > a { padding:.75rem 1rem; font-size:.9rem; }
#mgnb .depth02{ display: none; padding:.5rem 1rem; border-top:2px solid #005a8b; background:#f2f2f2;}
#mgnb .depth02 > ul > li > a { padding:.4rem 2rem .4rem 0; font-size:.85rem;}
#mgnb .depth03 {display: none; padding:1rem; }
#mgnb .depth03 > ul > li + li { margin-top:.5rem;}
#mgnb .depth03 > ul > li > a { padding-left:12px; color:#666; font-size:.8rem;}
#mgnb .depth03 > ul > li > a:before{content:""; position:absolute; left:0; top:.45rem; width:5px; height:5px; border-radius:50%; background:#ccc; }
/* depth, _blank icon */
#mgnb li.dep > a:before{ position: absolute; font-family: 'xeicon'; font-size:1rem; }
#mgnb .depth01 > ul > li.dep > a:before{content: '\e9c5'; top:1rem; right:1rem;}
#mgnb .depth02 > ul > li.dep > a:before{content: '\e936'; top:.4rem; right:0; width:1.2rem; height:1.2rem; line-height:1.2rem; border-radius:50%; text-align:center; background:#333; font-size:.7rem; color:#f2f2f2; }
/* mgnb : active */
#mgnb li a:hover, 
#mgnb li a:focus, 
#mgnb li.active > a { color: #005a8b; }
#mgnb .depth02 > ul > li.dep > a:hover:before,
#mgnb .depth02 > ul > li.dep > a:focus:before{background:#005a8b;}
#mgnb li.dep.active > div{display:block;}
#mgnb .depth01 > ul > li.dep.active > a:before{content: '\e9c1'; }
#mgnb .depth02 > ul > li.dep.active > a:before{content: '\e930'; }

/* footer */
#footer { position: relative; padding: 1rem 0 2.5rem; border-top:1px solid #e5e5e5; font-weight:400; font-size: 0.7rem; background: #fff; color: #333;}
.footer_link ul { overflow:hidden; margin-bottom: 0.5rem;}
.footer_link li { float: left; line-height:1.5rem; }
.footer_link li a { display: block; padding-right:16px; margin-right:15px; letter-spacing: -0.025em; color:#333; background: url('/00_common/images/common/bar_footer.png') no-repeat right center; }
.footer_link li:last-child a { padding-left: 0; background: none; }
.footer_link li a:hover,
.footer_link li a:focus { text-decoration:underline; }
.footer_link li a strong { color: #005a8b; font-weight:600; }
#footer address { line-height: 2; padding-right:14rem; }
#footer address span { display:inline-block; margin-right:5px; }
#footer .copyright { margin-top: 0.5rem; color:#959595; }
#footer .btn_top { display:block; overflow:hidden; position:fixed; right:0; bottom:35px; z-index:100; width:2.6rem; height:2.6rem; }
#footer .btn_top img { width:100%; height:100%; }

/* quickMenu */
.quickMenu{position:fixed; right:-10rem; top:8.5rem; z-index:101; transition: right .2s; -webkit-transition: right .2s;}
.quickMenu .toggleBtn{position:absolute; left:-2rem; top:0.5rem; width:3.5rem; height:3rem; border-radius:0.75rem; padding-left:.5rem; background:rgba(0,0,0,0.7); box-shadow: 0 0 10px rgba(0,0,0,0.2); z-index:-1;}
.quickMenu .toggleBtn:before{content:"\e93c"; display:inline-block; color:#fff; line-height:3rem; font-size:1.2rem; font-family: 'xeicon';}
.quickMenu .inner {position: relative; background:#fff; border: 0.5rem solid #0077d1; border-radius:1.1rem; box-shadow: 0 0 10px rgba(0,0,0,0.2);}
.quickMenu h3{height: 2.5rem; line-height: 2.5rem; text-align:center; color:#0077d1; font-weight: 700; font-size:1rem; z-index:100;}
.quickMenu ul{padding:0.75rem 1rem; width:9rem; border-top:2px dotted #cacaca; visibility: hidden;}
.quickMenu li a{ position:relative; display:block; padding: 0.25rem 0 0.25rem 0.5rem; font-size: 0.75rem; color:#333; word-break: keep-all;}
.quickMenu li a:before{content:""; position:absolute; left:0; top:.7rem; width:.25rem; height:.25rem; border-radius:50%; background:#525c6e; }
/* active */    
.openPop .quickMenu{top:15rem;}
.quickMenu.active{right:1rem;}
.quickMenu.active ul{visibility :inherit;}
.quickMenu.active .toggleBtn:before{content:"\e93f";}

/* 방문자수 */
.visitant { position:absolute; top:0; right:0; width:23%; height:2rem; background:#005a8b; border-radius:40px; }
.visitant h2 { text-indent:-10000em; font-size:0; }
.visitant ul { overflow:hidden; }
.visitant ul li { width:49%; float:left; line-height:2rem; text-align:center; color:#fff; font-size:0.65rem; }
.visitant ul li + li { background: url('/00_common/images/common/bar_visitant.png') no-repeat left center; }
.visitant ul li strong { margin-right:0.5rem; color:#00ceec; font-weight: 400; }

/* 구글 번역 */
.gbSchlTrans {position: absolute; top: 2.5rem; right:0; display: inline-block; width:23%; vertical-align: middle; border: 1px solid #d1d8e4; background: #fff; border-radius: 1.5rem;}
.goog-te-gadget-simple {position: relative; display: block !important; padding: 0.5rem 1.25rem !important; font-size: 0.7rem !important; background-color: #fff !important; border: none !important; border-radius: 1.5rem; cursor: pointer; zoom: 1;}
.goog-te-gadget-icon {margin-left: 5px; margin-right: 5px;}
.goog-te-gadget img {border-radius: 50%;}
.goog-te-gadget-simple .goog-te-menu-value span {font-family: 'NotoSans';}
.goog-te-gadget-simple .goog-te-menu-value img + span {position: absolute; top: 0.65rem; right: 1.25rem; font-size: 0.5rem !important; color: #000 !important; border: none !important;}

/* sub layout */
#sub_container { position:relative; }
#sub_container:after { content:""; display:block; clear:both; }
.subCntBody { position:relative; max-width:62rem; margin:-1.5rem auto 0; } 
#subContent{min-height:30rem; font-weight: 400; line-height:1.6; font-size:.75rem; padding:0 0 2.5rem;}

/* 서브비주얼 */
.subvisual{ position:relative; width:100%; line-height:0; overflow:hidden; }
.subvisual img{ position:relative; width:auto; height:auto; left:50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);}

/* 서브메뉴 */
#snb {height:3.25rem; line-height:3.25rem; background:#497bc3; border-radius:1.5rem 1.5rem 0 0; margin-top:-1.5rem; } 
#snb .snb_wrap { position:relative; padding-left:3.25rem; }
#snb .home {position:absolute; left:0; top:0; display: inline-block; width: 3.25rem; height: 3.25rem; background: rgba(0,0,0,0.1); border-radius:1.5rem 0 0 0; }
#snb .home:after {display: block; text-align: center; font-family: "xeicon"; font-size: 1.2rem; color: #fff; content: "\e900";}
#snb a { position: relative; display: block; font-size: 0.8rem; color:#333; }
#snb ul { position: absolute; left: 0; top: 0; padding-top: 3.25rem; height: 3.25rem; }
#snb ul.open { height: auto; } 
#snb ul.open > li { visibility: visible; opacity: 1; }  
#snb ul.open > li.active > a:after { width: 100%; }
#snb ul.open > li.active > a:before { -webkit-transform: rotate(180deg); transform: rotate(180deg); opacity:1; }
#snb li { position:relative; width: 100%; opacity: 0; visibility: hidden;  }
#snb li a{line-height:1.6; font-size:0.75rem; } 
#snb li.active { position: absolute; top: 0; left: 0; display: table; width: 100%; height: 3.25rem; visibility: visible; opacity: 1; z-index:1;  }
#snb li.active:before { content:""; position:absolute; right:0; top:1rem; width:1px; height:1.25rem; background:#fff; opacity:0.5; } 
#snb li.active > a { display: table-cell; color:#fff; vertical-align: middle; padding:0 2rem 0 1rem; }
#snb li.active > a:before { content: "\e941"; position: absolute; right: 1rem; top: 0;  font-family: 'xeicon'; font-weight: normal; line-height:3.25rem; opacity:0.65;} 
#snb li:not(.active) > a {  padding: 0.6rem 1rem; background: #fff; border:1px solid #ccc; border-top:none;}
#snb li:not(.active):last-child > a { border-radius:0 0 0.5rem 0.5rem;}
#snb li:not(.active) > a:hover,  
#snb li:not(.active) > a:focus { background:#f1f2f4; color:#3277dd;}
#snb li:not(.active) > a span { position: relative; padding: 0.25rem 0; }
#snb li > a[target='_blank'] > span:after { content: "\e980"; display: inline-block; margin-left: 5px; font-size: 0.8rem; font-family: 'xeicon'; }
#snb .dep01 { width:11.6rem; position: relative; z-index: 3; }
#snb .dep01 > li { width: 100%; } 
#snb .dep02,
#snb .dep03 { left: 100%; width: 100%; }
#snb li, #snb a, #snb :before, #snb :after{transition: all .3s; -webkit-transition: all .3s;}


/* 페이지 타이틀 */
#subContent #pageTitle { position:relative; display:block; font-size:1.3rem; letter-spacing:-1px; color:#111; font-weight: 400; padding:2rem 0 1rem 0; margin-bottom:2.5rem; text-align:center; border-bottom:1px dotted #d0d5df; } 
#subContent #pageTitle:before{ content:""; position:absolute; top:1.8rem; left:50%; margin-left:-0.75rem; width:1rem; height:1rem; background:#0085d8; border-radius:50%; opacity:0.43; z-index:-1;}
#subContent #pageTitle:after{ content:""; position:absolute; top:1.8rem; right:50%; margin-right:-0.75rem; width:1rem; height:1rem; background:#00d3d5; border-radius:50%; opacity:0.43; z-index:-1;}
#subContent #pageTxt {margin:8px 0 30px 0; color:#666; font-size:13px; line-height:150%; font-weight: 200;}

/* etc : sns */ 
.snsBox {position:absolute; top:0; right:0; height:3.25rem; text-align:right; z-index:2;} 
.snsBox:after {content:""; position:absolute; left:50%; top:1rem; width:1px; height:1.25rem; background:#fff; opacity:0.5;}
.snsBox > button { width:2.5rem; text-align:center; height:3.25rem; font-size:0;} 
.snsBox > button:before { font-size:1rem; font-family:"xeicon"; color:#fff;  }
.snsBox .btnPrint:before {content:"\e9bb"; } 
.snsBox .btnShare:before {content:"\e9e9";}
.sns_more {display:none; position:absolute; width:190px; right:3rem; top:3.5rem; }
.sns_more button {display:inline-block; width:34px; height:34px; overflow:hidden; background:url("/00_common/images/sub_com/btnSns.png") no-repeat 0 0; cursor:pointer}
.sns_more .btnFbook {background-position:0 0;}
.sns_more .btnTwt {background-position:-34px 0;}
.sns_more .btnkko {background-position:-68px 0;}
.sns_more .btnkks {background-position:-102px 0;}
.sns_more .btnBlog{background-position:-136px 0;} 

/* media query mobile */
@media screen and (max-width: 1280px){   

    .quickMenu{display:none;}
}

@media screen and (max-width: 1240px){ 
    
    .container { padding:0 1rem;}

	/* oneDown */
	#nav.oneDown .depth02{ width:100%; left:0; }

	/* 서브레이아웃 */
	.subCntBody{ margin:0;} 
	.subContent_body{ padding:0 1rem;} 

	/* 서브비주얼 */
	.subvisual img{ width:150%; left:-25%; transform: none; -webkit-transform: none; -ms-transform: none;}
 
}

@media screen and (max-width: 1024px){ 

	/* openPop */
	/* .openPop #container { padding-top:150px !important; } */
	.openPop #menuOpen, .openPop #searchOpen { top: 155px !important; }
	.openPop #mSearch { top:220px !important; }
 
	/* header */
	#header {height: 80px; border-bottom: none;}
	#header:before {display: none;}
	#web {display: none;}
	#tablet,
	.tabletlogo {display: block;}

	/* footer */
	#footer:before { display: none; }
	#footer address{ padding-right:0; margin:0.5rem 0; }

	#snb { border-radius:0; margin-top:0;}
	#snb .home { border-radius:0;}

	/* 방문자수 */
    .visitant { position:relative; top:auto; right:auto; width:50%; margin-top:0.5rem; }

	/* 구글 번역 */
    .gbSchlTrans {position: relative; top: auto !important; right: auto !important; margin: 0.5rem 0 0; width:50%;}
	
	/*맨위로가기*/
	.btn_top{ bottom:2.5%; right:2.5%; } 

	/* etc : sns*/ 
	.snsBox:after {display:none;}
	.snsBox .btnPrint { display:none; }
	.sns_more { right:0.5rem;}

}
@media (max-width:800px) {
	/* 서브메뉴 */ 
	#snb { height:3rem; line-height:3rem; }
	#snb .home { height:3rem; }
	#snb li.active { height:3rem; }
	#snb li.active:before { display:none; }
	#snb .dep01{width:calc(100% - 2.5rem)}
	#snb .dep02 > li.active{border-left:0;}
	#snb ul { padding-top:3rem; height:3rem; }
	#snb ul.open:before  { top:3rem; height:calc(100% - 3rem); }
	#snb ul.open > li > a {z-index : 1;}
	#snb ul:not(.mobSnb) { left: 0; }
	#snb ul:not(.mobSnb):before { display: none; }
	#snb ul:not(.mobSnb) li { width: 100%; }
	#snb ul:not(.mobSnb) li.active > a { opacity: 0; }
	#snb ul.mobSnb { opacity: 1; left: 0; }
	#snb ul.mobSnb > li.active > a { opacity: 1; z-index:1; } 
	#snb li.active > a:before { line-height:3rem; }
	.snsBox > button { height:3rem;}

}
@media (max-width:768px) { 
	.subContent{ padding:1.5rem 0; }

	/* header */
	#header h1 a img{ width:auto; height:32px;}
}

@media screen and (max-width: 480px){ 
	/* openPop */
	/* .openPop #container { padding-top:120px !important; } */
	.openPop #menuOpen, .openPop #searchOpen { top: 125px !important; }
	.openPop #mSearch { top:190px !important; }
 
	.container { padding:0 0.5rem;}

	/* 방문자수 */
    .visitant { width:100%; min-width:13rem;}
	
	/* 구글 번역 */
    .gbSchlTrans {width: 100%;}
}

@media (max-width:380px) { 
	/* header */
	#tabletLogo a img { width:auto; height:32px;}

	#menuOpen {left:0.5rem; } 

	/* mobile 검색영역 */
	#searchOpen {right:0.5rem;}  
	#mSearch .con { margin:1rem 0.5rem; }
 
	/* mobile navi */
	#mNavi #mtitle { background-size:auto 32px ;}
	#mNavi #mgnb .snb li a {padding: 0 0.75rem;}

	/* mobile navi */
	#mgnb .snb li a { padding: 0 0.75rem; }
}


