@charset "utf-8";

/* 기본설정 */
* {margin:0; padding:0;}
html,body {height:100%; margin:0; padding:0; font-family: 'Noto Sans KR', Malgun Gothic,"맑은 고딕", Dotum, AppleGothic, sans-serif; font-size: 15px; font-weight:400; color:#282828; -webkit-text-size-adjust:none; -webkit-overflow-scrolling:touch;}

div, table {margin:0; padding:0;}
input, select {padding:0}
img, fieldset {border:0;}
ul, ol		{list-style:none; margin-bottom:0px;}
a:link, a:visited, a:active, a:hover {text-decoration:none;}
hr {display:none;}

.hide, legend, caption {position:absolute; overflow:hidden; visibility:hidden; width:0; height:0; left:0; top:0; font-size:0; line-height:0; padding:0; margin:0;}

button {border:0; /*outline:0;*/}

a {color: #2d2d2d;	-webkit-transition: all 0.2s ease-in-out;	-moz-transition: all 0.2s ease-in-out;	-ms-transition: all 0.2s ease-in-out;	-o-transition: all 0.2s ease-in-out;	transition: all 0.2s ease-in-out; -webkit-tap-highlight-color:transparent }
a:hover {color: #2d2d2d; }
a, a:hover, a:active, a:focus, button:focus {border:0;	/*text-decoration: none;*/}

p {	line-height: 1.5;}
h1, h2, h3, h4, h5, h6{	font-weight:700; /*text-transform: uppercase;*/}
input[type="search"], 
input[type="text"], 
input[type="password"]{outline:none; -webkit-appearance:none; -webkit-border-radius:0;}

textarea, 
select{outline:none; -webkit-appearance:none; -webkit-border-radius:0;}
select::-ms-expand {display:none;}
label{	font-weight: 300;}

input::placeholder {color:#777 !imporant; font-weight:500;}

::-webkit-input-placeholder{color:#777 !imporant; opacity:1;}
:-moz-placeholder{color:#777 !imporant; opacity:1;}
::-moz-placeholder{color:#777 !imporant; opacity:1;}
:-ms-input-placeholder {color:#777 !imporant; opacity:1;}


.h1, .h2, .h3, h1, h2, h3 {margin-top:0px; font-weight:700;}

/* skip ----------------------------------------------*/
#accessibility {position:absolute; top:0; left:0; width:100%; z-index:9999;}
#accessibility a {font-size:14px; position:absolute; top:-9999px;}
#accessibility a:hover, #accessibility a:active, #accessibility a:focus {display:inline-block; top:0; width:100%; padding:10px 0; color:white; font-weight:bold; text-align:center; background-color:black;}

/*header*/
.head-section {border-top:3px solid #2d8ce6; }
.head-section:before {position:absolute; top:80px; left:0px;  content:""; width:100%; height:1px; background:#dbdbdb;  z-index:15;} 
.head-section .navbar-header {width:100%; float:none; height:80px;}

.head-section h1 {position:relative; margin:15px auto; width:120px; height:44px;}
.head-section h1 .navbar-brand {display:block; width:120px; height:44px; background:url('../images/logo.png') no-repeat; text-indent:-9999em;}

.head-section .tbt-menu {position:absolute; top:22px; right:0px;  } 
.head-section .tbt-menu li {float:left; margin-left:10px;}
.head-section .tbt-menu li a {display:inline-block; padding:3px 0px;}
.head-section .tbt-menu li a.box { padding:3px 14px; color:#fff; background:#273253; border-radius:50px; }

.head-section .navbar {margin-bottom: 0;}
.navbar-default { border: none }
.head-section .navbar-collapse  ul.navbar-nav {float: right; margin-right: 0;    z-index: 199;}

.head-section .navbar-default {background:none;}
.head-section .nav {margin-left:-20px; }
.head-section .nav li {padding:35px 20px;}
.head-section .nav li a {font-size:1.33em; font-weight:600; color: #000;}
.head-section .nav>li>a {padding:0 0;}
.head-section .nav li a .fa-angle-down {display:none;}
.head-section .navbar {/*min-height:180px; z-index:10; */}
.head-section .navbar-nav > li {}
.head-section .navbar-nav > li:last-child > a {}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus {background-color:none;}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {background-color:none;}

.head-section .nav>li:last-child>a span {display:inline-block; padding:5px 15px; color:#fff;  border-radius:50px;background:#1462a0;}

.head-section .nav>li>a:hover,
.head-section .nav>li>a.active {color:#2d8ce6; background:none;}
.head-section .nav>li>a:hover:after,
.head-section .nav>li>a.active:after {display:block; content:'';position:absolute;background:#2d8ce6;height:2px;left:0px;right:0px;bottom:-5px;}




.head-section .site-btn {position:absolute; top:28px; left:0px; }
.head-section .site-btn a {font-size:1.06em; font-weight:500;}




/* 하단 영역 */
#footer {padding:0; background:#1b1b1c;}

.foot-info {position:relative; padding-top:35px; padding-bottom:35px;}
.foot-info .copyright {padding:0;}
.foot-info .copyright .copy_info {overflow:hidden;}
.foot-info .copyright .copy_info li {float:left; padding:0 20px 0 0; color:#fff; }
.foot-info .copyright .copy_info li:last-child {background:none;}
.foot-info .copyright .tel_info {overflow:hidden; clear:both; margin:10px 0 25px 0;}
.foot-info .copyright .tel_info li {float:left; padding:0 20px 0 0; color:#b7b7b7; }
.foot-info .copyright .tel_info li:last-child {background:none;}
.foot-info .copyright cite {font-style:normal; color:#b7b7b7;}

.foot-info .copy_etc {padding:0px 0 0 0;}
.foot-info .copy_etc .capy_btns {float:right;}
.foot-info .copy_etc .capy_btns li {display:inline-block; margin-left:10px;}
.foot-info .copy_etc .capy_btns li a {display:inline-block; padding:9px 16px; font-size:1.06em; font-weight:300; color:#fff; }
.foot-info .copy_etc .capy_btns li:nth-child(1) a {background:#202c60;}
.foot-info .copy_etc .capy_btns li:nth-child(2) a {background:#323233;}

.black_bg {position: fixed;top:80px;left: 0;bottom: 0;right: 0;z-index: 999; background: rgba(0,0,0,0.7);/*overflow:hidden; position:fixed;top:65px;left:250px;bottom:0px;width:100%;height:100%;background:#000;filter:alpha(opacity=70);opacity: 0.7;-moz-opacity:0.7; z-index:999;*/}




/* Responsive styles
================================================== */


/* lg */ 
@media (max-width: 1200px) {
	

}

/* md */
@media (min-width: 992px) and (max-width: 1199px) {

	

}
@media (max-width: 992px){
	
	
	
}




/* Large Devices, Wide Screens */
@media (min-width: 1200px) {
  /* Dropdown animation */	
  .navbar-nav .dropdown-menu,
  .navbar-nav .dropdown.megamenu div.dropdown-menu {
    background: none;
    border: 0;
    box-shadow: none;
    display: block;
    opacity: 0;
    z-index: 1;
    visibility: hidden;
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition: visibility 500ms, opacity 500ms, -webkit-transform 500ms cubic-bezier(0.43, 0.26, 0.11, 0.99);
    -moz-transition: visibility 500ms, opacity 500ms, -moz-transform 500ms cubic-bezier(0.43, 0.26, 0.11, 0.99);
    -o-transition: visibility 500ms, opacity 500ms, -o-transform 500ms cubic-bezier(0.43, 0.26, 0.11, 0.99);
    -ms-transition: visibility 500ms, opacity 500ms, -ms-transform 500ms cubic-bezier(0.43, 0.26, 0.11, 0.99);
    transition: visibility 500ms, opacity 500ms, transform 500ms cubic-bezier(0.43, 0.26, 0.11, 0.99);
	
  }
  .navbar-nav .dropdown:hover div.dropdown-menu,
  .navbar-nav .dropdown.megamenu:hover div.dropdown-menu {
    opacity: 1;
    visibility: visible;
    color: #777;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
	border-radius:0px;
  }
  .navbar-nav .dropdown-backdrop {
    visibility: hidden;
  }

}

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

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

	.offcanvas-toggle {background:none;}
	.navbar-default .navbar-toggle {border:none;}
	.navbar-default .navbar-toggle .icon-bar {background-color:#2d2d2d;}
	.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {background:#fff;}	
	.navbar-toggle .icon-bar {width:25px; height:3px;}
	.navbar-toggle {margin-top:22px; margin-right:0px;}
	.navbar-toggle .icon-bar+.icon-bar {margin-top:5px;}	

	.navbar-offcanvas {padding-left:0px; padding-right:0px;}
	.navbar-offcanvas h2 {display:block; margin:0; padding:24px 0; background:#2d8ce6 url('../images/logo_w.png') no-repeat center center; background-size:100px auto; text-indent:-9999em;}

	.head-section .nav {margin:0;}
	.head-section .nav li {padding:0; border-bottom:1px solid #ddd;}
	.head-section .nav li a {padding:15px 20px; font-size:1.06em; background:url('../images/arrow_r.png') no-repeat 90% center; background-size:8px auto; }
	.head-section .nav>li>a:hover, 
	.head-section .nav>li>a.active {background:url('../images/arrow_r.png') no-repeat 90% center; background-size:8px auto; }
	.head-section .nav>li>a:hover:after,
	.head-section .nav>li>a.active:after {background:none;}

	.head-section .site-btn {position:relative; top:auto; left:auto; padding:30px 20px;}
	.head-section .site-btn a {display:block; padding:10px 10px; font-size:0.96em; font-weight:400; text-align:center; /*color:#fff; background:#273253;*/ border:1px solid #273253; border-radius:5px;}

	.foot-info .copyright {padding-bottom:15px;}
	
}


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

/* xs */
@media (max-width: 767px) {
	
	.head-section .tbt-menu {right:15px; }
	.head-section .tbt-menu li a {overflow:hidden; width:40px; height:40px; text-indent:-9999em;}
	.head-section .tbt-menu li.login a {background:#fff url('../images/login_pic1.png') no-repeat center center; background-size:25px auto;}
	.head-section .tbt-menu li.logout a {background:#fff url('../images/login_pic2.png') no-repeat center center; background-size:25px auto;}
	.head-section .tbt-menu li.join a {background:#fff url('../images/login_pic3.png') no-repeat center center; background-size:25px auto;}
	.head-section .tbt-menu li.mypage a {background:#fff url('../images/login_pic4.png') no-repeat center center; background-size:25px auto;}
	/*.head-section .tbt-menu li:nth-child(3) {display:none;}*/
	
	.foot-info .copyright {padding:0 15px 20px 15px; font-size:0.86em;}

	.foot-info .copy_etc {float: none !important; text-align:center;}
	.foot-info .copy_etc .capy_btns {float: none; padding-right:15px;}
	.foot-info .copy_etc .capy_btns li a {font-size:0.93em;}


}

/* XS Portrait */
@media (max-width: 479px) {
	
	.navbar-toggle {margin-left:10px;}

}