@charset "utf-8";
@font-face {
    font-family:'Pretendard';
    src:url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight:400;
    font-style:normal;
}

.color333 {color:#333;}
.r_color {color:#8a9fa7;}
.font_gray {color:#999;}
.vmiddle {vertical-align:middle;}
.bold {font-weight:bold;}

/* 게시판 영역 레이아웃 */
.ntb-area {position:relative; z-index:0; margin:0 auto;}
.ntb-top-area {text-align:right; padding:10px 0 10px 0;}
.ntb-listbtn-area {text-align:right; padding:10px 0 10px 0;}
.ntb-paging-area {text-align:center; padding:10px 0 10px 0;}
.ntb-search-area {text-align:center; padding:10px 0 10px 0;}
.ntb-password-area {text-align:center; padding:100px 0 200px 0;}


/*페이징*/
.paging {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 70px;
}

.paging .arr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.paging .arr a:not(:last-child) {
  margin-right: 5px;
}

.paging .arr a.last,
.paging .arr a.first {
  letter-spacing: -10px;
}

.paging .arr a.last i,
.paging .arr a.first i {
  -webkit-transform: translateX(-5px);
  transform: translateX(-5px);
}

.paging a {
  font-size:16px;
  width: 35px;
  height: 35px;
  border: 1px solid #e0e0e0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #999;
}

.paging ul {
  margin: 0 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.paging ul li:not(:last-child) {
  margin-right: 5px;
}

.paging ul li.on a {
  color: #fff;
  background: #afafaf;
  border-color: #afafaf;
}


/* 팝업 */
.pop-today{ position:absolute;bottom:-30px;left:10px; font-family:'Pretendard', sans-serif; font-size:14px; color:#333 }
.pop-today input { display:inline-block; vertical-align:middle; margin-top:0px}
.b-close{ cursor:pointer;position:absolute;right:-20px;top:-20px; width:40px; height:40px; overflow:hidden; border-radius:50px; background-color:#222 }
.b-close:before {content:""; display:block; position:absolute; top:50%; left:50%; transform:rotate(45deg) translate(-50%, -50%); margin:6px 0 0 -4px; width:18px; height:2px; background-color:#fff; }
.b-close:after {content:""; display:block; position:absolute; top:50%; left:50%; transform:rotate(45deg) translate(-50%, -50%); margin:-2px 0 0 -7px;  width:2px; height:18px; background-color:#fff; }

.pop-content { width:auto !important; max-width:100% !important;}
.pop-content a { display:block;}
.pop-content img { width:auto !important; max-width:100% !important;  height:auto !important;}
.pop-wrap {position:absolute; background:#fff; border:1px solid #666; overflow:hidden; display:none}
.pop-bottom {padding:7px; background:#000; overflow:hidden;}
.pop-bottom .pb-left{float:left; color:#ddd}
.pop-bottom .pb-right{float:right; color:#ddd}


/*로그인*/
.login-box, .register-box {
	max-width:400px;
	margin:3% auto;
	border:1px solid #d4d8d9;
	border-radius: 5px;
	background: #fff;
	padding:40px;
	box-shadow: 0 0 30px rgb(0 0 0 / 10%)
}
.login-box-msg {margin:0; text-align:left; padding: 10px 10px 20px 0; font-size:17px; font-weight: 700;}
.login-box .form-group {margin-bottom:16px; font-size:14px;}
.login-box .form-group div {margin-bottom:20px}
.login-box .form-group input {
	border:1px solid #ddd;
	border-radius: 3px;
	padding:10px;
	width: 100%;
	height: 42px;
	box-sizing: border-box;
	margin-top: 10px;
}
.login-box .btn-group {margin-bottom: 60px;}
.login-box .btn-group button {
	width: 100%;
	height: 50px;
	font-size: 16px;
	border-radius: 3px;
	color:#666;
	font-weight: 300;
	background: #fff;
	transition: all 0.5s;
	border:1px solid #ddd;
}
.login-box .btn-group button:hover {
	background: #94babb;
	color:#fff;
}
.login-box .linkBtn { display:flex; margin-top: 20px; justify-content: center;}
.login-box .linkBtn p { font-size: 14px; margin-right:20px; color:}
.login-box .linkBtn a {
	color: #aaa;
}
.login-box .linkBtn p:last-child {margin:0;}

.login-box .sns-login-title{position:relative; font-family: 'Poppins', sans-serif; font-weight:300; font-size:16px; letter-spacing:0.025em; color: #999; text-align: center; margin: 40px 0;}
.login-box .sns-login-title::after{content:""; width: 32%; height: 1px; background: #cccccc; position:absolute; top: 50%; right: 0; transform:translateY(-50%);}
.login-box .sns-login-title::before{content:""; width: 32%; height: 1px; background: #cccccc; position:absolute; top: 50%; left: 0; transform:translateY(-50%);}
.login-box .sns-login {position: relative;height:210px; padding: 10px 0 20px 0}
.login-box .sns-login li{width:100%; display:inline-block; margin-bottom:10px;}
.login-box .sns-login li:last-of-type{margin-bottom:0;}
.login-box .sns-login li img{width:100%}

/* 회원가입 동의 */
/*.agree-box {padding:40px; }*/
.agree-box {max-width:700px; margin:3% auto; border:1px solid #d4d8d9; border-radius: 5px; background: #fff; padding:40px; box-shadow: 0 0 30px rgb(0 0 0 / 10%)}
.agree-box-msg {margin:0; text-align:left; padding: 10px 10px 20px 0; font-size:17px; font-weight: 700;}
.agree-box .form-group{width:90%; height:250px; resize:none; font-size:13px; background:#f9f9f9; border:1px solid #eaeaea; line-height:20px; overflow-x:hidden; overflow-y:scroll; color:#818181; padding:5%}
.agree-box .chk-group {margin-top:20px; margin-bottom: 60px;}
.agree-box .btn-group{text-align:center}
.agree-box .btn-group button {width:30%; height:50px; font-size:16px; border-radius:3px; color:#666; font-weight:300; background:#fff; transition:all 0.5s; border:1px solid #ddd;}
.agree-box .btn-group button:hover {background:#94babb; color:#fff;}

/* 회원 가입 양식 */
.join_type{padding-top:40px;}
.join_type .join_tb{width:100%; border-top:1px solid #eaedf1;}
.join_type .join_tb tbody tr{border-bottom:1px solid #eaedf1;}
.join_type .join_tb tbody tr th{padding:24px 10px; box-sizing:border-box; font-size:15px; font-weight:500; letter-spacing:-0.020em; color:#494d4c; line-height:1; background-color:#f9f9f9; text-align:left;}
.join_type .join_tb tbody tr th span{font-size:15px; font-weight:500; letter-spacing:-0.020em; color:#94babb; line-height:1; margin-left:5px;}
.join_type .join_tb tbody tr td{padding:12px 44px 12px 19px; box-sizing:border-box; font-size:14px; font-weight:400; letter-spacing:-0.05em; color:#757575; line-height:2;}
.join_type .join_tb tbody tr td label{display:inline-block; vertical-align:middle;}
.join_type .join_tb tbody tr td label input{width:100%; height:35px; font-size:13px; font-weight:500; letter-spacing:-0.020em; color:#222; border:1px solid #ddd; padding:0 5px; box-sizing:border-box;}
.join_type .join_tb tbody tr td label.w90{width:90px;}
.join_type .join_tb tbody tr td label.w200{width:200px;}
.join_type .join_tb tbody tr td label.w400{width:400px;}
.join_type .join_tb tbody tr td label.w_full{display:block; margin-right:0; width:100%;}
.join_type .join_tb tbody tr td label.w_full input{width:100%;}
.join_type .join_tb tbody tr td textarea{width:100%; min-height:96px; max-height:100px; font-size:13px; font-weight:500; letter-spacing:-0.020em; color:#222; line-height:0.6; border:1px solid #ddd; padding:0 14px; box-sizing:border-box; border-radius:5px; resize:none;}
.join_type .btn-group{padding-top:40px; text-align:center}
.join_type .btn-group button {width:25%; height:50px; font-size:16px; border-radius:3px; color:#666; font-weight:300; background:#fff; transition:all 0.5s; border:1px solid #ddd;}
.join_type .btn-group button:hover {background:#94babb; color:#fff;}


@media screen and ( max-width:1200px){
	.pop-wrap { left:0 !important; }
}


@media screen and ( max-width:639px){
	.paging a { font-size:15px; }
}