/* BASIC css start */
.membership-benefit-container{}

/*멤버십 혜택 배너 영역*/
.mb-banner{
    width:100%;
    height:531px;
    line-height:531px;
    background:url('http://ftp.ooo1069.img12.kr/pc_renew_2020/pc_mb_banner_bg.jpg')no-repeat center center;
    background-color:#b0a593;
}
.mb-banner .mb-title{
    padding:0 15px;
    padding-top:155px;
    max-width:1200px;
    margin:0 auto;
}
.mb-banner .mb-title .mb-title-top{
    
    padding-bottom:61px;
    background:url('http://ftp.ooo1069.img12.kr/pc_renew_2020/pc_mb_benefitguide.png')no-repeat left top 76px;
}
.mb-banner .mb-title .mb-title-top p{
    line-height:48px;
    font-size:31px;
    font-weight:200;
    font-family:'Noto Sans KR';
    color:#504a42;
    letter-spacing:-1.55px;
}
.mb-banner .mb-title .mb-title-top h2{
    line-height:73px;
    font-size:58px;
    font-weight:500;
    font-family:'Noto Sans KR';
    color:#504a42;
    letter-spacing:-2.9px;
}
.mb-banner .mb-title .mb-title-bottom{
    line-height:38px;
    font-size:18px;
    font-weight:300;
    font-family:'Noto Sans KR';
    color:#353531;
    letter-spacing:-0.9px;
}
.mb-banner .mb-title .mb-title-bottom > a{
    line-height:38px;
    font-size:18px;
    font-weight:500;
    font-family:'Noto Sans KR';
    color:#353531;
    letter-spacing:-0.9px;
}

/*멤버십 혜택 컨텐츠*/
.mb-contents{
    padding-bottom:175px;
    background-color:#e7e2de;
}

.mb-contents .mbc-section .mbc-wrapper{
    width:1200px;
    margin:0 auto;
}
.mb-contents .mbc-section .mbc-wrapper .mbc-title{
    padding-top:110px;
    text-align:center;
}
.mb-contents .mbc-section .mbc-wrapper .mbc-title .section-number{
    margin-bottom:20px;
}
.mb-contents .mbc-section .mbc-wrapper .mbc-title .section-number > span{
    display:inline-block;
    width:60px;
    height:60px;
    line-height:60px;
    text-align:center;
    color:#fff;
    font-size:22px;
    font-family: 'Montserrat';
    font-weight:500;
    background:#f4b683;
    border-radius:30px;
}
.mb-contents .mbc-section .mbc-wrapper .mbc-title > h3{
    line-height:61px;
    color:#4e4e4c;
    font-family:'Noto Sans KR';
    font-size:45px;
    font-weight:500;
    letter-spacing:-2.25px;
    margin-bottom:56px;
}
.mb-contents .mbc-section .mbc-wrapper .mbc-title > p{
    line-height:37px;
    color:#4e4e4c;
    font-family:'Noto Sans KR';
    font-size:24px;
    font-weight:200;
    letter-spacing:-1.2px;
}
/*신규 쿠폰 영역*/
#mbc-section01 .coupon-list{
    display:flex;
    flex-wrap:wrap;
    font-size:0px;
    width:682px;
    margin:0 auto;
    padding-top:94px;
}
#mbc-section01 .coupon-list > li{
    display:inline-block;
    vertical-align:top;
    padding-right:110px;
    margin-bottom:20px;
    background:url('http://ftp.ooo1069.img12.kr/pc_renew_2020/pc_mb_coupon_plus.png')no-repeat center right 42px;
}
#mbc-section01 .coupon-list > li:nth-child(even){
    padding-right:0px;
    background:none;
}
#mbc-section01 .coupon-list > li .coupon{
    text-align:center;
    display:inline-block;
    width:286px;
    height:159px;
    background:url('http://ftp.ooo1069.img12.kr/pc_renew_2020/pc_mb_coupon_bg.png')no-repeat center center;
}
#mbc-section01 .coupon-list > li .coupon .coupon-name{
    line-height:30px;
    color:#4e4e4c;
    font-family:'Noto Sans KR';
    font-size:15px;
    letter-spacing:-0.375px;
    padding-top:41px;
}
#mbc-section01 .coupon-list > li .coupon .coupon-price{
    font-size:0px;
    line-height:45px;
}
#mbc-section01 .coupon-list > li .coupon .coupon-price b{
    display:inline-block;
    vertical-align:bottom;
    line-height:45px;
    color:#4e4e4c;
    font-family: 'Montserrat';
    font-size:36px;
    font-weight:600;
    letter-spacing:-0.9px;
}
#mbc-section01 .coupon-list > li .coupon .coupon-price span{
    display:inline-block;
    vertical-align:bottom;
    line-height:28px;
    color:#4e4e4c;
    font-family: 'Montserrat';
    font-size:13px;
    font-weight:600;
    letter-spacing:-0.325px;
    padding-left:1px;
}
.mbc-section .joinus-btn-wrap{
    text-align:center;
    padding-top:34px;
    padding-bottom:120px;
    border-bottom:1px solid #c8c8c8;
}
.mbc-section .joinus-btn-wrap > a{
    display:inline-block;
    padding:15px 60px;
    text-align:center;
    background:#4e4e4c;
} 
.mbc-section .joinus-btn-wrap > a > h5{
    line-height:24px;
    color:#fff;
    font-family: 'Montserrat';
    font-weight:500;
    font-size:20px;
    letter-spacing:-0.5px;
}
.mbc-section .joinus-btn-wrap > a > p{
    line-height:24px;
    color:#fff;
    font-family: 'Noto Sans KR';
    font-weight:300;
    font-size:16px;
    letter-spacing:-0.4px;
}
.mbc-white-wrap{
    background:#ffffff;
}
/*section01*/
#mbc-section01{
    background:#f1eeec;
    padding-bottom:600px;
}
#mbc-section01 .mbc-wrapper .mbc-title > h3{
    margin-bottom:22px;
}

