/* BASIC css start */
.side_info.offline h3 {font-size:14px; font-weight:500;}
.side_info.offline span {font-size:14px; font-weight:300; line-height:20px; margin-top:15px; display:block;  color:#8B8B8B;}
.side_info.offline a {font-size:14px; font-weight:500; line-height:20px; margin-top:15px; text-decoration: underline; display:block;}

.tit-page-2 .qrcode {position:absolute; top:0; right:0;}
.tit-page-2 .qrcode img {width:45px;}
.tit-page-2.line {padding-bottom:25px; border-bottom:1px solid #26231D;}

.new_member_benefit {margin-top:25px;}
.new_member_benefit table td {text-align:center;}
.new_member_benefit table span {display:block; color:#8B8B8B;}

.review_benefit {border-top:1px solid #26231D; padding-top:30px; margin-top:25px;}
.review_benefit dl {display:table; table-layout:fixed; width:100%; line-height:16px; margin-bottom:30px;}
.review_benefit dl:last-child {margin-bottom:0;}
.review_benefit dl dt {width:150px; display:table-cell; text-align:center; color:#000; position:relative;}
.review_benefit dl dt:after {content:''; width:1px; height:16px; top:0; background:#000; right:0; position:absolute;}
.review_benefit dl dd {display:table-cell; padding-left:50px; color:#000; font-size:12px;}

.review_benefit dl dd ol {margin-top:18px; color:#8B8B8B; font-size:10px;}
.review_benefit dl dd ol li {padding-left:10px; line-height:18px; position:relative;}
.review_benefit dl dd ol li:after {content:'-'; position:absolute; top:0; left:0;}

#content.map {padding:0!important;}
#content.map #map {width:100%; height:100vh;}

.offline_event {background:#fff;}
.offline_event h2 {font-size:14px; font-weight:500; padding:100px 0; text-align:center;}
.offline_event ul {display:flex;}
.offline_event ul li {width:25%; margin-right:1px;}
.offline_event ul li:nth-child(4n) {margin-right:0;}
.offline_event ul li img {width:100%;}
.offline_event ul li .info {padding:10px 5px 0;}
.offline_event ul li h3 {font-size:12px; text-decoration:underline; font-weight:700;}
.offline_event ul li span {font-size:12px; font-weight:300; margin-top:8px; display:block;}

.map_overlay {display:none; position:absolute; bottom:44px; right:38px; background:#fff; width:310px; padding:50px 20px; box-sizing:border-box; border:1px solid #CDCDCD; z-index: 1000;}
.map_overlay .title {font-size:14px; line-height:19px;}
.map_overlay .info {margin-top:30px;}
.map_overlay .info dl dd {font-size:12px; line-height:20px; color:#8B8B8B;}
.map_overlay .info dl dd span {font-size:12px; line-height:20px; color:#8B8B8B;}
.map_overlay a {text-decoration:underline; font-size:12px; margin-top:30px; display:block;}
.map_overlay .map_overlay_close {position:absolute; top:17px; right:10px; margin-top:0;}

.map_overlay.open {display:block;}


.meber_grade_benefit {border-top:1px solid #26231D; padding-top:30px; margin-top:25px;}
.meber_grade_benefit dl {overflow:hidden;}
.meber_grade_benefit dl dd {float:left; width:25%; height:150px; position:relative;}
.meber_grade_benefit dl dd:after {content:''; background: #949496 url(//sappun.img13.kr/snap/image/common/icon_arrow_white.svg) 50% 50% no-repeat; background-size: 5px; width:18px; height:18px; position:absolute; border-radius:9px; display:block; z-index:1; right:-9px; color:#fff;}
.meber_grade_benefit dl dd:nth-child(1):after {bottom:57px;}
.meber_grade_benefit dl dd:nth-child(2):after {bottom:47px;}
.meber_grade_benefit dl dd:nth-child(3):after {bottom:37px;}
.meber_grade_benefit dl dd:last-child:after {content:none;}
.meber_grade_benefit dl dd .benefit_header {padding:16px 0 19px; color:#fff; text-align:center; position:absolute; bottom:0; left:0; width:100%; box-sizing:border-box; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-between;}
.meber_grade_benefit dl dd .benefit_header h2 {color:#fff;}
.meber_grade_benefit dl dd .benefit_header.grade_01 {height:150px; background:#303033;}
.meber_grade_benefit dl dd .benefit_header.grade_02 {height:130px; background:#444446;}
.meber_grade_benefit dl dd .benefit_header.grade_03 {height:110px; background:#58585B;}
.meber_grade_benefit dl dd .benefit_header.grade_04 {height:90px; background:#949496;}


.meber_grade_benefit ul {display:flex; background:#F7F7F7;}
.meber_grade_benefit ul li {width:25%; text-align:center; padding:46px 0;}
.meber_grade_benefit ul li div {margin-bottom:30px; font-size:12px;}
.meber_grade_benefit ul li div:last-child {margin-bottom:0;}
.meber_grade_benefit ul li div span {font-size:12px; font-weight:300; display:block;}

.meber_grade_benefit .information {font-size:10px; color:#8B8B8B; margin-top:25px;}
.meber_grade_benefit .information h3 {font-weight:500; font-size:10px; color:#8B8B8B;}
.meber_grade_benefit .information ol {margin-top:5px;}
.meber_grade_benefit .information ol li {padding-left:10px; line-height:18px; position:relative;}
.meber_grade_benefit .information ol li:after {content:'-'; position:absolute; top:0; left:0;}

#mypage {padding-bottom:120px;}
/* BASIC css end */