/* BASIC css start */
#loginWrap button:focus { outline: none; }

#loginWrap .sub_title { width: 580px; border: none; border-bottom: 1px solid #cdcdcd; padding: 0 0 50px; font-size: 35px; margin: 50px auto 0px; }

#loginWrap .loginBox { width: 660px; margin:-106px auto 0; border: 1px solid #FFF; padding-bottom:50px;  min-height: 300px; }

/* tab menu */
#loginWrap .login_tab .login_tablinks { width: 50%; padding: 40px 0; float: left; font-size: 25px; font-weight: bold; border-bottom: 2px solid #cdcdcd; background-color: #fff; color: #cdcdcd; }
#loginWrap .login_tab .login_active { color:#000; border-bottom: 2px solid #000; transition: 0.2s; }


#loginWrap .loginBox .login_input input { padding: 0 20px; border: 1px solid #cdcdcd; background-color: #fff; height: 50px; 
                                        width: 100%; font-size: 17px; box-sizing: border-box; }
#loginWrap .loginBox .login_input input::placeholder {  }

#loginWrap .loginBox .login_tabcontent { width: 580px; margin: 150px auto 0; }


/* member login */
#loginWrap .loginBox .signleft {}
#loginWrap .loginBox .signleft  h2 { padding-bottom:30px;  }
#loginWrap .loginBox .signleft .MS_login_id {}
#loginWrap .loginBox .signleft .MS_login_pw {}
#loginWrap .loginBox .signleft .btn_lost { padding-top:5px; }
#loginWrap .loginBox .signleft .log_list .se-log:first-child { margin-left: 0px; }
#loginWrap .loginBox .signleft .log_list .se-log { float: left; margin: 15px; font-weight: bold; font-size: 17px; }
#loginWrap .loginBox .signleft .log_list .se-log input { width: 20px; height: 20px; margin-top: -3px; }

#loginWrap .loginBox .signleft .login_join { height: 38px; padding: 20px 0 25px;}
#loginWrap .loginBox .signleft .login_join li:last-child { border-right: none; }
#loginWrap .loginBox .signleft .login_join li { float: left; width: 50%; text-align: center; border-right: 1px solid #cdcdcd; box-sizing: border-box; margin: 10px 0; }
#loginWrap .loginBox .signleft .login_join li a { font-size: 17px; }

#loginWrap .loginBox .signleft .login_sns { width: 100%; height: 100px; text-align: center; border-top: 1px solid #cdcdcd; border-bottom: 1px solid #cdcdcd; padding: 45px 0; }
#loginWrap .loginBox .signleft .login_sns p { font-size: 22px; font-weight: bold; margin-bottom: 20px; }
#loginWrap .loginBox .signleft .login_sns li { display: inline-block; margin: 0 15px; }
#loginWrap .loginBox .signleft .login_sns li a { width: 55px; height: 55px; display: inline-block;  border-radius: 28px; }
#loginWrap .loginBox .signleft .login_sns li a.Naver { background: url(http://efairplay.img2.kr/www/018_site/img/site_img/login_sns_icon.jpg) no-repeat 0 0; background-position: 0 0;}
#loginWrap .loginBox .signleft .login_sns li a.Kakao { background: url(http://efairplay.img2.kr/www/018_site/img/site_img/login_sns_icon.jpg) no-repeat 0 0; background-position: -79px 0; }
#loginWrap .loginBox .signleft .login_sns li a.Facebook { background: url(http://efairplay.img2.kr/www/018_site/img/site_img/login_sns_icon.jpg) no-repeat 0 0; background-position: -157px 0; }
#loginWrap .loginBox .signleft .login_sns li a.Apple { background: url(http://efairplay.img2.kr/www/018_site/img/site_img/login_sns_icon.jpg) no-repeat 0 0; background-position: right 0; }

#loginWrap .loginBox .signleft .join_membership { height: 60px; text-align: center; padding-top: 45px; }
#loginWrap .loginBox .signleft .join_membership p { font-size: 27px; line-height: 35px;}
#loginWrap .loginBox .signleft .join_membership li {  }
#loginWrap .loginBox .signleft .join_membership li span.membership_coupon{ width: 107px; height: 56px; 
            background: url(http://efairplay.img2.kr/www/018_site/img/site_img/login_join_membership.jpg) no-repeat 0 0; background-position: 0 0; display: inline-block; }

/* sign */
#loginWrap .loginBox .signright {}
#loginWrap .loginBox .signright h2 { padding-bottom:30px;  }
#loginWrap .loginBox .signright h3 { 
    padding-top: 14px;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -1px;
    padding-bottom: 8px;
    border-bottom: 1px solid;
    /* display: inline-block; */
    margin-bottom: 5px;
    text-align: center;
}
#loginWrap .loginBox .signright .btns { width: 100px;  }
#loginWrap .loginBox .signright .btns a { display: block; margin-top: 8px; }

#loginWrap .loginBox .sns_login { }
#loginWrap .loginBox .sns_login li { float:left; height:30px; margin:3px 2px;}
#loginWrap .loginBox .sns_login li a { display:block; width:120px;height:30px; line-height:30px; background:#666;font-size:12px; color:#fff;text-align:center;transition:all .8s ease;-webkit-transition:all .8s ease;}

#loginWrap .loginBox .sns_login .Naver a { background:#00C73C ; }
#loginWrap .loginBox .sns_login .Facebook a  {display:block;   background:#5c84d7 ; }
#loginWrap .loginBox .sns_login .Kakao a  {display:block; background:#f9b932 ; }
#loginWrap .loginBox .sns_login li:hover a { transition:all .3s ease;-webkit-transition:all .3s ease; background:#333; }


#loginWrap .-btn-login {
    width: 100%;
    border: 1px solid #333;
    margin-top: 15px;
    text-align: center;    
    padding: 20px 0;
    font-size: 20px;
    font-weight: normal;
}

#loginWrap .-btn-join { background-color: #7d7d7d; border: 1px solid #7d7d7d; }
/* order shopping */

#loginWrap .orderBox  {  zoom: 1; overflow: hidden; clear: both; width: 900px; margin:50px auto; border: 1px solid #EEEEEE; padding:50px;  }
#loginWrap .orderBox .order-sp  h2 { padding-bottom:0px;  }
#loginWrap .orderBox .order-sp { width: 400px; margin:0px auto;   }

#loginWrap .join_benefit_box { margin-top: 40px; }

.join_benefit_box { margin-bottom: 40px; }
.join_benefit_box .join_benefit_title_box { margin-bottom: 20px; }
.join_benefit_box .join_benefit_title_box p { font-size: 22px; font-weight: bold; margin: 3px 0; }
.join_benefit_box .join_benefit_title_box p span { font-size: 16px; font-weight: lighter; color: #8f8f8f; word-break: keep-all; }
.join_benefit_box ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
.join_benefit_box li { display: flex; justify-content: center; align-items: center; background-color: #f4f4f4; width: 49.5%; margin-bottom: 1%; text-align: center; padding: 30px 0; }
.join_benefit_box li:nth-child(2n) .icon_box { flex-basis: 45%; }
.join_benefit_box li:nth-child(2n) .text_box { flex-basis: 55%; }
.join_benefit_box li .icon_box { flex-basis: 50%; text-align: right; margin-right: 10px; }
.join_benefit_box li .icon_box img { width: 52%; }
.join_benefit_box li .text_box { flex-basis: 50%; text-align: left; margin-right: 20px; }
.join_benefit_box li .text_box p { font-size: 18px; margin-bottom: 6px; }
.join_benefit_box li .text_box span { font-size: 19px; font-weight: bold; }
/* BASIC css end */