/*section02*/
#mbc-section02{
    margin-top:-600px;
}
.benefit-list{
    padding:86px;
    padding-bottom:38px;
    font-size:0px;
}
.benefit-list li{
    width:50%;
    display:inline-block;
    vertical-align:top;
    font-size:0px;
}
.benefit-list li > .icon{
    display:inline-block;
    vertical-align:top;
}
.benefit-list li > .desc{
    display:inline-block;
    vertical-align:top;
    padding-bottom:48px;
}
.benefit-list li > .desc > .list-num{
    line-height:24px;
    color:#c9a491;
    font-family:'Nunito Sans';
    font-size:14px;
    font-weight:600;
    letter-spacing:0.35px;
}
.benefit-list li > .desc > .list-num.orange{
    color:#f4b683;
}
.benefit-list li > .desc > h5{
    line-height:29px;
    font-family:'Noto Sans KR';
    font-size:20px;
    font-weight:500;
    margin-bottom:5px;
}
.benefit-list li > .desc > .info{
    line-height:22px;
    font-family:'Nunito Sans','Noto Sans KR';
    font-size:16px;
    font-weight:300;
    color:#888888;
    
}
.benefit-list li > .desc .benefit-btn-wrap{
    padding-top:12px;
}
.benefit-list li > .desc .benefit-btn-wrap a{
    display:inline-block;
    height:35px;
    line-height:35px;
    border-radius:17.5px;
    background:#b4aca0;
    color:#fff;
    font-size:15px;
    font-family:'Noto Sans KR';
    font-weight:300;
    padding:0 16px;
}

/**/
.mb-grade-wrap{
    padding:81px 105px;
}
.mb-grade-wrap > ul > li{
    font-size:0px;
    border-bottom:1px dashed #f6f6f6;
}
.mb-grade-wrap > ul > li:last-child{
    border-bottom:0px;
}
.mb-grade-wrap > ul > li .col{
    display:inline-block;
    vertical-align:top;
    width:20%;
}
.mb-grade-wrap > ul > li .badge-wrap{
    text-align:center;
    padding-bottom:32px;
}
.mb-grade-wrap > ul > li .badge-wrap > h5{
    line-height:33px;
    color:#4e4e4c;
    font-family:'Nunito Sans';
    font-size:18px;
    font-weight:600;
    padding-top:5px;
}
.mb-grade-wrap > ul > li.top{
    padding:0;
    border-bottom:1px solid #7d7d7d;
}
.mb-grade-wrap > ul > li .desc{
    padding:30px 28px;
}
.mb-grade-wrap > ul > li .desc > p{
    line-height:20px;
    color:#4e4e4c;
    font-size:15px;
    font-weight:300;
    font-family:'Nunito Sans','Noto Sans KR';
    letter-spacing:-0.75px;
}
.mb-grade-wrap > ul > li .desc > h5{
    line-height:23px;
    color:#222222;
    font-size:17px;
    font-weight:bold;
    font-family:'Nunito Sans','Noto Sans KR';
    letter-spacing:-0.85px;
}

