/* BASIC css start */
#login .tab {
    display: flex;
}

#login .tab a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    border: 1px solid #F8F8F8;
    border-top: 1px solid #F8F8F8;
    border-bottom: 1px solid #007766;
    text-align: center;
    box-sizing: border-box;
    background-color: #fbfbfb;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0;
    color: #8A8A8A;
}

#login .tab a.act {
    background-color: #fff;
    border: 1px solid #007766;
    border-top: 1px solid #007766;
    border-bottom: 0px none;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0px;
    color: #000000;
}

#login .login .loginInput {margin-top: 10px;}
#login .nonmember {margin-top:20px; display:none;}

#inquiryOrder { display:none; }
#inquiryOrder .txt { margin:15px 15px 0; padding:0; }
#inquiryOrder .frm { overflow:hidden; width:200px; margin:35px auto 0; }
#inquiryOrder .frm dt,
#inquiryOrder .frm dd { float:left; }
#inquiryOrder .frm dt { width:60px; margin-top:5px; line-height:32px; font-weight:bold; letter-spacing:-1px; }
#inquiryOrder .frm dd { width:140px; }
#inquiryOrder .frm input[type=text] { width:100%; height:32px; line-height:32px; margin-top:5px; padding:0 5px; border:1px solid #c6c6c6; background:#fbfbfb; border-radius:0; }
#inquiryOrder .btns { margin:40px 10px 20px; }
#inquiryOrder .btns a { margin-top:10px; }

.member {
    margin: 22px 0 0;
    padding: 0;
}

.login {
    padding: 30px 20px;
}

.login > .title {
    text-align: center;
    margin-bottom: 15px;
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 0;
    color: #000000;
}

.login .login_box legend{display:none;}
.login .login_box dl {}
.login .login_box dl dt {display:none;}
.login .login_box dl dd {
    padding: 0 0 7px 0;
}

.login .login_box dl dd input {
    width: 100%;
    height: 47px;
    border: 1px solid #DFDFDF;
    border-radius: 5px;
    padding: 0 20px;
    font-size: 13px;
    font-weight: 300;
    letter-spacing: 0;
}

.login .login_box dl dd input::placeholder {
    font-size: 13px;
    font-weight: 300;
    letter-spacing: 0;
    color: #A7A7A7;
}

.login .login_box .inp_chk {
    display: flex;
    gap: 5px;
    align-items: center;
    padding: 6px 0 0 0;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: -0.6px;
    color: #000000;
}

.login .login_box .inp_chk .icon {
    display: block;
    width: 13px;
    height: 13px;
    background: url('/design/greenstore/renewal/mo/icon-caution.svg') no-repeat center;
    background-size: 13px;
}


.login .login_box .submit {
    padding: 28px 0 0;
    margin-bottom: 22px;
}

.login .login_box .submit .member_login_order_btn {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 47px;
    background: #007766;
    border-radius: 5px;
    font-size: 18pX;
    font-weight: 600;
    letter-spacing: 0px;
    color: #FFFFFF;
    border: 0;
}

/* 회원가입/아이디찾기/비밀번호 */
.login .login_find {
    text-align: center;
    margin-bottom: 36px;
}

.login .login_find li {
    position: relative;
    display: inline-block;
    padding: 0 16px 0 12px;
}

.login .login_find li a {
    font-size: 13px;
    font-weight: 300;
    letter-spacing: -0.78px;
    color: #007766;
}

.login .login_find li:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 1px;
    height: 10px;
    background: #A7A7A7;
}

.login .login_find li:first-child:before {display:none;}

/* SNS 로그인 (페이스북/ 페이코 / 네이버) */

.login .login_box .sns_login li + li {
    margin-top: 7px;
}

.login .login_box .sns_login li a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    height: 42px;
    background: #fff;
    border: 1px solid #DFDFDF;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: -0.9px;
    color: #000000;
}

.login .login_box .sns_login li a::before {
    content: '';
    width: 19px;
    height: 20px;
}

.login .login_box .sns_login li.kakao a::before {
    background:url('/design/greenstore/renewal/mo/icon_login_kakao.svg') no-repeat center;
    background-size: 19px;
}

.login .login_box .sns_login li.naver a::before {
    background:url('/design/greenstore/renewal/mo/icon_login_naver.svg') no-repeat center;
    background-size: 19px;
}


/* 비회원 주문조회 */
.login .guest_order_box .guest_txt {padding:20px 0 10px 0;}
.login .guest_order_box .guest_txt strong {display:block; font-size:14px;}
.login .guest_order_box .guest_txt span {margin:2px 0 0 0;}
.login .guest_order_box legend {display:none;}
.login .guest_order_box dl {}
.login .guest_order_box dl dt {display:none;}
.login .guest_order_box dl dd {padding:0 0 5px 0;}
.login .guest_order_box dl dd input {width:100%; height:37px; text-indent:10px; border:1px solid #c3c3c3; box-sizing:border-box;}
.login .guest_order_box .submit {padding:10px 0 5px 0;}

.login .bar-wrap {
    position: relative;
    margin: 20px 0 18px;
    height: 29px;
}

.login .bar-wrap::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    height: 1px;
    background: #BEBEBE;
}

.login .bar-wrap > span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
    background: #fff;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: -0.9px;
    color: #000000;
    padding: 0 17px;
    z-index: 1;
}

.login .btn-join {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 47px;
    border: 1px solid #007766;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: -0.9px;
    color: #007766;
}

.login .banner-wrap {
    margin: 20px 0 0;
    overflow: hidden;
    border-radius: 5px;
}

.login .banner-wrap img {
    width: 100%;
}

.login .nonmember .bar-wrap {
    margin-bottom: 28px;
}

.login .nonmember .bar-wrap::before {
    background: #FF4214;
}

.login .nonmember .bar-wrap > span {
    background: #fff;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: -0.9px;
    color: #FF4214;
    padding: 0 12px;
}

.login .nonmember .btn-join {
    border: 1px solid #FF4214;
    color: #FF4214;
}

.benefit-wrap > .title {
    text-align: center;
    margin-bottom: 29px;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: -0.6px;
    color: #000000;
}

.benefit-wrap > .title span {
    font-weight: bold;
}

.benefit-wrap .list-wrap {
    display: flex;
    gap: 13px;
    max-width: 600px;
    margin: 0 auto 30px;
}

.benefit-wrap .list-wrap > li {
    flex: 1;
}


.benefit-wrap .list-wrap .img-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 50%;
    background: #F7F9F8;
    margin-bottom: 11px;
}

.benefit-wrap .list-wrap .img-wrap img {
    width: 28px;
    height: auto;
    object-fit: contain;
}

.benefit-wrap .list-wrap .list-title {
    text-align: center;
    font-weight: bold;
    font-size: 15px;
    letter-spacing: -0.6px;
    color: #000000;
}
/* BASIC css end */