@charset "utf-8";
/* CSS Document */

/* JOIN FORM */
.body-container .section {margin-top:25px;}
.join { position: relative;  background: #FFFFFF; text-align: center}
.join > img {margin-bottom:30px;}
.join input { font-family: "Nanum Gothic"; background: #f2f2f2; width: 100%; border: 0; margin: 0 0 15px; padding: 15px; box-sizing: border-box; font-size: 12px; }
.join .join-form button { text-transform: uppercase; outline: 0; background: #5283e0; width: 100%; border: 0; height:50px; color: #FFFFFF; font-size: 1.5rem; border-radius: 3px; font-weight:500; transition: all 0.3 ease-out; -webkit-transition: all 0.3 ease-out; }
.join .join-form button:hover,.login .login-form button:active,.login .login-form button:focus { background: #6595EF; }
.join .join-form .message { margin: 15px 0 0; color: #b3b3b3; font-size: 12px; }
.join .join-form .message a { padding-top: 10px; }
.join .join-form .message a:hover,
.join .join-form .message a:active,
.join .join-form .message a:focus { color: #6595EF; }
.join .join-form .mobile select { font-family: "Nanum Gothic"; background: #f2f2f2; width: 32%; border: 0; margin: 0 0 15px; padding: 14px; box-sizing: border-box; font-size: 14px; margin-bottom: 0; }
.join .join-form .mobile input { width: 32.5%; margin-bottom: 0; font-size:12px;}
.join .join-form .mobile .message { margin: 5px 0 5px; }
.join .join-form .agree-box { margin-bottom: 15px; vertical-align: top; box-sizing: border-box; height: 40px; background: #f1f1f1; padding: 12px 0; text-align: left; padding-left:12px;}
.join .join-form .agree-box input[type=checkbox] { display: inline-block; width: 15px; height: 15px; cursor: pointer; }
.join .join-form .agree-box label { display: inline-block; vertical-align: top; cursor: pointer; font-size: 12px; line-height: 15px; letter-spacing: -0.08em; }
.join .join-form .agree-box a { vertical-align: top; text-decoration: underline; font-size: 12px; margin-left: 10px; line-height: 15px; }
.join .join-form .interested-box { margin-bottom: 15px; vertical-align: top; box-sizing: border-box; border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; padding: 12px 0; }
.join .join-form .interested-box ul li {float:left; width:33.3%; font-size:12px; line-height: 18px; padding:5px 0; min-height: 48px; border:1px solid #f1f1f1; border-top:0; border-right: 0; background: #fff;}
.join .join-form .interested-box ul li.select {background:#5283e0; color:#fff;}
.join .join-form .interested-box ul li:nth-child(3n) {border-right:1px solid #f1f1f1;}
.join .join-form .interested-box ul li:nth-child(1),
.join .join-form .interested-box ul li:nth-child(2),
.join .join-form .interested-box ul li:nth-child(3) {border-top:1px solid #f1f1f1}
.join .join-form .interested-box ul li.line-1 {line-height: 36px;}
.join .join-form .interested-box .interested { position: relative; display: block; float:left; width: 33.3%; cursor: pointer; margin-bottom:4px;}
.join .join-form .interested-box .interested-on { display: inline-block; font-family: 'nanum-square-r'; background: #5283e0; color: #fff; cursor: pointer; font-size: 12px; line-height: 32px; width: 100%; }
.join .join-form .agree-box input[type=checkbox].custom-check {display: none;}

.sns-join { margin-bottom: 20px; }
.sns-join button {margin-top:10px; padding:12px; background:#eee; background:#fff; color:#767676; border:1px solid #e5e5e5; font-size:1.3rem; display: block; width: 100%; }
.sns-join button:nth-child(1) {margin-top:20px;}
.sns-join button img {width:16px; position: relative; top:4px;margin-right:6px;}
.sns-join button:hover {background: #f8f8f8;}