.mb-grade-wrap > ul > li .desc.vip > h5{
    color:#77b1bf;
}
.mb-grade-wrap > ul > li .desc.gold > h5{
    color:#e2b557;
}
.mb-grade-wrap > ul > li .desc.silver > h5{
    color:#bbbbbb;
}
.mb-grade-wrap > ul > li .desc.moco > h5{
    color:#94ba8b;
}
.mb-grade-wrap > ul > li .coupon-list{
    padding:40px 0;
    padding-left:28px;
}
.mb-grade-wrap > ul > li .coupon-list li{
    padding-bottom:20px;
}
.mb-grade-wrap > ul > li .coupon-list li:last-child{
    padding-bottom:0;
}
.mb-grade-wrap > ul > li .coupon-list li > .coupon{
    display:inline-block;
    width:110px;
    height:55px;
    font-size:0px;
    vertical-align:top;
} 
.mb-grade-wrap > ul > li .coupon-list li > .coupon > .left{
    display:inline-block;
    vertical-align:top;
    width:30px;
    height:55px;
    line-height:55px;
    background:#222222;
    position:relative;
}
.mb-grade-wrap > ul > li .coupon-list li > .coupon > .left::before{
    position:absolute;
    top:0;
    left:0;
    display:inline-block;
    content:'';
    width:30px;
    height:55px;
    line-height:55px;
    text-align:center;
    background:url('http://ftp.ooo1069.img12.kr/pc_renew_2020/pc_coupon_txt.png')no-repeat center center;
}

.mb-grade-wrap > ul > li .coupon-list li > .coupon > .right{
    display:inline-block;
    vertical-align:top;
    width:79px;
    height:53px;
    line-height:53px;
    border:1px solid #d9d9d9;
    border-left:0px;
    text-align:center;
}
.mb-grade-wrap > ul > li .coupon-list li > .coupon > .right > h5{
    line-height:17px;
    color:#4e4e4c;
    font-family:'Nunito Sans','Noto Sans KR';
    font-size:14px;
    letter-spacing:-0.7px;
    padding-top:10px;
}
.mb-grade-wrap > ul > li .coupon-list li > .coupon > .right > p{
    line-height:17px;
    color:#4e4e4c;
    font-family:'Nunito Sans','Noto Sans KR';
    font-size:14px;
    font-weight:300;
    letter-spacing:-0.7px;
}

.mb-grade-wrap > ul > li .coupon-list.vip li > .coupon > .left{
    background:#77b1bf;
}
.mb-grade-wrap > ul > li .coupon-list.gold li > .coupon > .left{
    background:#e2b557;
}
.mb-grade-wrap > ul > li .coupon-list.silver li > .coupon > .left{
    background:#bbbbbb;
}
.mb-grade-wrap > ul > li .coupon-list.moco li > .coupon > .left{
    background:#94ba8b;
}

/*멤버십 혜택 푸터*/
.mb-footer{
    padding:73px;
    background:#494949;
}
.mb-footer .mbf-wrapper{
    width:1200px;
    margin:0 auto;
    font-size:0px;
}
.mb-footer .mbf-wrapper .mbf-box{
    display:inline-block;
    width:50%;
    vertical-align:top;
    
}
.mb-footer .mbf-wrapper .mbf-box > h2{
    line-height:29px;
    color:#f4b683;
    font-size:20px;
    font-family:'Noto Sans KR';
    letter-spacing:-1px;
    margin-bottom:13px;
}
.mb-footer .mbf-wrapper .mbf-box > ul > li{
    position:relative;
    line-height:22px;
    color:#dbdbdb;
    font-size:16px;
    font-family:'Nunito Sans','Noto Sans KR';
    font-weight:200;
    letter-spacing:-0.4px;
    margin-bottom:19px;
    padding-left:14px;
}
.mb-footer .mbf-wrapper .mbf-box > ul > li:before {
    display: inline-block;
    content: '';
    width: 2px;
    height: 2px;
    border-radius: 1px;
    background: #dbdbdb;
    position: absolute;
    top: 8px;
    left: 0;
}

/* BASIC css end */

