@charset "utf-8";

/* typography */
@font-face{
	font-family:'Noto Sans Korean';font-style:normal;font-weight:400;
	src:url(//script.gmarket.com/fonts/NotoSansKR-DemiLight-Hestia.eot),
		url(//script.gmarket.com/fonts/NotoSansKR-DemiLight-Hestia.eot?#iefix) format('embedded-opentype');
	src:local('Noto Sans DemiLight'),local('NotoSans-DemiLight'),
		url(//script.gmarket.com/fonts/NotoSansKR-DemiLight-Hestia.woff) format('woff'),
		url(//script.gmarket.com/fonts/NotoSansKR-DemiLight-Hestia.otf) format('opentype');
}
@font-face{
	font-family:'Noto Sans Korean';font-style:normal;font-weight:bold;
	src:url(//script.gmarket.com/fonts/NotoSansKR-Medium-Hestia.eot),
		url(//script.gmarket.com/fonts/NotoSansKR-Medium-Hestia.eot?#iefix) format('embedded-opentype');
	src:local('Noto Sans Medium'),local('NotoSans-Medium'),
		url(//script.gmarket.com/fonts/NotoSansKR-Medium-Hestia.woff) format('woff'),
		url(//script.gmarket.com/fonts/NotoSansKR-Medium-Hestia.otf) format('opentype');
}
@font-face{
	font-family: 'Gmarket Sans';    font-style: normal;    font-weight: 700;
	src: local('Gmarket Sans Bold'), local('GmarketSans-Bold'),
	url('//script.gmarket.com/fonts/GmarketSansBold.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('//script.gmarket.com/fonts/GmarketSansBold.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
@font-face{
	font-family: 'Gmarket Sans';    font-style: normal;    font-weight: 500;
	src: local('Gmarket Sans Medium'), local('GmarketSans-Medium'),
	url('//script.gmarket.com/fonts/GmarketSansMedium.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('//script.gmarket.com/fonts/GmarketSansMedium.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
@font-face{
	font-family: 'Gmarket Sans';    font-style: normal;    font-weight: 300;
	src: local('Gmarket Sans Light'), local('GmarketSans-Light'),
	url('//script.gmarket.com/fonts/GmarketSansLight.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('//script.gmarket.com/fonts/GmarketSansLight.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,table,th,td,form,fieldset,legend,textarea,input,select,textarea,button{margin:0;padding:0}
html,body{height:100%;overflow-x:hidden;-webkit-text-size-adjust:none;}
html.os__ios, html.os__ios body{overflow-x: visible;}
body{font-size:14px;color:#000;-webkit-overflow-scrolling: touch}
fieldset,li,img{border:0;vertical-align:top}
dl,ul,ol,li{list-style:none}
button{overflow:visible;border:0;background-color:transparent;cursor:pointer}
button[disabled]{cursor:default}
address,caption,em{font-style:normal}
a,a:focus,a:active,a:hover{text-decoration:none}
a[href^=tel]{color:inherit;text-decoration:none}
table{border-collapse:collapse;border-spacing:0}
table caption{display:none;height:0;font-size:0;line-height:0}
select,input{border:0;-webkit-border-radius:0;border-radius:0;background:none;-webkit-appearance:none;-webkit-box-shadow:none;box-shadow:none}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type="number"]{-moz-appearance: textfield} /* FF */
hr{display:none}
::-ms-clear{display:none} /* IE10+ */
.for-a11y,
legend{position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;border: 0;clip: rect(0 0 0 0);overflow: hidden;text-indent: -5000em;}
input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button{-webkit-appearance: none;margin: 0}
/* chromium 38 input box bug fix */
@media screen and (-webkit-min-device-pixel-ratio:0){
	input{line-height:100% !important}
}

.service__smilecard *{font-family: -apple-system, BlinkMacSystemFont, Apple SD Gothic Neo, Roboto, Noto Sans CJK KR, Tahoma, 'Noto Sans KR', sans-serif;line-height: 1.25;font-weight:normal}
#wrapper{min-width:320px;margin: 0 auto;}
#container{position:relative}
.page__smilecard-home--history #wrapper{padding-bottom: 48px;box-sizing:border-box}
.platform__app .page__smilecard-home--history #wrapper{padding-bottom: 0;}

/* skipnavi */
#skipnavi{margin:0;padding:0}
#skipnavi a{position:fixed;left:0;right:0;top:-9999px;z-index:5000;display:block;padding:8px 0 7px;background:#067DFD;color:#fff;text-align:center;text-decoration:none}
#skipnavi a:active,#skipnavi a:focus{top:0;font-size:12px;font-weight:bold;line-height:1.5}

/* sprite image */
.sprite__smilecard-home,
.sprite__smilecard-home--before::before,
.sprite__smilecard-home--after::after{display:inline-block;background:url(//pics.gmarket.com/smilecard/home/sprite_smilecard-home@2x.png) no-repeat;-webkit-background-size:300px auto;background-size:300px auto;overflow: hidden;}
.sprite__smilecard-home--before::before,
.sprite__smilecard-home--after::after{content:''}

/* 신규헤더 style 가져옴 */
#header .box__header { position: relative; width: 100%; height: 48px; z-index: 350; }
#header .box__header .box__header-inner { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 48px; background-color: #fff; border-bottom: 1px solid #f5f5f5;}
#header .box__header .box__header-content { position: relative; max-width: 768px; margin: 0 auto; }
#header .box__header .button__back { position: absolute; left: 0; top: 0; width: 48px; height: 48px; background-position: 0 -100px; -webkit-background-position: 0 -100px; }
#header .box__header .box__header-title { display: -webkit-flex; display: flex; height: 48px; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; color: #000 }
#header .box__header .box__header-title .box__title .text {display: block; padding-top: 4px; font-size: 18px; font-weight: 500; font-family: "Gmarket Sans"; line-height: 24px; color: #222; white-space: nowrap }
#header .box__header .box__header-menu { position: absolute; right: 0; top: 0; height: 48px; font-size: 0; }
#header .box__header .box__header-menu .button__close { position: relative; display: inline-block; font-size: 12px; vertical-align: top; width: 48px; height: 48px; background-position: -100px -100px; -webkit-background-position: -100px -100px; }

.box__article{margin-bottom:8px;background-color:#fff;}
body.service__smilecard .text__tag{font-family:'Gmarket Sans';font-weight: 500;display: inline-block;vertical-align: middle;height: 20px;margin: -1px 0 0;padding: 3px 6px;font-size: 11px;color: #00c400;letter-spacing: -0.5px;border: 1px solid #00c400;box-sizing:border-box;-webkit-border-radius:10px;border-radius:10px}
body.service__smilecard .text__tag--negative{font-family:'Gmarket Sans';font-weight: 500;display: inline-block;vertical-align: middle;height: 20px;margin: -1px 0 0;padding: 3px 6px;font-size: 11px;color: #ef2b2a;letter-spacing: -0.5px;border: 1px solid #ef2b2a;box-sizing:border-box;-webkit-border-radius:10px;border-radius:10px}
body.box__scroll-rock{position:fixed;left:0;top:0;right:0;overflow-y:auto}
body.page__smilecard-home,
body.page__smilecard-home--history{background-color:#F5F5F5;}

.smilecard-section .box__smilecard{position:relative;margin:0 auto;width:100%;box-sizing:border-box}
.smilecard-section .box__smilecard .box__smilecard-swipe{position: relative;padding:24px 0 10px;text-align: center;}
.smilecard-section .box__smilecard .box__card-title{position: relative;display: inline-block;text-align: center;white-space: nowrap;z-index: 55;}
.smilecard-section .box__smilecard .box__card-title .text__title-card{display: inline-block;vertical-align: middle;font-size:15px;line-height:1.7;color:#222;font-weight:normal}
.smilecard-section .box__smilecard .box__card-title .text__status{}
.smilecard-section .box__smilecard .box__card-title .button__card-more{position: relative;display: inline-block;vertical-align: middle;margin:-1px 0 0 -4px;z-index: 52;overflow: hidden;}
.smilecard-section .box__smilecard .box__card-title .button__card-more::after{display: block;width: 24px;height: 24px;background-position: -130px 0;}
.smilecard-section .box__smilecard .text__guide{position:absolute;top:0;left:0;width:100%;height: 100%;font-size: 12px;color: #000;text-align:center;opacity:1;z-index: 60;-webkit-transform: scale(0.996) translateZ(2px);transform: scale(0.996) translateZ(2px);}
.smilecard-section .box__smilecard .text__guide:after{content:'';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #000;border-radius: 12px;-webkit-border-radius: 12px;opacity:.3;z-index: -1;}
.smilecard-section .box__smilecard .text__guide #card-swipe-guide{display: block;width: 180px;height: 180px;margin:110px auto 10px;}
.smilecard-section .box__smilecard .card-canvas{position:absolute;top:0;left:50%;width:100%;height:100%;z-index:50;-webkit-user-select:none;user-select:none;-webkit-transform: translate(-50%, 0);transform: translate(-50%, 0);}
.smilecard-section .box__smilecard #js-confeti{position: absolute;top: 0;left: 50%;width: 500px;height: 480px;margin-left: -250px;overflow: hidden;z-index: 1000}
.smilecard-section .box__smilecard .box__card{width:182px;height:289px;margin:14px auto 10px;-webkit-perspective:600px;perspective:600px;}
.smilecard-section .box__smilecard .box__card-flip{position:relative;width: 100%;height: 100%;-webkit-transform-style: preserve-3d;transform-style: preserve-3d}
.smilecard-section .box__smilecard .box__card-flip:before{content: '';position: absolute;top: -8px;left: 15px;width: 71px;height: 15px;background: url(//pics.gmarket.com/smilecard/home/images__light.png) 0 0 no-repeat;-webkit-background-size:71px 15px;background-size:71px 15px;z-index: 100;opacity: 0;-webkit-animation: flash 1s ease-out alternate infinite;animation: flash 1s ease-out alternate infinite;transform: translateZ(4px);}
.smilecard-section .box__smilecard .box__card-flip .image__smilecard{position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-border-radius:12px;border-radius:12px;-webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);} /* card round */
.smilecard-section .box__smilecard .box__card-flip .image__smilecard.card-t0{-webkit-border-radius:12px;border-radius:12px;}
.smilecard-section .box__smilecard .box__card-flip .image__smilecard.card-t1{-webkit-border-radius:8px;border-radius:8px;}
.smilecard-section .box__smilecard .box__card-flip .image__smilecard.card-t2{-webkit-border-radius:8px;border-radius:8px;}
.smilecard-section .box__smilecard .box__card-flip .image__smilecard.card-front{z-index: 2;}
.smilecard-section .box__smilecard .box__card-flip.js-backward .image__smilecard.card-front{display: none;}
.smilecard-section .box__smilecard .box__card-flip.js-backward .image__smilecard.card-back{display: block;}
.smilecard-section .box__smilecard .box__card-flip.js-reset{-webkit-transition-duration: 1s;transition-duration: 1s}
.smilecard-section .box__smilecard .box__card .box__card-mask{position: absolute;width: 100%;height: 100%;overflow: hidden;-webkit-border-radius:12px;order-radius:12px;-webkit-transform: translateZ(2px);transform: translateZ(2px);}
.smilecard-section .box__smilecard .box__card .js-forward .box__card-mask{opacity:1}
.smilecard-section .box__smilecard .box__card .js-backward .box__card-mask{opacity:0}
.smilecard-section .box__smilecard .box__card .box__card-mask .js-shining{position: absolute;display: block;top:-30px;left:-85px;width: 350px;height: 350px;-webkit-transform: rotate(45deg);transform: rotate(45deg);overflow: hidden;z-index: 20;}
.smilecard-section .box__smilecard .box__card .box__card-mask .js-shining .js-light{position: relative;display: block;top:0;left:-100%;width: 100%;height:100%;opacity:.5;background-image: -webkit-linear-gradient(to right, rgba(255, 255, 255, 0), white, rgba(255, 255, 255, 0));background-image: linear-gradient(to right, rgba(255, 255, 255, 0), white, rgba(255, 255, 255, 0));}

.smilecard-section .box__smilecard .box__card .box__cube{position: relative;display: block;width:182px;height:289px;-webkit-border-radius:12px;border-radius:12px;}
.smilecard-section .box__smilecard .box__card .box__cube::before,
.smilecard-section .box__smilecard .box__card .box__cube::after{content:'';position: absolute;
	top: 10px;
	width: 2px;
	height: 269px;
	background: rgb(102,102,102);
	background: -webkit-linear-gradient(rgba(102,102,102,0) 0%, rgba(102,102,102,1) 4%, rgba(102,102,102,1) 96%, rgba(102,102,102,0) 100%);
	background: linear-gradient(rgba(102,102,102,0) 0%, rgba(102,102,102,1) 4%, rgba(102,102,102,1) 96%, rgba(102,102,102,0) 100%);
	opacity: 0.12;
}
.smilecard-section .box__smilecard .box__card .box__cube::before{left: 99px;-webkit-transform: rotateY(-90deg) translateZ(100px);transform: rotateY(-90deg) translateZ(100px);}
.smilecard-section .box__smilecard .box__card .box__cube::after{right: 99px;-webkit-transform: rotateY(90deg) translateZ(100px);transform: rotateY(90deg) translateZ(100px);}
.smilecard-section .box__smilecard .box__card-flip .image__smilecard.card-front{-webkit-transform: rotateY(0deg) translateZ(1px);transform: rotateY(0deg) translateZ(1px);}
.smilecard-section .box__smilecard .box__card-flip .image__smilecard.card-back{-webkit-transform: rotateY(180deg) translateZ(1px);transform: rotateY(180deg) translateZ(1px);}
@keyframes flash{
	to { opacity: 1; }
}
@-webkit-keyframes flash{
	to { opacity: 1; }
}

.box__card-select{position: relative;margin: -2px 0 12px 0;text-align: center;}
.box__card-select .button__card-select{display: inline-block;margin: 0 5px;border: 1px solid #fff;padding:1px;border-radius:4px}
.box__card-select .button__card-select:focus{outline-offset:6px}
.box__card-select .button__card-select--active{border: 1px solid #00c400;}
.box__card-select .button__card-select .image__smilecard-small{width: 25px;height: 40px;border: 1px solid #F5F5F5;border-radius:2px}

.smilecard-section .box__home-notice{position: relative;padding: 10px 16px 24px;}
.smilecard-section .box__toast-area + .box__home-notice{margin-top: -16px;}
.smilecard-section .box__home-notice .box__notice-banner{position: relative;display: block;max-width:328px;margin: 0 auto;border: 1px solid #EFEFEF;overflow: hidden;-webkit-border-radius:8px;border-radius:8px}
.smilecard-section .box__home-notice .box__notice-banner .link__banner{display: block;width: 100%;}
.smilecard-section .box__home-notice .box__notice-banner .images__banner{display: block;width: 100%;}
.smilecard-section .box__home-notice .box__notice-banner .button__closed{position: absolute;top: 2px;right: 2px;width: 32px;height: 32px;}
.smilecard-section .box__home-notice .box__notice-banner .button__closed::after{display: block;margin: 0 auto;width: 16px;height: 16px;background-position: -200px 0;}

.smilecard-section .box__text-notice{min-height:44px;font-size: 14px;line-height: 18px;color: #616161;text-align: center;}
.smilecard-section .box__toast-notice{position: absolute;bottom: 0;width: 100%;height: 100%;max-height: 0;text-align: center;background-color: #067DFD;overflow: hidden;-webkit-transition: max-height 1s;transition: max-height 1s}
.smilecard-section .box__toast-notice:after{content:'';display: inline-block;vertical-align: middle;height: 84px;width: 1px;}
.smilecard-section .box__toast-notice .text__notice{font-family:'Gmarket Sans';font-weight: 500;display: inline-block;vertical-align: middle;font-size: 16px;line-height: 1.25;color: #fff;opacity:0;-webkit-transition: opacity .7s;transition: opacity .7s;}
.smilecard-section .box__toast-notice.js-toast-notice--active{max-height:200px;overflow: visible;}
.smilecard-section .box__toast-notice.js-toast-notice--active .text__notice{opacity: 1;}

.smilecard-section .box__toast-area{position:relative;min-height:84px;padding-top: 10px;z-index: 51;box-sizing:border-box}
.smilecard-section .box__toast-area .box__button-group{padding:0 0;text-align:center;}
.smilecard-section .box__toast-area .box__button-group .button__info{font-family:'Gmarket Sans';font-weight: 500;display:inline-block;vertical-align: middle;min-width:102px;height:44px;margin:0 7px;padding:0 18px;font-size:16px;line-height: 44px;text-align:center;border:1px solid #bdbdbd;color:#222;background-color:#fff;overflow: hidden;box-sizing:border-box;-webkit-border-radius:8px;border-radius:8px;}
.smilecard-section .box__toast-area .group2 .button__info{margin:0 7px;padding:0 18px}
.smilecard-section .box__toast-area .btn-groups .button__info{margin:0 2px;padding:0 18px}
.smilecard-section .box__nocard-user{position: relative;width: 100%;margin: 0 auto -8px;padding-top: 90%;text-align: center;box-sizing:border-box;}
.smilecard-section .box__nocard-user:before{content:'';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background:url(//pics.gmarket.com/smilecard/home/images__nocard-user--new.png) 50% 0 no-repeat;background-size:cover;}
.smilecard-section .box__nocard-user.box__smillecard-edition3{margin:0 auto}
/* .smilecard-section .box__nocard-user{position: relative;width: 100%;margin: 0 auto -8px;padding-top: 100%;text-align: center;box-sizing:border-box;}
.smilecard-section .box__nocard-user:before{content:'';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background:#FFF2E1 url(//pics.gmarket.com/smilecard/home/images__nocard-user-new.png) 50% 0 no-repeat;background-size:cover;} */
.box__notice-smilecard{margin-top:16px;padding:40px 32px;background-color: #f6f8f9;}
.box__notice-smilecard .text__notice-title{font-size:16px;font-weight:bold;color:#2c2c2c;letter-spacing:-0.04em;word-break:keep-all;}
.box__notice-smilecard .list__main{margin-top:8px;}
.box__notice-smilecard .list__main .list-item{position:relative;margin-top:4px;padding-left:12px;font-size:18px;line-height:26px;letter-spacing:-1px;color:#616161;}
.box__notice-smilecard .list__main .list-item:before{content:'';position:absolute;top:11px;left:0;width:5px;height:2px;background-color:#616161;}
.box__notice-smilecard .list__main .list-item + .list-item--emphasis{margin-top:10px;}
.box__notice-smilecard .list__main .list-item--emphasis{padding-left:12px;font-size:18px;line-height:26px;color:#616161;}
.box__notice-smilecard .list__main .list-item--emphasis,
.box__notice-smilecard .list__sub .list-item--emphasis{font-weight:bold;} 
.box__notice-smilecard .text__crefia{margin-top:20px;font-size:18px;line-height:26px;color:#616161;font-weight:normal;letter-spacing:-0.5px;}
    
    
@media screen and (min-width:620px) {/* 620 이상 */
.smilecard-section .box__nocard-user{width: 620px;height: 775px;padding-top: 561px;}
.smilecard-section .box__nocard-user.box__smillecard-edition3{height:657px;padding-top:454px}
}
.smilecard-section .box__nocard-user .text__title,
.smilecard-section .box__nocard-user .text__description{position: relative;font-family:'Gmarket Sans';display: block;letter-spacing: -0.5px;text-align: center;z-index: 10;}
.smilecard-section .box__nocard-user .text__title{font-size: 22px;color: #000;font-weight: 500;line-height: 30px;}
.smilecard-section .box__nocard-user .text__description{padding-top: 10px;font-size: 14px;color: #222;font-weight: 300;line-height: 20px;}
.smilecard-section .box__nocard-user .box__button-group{position: relative;padding-bottom: 40px;z-index: 10;}
.smilecard-section .box__nocard-user.box__smillecard-edition3 .box__button-group{padding-bottom:54px}
.smilecard-section .box__nocard-user .box__button-group .button__info{display:block;min-width:174px;width: 134px;height:38px;margin:15px auto 0;font-size:12px;line-height: 38px;text-align:center;color:#fff;border:0;background: linear-gradient(100.3deg, #0062D5 23.16%, #2C34F4 107.08%);overflow: hidden;box-sizing:border-box;-webkit-border-radius:19px;border-radius:19px;}
.infomation-section .list__club-info .list-item::after{content:'';display: block;border-top: 1px solid #eee;margin: 0 16px;}
.infomation-section .list__club-info .list-item:last-child::after{border: 0;}
.infomation-section .list__club-info .list-item .link__info{position: relative;display: block;padding: 17px 40px 17px 16px;text-align: left;overflow: hidden;}
.infomation-section .list__club-info .list-item .link__info::after{position: absolute;top: 50%;right: 16px;width: 24px;height: 24px;margin-top: -12px;background-position: -26px 0;}
.infomation-section .list__club-info .list-item .text__list{font-family:'Gmarket Sans';font-weight: 500;font-size: 16px;color: #222;line-height: 24px;float: left;}
.infomation-section .list__club-info .list-item .text__subtext{float: right;text-align: right;font-size: 12px;color: #067dfd;line-height: 24px;font-weight: normal;}

.benefit-section .text__title-benefit{font-family:'Gmarket Sans';font-weight: 500;padding: 28px 0 0 16px;font-size: 16px;line-height: 24px;color: #222;letter-spacing: -.5px;}
.benefit-section .list__club-info{padding: 10px 0 16px;}
.benefit-section .list__club-info .list-item{font-size: 15px;letter-spacing: -.5px;line-height: 20px;color: #222;}
.benefit-section .list__club-info .list-item::after{content: '';display: block;border-top: 1px solid #eee;margin: 0 16px;}
.benefit-section .list__club-info .list-item:last-child::after{border-top: 0;}
.benefit-section .list__club-info .list-item .link__benefit{display: block;padding:14px 16px;font-size: 15px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight: normal;}
.benefit-section .list__club-info .list-item .text__title{color: #067dfd;}
.benefit-section .list__club-info .list-item .text__desc{color: #222;}

.customer-section{background-color:transparent}
.customer-section .text__cs-center{padding: 28px 0 32px;font-size:16px;line-height: 15px;letter-spacing: -0.5px;color: #222;text-align: center;font-weight: normal;}
.customer-section .text__cs-center > a{color: #222;text-decoration: none;font-weight: normal;} /* ios */
.customer-section .text__cs-center::before{vertical-align: middle;width: 24px;height: 24px;margin: -2px 4px 0 0;background-position: -104px 0;}


/*** 이용내역 페이지 ***/
/* 월 이용내역  */
.cardinfo-section .smilecard-history--header{position: fixed;left:0;right: 0;width: 100%;height: 50px;background-color: #fff;box-sizing:border-box;z-index: 200}
.cardinfo-section .smilecard-history--header::after{content:'';display: block;margin:0 10px;height: 1px;border-bottom: 1px solid #f4f4f4}
.cardinfo-section .smilecard-history--header .text__history-title{position: relative;display: inline-block;vertical-align: middle;padding: 7px 8px 6px 20px;}
.cardinfo-section .smilecard-history--header .button__card-more{position: absolute;top: 1px;left: 16px;width: 100%;height: 100%;overflow: hidden}
.cardinfo-section .smilecard-history--header .button__card-more::after{display: block;float: right;width: 24px;height: 24px;background-position: -130px 0;}
.cardinfo-section .smilecard-history--header .images__card-type{display: inline-block;vertical-align: middle;height: 36px;margin-right: 4px;-webkit-border-radius:2px;border-radius:2px;border: 1px solid #f5f5f5;}
.cardinfo-section .smilecard-history--header .text__card-name{display: inline-block;;vertical-align: middle;height: 36px;line-height: 38px;font-size: 14px;color: #222;font-weight: bold;}
.cardinfo-section .smilecard-history--header .button__calendar{position: absolute;top: 1px;right: 6px;width: 48px;height: 48px;}
.cardinfo-section .smilecard-history--header .button__calendar:before{display: block;width: 24px;height: 24px;margin: 0 auto;background-position: 0 0;}
.cardinfo-section .smilecard-history--header.js-scrolling::after{margin: 0;border-bottom: 0;-webkit-box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);}
.cardinfo-section .smilecard-history--contents{padding: 71px 0 14px}
.cardinfo-section .box__month-history{text-align: center;}
.cardinfo-section .box__month-history .text__history-month{font-family:'Gmarket Sans';display: block;font-size: 18px;line-height: 26px;color: #222;font-weight: 500;}
.cardinfo-section .box__month-history .text__history-price{font-family:'Gmarket Sans';display: block;padding-top: 14px;font-size: 30px;line-height: 22px;color: #222;font-weight: 700;}
.cardinfo-section .box__month-history .text__history-price .text__uint{font-family:'Gmarket Sans';display: inline-block;vertical-align: baseline;font-size: 19px;font-weight: 700;}
.cardinfo-section .box__smilecash{position: relative;text-align: center;margin-top: 12px;}
.cardinfo-section .box__smilecash .button__smilecash{display: inline-block;font-size: 15px;line-height: 18px;color: #067dfd;}
.cardinfo-section .box__smilecash .button__smilecash:after{display: inline-block;vertical-align: middle;width: 16px;height: 16px;margin: -2px 0 0 -2px;background-position: -182px 0;}
.cardinfo-section .box__smilecash .button__smilecash .text__smilecash{font-weight: bold;}

/* 이용내역 리스트 */
.history-section{padding: 0 16px 16px;margin: 0;background-color: #F5F5F5;}
.history-section .list__history{padding-top: 4px;}
.history-section .list__history .list-item{text-align: center}
.history-section .list__history .list-item .text__date{display: inline-block;height: 24px;margin: 12px 0 8px;padding: 0 13px;background-color: #e0e0e0;font-size: 13px;color: #222;line-height: 24px;-webkit-border-radius:12px;border-radius:12px;}
.history-section .list__history .list-item .date-today{color: #fff;background-color: #067dfd;}
.history-section .list__history .list__history--item{}
.history-section .list__history .list-itme--location{padding: 0 16px 16px;background-color: #fff;border: 1px solid #e0e0e0;-webkit-border-radius:10px;border-radius:10px;}
.history-section .list__history .list-itme--location:first-child{padding-bottom: 10px;-webkit-border-radius:10px 10px 0 0;border-radius:10px 10px 0 0;border-bottom: 0;}
.history-section .list__history .list-itme--location:first-child:last-child{padding-bottom: 16px;border-bottom: 1px solid #e0e0e0;-webkit-border-radius:10px;border-radius:10px;}
.history-section .list__history .list-itme--location + .list-itme--location{padding-top: 0;}
.history-section .list__history .list-itme--location ~ .list-itme--location{padding-bottom: 10px;border-top: 0;border-bottom: 0;-webkit-border-radius:0;border-radius:0;}
.history-section .list__history .list-itme--location:last-child{padding-bottom: 16px;border-bottom: 1px solid #e0e0e0;-webkit-border-radius:0 0 10px 10px;border-radius:0 0 10px 10px;}
.history-section .list__history .list-itme--location .box__row{display:table;width: 100%;padding-top: 8px;border-top: 1px solid #eee;}
.history-section .list__history .list-itme--location:first-child .box__row{border-top: 0;padding-top: 16px;}
.history-section .list__history .list-itme--location .item-cell{text-align: left;display: table-cell;}
.history-section .list__history .list-itme--location .item-cell:last-child{width:140px;text-align: right;}
.history-section .list__history .list-itme--location .text__shop{display: block;font-size: 15px;line-height: 20px;color: #222;}
.history-section .list__history .list-itme--location .text__time{display: block;padding-top: 2px;font-size: 12px;color: #9e9e9e;}
.history-section .list__history .list-itme--location .text__payed{font-family:'Gmarket Sans';font-weight: 500;display: block;font-size: 15px;color: #222;font-weight: 700;white-space: nowrap;}
.history-section .list__history .list-itme--location del.text__payed{color: #9e9e9e}
.history-section .list__history .list-itme--location .text__payed .text__unit{font-family:'Gmarket Sans';font-weight: 500;}
.history-section .list__history .list-itme--location .text__ststus{display: block;padding-top: 2px;font-size: 12px;color: #067dfd;}
.history-section .list__history .list-itme--location .text__ststus .text__cancel{color: #ef2b2a;}

/* 이용내역 없음 */
.none-section{background-color: #f5f5f5;margin-bottom: 0;text-align: center;}
/* .none-section::after{content: '';display: inline-block;width: 1px;height: 100%;vertical-align: middle;} */
.none-section .text__none-history{display: inline-block;vertical-align: middle;padding-top: 150px;font-size: 16px;color: #616161;letter-spacing: -0.5px;}

.button__list-more{font-family:'Gmarket Sans';font-weight: 500;display: block;margin: 24px auto;width: 256px;height: 44px;line-height: 44px;border: 1px solid #e0e0e0;background-color: #fff;font-size: 14px;color: #2c2c2c;text-align: center;text-indent:6px;overflow: hidden;box-sizing:border-box;-webkit-border-radius:22px;border-radius:22px;}
.button__list-more::after{display: inline-block;vertical-align: middle;width: 24px;height: 24px;margin: -2px 0 0 -4px;background-position: -130px 0;}

/* dimmed layer */
.box__layer{display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:2100;box-sizing:border-box}
.box__layer--active{display: block;}
.box__layer .dimmed{content:'';opacity: .7;position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: #04040f;z-index: 2000;}
.box__layer .box__layer-content{position:fixed;background-color: #fff;text-align:center;z-index:2200;}
.box__layer .box__layer-detail{padding: 16px;text-align:left}
.box__layer .box__layer-content .button__closed{position:absolute;top:0;right:0;width:48px;height:48px}
.box__layer .box__layer-content .button__closed::after{display: block;width: 24px;height: 24px;margin: 0 auto;background-position: -156px 0;}

.layer-dimmed{}
.layer-dimmed .box__layer-content{top:50%;left:50%;width:280px;background-color: #fff;text-align:center;-webkit-border-radius:8px;border-radius:8px;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%)}

.layer-toast .box__layer-content{left: 0;right: 0;bottom: -100%;-webkit-border-radius:16px 16px 0 0;border-radius:16px 16px 0 0;-webkit-transition: bottom .3s;transition: bottom .3s}
.layer-toast.box__layer--active .box__layer-content{bottom: 0}
.layer-toast .box__layer-content .box__layer-head{height: 48px;border-bottom: 1px solid #f5f5f5;}
.layer-toast .box__layer-content .box__layer-head .text__layer-title{font-family:'Gmarket Sans';font-weight: 500;padding-top: 15px;font-size: 18px;color: #2c2c2c}
.layer-toast .box__layer-detail .text__detail-title{margin-top: 16px;padding-top: 16px;border-top: 1px solid #eee;font-size: 18px;line-height: 24px;color: #222;font-weight: normal;}
.layer-toast .box__layer-detail .text__detail-title:first-child{margin-top: 0;padding-top: 0;border-top: 0;}

/* 카드정보 */
.box__card-info .box__layer-detail .list__card-info{margin-top: 12px;}
.box__card-info .box__layer-detail .list__card-info .list-item{padding: 4px 0;}
.box__card-info .box__layer-detail .list__card-info .list-item::after{content:'';display: block;clear: both;}
.box__card-info .box__layer-detail .list__card-info .list-item--title{float: left;width: 140px;font-size: 16px;line-height: 24px;color: #222;letter-spacing: -0.5px;font-weight: normal;}
.box__card-info .box__layer-detail .list__card-info .list-item--data{font-size: 16px;line-height: 24px;color: #616161;font-weight: normal;}

/* 배송정보 레이어 */
.layer-delivery{display: none;position: absolute;top: inherit;left: 16px;right: 16px;bottom: 24px;width: auto;height: auto;background-color: #fff;border: 1px solid #000;-webkit-border-radius: 8px;border-radius: 8px;z-index: 1100;}
.layer-delivery .dimmed,
.layer-delivery::after{display: none;}
.layer-delivery .box__layer-content{position: static;text-align: left;padding: 20px 16px;background-color: transparent;}
.layer-delivery .box__layer-head{position: relative;padding: 0 0 0;background-color: #fff;z-index: 1;}
.layer-delivery .box__layer-head .text__title{font-size: 16px;line-height: 18px;color: #424242;letter-spacing: -0.5px;}
.layer-delivery .box__layer-detail{margin-top:-17px;padding: 0;}
.layer-delivery .box__layer-detail .text__delivery-notice,
.layer-delivery .box__layer-detail .list__delivery-address,
.layer-delivery .box__layer-detail .text__delivery-cs{margin-top: 16px;padding-top: 16px;border-top: 1px solid #eee;font-size: 14px;line-height: 18px;font-weight: normal;}
.layer-delivery .box__layer-detail .text__delivery-notice{color: #067dfd;}
.layer-delivery .box__layer-detail .list__delivery-address{}
.layer-delivery .box__layer-detail .list__delivery-address .list-item--title{padding-bottom: 8px;color: #222;}
.layer-delivery .box__layer-detail .list__delivery-address .list-item--data{color: #424242;}
.layer-delivery .box__layer-detail .text__delivery-cs{color: #757575;}
.layer-delivery .box__layer-content .button__closed{position: absolute;top: 8px;right: 8px;width:40px;height:40px;z-index: 20;}
.layer-delivery .box__layer-content .button__closed::after{display: block;width: 24px;height: 24px;margin: 0 auto;background-position: -52px 0;}

/* 적립된 스마일캐시 레이어 */
.layer-smilecash{display: none;position: absolute;top: 25px;left: 16px;right: 16px;bottom: inherit;width: auto;height: auto;background-color: #fff;border: 1px solid #000;-webkit-border-radius: 8px;border-radius: 8px;z-index: 100;}
.layer-smilecash .dimmed,
.layer-smilecash::after{display: none;}
.layer-smilecash .box__layer-content{position: static;text-align: left;padding: 16px;background-color: transparent;}
.layer-smilecash .box__layer-head{position: relative;padding: 0 0 0;background-color: #fff;z-index: 1;}
.layer-smilecash .box__layer-head .text__title{font-size: 14px;line-height: 18px;color: #222;}
.layer-smilecash .box__layer-detail{margin-top:8px;padding: 0;}
.layer-smilecash .box__layer-detail .text__notice{font-size: 14px;line-height: 20px;color: #222;}
.layer-smilecash .box__layer-detail .list__notice{}
.layer-smilecash .box__layer-detail .list__notice .list-item{position: relative;margin-bottom: 5px;padding-left: 8px;font-size: 14px;line-height: 20px;color: #222;}
.layer-smilecash .box__layer-detail .list__notice .list-item:before{content:'';position: absolute;top: 8px;left: 0;width: 3px;height: 3px;border-radius: 50%;background-color: #222;}
.layer-smilecash .box__layer-content .button__closed{position: absolute;top: 4px;right: 4px;width:40px;height:40px;z-index: 20;}
.layer-smilecash .box__layer-content .button__closed::after{display: block;width: 24px;height: 24px;margin: 0 auto;background-position: -52px 0;}

/* 카드 선택하기 */
.box__card-select .box__layer-detail{padding:10px 20px}
.box__card-select .list__card-select{}
.box__card-select .list__card-select .list-item{position: relative;padding:16px 0;border-top: 1px solid #f5f5f5;}
.box__card-select .list__card-select .list-item:first-child{border-top: 0;}
.box__card-select .list__card-select .list-item .form__card-select{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.box__card-select .list__card-select .list-item .form__label-card{font-family:'Gmarket Sans';font-weight: 500;position: relative;display: block;width: 100%;height: 100%;padding-left: 32px;box-sizing:border-box;cursor: pointer;z-index: 10;}
.box__card-select .list__card-select .list-item .form__label-card::before{display: block;position: absolute;top: 50%;left: 0;width: 24px;height: 24px;margin-top: -12px;background-position: -218px 0;}
.box__card-select .list__card-select .list-item .form__card-select:checked + .form__label-card::before{background-position: -244px 0;}
.box__card-select .list__card-select .list-item .form__card-select:checked + .form__label-card .text__card-name{color: #067dfd;}
/* .box__card-select .list__card-select .list-item .form__card-select:disabled + .form__label-card::before{background-position: -218px -26px;} */
.box__card-select .list__card-select .list-item .form__label-card::after{content:'';display: inline-block;vertical-align: middle;width: 1px;height: 34px;}
.box__card-select .list__card-select .list-item .form__label-card .images__card-type{float: right;display: inline-block;vertical-align: middle;height: 34px;margin-right: 14px;-webkit-border-radius:2px;border-radius:2px;border: 1px solid #f5f5f5;}
.box__card-select .list__card-select .list-item .form__label-card .text__card-name{font-family:'Gmarket Sans';font-weight: 500;display: inline-block;vertical-align: middle;font-size: 18px;line-height: 20px;}

/* 이용내역 월 선택하기 */
.box__history-view .box__layer-detail{padding: 0 0 0 0}
.box__history-view .js-sticky-wrap{position: relative;overflow: hidden;zoom: 1;}
.box__history-view .list__month-select{padding: 0 20px;max-height:305px;overflow-y: auto;}
.box__history-view .list__month-select .list-item{padding: 10px 0;border-top: 1px solid #f5f5f5;}
.box__history-view .list__month-select .list-item:first-child{border-top: 0;}
.box__history-view .list__month-select .list-item .list__calendar{z-index: 1;background-color: #fff;}
.box__history-view .list__month-select .list-item .list__calendar:after{content:'';display: block;clear: both;}
.box__history-view .list__month-select .list-item .list-item--title{height: 44px;}
.box__history-view .list__month-select .list-item .list-item--title .js-sticky{display: block;}
.box__history-view .list__month-select .list-item .list-item--title .text__year{font-family:'Gmarket Sans';font-weight: 500;display: block;height: 44px;font-size: 14px;color: #757575;line-height: 44px;}
.box__history-view .list__month-select .list-item .list-item--title .text__year.absolute{position: absolute;top:0}
.box__history-view .list__month-select .list-item .list-item--title .text__year.static{position: absolute}
.box__history-view .list__month-select .list-item .list-item--data{position: relative;}
.box__history-view .list__month-select .list-item .form__card-select{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
/* .box__history-view .list__month-select .list-item .list__calendar.js-selected .list-item--title .text__status,
.box__history-view .list__month-select .list-item .form__card-select:checked + .form__label-card .text__status{color: #067dfd;} */
.box__history-view .list__month-select .list-item .form__label-card{position: relative;display: block;width: 100%;height: 100%;padding-left: 32px;box-sizing:border-box;cursor: pointer;z-index: 10;}
.box__history-view .list__month-select .list-item .form__label-card::before{display: block;position: absolute;top: 50%;left: 0;width: 24px;height: 24px;margin-top: -12px;background-position: -218px 0;}  /* checked:-244px | unchecked:-218px */
.box__history-view .list__month-select .list-item .form__card-select:checked + .form__label-card::before{background-position: -244px 0;}
.box__history-view .list__month-select .list-item .form__label-card::after{content:'';display: inline-block;vertical-align: middle;width: 1px;height: 44px;}
.box__history-view .list__month-select .list-item .form__label-card .images__card-type{display: inline-block;vertical-align: middle;height: 44px;margin-right: 14px;}
.box__history-view .list__month-select .list-item .form__label-card .text__month{font-family:'Gmarket Sans';font-weight: 500;display: inline-block;vertical-align: middle;font-size: 18px;line-height: 20px;}

@media screen and (max-width:320px) {
	/* 320 이하 */
	.smilecard-section .box__toast-area .box__button-group .button__info{min-width:90px;margin: 0 3px;padding: 0 12px;}
}
@media screen and (min-width:768px) {
	/* 768 이상 */
}

/* 구 헤더 */
#header .box__header-old .sprite__smilecard-home--after{overflow:hidden;display:inline-block;font-size:0;color:transparent;line-height:0}
#header .box__header-old{position: relative;width: 100%;z-index: 2000;border-bottom: 0 none;background: none;-webkit-box-shadow: none;box-shadow: none;}
#header .box__header-old .header-fixed{position: fixed;top: 0;left: 0;right: 0;display: block;z-index: 300;width: 100%;background-color: #fff;border-bottom: 1px solid #DCDCDC;}
#header .box__header-old .logo{position: absolute;top: 0;left: 0;width: 48px;height: 48px;}
#header .box__header-old .logo .link__logo{display: block;position: relative;width: 48px;height: 48px;text-indent: -999px;}
#header .box__header-old .logo .link__logo::after{display: block;top: 0;left: 0;width: 48px;height: 48px;background-position: -49px -150px;}
#header .box__header-old .logo.logo-gmkt{top: 8px;left: 16px;width: 30px;height: 30px;}
#header .box__header-old .logo.logo-gmkt .link__logo{width: 30px;height: 30px;}
#header .box__header-old .logo.logo-gmkt .link__logo::after{width: 30px;height: 30px;background-position: -49px -150px;}
#header .box__header-old .logo.logo-iac{top: 0;left: 0;width: 48px;height: 48px;}
#header .box__header-old .logo.logo-iac .link__logo{width: 48px;height: 48px;}
#header .box__header-old .logo.logo-iac .link__logo::after{width: 48px;height: 48px;background-position: -150px -100px;}
#header .box__header-old .btn_search{position: absolute;top: 0;right: 47px;width: 40px;height: 46px;}
#header .box__header-old .btn_search::after{position: absolute;top: 12px;left: 9px;width: 22px;height: 22px;background-position: 0 -150px;}
#header .box__header-old .btn_cart{position: absolute;top: 0;right: 0;width: 47px;height: 46px;}
#header .box__header-old .btn_cart .cart_num{overflow: hidden;position: absolute;z-index: 1;top: 8px;right: 12px;width: 14px;height: 14px;background-color: #2e8de5;-webkit-border-radius: 50%;border-radius: 50%;font-size: 10px;color: #fff;line-height: 14px;font-style: normal;text-align: center;white-space: nowrap;}
#header .box__header-old .btn_cart::after{position: absolute;top: 12px;left: 8px;width: 23px;height: 22px;background-position: -24px -150px;}

#header .box__header-old .h_page{width: 58%;height: 46px;margin: 0 auto;font-size: 18px;font-weight: bold;color: #233549;text-align: center;line-height: 49px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#header .box__header-old--history{position: relative;overflow: hidden;height: 50px;background-color: #fff}
#header .box__header-old--history .header-fixed{position: fixed;top: 0;left: 0;right: 0;display: block;z-index: 300;width: 100%;background-color: #fff;border-bottom: 1px solid #D5D5D5;}
#header .box__header-old--history  h1.tit{padding: 0 50px;font-size: 17px;line-height: 50px;color: #444;text-align: center;}
#header .box__header-old--history .bt_prev{position: absolute;top: 0;left: 0;padding: 15px 15px 14px;font-size: 0;color: transparent;line-height: 0;}
#header .box__header-old--history .bt_prev .sprite__smilecard-home{width: 11px;height: 21px;background-position: -103px -150px;}
#header .box__header-old--history .bt_close{position: absolute;top: 0;right: 0;width: 52px;height: 52px;line-height: 0;font-size: 0;overflow: hidden;zoom: 1;}
#header .box__header-old--history .bt_close .sprite__smilecard-home{display: block;width: 20px;height: 20px;margin: 0 auto;background-position: -81px -150px;font-size: 0;color: transparent;line-height: 0;}

#header .box__header-old.box__header--gmkt .h_page,
#header .box__header-old.box__header--gmkt .btn_cart,
#header .box__header-old.box__header--gmkt .btn_search,
#header .box__header-old.box__header--gmkt{height: 46px;}
#header .box__header-old.box__header--gmkt .btn_cart .cart_num{line-height: 16px;}
#header .box__header-old.box__header--gmkt .btn_search:active::after{background-position: 0 -174px;}
#header .box__header-old.box__header--gmkt .btn_cart:active::after{background-position: -24px -174px;}

#header .box__header-old.box__header--iac .h_page,
#header .box__header-old.box__header--iac .btn_cart,
#header .box__header-old.box__header--iac .btn_search,
#header .box__header-old.box__header--iac{height: 48px;}
#header .box__header-old.box__header--iac .btn_cart .cart_num{font-family: sans-serif;font-weight: normal;font-size: 9px;background-color: #f57a83}
#header .box__header-old.box__header--iac .h_page{font-family: sans-serif;font-size: 17px;color: #141414;width: 100%;padding-left: 60px;text-align: left;font-weight: normal;-webkit-tap-highlight-color:rgba(0,0,0,0)}