@charset "utf-8";

@import url('https://dangkko.github.io/dangkko.github.com/NotoKR_v7/css/noto-sans-kr.css');
@import url('https://dangkko.github.io/dangkko.github.com/AritaBuri/css/arita_buri.css');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,700');

/* 
 * base CSS Document
 */

/* reset */
body,p,div,span,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0; padding:0;}
body,input,textarea,button,select{font-family:'Montserrat', 'Noto Sans KR' , '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; color:#444;}
body{font-size:15px;}
h1,h2,h3,h4,h5,h6,input,textarea,button,select,table{font-size:1em;}
img, fieldset, button{border:0;}
textarea{overflow:auto;}
input[type=submit], input[type=button], button{cursor:pointer;}
img{vertical-align:top;}
address, em{font-style:normal;}
table{width: 100%;border-spacing:0; border-collapse:collapse;} 
table th {font-weight: 400;}
table td {font-weight: 300;}
table,th,td{border:none;}
caption{overflow:hidden; line-height:0; text-indent:-2000em;}
legend, .hidden{padding:0; margin:0; overflow:hidden !important; text-indent:100%; white-space:nowrap; font-size:0;}
i{font-style:normal;}
input, select, textarea, label { display: inline-block;box-sizing: border-box;width: auto; vertical-align: middle; line-height: 1.4;}
input[type=text], 
input[type=password], 
input[type=tel], 
input[type=date], 
input[type=email], 
textarea { height: 33px;  padding: 7px 8px; margin: 2px 0px; border: 1px solid #ddd; background: #fff;  vertical-align: middle; }
input[type="text"], input[type="password"], input[type="submit"]{-webkit-border-radius:1px; -webkit-appearance:none;}
.inputFull { width: 100% !important; } 
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
figure{padding:0px; margin:0px;}

/* 링크 기본값 */
a:link{text-decoration:none; color:#444;}
a:visited{text-decoration:none; color:#444;}
a:hover{text-decoration:none; color:#444;}
a:active{text-decoration:none;}
a:focus{text-decoration:none;}

/* 리스트 스타일 제거 */
ul,ol,li{list-style:none;}

/* mobile */
body{-webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none;}
 
/* selection */
::selection{background:#e9b2cb; color:#fff; text-shadow:none;}
::-moz-selection{background:#e9b2cb; color:#fff; text-shadow:none;}
::-webkit-selection{background:#e9b2cb; color:#fff; text-shadow:none;}
button:active{outline:none;}
button span{position:relative;}
.button {display: inline-block;overflow: hidden;position: relative;min-width: 100px;height: 33px; line-height: 31px;box-sizing: border-box;padding: 0 15px;margin: 2px 0px;background: #41464e;border: 1px solid #25282d;color: #fff !important;
    text-align: center;vertical-align: top;transition: all 0.4s ease-out 0.1s;}
.button:before {content: '';display: block;position: absolute;top: 0px;right: 0px;bottom: 0px;left: 0px;z-index: 1;width: 120%;height: 110%;background: #fff; transform: translateX(-120%) skew(-15deg);transition: transform 0.7s cubic-bezier(0, 0, 0.21, 0.87) 0s;}

/* 
 * content CSS Document
 */
 
body.mob{overflow:inherit;}
body.mob#bodyActive{overflow:hidden; position:fixed; width:100%;}
#wrap{visibility:hidden; position:fixed; z-index:1; width:100%;}
#wrap.show{visibility:visible; position:relative;} 
#header{transform:translateY(-30%); transition:transform 0.6s linear;}
#wrap.show #header{transform:translateY(0);}
#wrap .area_sns{opacity:0; transition:opacity 0.5s ease;}
#wrap.show .area_sns{opacity:1;}

#header{position:relative; top:0px; left:0px; z-index:50; width:100%; box-sizing:border-box; padding-top:46px; }
#header .logo{width:213px; height:53px; margin:0 auto;}
#header .logo a{display:block; height:100%; background:url('../../commons/images/common/m_logo.png') no-repeat 50% 0; background-size:213px 53px;  text-indent:100%; overflow:hidden; white-space:nowrap; }

@media all and (max-width:1360px){
	#header{padding-top:34px;}
	#header .logo{width:213px; height:53px; margin-bottom:30px;} 
	#header .logo a{background-size:100%; } 
}

@media all and (max-width:768px){
	#header{opacity:0; transform:translateY(0); transition:opacity 0.6s linear;}
	#wrap.show #header{opacity:1;}  
}

@media all and (max-width:768px){
	#header{opacity:0; transform:translateY(0); transition:opacity 0.6s linear;}
	#wrap.show #header{opacity:1;}  
}
 
@media all and (max-width:420px){
	#header{padding-top:20px;}
	#header .logo{width:213px; height:53px; margin-bottom:20px; }
	#header .logo a{background-size:100%;background-size:80%;} 
}
@media all and (max-width:340px){
	#header{padding-top:20px; }
	#header .logo{width:213px; height:53px; margin-bottom:20px; background-size:80%; }
	#header .logo a{background-size:100%; background-size:151px 40px;   } 
}
/* sub layout */
#container{opacity:0; transition:opacity 0.5s ease;}
#container .inr{max-width:1400px; margin:0 auto;}
#content{max-width:1400px; min-height:500px; margin:0px auto;}
#wrap.show #container{opacity:1;}
.area_sns ul{top:40%;}

.scroll_up{position:relative; opacity:0; top:80px; transition:all 0.7s ease-out 0s;}
.scroll_up.active{opacity:1; top:0;}

/* 기본 스타일 */
#content > .inr{width:1200px; padding-bottom:10px;}
#content > h3:not(.bbsTitle){font-size:35px; color:#141414; margin:70px auto 50px; letter-spacing:-0.5px; font-weight:600; text-align:center;}
#content > h3:not(.bbsTitle):before{content:''; display:block; width:266px; height:96px; margin:0 auto 5px; background:url('../../commons/images/common/bg_area_bg6.gif') no-repeat 0 0;}
#content > h3:not(.bbsTitle) + .describe{margin-top:-30px; font-size:17px; font-weight:300; color:#797979; text-align:center; word-break:keep-all; letter-spacing:-0.5px; line-height:2em;}

@media all and (max-width:1580px){
	#content{box-sizing:border-box; padding:0px;}	 
	#content {max-width: 1400px;min-height: 500px;margin: 0px auto;} 
	#content > h3:not(.bbsTitle) {font-size: 35px; color: #141414;margin: 70px auto 50px;letter-spacing: -0.5px;font-weight: 600;text-align: center;}
	#content > h3:not(.bbsTitle):before { content: '';display: block; margin: 0 auto 5px;background: url('../../commons/images/common/bg_area_bg6.gif') no-repeat 0 0;} 
}

 
@media all and (max-width:1450px){
	#content > h3:not(.bbsTitle){margin-top:30px;} 
	#content{box-sizing:border-box; padding:0 15px 0 0px;}
	#content > inr .describe{margin-top:-50px;}  
}

@media all and (max-width:500px){
	#content{padding-left:15px; }
	#content > h3:not(.bbsTitle){font-size:25px; margin-top:20px; margin-bottom:30px;  }
	#content > h3:not(.bbsTitle):before { content: '';display: block; margin: 0 auto 5px;background: url('../../commons/images/common/bg_area_bg6.gif') no-repeat 0 0;}
	
}
@media (max-width: 910px){
	#content p {font-size: 16px;}
} 
@media (max-width: 540px){
	#content > h3:not(.bbsTitle){font-size:25px; margin-top:20px; margin-bottom:30px;}
	#content > h3:not(.bbsTitle):before { content: '';display: block; margin: 0 auto 5px;background: url('../../commons/images/common/bg_area_bg6.gif') no-repeat 0 0;}
	#content p { font-size: 15px; margin: 10px 0;}
}
 
@media (max-width: 420px){
	#content > h3:not(.bbsTitle){font-size:23px;}
	#content > h3:not(.bbsTitle):before { content: '';display: block;width:212px;height:76px;margin: 0 auto 5px;background: url('../../commons/images/common/bg_area_bg6.gif') no-repeat 0 0;background-size:80%}
} 
 
@media all and (max-width:365px){
	#content > h3:not(.bbsTitle){font-size:23px;}
	#content > h3:not(.bbsTitle):before { content: '';display: block;width:212px;height:76px;margin: 0 auto 5px;background: url('../../commons/images/common/bg_area_bg6.gif') no-repeat 0 0;background-size:80%}
	.describe{font-size:13px}
	.button01,
	.button02,
	.button04{font-size:12px;} 
} 

#footer{ background:#0d1e36;}
#footer .inr{position:relative; max-width:1400px; margin:0 auto; padding:40px 0px 100px  } 
#footer address{margin-top:10px;   color:#c0c0c4; font-weight:300;}
#footer address span{display:inline-block; margin-right:35px;}
#footer address a{display:inline-block; color:#c0c0c4;}
#footer p{margin-top:8px; font-size:14px; color:#c0c0c4;}  

@media all and (max-width:1450px){
	#footer .inr{box-sizing:border-box; padding:40px 15px;}	 
}
@media all and (max-width:1140px){ 
	#footer address span{display:block;} 
	#footer address{margin-top:20px;} 
}
 
 
 
/* 로그인 */
#content table {width: 100%;}

.join_area h2{font-size:30px; color:#222; font-weight:500; text-align:center; letter-spacing:-1px;}
.join_area h2 i{display:inline-block;}
.join_area h2 i:before,
.join_area h2 i:after{content:''; display:block; height:1px; margin:0 -10px; background:#aeaeae;}
.join_area h2 i:before{display:none; margin-bottom:3px;}
.join_area h2 i:after{margin-top:7px;}
.join_area > p{margin-top:20px; text-align:center; font-size:16px; color:#494949; font-weight:300; letter-spacing:-1px;}
.join_area h3{margin:30px 0 10px; font-size:16px; color:#222; letter-spacing:-1px;}
.join_area textarea{width:100%; height:250px; box-sizing:border-box; padding:15px; border:1px solid #dbdbdb; resize:none;}
.join_area .check{padding-top:15px; text-align:right;}
.join_area .box{padding-bottom:30px; border-bottom:1px dashed #d0d0d0;}
.join_area .box:last-child{border-bottom-width:0px;}
.join_area .box.join{position:relative; max-width:500px; box-sizing:border-box; padding-right:110px; margin:0 auto;}
.join_area .box.join .button.login{position:absolute; top:0px; right:0px; height:137px; margin:0px; background:#ef6c00; border:1px solid #ef6c00;}
.join_area .box.find{max-width:500px; box-sizing:border-box; margin:0 auto;}
.join_area .box.find h3 + table{margin-top:10px;}
.join_area .box.find p{margin-top:10px; letter-spacing:-0.5px; font-size:13px;}
.join_area .box.find .tac{margin-top:10px;}
.join_area .btn_area{padding-top:30px; text-align:center;}

.join_area .bbsView{margin-top:30px;}
.bbsView {border-top: 1px solid #505c78;border-collapse: inherit;table-layout: fixed; } 
.bbsView th {background: #f9fafb;text-align: left;font-weight: 500;letter-spacing: -1px;}
.bbsView th, .bbsView td {padding: 15px 10px;border-bottom: 1px solid #eaecf1;}
.bbsView td {color: #666;word-break: break-all;}
.bbsView th, .bbsView td {padding: 15px 10px;border-bottom: 1px solid #eaecf1;}
 .bbsView td.noline{border:0px}

@media (max-width: 768px){
	.join_area .bbsView {table-layout: fixed;}
	.join_area .bbsView {margin-top: 30px;}
	.bbsView {border-top: 1px solid #505c78;border-collapse: inherit;table-layout: fixed;}
}

@media (max-width: 370px){
	.join_area .box.join {padding-right: 0px;}
	.join_area .box.join .button.login { display: block; position: static; width: 120px; height: 35px;  line-height: 33px; margin: 10px auto 0; }
}
 
@media (max-width: 370px){ 
	.join_area .box.join .button.login {  top: 0px; right: 0px;  background: #ef6c00; border: 1px solid #ef6c00; }
	input[type="text"], input[type="password"], input[type="submit"] {  -webkit-border-radius: 1px; -webkit-appearance: none; }
	input[type=submit], input[type=button], button { cursor: pointer; }
	.button {  overflow: hidden; min-width: 100px; box-sizing: border-box;padding: 0 15px;color: #fff !important;text-align: center; vertical-align: top;transition: all 0.4s ease-out 0.1s;}
 
}