/* pc 해상도 1024px */
@media all and (min-width:1024px) {
}

/* 테블릿 가로, 테블릿 세로 해상도 768xp ~ 1023px */
@media all and (min-width:768px) and (max-width:1023px) {
}

/* 모바일 해상도 480xp ~ 767px */
@media all and (max-width:767px) {
}

body {transition:0.3s;}

.fm {font-family: 'Montserrat',sans-serif !important;}

.header {position:relative;z-index:1;}
.header .logo_wrap {width: 100%;}
.header .logo_wrap .logo_inner {position:relative;width: 75%;margin:0 auto;text-align: center;padding:40px 0 35px 0;}
.header .logo_wrap h1 {font-size: 0;}

.header .nav_wrap {width: 100%;border-top:1px solid #eee;border-bottom:1px solid #eee;background-color: #fff;}
.header .gnb {width: 75%;margin:0 auto;}
.header .gnb > ul {display: flex;}
.header .gnb > ul > li {position:relative;flex:1;font-size: 16px;font-weight: 400;text-align: center;padding:13px 0;font-family: 'Noto Sans Kr',sans-serif;letter-spacing:-1px;cursor:pointer;}
.header .gnb > ul > li > a {color: #111;font-weight: 500;}
.header .gnb > ul > li .fm {font-weight: 700 !important;letter-spacing:-0.3px;}
.header .gnb > ul > li:hover > a {color: #1b8798;}
.gnb > ul > li:hover .sub_nav {visibility:visible;opacity:1;}
.sub_nav li:hover > a {color: #1b8798;}
.login_wrap {position:absolute;top:55%;right:4%;transform:translateY(-55%);}
.login_wrap a {position:relative;display: inline-block;margin:0 5px 0 0;padding-left:8px;color: #828282;font-family: 'Noto Sans Kr',sans-serif;font-size: 14px;}
.login_wrap a:before {content: '';position: absolute;top: 5px;left: 0;width: 1px;height: 12px;background: #ddd;}
.login_wrap a:first-child:before {display: none;}
.my_id {color: #222 !important;font-weight: 500;transition:0.3s;}
.btn_admin:hover {color: #008a70 !important;}
.btn_admin i {margin-left: 5px;}




/* 하위 메뉴 */
.sub_nav {transition:all .2s ease;visibility:hidden;opacity:0;position:absolute;left:0;right:0;top:100%;border:1px solid #eee;}
.sub_nav li {padding: 15px;box-sizing:border-box;background: #fff;border-bottom:1px solid #eee;font-family: 'Noto Sans KR',sans-serif;font-weight: 400;text-align: center;font-size: 15px;}
.sub_nav li:last-child {border-bottom:0;}
.sub_nav li a {color: #6c6c6c;}


/* 3단 아이콘 */
.sidemenu_wrap {display: none;} 
.sidemenu_wrap {position:absolute;left:3.2%;top:50%;transform:translateY(-50%);}
.sidemenu_wrap .sidemenu {width: 40px;height: 40px;overflow:hidden;cursor:pointer;}
.sidemenu input[id=sidemenu] {display: none;}
.sidemenu label[for=sidemenu] {position: relative;display: block;width: 25px;height: 16px;margin:0 auto;margin-top:11px;cursor:pointer;}
.sidemenu label[for=sidemenu] span {position:absolute;width: 100%;height: 3px;background-color: #000;left:0;}
.sidemenu label[for=sidemenu] span:nth-child(1) {top:0;}
.sidemenu label[for=sidemenu] span:nth-child(2) {top:50%;}
.sidemenu label[for=sidemenu] span:nth-child(3) {top:100%;}


@media (max-width:1400px) {
	.header .gnb > ul > li {font-size: 14px;}
}

@media (max-width:1200px) {
	.header {height: auto;}
	.header .logo_wrap .logo_inner {width: 100%;padding:14px 0 14px 0;}
	.header .gnb {display: none;}
	.login_wrap {display: none;}
	.header .logo_wrap h1 > a > img {width: 180px;}
	.sidemenu_wrap {display: block;}
	.sidemenu_wrap .sidemenu {width: 32px;height: 32px;}
	.sidemenu label[for=sidemenu] {margin-top:5px;}
	.sidemenu label[for=sidemenu] span {height: 2px;}
}

@media (max-width:786px) {
	.header {height: auto;}
	.header .gnb {display: none;}
}


/*모바일 좌측메뉴*/
.side_wrap .sidebar {display: none;}
.side-bg {display: none;}


@media (max-width: 1200px) {
	.side_wrap .sidebar {display: block;}
	.page-wrapper{margin-left:0px;min-width:350px;}
	.btn{width:100%;height:45px;line-height:40px;margin-top:5px;}
	.lostpass-btn{width:90%;height:40px;line-height:40px;font-size:15px !important;}
	.top_ad {display:block;}

	.navbar{display:block;height:54px;background: #f5f5f5;position:relative;border-bottom:1px #ddd solid}
	.navbar .m-logo{text-align:center;margin:10px auto;width:45px;height:42px}
	.navbar .m-logo img{width:100%;height:100%}

	.navbar .m-icon{position:absolute;left:15px;top:0;color:#0062a9;font-size:26px;cursor:pointer}
	.side_wrap{display:block;z-index:9999;left:-100%;}
	.side_wrap .sidebar { position:fixed;top:0;left: -80%; overflow-y:scroll !important;width:80%;height:100%;background:#fff;z-index:999;letter-spacing:-1px; }
	.side_wrap .sidebar .side-head{overflow:hidden;background:#fff;color:#333;font-weight:400;border-bottom:1px solid #dee1e3;padding:6% 5%;box-sizing:border-box;}
	.side-head p {font-family: 'Noto sans kr',sans-serif;font-size:15px;line-height:1.8em;color: #222;}
	.side-body {background:#f5f5f5;}
	.side_wrap .sidebar .menu {padding-left:0;background:#fff;}
	.m_login {font-weight: 500;font-family: 'Noto sans kr',sans-serif;}
	.m_login i {margin-left:5px;font-size: 14px;}
	.m_admin {position:relative;padding-left:11px;margin-left: 10px;color: #444;}
	.m_admin:before {content:'';position:absolute;left:0;top:0;width: 1px;height: 100%;background: #ddd;}
	.m_admin i {font-size: 11px;margin-left: 4px;}
	.btn-login{float:right;font-size: 12px;font-family: 'noto sans kr',sans-serif;padding:3px 10px;border:1px solid #9a9a9a;text-align:center;background:#fff;}
	.menu li{font-size:15px;box-sizing:border-box;font-family: 'Noto sans kr',sans-serif;font-weight:400;}
	.menu li a{color:#000;}
	.menu .active {font-weight:700;}
	.menu .s-menu{color:#1b8798;font-weight:600;padding:4% !important;display:block;border-bottom:1px solid #eee;}

	.sub_menu {border-bottom:1px solid #eee;padding:8px 5px;}
	.sub_menu li {padding:2% 4%;font-size: 14px;color:#666;background:#fff !important;border:none;}
	.side_wrap .side-bg{
		display: block;position:fixed;top:0;right:0;z-index:999;width:20%;height:100vh;background:#000;opacity:0.6;
	}
	.side_wrap .side-bg .btn-close{position:absolute;top:30px;right:40%;}


	.jv_nav{width:60px;display:none;}
	.jv_nav .wrap .logo{height:90px;border-bottom:1px solid #dee1e3;}
	.jv_nav .wrap .logo-img{display:none;}
	.jv_nav .wrap .m-logo-img{display:block;width:90%;margin:0 auto;}
	.jv_nav .menu a{font-size:12px !important;}
	.jv_nav .menu .menu-text{margin-top:0 !important;word-break:break-all;padding:0 2px;}
	.jv_nav .menu img{display:none;}
	.etc-menu li img{width:50%;}

	.jv_nav .snb{width:330px;left:50px;}
	.jv_nav .snb a{font-size:13.5px;}
	.jv_nav .snb .snb_menu{margin-top:90px;}
}


/* 로그인 */

.page_wrap {width: 100%;text-align: center;overflow:hidden;padding:100px 0;}
.page_wrap .page_inner {max-width:460px;width: 100%;margin:0 auto;}
.log_wrap {}
.login_logo {font-size: 50px;margin-bottom: 40px;font-weight: 300;letter-spacing:-2px;}
.login_input input[type=text], .login_input input[type=password] {width: 100%;border:1px solid #ddd;outline:none;padding:18px;box-sizing:border-box;margin-bottom: 10px;}
.find_logo {font-size: 42px;}
.top_stext {font-size: 16px;margin: 10px 0 20px 0;color: #888;font-family: 'Noto Sans Kr',sans-serif;font-weight: 300;letter-spacing:-0.5px;}
.btn_login {font-size: 18px;padding:18px;font-family: 'Montserrat',sans-serif;text-align: center;width: 100%;color: #fff;background: linear-gradient(to left, #F8B616, #009D97);border:none;outline:none;cursor:pointer;font-weight: 500;transition:0.3s;}
.btn_find {font-size: 18px;padding:17px;text-align: center;width: 100%;color: #009D97;background-color: #fff;border:1px solid #009D97;outline:none;cursor:pointer;font-weight: 500;font-family: 'Noto Sans Kr',sans-serif;transition:0.3s;}
.id_save {float:left;color: #777;margin-bottom: 15px !important;}
.chk_group {margin-top: 20px;}
.chk_group .chk_list {text-align: center;}
.chk_group .chk_list a {position:relative;display: inline-block;padding-left: 12px;margin-left: 12px;color: #777;font-size: 14px;}
.chk_group .chk_list a:before {content:'';position:absolute;top:3px;left:0;width: 1px;height: 12px;background: #ddd;}
.chk_group .chk_list a:first-child:before {display: none;}

/* 회원가입 */
.regi_inner {width: 640px;margin:0 auto;overflow:hidden;}
.regi_group {text-align: left;margin-bottom:20px;}
.agree_title {font-family: 'Noto Sans KR',sans-serif;font-weight: 500;margin-bottom:5px;}
.text_area textarea {width: 100%;height: 180px;padding:15px;box-sizing:border-box;border:1px solid #ddd;outline:none;}
.btn_agreebox {width: 152px;margin:0 auto;}
.btn_agreebox button {font-size: 18px;padding: 12px 0;text-align: center;width: 100%;color: #1b8798;background-color: #fff;border:1px solid #1b8798;outline: none;cursor: pointer;font-weight: 500;font-family: 'Noto Sans Kr',sans-serif;}
.regi_list {text-align: left;margin-bottom:20px;}
.regi_list h2 {font-size: 16px; font-family: 'Noto Sans Kr',sans-serif;font-weight: 400;color: #595959;display: inline-block;margin-bottom: 5px;}
.regi_list .regi_input {width: 100%;}
.regi_input input[type=text], .regi_input input[type=password] {width: 100%;outline:none;border:1px solid #ddd;padding:18px;box-sizing:border-box;}
.regi_input input[type=text]::placeholder, .regi_input input[type=password]::placeholder {font-size:15px;color: #a7a7a7;}
.regi_bg_wrap {padding:25px;background-color: #f7f7f7;}
.regi_bg_wrap h2 {color: #1b8798;margin-bottom: 8px;}
.regi_bg_wrap .regi_list {margin-bottom: 25px;}

/* 아이디,비밀번호 찾기 */
.result_wrap {width: 100%;max-width:460px;margin:20px auto;padding:20px 0;font-size: 18px;color: #333;font-weight: 300;}
.result_wrap h4 {font-size: 23px;color: #000;}
.result_wrap .result_box {display: block;margin-top: 20px;width: 100%;font-weight: 400;color: #333;border:1px solid #ddd;padding:18px;box-sizing:border-box;}
.result_wrap .result_txt {font-size: 16px;margin:5px 0 40px;}
.result_wrap .pw_num {color: #000;font-weight: 700;}
.result_wrap button {margin-top:15px;}
.result_wrap button i {margin-left:5px;}


@media (max-width:786px) {
	.page_wrap {padding:30px 0;}
	.login_logo {font-size: 32px;font-weight: 500;}
	.regi_inner {width: 100%;margin-bottom: 20px;}
	.login_input input[type=text], .login_input input[type=password] {padding:15px;}
	.btn_login, .btn_regi {padding:14px;font-size: 16px;}
	.top_stext {font-size: 15px;}
	.agree_title {font-size: 15px;}
	.btn_agreebox {width: 100%;}
	.btn_agreebox button {font-size: 16px;padding:15px 0;}
	.chk_group {margin-top: 15px;}
	.chk_group .chk_list a {padding-left:15px;margin-left:15px;}
	.chk_group .chk_list a:first-child {padding-left:0;margin-left: 0;}
}


/* 체크박스 디자인 */
.chk_box {width: 100%;padding:18px;}
.box_chk {font-size:15px;margin-bottom: 10px;}
.box_chk label {cursor:pointer;}
.box_chk span {font-size: 15px;}
/* .box_chk input[type="checkbox"] {display: none;} 
.box_chk input[type="checkbox"]+label::before {
	content:'';
	display: inline-block;
	width: 17px;
	height: 16px;
	background-image: url('../img/check_sq.jpg');
	background-size:17px;
	vertical-align: middle;
	cursor:pointer;
	margin-right:5px;
}
.box_chk input[type="checkbox"]:checked+label::before {
	background-image: url('../img/check_sq_on.jpg');
	background-size:17px;
}
*/

/* 라디오 디자인 */
.box_radio input[type=radio] {display: none;}
.box_radio label em {display: inline-block;width: 17px;height: 16px;margin-right:5px;vertical-align: middle;background: url('/resource/basic/img/chk_radio.png') no-repeat;background-position:left center;}
.box_radio input[type=radio]:checked + label em {background-position:right center !important;}
.regi_list .box_radio label {cursor:pointer;}



/* footer */
footer {width: 100%;}
footer .footerWrap {border-top: 1px solid #e4e4e4;text-align: center;font-family: 'Montserrat',sans-serif;font-size: 14px;font-weight: 500;color: #666;padding:20px;box-sizing:border-box;}







.active_slide {
  -moz-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -moz-animation-name: slidein;
  -webkit-animation-name: slidein;
  animation-name: slidein;
  /*
  -moz-animation-direction: alternate;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  */
  -moz-animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
@-moz-keyframes slidein {
  from {
    left: -80%;
  }
  to {
    left: 0%;
  }
}

@-webkit-keyframes slidein {
  from {
    left: -80%;
  }
  to {
    left: 0%;
  }
}

@keyframes slidein {
  from {
    left: -80%;
  }
  to {
    left: 0%;
  }
}

.active_slide2 {
  -moz-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -moz-animation-name: dis_hide;
  -webkit-animation-name: dis_hide;
  animation-name: dis_hide;
  /*
  -moz-animation-direction: alternate;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  */
  -moz-animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
@-moz-keyframes dis_hide {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}

@-webkit-keyframes dis_hide {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}

@keyframes dis_hide {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}

.deactive_slide {
  -moz-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -moz-animation-name: slideout;
  -webkit-animation-name: slideout;
  animation-name: slideout;
  /*
  -moz-animation-direction: alternate;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  */
  -moz-animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
@-moz-keyframes slideout {
  from {
    left: 0%;
  }
  to {
    left: -80%;
  }
}

@-webkit-keyframes slideout {
  from {
    left: 0%;
  }
  to {
    left: -80%;
  }
}

@keyframes slideout {
  from {
    left: 0%;
  }
  to {
    left: -80%;
  }
}

.deactive_slide2 {
  -moz-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -moz-animation-name: dis_show;
  -webkit-animation-name: dis_show;
  animation-name: dis_show;
  /*
  -moz-animation-direction: alternate;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  */
  -moz-animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
@-moz-keyframes dis_show {
  from {
    opacity: 0.5;
  }
  to {
    opacity: 0;
  }
}

@-webkit-keyframes dis_show {
  from {
    opacity: 0.5;
  }
  to {
    opacity: 0;
  }
}

@keyframes dis_show {
  from {
    opacity: 0.5;
  }
  to {
    opacity: 0;
  }
}

/* 하단 */
footer {width: 100%;}
footer .mark {background-color: #fff;border-top:1px solid #ddd;padding:25px 0;box-sizing:border-box;overflow:hidden; }
footer .mark span {margin:0 35px;}
footer .copyright {padding:15px 0;font-size: 13px;font-family: 'verdana',sans-serif;background-color: #343434;color: #fff;}


@media (max-width:786px) {
	footer .mark {padding:0;}
	footer .mark span {display: block;margin:20px 0;}
	footer .mark span img {width: 140px;}
	footer .copyright  {font-size: 12px;}
}