@charset "utf-8";

/* Common */
body,p,hr,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,div {margin:0;padding:0}
body,input,textarea,select,button,table {font-family:'Noto Sans KR','Nanum Gothic',Gulim, AppleGothic, sans-serif;font-size:13px;-webkit-font-smoothing:antialiased;-moz-font-smoothing: antialiased;font-smoothing: antialiased;-ms-touch-action: manipulation;touch-action: manipulation}
img,fieldset{border:0;vertical-align:top}
input[type=image],
img{max-width:100%}
ul,li,ol{list-style:none;}
em,address {font-style:normal}
a {color:black;text-decoration:none}
a:hover,a:active,a:focus {text-decoration:underline}
.blind {position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;visibility:hidden;font-size:0;line-height:0}

.clearfix:before, .clearfix:after {content:"";display:table;}
.clearfix:after {clear:both;}
.clearfix {*zoom:1;}

*{box-sizing:border-box;}
/* // Common */

#footer{position:relative;padding:45px 0; background-color:#0b111a;color:#fff}
#footer .logo { float:left; width:327px; text-align:center;}
#footer .address { float:left; color:#96969d; font-size:15px; line-height:25px;}

#page-login{background:url('../img/login/login_bg.jpg') top center no-repeat;background-size:cover;}
#page-login .bg{;}
#page-login .container{position:relative;width:480px;margin:0 auto;padding:130px 0;}
#page-login .container .header{padding:30px 0;color:#ddd}
#page-login .container .header img{margin-right:30px}
#page-login .container .content{;}
#page-login .container .content .login-box{padding:20px;background-color:rgba(0,0,0,0.7)}
#page-login .container .content .login-box h2{margin-bottom:30px;text-align:center;padding:15px 0;text-align:center;font-size:15px;font-weight:400;border-radius:3px;background-color:#444;color:#fff;text-decoration:none;transition:.3s}
#page-login .container .content .login-box .tab-box{margin-bottom:16px;}
#page-login .container .content .login-box .tab-box a{display:inline-block;width:48%;padding:15px 0;text-align:center;font-size:15px;font-weight:400;border-radius:3px;background-color:#444;color:#fff;text-decoration:none;transition:.3s}
#page-login .container .content .login-box .tab-box a:hover,
#page-login .container .content .login-box .tab-box a.active{background:#fff;color:#444}
#page-login .container .content .login-box .tab-cont{display:none;}
#page-login .container .content .login-box .form{margin-bottom:20px}
#page-login .container .content .login-box .btn-group{padding:30px 0;text-align:center;color:#30343d;}
#page-login .container .content .login-box .btn-group a{padding: 0 15px;color:#666;}
#page-login .container .content .login-box .btn-group a:hover{color:#fff;}
#page-login .container .content .login-box .select-login-method{margin-bottom:12px;}
#page-login .container .content .login-box .select-login-method label{display:inline-block;width:45%;color:#fff}
#page-login .container .content .login-box input[type=text],
#page-login .container .content .login-box input[type=password]{width:100%;margin-bottom:16px;padding:12px;outline:0;border:0;background-color:transparent;color:#fff;border-bottom:1px solid #333;font-size:17px;border-radius:3px}
#page-login .container .content .login-box button {display:block;width:100%; border:1px solid #333333; background:none; color:#fff;font-size:17px; line-height:60px;cursor:pointer;}
#page-login .container .content .login-box button:hover{background-image: linear-gradient(to left top, #09a773, #006cb4);}
#page-login .container .content .login-box .login-quick{}
#page-login .container .content .login-box .login-quick ul{;}
#page-login .container .content .login-box .login-quick ul:after{display:block;clear:both;content:''}
#page-login .container .content .login-box .login-quick ul li{float:left;position:relative;}
#page-login .container .content .login-box .login-quick ul li a.icon{float:left;display:block;width:145px;height:145px;transition: 0.5s ease-in-out;background-size:contain;background-position:center center;background-repeat:no-repeat}
#page-login .container .content .login-box .login-quick ul li .icon01{background-image:url('../img/login/login-quick01.png');}
#page-login .container .content .login-box .login-quick ul li .icon02{background-image:url('../img/login/login-quick02.png');}
#page-login .container .content .login-box .login-quick ul li .icon03{background-image:url('../img/login/login-quick03.png');}
#page-login .container .content .login-box .login-quick ul li:hover .icon01{background-image:url('../img/login/login-quick01-ov.png');}
#page-login .container .content .login-box .login-quick ul li:hover .icon02{background-image:url('../img/login/login-quick02-ov.png');}
#page-login .container .content .login-box .login-quick ul li:hover .icon03{background-image:url('../img/login/login-quick03-ov.png');}
#page-login .container .content .login-box .login-quick ul li .icon-sub{display:none;position:absolute;top:100%;left:0;right:0;z-index:100}
#page-login .container .content .login-box .login-quick ul li .icon-sub a {width:156px;display:block; background:#fff; color:#535353; font-size:15px; padding-left:12px;border-bottom:1px solid #f5f5f5; line-height:40px;}
#page-login .container .content .login-box .login-quick ul li .icon-sub a:hover { text-decoration:none; background:#d2e8f5;}
#page-login .container .content .login-box .login-quick ul li:hover .icon-sub{display:block}
#page-login #mask{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:100;}
#page-login .popup-layer{display:none;position:fixed;top:10%;left:50%;width:460px;margin:0 0 0 -230px;background-color:#000;z-index:110;}
#page-login .popup-cont01 {width:640px; margin: 40px auto; text-align: center;}
#page-login .popup-cont01 button { margin-top:30px; width:100px;line-height: 36px; background: #000; color: #ffffff; text-align: center; border: none; font-size: 16px;cursor:pointer}
#page-login #popup-kakao{width:800px;height:800px;margin:0 0 0 -400px;background:#fff;border:1px solid #666;}

