﻿@charset "utf-8";
/**
 * 프로젝트 명 - DCCLUB style
 * file name: membership.css
 * author: [김민기, 2019.04.17]
 * modify: [김민기, 2019.04.17]
 * write date: 2019-04-17
 * last modify date: 2019-04-17
 * comment : 1. membership page common은 맨 위로 빼 놓음.
 */

/* membership common */
.blueTxt { font-weight: 500; font-size: 15px; color: #2081ed;}
.agreeBtn {text-align: center;}

/* membership btn design setting ( blue ) */
.agreeBtn a {display: inline-block;height:60px;text-align: center;line-height: 60px;color:#fff;font-size: 18px;font-weight: 400;}
.agreeBtn a + a {margin-left:10px;}

/* 회원가입, 가입완료 버튼 2개 */
.agreeBtn2 a { width: 200px; background: #2081ed; }
.agreeBtn2 a:first-child { background-color: #626262; }

/* membership textbox design setting */
.formBox input[type='text'],
.formBox input[type='password'] { padding: 0 15px; width: 540px; height: 50px; font-weight: 500; font-size: 15px; color: #626262; border: solid 1px #c7c7c7; }

/* button design setting */
.formBox button { width: 140px; height: 50px; font-weight: 500; font-size: 15px; color: #fff; background: #000;  }
/* / .membership common */

/* 회원가입 약관동의 */
.membershipInfoWrap { height: 433px; background: #f4f4f4;}
.membershipInfoWrap .innerBox { margin:0 auto; width: 1200px; }
.membershipInfoWrap .innerBox h4 { padding: 69px 0 0 0; height: 247px; font-weight: 600; font-size: 40px; color: #000; text-align: center; line-height: 40px; }
.membershipInfoWrap .innerBox h4 strong { position: relative; top:19px; display: block; font-weight: 600; font-size: 13px; color: #626262; line-height: 13px; }
.membershipInfoWrap .innerBox h4 strong:after { position: absolute; top: 41px; left: 50%; margin: 0 0 0 -21px; width: 42px; height: 1px; background: #717171; content: ''; }
.membershipInfoWrap .innerBox .txtBox { overflow: hidden; }
.membershipInfoWrap .innerBox .txt { float: left; width: 50%; font-weight: 200; font-size:40px; color: #181818; line-height: 50px; letter-spacing: -2.5px;}
.membershipInfoWrap .innerBox .txt strong { padding-bottom: 5px; display: block; font-weight: 700; font-size:40px; color: #181818;line-height: 40px;}
.membershipInfoWrap .innerBox .txt small { font-weight: 200; font-size:40px; color: #2081ed; line-height: 50px; }
.membershipInfoWrap .innerBox .step { float: left; width: 50%; font-weight: 200; font-size:40px; color: #181818; }
.membershipInfoWrap .innerBox .step strong { height: 45px; display: block; font-weight: 700; font-size:15px; color: #000; line-height: 15px;}
.membershipInfoWrap .innerBox .step small { padding-top:19px; display: block; font-weight: 500; font-size:15px; color: #626262; line-height: 14px; }

.termsWrap {}
.termsWrap .innerBox { margin:0 auto; padding: 50px 50px 100px 50px; width: 1200px; }
.termsWrap .innerBox .termsList { padding:30px 27px; border:solid 1px #d1d1d1; }
.btnAgree + .termsList { margin-top: 30px;}
.termsList + .termsList { margin-top: 20px;}
.termsWrap .innerBox .termsList + .termsList { margin-bottom: 20px; }
.termsWrap .innerBox .termsList h4 { height: 44px; font-weight: 600; font-size: 25px; color: #000; line-height: 25px; }
.termsWrap .innerBox .termsList .longTxt {margin-bottom: 11px;padding:14px 19px; height:180px;font-weight: 300; font-size: 14px; color: #626262; line-height: 24px; border:solid 1px #e3e3e3; background: #f5f5f5; overflow-y: auto; }
.btnAgree { font-weight: 500; font-size: 15px; color: #303030; overflow: hidden; }
.btnAgree label         { font-weight: 500; font-size: 15px; color: #303030; cursor: pointer; line-height: 24px;}
.btnAgree .btnAgreeTxt  { font-weight: 400; font-size: 15px; color: #303030; overflow: hidden; }
.btnAgree .btnAgreeTxt strong { font-weight: 500; font-size: 15px; color:#303030; }
.btnAgree .check-fi label i { float:left; }
/*
.btnAgree label { font-weight: 500; font-size: 15px; color: #303030; cursor: pointer; line-height: 24px;}
.btnAgree label strong { font-weight: 500; font-size: 15px; color:#303030; }
*/
.check-fi input[type='checkbox'] { display: none; }
.check-fi input[type='checkbox'] + i { margin: 0 9px 0 0; float:left; color: #c7c7c7;}
.check-fi input[type='checkbox']:checked + i { color: #1f397a; }
.termsWrap .innerBox .agreeBtn {margin:50px 0 0 0;}
.termsWrap .innerBox .agreeBtn a {width:400px;background:#2081ed;}

/* 회원가입 개인정보입력 */
.enterInforWrap {}
.enterInforWrap .section { margin-bottom: 40px; padding-bottom: 50px; border-bottom: solid 1px #ebebeb;}
.enterInforWrap .section.last { margin-bottom: 0; border-bottom: none; }
.enterInforWrap .innerBox { margin:0 auto; padding: 50px 50px 100px 50px; width: 1200px; }

.enterInforWrap h5 { height: 35px; line-height: 15px; font-weight: 500; font-size: 15px; color: #010101; }
.enterInforWrap .formBox { margin-bottom: 10px; overflow: hidden; }
.enterInforWrap .post > .formBox:first-child { margin-bottom: 1px; }
.enterInforWrap .formBox * { display: block; }
.enterInforWrap .formBox input[type='text'] + button { margin-left: 10px; }
.enterInforWrap .id { position: relative; }
.enterInforWrap .id:after { position: absolute; top: 20px;left: 579px; width: 2px; height: 11px; font-weight: 500; background: #fff; content:''; }
.enterInforWrap .id * { float: left; display: block; }
.enterInforWrap .id button { letter-spacing: -0.45px; }
.enterInforWrap .formBox input[type='password'] + input[type='password'] { margin-top: 1px; }
.enterInforWrap .formBox input[type='text'] + input[type='text'] { margin-top: 1px; }
.enterInforWrap .post .formBox * { float: left; display: block; }
.enterInforWrap .post > .formBox:nth-child(2) input[type='text'] { float: none; }
.enterInforWrap .post button { letter-spacing: -0.45px; }
.enterInforWrap .topBox { height: 59px; }
.enterInforWrap .topBox input[type='text'] { margin-right: 10px; }
.enterInforWrap .topBox > p { font-weight: 500; font-size: 15px; color: #fd540a; line-height: 26px; }
.enterInforWrap .select { position: relative; margin-right: 20px; float:left; }
.enterInforWrap .select > a { padding: 0 10px; display: inline-block; width: 160px; height: 50px; font-weight: 500; font-size: 15px; color: #676767; line-height: 50px; border: solid 1px #c7c7c7; background: url('../images/bg/bg_selectDown.gif') no-repeat 90% center; }
.enterInforWrap .select.on > a { background-image: url('../images/bg/bg_selectUp.gif'); }
.enterInforWrap .select > .menuList { padding: 10px 0; position: absolute; top: 50px; left: 0; z-index: 1; display: none; width: 100%; height: auto; border: solid 1px #c7c7c7; border-top: none; background: #fff; }
.enterInforWrap .select.on > .menuList { display: block; }
.enterInforWrap .select.on > .menuList > li { padding: 0 10px; width: 100%; }
.enterInforWrap .select.on > .menuList > li > a { display: block; width: 100%; height: 100%; font-weight: 400; color: #626262; font-size: 15px; line-height: 32px; background: none; }
.enterInforWrap .select.on > .menuList > li > a:hover { color: #2081ed; }
.enterInforWrap .email { overflow: visible; }
.enterInforWrap .email .bottomBox { float: none; clear: both; }
.enterInforWrap .email * { float: left; display: block; }
.enterInforWrap .email .btnAgree { height: 34px; }
.enterInforWrap .btnAgree { height: 44px; }

.enterInforWrap .slideBox .btnAgree label { color: #454545; }
.enterInforWrap .slideBox .togglePart { display: none; }
.enterInforWrap .slideBox.on .togglePart { display: block; }
.enterInforWrap .home { height: 69px; }
.enterInforWrap .home input[type='text'] { float: left; }
.enterInforWrap .home input[type='text'] + input[type='text'] { margin-left: 20px; }
.slideBox .txt { margin-bottom: 18px; font-weight: 500; color: #454545; font-size: 15px; line-height: 26px; }
.enterInforWrap .company input[type='text'] { float: left; }
.enterInforWrap .company input[type='text'] + input[type='text'] { margin-left: 20px; }
.enterInforWrap .post2 .topBox { height: 51px; }
.enterInforWrap .post2 .topBox input[type='text'] { float: left; display: block; width: 390px; }
.enterInforWrap .post2 .topBox button { float: left; display: block; }
.enterInforWrap .post2 .topBox input[type='text'] + button { margin-left: 0; }
.enterInforWrap .post2 .bottomBox input[type='text'] { float: left; display: block; }
.enterInforWrap .post2 .bottomBox input[type='text'] + input[type='text'] { margin-left: 20px; }
.enterInforWrap .company2 { margin-bottom:0; }
.enterInforWrap .company2 .formBox  { margin-bottom:0; float: left; width: 540px; }
.enterInforWrap .company2 .formBox input[type='text'] { margin-right: 10px; float: left; /*display: block;*/ width: 390px; font-weight: 400; font-size: 15px; color: #929292; }
.enterInforWrap .company2 .formBox .fileWrap { position: relative; float:left; width: 140px; height: 50px; /*font-weight: 500; font-size: 15px; color: #fff; line-height: 50px; text-align: center; background: #000; */}
.enterInforWrap .company2 .formBox .fileWrap span { font-weight: 200; font-size: 15px; color: #fff; line-height: 50px; text-align: center; letter-spacing: 1.3px; background: #000; }
.enterInforWrap .company2 .formBox .fileWrap input[type='file'] { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; opacity:0; filter:alpha(opacity=0); cursor:pointer; }
.enterInforWrap .company2 > input[type='text'] { margin-left: 20px; float: left; display: block; }
/* / .회원가입 개인정보입력 */

/* 회원가입완료 */
.memberFinish {}
.memberFinish .innerBox {  margin:0 auto; width: 1200px; }
.memberFinish .innerBox .section { padding: 121px 0 200px 0;  text-align: center; }
.memberFinish .innerBox .section h5 { height: 66px; font-weight: 700; font-size: 40px; color: #181818; line-height: 26px; }
.memberFinish .innerBox .section p { font-weight: 500; font-size: 15px; color: #181818; line-height: 26px; }
.memberFinish .innerBox .section .agreeBtn{ margin-top: 88px; }
.memberFinish .innerBox .section .agreeBtn a:first-child{ background-color: #000; }

.enterInforWrap input[type='text'],
.enterInforWrap input[type='password'] { font-weight: 300; font-size: 15px; color: #929292; }
/* / .회원가입완료 */

/* 로그인 */
.loginWrap { position: fixed;; top: 50%; left: 50%; z-index: 999999999999999999999999999999999; margin:-300px 0 0 -250px; display:none; width: 500px; height: 600px; background: #fff; }
.loginWrap.on {  display:block; }
.loginWrap .innerBox { padding: 0 49px; width: 100%; height: 100%; border: solid 1px #3c3c3c; border-top: solid 3px #2081ed; }
.loginWrap .innerBox > a { position: absolute; top:14px; right: 10px; display: block; width: 19px; height: 19px; font-weight: 600; font-size: 0; color: #454545;  background: url('../images/bg/bg_close.png') no-repeat center center; }
.loginWrap .innerBox .tit { height: 179px; }
.loginWrap .innerBox .tit small { padding: 50px 0 0 0; display: block; height: 80px; font-weight: 700; font-size: 13px; color: #303030; }
.loginWrap .innerBox p { height: 99px; font-weight: 400; font-size: 40px; color: #010101; }
.loginWrap .innerBox .formBox input[type='text']:first-child { margin-bottom: 10px; }
.loginWrap .innerBox .formBox input[type='text'] { margin-bottom: 20px; display:block; width: 100%; font-weight: 200; font-size: 15px; color: #929292; }
.loginWrap .innerBox .formBox input[type='submit'] { display: block; width: 100%; height: 60px; font-weight: 300; font-size: 22px; color: #fff; border:none; background: #2081ed; cursor: pointer; }
.loginWrap .innerBox .loginCon .privacy { height: 66px; border-bottom: solid 1px #ebebeb; }
.loginWrap .innerBox .loginCon .privacy a { display: block; width: 100%; height: 100%; font-weight: 300; font-size: 15px; color: #303030; line-height: 66px; letter-spacing: -0.5px; background: url('../images/bg/bg_privacy.png') no-repeat 35% center; }
.foo { height: 161px;}
.foo .infoTxt { padding: 18px 0 0 0; height: 84px; font-weight: 300; font-size: 15px; color: #303030; line-height: 26px; letter-spacing: -0.5px; text-align: center; }
.foo > a { margin: 1px auto 0 auto; display:block; width: 190px; height: 40px; line-height: 40px; font-weight: 600; font-size: 15px; color: #000; text-align: center; border: solid 1px #000; }
/* / .로그인 */


