/* ====================================================== .member-wrap =========================================================*/ .member-wrap{max-width:500px; margin:0 auto} .member-wrap .logo{background:url(../img/login-logo.png) no-repeat center top; height:106px; margin-bottom:40px; margin-top:150px;} @media only screen and (max-width:999px){ .member-wrap .logo{margin-bottom:40px; background-size:auto 55px ; height:55px;} } @media only screen and (max-width:680px){ .member-wrap .logo{ background-size:auto 40px ; height:40px;} } @media only screen and (max-width:480px){ } /* ====================================================== .member-wrap.login =========================================================*/ .member-wrap.login{padding-top:70px;} .member-wrap.login h3{font-size:28px ;font-weight:600; color:#000; line-height:1.2em; letter-spacing:-0.03em; margin-bottom:15px; text-align:center; } .member-wrap.login .stit{font-size:16px; font-weight:400; color:#1f1f1f; letter-spacing:-0.03em; line-height:1.2em; text-align:center; } .member-wrap.login .sns{margin-top:25px;} .member-wrap.login .sns ul:after{display:block;content:"";clear:both} .member-wrap.login .sns li{float:left; width:49%;} .member-wrap.login .sns li:nth-child(n+2){width:49%; margin-left:2%; } .member-wrap.login .sns li a{display:block; height:55px; line-height:53px; text-align:center; border-radius:5px; border:1px solid #d2d2d2; background:#fff;} .member-wrap.login .sns li:nth-child(1) a{background:#fee500; border-color:#fee500; font-size:16px; font-weight:400; letter-spacing:-0.03em; color:#1f1f1f;} .member-wrap.login .sns li:nth-child(2) a{font-size:16px;} .member-wrap.login .sns li:nth-child(1) a span{display:inline-block;vertical-align:top; padding-left:34px; background:url(../img/content/login-kakao.jpg) no-repeat left center;} .member-wrap.login .sns li:nth-child(2) a span{display:inline-block;vertical-align:top; padding-left:34px; background:url(../img/content/login-naver.jpg) no-repeat left center;} .member-wrap.login .sns li:nth-child(3) a{background:url(../img/content/login-facebook.jpg) no-repeat center center;} .member-wrap.login .entry{margin-top:40px;} .member-wrap.login .entry ul{} .member-wrap.login .entry ul li{position:relative;} .member-wrap.login .entry ul li:nth-child(n+2){margin-top:20px;} .member-wrap.login .other{margin-top:20px; position:relative} .member-wrap.login .other ul{position:absolute; right:0; top:0;} .member-wrap.login .other ul:after{display:block; content:"";clear:both;} .member-wrap.login .other li{position:relative; float:left;} .member-wrap.login .other li:nth-child(n+2){margin-left:35px;} .member-wrap.login .other li:nth-child(n+2):before{width:1px;height:12px; position:absolute; left:-18px; top:50%;margin-top:-6px; background:#d1d1d1; display:block; content:""} .member-wrap.login .other li a{display:block; line-height:25px; color:#555;} .member-wrap.login .other .chk-check label{font-weight:300;} .member-wrap.login .login-btn{margin-top:30px;display:block; line-height:60px; background:#06afc0; border:1px solid #06afc0; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#fff; border-radius:5px;} .member-wrap.login .login-btn:hover{background:#fff; color:#06afc0; border:1px solid #06afc0;} .member-wrap.login .join-btn{margin-top:10px;display:block; line-height:60px; border:1px solid #2f6df0; background:#fff; color:#2f6df0; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; border-radius:5px;} .member-wrap.login .join-btn:hover{margin-top:10px;display:block; line-height:60px; border:1px solid #2f6df0; background:#2f6df0; color:#fff; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; border-radius:5px;} .member-wrap.login .bemember-btn{margin-top:30px;display:block; line-height:1.3em; text-align:center; font-size:15px; font-weight:500; letter-spacing:-0.03em; color:#1f1f1f; text-decoration:underline; } .member-wrap.login .copy{margin-top:50px; text-align:center; font-size:12px; color:#888; text-transform:uppercase; line-height:1.3em; letter-spacing:0.01em;} @media only screen and (max-width:1240px){ } @media only screen and (max-width:999px){ .member-wrap.login h3{font-size:25px ; margin-bottom:40px;} .member-wrap.login .stit{font-size:15px;} .member-wrap.login .sns li a{height:45px;line-height:43px; } .member-wrap.login .sns li:nth-child(1) a{font-size:15px;} .member-wrap.login .sns li:nth-child(1) a span{background-size:20px auto; padding-left:30px;} .member-wrap.login .sns li:nth-child(2) a {background-size:20px auto;} .member-wrap.login .sns li:nth-child(3) a {background-size:20px auto;} .member-wrap.login .entry{margin-top:20px;} .member-wrap.login .entry ul li:nth-child(n+2){margin-top:15px;} .member-wrap.login .entry ul li .chk-input input{height:45px;} .member-wrap.login .other li a{font-size:13px;} .member-wrap.login .other li:nth-child(n+2){margin-left:25px;} .member-wrap.login .other li:nth-child(n+2):before{left:-13px;} .member-wrap.login .login-btn{line-height:55px; font-size:17px;} .member-wrap.login .join-btn{line-height:55px; font-size:17px;} .member-wrap.login .bemember-btn{font-size:14px;} .member-wrap.login .copy{font-size:11px; margin-top:30px;} } @media only screen and (max-width:680px){ .member-wrap.login h3{font-size:23px ; margin-bottom:20px;} .member-wrap.login .stit{font-size:14px;} .member-wrap.login .sns li:nth-child(1) a{font-size:14px;} .member-wrap.login .bemember-btn{font-size:13px;} .member-wrap.login .login-btn{line-height:50px; font-size:16px;} .member-wrap.login .join-btn{line-height:50px; font-size:16px;} } @media only screen and (max-width:480px){ .member-wrap.login h3{font-size:21px ; margin-bottom:10px;} .member-wrap.login .sns li:nth-child(1) a{font-size:13px;} } /* ====================================================== .member-wrap.join =========================================================*/ .member-wrap.join{} .member-wrap.join h3{font-size:28px ;font-weight:600; color:#000; line-height:1.2em; letter-spacing:-0.03em; margin-bottom:30px;} .member-wrap.join .sns{} .member-wrap.join .sns ul:after{display:block;content:"";clear:both} .member-wrap.join .sns li{float:left; width:46%;} .member-wrap.join .sns li:nth-child(n+2){width:25%; margin-left:2%; } .member-wrap.join .sns li a{display:block; height:55px; line-height:53px; text-align:center; border-radius:5px; border:1px solid #d2d2d2; background:#fff;} .member-wrap.join .sns li:nth-child(1) a{background:#fee500; border-color:#fee500; font-size:16px; font-weight:400; letter-spacing:-0.03em; color:#1f1f1f;} .member-wrap.join .sns li:nth-child(1) a span{display:inline-block;vertical-align:top; padding-left:34px;background:url(../img/content/login-kakao.jpg) no-repeat left center;} .member-wrap.join .sns li:nth-child(2) a{background:url(../img/content/login-naver.jpg) no-repeat center center;} .member-wrap.join .sns li:nth-child(3) a{background:url(../img/content/login-facebook.jpg) no-repeat center center;} .member-wrap.join .entry{margin-top:40px;} .member-wrap.join .entry ul{} .member-wrap.join .entry ul li{position:relative; padding-left:135px;} .member-wrap.join .entry ul li:nth-child(n+2){margin-top:20px;} .member-wrap.join .entry ul li .btxt{position:absolute; left:0; top:0; line-height:48px; font-size:17px; color:#1f1f1f; letter-spacing:-0.03em;} .member-wrap.join .entry ul li .stxt{display:inline-block;vertical-align:top; line-height:48px; font-size:16px; color:#1f1f1f; letter-spacing:-0.03em; min-width:68px;} .member-wrap.join .entry ul li .field.join{padding:5px 0;display:block;} .member-wrap.join .entry ul li .field.join .stxt{line-height:38px;} .member-wrap.join .entry ul li .field.cmmt{} .member-wrap.join .entry ul li .field.cmmt .chk-input{ width:49%} .member-wrap.join .entry ul li .field.cmmt .chk-input:nth-child(2){float:right; width:49%} .member-wrap.join .entry ul li .field.cmmt{width:100%} .member-wrap.join .entry ul li .field.cmmt .chk-select{ width:48%} .member-wrap.join .entry ul li .field.cmmt .chk-select:nth-child(2){ width:25%} .member-wrap.join .entry ul li .field.cmmt .chk-select:nth-child(3){float:right; width:25%} .member-wrap.join .entry ul li .field.cerfity{padding:5px 0;display:block;} .member-wrap.join .entry ul li .field.cerfity .stxt{line-height:46px;} .member-wrap.join .entry ul li .id-overlap{border:1px solid #d2d2d2; border-radius:5px;display:inline-block;vertical-align:top; font-size:13px; color:#888; width:80px;text-align:center; line-height:43px; margin-left:5px;} .member-wrap.join .entry ul li .id-overlap:hover{background:#1f1f1f; color:#fff; border-color:#1f1f1f} .member-wrap.join .entry ul li .field.zip{padding:5px 0;display:block;} .member-wrap.join .entry ul li .field.zip .stxt{line-height:46px;} .member-wrap.join .entry ul li .zip-btn{border:1px solid #d2d2d2; border-radius:5px;display:inline-block;vertical-align:top; font-size:13px; color:#888; width:100px;text-align:center; line-height:43px; margin-left:5px;} .member-wrap.join .entry ul li .zip-btn:hover{background:#1f1f1f; color:#fff; border-color:#1f1f1f} .member-wrap.join .agrees{} .member-wrap.join .agrees h5{ font-size:16px;} .member-wrap.join .agrees .scroll{border:1px solid #d9d9d9; padding:20px; max-height:150px; margin-top:10px; box-sizing:border-box; overflow-y:auto;} .member-wrap.join .agrees ul{padding:15px 0;} .member-wrap.join .agrees li{position:relative;} .member-wrap.join .agrees li:nth-child(n+2){margin-top:7px;} .member-wrap.join .agrees li .chk-check{display:block;} .member-wrap.join .agrees li .view-btn{position:Absolute; right:0; top:0; line-height:25px; color:#5c3fbf; border-bottom:1px solid #5c3fbf; font-size:14px;} .member-wrap.join .agrees li .view-btn:hover{color:#1f1f1f; border-color:#1f1f1f;} .member-wrap.join .join-btn{margin-top:40px;display:block; line-height:60px; border:1px solid #749bff; background:#749bff; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#fff; border-radius:5px;} .member-wrap.join .join-btn:hover{margin-top:40px;display:block; line-height:60px; border:1px solid #749bff; background:#fff; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#749bff; border-radius:5px;} @media only screen and (max-width:1240px){ } @media only screen and (max-width:999px){ .member-wrap.join h3{font-size:25px ; margin-bottom:40px;} .member-wrap.join .sns li a{height:45px;line-height:43px; } .member-wrap.join .sns li:nth-child(1) a{font-size:15px;} .member-wrap.join .sns li:nth-child(1) a span{background-size:20px auto; padding-left:30px;} .member-wrap.join .sns li:nth-child(2) a {background-size:20px auto;} .member-wrap.join .sns li:nth-child(3) a {background-size:20px auto;} .member-wrap.join .entry{margin-top:20px;} .member-wrap.join .entry ul {padding:0 5px;} .member-wrap.join .entry ul li{padding-left:0;} .member-wrap.join .entry ul li .btxt{padding-left:10px;line-height:1.3em; margin-bottom:10px; font-size:16px;position:relative; left:auto; top:auto;} .member-wrap.join .entry ul li .btxt:before{width:3px;height:3px; position:Absolute; left:0; top:8px; background:#333; display:block; content:""} .member-wrap.join .join-btn{line-height:55px; font-size:17px;} } @media only screen and (max-width:680px){ .member-wrap.join h3{font-size:23px ; margin-bottom:20px;} .member-wrap.join .sns li:nth-child(1) a{font-size:14px;} .member-wrap.join .entry ul li .btxt{font-size:15px;} .member-wrap.join .join-btn{margin-top:30px;line-height:50px; font-size:16px;} } @media only screen and (max-width:480px){ .member-wrap.join h3{font-size:21px ;} .member-wrap.join .sns li:nth-child(1) a{font-size:13px;} } /* ====================================================== .layer-wrap.joinEnd =========================================================*/ .layer-wrap.joinEnd {padding:25px;width:96%; max-width:400px; box-sizing:border-box; border-radius:15px;background:#fff; position:fixed; display:none;left:50%; top:50%;-webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%);box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2) ; -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2) ; -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2) ; } .layer-wrap.joinEnd .is-con{text-align:center;} .layer-wrap.joinEnd .is-con .btxt{font-size:18px; color:#1f1f1f; font-weight:500; line-height:1.2em; padding-top:70px; background:url(../img/content/welcome-chk.jpg) no-repeat center 10px} .layer-wrap.joinEnd .is-con .stxt{font-size:14px; color:#888; font-weight:400; line-height:1.2em; margin-top:7px;} .layer-wrap.joinEnd .is-btm{margin-top:20px;} .layer-wrap.joinEnd .is-btm:after{display:block; content:"";clear:both;} .layer-wrap.joinEnd .is-btm a{display:inline-block;vertical-align:top;width:100%;text-align:center; border-radius:5px;} .layer-wrap.joinEnd .is-btm .end-btn{float:left;border:1px solid #d1d1d1; line-height:45px; font-size:14px; color:#1f1f1f; font-weight:400; letter-spacing:-0.03em;} .layer-wrap.joinEnd .is-btm .enter-btn{float:left;border:1px solid #5c3fbf; background:#5c3fbf;line-height:45px; font-size:16px; color:#fff; font-weight:400; letter-spacing:-0.03em;} /* ====================================================== .member-wrap.modify =========================================================*/ .member-wrap.modify{} .member-wrap.modify h3{font-size:28px ;font-weight:300; color:#1f1f1f; line-height:1.2em; letter-spacing:-0.03em; margin-bottom:60px;} .member-wrap.modify h4{font-size:16px ;font-weight:700; color:#1f1f1f; line-height:1.2em; letter-spacing:-0.03em; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #d2d2d2} .member-wrap.modify h5{font-size:14px ;color:#888; letter-spacing:-0.03em; font-weight:400; margin-bottom:20px;} .member-wrap.modify .stit{font-size:16px; font-weight:400; color:#1f1f1f; letter-spacing:-0.03em; line-height:1.2em;} .member-wrap.modify .entry{} .member-wrap.modify .entry ul{} .member-wrap.modify .entry ul li{position:relative; padding-left:135px;} .member-wrap.modify .entry ul li:nth-child(n+2){margin-top:20px;} .member-wrap.modify .entry ul li .btxt{position:absolute; left:0; top:0; line-height:48px; font-size:17px; color:#1f1f1f; letter-spacing:-0.03em;} .member-wrap.modify .entry ul li .stxt{display:inline-block;vertical-align:top; line-height:48px; font-size:16px; color:#1f1f1f; letter-spacing:-0.03em; min-width:100px;} .member-wrap.modify .entry ul li .stxt.f10{font-size:10px;} .member-wrap.modify .entry ul li .modify-btn{border:1px solid #d2d2d2; border-radius:5px;display:inline-block;vertical-align:top; font-size:13px; color:#888; width:62px;text-align:center; line-height:38px; margin-left:15px;} .member-wrap.modify .entry ul li .modify-btn:hover{background:#1f1f1f; color:#fff; border-color:#1f1f1f} .member-wrap.modify .entry ul li .field.modify{padding:5px 0;display:block;} .member-wrap.modify .entry ul li .field.modify .stxt{line-height:38px;} .member-wrap.modify .entry ul li .field.cmmt{} .member-wrap.modify .entry ul li .field.cmmt .chk-input{float:left; width:49%} .member-wrap.modify .entry ul li .field.cmmt .chk-input:nth-child(2){float:right; width:49%} .member-wrap.modify .entry ul li .field.cmmt{width:100%} .member-wrap.modify .entry ul li .field.cmmt .chk-select{ width:48%} .member-wrap.modify .entry ul li .field.cmmt .chk-select:nth-child(2){ width:25%} .member-wrap.modify .entry ul li .field.cmmt .chk-select:nth-child(3){float:right; width:25%} .member-wrap.modify .entry ul li .field.zip{padding:5px 0;display:block;} .member-wrap.modify .entry ul li .field.zip .stxt{line-height:46px;} .member-wrap.modify .entry ul li .zip-btn{border:1px solid #d2d2d2; border-radius:5px;display:inline-block;vertical-align:top; font-size:13px; color:#888; width:100px;text-align:center; line-height:46px; margin-left:5px;} .member-wrap.modify .entry ul li .zip-btn:hover{background:#1f1f1f; color:#fff; border-color:#1f1f1f} .member-wrap.modify .letter{margin-top:27px;} .member-wrap.modify .letter ul{margin:-5px} .member-wrap.modify .letter ul:after{display:block; content:"";clear:both;} .member-wrap.modify .letter li{float:left;margin:5px} .member-wrap.modify .letter li:nth-child(n+2){} .member-wrap.modify .letter li a{ line-height:30px; border:1px solid #d2d2d2; border-radius:30px; padding:0 20px;display:block; font-size:14px; color:#777; letter-spacing:-0.03em;} .member-wrap.modify .letter li.active a{border-color:#718bdd; background:#718bdd; color:#fff;} .member-wrap.modify .field.agree{margin-top:50px; display:block;} .member-wrap.modify .field.agree .view-btn{font-size:15px; font-weight:500; display:inline-block;vertical-align:top;margin-left:10px; line-height:25px; color:#1f1f1f;text-decoration:underline } .member-wrap.modify .field.agree .view-btn:hover{text-decoration:underline} .member-wrap.modify .save-btn{margin-top:40px;display:block; line-height:60px; background:#2f6df0; border: 1px solid #2f6df0; color:#fff; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; border-radius:5px;} .member-wrap.modify .save-btn:hover{background:#6e98fa; border: 1px solid #6e98fa; color:#fff; } .member-wrap.modify .r{margin-top:15px;text-align:Right;} /*.member-wrap.modify .leave-btn{font-size:16px; font-weight:400; color:#1f1f1f; line-height:1.4em; border-bottom:1px solid #1f1f1f; display:inline-block;vertical-align:top;}*/ .member-wrap.modify .leave-btn{margin-top:20px;display:block; line-height:60px; background:#ff9053; border:1px solid #ff9053; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#fff; border-radius:5px;} .member-wrap.modify .leave-btn:hover{margin-top:20px;display:block; line-height:60px; border:1px solid #ff9053; background:#fff; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#ff9053; border-radius:5px;} @media only screen and (max-width:1240px){ } @media only screen and (max-width:999px){ .member-wrap.modify h3{font-size:25px ; margin-bottom:40px;} .member-wrap.modify h4{font-size:15px ;} .member-wrap.modify h5{font-size:13px ;} .member-wrap.modify .entry ul {padding:0 5px;} .member-wrap.modify .entry ul li .stxt{line-height:32px;} .member-wrap.modify .entry ul li .modify-btn{line-height:32px; position:absolute;right:0; top:5px;} .member-wrap.modify .entry ul li .field.modify{padding-right:75px;} .member-wrap.modify .entry ul li .field.modify .stxt{line-height:32px; display:block;border:1px solid #dedede; padding:0 10px; font-size:14px; border-radius:5px;background:#fafafa} .member-wrap.modify .entry ul li{padding-left:0;} .member-wrap.modify .entry ul li .btxt{padding-left:10px;line-height:1.3em; margin-bottom:10px; font-size:16px;position:relative; left:auto; top:auto;} .member-wrap.modify .entry ul li .btxt:before{width:3px;height:3px; position:Absolute; left:0; top:8px; background:#333; display:block; content:""} .member-wrap.modify .stit{font-size:15px; } .member-wrap.modify .save-btn{line-height:55px; font-size:17px;} .member-wrap.modify .leave-btn{font-size:15px;} .member-wrap.modify .letter{margin-top:20px;} .member-wrap.modify .letter li a{padding:0 15px; font-size:13px;} .member-wrap.modify .field.agree{margin-top:30px;} .member-wrap.modify .field.agree .view-btn{line-height:20px; font-size:14px;} } @media only screen and (max-width:680px){ .member-wrap.modify h3{font-size:23px ; margin-bottom:20px;} .member-wrap.modify .entry ul li .btxt{font-size:15px;} .member-wrap.modify .letter li a{ font-size:12px;} .member-wrap.modify .save-btn{margin-top:30px;line-height:50px; font-size:16px;} .member-wrap.modify .leave-btn{font-size:14px;} } @media only screen and (max-width:480px){ .member-wrap.modify h3{font-size:21px ;} .member-wrap.modify .stit{font-size:14px; } .member-wrap.modify .leave-btn{font-size:13px;} .member-wrap.modify .field.agree .view-btn{line-height:20px; font-size:13px;} } /* ====================================================== .member-wrap.leave =========================================================*/ .member-wrap.leave{} .member-wrap.leave h3{font-size:28px ;font-weight:300; color:#111; line-height:1.2em; letter-spacing:-0.03em; margin-bottom:60px;} .member-wrap.leave .stit{font-size:15px; font-weight:400; color:#1f1f1f; letter-spacing:-0.03em; line-height:1.6em;} .member-wrap.leave .ex{margin-top:25px; border-top:1px solid #d2d2d2; border-bottom:1px solid #d2d2d2; padding:30px 0;} .member-wrap.leave .ex ul{} .member-wrap.leave .ex li{position:relative; padding-left:12px; font-size:14px; font-weight:300; color:#111; line-height:1.2em;} .member-wrap.leave .ex li:nth-child(n+2){margin-top:5px;} .member-wrap.leave .ex li:before{background:#777; width:6px;height:1px; position:absolute; left:0; top:8px; display:block ;content:""} .member-wrap.leave .field{display:block; margin-top:25px;} .member-wrap.leave .chk-check{display:block; } .member-wrap.leave .chk-check label{} .member-wrap.leave .chk-input{display:block; margin-top:20px;} .member-wrap.leave .chk-input textarea{} .member-wrap.leave .chk-select{display:block; margin-top:30px;} .member-wrap.leave .chk-select select{} .member-wrap.leave .leave-btn{margin-top:20px;display:block; line-height:60px; background:#ff9053; border:1px solid #ff9053; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#fff; border-radius:5px;} .member-wrap.leave .leave-btn:hover{margin-top:20px;display:block; line-height:60px; border:1px solid #ff9053; background:#fff; text-align:center; font-size:18px; font-weight:300; letter-spacing:-0.03em; color:#ff9053; border-radius:5px;} @media only screen and (max-width:1240px){ } @media only screen and (max-width:999px){ .member-wrap.leave h3{font-size:25px; margin-bottom:40px;} .member-wrap.leave .stit{font-size:15px;} .member-wrap.leave .ex{padding:25px 0} .member-wrap.leave .ex ul{padding:0 5px;} .member-wrap.leave .ex li{padding-left:10px; font-size:13px; } .member-wrap.leave .ex li:before{width:4px} .member-wrap.leave .field{margin-top:15px;} .member-wrap.leave .leave-btn{line-height:55px; font-size:17px;} } @media only screen and (max-width:680px){ .member-wrap.leave h3{font-size:23px; margin-bottom:20px;} .member-wrap.leave .stit{font-size:14px;} .member-wrap.leave .leave-btn{line-height:50px; font-size:16px;} } @media only screen and (max-width:480px){ .member-wrap.leave h3{font-size:21px} .member-wrap.leave .stit{font-size:13px;} }