@charset "utf-8";
html { font-size: 62.5%; }
html, body { width: 100%; min-width: 320px; margin: 0px; font-family: 'NanumSquareR','맑은 고딕','Malgun Gothic','돋움','Dotum','Apple SD Gothic Neo',sans-serif; }
body { background-color: #dbdbdb; color: #555; position: relative; letter-spacing: -0.3px; }
body.sub { background-color: #fff; }
button, input { outline: 0; }
header { position: relative; z-index: 9999; }
/* 공통 */
header.mobile { display: none; }
header:not(.mobile),
header.mobile .top { box-sizing: border-box; width: 100%; height: 90px; background-color: #fff; border-top:3px solid #5087c6; box-shadow: 0px 0px 15px 13px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 0px 15px 13px rgba(0, 0, 0, 0.1); -moz-box-shadow:    0px 0px 15px 13px rgba(0, 0, 0, 0.1); box-shadow:         0px 0px 15px 13px rgba(0, 0, 0, 0.1); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
header:not(.mobile) nav { display: table; margin: 0 auto; width: 1200px; }
header nav { height: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
header:not(.mobile) nav > a { display: table-cell; vertical-align: middle; height: 100%; }
header:not(.mobile) nav > a > img { width:80%; }
header:not(.mobile) nav .menu_group { display: table-cell; vertical-align: middle; padding-right:10px;}
header:not(.mobile) nav .menu_group ul { margin: 0px; float: right; }
header nav .menu_group > ul > li { list-style: none; display: inline-block; text-align: left; padding-left: 20px; }
/*
header nav .menu_group:after { content: ''; width: 100%; background-color: #f7f7f6; border-bottom:1px solid #c0c0c0; height: 0px; position: absolute; left: 0px; top: 87px; z-index: 10; -webkit-transition: height 0.3s ease-out;  transition: height 0.3s ease-out; }
header nav .menu_group:hover:after { height: 276px;  }
*/
header:not(.mobile) nav .menu_group ul li ul {height: 0px; overflow: hidden; -webkit-transition: height 0.3s ease-out; transition: height 0.3s ease-out; }
header:not(.mobile) nav .menu_group:hover ul li ul {height: 276px;}
header:not(.mobile) nav .menu_group:hover ul li ul li a { display: block !important; }
header nav .menu_group ul li a, header nav .menu_group ul li a:focus, header nav .menu_group ul li a:active, header nav .menu_group ul li a:visited { text-decoration: none; color: #222222; font-size: 1.8rem; transition: color 250ms ease-in-out, background-color 250ms ease-in-out; }
header nav .menu_group ul li a:hover { color: #5eb1e1; }
header nav .menu_group ul li ul { position: absolute; top: 90px; padding-top: 15px !important; z-index: 20; }
header nav .menu_group ul li ul li { display: block;}
header:not(.mobile) nav .menu_group ul li ul li a { font-size: 1.5rem; color: #222; padding:11px 0;display: none; transition: color 250ms ease-in-out, background-color 250ms ease-in-out; }
header:not(.mobile) nav .menu_group ul li ul li a:hover { color: #5eb1e1; }
header.mobile { width: 100%; height: 90px; /*position: absolute;*/ z-index: 9999; background-color: transparent; transition: color 250ms ease-in-out; }
header.mobile .top { display: table; }
header.mobile.opened { height: 100%; background-color: rgba(0, 0, 0, 0.3); }
header.mobile .top .top_logo { display: table-cell; vertical-align: middle; text-align: center; }
header.mobile nav {position:fixed; background-color: #2b303a; width: 65%; max-width: 350px; /*height: calc(100% - 90px)*/; margin: 0px; transition: margin-left 250ms ease-in-out; z-index:2001;}
header.mobile.opened nav { margin-left: 0px; }
header.mobile nav a img { padding: 13px 0px 0px 25px; width: 220px; }

header.mobile .navbar-toggle {  position: absolute; margin-left: 20px;margin-top: 25px; margin-bottom: 13px; background-color: transparent; background-image: none; }
/*header.mobile .navbar-toggle {  position: absolute; margin-left: 35px; padding: 9px 10px; margin-top: 28px; margin-bottom: 13px; background-color: transparent; background-image: none; border: 1px solid #76c4ec; border-radius: 4px; }*/
header.mobile .navbar-toggle .icon-bar { background-color: #8f9298; }
header.mobile .navbar-toggle .icon-bar + .icon-bar { margin-top: 4px; }
header.mobile .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px;}
header.mobile > nav > ul { width: 100%; background-color: #2b303a; }
header.mobile ul li { text-align: left; }
header.mobile > nav > ul > li > a { border-bottom: 1px solid rgba(69, 74, 84, 0.4); color: #fff; }
header.mobile > nav > ul > li > a:after { font-family: "Entypo"; position: relative; content: '\e879'; float: right; font-size: 15px; margin-right: 30px; top: 0px; display: inline-block; color: #FFF; -webkit-transition: all 280ms ease-in-out; -moz-transition: all 280ms ease-in-out; -o-transition: all 280ms ease-in-out; transition: all 280ms ease-in-out; }
header.mobile > nav > ul > li.opened > a:after { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }
/*header.mobile ul li a { padding: 15px 0px 15px 35px; width: 100%; }*/
header.mobile ul li a {padding:12px 0 10px 20px; width: 100%; }
header.mobile ul li a, header.mobile ul li a:focus, header.mobile ul li a:active, header.mobile ul li a:visited { text-decoration: none; /*color: #343434;*/ font-size: 1.6rem; }
header.mobile ul li ul { display: none; background-color: #2b303a; border-bottom:1px solid #343a45; padding:5px 0; }
header.mobile ul li ul li a { color: #aaabae; transition: color 250ms ease-in-out, background-color 250ms ease-in-out; }
header.mobile ul li ul li a:hover { color: #fff; background-color: #2b303a; }
header.mobile ul li.opened ul { display: block; }
footer{overflow:hidden;}
footer {box-sizing: border-box; background-color: #1c1e1f; width: 100%; height: 150px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
footer div { max-width: 1200px; height: 100%; margin: 0 auto; padding: 25px 0px 25px 0px; }
footer dl { float: left; }
footer dl dt { opacity: 0.7; color: #ffffff; font-size: 1.5rem; line-height: 40px; }
footer dl dd { opacity: 0.5; color: #97a2a7; font-size: 1.3rem; line-height: 23px; }
footer dl dd span{content:' '; margin:0 10px;}
footer dl dd br{display: none;}
footer a { float: right; }

/* 공용 class */
.fc_b {color:#4F87C6 !important;}
.fc_o {color:#ffa633 !important;}
.fc_bold {font-weight: bold !important;}

.mb20 {margin-bottom: 20px !important;}

/* kakao map customoverlay style */
.customoverlay {position:relative;bottom:85px;border-radius:6px;border: 1px solid #ccc;border-bottom:2px solid #ddd;float:left;}
.customoverlay:nth-of-type(n) {border:0; box-shadow:0px 1px 2px #888;}
.customoverlay a {display:block;text-decoration:none;color:#000;text-align:center;border-radius:6px;font-size:14px;font-weight:bold;overflow:hidden;background: #4F87C6;background: #4F87C6 url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/arrow_white.png) no-repeat right 14px center;}
.customoverlay .title {display:block;text-align:center;background:#fff;margin-right:35px;padding:10px 15px;font-size:14px;font-weight:bold;}
.customoverlay .title2 {display:block;text-align:center;background:#fff;margin-right:35px;padding:5px 10px;font-size:13px;font-weight:bold;}
.customoverlay:after {content:'';position:absolute;margin-left:-12px;left:50%;bottom:-12px;width:22px;height:12px;background:url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png')}

/* unblock layer */
#blocklayer { position: absolute; top: 70px; bottom: 0px; right: 0px; left: 0px; background-color: rgba(0,0,0,0.5); z-index: 2000; }

/* 중앙 탭 */
.sub_nav.mobile {display: none;}

/* 모바일용 */
@media only screen and (max-width: 1024px) {
    html { font-size: 57.4%; }
    header:not(.mobile) {  display: none; }
    header.mobile { display: block; height:70px;}
    header.mobile .top {height:70px;}
    header.mobile nav { margin-left: -65%; }
    footer { text-align: center; /*margin-top: 20px;*/ }
    footer dl { float: none; }
   footer dl dd {font-size:13px;}
    footer dl dd span{margin:0 5px !important;}
    footer dl dd br{display:block;}
    footer a { display: none; }
}

@media only screen and (max-width: 480px) {
    html { font-size: 53.4%; }
    header.mobile .top .top_logo a {float: right; margin-right: 20px; }
    header.mobile .top .top_logo a img {width: 170px;}
    footer { text-align: center; margin-top: 0px; }
}

@media only screen and (max-width: 320px) {
     html { font-size: 50%; }
    footer { text-align: center; margin-top: 0px; }
}

/* 타블릿용 메뉴 */
@media only screen and (min-width: 1025px) and (max-width: 1200px) {
    header:not(.mobile) { height: auto;}
    header:not(.mobile) nav {display: block; text-align: center; width: 100%; padding: 10px 0px 15px 0px;}
    header:not(.mobile) nav > a {display: inline-block; margin: 0px 0px 20px 0px; }
    header:not(.mobile) nav .menu_group {display: block; padding: 0px;}
    header:not(.mobile) nav .menu_group > ul {float: none; display: flex; width: 100%;}
    header:not(.mobile) nav .menu_group > ul > li {padding: 0px; flex: 1px; text-align: center; position: relative; min-width: 115px;}
    header:not(.mobile) nav .menu_group ul li ul {float: none; top: 50px; left:0px; right:0px;}
    header:not(.mobile) nav .menu_group:hover:after { top: 135px; }
    footer { padding-left: 30px; padding-right: 30px; }
}