/* BASIC css start */
#mypage .info {background:#F7F7F8; display:flex; padding:40px;}
#mypage .info:after { display:block; clear:both; content:'' }


#mypage .info .user {position:relative; height:85px; width:375px; white-space: nowrap;}

#mypage .info .user {display:flex;}
#mypage .info .user .user-img {width:85px; height:85px;}
#mypage .info .user .user-img img {width:100%; vertical-align:top;}
#mypage .info .user .user-info {display: flex; align-content: center; flex-wrap: wrap; margin-left:20px; font-weight:300;}
#mypage .info .user .user-info > div { font-size:14px; color:#000 }
#mypage .info .user .user-info > div span.big {display:block; font-size:18px; margin-bottom:8px}
#mypage .info .user .user-info > div span.grade {color:#75A7D8; font-weight:600;}
#mypage .info .user .user-info > div a {display:block; margin-top:8px; font-size:13px; color:#000;}

#mypage .info .user .user-info .box { padding-top:10px }
#mypage .info .user .user-info .box dl { padding-top:10px; *zoom:1 }
#mypage .info .user .user-info .box dl:after { display:block; clear:both; content:'' }
#mypage .info .user .user-info .box dl dt { float:left; width:90px; font-size:14px }
#mypage .info .user .user-info .box dl dd { float:left; font-size:14px; color:#8d8d8d }


#mypage .info .order {margin-left:50px; width:100%; font-size:0; display:flex;}
#mypage .info .order a {display:inline-block; width:25%; text-align:center; border-right:1px solid #ddd; box-sizing:border-box;}
#mypage .info .order a:last-child {border-right:0;}
#mypage .info .order a span, #mypage .info .order a b {display:block;}
#mypage .info .order a span {font-size:14px; color:#000;}
#mypage .info .order a b {font-size:22px; font-weight:600; color:#000; margin-top:30px;}
#mypage .info .order a b em {font-size:14px;}


.grade_benefit h2 {font-size:18px; font-weight:600; line-height:40px;}
.grade_benefit .grade_benefit_list {margin-top:100px;}
.grade_benefit .grade_benefit_list .benefit_wrap {display:none;}
.grade_benefit .grade_benefit_list ul {overflow:hidden; margin-top:30px; border-left:1px solid #eaeaea;;}

.grade_benefit .grade_benefit_list ul li {width:20%; float:left; text-align:center; padding:40px 0; border-bottom:1px solid #eaeaea; border-right:1px solid #eaeaea;;}
.grade_benefit .grade_benefit_list ul li:nth-child(1),
.grade_benefit .grade_benefit_list ul li:nth-child(2),
.grade_benefit .grade_benefit_list ul li:nth-child(3),
.grade_benefit .grade_benefit_list ul li:nth-child(4),
.grade_benefit .grade_benefit_list ul li:nth-child(5) {border-top:1px solid #eaeaea;}
.grade_benefit .grade_benefit_list ul li span {display:block;}
.grade_benefit .grade_benefit_list ul li span.title {margin-top:15px; font-size:14px; color:#000; line-height:22px;}
.grade_benefit_table {margin-top:80px;}
.grade_benefit_table h2 {font-size:18px; font-weight:600; line-height:60px; position:relative;}
.grade_benefit_table h2 a {line-height:22px; position:absolute; top:50%; margin-top:-11px; right:0; font-size:14px; font-weight:400;}
.grade_benefit_table table {border-top:2px solid #000; border-bottom:1px solid #9A9A9A;}
.grade_benefit_table table td, .grade_benefit_table table th {border-right:1px solid #9A9A9A; border-top:1px solid #9A9A9A; text-align:center;}
.grade_benefit_table table th {background:#353535; color:#fff; padding:16px 0;}
.grade_benefit_table table td {color:#353535;}

.benefit_information {margin-top:80px;}
.benefit_information h2 {font-size:18px; font-weight:600; line-height:40px;}

.benefit_information_wrap {margin-top:40px;}
.benefit_information_wrap h3 {font-size:14px; font-weight:600; line-height:22px;}
.benefit_information_wrap ul {margin-top:10px;}
.benefit_information_wrap ul li {color:#858585; font-size:13px; font-weight:400; line-height:22px; position:relative; padding-left:10px;}
.benefit_information_wrap ul li:after {content:'กค'; top:0; left:3px; line-height:22px; position:absolute;}

.mypage_banner_swiper {margin-top:100px; position:relative;}
.mypage_banner_swiper .swiper-control {position:absolute; bottom:0;; right:0; background:rgba(0,0,0,0.2); z-index: 10;}
.mypage_banner_swiper .swiper-pagination {padding:0 25px 0 10px; width:auto; text-align:left; position:relative; top:0; bottom:0; font-size:14px; font-weight:400; line-height:22px; letter-spacing:0.28px; color:#fff;}
.mypage_banner_swiper .swiper-pagination .swiper-pagination-current {font-weight:500;}

.mypage_banner_swiper .swiper-button-prev, .mypage_banner_swiper .swiper-button-next {width:6px; height:11px; top:50%; margin-top:-5.5px;}
.mypage_banner_swiper .swiper-button-prev {background:url('//beginning1.img10.kr/begin/snap/image/common/icon_swiper_02_prev.svg') 0 0 no-repeat; left:10px; display:none;}
.mypage_banner_swiper .swiper-button-next {background:url('/design/beginning1/img/product/ico_next.svg') 0 0 no-repeat; right:5px;}
.mypage_banner_swiper .swiper-button-prev:after, .mypage_banner_swiper .swiper-button-next:after {content:none;}
/* BASIC css end */