#page-login .login-quick {position:absolute;top:0;right:0}
#page-login .login-quick ul{width:470px;}
#page-login .login-quick ul:after{display:block;clear:both;content:''}
#page-login .login-quick a { float:left;transition: 0.5s ease-in-out; }
#page-login .login-quick a:hover { }
#page-login .login-quick .icon01 { display:block; width:156px; height:161px; background:url('../img/login/login-quick01.png') top center no-repeat;}
#page-login .login-quick ul li:hover .icon01 { background:url('../img/login/login-quick01-ov.png') top center no-repeat;}
#page-login .login-quick .icon02 { display:block; width:157px; height:161px; background:url('../img/login/login-quick02.png') top center no-repeat;}
#page-login .login-quick ul li:hover .icon02 { background:url('../img/login/login-quick02-ov.png') top center no-repeat;}
#page-login .login-quick ul li .icon03 { display:block; width:156px; height:161px; background:url('../img/login/login-quick03.png') top center no-repeat;}
#page-login .login-quick ul li:hover .icon03 { background:url('../img/login/login-quick03-ov.png') top center no-repeat;}

#page-login .login-quick ul{;}
#page-login .login-quick ul:after{display:block;clear:both;content:''}
#page-login .login-quick ul li{float:left;position:relative;}
#page-login .login-quick ul li .icon-sub{display:none;position:absolute;top:100%;left:0;right:0;z-index:100}
#page-login .login-quick ul li .icon-sub a {width:156px;display:block; background:#fff; color:#535353; font-size:15px; padding-left:12px;border-bottom:1px solid #f5f5f5; line-height:40px;}
#page-login .login-quick ul li .icon-sub a:hover { text-decoration:none; background:#d2e8f5;}
#page-login .login-quick ul li:hover .icon-sub{display:block}

@media all and (max-width:720px) {
	#page-login .container{width:auto;padding:0}
	#page-login .container .header{text-align:center;}
	#page-login .container .header img{display:block;margin:0 auto 20px}
	#page-login .container .content{display:block;}
	#page-login .container .content .login-box{width:auto;margin:10px}
}
.popup-layer{;}
.popup-layer h2{margin-bottom:30px;text-align:center;color:#ccc}
.popup-layer form{padding:20px;}
.popup-layer .login-box{width:469px;margin:150px auto;padding:50px;background-color:rgba(0,0,0,0.7);}
.popup-layer label{display:none;height:0;font-size:0;}
.popup-layer input{width:100%;height:55px;margin:8px 0; padding:0; border:0;outline:0; font-size:17px;border-bottom:1px solid #333;background:none; color:#fff;}
.popup-layer .btn-submit{display:block;width:100%;border:1px solid #333333;background:none;color:#fff;font-size:17px;line-height:60px;cursor:pointer}
.popup-layer .btn-group{text-align:center; padding:30px 0; color:#30343d;}

/* 회원가입 */
#page-join{;}

/* 아이디찾기 */
#page-find{position:fixed;top:0;left:0;right:0;bottom:0; background:url('../img/login/login_bg.jpg') top center no-repeat; background-size:cover;}
#page-find .container{}
#page-find .container h1{margin-bottom:30px;text-align:center}
#page-find .container h2{margin-bottom:30px;text-align:center;color:#ccc}
#page-find .login-box{width:469px;margin:150px auto;padding:50px;background-color:rgba(0,0,0,0.7);}
#page-find .login-box input {  background:none; }
#page-find .login-box label { font-size:0; height:0; display:none;}
#page-find .login-box input { width:366px; height:55px;outline:0; border:0;margin:8px 0; padding:0; font-size:17px;border-bottom:1px solid #333333; color:#fff;}
#page-find .login-box .btn-submit {display:block;width:100%;border:1px solid #333333;background:none;color:#fff;font-size:17px;line-height:60px;cursor:pointer}
#page-find .login-box .btn-group{text-align:center; padding:30px 0; color:#30343d;}

/* 회원가입 */
#join-box { width:485px; margin:50px auto;}
#join-box p { font-size:17px;}
#join-box .btn-join { position:relative;background:#3a3a3a; width:485px;line-height:80px;font-size:20px; border-radius:7px;border:0;cursor:pointer; color:#fff; text-align:left; padding-left:30px; margin:10px 0;}
#join-box .btn-join:hover { background: linear-gradient(to left top, #09a773, #006cb4); }
#join-box .btn-join img { margin-top:20px; margin-right:20px;}
#join-box .join-arow { position:absolute;top:12px; right:10px;}