@charset "UTF-8";
/*! style.scss © zen9.co.kr, 2017.12 */
/* Noto Sans KR (korean) http://www.google.com/fonts/earlyaccess */
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 100; src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format("opentype"); }

@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 300; src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format("opentype"); }

@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 400; src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format("opentype"); }

@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 600; src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format("opentype"); }

@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 700; src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format("opentype"); }

@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 900; src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format("opentype"); }

@font-face { font-family: 'HappyPointHead'; font-style: normal; font-weight: 100; src: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/fonts/happypointhead/HappyPointHeadOTF_Light.otf) format("opentype"); }

@font-face { font-family: 'HappyPointHead'; font-style: normal; font-weight: 300; src: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/fonts/happypointhead/HappyPointHeadOTF_Light.otf) format("opentype"); }

@font-face { font-family: 'HappyPointHead'; font-style: normal; font-weight: 400; src: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/fonts/happypointhead/HappyPointHeadOTF_Regular.otf) format("opentype"); }

@font-face { font-family: 'HappyPointHead'; font-style: normal; font-weight: 500; src: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/fonts/happypointhead/HappyPointHeadOTF_Medium.otf) format("opentype"); }

@font-face { font-family: 'HappyPointHead'; font-style: normal; font-weight: 700; src: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/fonts/happypointhead/HappyPointHeadOTF_Bold.otf) format("opentype"); }

@font-face { font-family: 'HappyPointHead'; font-style: normal; font-weight: 900; src: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/fonts/happypointhead/HappyPointHeadOTF_Black.otf) format("opentype"); }

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 900;
    font-display: swap;
    src: local('Pretendard Std Black')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-Black.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-Black.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-Black.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 800;
    font-display: swap;
    src: local('Pretendard Std ExtraBold')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-ExtraBold.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-ExtraBold.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-ExtraBold.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 700;
    font-display: swap;
    src: local('Pretendard Std Bold')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-Bold.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-Bold.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-Bold.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 600;
    font-display: swap;
    src: local('Pretendard Std SemiBold')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-SemiBold.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-SemiBold.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-SemiBold.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 500;
    font-display: swap;
    src: local('Pretendard Std Medium')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-Medium.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-Medium.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-Medium.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 400;
    font-display: swap;
    src: local('Pretendard Std Regular')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-Regular.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-Regular.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-Regular.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 300;
    font-display: swap;
    src: local('Pretendard Std Light')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-Light.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-Light.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-Light.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 200;
    font-display: swap;
    src: local('Pretendard Std ExtraLight')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-ExtraLight.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-ExtraLight.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-ExtraLight.ttf') format('ttf');
}

@font-face {
    font-family: 'Pretendard Std';
    font-weight: 100;
    font-display: swap;
    src: local('Pretendard Std Thin')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff2/PretendardStd-Thin.woff2') format('woff2')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/woff/PretendardStd-Thin.woff') format('woff')
    , url('https://front.happypointcard.com/hc/static/fonts/pretendardStd-1.3.6/ttf/PretendardStd-Thin.ttf') format('ttf');
}


.blind { position: absolute !important; display: block; width: 0 !important; height: 0 !important; padding: 0 !important; margin: -1px !important; border: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; }

.blind.focusable:active, .blind.focusable:focus { position: static; height: auto; width: auto; margin: 0; clip: auto; overflow: visible; }

/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; }

audio, canvas, progress, video { display: inline-block; }

audio:not([controls]) { display: none; height: 0; }

progress { vertical-align: baseline; }

template, [hidden] { display: none; }

a { background-color: transparent; -webkit-text-decoration-skip: objects; }

a:active, a:hover { outline-width: 0; }

abbr[title] { border-bottom: none; text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; }

b, strong { font-weight: inherit; }

b, strong { font-weight: bolder; }

dfn { font-style: italic; }

h1 { font-size: 2em; margin: 0.67em 0; }

mark { background-color: #ff0; color: #000; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

img { border-style: none; }

svg:not(:root) { overflow: hidden; }

code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

figure { margin: 1em 40px; }

hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; overflow: visible; }

button, input, optgroup, select, textarea { margin: 0; }

optgroup { font-weight: bold; }

button, input { overflow: visible; }

button, select { text-transform: none; }

button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }

fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

form { margin: 0; padding: 0; }

legend { -webkit-box-sizing: border-box; box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }

textarea { overflow: auto; }

[type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; }

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

[type="search"] { -webkit-appearance: textfield; outline-offset: -2px; }

[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

::-webkit-input-placeholder { color: inherit; opacity: 0.54; }

::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }

/* normalize.css End */
p, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }

ul, ol, dl { margin: 0; padding: 0; list-style: none; }

a { text-decoration: none; color: #222; }

button, input { margin: 0; padding: 0; color: #111; }

.svg { display: block; }

hr { display: none; }

fieldset { width: auto; min-width: 0; max-width: none; border: 0; margin: 0; padding: 0; }

* { word-break: keep-all; }

::-moz-selection { background: #b3d4fc; text-shadow: none; }

::selection { background: #b3d4fc; text-shadow: none; }

i { font-style: normal; }

/* button reset ie */
input.btn, button.btn { overflow: visible; }

.lt-ie8 button.btn { margin-left: 4px; }

.ie9 .btn[disabled] { text-shadow: none !important; color: #fff !important; background-color: #eee; }

/* button reset */
.btn { position: relative; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; display: inline-block; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; border-radius: 0; text-decoration: none; -webkit-appearance: none; -webkit-box-sizing: border-box; box-sizing: border-box; outline: none; -webkit-tap-highlight-color: transparent; }

/* xsmall */
.btn.xsmall { padding: 0 1.07143rem; height: 2.28571rem; line-height: 2.21429rem; font-size: 1rem; font-weight: 400; border-width: 1px; border-style: solid; }

/* small */
.btn.small { padding: 0 1.07143rem; height: 2.57143rem; line-height: 2.5rem; font-size: 1rem; font-weight: 400; border-width: 1px; border-style: solid; }

/* medium */
.btn.medium { padding: 0 1.07143rem; height: 2.85714rem; line-height: 2.78571rem; font-size: 1rem; font-weight: 400; border-width: 1px; border-style: solid; /* &.over { padding-left: 0; padding-right: 0; padding-bottom: rem(34px); box-sizing: initial; } */ }

/* large */
.btn.large { padding: 0 1.07143rem; height: 3.14286rem; line-height: 3.07143rem; font-size: 1.14286rem; font-weight: 400; border-width: 1px; border-style: solid; }

/* xlarge */
.btn.xlarge { padding: 0 1.07143rem; height: 3.42857rem; line-height: 3.35714rem; font-size: 1.14286rem; font-weight: 400; border-width: 1px; border-style: solid; }

.btn.car_btn{padding: 0 1.07143rem; height: 3.07143rem; line-height: 2.97143rem; font-size: 1.14286rem; font-weight: 400; border-width: 1px; border-style: solid;background-color:#4472C4 ;border-color: #2F528F;color: #FFFFFF;}

.car_btn_group{right: 0;}
.set-box-area .ipt_carno {background-color: #ffffff; width: 60%;color: #666;padding-left:5.5555556vw;margin-top: 10px;}
/* .car_btn_group .radius.car_btn{border-radius:0.35714rem} */

.setting-page-content .car_btn_group { position: absolute; right: 0; top: 72%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); color: #666666; /* width: 2rem; height: 2rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-logout-btn.png") center center no-repeat; background-size: 2.42857rem 2.42857rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; */ }

/* accent */
/* disable */
.btn.disabled { color: #fff; border-color: #dddddd; background-color: #dddddd; cursor: default; }

.ie9 .btn.disabled { color: #fff; }

/* slightly */
.btn.slightly { color: #fff; border-color: #888888; background-color: #888888; }

.btn.slightly.line { color: #666666; border-color: #666666; background-color: transparent; }

/* normal */
.btn.normal { color: #fff; border-color: #0D0F71; background-color: #0D0F71; }

.btn.normal.line { border-color: #0D0F71; background-color: #fff; color: #0D0F71; }

/* success */
/* $success-color: #fff;
$success-border-color: $c1;
$success-background-color: $c1;
.btn.success {
	color: $success-color;
	border-color: $success-border-color;
	background-color: $success-background-color;
}

.btn.success.line {
	color: $success-border-color;
	border-color: $success-border-color;
	background-color: transparent;
} */
/* info */
/* $info-color: #fff;
$info-border-color: $c1;
$info-background-color: $c1;
.btn.info {
	color: $info-color;
	border-color: $info-border-color;
	background-color: $info-background-color;
} */
/* gradient */
/* $gradient-color: #fff; .btn.gradient { color: $gradient-color; border-color: transparent; border-left: 0; border-right: 0; @include gradient; } */
/* float left right */
.btn-group:before, .btn-group:after { content: ""; display: table; }

.btn-group:after { clear: both; }

.btn-group.btn-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.btn-group.btn-flex.column {flex-flow:column wrap;}

.btn-group .info-text {font-size: 1rem; color: #888888; text-align: center; line-height:1.67; margin-top: 0.833rem;}

.btn-group.btn-flex .btn { width: 100%; }

.btn-group.btn-flex .btn + .btn { margin-left: 0.57143rem; }

.btn-group.btn-flex .btn + .btn.small { margin-left: 0.28571rem; }

.btn-group.radius .btn { border-radius: 0.85714rem; }

.btn-group.radius .btn.small { border-radius: 0.57143rem; }

.btn-group .pull-right { float: right; }

.btn-group + .btn-group { margin-top: 0.71429rem; }

/* share */
.btn-group.share {margin-top: 1.42857rem; padding: 0 1.42857rem;}
.btn-group.share .btn {display: flex; align-items: center; justify-content: center; color: #666; border-color: #888; background-color: transparent; font-weight: 600;}
.btn-group.share .btn .icon.share {display: inline-block; width: 1.714rem;height: 1.714rem;background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-share-bk.svg)0 0 no-repeat; background-size: 1.714rem 1.714rem; margin-right: 0.285rem}

/* etc btn */
.btn-like { display: inline-block; width: 2rem; height: 2rem; position: relative; border-radius: 50%; background-color: #222222; text-indent: -9999px; border: 0; }

.btn-like:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; z-index: 2; width: 0.85714rem; height: 0.71429rem; margin-top: -0.35714rem; margin-left: -0.42857rem; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-like.png") no-repeat 0 0; background-size: 0.85714rem 0.71429rem; }

.btn-like.on { background-color: #222222; }

.btn.multiple { display: table; white-space: normal; height: 4.57143rem; line-height: normal; }

.btn.multiple .cell { display: table-cell; vertical-align: middle; padding: 0 0.5rem; }

.btn.multiple small { display: block; }

.btn, .btn-arrow { display: inline-block; }

.btn .ico, .btn-arrow .ico { display: inline-block; vertical-align: middle; background-size: cover; margin-top: -0.14286rem; background-repeat: no-repeat; background-position: 0 0; }

.btn .ico.right, .btn-arrow .ico.right { width: 1.14286rem; height: 1.14286rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-32x32.png"); margin-left: 0.28571rem; }

.btn .ico.right.small, .btn-arrow .ico.right.small { width: 0.85714rem; height: 0.85714rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-24x24.png"); }

.btn .ico.right.large, .btn-arrow .ico.right.large { width: 1.71429rem; height: 1.71429rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-right-48x48.png"); }

.btn-arrow { border: none; }

.btn-edit-area:before, .btn-edit-area:after { content: ""; display: table; }

.btn-edit-area:after { clear: both; }

.btn-edit-area .item { float: left; position: relative; }

.btn-edit-area .item + .item { margin-left: 0.57143rem; padding-left: 0.57143rem; }

.btn-edit-area .item + .item:before { display: block; content: ""; position: absolute; top: 50%; left: 0; margin-top: -0.28571rem; width: 0.07143rem; height: 0.64286rem; background-color: #ddd; }

.btn-edit-area .btn-edit { display: block; font-weight: bold; font-size: 0.85714rem; letter-spacing: -0.025em; color: #222222; }

.btn-eval-area:before, .btn-eval-area:after { content: ""; display: table; }

.btn-eval-area:after { clear: both; }

.btn-eval-area .eval { float: left; display: block; position: relative; padding: 4px 7px; border-radius: 3px; border: 1px solid #e5e5e5; font-size: 0.78571rem; color: #999; }

.btn-eval-area .eval + .eval { float: right; }

.btn-eval-area .eval .ico { display: inline-block; width: 0.85714rem; height: 0.85714rem; margin-top: -0.14286rem; margin-right: 0.21429rem; margin-left: 0.21429rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-btn-eval.png"); background-repeat: no-repeat; background-size: 3.57143rem 3.57143rem; vertical-align: middle; }

.btn-eval-area .eval.like .ico { background-position: 0 0; }

.btn-eval-area .eval.report .ico { background-position: 0 -0.85714rem; }

.btn-eval-area .eval.on.like .count { color: #222222; }

.btn-eval-area .eval.on.like .ico { background-position: -0.85714rem 0; }

.btn-eval-area .eval.on.report a { color: #ff2100; }

.btn-eval-area .eval.on.report .ico { background-position: -0.85714rem -0.85714rem; }

.btn-select-module:before, .btn-select-module:after { content: ""; display: table; }

.btn-select-module:after { clear: both; }

.btn-select-module.col-1 .item { width: 100%; }

.btn-select-module.col-1 .item label { border-right: 1px solid #e5e5e5; }

.btn-select-module.col-1 .item input[type="radio"]:checked + label:after { display: none; }

.btn-select-module.col-2 .item { width: 50%; }

.btn-select-module.col-2 .item:nth-child(n+3) label { border-top: 0; }

.btn-select-module.col-2 .item:nth-child(2n) label { border-right: 1px solid #e5e5e5; }

.btn-select-module.col-3 .item { width: 33.333%; }

.btn-select-module.col-3 .item:nth-child(n+4) label { border-top: 0; }

.btn-select-module.col-3 .item:nth-child(3n) label { border-right: 1px solid #e5e5e5; }

.btn-select-module .item { float: left; height: 3.57143rem; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; }

.btn-select-module .item input[type="radio"] { opacity: 0; display: block; position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; }

.btn-select-module .item input[type="radio"]:checked + label:after { display: block; }

.btn-select-module .item input[type="radio"][readonly] + label { background-color: #f7f7f7; color: #999; }

.btn-select-module .item input[type="radio"][readonly]:checked + label:after { border-color: #c1c1c1; }

.btn-select-module .item label { display: block; position: relative; z-index: 1; width: 100%; height: 100%; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; line-height: 3.42857rem; text-align: center; font-size: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.btn-select-module .item label:after { display: none; content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; border: 1px solid #222222; -webkit-box-sizing: border-box; box-sizing: border-box; }

.enter-ico { position: absolute; display: block; left: 0.71429rem; top: 0.71429rem; width: 2.57143rem; height: 2.57143rem; }

.enter-ico.home { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-home.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.cs-center { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-cs-center.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.prev { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-prev.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.phone { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-phone.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.phone.white { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-phone-w.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.email { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-email.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.email.white { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-enter-email-w.png") center center no-repeat; background-size: 2.57143rem; }

.enter-ico.next.small { position: relative; display: inline-block; vertical-align: top; width: 1.57143rem; height: 1.57143rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/ico-arrow-12x18.png") center center no-repeat; background-size: 0.42857rem 0.64286rem; }

.multi-btn-group > div { padding-bottom: 0.57143rem; }

.tooltip-wrap { position: relative; }

.tooltip-wrap .tooltip-area { position: relative; width: 1.57143rem; height: 1.57143rem; display: inline-block; vertical-align: middle; }

.tooltip-wrap .tooltip-area:after { display: none; content: ''; position: absolute; width: 0.57143rem; height: 0.57143rem; left: 0.35714rem; top: 1.85714rem; z-index: 7; border: 1px solid #222222; border-top: 1px solid transparent; border-right: 1px solid transparent; background-color: #fff; -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); }

.tooltip-wrap .tooltip-area.on + .tooltip-box { display: block; }

.tooltip-wrap .tooltip { position: absolute; width: 1.07143rem; height: 1.07143rem; border-radius: 50%; left: 50%; top: 50%; z-index: 1; margin-left: -0.57143rem; margin-top: -0.57143rem; background: #e1e1e1 url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-tooltip-question.png") center center no-repeat; background-size: 0.64286rem 0.64286rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; border: 0; }

.tooltip-wrap .tooltip-box { display: none; position: absolute; left: 0; top: 2.14286rem; z-index: 6; padding: 1.78571rem; border-radius: 1.21429rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; border: 1px solid #222222; }

.tooltip-wrap .tooltip-box .info-list { margin-top: 0; }

.tooltip-wrap .tooltip-box .info-list li { font-size: 0.85714rem; }

.tooltip-wrap .tooltip-box .info-list.dot li { position: relative; padding-left: 5px; }

.tooltip-wrap .tooltip-box .info-list.dot li:before { display: block; content: ""; width: 0.14286rem; height: 0.14286rem; position: absolute; top: 0.71429rem; left: 0; border-radius: 50%; background-color: #000; }

.tooltip-wrap .tooltip-box .title { display: block; margin-bottom: 8px; font-size: 0.85714rem; }

.tooltip-wrap .tooltip-box .btn-close { position: absolute; top: 0.71429rem; right: 0.71429rem; width: 1.42857rem; height: 1.42857rem; text-indent: -9999px; border: 0; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-gray-28x28.png") no-repeat 50% 50%; background-size: 1rem 1rem; }

.btn-value-delete { display: none; width: 1.71429rem; height: 1.71429rem; margin-top: 0.28571rem; text-indent: -9999px; border: none; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-round-delete.png"); background-repeat: no-repeat; background-position: 0 0; background-color: transparent; background-size: 1.71429rem 1.71429rem; }

.btn-value-delete.on { display: inline-block; }

.btn-ico { width: 1.71429rem; height: 1.71429rem; display: inline-block; text-indent: -9999px; overflow: hidden; background-size: 100%; background-repeat: no-repeat; background-position: center center; background-color: transparent; border: none; outline: none; }

.btn-ico.share { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-share.png"); }

.btn-ico.filter { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-filter.png"); }

.btn-ico.control { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-control.png"); }

.btn-ico.close { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-24x24.svg"); }

.btn-ico.point { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-point-btn.svg"); background-size: 1.42857rem 1.42857rem; vertical-align: text-bottom; }

.btn-ico.receipt, .btn-ico.coupons { margin-top: -0.21429rem; margin-right: 0.71429rem; width: 2rem; height: 2rem; background-size: 2rem 2rem; vertical-align: middle; }

.btn-ico.receipt { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-receipt.svg"); }

.btn-ico.coupons { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-coupons.svg"); }

.btn-more { border-top: 1px solid #e5e5e5; }

.btn-more .btn-ico.more { width: 100%; height: 3.28571rem; padding-right: 1.28571rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-down-32x32.png") 56% 50% no-repeat; background-size: 1.14286rem 1.14286rem; text-indent: inherit; }

.gray-bg-wrap .btn.normal.line { background-color: #f5f5f5; }

.btn-text { display: inline-block; font-size: 1rem; border: none; border-bottom: 1px solid #888888; color: #888888; background-color: transparent; outline: none; }

.selector-wrap { position: relative; }

.selector-wrap:before, .selector-wrap:after { content: ""; display: table; }

.selector-wrap:after { clear: both; }

.selector-wrap .asset { margin-bottom: 0.28571rem; position: relative; width: auto; display: -webkit-box; display: -ms-flexbox; display: flex; }

.selector-wrap .asset:before, .selector-wrap .asset:after { content: ""; display: table; }

.selector-wrap .asset:after { clear: both; }

.selector-wrap .asset .checker, .selector-wrap .asset .radio { display: block; }

.selector-wrap .asset .checker { width: 1.71429rem; -ms-flex-preferred-size: 1.71429rem; flex-basis: 1.71429rem; -ms-flex-negative: 0; flex-shrink: 0; }

.selector-wrap .asset .checker + .label { line-height: 1.71429rem; }

.selector-wrap .asset .radio { width: 1.42857rem; -ms-flex-preferred-size: 1.42857rem; flex-basis: 1.42857rem; -ms-flex-negative: 0; flex-shrink: 0; }

.selector-wrap .asset .radio + .label { line-height: 1.42857rem; }

.selector-wrap .asset .label { padding-left: 0.57143rem; display: block; font-size: 1rem; font-weight: 400; vertical-align: top; }

.selector-wrap .asset .label > span { color: #222222; word-break: break-all; }

.selector-wrap .asset .label label { color: #666666; display: block; vertical-align: top; line-height: inherit; }

.selector-wrap .asset .label label, .selector-wrap .asset .label strong, .selector-wrap .asset .label span, .selector-wrap .asset .label p { word-break: break-all; }

.selector-wrap.horizontal .asset { float: left; margin-right: 1.14286rem; vertical-align: top; }

.selector-wrap.horizontal .asset:last-child { margin-right: 0; }

.selector-wrap.horizontal .asset .label:before, .selector-wrap.horizontal .asset .label:after { content: ""; display: table; }

.selector-wrap.horizontal .asset .label:after { clear: both; }

.data-list > li { word-break: break-all; color: #666666; }

.data-list > li + li { margin-top: 1.1111111vw; }

.data-list > li a { display: inline-block; word-break: break-all; }

.data-list .bold { font-weight: 700; }

.data-list.dots > li { position: relative; padding-left: 1.888889vw; }

.data-list.dots > li.bold-txt { font-size: 1.21428rem; }

.data-list.dots > li:after { content: ''; position: absolute; top: 1.6666667vw; left: 0; background-color: #666; width: 0.5555556vw; height: 0.5555556vw; border-radius: 50%; }

.data-list.dots > li.bold { padding-left: 0; }

.data-list.dots > li.bold:after { content: none; }

.data-list.dots.interval > li { padding-left: 3.8888889vw; }

#notice .data-list.dots > li { font-size: 0.8571429rem; margin: 5.5555556vw 0; }

.data-list.dots.big > li:after { width: 1.1111111vw; height: 1.1111111vw; }

.backslash {background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="0" x2="100%" y2="100%" style="stroke:rgb(229,229,229);" /></svg>');}

.data-list.dots + p { padding-top: 0.85714rem; color: #888888; font-size: 0.85714rem;}

.data-list.dots + .txt {margin-top: 0.5rem;}

.data-list.numbering { padding-left: 0.71429rem; }

.data-list.numbering > li { list-style-type: decimal; }

.data-list.small > li { margin-top: 0.57143rem; font-size: 0.85714rem; }

.data-list .type-title { display: block; margin-bottom: 0.28571rem; font-weight: bold; color: #222222; }

.data-list + .data-list { margin-top: 1.42857rem; }

.fieldset { border: 0; margin: 0; padding: 0; }

.fieldset legend { position: absolute !important; display: block; width: 0 !important; height: 0 !important; padding: 0 !important; margin: -1px !important; border: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; }

.fieldset legend.focusable:active, .fieldset legend.focusable:focus { position: static; height: auto; width: auto; margin: 0; clip: auto; overflow: visible; }

.fieldset .field > .label { margin-bottom: 0.42857rem; font-weight: 600; }

.fieldset .field > .label label { font-size: 1.14286rem; }

.fieldset .field > .label label.readonly { color: #dddddd; }

.fieldset .field .insert { position: relative; }

.fieldset .field .insert:before, .fieldset .field .insert:after { content: ""; display: table; }

.fieldset .field .insert:after { clear: both; }

.fieldset .field .etc { margin-top: 0.64286rem; }

.fieldset .field .etc .em { font-size: 0.85714rem; }

.fieldset .field .etc .em + .em { margin-top: 0.35714rem; }

.fieldset .field + .field > .label:first-child { margin-top: 2.14286rem; }

.fieldset .field + .field > .insert:first-child { margin-top: 1.42857rem; }

.fieldset .field + .selector-wrap { margin-top: 16px; }

.fieldset .field.email-field .insert:before, .fieldset .field.email-field .insert:after { content: ""; display: table; }

.fieldset .field.email-field .insert:after { clear: both; }

.fieldset .field.email-field .insert .form-wrap { float: left; width: 50%; }

.fieldset .field.email-field .insert .form-wrap:first-child .input-cover:before, .fieldset .field.email-field .insert .form-wrap:first-child .input-cover:after { content: ""; display: table; }

.fieldset .field.email-field .insert .form-wrap:first-child .input-cover:after { clear: both; }

.fieldset .field.email-field .insert .form-wrap:first-child input { float: left; width: 78%; }

.fieldset .field.email-field .insert .form-wrap:first-child .electronic { float: left; width: 22%; line-height: 3.14286rem; font-size: 1rem; text-align: center; color: #666666; }

.fieldset .btn-group { margin-top: 40px; }

/* .fieldset {
	legend {
		@include blind;
	}
	.field {
		>.label {
			margin: $label-space;
			font-size: $label-font-size;
			label {
				font-size: $label-font-size;
			}
		}
		.insert {
			position: relative;
		}
	}
} */
/* .fieldset {
	.field {
		.row {
			+.row {
				margin-top: rem(8px);
			}
		}
		// 라벨 상단 간격 없애기
		&.no-space {
			margin-top: 0;
			> .label {
				margin-top: 0;
			}
		}
		.etc {
			.em {
				margin-top: rem(9px);
				font-size: rem(11px);
				letter-spacing: -0.025em;
			}
		}
	}
} */
.fieldset .field.surround-line .input-cover input { padding-left: 0.71429rem; padding-right: 3.57143rem; border: 1px solid #bbbbbb; }

.fieldset .field.surround-line .input-cover .input-element { right: 1.57143rem; }

.fieldset.row .field, .field.row { display: table; width: 100%; table-layout: fixed; margin-top: 0.85714rem; }

.fieldset.row .field:nth-of-type(1), .field.row:nth-of-type(1) { margin-top: 0; }

.fieldset.row .field > .label, .fieldset.row .field .insert, .field.row > .label, .field.row .insert { display: table-cell; vertical-align: top; }

.fieldset.row .field > .label, .field.row > .label { width: 7.42857rem; padding-top: 0.92857rem; padding-right: 0.5rem; margin: 0; }

.fieldset.row .field > .label label, .field.row > .label label { position: relative; word-break: break-all; font-size: 1.14286rem; font-weight: 600; }

@media (max-width: 320px) { .fieldset.row .field > .label, .field.row > .label { width: 6.71429rem; }
    .fieldset.row .field > .label label, .field.row > .label label { font-size: 1rem; } }

.fieldset.row .field > .label .essential, .field.row > .label .essential { display: inline-block; font-size: 0.92857rem; color: #ff01ae; }

.fieldset.row .field + .field > .label:first-child, .field.row + .field > .label:first-child { margin-top: 0; }

.fieldset.row .field + .field > .insert:first-child, .field.row + .field > .insert:first-child { margin-top: 0; }

.fieldset.row .field + .selector-wrap, .field.row + .selector-wrap { margin-top: 0.71429rem; }

.fieldset.row .field.phone-number-field .label, .field.row.phone-number-field .label { width: 7.14286rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.fieldset.row .field.phone-number-field .label label, .field.row.phone-number-field .label label { font-weight: normal; font-size: 1rem; color: #666666; }

.fieldset.row .field.phone-number-field .selectric-wrapper .selectric, .field.row.phone-number-field .selectric-wrapper .selectric { border: 0; border-bottom: 1px solid #bbb; }

.fieldset.row .field.phone-number-field .selectric-wrapper .selectric .label, .field.row.phone-number-field .selectric-wrapper .selectric .label { padding-right: 1.42857rem; padding-left: 0.71429rem; }

.fieldset.row .field.phone-number-field .selectric-wrapper .selectric .button, .field.row.phone-number-field .selectric-wrapper .selectric .button { width: 1.42857rem; }

.fieldset.row .field.phone-number-field .phone-number-row:before, .fieldset.row .field.phone-number-field .phone-number-row:after, .field.row.phone-number-field .phone-number-row:before, .field.row.phone-number-field .phone-number-row:after { content: ""; display: table; }

.fieldset.row .field.phone-number-field .phone-number-row:after, .field.row.phone-number-field .phone-number-row:after { clear: both; }

.fieldset.row .field.phone-number-field .phone-number-row .form-wrap, .field.row.phone-number-field .phone-number-row .form-wrap { float: left; width: 33%; }

.fieldset.row .field.phone-number-field .phone-number-row .form-wrap .selectric-wrapper, .field.row.phone-number-field .phone-number-row .form-wrap .selectric-wrapper { float: left; width: 100%; }

.fieldset.row .field.phone-number-field .phone-number-row .form-wrap .electronic, .field.row.phone-number-field .phone-number-row .form-wrap .electronic { float: left; width: 22%; line-height: 3.14286rem; font-size: 1rem; text-align: center; color: #666666; }

.fieldset.row .field.phone-number-field .phone-number-row .form-wrap input, .field.row.phone-number-field .phone-number-row .form-wrap input { float: left; width: 78%; padding-right: 0; font-size: 1rem; padding-left: 0.28571rem; }

.input-cover { position: relative; }

.input-cover .btn { border-radius: 0.57143rem; }

.input-cover .time { display: inline-block; font-size: 0.85714rem; }

.input-cover.input-text { padding-top: 0.92857rem; padding-bottom: 0.64286rem; font-size: 1.14286rem; font-weight: 400; word-break: break-all; }

.input-cover.time input { padding-right: 6.42857rem; }

.input-cover.time .btn-value-delete { right: 7.14286rem; }

.input-cover .input-element { position: absolute; right: 0; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); }

.input-cover.input-btn input { padding-right: 9.28571rem; }

.input-cover.input-btn.time input { padding-right: 10rem; }

.input-cover.input-btn .btn[disabled] { border-color: #ccc; background-color: #ccc; }

.input-cover.input-btn.time .time { margin-right: 4px; }

.input-cover .ico-check-success { display: none; width: 1.71429rem; height: 1.71429rem; text-indent: -9999px; vertical-align: middle; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-check-success.png"); background-size: 1.71429rem 1.71429rem; background-repeat: no-repeat; background-position: center center; background-color: transparent; }

.input-cover .ico-check-success.on { display: inline-block; }

.write-module-box { position: relative; padding-bottom: 3.71429rem; border: 1px solid #dddddd; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.write-module-box .social-login-area { padding: 0.78571rem 0.64286rem; background-color: #f5f5f5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.write-module-box .social-login-area .ico-area { display: inline-block; margin-right: 0.5rem; }

.write-module-box .social-login-area .ico-area .ico { display: inline-block; vertical-align: middle; }

.write-module-box .social-login-area .ico-area .ico img { display: block; width: 1.71429rem; height: 1.71429rem; }

.write-module-box .social-login-area .ico-area .ico + .ico { margin-left: 0.21429rem; }

.write-module-box .social-login-area .login-title { display: inline-block; vertical-align: middle; color: #666666; font-size: 0.85714rem; }

.write-module-box .write-area { height: 7rem; }

.write-module-box textarea { width: 100%; height: 100%; padding: 0.71429rem; border-radius: 0; border: none; font-size: 1rem; letter-spacing: -0.025em; background-color: transparent; -webkit-box-sizing: border-box; box-sizing: border-box; }

.write-module-box textarea:focus { outline: none; border-color: transparent; }

.write-module-box .etc-area { position: absolute; bottom: 0.71429rem; right: 0.71429rem; z-index: 1; }

.write-module-box .etc-area .counting { display: inline-block; vertical-align: middle; font-size: 0.85714rem; letter-spacing: -0.24px; color: #888888; }

.write-module-box .etc-area .counting .count { color: #222222; }

.write-module-box .etc-area .register-btn { display: inline-block; vertical-align: middle; margin-left: 0.5rem; }

.write-module-box .etc-area .register-btn .btn { border-color: #f5f5f5; background-color: #f5f5f5; }

.write-module-box.error { border-color: #e90000; }

.write-module-box + .etc-message { margin-top: 0.71429rem; color: #e90000; font-size: 0.85714rem; word-break: break-all; }

.sum-input-cover { position: relative; }

.sum-input-cover.bm input[type="text"], .sum-input-cover.bm input[type="number"], .sum-input-cover.bm input[type="tel"] { padding-right: 40px; }

.sum-input-cover input[type="text"], .sum-input-cover input[type="number"], .sum-input-cover input[type="tel"] { padding-left: 10px; padding-right: 30px; text-align: right; font-weight: bold; font-size: 1rem; }

.sum-input-cover input[type="text"][readonly], .sum-input-cover input[type="number"][readonly], .sum-input-cover input[type="tel"][readonly] { color: #000; }

.sum-input-cover span { position: absolute; top: 0; right: 15px; line-height: 50px; font-weight: 600; font-size: 1rem; }

.sum-input-cover strong { position: absolute; top: 0; left: 15px; line-height: 50px; font-size: 0.92857rem; }

.input-cover.appear-icon { position: relative; }

.input-cover.appear-icon > input { padding-left: 2.85714rem; }

.input-cover.appear-icon .id-ico, .input-cover.appear-icon .pass-ico { position: absolute; width: 1rem; height: 1.35714rem; top: 1.07143rem; left: 1.21429rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.input-cover.appear-icon .id-ico { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-field-id.png") center center no-repeat; background-size: 1rem 1.35714rem; }

.input-cover.appear-icon .pass-ico { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-field-pass.png") center center no-repeat; background-size: 1rem 1.35714rem; }

.marketing-agreement-popup .marketing-agree-wrap { padding-top: 0.5rem; }

.marketing-agreement-popup .basic-guide-wrap { padding-top: 1.71429rem; }

.marketing-agreement-popup .data-list li { font-size: 0.85714rem; }

input[type="text"], input[type="password"], input[type="number"], input[type="tel"], input[type="email"], input[type="search"] { display: block; width: 100%; -webkit-appearance: none; padding: 0 1.71429rem 0 0; height: 3.14286rem; font-size: 1.14286rem; font-weight: 400; border: none; border-bottom: 1px solid #bbbbbb; background-color: #fff; -webkit-transition: 0.4s border; -o-transition: 0.4s border; transition: 0.4s border; color: #222222; border-radius: 0; letter-spacing: -0.5px; -webkit-box-sizing: border-box; box-sizing: border-box; }

input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, input[type="tel"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="search"]::-webkit-input-placeholder { color: #999; opacity: 1; }

input[type="text"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="search"]::-moz-placeholder { color: #999; opacity: 1; }

input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="search"]:-ms-input-placeholder { color: #999; opacity: 1; }

input[type="text"]:-moz-placeholder, input[type="password"]:-moz-placeholder, input[type="number"]:-moz-placeholder, input[type="tel"]:-moz-placeholder, input[type="email"]:-moz-placeholder, input[type="search"]:-moz-placeholder { color: #999; opacity: 1; }

input[type="text"]:placeholder, input[type="password"]:placeholder, input[type="number"]:placeholder, input[type="tel"]:placeholder, input[type="email"]:placeholder, input[type="search"]:placeholder { color: #999; opacity: 1; }

input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="search"]:focus { outline: none; }

input[type="text"].error, input[type="password"].error, input[type="number"].error, input[type="tel"].error, input[type="email"].error, input[type="search"].error { border-bottom: 1px solid #e90000; }

input[type="text"][readonly], input[type="password"][readonly], input[type="number"][readonly], input[type="tel"][readonly], input[type="email"][readonly], input[type="search"][readonly] { color: #888888; }

input[type="text"][readonly]::-webkit-input-placeholder, input[type="password"][readonly]::-webkit-input-placeholder, input[type="number"][readonly]::-webkit-input-placeholder, input[type="tel"][readonly]::-webkit-input-placeholder, input[type="email"][readonly]::-webkit-input-placeholder, input[type="search"][readonly]::-webkit-input-placeholder { color: #dddddd; opacity: 1; }

input[type="text"][readonly]::-moz-placeholder, input[type="password"][readonly]::-moz-placeholder, input[type="number"][readonly]::-moz-placeholder, input[type="tel"][readonly]::-moz-placeholder, input[type="email"][readonly]::-moz-placeholder, input[type="search"][readonly]::-moz-placeholder { color: #dddddd; opacity: 1; }

input[type="text"][readonly]:-ms-input-placeholder, input[type="password"][readonly]:-ms-input-placeholder, input[type="number"][readonly]:-ms-input-placeholder, input[type="tel"][readonly]:-ms-input-placeholder, input[type="email"][readonly]:-ms-input-placeholder, input[type="search"][readonly]:-ms-input-placeholder { color: #dddddd; opacity: 1; }

input[type="text"][readonly]:-moz-placeholder, input[type="password"][readonly]:-moz-placeholder, input[type="number"][readonly]:-moz-placeholder, input[type="tel"][readonly]:-moz-placeholder, input[type="email"][readonly]:-moz-placeholder, input[type="search"][readonly]:-moz-placeholder { color: #dddddd; opacity: 1; }

input[type="text"][readonly]:placeholder, input[type="password"][readonly]:placeholder, input[type="number"][readonly]:placeholder, input[type="tel"][readonly]:placeholder, input[type="email"][readonly]:placeholder, input[type="search"][readonly]:placeholder { color: #dddddd; opacity: 1; }

textarea { resize: none; -webkit-appearance: none; border: 1px solid #bbbbbb; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

textarea::-webkit-input-placeholder { color: #999; opacity: 1; }

textarea::-moz-placeholder { color: #999; opacity: 1; }

textarea:-ms-input-placeholder { color: #999; opacity: 1; }

textarea:-moz-placeholder { color: #999; opacity: 1; }

textarea:placeholder { color: #999; opacity: 1; }

textarea[disabled] { background-color: #f7f7f7; }

/* .input-cover {
	position: relative;
	border-radius: 0;
	+ .input-cover {
		input:not(.error) {
			border-top-color: transparent;
			&[readonly] {
				&:focus {
					border-top-color: transparent;
				}
			}
			&:focus {
				border-top-color: $c1;
			}
		}
	}
} */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Firefox */
input[type=number] { -moz-appearance: textfield; }

.loader-wrap { display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 99999; background-color: rgba(102, 102, 102, 0.7); }

.loader-wrap .loader { width: 40px; height: 40px; position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -25px; }

.loader-wrap .loader { border: 2px solid #fff; border-left-color: transparent; border-radius: 50%; -webkit-animation-name: spin; animation-name: spin; -webkit-animation-duration: 700ms; animation-duration: 700ms; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; }

@-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    to { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); } }

@keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    to { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); } }

select { width: 100%; height: 2.85714rem; border-color: #d8d8d8; vertical-align: middle; }

.select-tric { opacity: 0; }

.selectric-wrapper { display: block; }

.selectric-wrapper.selectric-open { z-index: 900; }

.selectric-wrapper .selectric { text-decoration: none; }

.selectric-wrapper .selectric:hover .label { text-decoration: none; color: #666666; }

.selectric-wrapper .selectric .label { width: 100%; height: 100%; margin: 0; font-family: "Apple SD Gothic Neo", "Pretendard Std", "Malgun Gothic", "돋움", Dotum, Helvetica, Arial, sans-serif; font-weight: lighter; text-decoration: none; -webkit-box-sizing: border-box; box-sizing: border-box; }

.selectric-wrapper .selectric .label:before, .selectric-wrapper .selectric .label:after { content: ""; display: table; }

.selectric-wrapper .selectric .label:after { clear: both; }

.selectric-wrapper .selectric .button { height: 100%; border: none; }

.selectric-wrapper .selectric .button:after { content: ''; border: none; width: 0.71429rem; height: 0.42857rem; right: auto; left: 50%; margin-left: -5px; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common-fix/ico-selectric-btn.png") 0 0 no-repeat; background-size: 0.71429rem 0.42857rem; }

.selectric-wrapper .color-icon, .selectric-wrapper .round-color-icon { display: inline-block; margin-right: 0.42857rem; margin-top: -0.21429rem; vertical-align: middle; background-repeat: no-repeat; background-size: cover; }

.selectric-wrapper .color-icon { width: 1.14286rem; height: 1.14286rem; }

.selectric-wrapper .round-color-icon { width: 2rem; height: 2rem; border-radius: 50%; overflow: hidden; }

.selectric-wrapper .gift { display: block; position: relative; margin-top: 0.42857rem; padding-left: 0.64286rem; font-size: 0.85714rem; color: #666666; }

.selectric-wrapper .gift:before { display: block; content: ""; width: 0.42857rem; height: 0.42857rem; position: absolute; top: 0.42857rem; left: 0; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common-fix/ico-selectric-gift.png") no-repeat 0 0; background-size: cover; }

.selectric-wrapper .gift-img { display: inline-block; width: 2.57143rem; height: 2.57143rem; vertical-align: middle; margin-right: 0.64286rem; overflow: hidden; border: 1px solid #e5e5e5; background-size: cover; }

.selectric-wrapper .gift-img img { width: 100%; height: 100%; }

.selectric-wrapper .selectric-items { max-height: 14.07143rem; overflow: auto; border: 1px solid #000; -webkit-box-shadow: none; box-shadow: none; padding: 0; outline: none; }

.selectric-wrapper .selectric-items li { font-family: "Apple SD Gothic Neo", "Pretendard Std", "Malgun Gothic", "돋움", Dotum, Helvetica, Arial, sans-serif; font-weight: 400; color: #666666; }

.selectric-wrapper .selectric-items li.highlighted { background-color: #f4f4f4; color: #666666; }

.selectric-wrapper .selectric-items li.highlighted:hover { background-color: #f4f4f4; }

.selectric-wrapper .selectric-items li:hover { background-color: transparent; color: #666666; }

.selectric-wrapper .selectric-items .disabled { opacity: 1; color: #999 !important; }

.selectric-wrapper.selectric-border-none .selectric { border-color: transparent; }

.selectric-wrapper.selectric-none-color .color-icon, .selectric-wrapper.selectric-none-color .round-color-icon { display: none; }

.selectric-wrapper.selectric-only .selectric-items li.highlighted { background-color: transparent; }

.selectric-wrapper .selectric { width: 100%; border: 1px solid #ddd; }

.selectric-wrapper .selectric .label { padding: 0 3rem 0 1.07143rem; color: #666666; letter-spacing: -0.5px; font-weight: 600; }

.selectric-wrapper .selectric .button { width: 3rem; }

.selectric-wrapper .selectric-items li { position: relative; padding: 10px 1.07143rem; word-break: break-all; }

.selectric-wrapper .selectric-items li:before, .selectric-wrapper .selectric-items li:after { content: ""; display: table; }

.selectric-wrapper .selectric-items li:after { clear: both; }

.selectric-wrapper .selectric-items li.sold-out { color: #acacac; }

.selectric-wrapper .selectric-items li.notification { padding: 1.14286rem 7.5rem 1.14286rem 1.07143rem !important; }

.selectric-wrapper .selectric-items li.notification .soldout-text { display: inline-block; }

.selectric-wrapper .selectric-items li .btn-notification { display: block; position: absolute; top: 50%; right: 1.07143rem; z-index: 33; width: 5.71429rem; height: 2.5rem; margin-top: -1.21429rem; line-height: 2.5rem; text-align: center; font-size: 0.92857rem; letter-spacing: -0.025em; border: 0; border-radius: 0.35714rem; color: #fff; background-color: #222; }

.selectric-wrapper.selectric-open .selectric { border: 1px solid #222222; }

.selectric-wrapper.selectric-open .selectric .button:after { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.selectric-wrapper.selectric-open .selectric .label { color: #666666; }

.selectric-wrapper.selectric-open .selectric-items { border-color: #e5e5e5; top: calc(100% + 4px); }

.selectric-wrapper.selectric-above.selectric-open .selectric-items { bottom: auto; }

.selectric-wrapper.selectric-disabled { opacity: 1; }

.selectric-wrapper.selectric-disabled .selectric { border: 1px solid #222222; cursor: no-drop; }

.selectric-wrapper.selectric-disabled .selectric .label { color: #bbbbbb; }

.selectric-wrapper.selectric-disabled .selectric .label, .selectric-wrapper.selectric-disabled .selectric .button { background-color: #f7f7f7; }

.selectric-wrapper.selectric-large .selectric-items li, .selectric-wrapper.selectric-large .label { font-size: 1rem; font-weight: 400; }

.selectric-wrapper.selectric-large .selectric-items li { padding: 0.92857rem 2.14286rem 0.92857rem 1.42857rem; }

.selectric-wrapper.selectric-large .button { width: 2.85714rem; }

.selectric-wrapper.selectric-large .button:after { right: 1.42857rem; }

.selectric-wrapper.selectric-large .selectric { height: 3.71429rem; }

.selectric-wrapper.selectric-large .selectric .label { line-height: 3.57143rem; }

.selectric-wrapper.selectric-medium .selectric-items li, .selectric-wrapper.selectric-medium .label { font-size: 1rem; font-weight: 400; letter-spacing: -0.25px; color: #888888; }

.selectric-wrapper.selectric-medium .selectric-items li { padding: 1rem 0.85714rem; }

.selectric-wrapper.selectric-medium .selectric { height: 3.14286rem; }

.selectric-wrapper.selectric-medium .selectric .label { line-height: 3rem; }

.selectric-wrapper.selectric-small .selectric-items li, .selectric-wrapper.selectric-small .label { font-size: 0.92857rem; }

.selectric-wrapper.selectric-small .selectric { height: 2.85714rem; }

.selectric-wrapper.selectric-small .selectric .label { line-height: 2.71429rem; }

.selectric-wrapper.selectric-static.selectric-open .selectric-items { position: static; margin-top: 0.28571rem; }

.skip-article { display: none; }

.skip-article.on { display: block; }

.skip-link-wrapper .style-type { height: 3.14286rem; line-height: 3.14286rem; border-top: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.skip-link-wrapper .style-type:before, .skip-link-wrapper .style-type:after { content: ""; display: table; }

.skip-link-wrapper .style-type:after { clear: both; }

.skip-link-wrapper .style-type li { float: left; text-align: center; border-bottom: 1px solid #e5e5e5; width: 25%; }

.skip-link-wrapper .style-type li a { display: block; font-size: 0.78571rem; letter-spacing: -0.3px; }

.skip-link-wrapper .style-type li.on, .skip-link-wrapper .style-type li.focus { border-bottom-color: #000; }

.skip-link-wrapper .style-type li.on a, .skip-link-wrapper .style-type li.focus a { font-weight: bold; }

#skipNavi { position: absolute; margin: 0; left: 0; top: 0; width: 100%; height: 0px; z-index: 10001; }

#skipNavi .title { position: absolute !important; display: block; width: 0 !important; height: 0 !important; padding: 0 !important; margin: -1px !important; border: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; }

#skipNavi .title.focusable:active, #skipNavi .title.focusable:focus { position: static; height: auto; width: auto; margin: 0; clip: auto; overflow: visible; }

#skipNavi a { position: absolute; left: 0; top: -1000px; z-index: 1002; width: 100%; height: 2.14286rem; font-size: 1rem; line-height: 2.14286rem; text-align: center; background-color: #1d60a7; color: #fff; z-index: 1000; }

#skipNavi a.on { top: 0; }

#skipNavi a:focus { top: 0; height: 2.14286rem; }

/* data-table */
.data-table { table-layout: fixed; width: 100%; border: 0 none; border-spacing: 0; border-collapse: collapse; }

.data-table caption { overflow: hidden; width: 1px; height: 1px; *height: 0; padding: 0; margin-top: -1px; font-size: 0; line-height: 0; text-indent: -999px; }

.data-table th, .data-table td { word-break: break-all; font-weight: normal; font-size: 0.85714rem; color: #222222; }

.data-table.large th, .data-table.large td { padding: 0.64286rem 1.14286rem; }

.data-table.medium th, .data-table.medium td { padding: 0.64286rem 1.14286rem; }

.data-table.small tr:first-child th, .data-table.small tr:first-child td { border-top: 1px solid #e5e5e5; }

.data-table.small th, .data-table.small td { padding: 0.85714rem 0.57143rem; border-bottom: 1px solid #e5e5e5; text-align: left; font-size: 0.92857rem; letter-spacing: -0.025em; }

.data-table.small th { color: #222222; }

.data-table.small td { color: #666666; background-color: #fff; }

/* table align */
.data-table.align-left, .data-table th.align-left, .data-table td.align-left { text-align: left !important; }

.data-table.align-right, .data-table th.align-right, .data-table td.align-right { text-align: right !important; }

.data-table.align-center, .data-table th.align-center, .data-table td.align-center { text-align: center !important; }

/* table in etc */
.data-table.line-table th, .data-table.line-table td { padding: 0.85714rem 0.57143rem; border-bottom: 1px solid #e5e5e5; font-size: 1rem; }

.data-table.line-table td { color: #666666; text-align: center; }

.data-table.line-table thead th { border-top: 1px solid #e5e5e5; font-weight: 600; }

.data-table.line-table tbody th { font-weight: 600; }

.iscroll-wrap { overflow: hidden; padding-bottom: 1px; }

.iscroll-wrap .iscroll-menu { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; min-width: 100%; }

.tab-wrapper + .tab-filter-wrap { margin-top: 0.85714rem; }

.tab-wrapper + .product-list { margin-top: 2rem; }

.tab-swipe { padding: 1.14286rem 0; }

.tab-swipe.iscroll-wrap .iscroll-menu { padding-bottom: 1px; }

.tab-swipe li { white-space: nowrap; }

.tab-swipe li:first-child a { margin-left: 1.42857rem; }

.tab-swipe li:last-child a { margin-right: 1.42857rem; }

.tab-swipe li a { display: block; min-width: 3.85714rem; height: 2.28571rem; line-height: 2.28571rem; margin: 0 0.28571rem; padding: 0 1.14286rem; text-align: center; font-size: 0.85714rem; letter-spacing: -0.01714rem; color: #888888; border: 1px solid #dddddd; border-radius: 7.14286rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.tab-swipe li.on a { color: #fe4f27; border: 1px solid #fe4f27; }

.tab-swiper-wrapper { padding: 1.28571rem 0 1.28571rem 0; border-bottom: 1px solid #e5e5e5; }

.tab-swipe-icon.iscroll-wrap .iscroll-menu { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; padding-bottom: 0; }

.tab-swipe-icon li { width: 20vw; height: 5rem; }

.tab-swipe-icon li a { display: block; width: 100%; height: 100%; text-align: center; font-size: 1rem; letter-spacing: -0.025em; -webkit-box-sizing: border-box; box-sizing: border-box; }

.tab-swipe-icon li a span { display: block; margin-top: 5px; }

.tab-swipe-icon li img { display: block; width: 3.42857rem; margin: 0 auto; border-radius: 50%; border: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.tab-swipe-icon li.on img { border: 2px solid #fe4f27; }

.tab-swipe-icon li.on a { color: #fe4f27; }

.tab-square .tab { border-bottom: 1px solid #e5e5e5;}

.tab-square .tab:before, .tab-square .tab:after { content: ""; display: table;}

.tab-square .tab:after { clear: both; }

.tab-square .tab.iscroll-menu:after, .tab-square .tab.iscroll-menu:before { content: normal; }

.tab-square .tab.iscroll-menu li { float: none; }

.tab-square li { float: left; }

.tab-square li.on a { border-bottom: 2px solid #fe4f27; font-weight: 600; color: #fe4f27; background-color: #fff; }

.tab-square li:first-child a { padding-left: 1.42857rem; }

.tab-square a { display: block; height: 14.7222222vw; line-height: 14.4444444vw; padding: 0 1rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; word-break: break-all; text-align: center; font-size: 4.4444444vw; letter-spacing: -0.025em; color: #888888; -webkit-box-sizing: border-box; box-sizing: border-box; }

.tab-square.fill li:first-child a { border-left: 1px solid #e5e5e5; }

.tab-square.fill li a { background-color: #fff; border-color: #e5e5e5; border-right: 1px solid #e5e5e5; height: 2.85714rem; line-height: 2.71429rem; }

.tab-square.fill li .tabs { position: relative; display: inline-block; padding-left: 2.57143rem; }

.tab-square.fill li .ico { width: 2rem; height: 2rem; margin-right: 0.57143rem; background-color: #f00; display: inline-block; position: absolute; top: 50%; margin-top: -1rem; left: 0; }

.tab-square.fill li .ico.all { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/event/ico-event-tab-all-fill.png") left top no-repeat; background-size: cover; }

.tab-square.fill li .ico.event { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/event/ico-event-tab-event-fill.png") left top no-repeat; background-size: cover; }

.tab-square.fill li .ico.sale { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/event/ico-event-tab-sale-fill.png") left top no-repeat; background-size: cover; }

.tab-square.fill li.on a { background-color: #222222; border-color: #222222; color: #fff; font-size: 0.92857rem; font-weight: normal; }

.tab-square.fill li.on a .ico.all { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/event/ico-event-tab-all.png") left top no-repeat; background-size: cover; }

.tab-square.fill li.on a .ico.event { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/event/ico-event-tab-event.png") left top no-repeat; background-size: cover; }

.tab-square.fill li.on a .ico.sale { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/event/ico-event-tab-sale.png") left top no-repeat; background-size: cover; }

.tab-rectangle { padding: 0 1.42857rem; margin-bottom: 1.42857rem; }

.tab-rectangle .tab { border: 1px solid #dddddd; border-radius: 0.85714rem; }

.tab-rectangle .tab:before, .tab-rectangle .tab:after { content: ""; display: table; }

.tab-rectangle .tab:after { clear: both; }

.tab-rectangle .tab li { float: left; display: table; width: 50%; min-height: 3.71429rem; }

.tab-rectangle .tab li a { display: table-cell; vertical-align: middle; color: #888888; text-align: center; }

.tab-rectangle .tab li a strong { font-size: 1.14286rem; font-weight: 600; text-transform: uppercase; }

.tab-rectangle .tab li a span { font-size: 0.85714rem; }

.tab-rectangle .tab li a strong, .tab-rectangle .tab li a span { display: block; }

.tab-rectangle .tab li.on { position: relative; }

.tab-rectangle .tab li.on:after { content: ''; position: absolute; left: -1px; top: -1px; width: calc(100% + 2px); height: calc(100% + 2px); background-color: transparent; border: 1px solid #fe4f27; border-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.tab-rectangle .tab li.on a { color: #fe4f27; }

.tab-filter-wrap { padding: 0 16px; }

.tab-filter-wrap .result-area { position: relative; padding: 1rem 0; }

.tab-filter-wrap .result-area:before, .tab-filter-wrap .result-area:after { content: ""; display: table; }

.tab-filter-wrap .result-area:after { clear: both; }

.tab-filter-wrap .result-area .result-txt { padding-right: 6.42857rem; }

.tab-filter-wrap .result-area .result-txt:before, .tab-filter-wrap .result-area .result-txt:after { content: ""; display: table; }

.tab-filter-wrap .result-area .result-txt:after { clear: both; }

.tab-filter-wrap .result-area .result-txt .title, .tab-filter-wrap .result-area .result-txt .count { display: inline-block; }

.tab-filter-wrap .result-area .result-txt .title { font-weight: 700; font-size: 1.5rem; letter-spacing: -0.025em; word-break: break-all; }

.tab-filter-wrap .result-area .result-txt .count { margin-left: 0.57143rem; font-size: 0.92857rem; letter-spacing: -0.025em; }

.tab-filter-wrap .result-area .result-txt strong { font-weight: 600; color: #ff7864; }

.tab-filter-wrap .result-area .detail-area { position: absolute; top: 1.14286rem; right: 0; }

.tab-filter-wrap .sorting-wrap:before, .tab-filter-wrap .sorting-wrap:after { content: ""; display: table; }

.tab-filter-wrap .sorting-wrap:after { clear: both; }

.tab-filter-wrap .sorting-wrap .sorting-area { width: 68%; float: left; }

.tab-filter-wrap .sorting-wrap .sorting-area .selectric { border: 1px solid #e5e5e5; }

.tab-filter-wrap .sorting-wrap .sorting-area .selector-wrap { border: 1px solid #e5e5e5; height: 52px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.tab-filter-wrap .sorting-wrap .sorting-area .selector-wrap .asset { margin-top: 14px; margin-left: 15px; }

.tab-filter-wrap .sorting-wrap .view-type { float: left; width: 32%; height: 52px; }

.tab-filter-wrap .sorting-wrap .view-type button { display: block; float: left; width: 50%; height: 100%; text-indent: -9999px; border: 0; background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: 1.14286rem 1.14286rem; border: 1px solid #e5e5e5; border-left: 0; cursor: pointer; }

.tab-filter-wrap .sorting-wrap .view-type button.list { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-view-list-off.png"); }

.tab-filter-wrap .sorting-wrap .view-type button.list.on { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-view-list-on.png"); }

.tab-filter-wrap .sorting-wrap .view-type button.collect { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-view-collect-off.png"); }

.tab-filter-wrap .sorting-wrap .view-type button.collect.on { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-view-collect-on.png"); }

.tab-filter-wrap + .product-list { margin-top: 1.42857rem; }

.tab-filter-wrap + .product-list.best .item:first-child { padding-top: 0; }

.tab-filter-wrap + .product-list.special { margin-top: 0.57143rem; }

.tab-filter-wrap + .product-list.view-list { margin-top: 0; }

.tab-underline { border-bottom: 1px solid #ececec; }

.tab-underline .tab { background-color: #fff; }

.tab-underline .tab:before, .tab-underline .tab:after { content: ""; display: table; }

.tab-underline .tab:after { clear: both; }

.tab-underline .tab li { float: left; }

.tab-underline .tab li.on a { font-weight: bold; color: #222222; }

.tab-underline .tab li.on a:after { display: block; }

.tab-underline .tab a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 4.35714rem; padding: 0 15px; position: relative; text-align: center; font-size: 1rem; letter-spacing: -0.025em; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.tab-underline .tab a:after { display: none; content: ""; position: absolute; bottom: -1px; left: 0; z-index: 2; width: 100%; height: 0.21429rem; background-color: #222222; }

.tab-underline .tab a .count { display: block; }

.float-filter-wrapper { position: relative; background-color: #fff; }

.float-filter-wrapper .filter-space { height: 173px; }

.float-filter-wrapper + .product-list { margin-top: 1.42857rem; }

.float-filter-wrapper + .product-list.view-list { margin-top: 0; }

.float-filter-inner .tab-filter-wrap { position: absolute; bottom: 0; top: auto; left: 0; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; }

.float-filter-inner .tab-filter-wrap.only-filter { position: relative; }

.float-filter-inner.fix .tab-filter-wrap { position: fixed; top: 0; left: 0; bottom: auto; width: 100%; z-index: 5; border-bottom: 1px solid #ececec; background-color: #fff; }

.float-filter-inner.fix .tab-filter-wrap .sorting-wrap { padding-bottom: 12px; }

.float-filter-inner.fix .tab-filter-wrap.only-filter { border-bottom: 0; }

/* emphasis */
.em.disable { color: #dddddd; }

.em.slightly { color: #bbbbbb; }

.em.normal { color: #222222; }

.em.weighty { color: #fe4f27; }

.em.warning { color: #e90000; }

.em.success { color: #337bf6; }

.form-switch { display: inline-block; cursor: pointer; -webkit-tap-highlight-color: transparent; }

.form-switch .checker { position: relative; width: 3.42857rem; height: 2rem; vertical-align: text-bottom; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; }

.form-switch .checker input { width: 100%; height: 100%; }

.form-switch .checker > span { width: 100%; height: 100%; background: none; background-color: transparent; }

.form-switch .checker > span:after { position: absolute; content: ''; left: 0; top: 0; z-index: 2; width: 1.71429rem; height: 1.71429rem; background-color: #fff; border-radius: 1.71429rem; -webkit-transform: translate3d(0.14286rem, 0.14286rem, 0); transform: translate3d(0.14286rem, 0.14286rem, 0); -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; background-image: none; }

.form-switch .checker > span:before { position: absolute; content: ''; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; border-radius: 2rem; background-color: #bbbbbb; }

.form-switch .checker > span.checked:after { -webkit-transform: translate3d(1.57143rem, 0.14286rem, 0) scale3d(1, 1, 1); transform: translate3d(1.57143rem, 0.14286rem, 0) scale3d(1, 1, 1); background-color: #fff; }

.form-switch .checker > span.checked:before { background-color: #fe4f27; }

.form-switch-wrap .onoff { display: inline-block; padding-top: 0.42857rem; line-height: 1.42857rem; color: #888888; font-size: 1rem; font-weight: 600; text-transform: uppercase; vertical-align: top; }

.form-switch-wrap .form-switch { padding: 0 0.71429rem; }

.switch-box-wrap { margin-bottom: 2.85714rem; padding: 1.85714rem 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #f5f5f5; }

.switch-box-wrap:before, .switch-box-wrap:after { content: ""; display: table; }

.switch-box-wrap:after { clear: both; }

.switch-box-wrap .switch-type { float: left; font-weight: 600; font-size: 4.6666667vw; letter-spacing: -0.4px;margin-top: 0.6666667vw; }

.switch-box-wrap .form-switch-wrap { float: right; }

.datepicker-container { padding: 0 0.85714rem; }

.datepicker-container.datepicker-dropdown { width: 22rem; }

.datepicker-container:after, .datepicker-container:before { display: none !important; }

.datepicker-container .datepicker-panel li[data-view="day prev"], .datepicker-container .datepicker-panel li[data-view="day next"] { opacity: 0.4; }

.datepicker-container.datepicker-bottom-left, .datepicker-container.datepicker-bottom-right { border-bottom-color: #fe4f27; }

.datepicker-container.datepicker-top-left, .datepicker-container.datepicker-top-right { border-top-color: #fe4f27; }

.datepicker-panel { position: relative; }

.datepicker-panel ul:first-child { margin: 0.71429rem auto; width: 10.71429rem; }

.datepicker-panel ul:first-child li[data-view="month current"], .datepicker-panel ul:first-child li[data-view="year current"], .datepicker-panel ul:first-child li[data-view="years current"] { width: 6.42857rem; font-size: 1.14286rem; line-height: 2.57143rem; }

.datepicker-panel ul:first-child li[data-view="month prev"], .datepicker-panel ul:first-child li[data-view="year prev"], .datepicker-panel ul:first-child li[data-view="years prev"] { width: 2.14286rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-24x24.png") center 40% no-repeat; background-size: 0.85714rem 0.85714rem; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.datepicker-panel ul:first-child li[data-view="month next"], .datepicker-panel ul:first-child li[data-view="year next"], .datepicker-panel ul:first-child li[data-view="years next"] { width: 2.14286rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-24x24.png") center 60% no-repeat; background-size: 0.85714rem 0.85714rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.datepicker-panel > ul[data-view="month"] { width: 100%; }

.datepicker-panel > ul[data-view="month"] > li { width: 25%; }

.datepicker-panel > ul[data-view="week"], .datepicker-panel > ul[data-view="days"] { width: 100%; }

.datepicker-panel > ul[data-view="week"] > li, .datepicker-panel > ul[data-view="days"] > li { width: 3.14286rem; height: 3.14286rem; font-size: 1rem; line-height: 3.14286rem; }

.datepicker-panel [data-view=years] > li.highlighted, .datepicker-panel [data-view=months] > li.highlighted, .datepicker-panel [data-view=days] > li.highlighted { background-color: transparent; }

.datepicker-panel [data-view=years] > li.picked, .datepicker-panel [data-view=years] > li.picked:hover, .datepicker-panel [data-view=months] > li.picked, .datepicker-panel [data-view=months] > li.picked:hover, .datepicker-panel [data-view=days] > li.picked, .datepicker-panel [data-view=days] > li.picked:hover { color: #fe4f27; }

.datepicker-panel [data-view=days] > li.muted { opacity: 0.5; }

.datepicker-panel [data-view=days] > li.picked { position: relative; }

.datepicker-panel [data-view=days] > li.picked:after { display: block; content: ''; top: 0; left: 0; position: absolute; width: 100%; height: 100%; border: 1px solid #fe4f27; border-radius: 50%; -webkit-box-sizing: border-box; box-sizing: border-box; }

.datepicker-panel [data-view=days] > li.highlighted, .datepicker-panel [data-view=days] > li:hover { background-color: transparent; }

.datepicker-panel .date-close { position: absolute; display: block; top: 0; right: 0.42857rem; width: 2.14286rem; height: 2.14286rem; border: none; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-32x32.svg") center center no-repeat; background-size: contain; overflow: hidden; cursor: pointer; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

#footer { width: 100%; height: 200px; background-color: #bbbbbb; }

/* 헤더 */
#header { -webkit-transition: top ease 0.15s; -o-transition: top ease 0.15s; transition: top ease 0.15s; position: relative; top: 0; left: 0; z-index: 20; width: 100%; background-color: #fff; }

body.scroll-animate #header.summary { top: 0; }

.header-fixed #header { position: fixed; }

.header-inner { padding: 0 1.14286rem; }

.header-primary { height: 4rem; position: relative; background-color: #fff; }

.header-primary .header-menu { position: absolute; top: 50%; left: 1.14286rem; width: 1.42857rem; height: 1.42857rem; margin-top: -0.71429rem; z-index: 2; }

.header-primary .btn-side-menu { display: block; width: 1.35714rem; height: 1.14286rem; position: absolute; top: 50%; left: 50%; margin-top: -0.57143rem; margin-left: -0.71429rem; text-indent: -9999px; border: 0; background-color: transparent; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-header-menu.png") no-repeat 0 0; background-size: 1.35714rem 1.14286rem; }

.header-primary .brand-logo { position: absolute; top: 50%; left: 1.14286rem; margin-top: -0.42857rem; }

.header-primary .brand-logo img { display: block; max-height: 0.85714rem; width: auto; }

.header-primary .header-logo { position: absolute; top: 50%; left: 1.42857rem; margin-top: -1.28571rem; }

.header-primary .header-logo img { display: block; width: 4.85714rem; height: 2.57143rem; }

.header-primary .header-util { position: absolute; top: 50%; right: 1.42857rem; margin-top: -1.14286rem; }

.header-primary .header-util:before, .header-primary .header-util:after { content: ""; display: table; }

.header-primary .header-util:after { clear: both; }

.header-primary .header-util .item { float: left; display: block; width: 2.28571rem; height: 2.28571rem; position: relative; border: 0; background-color: transparent; }

.header-primary .header-util .item .ico { display: block; width: 2.28571rem; height: 2.28571rem; position: absolute; top: 50%; left: 50%; margin-top: -1.14286rem; margin-left: -1.14286rem; text-indent: -9999px; background-repeat: no-repeat; background-position: 0 0; background-size: cover; }

.header-primary .header-util .item .ico.gnb-menu { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-header-gnb-menu.png"); }

.header-primary .header-util .item .ico.close { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-32x32.png"); }

.header-primary .header-util .item .number { display: inline-block; position: absolute; top: -0.28571rem; right: -0.5rem; width: 1.07143rem; height: 1.07143rem; line-height: 1.07143rem; border-radius: 50%; text-align: center; font-size: 0.71429rem; color: #fff; background-color: #ff7864; }

.header-primary .header-util .item ~ .item { margin-left: 1.07143rem; }

.header-primary .btn-prev { display: inline-block; position: absolute; top: 50%; left: 1.14286rem; margin-top: -1.14286rem; width: 2.28571rem; height: 2.28571rem; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-header-prev.png") no-repeat 0 50%; background-size: 2.28571rem 2.28571rem; vertical-align: middle; text-indent: -9999px; }

.header-primary.independent-false .btn-prev, .header-primary.independent-ture .btn-prev { top: 8px; }

.header-primary .btn-home { display: inline-block; position: absolute; top: 0.92857rem; left: 3.14286rem; width: 1.57143rem; height: 1.42857rem; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-header-home.png") no-repeat 0 50%; background-size: 1.5rem 1.28571rem; vertical-align: middle; text-indent: -9999px; }

.header-primary .page-name { display: block; padding: 1.21429rem 5.35714rem 0; margin: 0 auto; text-align: center; font-weight: 600; font-size: 1.28571rem; letter-spacing: -0.025em; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; word-break: break-all; -webkit-box-sizing: border-box; box-sizing: border-box; }

.header-primary .page-name.left { text-align: left; }

.header-primary .page-name.brand { color: #bbbbbb; font-weight: 400; }

.header-primary .page-name.brand .brand-name { color: #666666; }

.layer-popup { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 10000; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: rgba(0, 0, 0, 0.7); padding: 20px;}

.layer-popup form { height: 100%; }

.layer-popup .popup-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 100%; }

.layer-popup .popup-head { padding: 1.14286rem 1.14286rem; position: relative; border-bottom: 1px solid #dddddd; background-color: #fff; }

.layer-popup .popup-head h2 { padding: 0 2.14286rem; text-align: center; font-weight: bold; font-size: 1.28571rem; letter-spacing: -0.05em; color: #222222; word-break: break-all; }

.layer-popup .popup-head .btn-close { display: block; position: absolute; top: 50%; right: 16px; z-index: 2; width: 2.28571rem; height: 2.28571rem; margin-top: 0; text-indent: -9999px; border: 0; background-color: transparent; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-32x32.svg"); background-size: 2.28571rem 2.28571rem; background-repeat: no-repeat; background-position: 50% 50%; cursor: pointer; transform: translateY(-50%); }

.layer-popup .popup-head .btn-download { display: block; position: absolute; top: 50%; right: 50px; z-index: 2; width: 2.28571rem; height: 2.28571rem; margin-top: -1.14286rem; text-indent: -9999px; border: 0; outline: 0; background-color: transparent; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-down-64x64.png"); background-size: 2.28571rem 2.28571rem; background-repeat: no-repeat; background-position: 50% 50%; cursor: pointer; }

.layer-popup .popup-head.static { padding: 0.85714rem 0.85714rem 0.42857rem; border-bottom: 0; }

.layer-popup .popup-head.static:before, .layer-popup .popup-head.static:after { content: ""; display: table; }

.layer-popup .popup-head.static:after { clear: both; }

.layer-popup .popup-head.static .btn-close { position: static; float: right; margin-top: 0; }

.layer-popup .popup-head.no-line { border-bottom: 0; }

.layer-popup .popup-head.no-line h2 { font-size: 1.28571rem; }

.layer-popup .popup-body { height: 100%; overflow: hidden; background-color: #fff; }

.layer-popup .popup-content { height: 100%; overflow: auto; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-overflow-scrolling: touch; }

.layer-popup .popup-content .cell .badge-icon{ display: inline-block; vertical-align: top; background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_stamp.svg) no-repeat; background-size: 100%; width: 24.555556vw; height: 27.555556vw;margin-bottom: 4.1666667vw}

.layer-popup .popup-inner { padding: 0 1.42857rem 1.14286rem; }

.layer-popup .popup-footer { padding: 1.42857rem; background-color: #fff; }

.layer-popup .popup-footer .reset-radius { border-radius: 0; }

.dim-popup { background-color: rgba(0, 0, 0, 0.7); }

.layer-popup .img-wrap img { display: block; margin: 0 auto; width: 4.28571rem; height: 4.28571rem; }

.layer-popup .article-title { margin-top: 0.71429rem; font-weight: 600; font-size: 1.71429rem; letter-spacing: -0.096em; color: #222222; }

.layer-popup .article-title.space-remove { margin-top: 0; }

.layer-popup .article-title .sub-text { display: inline-block; margin-left: 0.35714rem; font-weight: normal; font-size: 0.78571rem; color: #999; }

.layer-popup .article-info-text { font-size: 1rem; letter-spacing: -0.028em; color: #666666; word-break: break-all; }

.basic-size-popup { background-color: rgba(0, 0, 0, 0.7); padding: 0 px 5.5555556vw; }

.basic-size-popup .popup-align { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; overflow: hidden; margin: 0 auto; max-height: 100%; background-color: #fff; }

.basic-size-popup .popup-align > .btn-close { display: block; position: absolute; top: 2rem; right: 1rem; z-index: 2; width: 2.28571rem; height: 2.28571rem; margin-top: -1.14286rem; text-indent: -9999px; border: 0; background-color: transparent; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-32x32.svg"); background-size: 2.28571rem 2.28571rem; background-repeat: no-repeat; background-position: 50% 50%; cursor: pointer; }

.basic-size-popup .popup-body { overflow: auto; background-color: transparent; background-color: #fff; }

.basic-size-popup .popup-footer { background-color: transparent; }

.basic-size-popup.small .popup-align { width: 19.64286rem; min-height: 144px; border-radius: 4px; }

.basic-size-popup.small .popup-body { min-height: 99px; }

.basic-size-popup.small .popup-content { text-align: center; }

.basic-size-popup.small .popup-content .info-text { padding: 15px 20px; font-size: 1rem; letter-spacing: -0.025em; word-break: break-all; }

.basic-size-popup.small .table-vertical { min-height: 99px; }

.basic-size-popup.large .popup-align { position: relative; width:100%; }

.basic-size-popup.large .popup-head h2 { font-size: 1.14286rem; }

.basic-size-popup.large .popup-content { padding: 1.64286rem 1.42857rem; }

.layer-popup.basic-size-popup.large .popup-wrapper {flex: 1; -webkit-flex: 1;}

.layer-popup.basic-size-popup.large .popup-wrapper .popup-align .popup-body {height: auto;}

.layer-popup.basic-size-popup.large .popup-wrapper .popup-align .popup-body .popup-content {position: relative;}

.social-share-popup .popup-head { border-bottom: none; }

.social-share-popup .popup-content { padding: 1.42857rem 3.92857rem 2.85714rem; }

.social-share-popup .share-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.social-share-popup .share-list { width: 50%; text-align: center; }

.social-share-popup .share-list a { display: inline-block; }

.social-share-popup .share-list:nth-child(n+3) { margin-top: 2.14286rem; }

.social-share-popup .social-ico { display: block; margin: 0 auto; width: 3.42857rem; height: 3.42857rem; }

.social-share-popup .social-ico img { display: block; width: 3.42857rem; height: 3.42857rem; }

.social-share-popup .share-text { display: block; margin-top: 0.57143rem; font-size: 1rem; color: #666666; }

.layer-popup .article-block.login { text-align: center; }

.layer-popup .article-block.login .article-info-text { margin-top: 1.42857rem; }

.layer-popup.dormant-notice .btn-group { margin-top: 2.28571rem; }

.layer-popup.password-modify .modify-form-wrap { margin-top: 2.28571rem; }

.layer-popup.password-modify .btn-group { margin-top: 2.85714rem; }

.policy-popup .popup-inner { padding: 1.42857rem; font-size: 1rem; color: #666666; line-height: 1.57143rem; }

.policy-popup .dust-info { margin-top: 0.71429rem; }

.policy-popup .dust-url { margin-top: 1.42857rem; padding: 1.71429rem; border: 1px solid #e5e5e5; text-align: center; font-size: 1.14286rem; color: #222222; -webkit-box-sizing: border-box; box-sizing: border-box; word-break: break-all; }

.policy-popup .dust-url a { margin-top: 0.57143rem; display: block; font-weight: 600; }

.policy-popup .selectric-wrapper { margin-bottom: 1.42857rem; }

.policy-popup .selectric-wrapper .selectric { border: 0; border-bottom: 1px solid #bbb; }

.policy-popup .selectric-wrapper .selectric .button { width: 1.42857rem; }

.policy-popup .selectric-wrapper .selectric .label { padding-left: 0; }

.privacy-consent-popup .article-block + .article-block { border-top: 1px solid #bbbbbb; }

.privacy-consent-popup .article-block.privacy-block { padding: 1.71429rem 0; }

.privacy-consent-popup .article-block.privacy-info { padding: 1.14286rem 0; }

.privacy-consent-popup .article-block.privacy-info .infomation { line-height: 1.28571rem; font-size: 0.85714rem; color: #666666; }

.privacy-consent-popup .article-block.privacy-title { padding-bottom: 1.42857rem; }

.privacy-consent-popup .article-block.privacy-title .article-title { font-size: 1.71429rem; }

.privacy-consent-popup .article-block.privacy-title .article-info-text { margin-top: 1.14286rem; }

.privacy-consent-popup .article-title { text-align: center; font-size: 1.28571rem; color: #222222; }

.privacy-consent-popup .article-info-text { margin-top: 0.28571rem; text-align: center; font-size: 1rem; color: #666666; }

.privacy-consent-popup .privacy-list li { position: relative; }

.privacy-consent-popup .privacy-list li > strong { font-weight: 600; color: #222222; }

.privacy-consent-popup .privacy-list li .bold-txt {font-size: 1.21428rem;}

.privacy-consent-popup .privacy-list li + li { margin-top: 0.85714rem; }

.system-inspection-popup .system-title { text-align: center; }

.system-inspection-popup .system-title .article-title { line-height: 2.35714rem; }

.system-inspection-popup .system-block { margin-top: 1.14286rem; }

.system-inspection-popup .system-block li { color: #222222; }

.system-inspection-popup .system-block li strong { font-weight: 600; }

.system-inspection-popup .system-block li p { margin-top: 0.28571rem; font-weight: 400; }

.system-inspection-popup .system-block li .small-txt { font-size: 0.85714rem; color: #666666; }

.system-inspection-popup .system-info { margin-top: 1.42857rem; }

.system-inspection-popup .system-info .infomation { line-height: 1.57143rem; font-size: 1rem; color: #666666; }

.system-inspection-popup .btn-group { margin-top: 2.85714rem; }

.bread-time-popup .article-block { text-align: center; }

.bread-time-popup.layer-popup .popup-wrapper .popup-content iframe{width: 100% !important;}

.bread-time-popup .article-block .img-wrap img { width: 3rem; height: 3rem; }

.bread-time-popup .article-block .article-title { margin-top: 0.57143rem; font-size: 1.42857rem; }

.bread-time-popup .article-block .article-info-text { margin-top: 0.28571rem; font-size: 0.85714rem; color: #888; }

.bread-time-popup .day-list { display: table; table-layout: fixed; margin: 1.42857rem auto 0; overflow: hidden; border-radius: 1.5rem; background-color: #eeeeee; }

.bread-time-popup .day-list .day { display: table-cell; width: 3rem; height: 3rem; vertical-align: middle; text-align: center; font-size: 1rem; letter-spacing: -0.28px; }

.bread-time-popup .day-list .day.on { font-weight: bold; color: #fff; background-color: #fe4f27; border-radius: 1.5rem; }

.bread-time-popup .day-product-wrap { margin-top: 1.14286rem; max-height: 21.42857rem; overflow: auto; }

.bread-time-popup .day-product-wrap .time-bundle.on .time-area { font-weight: bold; color: #fe4f27; }

.bread-time-popup .day-product-wrap .time-bundle + .time-bundle { margin-top: 1.14286rem; }

.bread-time-popup .day-product-wrap .time-area { font-size: 1rem; }

.bread-time-popup .day-product-wrap .time-product-list { margin-top: 0.28571rem; padding-top: 0.42857rem; border-top: 1px solid #666; }

.bread-time-popup .day-product-wrap .time-product-list .list { display: table; table-layout: fixed; width: 100%; padding: 0.85714rem 0; border-bottom: 1px solid #e5e5e5; }

.bread-time-popup .day-product-wrap .thumbnail-wrap { display: table-cell; vertical-align: middle; width: 4.57143rem; height: 4.57143rem; }

.bread-time-popup .day-product-wrap .thumbnail-wrap .thumbnail-inner { position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: 50%; }

.bread-time-popup .day-product-wrap .detail-wrap { display: table-cell; vertical-align: middle; padding-left: 0.85714rem; padding-right: 0.85714rem; }

.bread-time-popup .day-product-wrap .detail-wrap .title { font-size: 1rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.bread-time-popup .day-product-wrap .detail-wrap .info { display: block; margin-top: 0.57143rem; font-weight: bold; letter-spacing: -0.28px; word-break: break-all; }

.layer-popup.store .popup-content { padding-top: 2rem; }

.layer-popup.store .article-block { text-align: center; }

.layer-popup.store .article-title { font-size: 1.42857rem; letter-spacing: -0.8px; }

.layer-popup.store .article-title + .article-info-text { margin-top: 1.14286rem; }

.layer-popup.store .article-info-text { color: #222222; }

.layer-popup.store .article-info-text.sub { color: #666666; }

.layer-popup.store .article-info-text.priority { font-size: 1.14286rem; }

.layer-popup.store .alarm-infor {padding: 0.71428rem 0; text-align: left; font-size: 1rem}

.layer-popup.store .alarm-infor p{ font-size: 1rem; text-align: left; text-indent: -0.71428rem; margin-left: 0.71428rem;}

.layer-popup.store .alarm-infor .inner-area { margin-top: 0.71428rem; padding: 0.71428rem; background: #F5F5F5; font-size: 0.85714rem; text-align: center;}

.layer-popup.store .article-info-text + .article-info-text { margin-top: 0.85714rem; }

.layer-popup.store .terms-view-btn { display: inline-block; margin-top: 1.14286rem; color: #fe4f27; border-bottom: 1px solid #fe4f27; }

.layer-popup.store .data-list-box { margin-top: 1.42857rem; padding: 1.42857rem; text-align: left; background-color: #f5f5f5; }

.layer-popup.store .data-list-box .data-list li { padding-left: 8px; font-size: 0.85714rem; }

.layer-popup.store .data-list-box .data-list li:after { width: 3px; height: 3px; }

.layer-popup.store .data-list-box .data-list li + li { margin-top: 0.21429rem; }

.layer-popup.store .btn-group { padding-top: 2.14286rem; }

.layer-popup.store .switch-control-wrap .switch-control-area { display: table; width: 100%; padding: 1.14286rem 0; -webkit-box-sizing: border-box; box-sizing: border-box; table-layout: fixed; }

.layer-popup.store .switch-control-wrap .switch-control-area .description-wrap { display: table-cell; vertical-align: middle; text-align: left; }

.layer-popup.store .switch-control-wrap .switch-control-area .description-wrap .type { font-size: 1rem; letter-spacing: -0.28px; word-break: break-all; }

.layer-popup.store .switch-control-wrap .switch-control-area .description-wrap .sub { display: block; margin-top: 0.28571rem; font-size: 0.85714rem; letter-spacing: -0.24px; color: #bbbbbb; word-break: break-all; }

.layer-popup.store .switch-control-wrap .switch-control-area .form-switch-wrap { display: table-cell; vertical-align: middle; width: 3.42857rem; }

.layer-popup.store .switch-control-wrap .switch-control-area .form-switch-wrap .form-switch { padding: 0; }

.layer-popup.store .switch-control-wrap .sub-control-area:before, .layer-popup.store .switch-control-wrap .sub-control-area:after { content: ""; display: table; }

.layer-popup.store .switch-control-wrap .sub-control-area:after { clear: both; }

.layer-popup.store .switch-control-wrap .sub-control-area .description-wrap { float: left; width: 10rem; padding-right: 0.71429rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.layer-popup.store .switch-control-wrap .sub-control-area .description-wrap .type { font-size: 0.85714rem; text-align: left; letter-spacing: -0.24px; color: #666666; word-break: break-all; }

.layer-popup.store .switch-control-wrap .sub-control-area .selector-wrap { float: right; }

.layer-popup.store .switch-control-wrap .sub-control-area .selector-wrap .asset .label { font-size: 0.85714rem; }

.layer-popup.store .switch-control-wrap + .switch-control-wrap { border-top: 1px solid #e5e5e5; }

.layer-popup.store .position-info-btn { padding-top: 1.14286rem; }

.store-filter-popup{padding: 10rem 0 0; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; -webkit-transform: translateY(0%); -ms-transform: translateY(0%);}

.store-filter-popup .popup-inner { padding: 0; }

.store-filter-popup .filter-list-wrap .set { position: relative; border-bottom: 1px solid #e5e5e5; }

.store-filter-popup .filter-list-wrap .set input[type="radio"], .store-filter-popup .filter-list-wrap .set input[type="checkbox"] { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; }

.store-filter-popup .filter-list-wrap .set input[type="radio"]:checked + label:after, .store-filter-popup .filter-list-wrap .set input[type="checkbox"]:checked + label:after { display: block; }

.store-filter-popup .filter-list-wrap .set label { position: relative; display: block; padding: 1rem 3.57143rem 1rem 2rem; font-size: 1.14286rem; letter-spacing: -0.32px; }

.store-filter-popup .filter-list-wrap .set label:after { display: none; width: 1.71429rem; height: 1.71429rem; content: ''; position: absolute; z-index: 1; top: 50%; margin-top: -0.85714rem; right: 1.14286rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common-fix/uniform.svg"); background-size: 28.57143rem 28.57143rem; background-position: 0 -1.78571rem; background-repeat: no-repeat; background-color: transparent; }

.store-filter-popup .filter-list-wrap.half:before, .store-filter-popup .filter-list-wrap.half:after { content: ""; display: table; }

.store-filter-popup .filter-list-wrap.half:after { clear: both; }

.store-filter-popup .filter-list-wrap.half .set { float: left; width: 50%; }

.store-filter-popup .filter-list-wrap.half .set:nth-child(2n) { border-left: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.store-filter-popup .popup-footer{ padding: 1.42857rem 0 0;}

.store-filter-popup .popup-footer .btn-group.radius .btn {border-radius:0}

.store-filter-popup .popup-footer .btn-group.radius .btn  + .btn {margin-left: 0;}

.store-detail-popup .store-detail-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; }

.store-detail-popup .store-detail-content .store-map-wrapper { position: relative; width: 100%; height: 100%; overflow: hidden; }

.store-detail-popup .store-detail-content .store-map-wrapper .map-area { width: 100%; height: 100%; position: absolute; z-index: 2; top: 0; left: 0; background-color: #f0f0f0; }

.layer-popup.clover-popup .popup-inner { padding: 0 0 4.28571rem; }

.layer-popup.clover-popup .contents-list-bundle-video { padding: 1.42857rem; }

.layer-popup.clover-popup .contents-list-bundle-video .item .thumbnail { border-radius: 0.85714rem; }

.layer-popup.clover-popup .btn-group { margin: 0.57143rem 1.42857rem 0; }

.layer-popup.earn-points-popup .section-title-wrap { margin-top: 0; }

.layer-popup.earn-points-popup .contents-list-bundle-video { padding-bottom: 0; }

.layer-popup.earn-points-popup .gray-bg-wrap { padding: 2.85714rem 0 1.42857rem; }

.layer-popup.earn-points-popup .gray-bg-wrap .btn-group { padding: 1.42857rem; }

.layer-popup.earn-points-popup .check-pop-confirm { padding: 1.42857rem; }

.layer-popup.earn-points-popup .earn-point-complete { padding: 1.42857rem; text-align: center; }

.layer-popup.earn-points-popup .earn-point-complete .comfirm-check { width: 4.28571rem; }

.layer-popup.earn-points-popup .earn-point-complete .comfirm-txt { margin-top: 0.71429rem; font-size: 1.71429rem; font-weight: 300; word-break: break-all; }

.brand-select-popup {padding: 10rem 0 0; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; -webkit-transform: translateY(0%); -ms-transform: translateY(0%);}

.brand-select-popup .selector-wrap.select-line .asset { display: block; margin: 0;  }

.brand-select-popup .selector-wrap.select-line .asset:before, .brand-select-popup .selector-wrap.select-line .asset:after { content: ""; display: table; }

.brand-select-popup .selector-wrap.select-line .asset:after { clear: both; }

.brand-select-popup .selector-wrap.select-line .asset div.radio {position: absolute; top: 50%; right: 1.42857rem; margin-top: -0.71428rem;}

.brand-select-popup .selector-wrap.select-line .asset .label { padding: 1.42857rem;}

.brand-select-popup .selector-wrap.select-line .asset + .asset { border-top: 1px solid #e5e5e5; }

.advertise-point-popup .article-block .img-wrap img { width: auto; height: 4.28571rem; }

.advertise-point-popup .article-block .article-title { margin-top: 0.71429rem; font-size: 1.71429rem; text-align: center; }

.advertise-point-popup .article-block .list-title { margin-top: 1.42857rem; }

.advertise-point-popup .article-block .data-list { margin-top: 0.71429rem; }

.advertise-point-popup .article-btn .btn-group { margin-top: 1.71429rem; }

.advertise-point-popup .square-radius-box { margin-top: 1.42857rem; padding: 1.42857rem; border: 1px solid #e5e5e5; border-radius: 0.85714rem; }

.advertise-point-popup .square-radius-box:before, .advertise-point-popup .square-radius-box:after { content: ""; display: table; }

.advertise-point-popup .square-radius-box:after { clear: both; }

.advertise-point-popup .square-radius-box > .point-title { display: inline-block; font-size: 1.14286rem; }

.advertise-point-popup .square-radius-box > .point { float: right; display: inline-block; font-size: 1.14286rem; }

.advertise-point-popup .square-radius-box > .btn-group { margin-top: 0.71429rem; }

.layer-popup .mycoupon-item-area.mycoupon { padding: 1.42857rem; padding-bottom: 2.85714rem; }

.layer-popup .mycoupon-item-area.mycoupon > .item-list li { margin-bottom: 0; }

.layer-popup .mycoupon-register-area { padding: 2.35714rem 1.42857rem; }

.layer-popup .mycoupon-register-area .registration-txt { font-size: 1.14286rem; }

.layer-popup .mycoupon-register-area > input { height: 3.42857rem; line-height: 3.28571rem; margin-top: 1.42857rem; padding: 0 0.71429rem; border: 1px solid #bbbbbb; }

.layer-popup .mycoupon-register-area > .btn-group { padding-top: 1.42857rem; }

.layer-popup .mycoupon-register-thumb { margin-top: 1.42857rem; }

.layer-popup .mycoupon-register-thumb img { display: block; max-width: 100%; max-height: 18.14286rem; margin: 0 auto; }

.layer-popup.popup-blocker .popup-body { position: relative; }

.layer-popup.popup-blocker .popup-body:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); }

.layer-popup.popup-blocker .popup-body:before { position: absolute; left: 50%; top: 45%; content: '본 이벤트는 \A 종료되었습니다.'; white-space: pre; color: #fff; z-index: 3; font-size: 1.14286rem; text-align: center; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.marketing-agreement-popup .marketing-agree-wrap { padding-top: 0.5rem; }

.marketing-agreement-popup .basic-guide-wrap { padding-top: 1.71429rem; }

.marketing-agreement-popup .data-list li { font-size: 0.85714rem; }

.terms-popup .terms-content { border: 0; }

.terms-popup .terms-content .title { font-weight: 600; font-size: 1.14286rem; letter-spacing: -0.03em; }

.terms-popup .terms-content .terms-list { margin-top: 1.42857rem; }

.terms-popup .terms-content dt, .terms-popup .terms-content dd { margin: 0; }

.terms-popup .terms-content dt { font-weight: 600; font-size: 1rem; }

.terms-popup .terms-content dd { margin-top: 0.71429rem; line-height: 1.42857rem; font-size: 1rem; color: #666666; letter-spacing: -0.03em; word-break: break-all; }

.terms-popup .terms-content dd strong { font-weight: 600; }

.terms-popup .terms-content dd .bold-txt {font-size: 1.21875rem; white-space: pre-wrap;}

.terms-popup .terms-content .data-list li { margin-top: 0.42857rem; }

.terms-popup .terms-content .data-list li.bold-txt {font-size: 1.21875rem;}

.terms-popup .terms-content .data-list li .data-list li { padding-left: 0.42857rem; }

.terms-popup .terms-content .data-table.medium tr th, .terms-popup .terms-content .data-table.medium tr td { border-bottom: 1px solid #e5e5e5; }

.terms-popup .terms-content .data-table.medium tr:last-child th, .terms-popup .terms-content .data-table.medium tr:last-child td { border-bottom: none; }

.terms-popup .terms-content .data-table.medium th { background-color: #f5f5f5; }

@media (max-width: 359px) { html { font-size: 12px; } }

@media (min-width: 360px) and (max-width: 479px) { html { font-size: 14px; } }

@media (min-width: 480px) and (max-width: 720px) { html { font-size: 16px; } }

@media (min-width: 720px) { html { font-size: 28px; } }

html { overflow-y: scroll !important; }

html, html a { text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); -webkit-font-smoothing: subpixel-antialiased; }

body { color: #222; font-family:'Pretendard Std'; line-height: 1.4; letter-spacing: -0.03em; }

#content { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; }

.table-vertical { display: table; table-layout: fixed; width: 100%; height: 100%; }

.table-vertical > .cell { display: table-cell; vertical-align: middle; height: 100%; }

.center-mode { position: absolute; display: block; width: 100%; top: 50%; left: 50%; margin: 0 auto; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.full-mode-wrap { display: block; position: relative; width: 100%; height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; }

.editor-area img {max-width: 100% !important; height: auto !important; display: block; margin: 0 auto; }

.editor-area, .editor-area * { word-break: break-all; }

.full-banner-slider .swiper-slide img { width: 100%; }

.dim-bg { display: none; position: fixed; top: 0; left: 0; z-index: 902; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); }

.inside-space { padding: 0 1.42857rem; }

.content-wrapper { padding: 2rem 0; }

.border-top-line { border-top: 8px solid #f5f5f5; }

.border-bottom-line { border-bottom: 8px solid #f5f5f5; }

.always-hold-down-wrap { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 1000; }

.always-hold-down-wrap .btn-group.btn-flex .btn + .btn { margin-left: 0; }

.always-hold-down-wrap .btn-group.btn-flex .btn-cheer { width: 3.42857rem; -ms-flex-negative: 0; flex-shrink: 0; padding: 0; background-color: #fff; border-color: #fff; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.always-hold-down-wrap .btn-group.btn-flex .btn-cheer:after { position: absolute; content: ''; width: 2.28571rem; height: 2.28571rem; left: 0.57143rem; top: 0.57143rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-share.svg") center center no-repeat; }

.always-hold-down-wrap.floating { left: auto; right: 1.14286rem; bottom: 1rem; width: auto; z-index: 900; }

.always-hold-down-wrap.floating .solitary-btn a { display: block; }

.always-hold-down-wrap.floating .solitary-btn img { display: block; max-width: 100%; }

.always-hold-down-wrap.product-register { -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.16); box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.16); }

.always-hold-down-wrap.product-register .file-add-bundle { padding: 1.42857rem 0; background-color: #fff; }

.always-hold-down-wrap.product-register .file-add-bundle .text-area { padding: 0 1.42857rem; }

.always-hold-down-wrap.product-register .file-add-bundle .text-area .text { font-size: 1rem; text-align: center; word-break: break-all; }

.always-hold-down-wrap.product-register .file-add-bundle .text-area .count { color: #888888; }

.always-hold-down-wrap.product-register .file-add-bundle .file-add-module .item { margin-top: 1.42857rem; }

.always-hold-down-wrap.product-register .file-add-bundle .file-add-module .item:first-child { margin-left: 1.42857rem; }

.always-hold-down-wrap.product-register .file-add-bundle .file-add-module .item:last-child { margin-right: 1.42857rem; }

.description-list dl, .description-list dt, .description-list dd { margin: 0; padding: 0; word-break: break-all; }

.description-list dl { position: relative; display: block; }

.description-list dl:before, .description-list dl:after { content: ""; display: table; }

.description-list dl:after { clear: both; }

.description-list dt, .description-list dd { display: inline-block; float: left; width: 50%; }

.accordion-list.on > .accordion-body { display: block; }

.accordion-list .accordion-btn { cursor: pointer; }

.accordion-list .accordion-body { display: none; }

.accordion-list .accordion-body img { max-width: 100%; height: auto !important; }

.accordion-container.type-01 .accordion-list { border-bottom: 1px solid #e5e5e5; padding: 1.42857rem 0; position: relative; }

.accordion-container.type-01 .accordion-list.on { padding-bottom: 2.14286rem; }

.accordion-container.type-01 .accordion-list.on .accordion-head .article { font-weight: 600; }

.accordion-container.type-01 .accordion-list.on .arrow { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-up-32x32.png"); }

.accordion-container.type-01 .accordion-head { padding: 0 1.42857rem; }

.accordion-container.type-01 .accordion-head .article { font-size: 1.14286rem; letter-spacing: -0.03em; font-weight: 400; }

.accordion-container.type-01 .accordion-head .arrow { position: absolute; top: 1.71429rem; right: 1.42857rem; width: 1.14286rem; height: 1.14286rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-down-32x32.png"); background-size: 1.14286rem; background-repeat: no-repeat; background-position: 0 0; }

.accordion-container.type-01 .accordion-head.accordion-btn { padding: 0 2.85714rem 0 1.42857rem; }

.accordion-container.type-01 .accordion-body { margin-top: 1.42857rem; }

.accordion-container.type-01 .accordion-body .article { font-size: 1rem; letter-spacing: -0.03em; color: #666; line-height:1.5;}

.accordion-container.type-01 .data-important { display: block; margin-bottom: 0.71429rem; color: #222222; font-weight: 600; }

.magazine-list-wrap .magazine-list { position: relative; }

.magazine-list-wrap .magazine-list + .magazine-list { margin-top: 0.85714rem; }

.magazine-list-wrap .magazine-list .link-area { display: block; }

.magazine-list-wrap .magazine-list .thumb-wrap { position: relative; z-index: 1; width: 100%; padding-bottom: 118%; overflow: hidden; }

.magazine-list-wrap .magazine-list .thumb-area { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 1; }

.detail .brand { font-size: 1rem; }

.detail .title-wrap .title { margin-top: 0.85714rem; font-size: 1.14286rem; font-weight: 600; color: #222222; }

.detail .title-wrap .sub-txt { margin-top: 0.28571rem; color: #888888; }

.detail .title-wrap .sub-info { margin-top: 0.42857rem; font-size: 0.85714rem; color: #888888; letter-spacing: -0.24px; word-break: break-all; }

.detail .price-tag .sale-percent { font-size: 1.28571rem; font-weight: bold; color: #337bf6; }

.detail .price-tag .current-price { font-size: 1.14286rem; font-weight: bold; color: #000; }

.detail .price-tag .current-price .number { font-size: 1.28571rem; }

.detail .point-tag { display: inline-block; margin-top: 0.85714rem; padding: 0.21429rem 0.71429rem 0.07143rem; border-radius: 1.57143rem; border: 1px solid #e5e5e5; color: #666666; font-size: 0.85714rem; letter-spacing: -0.04286rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.product-list { padding: 0 12px; }

.product-list:before, .product-list:after { content: ""; display: table; }

.product-list:after { clear: both; }

.product-list .item { position: relative; float: left; display: block; width: 50%; padding-right: 0.14286rem; padding-left: 0.14286rem; padding-top: 1.42857rem; padding-bottom: 1.42857rem; border-top: 1px solid #ececec; -webkit-box-sizing: border-box; box-sizing: border-box; }

.product-list .item:before, .product-list .item:after { content: ""; display: table; }

.product-list .item:after { clear: both; }

.product-list .item.odd-list { clear: both; }

.product-list .item:nth-child(1), .product-list .item:nth-child(2) { border: none; }

.product-list .item .link { display: block; position: relative; z-index: 1; }

.product-list .item.soldout .thumb-condition { display: -webkit-box; display: -ms-flexbox; display: flex; }

.product-list .thumb { min-width: 11.42857rem; position: relative; z-index: 1; }

@media (max-width: 359px) { .product-list .thumb { min-width: 10rem; } }

.product-list .thumb .thumbnail { position: relative; overflow: hidden; padding-bottom: 100%; }

.product-list .thumb .thumbnail .ranking-number { position: absolute; left: 0; top: 0; z-index: 2; width: 1.71429rem; height: 2rem; }

.product-list .thumb .thumbnail .ranking-number:before { content: ''; position: absolute; left: 0; top: 0; border-top: 1.28571rem solid #337bf6; border-left: 0.85714rem solid #337bf6; border-right: 0.85714rem solid #337bf6; border-bottom: 0.71429rem solid transparent; }

.product-list .thumb .thumbnail .ranking-number > span { position: absolute; left: 0; top: 0.14286rem; width: 100%; text-align: center; color: #fff; }

.product-list .thumb .movie-play-ico { position: absolute; width: 2.85714rem; left: 50%; top: 50%; z-index: 2; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.product-list .detail { position: relative; }

.product-list .detail .brand { word-break: break-all; }

.product-list .detail .title-wrap { margin-bottom: 0.57143rem; }

.product-list .detail .title-wrap .title { word-break: break-all; display: block; display: -webkit-box; height: 2.8em; max-height: 2.8em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.product-list .detail .title-wrap .title.ellipsis { display: block; display: -webkit-box; height: 1.5em; max-height: 1.5em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.product-list.swiper-container { position: relative; padding-right: 16px; }

.product-list.swiper-container .item { width: 10.28571rem; clear: none; padding: 0; margin-right: 0.14286rem; margin-left: 0.14286rem; border-top: 0; }

.product-list.swiper-container .item:first-child { margin-left: 0; }

.product-list.swiper-container .item:last-of-type { margin-right: 0; }

.product-list.swiper-container .thumb { min-width: 10.28571rem; }

.product-list.swiper-container.space { padding-left: 20px; }

.product-list.swiper-container.space .swiper-scrollbar { width: 100%; }

.product-list.view-list { padding: 0 16px; }

.product-list.view-list .item { float: none; width: 100%; margin-top: 0; padding: 1.14286rem 0; }

.product-list.view-list .item:after, .product-list.view-list .item:before { display: none; }

.product-list.view-list .item-wrapper { display: table; table-layout: fixed; width: 100%; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; }

.product-list.view-list .item-wrapper.align-middle .thumb, .product-list.view-list .item-wrapper.align-middle .detail { vertical-align: middle; }

.product-list.view-list .thumb { display: table-cell; min-width: auto; vertical-align: top; }

.product-list.view-list .detail { display: table-cell; height: 100%; vertical-align: top; margin-top: 0; padding-top: 0; padding-left: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.product-list.view-list .item + .item { border-top: 1px solid #e5e5e5; }

.product-list.view-list .item.single { padding: 0; margin-bottom: 0; }

.product-list.view-list .thumb { width: 108px; height: 108px; }

.product-list.view-list .thumb.x-large { width: 9.71429rem; height: 9.71429rem; }

.product-list.view-list .thumb.large { width: 8.85714rem; height: 8.85714rem; }

.product-list.view-list .thumb.medium { width: 7.71429rem; height: 7.71429rem; }

.product-list.view-list .thumb.small { width: 5.14286rem; height: 5.14286rem; }

.product-list.view-list .thumb.small .thumb-inner { padding: 10px; }

.product-list.view-list .thumb.xsmall { width: 3.57143rem; height: 3.57143rem; }

.product-list.view-list .thumb.xsmall .thumb-inner { padding: 5px; }

.contents-list-bundle { margin-bottom: 2.85714rem; }

.contents-list-bundle .common-bundle-list .item { position: relative; }

.contents-list-bundle .common-bundle-list .item > a { display: block; }

.contents-list-bundle .common-bundle-list .item .thumbnail { position: relative; overflow: hidden; }

.contents-list-bundle .common-bundle-list .item .post-list-wrap { padding: 0 1.42857rem; }

.contents-list-bundle .common-bundle-list .item .details-area { position: relative; }

.contents-list-bundle .common-bundle-list .item .details-area .details { padding-top: 1.42857rem; padding-left: 1.42857rem; background-color: #fff; }

.contents-list-bundle .common-bundle-list .item .details-area .title-wrap .sub-txt { margin-top: 0.71429rem; color: #666666; }

.contents-list-bundle .common-bundle-list .thumbnail-area .dday-wrap { position: relative; height: 0.28571rem; }

.contents-list-bundle .common-bundle-list .thumbnail-area .dday-area { position: absolute; right: 0; top: 0; z-index: 2; width: 5.14286rem; height: 2.42857rem; line-height: 2.28571rem; text-align: center; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-badge-dday.svg") left top no-repeat; background-size: 5.14286rem, 2.42857rem; }

.contents-list-bundle .common-bundle-list .thumbnail-area .dday-area .dday { display: block; padding-right: 0.42857rem; font-size: 1rem; letter-spacing: -0.02rem; color: #fff; }

.contents-list-bundle .common-bundle-list .details-area .label-wrap { position: absolute; top: -0.85714rem; left: 1.42857rem; }

.contents-list-bundle .common-bundle-list .details-area .label-wrap img { display: inline-block; max-height: 2rem; }

.contents-list-bundle .common-bundle-list .details-area .badge-wrap { position: absolute; width: 7.14286rem; height: 3.57143rem; right: 0; top: -0.57143rem; padding: 0.57143rem 0.42857rem 0 0; color: #fff; text-align: center; z-index: 10; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-badge-percentage.svg") 0 0 no-repeat; background-size: 7.14286rem 3.57143rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.contents-list-bundle .common-bundle-list .details-area .badge-wrap .percentage { font-size: 1.14286rem; font-weight: 300; }

.contents-list-bundle .common-bundle-list .details-area .badge-wrap .percentage > strong { font-size: 1.42857rem; font-weight: 600; }

.contents-list-bundle .common-bundle-list .details-area .date-info { margin-top: 0.61429rem; font-size: 1rem; letter-spacing: -0.02rem; word-break: break-all; color: #888888; }

.contents-list-bundle .common-bundle-list.type01 .item .thumbnail { padding-bottom: 100%; }

.contents-list-bundle .common-bundle-list.type01 .item .details-area { margin-top: -4.28571rem; margin-right: 1.42857rem; }

.contents-list-bundle .common-bundle-list.type01 .item .details-area .details { padding-right: 3.57143rem; }

.contents-list-bundle .common-bundle-list.type01 .item .details-area .details.happy-jmt { padding-right: 30px; }

.contents-list-bundle .common-bundle-list.type01 .item .details-area .details.happy-jmt .title { display: block; display: -webkit-box; max-height: 2.8em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; white-space: inherit; }

.contents-list-bundle .common-bundle-list.type01 .item .details-area .title-wrap .title { padding-right: 1.57143rem; font-size: 1.42857rem; letter-spacing: -0.06857rem; font-weight: 600; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.contents-list-bundle .common-bundle-list.type01 .item .details-area .title-wrap .sub-txt { font-size: 1rem; line-height: 1.57143rem; letter-spacing: -0.03rem; }

.contents-list-bundle .common-bundle-list.type01.benefit .item .thumbnail { padding-bottom: 102%; }

.contents-list-bundle .common-bundle-list.type01.benefit .item .details-area { margin-top: -5.71429rem; }

.contents-list-bundle .common-bundle-list.type01.benefit .item .details-area .details { background-color: transparent; }

.contents-list-bundle .common-bundle-list.type01.benefit .item .details-area .title-wrap .title { padding-right: 30%; }

.contents-list-bundle .common-bundle-list.type02 .item .thumbnail { padding-bottom: 55.555%; }

.contents-list-bundle .common-bundle-list.type02 .item .details-area { margin-top: -2.85714rem; margin-right: 1.42857rem; }

.contents-list-bundle .common-bundle-list.type02 .item .details-area .details { padding-right: 1.42857rem; }

.contents-list-bundle .common-bundle-list.type02 .item .details-area .title-wrap .title { font-size: 1.57143rem; letter-spacing: -0.05714rem; line-height: 2.14286rem; font-weight: 600; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.contents-list-bundle .common-bundle-list.type02 .item .details-area .title-wrap .sub-txt { font-size: 1rem; line-height: 1.57143rem; letter-spacing: -0.02rem; }

.contents-list-bundle .common-bundle-list.type03 .item .thumbnail { padding-bottom: 52.222%; }

.contents-list-bundle .common-bundle-list.type03 .item .details-area .details { padding-right: 1.42857rem; }

.contents-list-bundle .common-bundle-list.type03 .item .details-area .title-wrap .title { font-size: 1.21429rem; letter-spacing: -0.02286rem; line-height: 1.57143rem; font-weight: 400; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.contents-list-bundle .common-bundle-list .product-versus-wrap { padding-bottom: 7.14286rem; }

.contents-list-bundle .story-bundle-list .link-area { display: block; }

.contents-list-bundle .story-bundle-list .story-thumbnail { position: relative; width: 100%; height: 0; padding-bottom: 103%; overflow: hidden; }

.contents-list-bundle .story-bundle-list .story-thumbnail .thumb-inner { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; }

.contents-list-bundle .story-bundle-list .post-list-wrap { position: absolute; left: 5%; bottom: 5%; z-index: 2; }


.contents-list-bundle-scroll, .contents-list-bundle-video { padding-bottom: 2.85714rem; }

.contents-list-bundle-scroll .common-bundle-list a, .contents-list-bundle-video .common-bundle-list a { display: block; }

.contents-list-bundle-scroll .common-bundle-list .thumbnail-area, .contents-list-bundle-video .common-bundle-list .thumbnail-area { position: relative; }

.contents-list-bundle-scroll .common-bundle-list .thumbnail-area .ico-video, .contents-list-bundle-video .common-bundle-list .thumbnail-area .ico-video { display: block; position: absolute; right: 1.14286rem; top: 1.14286rem; width: 2.85714rem; height: 2.85714rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-video.svg") left top no-repeat; background-size: 2.85714rem 2.85714rem; }

.contents-list-bundle-scroll .common-bundle-list .thumbnail, .contents-list-bundle-video .common-bundle-list .thumbnail { position: relative; overflow: hidden; }

.contents-list-bundle-scroll .common-bundle-list .details, .contents-list-bundle-video .common-bundle-list .details { padding-top: 1.42857rem; }

.contents-list-bundle-scroll .common-bundle-list .title-wrap .title, .contents-list-bundle-video .common-bundle-list .title-wrap .title { font-size: 1.21429rem; font-weight: 400; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.contents-list-bundle-scroll .common-bundle-list .title-wrap .sub-txt, .contents-list-bundle-video .common-bundle-list .title-wrap .sub-txt { margin-top: 8px; font-size: 1rem; color: #888888; }

.contents-list-bundle-scroll { padding-left: 1.42857rem; }

.contents-list-bundle-scroll.small .swiper-slide { width: 14.28571rem; }

.contents-list-bundle-scroll.small .thumbnail { padding-bottom: 60%; }

.contents-list-bundle-scroll.medium .swiper-slide { width: 20rem; }

.contents-list-bundle-scroll.medium .thumbnail { padding-bottom: 55.8%; }

.contents-list-bundle-video .thumbnail-area .ico-video { top: 1.42857rem; right: 1.42857rem; }

.contents-list-bundle-video .thumbnail { padding-bottom: 55.555%; }

.contents-list-bundle-video .details { padding-left: 1.42857rem; padding-right: 1.42857rem; }

.contents-list-bundle-video .video-group { padding: 1.42857rem; }

.buy-controller-dim { display: none; position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }

.buy-controller-wrap { position: relative; z-index: 50; }

.buy-controller-content { background-color: #fff; }

.buy-controller-content .buy-controller-body { display: none; }

.buy-controller-content .open-before { display: none; }

.buy-controller-content .open-after { display: block; }

.buy-controller-footer { padding: 0.57143rem; background-color: #f4f4f4; }

.buy-controller-footer .price-area { margin-bottom: 0.57143rem; text-align: right; font-weight: 600; font-size: 0.92857rem; }

.buy-controller-footer .price-area strong { display: inline-block; margin-left: 0.42857rem; font-family: "Roboto", "Apple SD Gothic Neo", "Pretendard Std", "Malgun Gothic", "돋움", Dotum, Helvetica, Arial, sans-serif; font-weight: bold; font-size: 1.71429rem; color: #222222; word-break: break-all; }

.buy-controller-layer { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 1000; border-top: 1px solid #ececec; background-color: #f4f4f4; }

.buy-controller-layer.open { background-color: #fff; }

.buy-controller-layer.open .btn-top-arrow { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-arrow-purple-down-23x13.png"); background-color: #fff; }

.buy-controller-layer.open .open-after { display: none; }

.buy-controller-layer.open .open-before { display: block; }

.buy-controller-layer.open .buy-controller-body { display: block; }

.buy-controller-layer.open .buy-controller-footer { border-top: 1px solid #ececec; }

.buy-controller-layer .btn-top-arrow { display: block; position: absolute; top: -1.42857rem; left: 50%; width: 4.28571rem; height: 1.42857rem; margin-left: -2.14286rem; z-index: 2; border-radius: 10px 10px 0 0; border: 1px solid #ececec; text-indent: -9999px; border-bottom: 0; background-color: #f4f4f4; background-repeat: no-repeat; background-position: 50% 50%; background-size: 0.85714rem 0.42857rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-arrow-purple-up-23x13.png"); -webkit-box-sizing: border-box; box-sizing: border-box; }

.buy-controller-body { padding: 1.14286rem; max-height: 24.71429rem; overflow: auto; -webkit-box-sizing: border-box; box-sizing: border-box; }

.buy-controller-body .select-option + .selected-item, .buy-controller-body .select-option + .select-option { margin-top: 0.57143rem; }

.buy-controller-body .selected-item + .select-option, .buy-controller-body .selected-item + .selected-item { margin-top: 0.57143rem; }

.buy-controller-body .selectric-wrapper + .selectric-wrapper, .buy-controller-body .selectric-wrapper + .selected-item, .buy-controller-body .selectric-wrapper + .selected-gift { margin-top: 0.57143rem; }

.buy-controller-body .selectric-wrapper.selectric-open .selectric { border-color: #222; }

.buy-controller-body .selectric-wrapper.selectric-open .selectric .button:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common-fix/ico-selectric-btn.png"); }

.buy-controller-body .item-box { position: relative; padding: 0.85714rem 1.14286rem 1.07143rem; border: 1px solid #e5e5e5; }

.buy-controller-body .item-box + .item-box, .buy-controller-body .item-box + .gift-box { margin-top: 0.57143rem; }

.buy-controller-body .item-box .item-info { padding-right: 2.5rem; letter-spacing: -0.025em; }

.buy-controller-body .item-box .item-name { font-size: 0.92857rem; word-break: break-all; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.buy-controller-body .item-box .item-gift { padding-left: 0.71429rem; font-size: 0.85714rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common-fix/ico-selectric-gift.png") no-repeat 0 50%; background-size: 0.42857rem 0.42857rem; }

.buy-controller-body .item-box .item-price { margin-top: 0.64286rem; }

.buy-controller-body .item-box .item-price:before, .buy-controller-body .item-box .item-price:after { content: ""; display: table; }

.buy-controller-body .item-box .item-price:after { clear: both; }

.buy-controller-body .item-box .item-price .spinner { float: left; }

.buy-controller-body .item-box .item-price .price { float: right; margin-top: 0.14286rem; font-weight: 600; font-size: 0.92857rem; }

.buy-controller-body .item-box .item-price .price strong { font-weight: bold; font-size: 1.28571rem; }

.buy-controller-body .item-box .btn-delete { position: absolute; top: 1.07143rem; right: 1.07143rem; }

.buy-controller-body .gift-box { display: table; table-layout: fixed; width: 100%; position: relative; padding: 0.85714rem 1.07143rem 1.07143rem; border: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.buy-controller-body .gift-box + .gift-box { margin-top: 0.57143rem; }

.buy-controller-body .gift-box .thumbnail { display: table-cell; vertical-align: middle; width: 4.28571rem; height: 4.28571rem; }

.buy-controller-body .gift-box .thumbnail .inner { position: relative; padding-bottom: 100%; border-radius: 5px; background-color: #f6f7fb; }

.buy-controller-body .gift-box .thumbnail img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.buy-controller-body .gift-box .detail { display: table-cell; vertical-align: middle; padding-left: 1.14286rem; }

.buy-controller-body .gift-box .gift-name { font-size: 0.85714rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; letter-spacing: -0.025em; }

.buy-controller-body .gift-box .modify-area { margin-top: 0.92857rem; }

.buy-controller-body .gift-box .modify-area:before, .buy-controller-body .gift-box .modify-area:after { content: ""; display: table; }

.buy-controller-body .gift-box .modify-area:after { clear: both; }

.buy-controller-body .gift-box .modify-area .spinner { float: left; }

.buy-controller-body .gift-box .modify-area .btn { float: right; min-width: 4.28571rem; margin-top: 0.21429rem; }

.common-board-content { position: relative; }
.event-content .common-board-content {padding-bottom: 3.571rem;}
.event-content .common-board-content + .common-comment-section {margin-top: 0;}

.common-board-content .share-floating { position: absolute; display: table; right: 1.42857rem; top: 1.42857rem; width: 2.85714rem; height: 2.85714rem; border-radius: 50%; background-color: #fff; text-align: center; }

.common-board-content .share-floating a { display: table-cell; vertical-align: middle; height: 100%; }

.common-board-content .share-floating img { display: block; margin: 0 auto; }

.common-board-content .list { position: relative; }

.common-board-content .list a { display: block; }

.common-board-content .list.end-list:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; background-color: rgba(255, 255, 255, 0.5); }

.common-board-content .list-thumb { position: relative; overflow: hidden; }

.common-board-content .detail { position: relative; }

.common-board-content .detail .label { position: absolute; top: -0.85714rem; left: 1.42857rem; }

.common-board-content .detail .label img { display: inline-block; max-height: 2rem; }

.common-board-content .title-area .title { font-size: 4.4444444vw; font-weight: 400; letter-spacing: -0.32px; display: block; display: -webkit-box; max-height: 13.8888889vw; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; word-break: break-all; color: #222222; }

.common-board-content .title-area .sub-title { margin-top: 0.28571rem; font-size: 1rem; font-weight: normal; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.common-board-content .title-area .sub-title.gray { color: #888888; }

.common-board-content .title-area .date { display: block; margin-top: 0.42857rem; font-size: 0.85714rem; color: #888888; }

.common-board-content .coupon-area { margin-top: 2.14286rem; }

.common-board-content .coupon-area .sub-title { font-size: 0.85714rem; color: #337bf6; font-weight: normal; }

.common-board-content .coupon-area .ticket { width: 6.71429rem; height: 2.71429rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-coupon.png") left top no-repeat; background-size: 6.71429rem 2.71429rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.common-board-content .coupon-area.after .sub-title { color: #888888; }

.common-board-content .coupon-area.after .ticket { width: 9.14286rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-coupon-after.png") left top no-repeat; background-size: 9.14286rem 2.71429rem; }

.common-board-content .sub-info { margin-top: 1.14286rem; }

.common-board-content .sub-info:before, .common-board-content .sub-info:after { content: ""; display: table; }

.common-board-content .sub-info:after { clear: both; }

.common-board-content .sub-info .date { display: inline-block; float: left; padding-top: 0.28571rem; font-size: 1rem; letter-spacing: -0.28px; word-break: break-all; color: #888888; }

.common-board-content .sub-info .date + .count { padding-left: 0.35714rem; color: #fe4f27; }

.common-board-content .sub-info .share { float: right; }

.common-board-content .sub-info .post-list-wrap { float: left; margin-top: 0; padding-top: 0.14286rem; }

.common-board-content .sub-info.bar .row .info { position: relative; }

.common-board-content .sub-info.bar .row .info + .info:after { content: ''; position: absolute; left: 0; top: 50%; width: 1px; height: 0.85714rem; margin-top: -0.35714rem; background-color: #666666; }

.common-board-content .sub-info .row + .row { margin-top: 0.42857rem; }

.common-board-content .sub-info .row .info { display: inline-block; font-size: 0.85714rem; font-weight: 400; color: #666666; }

.common-board-content .sub-info .row .info + .info { padding-left: 0.42857rem; }

.common-board-content .sub-info .row.price-row .info { color: #fe4f27; vertical-align: middle; }

.common-board-content .sub-info .row.price-row .price { font-size: 1.28571rem; font-weight: bold; }

.common-board-content .link-arrow { position: relative; }

.common-board-content .link-arrow:after { position: absolute; content: ''; width: 1.14286rem; height: 1.14286rem; right: 1.42857rem; top: 50%; margin-top: -0.57143rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-32x32.png") left top no-repeat; background-size: 1.14286rem 1.14286rem; }

.common-board-content .list-thumb-wrap { position: relative; padding-top: 0.28571rem; }

.common-board-content .count-area { display: table; table-layout: fixed; width: 5.14286rem; height: 2.42857rem; position: absolute; top: 0; right: 0; z-index: 2; text-align: center; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-badge-dday.svg"); background-size: 5.14286rem, 2.42857rem; background-position: 0 0; background-repeat: no-repeat; background-color: transparent; }

.common-board-content .count-area .count { display: table-cell; vertical-align: middle; padding: 0 0.42857rem 0.21429rem 0; font-size: 1rem; letter-spacing: -0.28px; color: #fff; }

.common-board-content .board-article { padding: 1.42857rem; }

.common-board-content .board-article + .board-article { padding-top: 0; }

.common-board-content .board-article img + img { margin-top: 0.35714rem; }

.common-board-content .board-hash-area { padding: 1.42857rem; padding-bottom: 2.85714rem; }

.common-board-content .board-hash-area span { display: inline-block; color: #888888; margin-right: 0.28571rem; }

.notice-board-list .list-thumb { padding-bottom: 55.555%; }

.notice-board-list .detail { padding: 1.42857rem; border-bottom: 1px solid #e5e5e5; }

.notice-board-list .list:last-child .detail { border-bottom: none; }

.notice-board-list.thumb-board-list .list .detail { border-bottom: none; padding-bottom: 2.85714rem; }

.notice-board-list.thumb-board-list .list:last-child .detail { padding-bottom: 1.42857rem; }

.culture-board-list .list { margin-top: 16px; padding-bottom: 1.14286rem; border-bottom: 1px solid #e5e5e5; }

.culture-board-list .list:first-child { margin-top: 2.28571rem; }

.culture-board-list .list-thumb { position: absolute; width: 8.57143rem; height: 10.71429rem; left: 0; top: 0; }

.culture-board-list .list-thumb img { width: auto; height: 100%; }

.culture-board-list .detail { min-height: 10.71429rem; margin-left: 10rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.culture-board-list .detail .sub-info { position: absolute; left: 0; bottom: 7%; }

.culture-board-list .title-area .title { font-weight: 600; }

.culture-board-list.half-size .list { padding-left: 1.42857rem; padding-right: 1.42857rem; }

.culture-board-list.half-size .list:first-child { margin-top: 1.42857rem; }

.culture-board-list.half-size .list-thumb { width: 11.42857rem; height: 14.28571rem; left: 1.42857rem; }

.culture-board-list.half-size .detail { min-height: 14.28571rem; margin-left: 12.85714rem; padding-top: 0.71429rem; }

.nearest-pagination { border-top: 1px solid #eee; }

.nearest-pagination .link-area { display: block; padding: 1.42857rem 2.14286rem 1.42857rem 1.42857rem; border-bottom: 1px solid #eee; -webkit-box-sizing: border-box; box-sizing: border-box; }

.nearest-pagination .link-area .type { float: left; width: 4.28571rem; margin-top: 0.07143rem; padding-right: 0.71429rem; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 1rem; letter-spacing: -0.24px; color: #888888; word-break: break-all; }

.nearest-pagination .link-area .title { float: none; overflow: hidden; font-size: 1.14286rem; letter-spacing: -0.32px; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.common-comment-section { margin-top: 2.85714rem; padding-bottom: 3.42857rem;}

.common-comment-section .fieldset .btn-group { margin-top: 0; }

.common-comment-section .comment-list-wrap .comment-list:first-child { border-top: none; }

/* 2020.12.09 더보기 하단 여백 삭제 */
/*.common-comment-section .comment-list-wrap  + .btn-group { padding-bottom: 3.42857rem;}*/

.common-comment-section .comment-list-wrap .comment-list + .comment-list { border-top: 1px solid #ddd; }

.comment-default-wrap { padding: 0 1.42857rem; }

.comment-default-wrap .counting-area { font-size: 1rem; }

.comment-default-wrap .counting-area .count { font-size: 0.85714rem; font-weight: bold; letter-spacing: -0.24px; }

.comment-default-wrap .write-module-box { margin-top: 0.71429rem; }

.comment-sorting-wrap { margin: 0 1.42857rem; padding: 2.28571rem 0 0.85714rem; border-bottom: 1px solid #dddddd; }

.comment-sorting-wrap:before, .comment-sorting-wrap:after { content: ""; display: table; }

.comment-sorting-wrap:after { clear: both; }

.comment-sorting-wrap .sorting-area { position: relative; float: left; }

.comment-sorting-wrap .sorting-area input[type="radio"] { position: absolute; top: 0; left: 0; z-index: 1; opacity: 0; width: 100%; height: 100%; }

.comment-sorting-wrap .sorting-area input[type="radio"]:checked + label { color: #222222; font-weight: bold; }

.comment-sorting-wrap .sorting-area label { font-size: 1rem; letter-spacing: -0.28px; color: #888888; }

.comment-sorting-wrap .sorting-area + .sorting-area { position: relative; margin-left: 25px; }

.comment-sorting-wrap .sorting-area + .sorting-area:before { position: absolute; content: ''; top: 50%; margin-top: -0.42857rem; left: -0.85714rem; width: 1px; height: 0.85714rem; background-color: #dddddd; }

.comment-wrap { padding: 0 1.42857rem; }

.comment-wrap .edit-control-wrap { display: none; }

.comment-wrap.mycomment { background-color: rgba(51, 123, 246, 0.05); }

.comment-wrap.mycomment .comment-head { position: relative; padding-right: 2.14286rem; }

.comment-wrap.mycomment .edit-control-wrap { display: block; position: absolute; z-index: 2; top: -0.42857rem; right: -0.35714rem; }

.comment-wrap.mycomment .edit-control-wrap .edit-control-area { display: none; position: absolute; top: 100%; right: 0.71429rem; z-index: 3; margin-top: 0.71429rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.comment-wrap.mycomment .edit-control-wrap .edit-control-area:before { position: absolute; content: ''; top: -10px; right: 0; width: 0; height: 0; border-top: 12px solid transparent; border-right: 12px solid #000; -webkit-box-sizing: border-box; box-sizing: border-box; }

.comment-wrap.mycomment .edit-control-wrap .edit-control-area:after { position: absolute; content: ''; top: -8px; right: 1px; z-index: 4; width: 0; height: 0; border-top: 12px solid transparent; border-right: 12px solid #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.comment-wrap.mycomment .edit-control-wrap .edit-control-area .btn { display: block; min-width: 80px; background-color: #fff; border-radius: 0.28571rem 0 0 0; }

.comment-wrap.mycomment .edit-control-wrap .edit-control-area .btn + .btn { border-top: 0; border-radius: 0 0 0.28571rem 0.28571rem; }

.comment-wrap.mycomment .edit-control-wrap .edit-control-area.on { display: block; }

.comment-wrap.remove .comment-body .text { color: #bbbbbb; }

.comment-wrap .comment-area { position: relative; padding: 1.42857rem 0; }

.comment-wrap .comment-area .close-btn-area { display: block; position: absolute; right: 0; }

.comment-wrap .comment-area .close-btn-area .close { border: 0; outline: 0; background-color: transparent; color: #888888; }

.comment-wrap .comment-area .comment-head { -webkit-box-sizing: border-box; box-sizing: border-box; }

.comment-wrap .comment-area .comment-head .register-info-wrap .info { display: inline-block; margin-right: 0.57143rem; font-size: 0.85714rem; letter-spacing: -0.24px; color: #888888; }

.comment-wrap .comment-area .comment-body { margin-top: 0.71429rem; }

.comment-wrap .comment-area .comment-body .text { font-size: 1rem; letter-spacing: -0.28px; word-break: break-all; }

.comment-wrap .comment-area .comment-control { margin-top: 10px; }

.comment-wrap .comment-area .comment-control:before, .comment-wrap .comment-area .comment-control:after { content: ""; display: table; }

.comment-wrap .comment-area .comment-control:after { clear: both; }

.comment-wrap .comment-area .comment-control .btn-area { float: left; }

.comment-wrap .comment-area .comment-control .btn-area .btn-text { font-size: 0.85714rem; color: #888888; border: none; background-color: transparent; }

.comment-wrap .comment-area .comment-control .post-list-wrap { float: right; margin-top: 0; }

.comment-wrap .comment-area .comment-control .post-list-wrap .post-list { font-size: 0.85714rem; }

.comment-wrap .comment-area .comment-control .post-list-wrap .post-list i { margin-top: -0.14286rem; margin-right: 0; }

.recomment-list-wrap .comment-wrap { background-color: #f5f5f5; }

.recomment-list-wrap .comment-wrap.writing .close-btn-area { top: 1.14286rem; right: -0.28571rem; }

.recomment-list-wrap .comment-wrap.writing .comment-area { padding-top: 2rem; }

.recomment-list-wrap .comment-wrap.writing .write-area { height: 4.28571rem; }

.recomment-list-wrap .comment-wrap.writing + .comment-wrap .comment-area { border-top: none; }

.recomment-list-wrap .recomment-list .comment-wrap:first-child .comment-area { padding-top: 0; }

.recomment-list-wrap .recomment-list .comment-wrap + .comment-wrap .comment-area { border-top: 1px solid #dddddd; }

.recomment-list-wrap .comment-area .comment-body .text { position: relative; padding-left: 1.14286rem; }

.recomment-list-wrap .comment-area .comment-body .text:before { position: absolute; content: ''; top: 0.28571rem; left: 0; width: 0.57143rem; height: 0.57143rem; border-left: 2px solid #666666; border-bottom: 2px solid #666666; -webkit-box-sizing: border-box; box-sizing: border-box; }

.recomment-list-wrap + .btn-more { border-top: 1px solid #dddddd; background-color: #f5f5f5; }

.result-empty-wrap { padding: 5.71429rem 0; text-align: center; }

.result-empty-wrap .empty-ico img { display: block; margin: 0 auto; }

.result-empty-wrap .empty-title, .result-empty-wrap .empty-txt { padding: 0 16px; word-break: break-all; }

.result-empty-wrap .empty-title { margin-top: 0.71429rem; font-size: 1.14286rem; font-weight: 400; color: #888888; }

.swiper-container.swiper-container-horizontal .swiper-pagination { display: table; width: auto; position: static; margin: 1.14286rem auto 0; }

.swiper-container.swiper-container-horizontal .swiper-pagination-bullet { display: inline-block; }

.swiper-container.swiper-container-horizontal .swiper-scrollbar { display: block; position: static; width: 91%; left: 0; height: 0.07143rem; margin: 1.42857rem auto 0; }

.swiper-container.swiper-container-horizontal .swiper-scrollbar .swiper-scrollbar-drag { height: 0.14286rem; bottom: 0.07143rem; top: auto; background: #fe4f27; }

.swiper-container .swiper-pagination .swiper-pagination-bullet { opacity: 1; display: inline-block; width: 0.42857rem; height: 0.42857rem; background: #fff; }

.swiper-container .swiper-pagination .swiper-pagination-bullet-active { background: #111; }

.swiper-container .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 0.42857rem; }

.swiper-container .swiper-pagination.gray .swiper-pagination-bullet { background: #e5e5e5; }

.swiper-container .swiper-pagination.gray .swiper-pagination-bullet-active { background: #111; }

.slider-number-paging { position: absolute; z-index: 3; min-width: 4.07143rem; height: 1.71429rem; padding: 0 0.35714rem; line-height: 1.57143rem; text-align: center; border: 1px solid #000; border-radius: 30px; background-color: rgba(255, 255, 255, 0.35); -webkit-box-sizing: border-box; box-sizing: border-box; }

.slider-number-paging a { display: block; }

.slider-number-paging .paging { display: inline-block; padding-right: 0.71429rem; letter-spacing: 0.05em; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common-fix/ico-spinner-plus.png") no-repeat 100% 50%; background-size: 0.5rem 0.5rem; }

.slider-number-paging .paging > span { display: block; float: left; font-weight: 600; font-size: 0.85714rem; }

.slider-number-paging.primary { position: static; margin: 0.71429rem auto 0; text-align: center; border: 0; padding: 0; }

.slider-number-paging.primary .paging { padding-right: 0; background: none; }

.culture-main-slider .detail-wrap { position: relative; height: 14.28571rem; }

.culture-main-slider .detail-wrap img { max-width: 100%; }

.culture-main-slider.swiper-container .swiper-pagination { position: absolute; left: 1.42857rem; bottom: 1.78571rem; }

.culture-main-slider.swiper-container .swiper-pagination .swiper-pagination-bullet { margin: 0 2px; opacity: 0.3; }

.culture-main-slider.swiper-container .swiper-pagination .swiper-pagination-bullet-active { background: #fff; opacity: 1; }

.culture-invite-slider .swiper-slide { width: 11.42857rem; height: 14.28571rem; background-size: cover; background-position: center center; -webkit-box-shadow: 0 0.85714rem 1.71429rem rgba(0, 0, 0, 0.2); box-shadow: 0 0.85714rem 1.71429rem rgba(0, 0, 0, 0.2); }

.culture-cast-slider { padding-left: 1.42857rem; }

.culture-cast-slider .swiper-slide { width: 7.85714rem; }

.culture-cast-slider .swiper-slide .thumbnail { width: 7.85714rem; height: 7.85714rem; position: relative; overflow: hidden; border-radius: 50%; }

.culture-cast-slider .swiper-slide .detail { margin-top: 0.71429rem; text-align: center; }

.culture-cast-slider .swiper-slide .detail .role-txt, .culture-cast-slider .swiper-slide .detail .name-txt { padding-top: 0.28571rem; }

.swiper-container.popup-img-banner-slider .swiper-button-prev, .swiper-container.popup-full-banner-slider .swiper-button-prev { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); left: 1.42857rem; }

.swiper-container.popup-img-banner-slider .swiper-button-next, .swiper-container.popup-full-banner-slider .swiper-button-next { right: 1.42857rem; }

.swiper-container.popup-img-banner-slider .swiper-button-prev, .swiper-container.popup-img-banner-slider .swiper-button-next, .swiper-container.popup-full-banner-slider .swiper-button-prev, .swiper-container.popup-full-banner-slider .swiper-button-next { width: 1.42857rem; height: 2.42857rem; margin-top: -0.71429rem; background-size: 1.42857rem 2.42857rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-right-20x34.svg"); }

.swiper-container.popup-img-banner-slider.swiper-container-horizontal .swiper-pagination, .swiper-container.popup-full-banner-slider.swiper-container-horizontal .swiper-pagination { display: block; position: absolute; width: auto; height: 0.42857rem; right: 1.42857rem; top: 1.42857rem; bottom: auto; left: auto; margin: 0; }

.swiper-container.popup-img-banner-slider.swiper-container-horizontal .swiper-pagination .swiper-pagination-bullet, .swiper-container.popup-full-banner-slider.swiper-container-horizontal .swiper-pagination .swiper-pagination-bullet { margin: 0 0.14286rem; opacity: 0.5; border-radius: 50%; background-color: #222222; }

.swiper-container.popup-img-banner-slider.swiper-container-horizontal .swiper-pagination .swiper-pagination-bullet-active, .swiper-container.popup-full-banner-slider.swiper-container-horizontal .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; background-color: #fe4f27; }

.swiper-container.popup-full-banner-slider { height: 100%; }

.swiper-container.benefits-plus-slider { padding-bottom: 2.7777778vw; }

.swiper-container.benefits-plus-slider .swiper-pagination { position: absolute; display: block; width: 100%; bottom: 0.07143rem; margin: 0; font-size: 0; }

.swiper-container.benefits-plus-slider .swiper-pagination .swiper-pagination-bullet { margin: 0 0.14286rem; border-radius: 50%; background-color: rgba(34, 34, 34, 0.5); }

.swiper-container.benefits-plus-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fe4f27; }

.payment-means-select:before, .payment-means-select:after { content: ""; display: table; }

.payment-means-select:after { clear: both; }

.payment-means-select li { position: relative; float: left; width: 33.33%; height: 110px; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.payment-means-select li:nth-child(3n+1) { border-left: 1px solid #e5e5e5; }

.payment-means-select li:nth-child(n+4) { border-top: 0; }

.payment-means-select li input[type="radio"] { position: absolute; z-index: 2; top: 0; left: 0; opacity: 0; width: 100%; height: 100%; }

.payment-means-select li input[type="radio"]:checked + label:after { display: block; }

.payment-means-select li > label { position: relative; display: block; width: 100%; height: 100%; }

.payment-means-select li > label:after { display: none; position: absolute; content: ''; width: 100%; height: 100%; top: -1px; left: -1px; border: 1px solid #222222; }

.payment-means-select li img { display: block; margin: 0 auto; width: 4.64286rem; height: 3.57143rem; }

.payment-means-select .payment-type { margin-top: 0.5rem; display: block; text-align: center; font-size: 0.85714rem; letter-spacing: -0.025em; word-break: break-all; }

.partner-company-wrap { margin-top: 0.71429rem; }

.partner-company-wrap .logo-area { position: relative; display: inline-block; width: 2.28571rem; height: 2.28571rem; overflow: hidden; border-radius: 50%; border: 1px solid #bbbbbb; vertical-align: middle; }

.partner-company-wrap .partner { display: inline-block; vertical-align: middle; margin: 0 0.57143rem; font-weight: 600; }

.post-list-wrap { margin-top: 1.42857rem; }

.post-list-wrap .post-list { color: #888888; font-size: 1rem; font-weight: 400; border: none; background: transparent; outline: 0; }

.post-list-wrap .post-list + .post-list { margin-left: 1.28571rem; }

.post-list-wrap .post-list i { width: 1.42857rem; height: 1.42857rem; display: inline-block; margin-right: 0.42857rem; vertical-align: top; }

.post-list-wrap .post-list .view { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-view.svg") center center no-repeat; background-size: cover; }

.post-list-wrap .post-list .like { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like-on.svg") center center no-repeat; background-size: cover; }

.post-list-wrap .post-list .like.on { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like-on.svg"); -webkit-animation: heartIn 0.6s ease-in 1 alternate; animation: heartIn 0.6s ease-in 1 alternate; }

.post-list-wrap .post-list .like.off { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like.svg"); }

.post-list-wrap .post-list .talk { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-talk.svg") center center no-repeat; background-size: cover; }

.post-list-wrap .post-list .number { display: inline-block; line-height: 1.57143rem; vertical-align: top; }

@-webkit-keyframes heartIn { 0%, 100% { -webkit-transform: scale(1); transform: scale(1);
    -webkit-transform-origin: center 44%;
    transform-origin: center 44%; }
    25% { -webkit-transform: scale(0.4); transform: scale(0.4); }
    50% { -webkit-transform: scale(1.8); transform: scale(1.8); }
    75% { -webkit-transform: scale(0.4); transform: scale(0.4); } }

@keyframes heartIn { 0%, 100% { -webkit-transform: scale(1); transform: scale(1);
    -webkit-transform-origin: center 44%;
    transform-origin: center 44%; }
    25% { -webkit-transform: scale(0.4); transform: scale(0.4); }
    50% { -webkit-transform: scale(1.8); transform: scale(1.8); }
    75% { -webkit-transform: scale(0.4); transform: scale(0.4); } }

.attach-item-wrap .item-bundle { padding-bottom: 1.42857rem; }

.attach-item-wrap .item-bundle + .item-bundle { padding: 1.28571rem 0 0.85714rem; border-top: 1px solid #e5e5e5; }

.attach-item-wrap .item-bundle .human { width: 1.42857rem; height: 1.42857rem; display: inline-block; margin-right: 0.28571rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-human.svg") center center no-repeat; background-size: 1.71429rem 1.71429rem; vertical-align: bottom; }

.attach-item-wrap .item-bundle .em + .em { margin-left: 0.28571rem; }

.attach-item-wrap .item-bundle .em.slightly { color: #666666; }

.attach-item-wrap .item-bundle .em.normal { font-weight: 600; }

.attach-item-wrap .item-bundle .brand-logo-area img { margin: 0; }

.new-bullet { width: 1.28571rem; height: 1.28571rem; display: inline-block; margin-top: -0.14286rem; margin-right: 0.28571rem; vertical-align: middle; }

.accumulate-wrap { margin-top: 0.71429rem; }

.accumulate-wrap .em, .accumulate-wrap .point { display: inline-block; margin-right: 0.14286rem; vertical-align: middle; }

.accumulate-wrap .point { height: 1.57143rem; line-height: 1.57143rem; padding: 0 0.71429rem; color: #fe4f27; font-size: 0.85714rem; border: 1px solid #fe4f27; border-radius: 1.57143rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

#lottieAni { position: fixed; left: 50%; top: 50%; z-index: 2000; display: none; width: 14.28571rem; height: 14.28571rem; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.event-caution-wrap img { display: block; max-width: 100%; margin: 0 auto; }

.yapbeacon-brand-wrap { padding: 1.42857rem; border-bottom: 1px solid #e5e5e5; }

.yapbeacon-brand-wrap .logo-img-area { height: 2rem; }

.yapbeacon-brand-wrap .logo-img-area img { display: block; margin: 0 auto; max-width: 100%; height: 100%; }

.yapbeacon-brand-wrap .store-name { margin: 0.28571rem; font-weight: 600; font-size: 1.42857rem; text-align: center; }

.yapbeacon-barcode-wrap { padding: 2.85714rem 1.42857rem; border-bottom: 1px solid #e5e5e5; }

.yapbeacon-barcode-wrap .point-info-wrap { text-align: center; }

.yapbeacon-barcode-wrap .point-info-wrap .info { display: inline-block; position: relative; padding-left: 1.57143rem; font-weight: 600; font-size: 1rem; word-break: break-all; }

.yapbeacon-barcode-wrap .point-info-wrap .info:before { display: inline-block; position: absolute; content: ''; top: 50%; margin-top: -0.71429rem; left: 0; width: 1.42857rem; height: 1.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-point.png") 0 0 no-repeat; background-size: 1.42857rem; }

.yapbeacon-barcode-wrap .barcode-area { margin-top: 1.71429rem; text-align: center; }

.yapbeacon-barcode-wrap .barcode-area .img-area img { display: block; margin: 0 auto; max-width: 66%; }

.yapbeacon-barcode-wrap .barcode-area .code-num { margin-top: 0.57143rem; font-weight: 600; font-size: 0.85714rem; letter-spacing: 0.051em; }

.yapbeacon-barcode-wrap .btn-group { margin-top: 2.28571rem; }

.yapbeacon-barcode-wrap .btn-group span { display: inline-block; vertical-align: middle; }

.yapbeacon-barcode-wrap .btn-group .ico { display: inline-block; width: 1.42857rem; height: 1.42857rem; overflow: hidden; text-indent: -9999px; vertical-align: middle; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-store.png") 0 0 no-repeat; background-size: 1.42857rem; }

.yapbeacon-barcode-wrap .sub-info { margin-top: 0.71429rem; font-size: 0.85714rem; text-align: center; color: #888888; word-break: break-all; }

.common-banner-section a { display: block; width: 100%; height: 100%; }

.common-banner-section img { display: block; width: 100%; max-width: 100%; }

.setting-page-content .set-box-wrap { padding: 1.42857rem; }

.setting-page-content .set-box-wrap:before, .setting-page-content .set-box-wrap:after { content: ""; display: table; }

.setting-page-content .set-box-wrap:after { clear: both; }

.setting-page-content .set-box-wrap + .set-box-wrap { border-top: 1px solid #e5e5e5; }

.setting-page-content .set-bg-box { padding: 0.71429rem 1.42857rem; background-color: #f5f5f5; }

.setting-page-content .set-bg-box:before, .setting-page-content .set-bg-box:after { content: ""; display: table; }

.setting-page-content .set-bg-box:after { clear: both; }

.setting-page-content .set-bg-box .set-title { font-size: 1rem; color: #888888; }

.setting-page-content .set-box-area { position: relative; }

.setting-page-content .set-box-area > .link { display: block; }

.setting-page-content .brand-box-area { margin-top: 1.42857rem; }

.setting-page-content .brand-box-area .btn-group { margin-top: 0.71429rem; }

.setting-page-content .logout-user { font-size: 1.14286rem; font-weight: normal; color: #fe4f27; }

.setting-page-content .logout-btn { position: absolute; right: 0; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); color: #666666; /* width: 2rem; height: 2rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-logout-btn.png") center center no-repeat; background-size: 2.42857rem 2.42857rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; */ }

.setting-page-content .set-title { font-size: 1.14286rem; line-height: 1.71429rem; font-weight: normal; color: #222222; }

.setting-page-content .setting-wrap { position: absolute; right: 0; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); }

.setting-page-content .setting-wrap.btn-arrow .ico.right { overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.setting-page-content .set-sub { margin-top: 0.28571rem; font-size: 0.85714rem; color: #888888; }

.setting-page-content .form-switch-wrap .onoff { display: none; }

.setting-page-content .form-switch-wrap .form-switch { padding: 0; }

.setting-page-content .set-ver-txt { position: absolute; right: 0; top: 0; }

.setting-page-content .sns-connecting { margin-top: 1.42857rem; }

.setting-page-content .sns-connecting li { position: relative; }

.setting-page-content .sns-connecting li + li { margin-top: 1.14286rem; }

.setting-page-content .sns-connecting li.on .connet { color: #fe4f27; }

/*
.setting-page-content .sns-connecting li.on .sns-item.facebook:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-facebook-on.png"); background-size: 2rem 2rem; }

.setting-page-content .sns-connecting li.on .sns-item.naver:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-naver-on.png"); background-size: 2rem 2rem; }

.setting-page-content .sns-connecting li.on .sns-item.kakao:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-kakao-on.png"); background-size: 2rem 2rem; }

.setting-page-content .sns-connecting li.on .sns-item.apple:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-apple-on.png"); background-size: 2rem 2rem; }
*/

.setting-page-content .sns-connecting li.on .sns-item.facebook .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-facebook-on.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li.on .sns-item.naver .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-naver-on.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li.on .sns-item.kakao .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-kakao-on.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li.on .sns-item.apple .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-apple-on.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li .sns-item { position: relative; height: 2rem; line-height: 2rem; font-size: 1rem; color: #666666; }

/*.setting-page-content .sns-connecting li .sns-item:after { position: absolute; content: ''; left: 0; top: 0; width: 2rem; height: 2rem; background-position: center center; background-color: transparent; background-repeat: no-repeat; }*/

.setting-page-content .sns-connecting li .sns-item .logo {}

/*
.setting-page-content .sns-connecting li .sns-item.facebook:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-facebook.png"); background-size: 2rem 2rem; }

.setting-page-content .sns-connecting li .sns-item.naver:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-naver.png"); background-size: 2rem 2rem; }

.setting-page-content .sns-connecting li .sns-item.kakao:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-kakao.png"); background-size: 2rem 2rem; }

.setting-page-content .sns-connecting li .sns-item.apple:after { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-apple.png"); background-size: 2rem 2rem; }
*/

.setting-page-content .sns-connecting li .sns-item.facebook .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-facebook.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li .sns-item.naver .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-naver.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li .sns-item.kakao .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-kakao.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li .sns-item.apple .logo { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/etc/ico-sns-apple.png"); background-size: 2rem 2rem; margin-right: 0.714rem}

.setting-page-content .sns-connecting li .connet { position: absolute; right: 0; top: 0; padding-right: 1.42857rem; font-size: 1rem; color: #666666; line-height: 2rem; }

.setting-page-content .sns-connecting li .connet:before { content: ''; position: absolute; right: 0; top: 50%; width: 1.14286rem; height: 1.14286rem; margin-top: -0.57143rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-32x32.png") center center no-repeat; background-size: 1.14286rem 1.14286rem; }

.setting-page-content .set-info-wrap { margin-top: 1rem; padding: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #f5f5f5; }

.setting-page-content .set-info-wrap .slightly-info { margin-top: 4px; font-size: 0.85714rem; color: #bbbbbb; }

.setting-page-content .set-info-wrap .description-list dt, .setting-page-content .set-info-wrap .description-list dd { font-size: 0.85714rem; color: #666666; }

.setting-page-content .set-info-wrap .description-list dl + dl { margin-top: 0.42857rem; }

.setting-page-content .set-info-wrap .description-list dt { position: absolute; left: 0; font-weight: bold; }

.setting-page-content .set-info-wrap .description-list dt.wide-txt { letter-spacing: 1.42857rem; }

.setting-page-content .set-info-wrap .description-list dd { width: 80%; padding-left: 20%; }

.setting-page-content .set-agree-wrap { position: relative; margin-top: 1.71429rem; }

.setting-page-content .set-agree-wrap .set-agree-title { padding-bottom: 0.28571rem; font-size: 0.85714rem; font-weight: normal; color: #666666; }

.setting-page-content .set-agree-wrap .selector-wrap.horizontal { position: absolute; right: 0; top: 0; }

.setting-page-content .set-agree-wrap .btn-group { margin-bottom: 1.42857rem; }

.main-content .section-parts.main { padding-bottom: 2.85714rem; }

.main-content .section-parts.happy-more { margin-top: 1.42857rem; padding: 4.28571rem 0; background-color: #f7f7f7; text-align: center; }

.main-content .section-parts.happy-more .title { font-size: 1.85714rem; font-weight: 600; }

.main-content .section-parts.video-slider .detail .title { margin-top: 1.14286rem; }

.main-content .section-parts.order-status .status-area { padding: 0 1.42857rem; }

.main-content .section-parts.order-status .btn-group { padding: 1.42857rem 0; }

.main-content .section-parts.order-status .btn-group .btn { float: left; width: calc(50% - 4px); margin-right: 4px; }

.main-content .section-parts.order-status .btn-group .btn:last-child { margin-left: 4px; margin-right: 0; }

.main-content .main-parts.menu-list { padding: 1.42857rem 0; border-bottom: 1px solid #e5e5e5; }

.main-content .main-parts.menu-list:before, .main-content .main-parts.menu-list:after { content: ""; display: table; }

.main-content .main-parts.menu-list:after { clear: both; }

.main-content .main-parts.menu-list li { float: left; width: 25%; text-align: center; margin: 0.71429rem 0; }

.main-content .main-parts.menu-list li a { position: relative; display: block; padding-top: 3.28571rem; font-size: 0.85714rem; color: #666666; }

.main-content .main-parts.menu-list li a:after { position: absolute; content: ''; width: 2.85714rem; height: 2.85714rem; top: 0; left: 50%; margin-left: -1.42857rem; background-color: #f00; }

.main-content .main-parts.culture-list { text-align: center; }

.main-content .main-parts.culture-list:before, .main-content .main-parts.culture-list:after { content: ""; display: table; }

.main-content .main-parts.culture-list:after { clear: both; }

.main-content .main-parts.culture-list li { width: 33.3333%; float: left; margin-top: 1.42857rem; }

.main-content .main-parts.culture-list li a { display: block; }

.main-content .main-parts.culture-list li .item { position: relative; overflow: hidden; width: 5rem; height: 5rem; margin: 0 auto; border-radius: 50%; }

.main-content .main-parts.happy-list { margin: 0 2.78571rem; padding-top: 2.85714rem; }

.main-content .main-parts.happy-list:before, .main-content .main-parts.happy-list:after { content: ""; display: table; }

.main-content .main-parts.happy-list:after { clear: both; }

.main-content .main-parts.happy-list li { float: left; width: 50%; text-align: center; }

.main-content .main-parts.happy-list li .ico { display: block; width: 7.14286rem; height: 7.14286rem; margin: 0 auto 0.85714rem; border-radius: 50%; background-color: #f00; }

.main-content .main-parts.happy-list li a { display: block; font-size: 1.14286rem; color: #222222; }

.main-content .main-parts.like-store-list .list { position: relative; margin-left: 3.57143rem; padding-right: 5rem; margin-top: 1.57143rem; padding-bottom: 1.42857rem; border-bottom: 1px solid #e5e5e5; }

.main-content .main-parts.like-store-list .list a { display: block; }

.main-content .main-parts.like-store-list .list:first-child { margin-top: 0.85714rem; }

.main-content .main-parts.like-store-list .list:last-child { border-bottom: 0; }

.main-content .main-parts.like-store-list .list .ico-map { position: absolute; width: 1.71429rem; height: 1.71429rem; top: 0; left: -2.42857rem; background-color: #f00; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.main-content .main-parts.like-store-list .list .km { position: absolute; right: 1.42857rem; top: 0; font-size: 1.14286rem; color: #fe4f27; }

.main-content .main-parts.like-store-list .list .store-name { font-size: 1.28571rem; word-break: break-all; }

.main-content .main-parts.like-store-list .list .store-address, .main-content .main-parts.like-store-list .list .store-num { font-size: 1.14286rem; color: #666666; word-break: break-all; }

.main-content .main-parts.like-store-list .list .store-address { margin-top: 0.71429rem; }

.main-content .main-parts.like-store-list .list .store-num { margin-top: 0.28571rem; }

.main-content .main-parts.happy-story-list .item { position: relative; padding-bottom: 6.64286rem; }

.main-content .main-parts.happy-story-list .item .item-thumb { position: relative; min-height: 20rem; overflow: hidden; }

.main-content .main-parts.happy-story-list .item .item-detail { position: absolute; left: 0; bottom: 0; padding-left: 1.42857rem; margin-right: 1.42857rem; height: 10.92857rem; background-color: #fff; }

.main-content .main-parts.happy-story-list .item .badge-wrap { position: absolute; width: 100%; left: 0; top: -0.85714rem; padding: 0 18px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.main-content .main-parts.happy-story-list .item .title-wrap { padding-right: 1.42857rem; }

.main-content .main-parts.happy-story-list .item .title-wrap .title { font-size: 1.42857rem; letter-spacing: -0.04286rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.main-content .main-parts.happy-story-list .item .title-wrap .sub-txt { font-size: 1rem; color: #666666; letter-spacing: -0.03rem; }

.main-content .main-parts.my-history-list { padding-bottom: 1.42857rem; }

.main-content .main-parts.my-history-list .list { position: relative; height: 3.57143rem; line-height: 3.57143rem; padding-left: 1.42857rem; padding-right: 1.07143rem; }

.main-content .main-parts.my-history-list .list a { display: block; }

.main-content .main-parts.my-history-list .list .list-area { position: relative; padding-left: 2.5rem; padding-right: 1.5rem; }

.main-content .main-parts.my-history-list .list .list-area:before, .main-content .main-parts.my-history-list .list .list-area:after { content: ""; display: table; }

.main-content .main-parts.my-history-list .list .list-area:after { clear: both; }

.main-content .main-parts.my-history-list .list .list-area:after { position: absolute; content: ''; right: 0; top: 50%; margin-top: -0.57143rem; width: 16px; height: 16px; background-color: #f00; }

.main-content .main-parts.my-history-list .list .list-area .ico { position: absolute; left: 0; top: 50%; margin-top: -0.85714rem; width: 1.71429rem; height: 1.71429rem; background-color: #f00; }

.main-content .main-parts.my-history-list .list .list-area .setting { float: right; }

.main-content .common-banner-wrap.advertise { margin-top: 1.42857rem; }

.main-content .details-tab .tab li { text-align: center; }

.main-content .details-tab .tab li .title { display: inline-block; color: #666666; font-size: 1rem; letter-spacing: -0.05rem; }

.main-content .details-tab .tab li .count { display: block; color: #222222; font-size: 1.42857rem; }

.main-content .details-tab .tab li.on { position: relative; }

.main-content .details-tab.story-detail .tab li { padding-bottom: 1.42857rem; }

.main-content .details-tab.story-detail .tab li .count { margin-top: 0.28571rem; }

.main-content .details-tab.story-detail .tab li.on:after { position: absolute; content: ''; width: 6px; height: 6px; left: 50%; margin-left: -0.21429rem; bottom: 0.85714rem; background-color: #fe4f27; border-radius: 50%; }

.main-content .details-tab.story-detail .tab li.on .title, .main-content .details-tab.story-detail .tab li.on .count { color: #fe4f27; }

.main-content .details-tab.member-detail .tab li .title, .main-content .details-tab.member-detail .tab li .count { color: #fff; }

.main-content .details-tab.member-detail .tab li.on .title { position: relative; }

.main-content .details-tab.member-detail .tab li.on .title:after { position: absolute; content: ''; right: -0.71429rem; top: 0; width: 0.42857rem; height: 0.42857rem; background-color: #fe4f27; border-radius: 50%; }

.main-content .details-tab.benefit-detail { background-color: #fff; border-radius: 0.28571rem; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.08); box-shadow: 0 0 30px rgba(0, 0, 0, 0.08); }

.main-content .details-tab.benefit-detail li { height: 7.28571rem; }

.main-content .details-tab.benefit-detail li span { color: #222222; }

.main-content .details-tab.benefit-detail li .ico { display: block; margin: 0 auto 0.35714rem; width: 2.85714rem; height: 2.85714rem; background-color: #f00; }

.main-content .details-tab.benefit-detail a { height: 100%; }

.main-content .order-detail-btn-group { padding: 1.42857rem 16px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.main-content .order-detail-btn-group .btn { float: left; width: calc(50% - 8px); margin: 0 4px; }

.main-content .membership-details { margin-bottom: 2.14286rem; text-align: center; color: #fff; }

.main-content .membership-details .membership-inner { position: relative; margin: 0 1.42857rem; padding-bottom: 5.71429rem; }

.main-content .membership-details .wellcome { font-size: 1.71429rem; letter-spacing: -0.03429rem; font-weight: 300; }

.main-content .membership-details .wellcome strong { font-weight: 600; }

.main-content .membership-details .member-detail { margin-top: 2.85714rem; }

.main-content .membership-details .benefit-detail { position: absolute; bottom: -3.57143rem; left: 0; width: 100%; }

.main-content .culture-category .title { padding: 0 1.42857rem; font-size: 1.14286rem; font-weight: 600; }

.member-content .member-form-wrap .login-selector { margin-top: 1.42857rem; }

.member-content .member-form-wrap .login-btn { margin-top: 1.42857rem; }

.member-content .member-form-wrap .logo-happypoint { padding: 1.42857rem 0; }

.member-content .member-form-wrap .logo-happypoint img { display: block; max-width: 7.28571rem; margin: 0 auto; }

.member-content .login-assist-list { margin-top: 1.71429rem; }

.member-content .sns-login-wrap { margin-top: 5.71429rem; }

.member-content .sns-login-wrap .sns-list { margin-top: 1.42857rem; }

.member-content h3.service-title { font-size: 1.14286rem; font-weight: 600; color: #222222; }

.member-content h4.service-title { margin-top: 1.42857rem; font-size: 1rem; font-weight: 600; color: #222222; }

.member-content .line-through-wrap { position: relative; text-align: center; }

.member-content .line-through-wrap:before { display: inline-block; content: ''; width: 100%; height: 1px; position: absolute; top: 50%; left: 0; z-index: 1; background-color: #e5e5e5; }

.member-content .line-through-wrap .title { position: relative; z-index: 2; padding: 0 1.07143rem; display: inline-block; color: #222222; font-size: 1rem; font-weight: normal; background-color: #fff; }

.member-content .terms-content-wrap .section-title-wrap .title { font-size: 1.71429rem; font-weight: normal; letter-spacing: -0.96px; }

.member-content .terms-content-wrap .section-title-wrap .sub-info { margin-top: 1.14286rem; font-size: 1.14286rem; color: #666666; word-break: break-all; }

.member-content .terms-content-wrap .terms-content { margin-top: 2.85714rem; }

.member-content .terms-content-wrap .btn-group { margin-top: 2.85714rem; }

.member-content .member-info-wrap { text-align: center; }

.member-content .member-info-wrap .img-wrap { margin-bottom: 0.92857rem; }

.member-content .member-info-wrap .img-wrap img { width: 4.28571rem; display: block; margin: 0 auto; }

.member-content .member-info-wrap .alert-text { font-size: 1.71429rem; font-weight: 600; letter-spacing: -0.96px; word-break: break-all; }

.member-content .member-info-wrap .info-text { font-size: 1.42857rem; letter-spacing: -0.8px; color: #666666; word-break: break-all; font-weight: 300; }

.member-content .member-info-wrap .sub-text { margin-top: 0.57143rem; font-size: 1rem; font-weight: 300; color: #666666; word-break: break-all; }

.member-content .member-info-wrap .btn-arrow { margin-top: 0.57143rem; }

.member-content .identify-box-wrap { margin-top: 2.28571rem; }

.member-content .password-modify-form { margin-top: 3rem; }

.member-content .user-pass-change-area { margin-top: 2.85714rem; padding-top: 2.85714rem; border-top: 1px solid #e5e5e5; }

.member-content .user-pass-change-area .main-txt { font-size: 1.14286rem; font-weight: 600; }

.member-content .user-pass-change-area .sub-txt { margin-top: 0.28571rem; font-size: 1rem; color: #666666; font-weight: lighter; }

.member-content .user-id-area { margin-top: 2.14286rem; }

.member-content .user-id-area > .user-info { text-align: center; font-size: 1.14286rem; font-weight: 600; }

.member-content .user-id-area > .user-info .text, .member-content .user-id-area > .user-info .user-id { display: inline-block; }

.member-content .user-id-area > .user-info .user-id { margin-left: 0.57143rem; color: #fe4f27; }

.member-content .password-modify .img-wrap img { display: block; margin: 0 auto; width: 4.28571rem; height: 4.28571rem; }

.member-content .password-modify .article-title { margin-top: 0.71429rem; font-weight: 600; font-size: 1.71429rem; letter-spacing: -0.096em; color: #222222; }

.member-content .password-modify .article-title.space-remove { margin-top: 0; }

.member-content .password-modify .article-title .sub-text { display: inline-block; margin-left: 0.35714rem; font-weight: normal; font-size: 0.78571rem; color: #999; }

.member-content .password-modify .article-info-text { font-size: 1rem; letter-spacing: -0.028em; color: #666666; word-break: break-all; }

.member-content .password-modify .article-block.login { text-align: center; }

.member-content .password-modify .article-block.login .article-info-text { margin-top: 1.42857rem; }

.member-content .password-modify .modify-form-wrap { margin-top: 2.28571rem; }

.member-content .password-modify .btn-group { margin-top: 2.85714rem; }

.login-assist-list { display: table; margin: 0 auto; }

.login-assist-list li { float: left; font-size: 1rem; }

.login-assist-list li + li { position: relative; margin-left: 1.42857rem; }

.login-assist-list li + li:before { position: absolute; top: 50%; margin-top: -0.42857rem; left: -0.71429rem; content: ''; display: inline-block; width: 1px; height: 0.85714rem; background-color: #e5e5e5; }

.login-assist-list li a { display: block; }

.sns-list { display: table; margin: 0 auto; }

.sns-list .item { float: left; width: 3.42857rem; height: 3.42857rem; border-radius: 50%; overflow: hidden; }

.sns-list .item + .item { margin-left: 2.14286rem; }

.sns-list .item a { display: block; }

.sns-list .item img { width: 3.42857rem; height: 3.42857rem; display: block; }

.sns-list .item img.apple { width: 4.42857rem; height: 4.42857rem; margin-top: -0.5rem; margin-left: -0.5rem; }

.identify-box-wrap { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; }

.identify-box-wrap .box-area { width: calc( 50% - 4px); border: 1px solid #e5e5e5; border-radius: 0.28571rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.identify-box-wrap .box-area + .box-area { margin-left: 8px; }

.identify-box-wrap .box-inner { display: block; padding: 2rem 0.71429rem 2.07143rem; }

.identify-box-wrap .box-inner img { display: block; margin: 0 auto; width: 3.71429rem; height: 3.71429rem; }

.identify-box-wrap .box-inner .type { margin-top: 0.78571rem; font-size: 1rem; text-align: center; word-break: break-all; }

.identify-btn-wrap { margin-top: 2.28571rem; }

.identify-btn-wrap .btn-group + .btn-group { margin-top: 0.85714rem; }

.identify-btn-wrap .btn-group .btn { position: relative; padding: 0.92857rem 2.57143rem 0.92857rem 1.42857rem; border-color: #e5e5e5; text-align: left; }

.identify-btn-wrap .btn-group .btn .ico { position: absolute; right: 1.14286rem; top: 50%; margin-left: 0; margin-top: -0.57143rem; }

.identify-btn-wrap .btn-group.disabled .btn { background-color: #fcfcfc; }

.identify-btn-wrap .btn-group.disabled .btn .em.weighty { color: #666666; font-weight: 400; }

.identify-btn-wrap .btn-group.disabled .btn .sub-info { color: #bbbbbb; }

.identify-btn-wrap .btn-group .em.weighty { font-weight: 600; }

.identify-btn-wrap .btn-group .em, .identify-btn-wrap .btn-group .sub-info { overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.identify-btn-wrap .btn-group .sub-info { display: block; margin-top: 0.57143rem; }

.identify-btn-wrap.btn-combine { border: 1px solid #e5e5e5; border-radius: 0.85714rem; }

.identify-btn-wrap.btn-combine .btn { width: 100%; border-radius: 0; border: 0; }

.identify-btn-wrap.btn-combine .btn + .btn { border-top: 1px solid rgba(229, 229, 229, 0.5); }

.identify-btn-wrap .icon { width: 2rem; height: 2rem; display: inline-block; margin-right: 0.57143rem; vertical-align: middle; }

.identify-btn-wrap .icon.icoid { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-id-search-small.png") left top no-repeat; background-size: 2rem 2rem; }

.identify-btn-wrap .icon.icopw { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/member/ico-pw-search-small.png") left top no-repeat; background-size: 2rem 2rem; }

.bottom-button-layer { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 1000; }

.terms-content { border: 1px solid #e5e5e5; border-radius: 0.21429rem; }

.terms-content .terms-head { padding: 1.07143rem 1.14286rem; border-bottom: 1px solid #e5e5e5; }

.terms-content .terms-head .selector-wrap .label { font-size: 1.14286rem; font-weight: bold; letter-spacing: -0.64px; }

.terms-content .terms-body { padding: 1.07143rem 1.14286rem; }

.terms-content .terms-body .selector-wrap .asset { position: relative; padding-right: 3.21429rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.terms-content .terms-body .selector-wrap .asset + .asset { margin-top: 0.35714rem; }

.terms-content .terms-body .selector-wrap .label { font-size: 1rem; color: #666666; margin: auto 0; }

.terms-content .terms-body .more-view-btn { position: absolute; display: inline-block; top: 0.28571rem; right: 0; color: #888888; font-size: 0.85714rem; border-bottom: 1px solid #888888; }

.form-article.join-member .field .label { margin: 2.14286rem 0 0.64286rem; }

.form-article.join-member .field:nth-child(2) .label { margin-top: 0; }

.form-article.join-member .field .input-btn.time input { padding-right: 8.57143rem; }

.form-article.join-member .section-title-wrap { padding: 3.14286rem 0 0 0; }

.form-article.join-member .terms-body .asset { margin-bottom: 0.57143rem; }

@media (max-width: 480px) { .form-article.join-member .terms-body .asset { margin-right: 1.35714rem; }
    .form-article.join-member .terms-body .asset:nth-child(3n) { margin-right: 0; } }

@media (max-width: 360px) { .form-article.join-member .terms-body .asset { margin-right: 1.35714rem; }
    .form-article.join-member .terms-body .asset:nth-child(3n) { margin-right: 0; } }

@media (max-width: 325px) { .form-article.join-member .terms-body .asset { margin-right: 0.42857rem; }
    .form-article.join-member .terms-body .asset:nth-child(3n) { margin-right: 0; }
    .form-article.join-member .terms-body .asset .label { font-size: 0.85714rem; } }

.member-easy-menu { margin: 0 1.28571rem; padding: 2.85714rem 0; }

.member-easy-menu:before, .member-easy-menu:after { content: ""; display: table; }

.member-easy-menu:after { clear: both; }

.member-easy-menu li { float: left; width: 50%; text-align: center; }

.member-easy-menu li:nth-child(n+3) { margin-top: 2.14286rem; }

.member-easy-menu li a { display: block; }

.member-easy-menu li p { margin-top: 0.71429rem; }

.member-easy-menu li .ico-img { width: 5.71429rem; height: 5.71429rem; margin: 0 auto; background-color: #f7f7f7; border-radius: 50%; }

.member-easy-menu li .ico-img img { width: 2.85714rem; height: 2.85714rem; display: block; margin: 0 auto; padding: 1.42857rem 0; }

.join-easy-menu { margin: 2.85714rem auto 4.64286rem; max-width: 15.71429rem; }

.join-easy-menu li { padding: 0.85714rem 0; }

.join-easy-menu li a { display: block; }

.join-easy-menu li + li { border-top: 1px solid rgba(229, 229, 229, 0.5); }

.join-easy-menu li:before, .join-easy-menu li:after { content: ""; display: table; }

.join-easy-menu li:after { clear: both; }

.join-easy-menu li .ico-img { float: left; width: 3.71429rem; height: 3.71429rem; margin-right: 1.57143rem; background-color: #f7f7f7; border-radius: 50%; }

.join-easy-menu li .ico-img img { width: 1.71429rem; height: 1.71429rem; display: block; margin: 0 auto; padding: 1rem 0; }

.join-easy-menu li .easy-detail { float: left; }

.join-easy-menu li .easy-detail .step { display: block; margin: 0.28571rem 0; font-size: 0.85714rem; color: #666666; text-transform: uppercase; }

.withdraw-area { padding: 2.14286rem 0; border-top: 1px solid #e5e5e5; text-align: center; }

.withdraw-area .question { font-size: 0.85714rem; color: #666666; margin-bottom: 0.28571rem; }

.member-result-wrap .description-list dt, .member-result-wrap .description-list dd { padding: 0 0.28571rem; font-size: 1.14286rem; font-weight: 600; -webkit-box-sizing: border-box; box-sizing: border-box; }

.member-result-wrap .description-list dt { color: #222222; text-align: right; }

.member-result-wrap .description-list dd { color: #fe4f27; }

.member-result-wrap .date { margin-top: 0.42857rem; text-align: center; font-weight: 300; color: #888888; }

.basic-guide-wrap { padding: 2.28571rem 0 2.57143rem; }

.basic-guide-wrap .notice-area { padding: 1.42857rem 3.71429rem; border: 1px solid #e5e5e5; border-radius: 0.28571rem; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }

.basic-guide-wrap .notice-list { padding-top: 2.85714rem; padding-bottom: 0.28571rem; }

.basic-guide-wrap .notice-list dl { padding: 1.42857rem 0; }

.basic-guide-wrap .notice-list dt { width: 160px; }

.basic-guide-wrap .notice-list dt img { display: inline-block; max-width: 124px; }

.basic-guide-wrap .notice-list dd { width: calc(100% - 160px); }

.basic-guide-wrap .notice-list dd .info-title { font-size: 1.14286rem; font-weight: 600; line-height: 1.71429rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.basic-guide-wrap .notice-list dd .info { font-size: 1.42857rem; }

.basic-guide-wrap .notice-list dd .info .num { font-size: 2rem; font-weight: 600; line-height: 2.92857rem; }

.basic-guide-wrap .notice-list dd .info-sub { margin-top: 0.85714rem; font-size: 1rem; line-height: 1.57143rem; color: #888888; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.service-info-wrap { margin-top: 0.92857rem; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; border-top: 1px solid #bbbbbb; }

.service-info-wrap dl, .service-info-wrap dt, .service-info-wrap dd { margin: 0; padding: 0; width: 100%; }

.service-info-wrap dt, .service-info-wrap dd { padding: 0.71429rem 1.14286rem; border-bottom: 1px solid #e5e5e5; color: #666666; -webkit-box-sizing: border-box; box-sizing: border-box; }

.service-info-wrap dt { background-color: #f7f7f7; }

.service-info-wrap dd { font-size: 0.85714rem; line-height: 1.28571rem; }

.service-info-wrap + .important-info-wrap { margin-top: 1.42857rem; }

.marketing-agree-wrap { padding: 1.42857rem 0 0.5rem; }

.marketing-agree-wrap .selector-wrap { padding: 0.92857rem 0; }

.marketing-agree-wrap .selector-wrap + .selector-wrap { border-top: 1px solid rgba(229, 229, 229, 0.5); }

.marketing-agree-wrap label strong { font-size: 1.14286rem; font-weight: 600; }

.field-guide-wrap { padding-bottom: 2.28571rem; }

.field-guide-wrap .sevice-title-wrap { padding-bottom: 1rem; margin-bottom: 1.42857rem; border-bottom: 1px solid rgba(229, 229, 229, 0.5); }

.change-bundle-area { margin-top: 1.42857rem; margin-left: -1.42857rem; margin-right: -1.42857rem; padding: 1.42857rem; background-color: #f7f7f7; }

.change-bundle-area .btn-group { margin: 1.42857rem auto 0; max-width: 14.57143rem; }

.change-bundle-area .field .label { font-weight: 600; }

.change-bundle-area .field .label label { font-size: 1rem; }

.change-bundle-area .field .input-cover input { background-color: transparent; font-size: 1rem; }

.common-banner-wrap.login-banner { margin-top: 10.57143rem; }

.support-info-wrap { margin-top: 6.35714rem; text-align: center; }

.support-info-wrap .info-text { font-size: 1.14286rem; letter-spacing: -0.32px; word-break: break-all; }

.support-info-wrap .sub-text { margin-top: 0.57143rem; font-size: 1rem; font-weight: 300; color: #666666; word-break: break-all; }

.support-info-wrap .btn-group { margin-top: 1.42857rem; }

.support-info-wrap .btn-group .btn { min-width: 11.42857rem; }

.password-insert-form { margin-top: 2.28571rem; }

.password-insert-form input[type="text"][readonly] { color: #fe4f27; border-bottom: 1px solid #bbbbbb; }

.support-btn-wrap { margin-top: 2.85714rem; }

.support-btn-wrap .info-text { margin-top: 1.42857rem; line-height: 1.42857rem; font-size: 0.85714rem; color: #666666; font-weight: 300; text-align: center; }

.support-btn-wrap .info-text a { display: inline-block; color: #666666; }

.support-btn-wrap .line-through-wrap { margin-top: 2.28571rem; }

.join-stage-wrap { margin-top: 2.28571rem; }

.join-stage-wrap:before, .join-stage-wrap:after { content: ""; display: table; }

.join-stage-wrap:after { clear: both; }

.join-stage-wrap .join-title-wrap { float: left; margin-top: 0.64286rem; }

.join-stage-wrap .join-title-wrap .title { font-size: 1.14286rem; letter-spacing: -0.32px; font-weight: bold; }

.join-stage-wrap .join-title-wrap .title .sub { color: #666666; }

.join-stage-wrap .stage-mark-wrap { float: right; }

.join-stage-wrap .stage-text { display: inline-block; vertical-align: middle; font-size: 1rem; color: #888888; }

.join-stage-wrap .stage-img { display: inline-block; margin-left: 0.85714rem; vertical-align: middle; }

.join-stage-wrap .stage-img img { display: block; width: 2.85714rem; height: 2.85714rem; }

.join-detail-content { margin-top: 1.14286rem; }

.join-detail-content + .identify-box-wrap { margin-top: 0; }

.join-detail-content.additional-info { padding-top: 2.28571rem; border-top: 1px solid #e5e5e5; }

.description-list.member-box { padding: 1.57143rem 1.71429rem; border: 1px solid #e5e5e5; border-radius: 4px; font-size: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.description-list.member-box dl + dl { margin-top: 0.57143rem; }

.description-list.member-box dt { max-width: 7.14286rem; color: #666666; padding-right: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.description-list.member-box dd { width: calc(100% - rem(100px)); }

.member-content .complete-guide-wrap { padding: 4.28571rem 0 3.42857rem; }

.member-content .complete-guide-wrap .common-banner-wrap img { width: 100%; max-width: 19.78571rem; }

.member-content.join-complete { position: relative; }

.member-content.join-complete .content-wrapper { position: relative; padding-top: 0; padding-bottom: 24.4%; -webkit-box-sizing: border-box; box-sizing: border-box; min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.member-content.join-complete .complete-guide-wrap { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; }

.member-content.join-complete .complete-guide-wrap .common-banner-wrap { margin: 0 auto; }

.member-content.join-complete .complete-guide-wrap .common-banner-wrap img { max-width: none; }

.member-content.join-complete .member-info-wrap .info-text { color: #fff; }

.member-content.join-complete .member-info-wrap .sub-text { color: rgba(255, 255, 255, 0.5); }

.member-content.join-complete .common-banner-wrap.intro-app { position: absolute; left: 0; bottom: 0; width: 100%; z-index: 1; }

.member-content.join-complete .common-banner-wrap.intro-app img { width: 100%; max-width: none; }

.member-content .member-join-form { margin-top: 2.64286rem; }

.member-content .member-join-form .basic-guide-wrap { border-top: 1px dashed #bbbbbb; margin-top: 2.85714rem; }

.member-content .member-join-form .basic-guide-wrap .data-list > li { font-size: 0.85714rem; }

/* 서브 고정 */
.section-line { border-top: 8px solid #f7f7f7; }

.section-dashline { border-bottom: 1px dashed #bbbbbb; }

.section-title-wrap { padding: 4.28571rem 0 2.14286rem; }

.section-title-wrap.no-space { padding: 0; }

.section-title-wrap .title-area .title { font-size: 1.42857rem; font-weight: bold; letter-spacing: -0.4px; word-break: break-all; }

.section-title-wrap .sub-info-area { margin-top: 1.42857rem; }

.section-title-wrap .sub-info-area .info { font-size: 1rem; letter-spacing: -0.28px; color: #666666; word-break: break-all; }

.section-title-wrap.reverse-color .title { color: #fff; }

.section-title-wrap.reverse-color .ico.plus { background-color: #fff; }

.section-title-wrap.sub-contents { padding: 0 2rem; text-align: center; }

.section-title-wrap.sub-contents .attach-item-wrap .item-bundle { padding-bottom: 0; }

.section-title-wrap.sub-contents .attach-item-wrap + .title-area { margin-top: 1.42857rem; }

.section-title-wrap.sub-contents .title-area .title { font-size: 1.71429rem; letter-spacing: -0.96px; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.section-title-wrap.sub-contents .sub-info-area { margin-top: 0.71429rem; }

.culture-main-content, .benefits-plus-content, .earn-points-content, .happy-story-content, .earn-points-popup { /* 섹션 타이틀 */ }

.culture-main-content .section-title-wrap, .benefits-plus-content .section-title-wrap, .earn-points-content .section-title-wrap, .happy-story-content .section-title-wrap, .earn-points-popup .section-title-wrap { position: relative; padding: 0; padding-right: 4.57143rem; margin: 3.42857rem 1.42857rem 1.42857rem; }

.culture-main-content .section-title-wrap .title-area .more-btn, .benefits-plus-content .section-title-wrap .title-area .more-btn, .earn-points-content .section-title-wrap .title-area .more-btn, .happy-story-content .section-title-wrap .title-area .more-btn, .earn-points-popup .section-title-wrap .title-area .more-btn { position: absolute; bottom: 0; right: 0; }

.culture-main-content .section-title-wrap .title-area .title, .benefits-plus-content .section-title-wrap .title-area .title, .earn-points-content .section-title-wrap .title-area .title, .happy-story-content .section-title-wrap .title-area .title, .earn-points-popup .section-title-wrap .title-area .title { font-size: 1.71429rem; }

.culture-main-content .section-title-wrap .more-btn, .benefits-plus-content .section-title-wrap .more-btn, .earn-points-content .section-title-wrap .more-btn, .happy-story-content .section-title-wrap .more-btn, .earn-points-popup .section-title-wrap .more-btn { position: absolute; bottom: 0.35714rem; right: 0; font-size: 1.07143rem; color: #888888; }

.culture-main-content .section-title-wrap .more-btn .ico, .benefits-plus-content .section-title-wrap .more-btn .ico, .earn-points-content .section-title-wrap .more-btn .ico, .happy-story-content .section-title-wrap .more-btn .ico, .earn-points-popup .section-title-wrap .more-btn .ico { display: inline-block; vertical-align: sub; }

.culture-main-content .section-title-wrap .more-btn .ico.plus, .benefits-plus-content .section-title-wrap .more-btn .ico.plus, .earn-points-content .section-title-wrap .more-btn .ico.plus, .happy-story-content .section-title-wrap .more-btn .ico.plus, .earn-points-popup .section-title-wrap .more-btn .ico.plus { width: 1.42857rem; height: 1.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-more-40x40.png") left top no-repeat; background-size: 1.42857rem 1.42857rem; }

.culture-main-content .section-title-wrap .sub-info-area, .benefits-plus-content .section-title-wrap .sub-info-area, .earn-points-content .section-title-wrap .sub-info-area, .happy-story-content .section-title-wrap .sub-info-area, .earn-points-popup .section-title-wrap .sub-info-area { margin-top: 0.35714rem; }

.culture-main-content .section-title-wrap .sub-info-area .info, .benefits-plus-content .section-title-wrap .sub-info-area .info, .earn-points-content .section-title-wrap .sub-info-area .info, .happy-story-content .section-title-wrap .sub-info-area .info, .earn-points-popup .section-title-wrap .sub-info-area .info { color: #888888; }

.culture-main-content .section-title-wrap .sub-info-area + .more-btn, .benefits-plus-content .section-title-wrap .sub-info-area + .more-btn, .earn-points-content .section-title-wrap .sub-info-area + .more-btn, .happy-story-content .section-title-wrap .sub-info-area + .more-btn, .earn-points-popup .section-title-wrap .sub-info-area + .more-btn { top: auto; bottom: 0; margin-top: 0; }

.benefits-plus-content.edit { padding: 1.14286rem;}

.benefits-plus-content.edit .btn-group { padding-top: 1.14286rem;}

.benefits-plus-content.edit .btn-group { padding-top: 1.14286rem;}

.full-banner-slider { position: relative; }

.full-banner-slider .swiper-slide > a { display: block; }

.full-banner-slider .slider-number-paging { bottom: 20px; right: 20px; }

.common-banner-wrap { position: relative; overflow: hidden; }

.common-banner-wrap a, .common-banner-wrap img { display: block; }

.common-banner-wrap img { margin: 0 auto; max-width: 100%; }

.file-add-module .register-list { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }

.file-add-module .register-list .item { width: 5.14286rem; height: 5.14286rem; position: relative; overflow: hidden; border: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.file-add-module .register-list .item + .item { margin-left: 0.28571rem; }

.file-add-module .item.register input[type="file"] { opacity: 0; position: absolute; top: 0; left: 0; width: 1px; height: 1px; }

.file-add-module .item.register label { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-file-add.svg") center center no-repeat; }

.file-add-module .item.result .btn-remove { display: inline-block; position: absolute; z-index: 3; top: 0; right: 0; width: 1.71429rem; height: 1.71429rem; text-indent: -9999px; overflow: hidden; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-24x24.svg") no-repeat center center; background-size: contain; }

.file-add-module .item.represent { border-color: #fe4f27; }

.file-add-module .item.represent:before { display: inline-block; content: ''; position: absolute; z-index: 2; top: 0; left: 0; width: 2.14286rem; height: 1.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/label-represent.svg") 0 0 no-repeat; background-size: contain; }

.warning-text { margin-top: 0.35714rem; }

.warning-text .em { font-size: 0.85714rem; letter-spacing: -0.025em; }

.warning-text .em + .em { margin-top: 0.21429rem; }

.horizontal-sort:before, .horizontal-sort:after { content: ""; display: table; }

.horizontal-sort:after { clear: both; }

.horizontal-sort li { float: left; }

.horizontal-sort li a { display: block; }

.range-slider-list { padding-top: 1.78571rem; padding-bottom: 3.35714rem; }

.range-slider-list .range-title { margin-bottom: 0.57143rem; text-align: center; font-weight: bold; font-size: 1rem; }

.range-slider-wrapper { width: 72%; margin: 0 auto; position: relative; }

.range-slider-wrapper .range-branch { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; position: absolute; top: 50%; width: 100%; height: 0.28571rem; z-index: 1; margin-top: -0.14286rem; background-color: #f2f2f2; }

.range-slider-wrapper .range-branch .dot { display: block; width: 1.42857rem; height: 1.42857rem; border-radius: 50%; position: relative; top: 50%; margin-top: -0.71429rem; border: 1px solid #d7dae1; background-color: #fff; }

.range-slider-wrapper .range-branch .dot:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; margin-top: -0.21429rem; margin-left: -0.21429rem; width: 0.42857rem; height: 0.42857rem; border-radius: 50%; background-color: #fff; }

.range-slider-wrapper .range-branch .dot.on { border-color: #222222; background-color: #222222; }

.range-slider-wrapper .range-branch .dot .label { display: block; width: 5.71429rem; position: absolute; left: 50%; top: 2.14286rem; margin-left: -2.85714rem; font-size: 0.85714rem; letter-spacing: -0.025em; color: #999; text-align: center; }

.range-slider-wrapper .rangeslider { height: 2.35714rem; position: relative; z-index: 2; border-radius: 0; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; }

.range-slider-wrapper .rangeslider .rangeslider__fill { height: 0.14286rem; top: 50%; margin-top: -0.07143rem; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; background-color: transparent; }

.range-slider-wrapper .rangeslider .rangeslider__handle { display: none; }

.range-slider-wrapper .rangeslider .rangeslider__handle:after { display: none; }

.select-filter-tag:before, .select-filter-tag:after { content: ""; display: table; }

.select-filter-tag:after { clear: both; }

.select-filter-tag .tag { display: block; float: left; position: relative; margin-right: 0.71429rem; margin-bottom: 0.78571rem; }

.select-filter-tag .tag input[type="checkbox"], .select-filter-tag .tag input[type="radio"] { opacity: 0; position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; }

.select-filter-tag .tag input[type="checkbox"]:checked + label, .select-filter-tag .tag input[type="radio"]:checked + label { border-color: #fe4f27; color: #fe4f27; }

.select-filter-tag .tag label { display: block; height: 2.57143rem; line-height: 2.57143rem; position: relative; z-index: 1; padding: 0 1.14286rem; border: 1px solid #bbbbbb; border-radius: 2.14286rem; text-align: center; font-size: 0.85714rem; color: #666666; letter-spacing: -0.025em; -webkit-box-sizing: border-box; box-sizing: border-box; }

.guide-text-wrapper { padding: 0.92857rem 1.14286rem; border-top: 1px solid #ececec; border-bottom: 1px solid #ececec; }

.guide-icon-text { padding-left: 1.28571rem; font-size: 0.85714rem; letter-spacing: -0.025em; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-warning-26x26.png"); background-repeat: no-repeat; background-position: 0 0.21429rem; background-size: 0.92857rem 0.92857rem; }

.guide-icon-text.gray { padding-left: 1.35714rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-warning-30x30.png"); background-size: 1.07143rem 1.07143rem; background-position: 0 center; color: #999999; }

.guide-ico-title { position: relative; padding-left: 1.85714rem; margin-bottom: 0.57143rem; font-size: 1rem; color: #222222; font-weight: 600; }

.guide-ico-title:after { position: absolute; content: ''; width: 1.42857rem; height: 1.42857rem; left: 0; top: 50%; margin-top: -0.71429rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-warning-20x20.png") left top no-repeat; background-size: 1.42857rem 1.42857rem; }

.winner-confirm-container .winner-confirm { padding: 2.85714rem 1.42857rem; text-align: center; }

.winner-confirm-container .winner-confirm .winner-title { font-size: 1.42857rem; font-weight: 600; }

.winner-confirm-container .winner-confirm .winner-image img { max-width: 100%; }

.winner-confirm-container .winner-confirm .sub-text { padding: 1.42857rem; padding-bottom: 2.14286rem; font-size: 16px; }

.ani-m { position: relative; }

/* .ani-m.ani-hide { opacity: 0; -webkit-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transform: translate(0, 50%); -ms-transform: translate(0, 50%); transform: translate(0, 50%); } */
.ani-m.ani-hide { opacity: 1; -webkit-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transform: translate(0, 0%); -ms-transform: translate(0, 0%); transform: translate(0, 0%); }

.ani-m.ani-hide.visible { opacity: 1; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); }

.ani-m.ani-bounce.visible { -webkit-animation: bounce 1s ease-out 1 alternate; animation: bounce 1s ease-out 1 alternate; }

@-webkit-keyframes bounce { 0% { opacity: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0); }
    33% { -webkit-transform: translate(0, 33px); transform: translate(0, 33px); }
    66% { -webkit-transform: translate(0, -20px); transform: translate(0, -20px); }
    100% { opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0); } }

@keyframes bounce { 0% { opacity: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0); }
    33% { -webkit-transform: translate(0, 33px); transform: translate(0, 33px); }
    66% { -webkit-transform: translate(0, -20px); transform: translate(0, -20px); }
    100% { opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0); } }

.gate-page-contents { position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; }

.gate-page-contents .gate-wrapper { width: 100%; height: 100%; }

.gate-page-contents .gate-wrapper .gate-content { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; }

.gate-page-contents .gate-wrapper .gate-content .logo-img-area { padding-top: 4rem; width: 100px; height: 110px; margin: 0 auto; }

.gate-page-contents .gate-wrapper .gate-content .logo-img-area img { display: block; max-width: 100%; }

.gate-page-contents .gate-wrapper .btn-group { position: fixed; left: 0; bottom: 0; z-index: 2; width: 100%; padding: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

#lottieAniPoint2 { opacity: 0; }

.sorting-box-wrapper { padding: 1.42857rem; padding-bottom: 0; -webkit-box-sizing: border-box; box-sizing: border-box; }

.sorting-box-wrapper + .sorting-box-wrapper { border-top: 1px solid #e5e5e5; }

.sorting-box-wrapper .sorting-wrap { padding-bottom: 1rem; }

.sorting-box-wrapper .sorting-wrap:before, .sorting-box-wrapper .sorting-wrap:after { content: ""; display: table; }

.sorting-box-wrapper .sorting-wrap:after { clear: both; }

.sorting-box-wrapper .sorting-wrap .sorting-area { float: left; }

.sorting-box-wrapper .sorting-wrap .sorting-area.right { float: right; }

.sorting-box-wrapper .sorting-wrap .sorting-area.right .selector-wrap { float: left; }

.sorting-box-wrapper .sorting-wrap .sorting-area.right .selector-wrap + .filter-wrap { margin-left: 1.42857rem; }

.sorting-box-wrapper .location-wrap { position: relative; float: left; padding-left: 2.14286rem; }

.sorting-box-wrapper .location-wrap:before { display: inline-block; position: absolute; top: -0.14286rem; left: 0; content: ''; width: 1.71429rem; height: 1.71429rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-location.png"); background-size: 1.71429rem; background-repeat: no-repeat; background-position: 0 0; background-color: transparent; }

.sorting-box-wrapper .filter-wrap { float: right; }

.sorting-box-wrapper .filter-wrap .btn-ico { display: block; }

.sorting-box-wrapper .selectric-small { float: right; }

.sorting-box-wrapper .selectric-small .selectric { height: 1.42857rem; border: none; }

.sorting-box-wrapper .selectric-small .selectric .label { padding-right: 2.14286rem; line-height: 1.28571rem; }

.sorting-box-wrapper .selectric-small .selectric .button { width: 1.85714rem; }

.sorting-box-wrapper.small { padding-top: 0.78571rem; }

.sorting-box-wrapper.small .sorting-wrap { padding-bottom: 0.78571rem; }

.sorting-box-wrapper.underline-sorting .sorting-wrap { padding-bottom: 0; }

.sorting-box-wrapper.underline-sorting .selectric-wrapper .selectric { min-width: 100px; height: 2rem; border-bottom: 2px solid #222222; }

.sorting-box-wrapper.underline-sorting .selectric-wrapper .selectric .label { line-height: 1.85714rem; padding-left: 0; }

.board-header-wrap { padding: 1.42857rem; padding-bottom: 0; }

.common-search-box { position: relative; }

.common-search-box input { padding-left: 0.85714rem; padding-right: 3.71429rem; border: 1px solid #bbbbbb; font-size: 1rem; color: #888888; }

.common-search-box .input-element { position: absolute; right: 0.71429rem; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

.common-search-box .input-element .search-submit { width: 2.28571rem; height: 2.28571rem; border: none; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; background-color: transparent; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico_search.png"); background-size: 2.28571rem; }

.detail-filter-menu { -webkit-overflow-scrolling: touch; position: fixed; z-index: 903; left: 0; bottom: 0; width: 100%; height: 100%; padding-top: 1.71429rem; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu.open { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.detail-filter-menu .btn-toggle.active { font-weight: bold; }

.detail-filter-menu form { width: 100%; height: 100%; }

.detail-filter-menu .btn-close { display: block; position: absolute; top: 0.85714rem; right: 0.85714rem; width: 2.28571rem; height: 2.28571rem; text-indent: -9999px; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-32x32.svg") no-repeat 50% 50%; background-size: 2.28571rem 2.28571rem; }

.detail-filter-menu .filter-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

.detail-filter-menu .filter-header { position: relative; height: 4rem; line-height: 4rem; border-bottom: 1px solid #e5e5e5; text-align: center; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu .filter-header .header-group { padding: 0 2.85714rem 0 16px; }

.detail-filter-menu .filter-header .title { font-size: 1.28571rem; font-weight: 600; letter-spacing: -0.75px; }

.detail-filter-menu .filter-body { overflow: auto; padding: 0 1.42857rem; background-color: #fff; }

.detail-filter-menu .filter-body a, .detail-filter-menu .filter-body img { display: block; margin: 0 auto; max-width: 100%; }

.detail-filter-menu .filter-body .parts-group { padding: 2.14286rem 0; }

.detail-filter-menu .filter-body .parts-group + .parts-group { border-top: 1px solid #e5e5e5; }

.detail-filter-menu .filter-body .group-title { margin-bottom: 1.42857rem; font-size: 1.14286rem; font-weight: 600; }

.detail-filter-menu .filter-body .selector-wrap.vertical .asset { margin: 0; padding: 0.35714rem 0; }

.detail-filter-menu .filter-body .selector-wrap.horizontal .asset { padding: 0.71429rem 0; margin-bottom: 0; }

.detail-filter-menu .filter-body .selector-wrap.horizontal.two-point .asset { width: 50%; margin: 0; }

.detail-filter-menu .filter-body .selector-wrap.horizontal.three-point .asset { width: 33.333%; margin: 0; }

.detail-filter-menu .filter-footer { padding-top: 0.71429rem; background-color: #fff; }

.detail-filter-menu .filter-footer .btn-group .btn { margin: 0; }

.detail-filter-menu.toast-full .filter-body { padding: 0; }

.detail-filter-menu.toast-full .filter-header { text-align: left; border-bottom: none; }

.detail-filter-menu.toast-brand .infomation .info { margin-top: 1.42857rem; text-align: center; font-size: 1.42857rem; font-weight: 400; color: #fff; }

.detail-filter-menu.toast-brand .btn-close { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-w-32x32.svg") no-repeat 50% 50%; }

.detail-filter-menu.toast-brand .filter-header { height: 2.85714rem; border-bottom: none; }

.detail-filter-menu.toast-brand .filter-body { padding-bottom: 2.85714rem; }

.detail-filter-menu.toast-brand .cost-benefit-wrap { padding-top: 1.42857rem; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .benefit-text { margin-top: 0.71429rem; font-size: 1.14286rem; font-weight: 400; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .benefit-text strong { font-weight: 600; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: columns; flex-direction: columns; padding: 1.71429rem 1.42857rem; border-radius: 0.71429rem; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.coupon { position: relative; padding-bottom: 5.42857rem; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.coupon .download { position: absolute; left: 0; bottom: 0; width: 100%; height: 3.71429rem; line-height: 3.71429rem; border-top: 1px dashed #e5e5e5; background-color: #f7f7f7; text-align: center; border-bottom-right-radius: 1.14286rem; border-bottom-left-radius: 1.14286rem; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.coupon .ico-down { display: inline-block; width: 1.71429rem; height: 1.71429rem; margin-left: 0.57143rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-down.svg") left top no-repeat; background-size: cover; vertical-align: middle; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.sale { position: relative; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.sale .brand-name { display: block; margin-top: 0.85714rem; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.sale .period-use { display: block; margin-top: 0.85714rem; font-size: 0.85714rem; color: #888888; font-weight: 400; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.sale .sale-label { position: absolute; top: -0.57143rem; right: 0.85714rem; width: 5.42857rem; height: 5.14286rem; padding-top: 0.71429rem; padding-right: 0.71429rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/popup/ico-sale-bg.svg") left top no-repeat; background-size: cover; text-transform: uppercase; font-size: 1.14286rem; font-weight: 600; text-align: center; color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.sale .sale-label span { display: block; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .item.sale .thumb { margin-top: 4.71429rem; border-radius: 50%; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .detail { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }

.detail-filter-menu.toast-brand .cost-benefit-wrap .thumb { position: relative; overflow: hidden; min-width: 5.71429rem; padding-bottom: 100%; }

.detail-filter-menu.toast-brand .brand-pagination { margin-top: 0.71429rem; display: inline-block; text-align: center; }

.detail-filter-menu.toast-brand .brand-pagination .swiper-pagination-bullet { float: inherit; width: 0.42857rem; height: 0.42857rem; margin: 0 0.14286rem; }

.detail-filter-menu.toast-brand .brand-pagination .swiper-pagination-bullet-active { background-color: #fe4f27; }

.culture-main-content { /* 당첨자 발표 리스트 */ /* 섹션 부분 수정 */ }

.culture-main-content .notice-board-list { border-top: 1px solid #e5e5e5; }

.culture-main-content .notice-board-list .title { display: block; display: -webkit-box; max-height: 1.5em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.culture-main-content .notice-board-list .detail { padding-right: 5.71429rem; }

.culture-main-content .notice-board-list .detail .title { margin-top: 0.14286rem; font-size: 1.14286rem; }

.culture-main-content .notice-board-list .detail .sub-info { margin-top: 0.42857rem; }

.culture-main-content .notice-board-list .detail .btn-arrow { position: absolute; top: 1.42857rem; right: 1.42857rem; }

.culture-main-content .good-morning-parts .tab li { min-height: 4.57143rem; }

.culture-main-content .good-morning-parts .culture-board-list .list { border-bottom: 0; padding-bottom: 0; }

.culture-main-content .category-parts .btn-group { padding: 0 1.42857rem; }

.culture-main-content .hot-issue-parts .product-list .item, .culture-main-content .ranking-parts .product-list .item { padding-bottom: 1px; width: 11.42857rem; }

.culture-main-content .hot-issue-parts .product-list .thumbnail, .culture-main-content .ranking-parts .product-list .thumbnail { padding-bottom: 125%; }

.culture-main-content .hot-issue-parts .section-title-wrap { margin-top: 2.14286rem; }

.culture-main-content .hot-issue-parts .detail .title-wrap { margin-bottom: 0; }

.culture-main-content .hot-issue-parts .detail .sub-txt { overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.culture-main-content .hot-issue-parts .detail .point-tag { margin-top: 0.85714rem; }

.culture-main-content .special-sale-parts .culture-board-list { position: relative; padding: 1.42857rem; padding-bottom: 0; }

.culture-main-content .special-sale-parts .culture-board-list:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 14.28571rem; background-color: #337bf6; }

.culture-main-content .special-sale-parts .culture-board-list .list-thumb { left: 0; }

.culture-main-content .special-sale-parts .culture-board-list .list { margin: 0; padding: 0; border: none; }

.culture-main-content .special-sale-parts .culture-board-list .detail { padding-bottom: 0; }

.culture-main-content .special-sale-parts .culture-board-list .detail .title, .culture-main-content .special-sale-parts .culture-board-list .detail .sub-title, .culture-main-content .special-sale-parts .culture-board-list .detail .date { color: #fff; }

.culture-main-content .special-sale-parts .culture-board-list .detail .sub-info { margin-top: 1.28571rem; position: relative; }

.culture-main-content .special-sale-parts .culture-board-list .detail .sub-info .info { display: block; color: #fff; }

.culture-main-content .special-sale-parts .culture-board-list .detail .sub-info .info + .info { padding: 0; }

.culture-main-content .invite-parts { padding-bottom: 2.85714rem; }

.culture-main-content .invite-parts .btn-group { padding: 0 5.71429rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.culture-main-content .invite-parts .invite-wrap { overflow: hidden; text-align: center; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/img-culture-invite-bg.png") left top no-repeat; background-size: 100% 14.28571rem; }

.culture-main-content .invite-parts .invite-wrap .culture-invite-slider { padding: 1.42857rem 0; }

.culture-main-content .invite-parts .invite-wrap .invite-event { margin-top: 2.07143rem; font-size: 1.28571rem; color: #fff; }

.culture-parts.menu-list { padding: 1.42857rem; padding-top: 0; }

.culture-parts.menu-list:before, .culture-parts.menu-list:after { content: ""; display: table; }

.culture-parts.menu-list:after { clear: both; }

.culture-parts.menu-list li { float: left; width: 33.3333%; text-align: center; margin: 0.57143rem 0; }

.culture-parts.menu-list li a { position: relative; display: block; padding-top: 4.85714rem; font-size: 1rem; color: #222222; }

.culture-parts.menu-list li a:after { position: absolute; content: ''; width: 4.57143rem; height: 4.57143rem; top: 0; left: 50%; margin-left: -2.28571rem; border-radius: 50%; }

.culture-parts.menu-list li a.musical:after { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-musical.png") center center no-repeat; background-size: 4.57143rem 4.57143rem; }

.culture-parts.menu-list li a.concert:after { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-concert.png") center center no-repeat; background-size: 4.57143rem 4.57143rem; }

.culture-parts.menu-list li a.theater:after { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-theater.png") center center no-repeat; background-size: 4.57143rem 4.57143rem; }

.culture-parts.menu-list li a.classic-dance:after { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-classic-dance.png") center center no-repeat; background-size: 4.57143rem 4.57143rem; }

.culture-parts.menu-list li a.exhibition-leisure:after { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-exhibition-leisure.png") center center no-repeat; background-size: 4.57143rem 4.57143rem; }

.culture-parts.menu-list li a.child-family:after { background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/ico-child-family.png") center center no-repeat; background-size: 4.57143rem 4.57143rem; }

.invite-date-wrap .invite-group { padding: 1.42857rem; padding-bottom: 2.14286rem; }

.invite-date-wrap .article { margin-bottom: 0.71429rem; font-size: 1.14286rem; font-weight: 600; }

.invite-date-wrap .selectric-wrapper, .invite-date-wrap .btn-group { margin-top: 0.71429rem; }

.invite-date-wrap.infomation { border-top: 1px solid #e5e5e5; }

.invite-date-wrap.infomation .invite-group { padding: 1.42857rem; padding-top: 2.85714rem; }

.invite-date-wrap.infomation .invite-group .data-txt { line-height: 1.57143rem; }

.mystamp-package { position: relative; background-color: #f7b7d3; text-align: center; color: #fff; }

.mystamp-package .btn-ico.share { position: absolute; top: 1.42857rem; right: 1.42857rem; background-color: #fff; padding: 0.57143rem; background-size: 1.71429rem 1.71429rem; border-radius: 50%; }

.mystamp-package .my-stamp-text h3 { font-size: 1.42857rem; }

.mystamp-package .my-stamp-text p { margin-top: 0.71429rem; font-size: 1rem; font-weight: 400; }

.mystamp-package .my-stamp-wrap { padding: 2.85714rem 1.42857rem 4.28571rem; }

.mystamp-package .my-stamp-wrap .stamp-area { padding: 1.42857rem; border-radius: 0.85714rem; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mystamp-package .my-stamp-wrap .stamp-count { position: relative; text-align: left; color: #000; }

.mystamp-package .my-stamp-wrap .stamp-count .title { font-size: 1.14286rem; font-weight: 400; text-transform: uppercase; }

.mystamp-package .my-stamp-wrap .stamp-count .count { position: absolute; right: 0; top: 0; line-height: 1.57143rem; }

.mystamp-package .stamp-attach-list:before, .mystamp-package .stamp-attach-list:after { content: ""; display: table; }

.mystamp-package .stamp-attach-list:after { clear: both; }

.mystamp-package .stamp-attach-list a { display: block; color: #fff; }

.mystamp-package .stamp-attach-list li { float: left; width: 50%; padding: 1.42857rem 0.71429rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mystamp-package .stamp-attach-list li:nth-child(n + 3):nth-child(-n + 5) { width: 33.33%; padding: 0; }

.mystamp-package .stamp-attach-list li .align-center { margin: 0 auto; }

.mystamp-package .stamp-attach-list li .align-right { float: right; }

.mystamp-package .stamp-attach-list .stamp-attach { position: relative; width: 5.71429rem; height: 5.71429rem; border-radius: 50%; overflow: hidden; }

.mystamp-package .stamp-attach-list .stamp-attach .sticker-info { position: absolute; width: 100%; height: 100%; left: 0; top: 50%; margin-top: -1rem; height: 2rem; line-height: 2rem; background-color: rgba(34, 34, 34, 0.5); font-size: 0.71429rem; }

.culture-content.happy-stamp .common-sort-box .count-wrap { margin-top: 0.14286rem; }

.culture-content.happy-stamp .common-sort-box .filter-wrap { float: right; }

.culture-content.happy-stamp .common-sort-box .filter-area { float: left; }

.culture-content.happy-stamp .common-sort-box .filter-area + .filter-area { margin-left: 1.71429rem; }

.culture-content.event-participation .user-form-wrap { padding: 1.42857rem; }

.culture-content.event-participation .user-form-wrap .terms-content { margin-top: 1.42857rem; }

.happy-stamp-list .list + .list { margin-top: 0.71429rem; }

.happy-stamp-list .list.on .list-thumb:after { content: ''; position: absolute; top: 0; right: 0; z-index: 2; width: 4.57143rem; height: 4.57143rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/culture/img-label-ing.png"); background-size: 4.57143rem; background-repeat: no-repeat; background-position: 0 0; background-color: transparent; }

.happy-stamp-list .list.on .list-thumb img { z-index: 1; }

.happy-stamp-list .list-thumb { padding-bottom: 55.5%; }

.happy-stamp-detail { max-width: 720px; margin: 0 auto; }

.happy-stamp-detail .brand-info-wrap { position: relative; padding: 30px 50px; }

.happy-stamp-detail .brand-info-wrap .img-area img { display: block; margin: 0 auto; width: 100%; max-width: 18.57143rem; }

.happy-stamp-detail .brand-info-wrap .share { position: absolute; top: 50%; margin-top: -0.85714rem; right: 20px; }

.performance-info-wrap .performance-info-area { padding: 2.14286rem 1.42857rem; background-repeat: no-repeat; background-size: cover; background-position: 0 0; background-color: transparent; }

.performance-info-wrap .thumbnail-wrap { width: 8.57143rem; margin: 0 auto; -webkit-box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.2); box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.2); }

.performance-info-wrap .thumbnail-wrap .thumbnail { position: relative; overflow: hidden; width: 100%; height: 0; padding-bottom: 120%; }

.performance-info-wrap .detail-wrap { margin-top: 1.42857rem; color: #fff; }

.performance-info-wrap .detail-area { text-align: center; }

.performance-info-wrap .detail-area .title { font-size: 1.28571rem; font-weight: bold; letter-spacing: -0.36px; word-break: break-all; }

.performance-info-wrap .detail-area .name { display: block; margin-top: 0.14286rem; font-size: 1rem; letter-spacing: -0.28px; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.performance-info-wrap .detail-area .detail { display: block; margin-top: 0.71429rem; font-size: 0.85714rem; letter-spacing: -0.24px; opacity: 0.7; word-break: break-all; }

.performance-info-wrap .detail-area .detail + .detail { margin-top: 0.14286rem; }

.performance-info-wrap .sub-detail-area { margin-top: 1.42857rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.performance-info-wrap .sub-detail-area .sub { padding: 0 0.5rem; font-size: 0.85714rem; letter-spacing: -0.24px; opacity: 0.7; }

.performance-info-wrap .sub-detail-area .sub + .sub { position: relative; }

.performance-info-wrap .sub-detail-area .sub + .sub:before { display: inline-block; content: ''; width: 1px; position: absolute; height: 0.71429rem; top: 0.28571rem; left: 0; background-color: rgba(255, 255, 255, 0.7); }

.performance-info-wrap.reserve { position: relative; padding-bottom: 1.85714rem; }

.performance-info-wrap.reserve .performance-info-area { padding: 2.85714rem 1.42857rem 5rem; }

.performance-info-wrap.reserve .reserve-btn { position: absolute; bottom: 0; z-index: 2; width: 100%; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }

.performance-info-wrap.reserve .reserve-btn .btn { width: 14.28571rem; }

.performance-info-wrap.reserve .detail-area .name { margin-top: 0.57143rem; }

.performance-info-wrap.reserve .detail-area .detail { margin-top: 0.57143rem; }

.performance-details-section { margin-top: 2.14286rem; }

.performance-details-wrap { margin-top: 1.42857rem; }

.performance-detail-default .data-list.relate-list > li + li { margin-top: 1.42857rem; }

.performance-detail-default .data-list.relate-list .data-table { margin-top: 20px; }

.performance-detail-default .accordion-container .accordion-list.explanation-work { padding-bottom: 0; }

.performance-detail-default .accordion-container .accordion-list.explanation-work .accordion-body { display: block; }

.performance-detail-default .accordion-container .accordion-list.explanation-work .explanation-area { max-height: 17.14286rem; overflow: hidden; }

.performance-detail-default .accordion-container .accordion-list.explanation-work .explanation-area img { display: block; width: 100%; max-width: 100%; margin: 0 auto; }

.performance-detail-default .accordion-container .accordion-list.explanation-work.open .explanation-area { max-height: inherit; }

.performance-detail-theater .store-map { position: relative; padding-bottom: 56.25%; }

.performance-detail-theater .store-map iframe { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; }

.store-search-content .result-empty-wrap.customer { padding-bottom: 1.42857rem; }

.store-search-content .result-empty-wrap.customer .empty-title { font-size: 1rem; }

.store-search-content .result-empty-wrap.customer .btn-group { margin: 11.85714rem 1.42857rem 0; }

.store-search-content .store-map-wrapper { width: 100%; height: 11.78571rem; overflow: hidden; }

.store-search-content .store-map-wrapper .map-area { width: 100%; height: 100%; background-color: #f0f0f0; }

.store-search-content.nearby .board-header-wrap { padding: 1.14286rem 1.42857rem 0; }

.store-search-content .btn-more { border-top: none; }

.store-detail-content .store-map-wrapper { width: 100%; height: 28.28571rem; overflow: hidden; }

.store-detail-content .store-map-wrapper .map-area { width: 100%; height: 100%; background-color: #f0f0f0; }

.store-search-box { padding: 1.14286rem 1.42857rem 0; }

.store-search-box .search-info { display: block; margin-top: 0.42857rem; font-size: 0.85714rem; color: #888888; word-break: break-all; }

.store-list-wrap .store-description-box { border-bottom: 1px solid #ddd; }

.store-list-wrap .store-description-box .title-area .name { font-size: 1rem; }

.store-list-wrap .store-description-box .address-area { margin-top: 0.42857rem; }

.store-list-wrap .store-description-box .order-info-area { margin-top: 0.42857rem; }

.store-list-wrap .store-description-box:first-child { border-top: 1px solid #ddd; }

.store-description-box { padding: 1.42857rem; }

.store-description-box .store-detail > a { display: block; }

.store-description-box .title-area:before, .store-description-box .title-area:after { content: ""; display: table; }

.store-description-box .title-area:after { clear: both; }

.store-description-box .title-area .name { display: inline-block; float: left; padding-right: 1.42857rem; font-weight: bold; font-size: 1.28571rem; word-break: break-all; }

.store-description-box .title-area .distance { display: inline-block; float: right; font-size: 1rem; color: #fe4f27; word-break: break-all; }

.store-description-box .address-area { margin-top: 0.57143rem; font-size: 1rem; color: #222222; word-break: break-all; }

.store-description-box .order-info-area { margin-top: 0.57143rem; }

.store-description-box .order-info-area .info { display: inline-block; vertical-align: middle; font-size: 0.85714rem; color: #888888; word-break: break-all; }

.store-description-box .order-info-area .info .ico { display: inline-block; padding-right: 0.14286rem; vertical-align: text-bottom; width: 2.14286rem; height: 1.42857rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-happyorder.png"); background-size: 2.14286rem 1.42857rem; background-position: 0 0; background-repeat: no-repeat; background-color: transparent; }

.store-description-box .store-btn-wrap:before, .store-description-box .store-btn-wrap:after { content: ""; display: table; }

.store-description-box .store-btn-wrap:after { clear: both; }

.store-description-box .store-btn-wrap .btn-area { float: left; margin-top: 1.42857rem; margin-right: 1.14286rem; text-align: center; }

.store-description-box .store-btn-wrap .btn-area .ico { display: inline-block; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; width: 2.85714rem; height: 2.85714rem; background-repeat: no-repeat; background-size: 2.85714rem; background-position: 0 0; background-color: transparent; }

.store-description-box .store-btn-wrap .btn-area.phone .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-phone.png"); }

.store-description-box .store-btn-wrap .btn-area.reservation .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-reservation.png"); }

.store-description-box .store-btn-wrap .btn-area.coupon .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-coupon.png"); }

.store-description-box .store-btn-wrap .btn-area.time .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-time.png"); }

.store-description-box .store-btn-wrap .btn-area.customer { float: right; margin-right: 0; }

.store-description-box .store-btn-wrap .btn-area.customer .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-customer.png"); }

.store-description-box .store-btn-wrap .btn-area.customer.on .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/store/ico-store-customer-on.png"); }

.store-description-box .store-btn-wrap .btn-area.customer.on .type { color: #fe4f27; }

.store-description-box .store-btn-wrap .btn-area > a { display: block; }

.store-description-box .store-btn-wrap .btn-area .type { display: block; margin-top: 0.14286rem; font-size: 0.71429rem; }

.benefits-plus-content .section-parts.plus-interval { padding-top: 1.42857rem; }

.benefits-plus-content .section-parts .selector-wrap { padding: 1.42857rem; padding-top: 0; }

.benefits-plus-content .video-title-wrap { padding-top: 1.42857rem; padding-bottom: 7.42857rem; text-align: center; background: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/img-video-title-bg.svg") bottom center no-repeat; background-size: auto 100%; }

.benefits-plus-content .video-title-wrap .title { font-weight: 300; font-size: 1.42857rem; letter-spacing: -0.02857rem; }

.benefits-plus-content .notice-board-list .detail { border-bottom: none; }

.happy-story-content .section-parts.magazine { padding-bottom: 3.42857rem; }

.happy-story-content .brand-logo-area { height: 1.57143rem; }

.happy-story-content .brand-logo-area img { display: block; margin: 0 auto; height: 100%; }

.happy-story-content .common-board-content .board-article-content { padding: 0; }

/* .happy-story-content .common-board-content .board-article { padding: 0; } */

.happy-magazine .common-board-content .board-article { padding: 0; }

.happy-magazine .sub-info .post-list-wrap { margin: 0 8px 0 0;border-radius: 8px;border: solid 0.2777778vw #dddddd;margin-left: 19px;width: 115px;height: 13.3333333vw;padding-top: 0;box-sizing: border-box;}

.happy-magazine .sub-info-bottom  {display:flex;align-items:center; justify-content: space-between; height: 24.4444444vw;box-sizing: border-box;padding: 0 5.5555556vw;font-size: 3.8888889vw;color: #000000;}
.happy-magazine .sub-info-bottom  .number{font-size: 3.8888889vw;color: #000000;height:6.1111111vw ;line-height: 6.1111111vw;}
.happy-magazine .sub-info-bottom  .post-list-wrap{width: 31.9444444vw; height: 13.3333333vw;margin-top:0;border: 0.2777778vw solid #dddddd;box-sizing: border-box;align-items: center;display:flex;border-radius: 2.2222222vw;}
.happy-magazine .sub-info-bottom  .post-list-wrap .post-list .like{background:transparent url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-heart.png) no-repeat;margin-left: 8.3333333vw;width: 6.1111111vw;height:6.1111111vw ;background-position:center;}
.happy-magazine .sub-info-bottom  .btn-ico{width: 54.7222222vw; height: 13.3333333vw;border: 0.2777778vw solid #dddddd; box-sizing:border-box;border-radius: 2.2222222vw;}

.happy-magazine .sub-info-bottom  .post-list-wrap .post-list .like.off{margin-left: 10.2777778vw;background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like.svg);width: 5.111111vw;height: 6.111111vw;}
.happy-magazine .sub-info-bottom  .post-list-wrap .post-list .like.on{margin-left: 10.2777778vw;background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like-on.svg);width: 5.111111vw;height: 6.111111vw;}

.happy-magazine .sub-info-bottom  .btn-ico.share a{background-image:none;border: none;text-indent:6.9444444vw;text-align: center;}
.happy-magazine .sub-info-bottom  .btn-ico.share a::after{content: '친구에게 공유하기';text-align: center;line-height:330%;}
.happy-magazine .sub-info-bottom  .btn-ico.share {display:flex;background-image:none;background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-upload.png);background-size: 5.5555556vw 5.5555556vw;background-position:85%;}

.happy-story .common-board-content .board-article { padding: 0; }

.happy-story .sub-info .post-list-wrap { margin: 0 8px 0 0;border-radius: 8px;border: solid 0.2777778vw #dddddd;margin-left: 19px;width: 115px;height: 13.3333333vw;padding-top: 0;box-sizing: border-box;}

.happy-story .sub-info-bottom  {display:flex;align-items:center; justify-content: space-between; height: 24.4444444vw;box-sizing: border-box;padding: 0 5.5555556vw;font-size: 3.8888889vw;color: #000000;}
.happy-story .sub-info-bottom  .number{font-size: 3.8888889vw;color: #000000;height:6.1111111vw ;line-height: 6.1111111vw;}
.happy-story .sub-info-bottom  .post-list-wrap{width: 31.9444444vw; height: 13.3333333vw;margin-top:0;border: 0.2777778vw solid #dddddd;box-sizing: border-box;align-items: center;display:flex;border-radius: 2.2222222vw;}
.happy-story .sub-info-bottom  .post-list-wrap .post-list .view{margin-left: 4.333333vw;background-size: 4.8611111vw 4.8611111vw;width: 6.111111vw;height:6.1111111vw ;background-position:center;}

.happy-story .sub-info-bottom  .post-list-wrap .post-list .like.off{margin-left: 10.2777778vw;background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like.svg);width: 5.111111vw;height: 6.111111vw;}
.happy-story .sub-info-bottom  .post-list-wrap .post-list .like.on{margin-left: 10.2777778vw;background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-like-on.svg);width: 5.111111vw;height: 6.111111vw;}
.happy-story .sub-info-bottom  .post-list-wrap .post-list .talk{margin-left: 4.333333vw;width: 5.111111vw;height: 6.111111vw;}

.happy-story .sub-info-bottom  .btn-ico{width: 54.7222222vw; height: 13.3333333vw;border: 0.2777778vw solid #dddddd; box-sizing:border-box;border-radius: 2.2222222vw;}

.happy-story .sub-info-bottom  .btn-ico.share a{background-image:none;border: none;text-indent:6.9444444vw;text-align: center;}
.happy-story .sub-info-bottom  .btn-ico.share a::after{content: '친구에게 공유하기';text-align: center;line-height:330%;}
.happy-story .sub-info-bottom  .btn-ico.share {display:flex;background-image:none;background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/review/ico-upload.png);background-size: 5.5555556vw 5.5555556vw;background-position:85%;}




.select-year-box { position: relative; padding: 1.85714rem 4.28571rem; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; }

.select-year-box .year { font-weight: bold; font-size: 1.71429rem; letter-spacing: -0.48px; }

.select-year-box .btn-ico { position: absolute; z-index: 2; top: 50%; margin-top: -0.85714rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-left-48x48.png"); }

.select-year-box .btn-ico.btn-before { left: 1.42857rem; }

.select-year-box .btn-ico.btn-next { right: 1.42857rem; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.select-year-box .btn-ico.off { opacity: 0.4; }

.vote-button-wrap .btn { height: 2rem; line-height: 2rem; border-radius: 2rem; }

.product-versus-wrap { padding: 2.85714rem 0; }

.product-versus-wrap .section-title-wrap { margin: 0 2.14286rem; padding: 0; }

.product-versus-wrap .section-title-wrap .title-area .title { font-size: 1.42857rem; }

.product-versus-wrap .timer-period-wrap { margin-top: 1.14286rem; }

.product-versus-wrap .product-versus-area { margin: 0 1.42857rem; }

.product-versus-wrap .vote-content-wrap { margin-left: 1.42857rem; margin-right: 1.42857rem; }

.product-versus-wrap.versus-detail .product-versus-area { margin-top: 2.85714rem; }

.product-versus-wrap.combination-detail .combination-product-wrap { margin-top: 2.85714rem; }

.product-versus-wrap.combination-detail .combination-product-wrap .combination-thumbnail { margin: 0 2.85714rem; }

.product-versus-wrap.combination-detail .special-product-wrap { margin-top: 0.85714rem; }

.product-versus-area:before, .product-versus-area:after { content: ""; display: table; }

.product-versus-area:after { clear: both; }

.product-versus-area .combination-product-wrap { position: relative; float: left; width: 50%; }

.product-versus-area .combination-product-wrap:first-child { z-index: 1; }

.product-versus-area .combination-product-wrap:last-child { z-index: 2; }

.product-versus-area .combination-product-wrap:last-child .combination-thumbnail { position: relative; }

.product-versus-area .combination-product-wrap:last-child .combination-thumbnail:before { display: inline-block; content: ''; position: absolute; z-index: 3; top: 50%; margin-top: -1.71429rem; left: -1.71429rem; width: 3.42857rem; height: 3.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/ico-vs.png") center center no-repeat; background-size: 3.42857rem; }

.product-versus-area + .vote-percent-wrap { margin-top: 1.42857rem; }

.combination-product-wrap .combination-thumbnail .thumb-inner { position: relative; width: 100%; height: 0; padding-bottom: 100%; overflow: hidden; border-radius: 50%; -webkit-box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.04); box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.04); background-color: #fff; }

.combination-product-wrap .combination-detail { margin-top: 0.71429rem; }

.combination-product-wrap .name-area { margin-top: 0.71429rem; }

.combination-product-wrap .name-area .name { padding: 0 1.42857rem; font-weight: 600; font-size: 1.14286rem; letter-spacing: -0.32px; text-align: center; word-break: break-all; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.combination-product-wrap .vote-button-wrap { margin-top: 0.85714rem; text-align: center; }

.vote-percent-wrap { position: relative; border-radius: 0.85714rem; overflow: hidden; background-color: #fff; }

.vote-percent-wrap .vote-percent-group.showing { position: absolute; top: 0; left: 0; z-index: 2; }

.vote-percent-wrap .vote-percent-area { position: relative; z-index: 1; width: 320px; }

.vote-percent-wrap .vote-percent-area:before, .vote-percent-wrap .vote-percent-area:after { content: ""; display: table; }

.vote-percent-wrap .vote-percent-area:after { clear: both; }

.vote-percent-wrap .vote-percent-area.reverse .count-area .percent, .vote-percent-wrap .vote-percent-area.reverse .count-area .count { color: #fff; }

.vote-percent-wrap .vote-percent-area .count-area { display: inline-block; position: relative; z-index: 3; padding: 0.5rem 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.vote-percent-wrap .vote-percent-area .count-area .percent { display: block; font-weight: bold; font-size: 1.14286rem; }

.vote-percent-wrap .vote-percent-area .count-area .count { display: block; font-size: 0.85714rem; color: #666666; }

.vote-percent-wrap .vote-percent-area .count-area.end { position: absolute !important; right: 0; }

.vote-percent-wrap .vote-percent-area + .vote-percent-area { position: absolute; top: 0; right: 0; z-index: 2; }

.vote-percent-wrap .vote-percent-area + .vote-percent-area .count-area { text-align: right; }

.timer-period-wrap { text-align: center; }

.timer-period-wrap .timer-area { display: inline-block; padding: 0.42857rem 1.14286rem; vertical-align: middle; font-weight: 600; color: #888888; font-size: 1rem; border-radius: 1.21429rem; background-color: #fff; }

.timer-period-wrap .timer-area .clock { display: inline-block; width: 1.14286rem; height: 1.14286rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; margin-top: -0.14286rem; margin-right: 0.28571rem; vertical-align: middle; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-time.svg") 0 0 no-repeat; background-size: 1.14286rem; }

.timer-period-wrap .timer-area .period { color: #337bf6; }

.board-edit-btn-wrap { margin: 1.42857rem 1.42857rem 2.85714rem; text-align: right; }

.board-edit-btn-wrap .btn-text + .btn-text { margin-left: 1.21429rem; }

.league-writing-form { padding: 1.42857rem 0 4.85714rem; }

.league-writing-form .fieldset .field { padding: 0 1.42857rem; }

.league-writing-form .fieldset .field > .label { margin-bottom: 0.85714rem; font-weight: 600; }

.league-writing-form .fieldset .field.disabled { position: relative; opacity: 0.3; }

.league-writing-form .fieldset .field.disabled:after { display: block; position: absolute; content: ''; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; }

.league-writing-form .fieldset .field.disabled.field-add:after { display: none; }

.league-writing-form .fieldset .field.disabled.field-add .item:after { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; z-index: 3; background-color: rgba(221, 221, 221, 0.5); }

.league-writing-form .fieldset .field.disabled.field-add .btn-remove { display: none; }

.league-writing-form .fieldset .field.field-add { padding: 0; }

.league-writing-form .fieldset .field.field-add .label { padding: 0 1.42857rem; }

.league-writing-form .fieldset .field.field-add .label .em { display: inline-block; margin-left: 0.28571rem; font-weight: normal; font-size: 1rem; }

.league-writing-form .fieldset .field.field-add .file-add-module .item:first-child { margin-left: 1.42857rem; }

.league-writing-form .fieldset .field.field-add .file-add-module .item:last-child { margin-right: 1.42857rem; }

.league-writing-form .selector-wrap .asset { margin-bottom: 1.42857rem; }

.league-writing-form .selector-wrap .asset .sub-txt { display: block; margin-top: 0.28571rem; font-size: 0.85714rem; color: #888888; }

.league-writing-form .selector-wrap .asset:last-child { margin-bottom: 0; }

.special-product-wrap { padding-top: 2.14286rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.special-product-wrap.line-type { padding-left: 1.42857rem; padding-right: 1.42857rem; }

.special-product-wrap.line-type .special-product-bundle { margin-top: 0.71429rem; padding-bottom: 0.71429rem; border-bottom: 1px solid #e5e5e5; }

.special-product-wrap.line-type .special-product-bundle:last-child { border-bottom: none; }

.special-product-wrap.box-type { padding: 1.42857rem; }

.special-product-wrap.box-type .special-product-bundle { padding: 1.42857rem; margin-bottom: 0.57143rem; background-color: #fff; border-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.special-product-wrap.box-type .special-product-bundle .bundle-bedge { top: 1.21429rem; left: 1.42857rem; }

.special-product-wrap.box-type .special-product-bundle .bundle-thumb { left: 1.42857rem; top: 1.42857rem; }

.special-product-wrap.check-type { padding-top: 0; }

.special-product-wrap.check-type .special-product-bundle { margin-bottom: 0.71429rem; margin-left: 2.42857rem; }

.special-product-wrap.check-type .special-product-bundle:first-child { margin-top: 1.42857rem; }

.special-product-wrap.check-type .selector-wrap { width: 1.71429rem; height: 1.71429rem; top: 50%; margin-top: -0.85714rem; left: -2.42857rem; }

.special-product-wrap.check-type .selector-wrap .asset { margin-bottom: 0; }

.special-product-wrap.check-type .bundle-thumb { width: 7.42857rem; height: 7.42857rem; }

.special-product-wrap.check-type .bundle-detail { padding-left: 8.14286rem; min-height: 7.42857rem; }

.special-product-wrap.check-type .bundle-detail .company-name { font-size: 1rem; }

.special-product-wrap.check-type .bundle-detail .product-name { margin-top: 0.28571rem; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; white-space: inherit; font-size: 1.14286rem; }

.special-product-wrap.check-type .bundle-detail .counter { display: block; margin-top: 0.85714rem; font-size: 1.28571rem; font-weight: 600; color: #fe4f27; }

.special-product-bundle { position: relative; }

.special-product-bundle .bundle-bedge { display: block; position: absolute; left: 0; top: -0.21429rem; width: 1.71429rem; height: 1.71429rem; padding-right: 0.28571rem; line-height: 1.71429rem; z-index: 1; color: #fff; text-align: center; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/bg-label.svg") left top no-repeat; }

.special-product-bundle .vote-button-wrap { position: absolute; right: 1.35714rem; bottom: 1.35714rem; }

.special-product-bundle .selector-wrap { position: absolute; right: 0; top: 0; }

.special-product-bundle .selector-wrap .label { padding: 0; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.special-product-bundle .bundle-thumb { position: absolute; left: 0; top: 0; width: 5.71429rem; height: 5.71429rem; overflow: hidden; }

.special-product-bundle .bundle-detail { padding-left: 7.14286rem; min-height: 5.71429rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.special-product-bundle .bundle-detail .company-name { color: #666666; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.special-product-bundle .bundle-detail .product-name { margin-top: 0.42857rem; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.special-product-bundle .bundle-detail .counter { display: block; margin-top: 0.85714rem; font-size: 1.28571rem; font-weight: 600; color: #fe4f27; }

.vote-content-wrap { position: relative; height: 4rem; margin-top: 1.42857rem; border-radius: 0.85714rem; background-color: #fff; overflow: hidden; }

.vote-content-wrap { position: relative; }

.vote-content-wrap .default-bar, .vote-content-wrap .active-bar { position: absolute; top: 0; left: 0; width: 100%; }

.vote-content-wrap .bar-wrap { position: relative; height: 4rem; }

.vote-content-wrap .first-score { position: absolute; left: 4%; top: 0.64286rem; }

.vote-content-wrap .second-score { position: absolute; right: 4%; top: 0.64286rem; text-align: right; }

.vote-content-wrap .percent { display: block; font-size: 1.14286rem; font-weight: bold; }

.vote-content-wrap .vote { display: block; font-size: 0.85714rem; }

.vote-content-wrap .active-bar { overflow: hidden; width: 0; }

.vote-content-wrap .active-bar .bar-wrap { background-color: #fe4f27; }

.vote-content-wrap .active-bar .bar-wrap span { color: #fff; }

.sweet-companion-wrap { text-align: center; margin: 0 -1.42857rem; padding-bottom: 12.85714rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/img-story-companion.png") center bottom no-repeat; background-size: 100% auto; }

.sweet-companion-wrap .sweet-title { padding-top: 1.42857rem; font-size: 1.42857rem; font-weight: 600; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/img-story-heart.png") center bottom no-repeat; background-size: contain; }

.sweet-companion-wrap .temperature-num { margin-top: 1.42857rem; font-size: 2.85714rem; font-weight: 900; color: #fe4f27; }

.sweet-companion-wrap .sweet-info-area { display: inline-block; margin: 0.28571rem auto 0; text-align: center; }

.sweet-companion-wrap .sweet-info-area:before, .sweet-companion-wrap .sweet-info-area:after { content: ""; display: table; }

.sweet-companion-wrap .sweet-info-area:after { clear: both; }

.sweet-companion-wrap .sweet-info-area .sweet-info { float: left; position: relative; display: block; padding: 0 0.71429rem; color: #666666; }

.sweet-companion-wrap .sweet-info-area .sweet-info:after { position: absolute; content: ''; right: 0; top: 50%; width: 1px; height: 0.85714rem; margin-top: -0.35714rem; background-color: #e5e5e5; }

.sweet-companion-wrap .sweet-info-area .sweet-info:last-child:after { display: none; }

.sweet-companion-wrap .sweet-bar-wrap { position: relative; margin: 2.71429rem 3.01429rem 1.42857rem; }

.sweet-companion-wrap .sweet-bar-wrap:after { position: absolute; content: ''; top: -0.85714rem; left: 50%; height: 0.42857rem; width: 92%; margin-left: -42%; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/bg-bar.svg"); background-repeat: repeat-x; background-size: 1.5rem 0.42857rem; }

.sweet-companion-wrap .sweet-bar-wrap .temperature-bar { position: relative; padding-left: 2.28571rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.sweet-companion-wrap .sweet-bar-wrap .temperature-bar:before { position: absolute; content: ''; left: 0; top: -0.42857rem; width: 2.28571rem; height: 2.28571rem; z-index: 2; border-radius: 50%; background-color: #fe4f27; }

.sweet-companion-wrap .sweet-bar-wrap .temperature-bar:after { position: absolute; content: ''; left: 1.14286rem; top: 0; width: 1.14286rem; height: 100%; background-color: #fe4f27; }

.sweet-companion-wrap .sweet-bar-wrap .temp-bar-area { position: relative; width: 100%; height: 1.42857rem; border-top-right-radius: 1.42857rem; border-bottom-right-radius: 1.42857rem; background-color: #ffe4be; overflow: hidden; }

.sweet-companion-wrap .sweet-bar-wrap .temp-bar-area .temp-bar { position: absolute; left: 0; top: 0; width: 0; height: 100%; background-color: #fe4f27; -webkit-animation: widthKeyframe 1s ease-out 1 alternate; animation: widthKeyframe 1s ease-out 1 alternate; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price { margin-top: 1rem; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price:before, .sweet-companion-wrap .sweet-bar-wrap .temp-price:after { content: ""; display: table; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price:after { clear: both; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price .temp-now, .sweet-companion-wrap .sweet-bar-wrap .temp-price .temp-goal { display: inline-block; font-size: 0.85714rem; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price .temp-now strong, .sweet-companion-wrap .sweet-bar-wrap .temp-price .temp-goal strong { font-weight: 600; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price .temp-now { float: left; }

.sweet-companion-wrap .sweet-bar-wrap .temp-price .temp-goal { float: right; }

.companion-info-wrap { background-color: #fb9806; border-radius: 0.85714rem; }

.companion-info-wrap dl, .companion-info-wrap dt, .companion-info-wrap dd { color: #fff; font-weight: 300; }

.companion-info-wrap dl strong, .companion-info-wrap dt strong, .companion-info-wrap dd strong { font-weight: 600; }

.companion-info-wrap .description-list { padding: 1.42857rem; }

.companion-info-wrap .description-list dl { margin-bottom: 0.71429rem; }

.companion-info-wrap .description-list dl:last-child { margin-bottom: 0; }

.companion-info-wrap .description-list dd { text-align: right; }

.companion-info-wrap .ico-sweet { display: inline-block; width: 1.71429rem; height: 1.71429rem; margin-right: 0.28571rem; background-color: transparent; background-repeat: no-repeat; background-position: center center; vertical-align: middle; }

.companion-info-wrap .ico-sweet.comment { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/ico-sweet-comment.svg"); background-size: cover; }

.companion-info-wrap .ico-sweet.cheer { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/ico-sweet-cheer.svg"); background-size: cover; }

.companion-info-wrap .ico-sweet.share { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/story/ico-sweet-share.svg"); background-size: cover; }

.horizontal-scroll { height: 100%; }

.product-category-wrap { overflow: hidden; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; }

.product-category-wrap .category-list li { width: 4.57143rem; height: 4.57143rem; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; background-color: #f5f5f5; text-align: center; padding: 0 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.product-category-wrap .category-list li .cate { color: #666666; font-weight: 600; }

.product-category-wrap .category-list li .all-cate { display: inline-block; margin: 0 auto; }

.product-category-wrap .category-list li .all-cate .line { display: block; width: 0.85714rem; height: 0.07143rem; background-color: #222222; }

.product-category-wrap .category-list li .all-cate .line + .line { margin-top: 0.28571rem; }

.product-category-wrap .category-list li.on { border-right: none; background-color: #fff; }

.product-category-wrap .category-list li.on .cate { color: #fe4f27; }

.product-category-wrap .category-list li.on .all-cate .line { background-color: #fe4f27; }

.product-category-wrap .category-content { padding: 1.42857rem; padding-top: 0; }

.happy-zip-list { border-bottom: 0.57143rem solid #e5e5e5; }

.happy-zip-list .list { border-top: 0.57143rem solid #e5e5e5; }

.happy-zip-list .list-thumb { position: relative; width: 100%; height: 12.85720rem; overflow: hidden; }

@-webkit-keyframes widthKeyframe { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); }
    100% { -webkit-transform: scaleX(1); transform: scaleX(1); } }

@keyframes widthKeyframe { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); }
    100% { -webkit-transform: scaleX(1); transform: scaleX(1); } }

.earn-points-content .section-title-wrap { margin-top: 4.28571rem; }

.earn-points-content .what-clover { padding: 1.42857rem; text-align: right; }

.earn-points-content .what-clover a { display: inline-block; font-weight: 600; }

.earn-points-content .what-clover .exclamation-mark { display: inline-block; width: 1.42857rem; height: 1.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-exclamation-mark.svg") left top no-repeat; background-size: cover; vertical-align: middle; }

.earn-points-content .survey-wrap { padding: 1.42857rem; border-bottom: 1px solid #e5e5e5; text-align: center; }

.earn-points-content .survey-wrap .ico-survey { width: 5.71429rem; }

.earn-points-content .survey-wrap .survey-txt { margin-top: 0.71429rem; }

.earn-points-content .survey-wrap .btn-group { padding: 1.42857rem 0; }

.earn-points-content .survey-wrap.survey-none { padding: 2.85714rem 0; border-bottom: none; }

.earn-points-content .survey-wrap.survey-none .survey-txt { font-size: 1.14286rem; color: #888888; }

.attendance-check-img { position: relative; height: 22.85714rem; overflow: hidden; }

.attendance-check-wrap { padding: 0 1.42857rem; }

.attendance-check-wrap .attendance-check:before, .attendance-check-wrap .attendance-check:after { content: ""; display: table; }

.attendance-check-wrap .attendance-check:after { clear: both; }

.attendance-check-wrap .attendance-check li { position: relative; float: left; width: 20%; padding-bottom: 20%; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-clover-default.svg") left top no-repeat; }

.attendance-check-wrap .attendance-check li .date { position: absolute; display: block; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 1.14286rem; color: #fff; }

.attendance-check-wrap .attendance-check li.on { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-clover-on.svg"); }

.attendance-check-wrap .attendance-check li.special { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-specialday-default.svg") left top no-repeat; }

.attendance-check-wrap .attendance-check li.special .date { padding-top: 1rem; }

.attendance-check-wrap .attendance-check li.special.on { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-specialday-on.svg"); }

.attendance-check-wrap .attendance-check li.special.on .date { color: #fe4f27; }


/* .daily-stamp-wrap { padding: 0 1.42857rem; -webkit-touch-callout:none; touch-action: none;-ms-user-select: none;-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none;user-select: none;} */

.member-clover-wrap { padding-top: 1.14286rem; }

.member-clover-wrap .special-day-area { text-align: center; }

.member-clover-wrap .special-day-area .gift-icon { display: inline-block; width: 1.71429rem; height: 1.71429rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-special-day.svg") left top no-repeat; vertical-align: text-bottom; }

.member-clover-wrap .special-day-area > span { font-size: 1.14286rem; font-weight: 600; }

.member-clover-wrap .special-day-area > p { margin-top: 0.28571rem; font-size: 0.85714rem; color: #666666; }

.member-clover-wrap .special-day-area .highlight { position: relative; display: inline-block; }

.member-clover-wrap .special-day-area .highlight:after { position: absolute; content: ''; left: 0; bottom: 0; z-index: -1; width: 100%; height: 0.57143rem; opacity: 0.5; background-color: #ffe91e; }

.member-clover-wrap .clover-btn-area { padding: 1.42857rem; padding-bottom: 0; }

.attendance-check-alarm-wrap { margin-top: 2.85714rem; }

.attendance-check-alarm-wrap a { position: relative; display: block; padding: 1.21429rem 1.42857rem; background-color: #f5f5f5; }

.attendance-check-alarm-wrap a:after { content: ''; position: absolute; top: 50%; margin-top: -0.57143rem; right: 1.42857rem; width: 1.14286rem; height: 1.14286rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/ico-arrow-bk-32x32.png") left top no-repeat; background-size: 1.14286rem 1.14286rem; }

.attendance-check-alarm-wrap .check-alarm-area { position: relative; padding-left: 2rem; }

.attendance-check-alarm-wrap .check-alarm-area .alarm-title { font-size: 1.14286rem; font-weight: 600; }

.attendance-check-alarm-wrap .check-alarm-area .alarm-sub { margin-top: 0.28571rem; font-size: 0.85714rem; color: #888888; }

.attendance-check-alarm-wrap .check-alarm-area:after { content: ''; position: absolute; width: 1.71429rem; height: 1.71429rem; left: 0; top: 0; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-check-alarm.svg") left top no-repeat; background-size: cover; }

.benefit-plus-parts .contents-list-bundle-video { padding-bottom: 0; }

.benefit-plus-parts .contents-list-bundle-video .common-bundle-list + .common-bundle-list { padding-top: 1.42857rem;}

.benefit-plus-parts .contents-list-bundle-video .common-bundle-list .item .title-wrap .title { font-size: 1.42857rem;}

.benefit-plus-parts .btn-group { padding: 1.42857rem; padding-bottom: 0; }

.gray-bg-wrap { background-color: #f5f5f5; }

.today-happy-index { margin: 0 2.85714rem; }

.today-happy-index:before, .today-happy-index:after { content: ""; display: table; }

.today-happy-index:after { clear: both; }

.today-happy-index li { float: left; width: 50%; text-align: center; }

.today-happy-index li .today-luck, .today-happy-index li .today-tarot { display: block; width: 8.57143rem; height: 8.57143rem; margin: 0 auto 0.85714rem; border-radius: 50%; }

.today-happy-index li .today-luck { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-luck.svg") center center no-repeat; background-size: 8.57143rem 8.57143rem; }

.today-happy-index li .today-tarot { background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-tarot.svg") center center no-repeat; background-size: 8.57143rem 8.57143rem; }

.today-happy-index li a { display: block; font-size: 1.14286rem; color: #222222; }

.point-saving-article { min-height: 12.85714rem; padding: 1.42857rem 1.42857rem 8.57143rem; margin: 0 auto; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/img-point-clover-bg.svg"); background-size: 25.71429rem 12.85714rem; background-repeat: no-repeat; background-color: transparent; background-position: center bottom; -webkit-box-sizing: border-box; box-sizing: border-box; }

.point-saving-article .article-text { font-weight: 300; font-size: 1.42857rem; text-align: center; word-break: break-all; }

.point-saving-article.store { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/img-point-store-bg.svg"); }

.point-saving-article.survey { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/img-point-survey-bg.svg"); }

.point-saving-info { padding: 2.85714rem 1.42857rem 4.28571rem; }

.point-saving-info .data-list { padding: 1.42857rem 0; }

.survey-product-wrap .survey-info-area { padding-top: 2.85714rem; padding-bottom: 0.71429rem; text-align: center; }

.survey-product-wrap .survey-info-area .info-title { font-size: 1.42857rem; font-weight: 600; line-height: 1.85714rem; }

.survey-product-wrap .survey-info-area .info-sub { margin-top: 0.71429rem; color: #666666; line-height: 1.57143rem; }

.survey-product-area { padding: 0 1.42857rem; }

.survey-product-area .survey-list li { position: relative; padding-bottom: 1.42857rem; margin-top: 1.42857rem; border-bottom: 1px solid #e5e5e5; }

.survey-product-area .survey-list li:last-child { border-bottom: none; }

.survey-product-area .survey-list li a { display: block; }

.survey-product-area .survey-list .survey-detail { min-height: 7.42857rem; padding-right: 8.57143rem; }

.survey-product-area .survey-list .survey-detail .detail-title { margin-top: 0.57143rem; font-size: 1.14286rem; font-weight: 600; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.survey-product-area .survey-list .survey-detail .detail-sub { padding-top: 0.28571rem; color: #888888; font-weight: 400; }

.survey-product-area .survey-list .survey-detail .detail-sub .text { margin-top: 0.28571rem; word-break: break-all; }

.survey-product-area .survey-list .survey-detail .brand-logo img{ height: 1.28571rem;}

.survey-product-area .survey-list .survey-thumb { width: 7.42857rem; height: 7.42857rem; position: absolute; right: 0; top: 0; overflow: hidden; }

.this-survey-product { padding: 1.42857rem 1.42857rem 2.85714rem; }

.this-survey-product .survey-thumb { display: block; width: 8.57143rem; height: 8.57143rem; position: relative; overflow: hidden; margin: 0 auto; }

.this-survey-product .survey-title { margin-top: 0.71429rem; font-weight: 600; font-size: 1.42857rem; letter-spacing: -0.4px; text-align: center; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.survey-product-form-wrap { padding: 2.85714rem 1.42857rem 4.28571rem; border-top: 1px solid #e5e5e5; }

.survey-product-form-wrap .survey-article + .survey-article { margin-top: 4.28571rem; }

.survey-product-form-wrap .article-title .title { font-weight: 600; font-size: 1.14286rem; letter-spacing: -0.32px; word-break: break-all; }

.survey-product-form-wrap .article-detail { margin-top: 20px; }

.survey-product-form-wrap .article-detail .selector-wrap .asset { margin-bottom: 0; }

.survey-product-form-wrap .article-detail .selector-wrap .asset + .asset { margin-top: 1.42857rem; }

.survey-product-form-wrap .article-detail .textarea-box { height: 11.42857rem; border: 1px solid #bbbbbb; }

.survey-product-form-wrap .article-detail .textarea-box textarea { width: 100%; height: 100%; padding: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; border-color: transparent; }

.survey-product-form-wrap .article-detail .textarea-box textarea:focus { outline: none; border-color: transparent; }

.survey-product-form-wrap .article-detail.select .field > .label label { font-weight: 600; font-size: 1rem; letter-spacing: -0.28px; word-break: break-all; }

.survey-product-form-wrap .article-detail.select .field + .field > .label:first-child { margin-top: 1.42857rem; margin-bottom: 0.71429rem; }

.survey-product-form-wrap .btn-group { margin-top: 2.85714rem; }

.stage-info-wrapper { padding: 0 1.42857rem; }

.stage-info-wrapper.bg { padding-top: 4.28571rem; padding-bottom: 2.85714rem; background-color: #f7f7f7; }

.stage-info-wrapper.bg .stage-list-wrap { border-radius: 0.85714rem; background-color: #fff; }

.stage-info-wrapper.bg .stage-area { margin: 0 1.42857rem; }

.stage-info-wrapper .stage-title { margin-bottom: 1.42857rem; font-weight: bold; font-size: 1.71429rem; letter-spacing: -0.96px; text-align: center; word-break: break-all; }

.stage-info-wrapper .stage-list-wrap .stage-area { padding-top: 2.28571rem; padding-bottom: 2.28571rem; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }

.stage-info-wrapper .stage-list-wrap .stage-area .stage { display: inline-block; width: 2.28571rem; height: 2.28571rem; font-weight: bold; font-size: 1rem; line-height: 2.28571rem; color: #fff; background-color: #fe4f27; border-radius: 50%; }

.stage-info-wrapper .stage-list-wrap .stage-area .text-area { margin-top: 1.14286rem; }

.stage-info-wrapper .stage-list-wrap .stage-area .text-area .title { font-weight: 600; font-size: 1.42857rem; letter-spacing: -0.4px; word-break: break-all; }

.stage-info-wrapper .stage-list-wrap .stage-area .text-area .description { margin-top: 0.57143rem; font-size: 1.14286rem; letter-spacing: -0.32px; color: #666666; word-break: break-all; }

.stage-info-wrapper .stage-list-wrap .stage-area .text-area .description.caution { margin-top: 0.71429rem; font-size: 1rem; color: #fe4f27; }

.stage-info-wrapper .stage-list-wrap .stage-area .img-area { margin-top: 1.42857rem; }

.stage-info-wrapper .stage-list-wrap .stage-area .img-area img { display: block; max-width: 100%; margin: 0 auto; }

.stage-info-wrapper .stage-list-wrap .stage-area + .stage-area { border-top: dashed 1px #e5e5e5; }

.coupon-saving-wrapper { padding: 2rem 1.42857rem 1.42857rem; background-color: #337bf6; }

.coupon-saving-wrapper .intro-text-wrap { padding-left: 1rem; padding-right: 9.28571rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/img-point-app.svg") right bottom no-repeat; background-size: 9.14286rem 4.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.coupon-saving-wrapper .intro-text-wrap .text { font-size: 1.42857rem; padding-left: -0.4px; color: #fff; word-break: break-all; }

.coupon-saving-wrapper .intro-text-wrap .text.sub { font-size: 1rem; font-weight: 300; opacity: 0.5; }

.coupon-saving-wrapper .intro-text-wrap .text + .text { margin-top: 0.28571rem; }

.coupon-saving-wrapper .intro-text-wrap ~ .saving-box-wrap { margin-top: 2rem; }

.coupon-saving-wrapper .saving-box-wrap { position: relative; padding: 2.28571rem 1.42857rem 1.42857rem; border-radius: 0.85714rem; background-color: #fff; -webkit-box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.1); box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.1); -webkit-box-sizing: border-box; box-sizing: border-box; }

.coupon-saving-wrapper .saving-box-wrap:before, .coupon-saving-wrapper .saving-box-wrap:after { display: inline-block; position: absolute; content: ''; top: 2.85714rem; left: -0.57143rem; width: 1.14286rem; height: 1.14286rem; border-radius: 50%; background-color: #337bf6; }

.coupon-saving-wrapper .saving-box-wrap:after { left: auto; right: -0.57143rem; }

.coupon-saving-wrapper .saving-box-wrap .title { font-size: 1.42857rem; font-weight: bold; text-align: center; letter-spacing: -0.8px; word-break: break-all; }

.benefit-saving-wrapper { padding: 1.42857rem 1.42857rem 2.85714rem; }

.benefit-saving-wrapper .title { font-weight: 300; font-size: 1.42857rem; letter-spacing: -0.4px; text-align: center; word-break: break-all; }

.saving-form-wrap { margin-top: 2rem; }

.saving-form-wrap .field + .field > .insert:first-child { margin-top: 0.71429rem; }

.saving-form-wrap .brand-select-btn { position: relative; display: block; padding: 1rem 0.71429rem; border: 1px solid #bbbbbb; color: #888888; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 1rem; }

.saving-form-wrap .brand-select-btn:before { display: inline-block; content: ''; position: absolute; width: 1.14286rem; height: 1.14286rem; top: 50%; margin-top: -0.57143rem; right: 1.14286rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-down-32x32.png"); background-size: contain; background-repeat: no-repeat; background-position: 0 0; background-color: transparent; }

.saving-form-wrap .btn-group { margin-top: 1.42857rem; }

.saving-form-wrap .btn-group.btn-apply { margin-top: 0.71429rem; }

.saving-form-wrap .btn.barcode .ico { width: 2.28571rem; height: 2.28571rem; margin-right: 0.14286rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/point/ico-barcode.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: contain; background-color: transparent; }

.saving-detail-wrap { margin-top: 2rem; }

.saving-detail-wrap .saving-detail-area { margin: 0 1.42857rem; border: 1px solid #000; border-radius: 1rem; -webkit-box-shadow: 4px 4px 20px 3px rgba(0, 0, 0, 0.05); box-shadow: 4px 4px 20px 3px rgba(0, 0, 0, 0.05); -webkit-box-sizing: border-box; box-sizing: border-box; }

.saving-detail-wrap .saving-detail-area .title { margin-top: 2.14286rem; padding: 0.92857rem 0; font-size: 1.14286rem; letter-spacing: -0.32px; background-color: #f5f5f5; }

.saving-detail-wrap .saving-detail-area .num { margin: 1.07143rem 0 2.14286rem; display: block; font-weight: 600; font-size: 1.71429rem; text-align: center; word-break: break-all; letter-spacing: -0.48px; }

.saving-detail-wrap .data-list { margin-top: 1.42857rem; }

.partnership-brand-wrapper { padding-top: 4.28571rem; }

.partnership-brand-wrapper .partnership-title { margin-bottom: 1.42857rem; font-weight: bold; font-size: 1.71429rem; letter-spacing: -0.96px; text-align: center; word-break: break-all; }

.partnership-brand-list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.partnership-brand-list .brand { position: relative; width: 33.3%; height: 0; padding-bottom: 33.3%; overflow: hidden; }

.partnership-brand-list .brand .thumb-wrap { position: absolute; width: 100%; height: 100%; }

.account-points-wrap { padding: 2.85714rem 1.42857rem; background-color: #fe4f27; -webkit-box-sizing: border-box; box-sizing: border-box; }

.account-points-wrap .point-box-wrap { display: table; table-layout: fixed; width: 100%; }

.account-points-wrap .point-box-wrap .point-box { width: 50%; display: table-cell; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }

.account-points-wrap .point-box-wrap .point-box .type { display: block; font-size: 1rem; color: #fff; }

.account-points-wrap .point-box-wrap .point-box .detail { display: block; margin-top: 0.28571rem; font-weight: bold; font-size: 1.28571rem; letter-spacing: -0.64px; word-break: break-all; color: #fff; }

.account-points-wrap .point-box-wrap .point-box + .point-box { border-left: 1px solid rgba(255, 255, 255, 0.2); }

.account-points-wrap .btn-group { margin-top: 1.71429rem; }

.account-points-wrap .btn-group .btn { border-color: #fff; color: #fff; }

.point-commercial-wrap .point-commercial-list { padding: 1.42857rem 1.42857rem 8.3333333vw; background-color: #f5f5f5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.point-commercial-wrap .point-commercial-list li { padding: 9.4444444vw 0px 13.0555556vw 0px; background-color: #fff; border-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.point-commercial-wrap .point-commercial-list li + li { margin-top: 1.71429rem; }

.point-commercial-wrap .point-commercial-list .link-area { text-align: left; float: left;margin:-4.4444444vw auto;max-width: 65%;width: 100%;padding-left:2.7777778vw}

.point-commercial-wrap .point-commercial-list .link-area .btn-arrow { font-weight: 600; font-size: 4.4444444vw; }

.point-commercial-wrap .point-commercial-list .description { margin-top: 0.27143rem; text-align: left; font-size: 3.3333333vw; color: #666666;}

.point-commercial-wrap .point-commercial-list .img-area img { display: block; margin: -8.6111111vw 2.2222222vw 0px 0px;width: 100%; float: right;max-width: 29%;}

/* 작은 이미지 css */
/* .point-commercial-wrap .point-commercial-list { padding: 1.42857rem 1.42857rem 8.3333333vw; background-color: #f5f5f5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.point-commercial-wrap .point-commercial-list li { padding: 9.4444444vw 0px 13.0555556vw 0px; background-color: #fff; border-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.point-commercial-wrap .point-commercial-list li + li { margin-top: 1.71429rem; }

.point-commercial-wrap .point-commercial-list .link-area { text-align: left; float: left;margin:-4.4444444vw auto;max-width: 70%;width: 100%;padding-left:2.7777778vw}

.point-commercial-wrap .point-commercial-list .link-area .btn-arrow { font-weight: 600; font-size: 4.7222222vw; }

.point-commercial-wrap .point-commercial-list .description { margin-top: 0.27143rem; text-align: left; font-size: 3.6111111vw; color: #666666;}

.point-commercial-wrap .point-commercial-list .img-area img { display: block; margin: -5vw auto;width: 100%; float: right;max-width: 29%;} */



.finnq-contents .point-saving-article { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/finnq/img-payment-bg.svg"); }

.finnq-payment-wrap .finnq-payment-form { margin-top: 1.71429rem; padding: 0 1.42857rem; }

.finnq-payment-wrap .finnq-payment-form .btn-group { margin-top: 1.42857rem; }

.finnq-payment-wrap .finnq-info-wrap { margin-top: 4.28571rem; }

.finnq-payment-wrap .finnq-info-wrap .logo-img-area { margin: 0 auto; max-width: 11.42857rem; }

.finnq-payment-wrap .finnq-info-wrap .logo-img-area img { display: block; max-width: 100%; }

.finnq-payment-wrap .finnq-info-wrap .info-area { margin-top: 0.28571rem; }

.finnq-payment-wrap .finnq-info-wrap .info-area .info-detail { font-size: 0.85714rem; text-align: center; color: #888888; word-break: break-all; }

.finnq-payment-wrap .finnq-info-wrap .accordion-container { margin-top: 2.14286rem; }

.finnq-payment-wrap .finnq-info-wrap .accordion-container .accordion-list { border-bottom: 0; background-color: #f5f5f5; }

.finnq-payment-wrap .finnq-preparing { position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100%;}

.finnq-payment-wrap .finnq-preparing .finnq-icon {margin: 0 auto; display: flex; align-self: center; height: 100%;}

.happy-clip-contents { padding-bottom: 3.71429rem; }

.representative-clip-section .contents-list-bundle-video { padding-bottom: 1.42857rem; }

.representative-clip-section .common-bundle-list .details { padding: 0.85714rem 1.42857rem; }

.representative-clip-section .common-bundle-list .details .title-wrap .title { font-size: 1.14286rem; max-height: none; display: block; }

.representative-clip-section .btn-group { padding: 0 1.42857rem 2.85714rem; }

.clip-list-bundle { padding: 0 1.42857rem; }

.clip-list-bundle .clip-list-head { margin-top: 2.85714rem; }

.clip-list-bundle .clip-list-head .title { font-weight: 600; font-size: 1.71429rem; letter-spacing: -0.48px; word-break: break-all; }

.clip-list-bundle .clip-list-wrap { margin-top: 1.42857rem; }

.contents-list-bundle-video.clip-list { padding: 1.14286rem 0; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.contents-list-bundle-video.clip-list .common-bundle-list .item { display: table; table-layout: fixed; }

.contents-list-bundle-video.clip-list .common-bundle-list .thumbnail-area { display: table-cell; vertical-align: middle; width: 10rem; }

.contents-list-bundle-video.clip-list .common-bundle-list .thumbnail-area .ico-video { top: 0.42857rem; right: 0.42857rem; width: 1.42857rem; height: 1.42857rem; background-size: 1.42857rem; }

.contents-list-bundle-video.clip-list .common-bundle-list .details-area { display: table-cell; vertical-align: middle; }

.contents-list-bundle-video.clip-list .common-bundle-list .details-area .details { padding-top: 0; padding-left: 0.85714rem; }

.contents-list-bundle-video.clip-list .common-bundle-list .details-area .title-wrap .title { display: block; display: -webkit-box; max-height: 4.5em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; font-size: 1.14286rem; letter-spacing: -0.48px; }

.contents-list-bundle-video.clip-list + .contents-list-bundle-video { border-top: 0; }

.always-hold-down-wrap.happy-signal-wrapper { z-index: 900; padding-left: 20px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.always-hold-down-wrap.happy-signal-wrapper .happy-signal-contents { position: relative; width: 100%; height: 88px; padding-top: 20px; padding-bottom: 20px; overflow: hidden; border-radius: 0.85714rem 0 0 0; background: -webkit-gradient(linear, left top, right top, from(#372EC1), to(#cf62f6)); background: -o-linear-gradient(left, #372EC1, #cf62f6); background: linear-gradient(to right, #372EC1, #cf62f6); -webkit-box-sizing: border-box; box-sizing: border-box; }

.always-hold-down-wrap.happy-signal-wrapper .signal-control-btn { position: absolute; top: 32px; right: 0.85714rem; z-index: 2; }

.always-hold-down-wrap.happy-signal-wrapper .signal-control-btn .btn-open { display: block; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; width: 24px; height: 24px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-white-24x24.svg") 0 0 no-repeat; background-size: 24px; border: 0; }

.always-hold-down-wrap.happy-signal-wrapper .signal-title-wrap { margin-top: 0; padding-right: 2.85714rem; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }

.always-hold-down-wrap.happy-signal-wrapper .signal-title-wrap .title { display: inline-block; position: relative; padding: 0 2rem; font-weight: normal; font-size: 16px; text-align: left; color: #fff; word-break: break-all; }

.always-hold-down-wrap.happy-signal-wrapper .signal-title-wrap .title:before, .always-hold-down-wrap.happy-signal-wrapper .signal-title-wrap .title:after { opacity: 1; display: inline-block; content: ''; position: absolute; width: 20px; height: 20px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-quotes-20x20.svg") center center no-repeat; background-size: 20px; }

.always-hold-down-wrap.happy-signal-wrapper .signal-title-wrap .title:before { top: -1px; left: 0; }

.always-hold-down-wrap.happy-signal-wrapper .signal-title-wrap .title:after { bottom: 2px; right: 0; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.detail-filter-menu { -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; transition: 0.2s ease; }

.detail-filter-menu.happy-signal.open { -webkit-transition: 0.2s ease; -o-transition: 0.2s ease; transition: 0.2s ease; }

.detail-filter-menu.happy-signal .filter-header { height: 3rem; border-bottom: none; background-color: transparent; }

.detail-filter-menu.happy-signal .filter-body { padding: 0; background-color: transparent; }

.detail-filter-menu.happy-signal .happy-signal-contents { position: relative; width: 100%; height: 480px; overflow: hidden; border-radius: 0.85714rem 0.85714rem 0 0; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/img-signal-bg.png") center center no-repeat; background-size: cover; -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-control-btn { padding: 12px; padding-bottom: 0; -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-control-btn:before, .detail-filter-menu.happy-signal .happy-signal-contents .signal-control-btn:after { content: ""; display: table; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-control-btn:after { clear: both; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-control-btn .btn-close { position: static; display: inline-block; float: right; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; width: 32px; height: 32px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-w-32x32.svg") 0 0 no-repeat; background-size: 32px; border: 0; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-logo-wrap { position: relative; width: 72px; height: 48px; margin: 0 auto; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-title-wrap { margin-top: 12px; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-title-wrap .title { display: inline-block; position: relative; padding: 0 20px; font-weight: normal; font-size: 24px; text-align: center; color: #fff; word-break: break-all; }

@media (max-width: 380px) { .detail-filter-menu.happy-signal .happy-signal-contents .signal-title-wrap .title { font-size: 20px; } }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-form-wrap { padding-top: 58px; padding-bottom: 52px; overflow: hidden; position: relative; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-form-wrap:before { display: inline-block; position: absolute; content: ''; top: 28px; left: 50%; margin-left: -8px; width: 16px; height: 2px; background-color: #fff; opacity: 0.8; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-select-wrapper .set-area:first-child { margin-left: 30px; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-select-wrapper .set-area:last-child { margin-right: 30px; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-select-wrapper .set { padding-top: 5px; margin-bottom: 5px; padding-right: 10px; position: relative; white-space: nowrap; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-select-wrapper .set input[type="radio"] { width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-select-wrapper .set input[type="radio"]:checked + label { background-color: rgba(255, 255, 255, 0.5); }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-select-wrapper .set label { display: block; padding: 0 20px; font-weight: 300; font-size: 18px; line-height: 36px; color: #fff; border-radius: 18px; background-color: rgba(255, 255, 255, 0.1); word-break: break-all; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-btn-group { margin-top: 60px; }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-btn-group .btn-sign { display: block; position: relative; z-index: 2; width: 56px; height: 56px; margin: 0 auto; font-weight: 300; font-size: 16px; line-height: 56px; border-radius: 50%; border: 0; color: #fff; background-color: #fe69fe; -webkit-box-shadow: 0 16px 16px 0 rgba(0, 0, 0, 0.04); box-shadow: 0 16px 16px 0 rgba(0, 0, 0, 0.04); }

.detail-filter-menu.happy-signal .happy-signal-contents .signal-btn-group .btn-sign:before { display: inline-block; position: absolute; content: ''; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1; width: 100px; height: 100px; border-radius: 50%; background-color: #e96be9; opacity: 0.2; -webkit-box-shadow: 0 16px 16px 0 rgba(0, 0, 0, 0.04); box-shadow: 0 16px 16px 0 rgba(0, 0, 0, 0.04); -webkit-animation: signalButton 2s infinite alternate; animation: signalButton 2s infinite alternate; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }

@-webkit-keyframes signalButton { from { width: 100px;
    height: 100px; }
    to { width: 56px;
        height: 56px; } }

@keyframes signalButton { from { width: 100px;
    height: 100px; }
    to { width: 56px;
        height: 56px; } }

.happy-brand-list li { position: relative; padding: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.happy-brand-list li .brand-thumb { position: absolute; left: 1.42857rem; top: 50%; margin-top: -2.85714rem; width: 5.71429rem; height: 5.71429rem; border-radius: 50%; overflow: hidden; font-size: 1.28571rem; font-weight: 400; }

.happy-brand-list li .brand-detail { padding-left: 7.14286rem; }

.happy-brand-list li .brand-detail .brand-name { font-weight: 600; font-size: 1.14286rem; }

.happy-brand-list li .brand-detail .brand-info { margin-top: 0.28571rem; min-height: 3rem; font-size: 1rem; color: #666666; word-break: break-all; }

.happy-brand-list li .brand-detail .sub-info { margin-top: 0.71429rem; }

.happy-brand-list li .brand-detail .sub-info + .sub-info { margin-top: 0.14286rem; }

.happy-brand-list li .brand-detail .sub-info .icon-area { display: inline-block; vertical-align: middle; margin-right: 1vw; text-align: right; width: 21vw; }

.happy-brand-list li .brand-detail .sub-info .icon-area img,
.happy-brand-list li .brand-detail .sub-info .icon-area i { width: 2rem; height: 2rem; display: inline-block; background-size: cover; background-position: center center; background-color: transparent; background-repeat: no-repeat; }

.happy-brand-list li .brand-detail .sub-info .icon-area img + img,
.happy-brand-list li .brand-detail .sub-info .icon-area i + i { margin-left: -0.42857rem; }

.happy-brand-list li .brand-detail .sub-info .icon-area i.pink { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-pink.png"); }

.happy-brand-list li .brand-detail .sub-info .icon-area i.gold { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-gold.png"); }

.happy-brand-list li .brand-detail .sub-info .icon-area i.black { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-platinum.png"); }

.happy-brand-list li .brand-detail .sub-info .icon-area i.friend { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/membership/ic_friend_s.svg"); }
.happy-brand-list li .brand-detail .sub-info .icon-area i.family { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/membership/ic_family_s.svg"); }
.happy-brand-list li .brand-detail .sub-info .icon-area i.vip { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/membership/ic_vip_s.svg"); }
.happy-brand-list li .brand-detail .sub-info .icon-area i.royal { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/membership/ic_royal_s.svg"); }

.happy-brand-list li .brand-detail .sub-info .info { display: inline-block; font-weight: 600; font-size: 1rem; }

.happy-brand-list li .brand-detail .sub-info .info .discount { display: inline-block; width: 15.5vw; text-align: right; }

.happy-brand-list li .btn-group { position: absolute; z-index: 1; top: 1.42857rem; right: 1.42857rem; }

.happy-brand-list li .btn-group .ico-home { display: inline-block; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; width: 2.28571rem; height: 2.28571rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-home-round.svg") 0 0 no-repeat; background-size: 2.28571rem; border: 0; }

.happy-brand-list li + li { border-top: 1px solid #e5e5e5; }

.mylist-list dl { position: relative; margin-top: 1.42857rem; padding-bottom: 1.42857rem; border-bottom: 1px solid #e5e5e5; }

.mylist-list dl:last-child { border-bottom: none; }

.mylist-list dl.empty-list { margin-top: 2.85714rem; padding: 0 0.71429rem 2.85714rem; text-align: center; color: #888888; font-size: 1rem; }

.mylist-list dl dt { width: 65%; }

.mylist-list dl dt strong { font-size: 1.14286rem; font-weight: 600; }

.mylist-list dl dt > p { margin-top: 0.28571rem; font-size: 1rem; font-weight: 400; color: #888888; }

.mylist-list dl dt > .date { display: block; margin-top: 0.42857rem; color: #666666; font-size: 0.85714rem; font-weight: lighter; }

.mylist-list dl dd { width: 35%; text-align: right; }

.mylist-list dl dd strong { display: block; font-weight: 600; }

.mylist-list dl dd strong + strong { margin-top: 0.42857rem; }

.mylist-list dl dd > span { display: block; margin-top: 0.57143rem; font-size: 0.85714rem; font-weight: 400; }

.mylist-list dl dd.wide { width: 100%; margin-top: 1.42857rem; text-align: center; }

.mylist-list .btn.writing { color:#222; font-size: 1rem; font-weight:500; }

.mylist-list .btn.writing .ico { width: 2.28571rem; height: 2.28571rem; margin-right: 0.14286rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-writing.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: contain; background-color: transparent; }

.mylist-list.wide dl, .mylist-list.wide dt, .mylist-list.wide dd { width: 100%; }

.mylist-list .btn-store { border: 0; padding: 0; outline: 0; margin-top: 1.57143rem; background-color: transparent; }

.mylist-list .btn-store > .ico { display: inline-block; width: 1.42857rem; height: 1.42857rem; border-radius: 50%; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-store-on.svg") left top no-repeat; background-size: 1.42857rem 1.42857rem; vertical-align: middle; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.mylist-list .btn-store.on > .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-store-on.svg"); -webkit-animation: heartIn 0.6s linear 1 alternate; animation: heartIn 0.6s linear 1 alternate; }

.mylist-list .btn-store.off > .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-store-off.svg"); }

.mylist-list .btn-store > .type { margin-top: 0.14286rem; display: inline-block; vertical-align: middle; font-size: 0.85714rem; }

.mylist-list .smart-receipt { height: 1.71429rem; line-height: 1.57142rem; margin-top: 1.42857rem; padding: 0 0.85714rem; font-size: 0.85714rem; border-radius: 0.57143rem; }

.mypoint-status-wrap { color: #fff; padding: 0 1.42857rem 2.85714rem; background-color: #FF5F00; }

.mypoint-status-wrap .point-status { position: relative; padding: 2.85714rem 9.14286rem 2.28571rem 0; }

.mypoint-status-wrap .point-status > .title { font-size: 1rem; font-weight: 400; }

.mypoint-status-wrap .point-status > .num { display: block; margin-top: 0.28571rem; font-size: 2.28571rem; line-height: 3.35714rem; }

.mypoint-status-wrap .point-status .point-img-wrap { display: block; position: absolute; right: 0; top: 0; width: 10rem; height: 9.14286rem; }

.mypoint-status-wrap .mypoint-area { position: relative; }

.mypoint-status-wrap .mypoint-area > .num { position: absolute; right: 0; }

.mypoint-status-wrap .mypoint-area .disapear-wrap { position: relative; display: inline-block; color: #fff; }

.mypoint-status-wrap .mypoint-area .disapear-wrap > .title, .mypoint-status-wrap .mypoint-area .disapear-wrap > .ico-info { display: inline-block; vertical-align: middle; }

.mypoint-status-wrap .mypoint-area .disapear-wrap > .ico-info { position: relative; width: 1.42857rem; height: 1.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-warning-w-20x20.svg") left top no-repeat; background-size: 1.42857rem 1.42857rem; }

.mypoint-status-wrap .mypoint-area .disapear-wrap > .ico-info:before { display: none; position: absolute; content: ''; bottom: -0.71429rem; left: 50%; margin-left: -0.57143rem; width: 0; height: 0; border-right: 0.57143rem solid transparent; border-left: 0.57143rem solid transparent; border-bottom: 0.57143rem solid #337bf6; }

.mypoint-status-wrap .mypoint-area .disapear-wrap:after { display: none; position: absolute; content: attr(txt-data); left: 0; bottom: -2.85714rem; width: 21rem; padding: 0.57143rem 1.14286rem 0.5rem; font-size: 0.85714rem; border-radius: 0.28571rem; background-color: #337bf6; z-index: 9; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mypoint-status-wrap .mypoint-area .disapear-wrap:active:after, .mypoint-status-wrap .mypoint-area .disapear-wrap:hover:after { display: block; }

.mypoint-status-wrap .mypoint-area .disapear-wrap:active > .ico-info:before, .mypoint-status-wrap .mypoint-area .disapear-wrap:hover > .ico-info:before { display: block; }

.mypoint-status-wrap > .btn-group { margin-top: 1.71429rem; }

.mypoint-status-wrap > .btn-group .btn { color: #fff; border-color: #fff; background-color: transparent; }

.mypoint-container-wrap { padding: 0 1.42857rem; border-top: 1px solid #e5e5e5; }

.my-notice-infomation { padding: 1.14286rem 1.42857rem; background-color: #e5e5e5; }

.my-notice-infomation .data-list li { font-size: 0.85714rem; }

.mycoupon-item-area .dday-area { position: absolute; left: 1.42857rem; top: 0; z-index: 2; width: 4.57143rem; height: 2.28571rem; text-align: center; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-badge-dday-65x32.svg") left top no-repeat; background-size: 4.57143rem 2.28571rem; -webkit-transform: translate(0, -0.28571rem); -ms-transform: translate(0, -0.28571rem); transform: translate(0, -0.28571rem); }

.mycoupon-item-area .dday-area .dday { display: inline-block; line-height: 2rem; padding-right: 0.28571rem; font-size: 0.85714rem; font-weight: 600; color: #fff; letter-spacing: -0.02rem; }

.mycoupon-item-area .mycoupon-important { background-color: #fff; border: 1px solid #e5e5e5; border-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mycoupon-item-area > .item-list li { position: relative; margin-top: 0.42857rem; }

.mycoupon-item-area > .item-list li a { display: block; }

.mycoupon-item-area .mycoupon-thumb { position: relative; width: 4.57143rem; height: 4.57143rem; overflow: hidden; }

.mycoupon-item-area .mycoupon-sub-info:after, .mycoupon-item-area .mycoupon-sub-info:before { position: absolute; left: 0; content: ''; width: 16px; height: 9px; border: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; -webkit-transform: translate(-8px, 0); -ms-transform: translate(-8px, 0); transform: translate(-8px, 0); }

.mycoupon-item-area .mycoupon-sub-info:after { top: -1px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; border-top-color: #fff; }

.mycoupon-item-area .mycoupon-sub-info:before { bottom: -1px; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-color: #fff; }

.mycoupon-item-area .btn-group { padding-top: 1.42857rem; }

.mycoupon-item-area.mycoupon { padding: 0 1.42857rem 1.42857rem; }

.mycoupon-item-area.mycoupon > .item-list li { margin-bottom: 0.71429rem; }

.mycoupon-item-area.mycoupon .mycoupon-important { padding: 1.85714rem 4.85714rem 1.85714rem 1.42857rem; }

.mycoupon-item-area.mycoupon .mycoupon-sub-info { position: absolute; width: 4.85714rem; height: 100%; right: 0; top: 0; border-left: 1px dashed #e5e5e5; }

.mycoupon-item-area.mycoupon .mycoupon-sub-info .mycoupon-info { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.mycoupon-item-area.mycoupon .mycoupon-sub-info .mycoupon-info > .em { display: block; max-width: 1.85714rem; margin: 0 auto; text-align: center; font-size: 0.85714rem; word-break: break-all; }

.mycoupon-item-area.mycoupon .mycoupon-sub-info .mycoupon-info > .ico.mycoupon { display: block; margin: 0 auto 0.35714rem; width: 2.28571rem; height: 1.57143rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-coupon-32x22.svg") left top no-repeat; background-size: 2.28571rem 1.57143rem; }

.mycoupon-item-area.mycoupon .mycoupon-detail { min-height: 6.28571rem; padding-left: 5.28571rem; padding-right: 0.71429rem; }

.mycoupon-item-area.mycoupon .mycoupon-detail .em.slightly { color: #888888; }

.mycoupon-item-area.mycoupon .mycoupon-detail .detail-title { margin-top: 0.14286rem; font-size: 1rem; font-weight: 600; display: block; display: -webkit-box; height: 4.2em; max-height: 4.2em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.mycoupon-item-area.mycoupon .mycoupon-detail .detail-sub { padding-top: 0.57143rem; color: #888888; font-size: 0.85714rem; font-weight: 400; word-break: break-all; }

.mycoupon-item-area.mycoupon .mycoupon-thumb { position: absolute; left: 1.42857rem; top: 2.85714rem; width: 4.57143rem; height: 4.57143rem; border: 0.7143rem solid transparent; box-sizing: border-box; }

.mycoupon-item-area.mycoupon .time-coupon-date { display: none; position: absolute; bottom: -3.14286rem; left: 0; width: 100%; height: 4.28571rem; z-index: -1; padding-top: 1.92857rem; border-bottom-left-radius: 0.85714rem; border-bottom-right-radius: 0.85714rem; border: 1px solid #e5e5e5; text-align: center; background-color: #f5f5f5; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mycoupon-item-area.mycoupon .time-coupon-date > .ico.coupon { display: inline-block; width: 1.42857rem; height: 1.42857rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-time-20x20.svg") left top no-repeat; background-size: 1.42857rem 1.42857rem; vertical-align: middle; }

.mycoupon-item-area.mycoupon li.disabled { position: relative; }

.mycoupon-item-area.mycoupon li.disabled:after { position: absolute; content: ''; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.3); }

.mycoupon-item-area.mycoupon li.disabled .em { color: #888888; }

.mycoupon-item-area.mycoupon li.disabled .dday-area { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-badge-dday-disabled-65x32.svg"); }

.mycoupon-item-area.mycoupon li.time-coupon { margin-bottom: 3.85714rem; }

.mycoupon-item-area.mycoupon li.time-coupon .time-coupon-date { display: block; }

.mycoupon-item-area.mycoupon li.time-coupon .mycoupon-sub-info:before { background-color: #f5f5f5; border-bottom-color: #f5f5f5; }

.mycoupon-item-area.barcode { padding: 1.42857rem; padding-bottom: 2.85714rem; }

.mycoupon-item-area.barcode .mycoupon-important { padding: 2rem; border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

.mycoupon-item-area.barcode .mycoupon-important .mycoupon-detail { min-height: 6.28571rem; padding-left: 6rem; padding-right: 0.71429rem; }

.mycoupon-item-area.barcode .mycoupon-important .mycoupon-detail .em.slightly { color: #888888; }

.mycoupon-item-area.barcode .mycoupon-important .mycoupon-detail .detail-title { margin-top: 0.14286rem; font-size: 1rem; font-weight: 600; display: block; display: -webkit-box; height: 2.8em; max-height: 2.8em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.mycoupon-item-area.barcode .mycoupon-important .mycoupon-detail .detail-sub { padding-top: 0.57143rem; color: #888888; font-size: 0.85714rem; font-weight: 400; word-break: break-all; }

.mycoupon-item-area.barcode .mycoupon-important .mycoupon-thumb { position: absolute; left: 2rem; top: 2.85714rem; }

.mycoupon-item-area.barcode .mycoupon-sub-info { position: relative; width: 100%; padding: 2rem 0; border: 1px solid #e5e5e5; border-top: 1px dashed #e5e5e5; text-align: center; border-bottom-left-radius: 0.85714rem; border-bottom-right-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mycoupon-item-area.barcode .mycoupon-sub-info:after, .mycoupon-item-area.barcode .mycoupon-sub-info:before { position: absolute; top: 0; left: auto; content: ''; width: 9px; height: 16px; border: 1px solid #e5e5e5; background-color: #fff; -webkit-transform: translate(0, -8px); -ms-transform: translate(0, -8px); transform: translate(0, -8px); -webkit-box-sizing: border-box; box-sizing: border-box; }

.mycoupon-item-area.barcode .mycoupon-sub-info:after { left: -1px; border-top-right-radius: 30px; border-bottom-right-radius: 30px; border-left-color: #fff; }

.mycoupon-item-area.barcode .mycoupon-sub-info:before { right: -1px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; border-right-color: #fff; }

.mycoupon-item-area.barcode .mycoupon-sub-info .mycoupon-info { position: relative; left: auto; top: auto; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; }

.mycoupon-item-area.barcode .mycoupon-sub-info .barcode-area img { display: block; margin: 0 auto; max-width: 86%; width: 100%; }

.mycoupon-item-area.barcode .mycoupon-sub-info .barcode-area p { font-size: 1.2rem; letter-spacing: 0.051em; font-family: sans-serif; font-weight: 600; margin-top: 6px; }

.mycoupon-item-area.barcode .dday-area { top: -2px; left: 0.85714rem; right: auto; width: 5.71429rem; height: 2.85714rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-badge-percentage.svg"); background-size: 5.71429rem 2.85714rem; }

.mycoupon-item-area.barcode .dday-area .dday { font-size: 1.14286rem; line-height: 2.42857rem; }

.mycoupon-item-area.benefits { padding: 1.42857rem; }

.mycoupon-item-area.benefits .mycoupon-important { padding: 2rem; border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; text-align: center; }

.mycoupon-item-area.benefits .mycoupon-important .mycoupon-thumb { width: 7.42857rem; height: 7.42857rem; margin: 0 auto; }

.mycoupon-item-area.benefits .mycoupon-sub-info { position: relative; width: 100%; padding: 2rem; border: 1px solid #e5e5e5; border-top: 1px dashed #e5e5e5; text-align: center; border-bottom-left-radius: 0.85714rem; border-bottom-right-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mycoupon-item-area.benefits .mycoupon-sub-info:after, .mycoupon-item-area.benefits .mycoupon-sub-info:before { position: absolute; top: 0; left: auto; content: ''; width: 9px; height: 16px; border: 1px solid #e5e5e5; background-color: #fff; -webkit-transform: translate(0, -8px); -ms-transform: translate(0, -8px); transform: translate(0, -8px); -webkit-box-sizing: border-box; box-sizing: border-box; }

.mycoupon-item-area.benefits .mycoupon-sub-info:after { left: -1px; border-top-right-radius: 30px; border-bottom-right-radius: 30px; border-left-color: #fff; }

.mycoupon-item-area.benefits .mycoupon-sub-info:before { right: -1px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; border-right-color: #fff; }

.mycoupon-item-area.benefits .mycoupon-sub-info .mycoupon-info { position: relative; left: auto; top: auto; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; }

.mycoupon-item-area.benefits .mycoupon-sub-info .mycoupon-info > .btn-group { margin: 0 auto; max-width: 14.28571rem; }

.mycoupon-item-area.benefits .mycoupon-sub-info .barcode-area img { display: block; margin: 0 auto; max-width: 86%; width: 100%; }

.mycoupon-item-area.benefits .mycoupon-sub-info .barcode-area p { font-size: 1.2rem; letter-spacing: 0.051em; font-family: sans-serif; font-weight: 600; margin-top: 6px; }

.mycoupon-item-area.benefits .detail-title { font-size: 1.14286rem; font-weight: 600; display: block; display: -webkit-box; max-height: 3em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.mycoupon-item-area.benefits .detail-sub { margin-top: 0.42857rem; font-size: 1rem; font-weight: 400; color: #666666; }

.mycoupon-item-area.benefits .mycoupon-thumb { margin-top: 1.14286rem; }

.mycoupon-item-area.benefits .benefits-confirm-txt { padding-bottom: 0.71429rem; text-align: center; color: #fe4f27; font-weight: 600; }

.mycoupon-item-area.benefits .benefits-confirm-txt .ico.check { display: inline-block; width: 1.71429rem; height: 1.71429rem; vertical-align: middle; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/ico-check.png") left top no-repeat; background-size: 1.71429rem 1.71429rem; }

.notice-list-remove { padding: 1.14286rem 1.42857rem 0.71429rem; text-align: right; }

.notice-list-remove .all-remove { position:relative; font-size:1rem; color:#666666; font-weight:400; border:1px solid #666; outline:none; background-color:transparent; padding:0 1.07143rem 0 2.07143rem; height:2.57143rem; line-height:2.5rem; }

.notice-list-remove .all-remove:after{ position:absolute; content:''; left:.5rem; top:calc(50% - .714285rem); width:1.42857rem; height:1.42857rem; background:transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-40x40.png") center center no-repeat; background-size:1.42857rem 1.42857rem; }

.notice-list-settings { padding: 0.71429rem 1.42857rem; }

.notice-list-settings a { display: block; }

.notice-list-settings > .list-bundle { margin-bottom: 2.14286rem; }

.notice-list-settings > .list-bundle.ico-hide .noti-row-wrap .noti-ico { display: none; }

.notice-list-settings > .list-bundle.disabled .list-noti { background-color: #f5f5f5; }

.notice-list-settings > .list-bundle.disabled .noti-row-wrap .txt { color: #888888; }

.notice-list-settings > .list-bundle .brand-img { position: relative; width: 3.42857rem; height: 3.42857rem; display: inline-block; margin-right: 0.28571rem; overflow: hidden; vertical-align: middle; border: 0.6429rem solid transparent; box-sizing: border-box;}

.notice-list-settings > .list-bundle .location { display: inline-block; vertical-align: middle; font-size: 1.14286rem; font-weight: 600; }

.notice-list-settings > .list-bundle .noti-row { font-weight: 600; }

.notice-list-settings > .list-bundle .noti-title { font-size: 1.14286rem; word-break: break-all; }

.notice-list-settings > .list-bundle .noti-brand { margin-top: 0.85714rem; color: #fe4f27; }

.notice-list-settings > .list-bundle .noti-txt { margin-top: 0.28571rem; }

.notice-list-settings > .list-bundle .noti-info, .notice-list-settings > .list-bundle .noti-date { margin-top: 0.42857rem; font-size: 0.85714rem; color: #888888; }

.notice-list-settings > .list-bundle .noti-date { margin-top: 0.71429rem; font-weight: 400; }

.notice-list-settings > .list-bundle .btn-group { margin-top: 20px; }

.notice-list-settings .list-noti { position: relative; margin-top: 0.28571rem; border: 1px solid #e5e5e5; border-radius: 0.85714rem; }

.notice-list-settings .list-noti .noti-row-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; }

.notice-list-settings .list-noti .noti-row-wrap .noti-row { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; word-break: break-all; padding: 1.42857rem; }

.notice-list-settings .list-noti .noti-row-wrap .noti-ico { max-width: 25%; min-height: 6.42857rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 1.42857rem 0; }

.notice-list-settings .list-noti .noti-row-wrap .ico-wrap { display: block; width: 2.85714rem; height: 2.85714rem; margin: 0 auto; }

.notice-list-settings .list-noti .noti-row-wrap .ico-wrap img { display: block; max-width: 100%; }

.notice-list-settings .list-noti .noti-row-wrap .txt { display: block; text-align: center; font-size: 0.85714rem; color: #fe4f27; }

.notice-list-settings .remove-pack { position: absolute; top: 0; right: 0; width: 2.85714rem; height: 2.85714rem; border: none; outline: none; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/close/ico-close-40x40.png") center center no-repeat; background-size: 1.42857rem 1.42857rem; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.notice-list-settings .coupon-bundle .noti-ico { position: relative; border-left: 1px dashed #e5e5e5; }

.notice-list-settings .coupon-bundle .noti-ico:after, .notice-list-settings .coupon-bundle .noti-ico:before { position: absolute; left: 0; content: ''; width: 16px; height: 9px; border: 1px solid #e5e5e5; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; -webkit-transform: translate(-8px, 0); -ms-transform: translate(-8px, 0); transform: translate(-8px, 0); }

.notice-list-settings .coupon-bundle .noti-ico:after { top: -1px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; border-top-color: #fff; }

.notice-list-settings .coupon-bundle .noti-ico:before { bottom: -1px; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-color: #fff; }

.mywrite-container-wrap .common-board-content li { border-bottom: 1px solid #e5e5e5; }

.mywrite-container-wrap .common-board-content li.disabled .write-title { color: #dddddd; }

.mywrite-container-wrap .common-board-content li:last-child { border-bottom: none; }

.mywrite-container-wrap .common-board-content li a { display: block; }

.mywrite-container-wrap .common-board-content li .mywrite-item { padding: 1.42857rem; }

.mywrite-container-wrap .common-board-content li .write-title { font-size: 1rem; font-weight: 400; display: block; display: -webkit-box; height: 2.8em; max-height: 2.8em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.mywrite-container-wrap .common-board-content li .sub-info { position: relative; }

.mywrite-container-wrap .common-board-content li .sub-info .post-date, .mywrite-container-wrap .common-board-content li .sub-info .post-list, .mywrite-container-wrap .common-board-content li .sub-info .post-text { font-size: 0.85714rem; color: #888888; }

.mywrite-container-wrap .common-board-content li .sub-info .post-text { max-width: 70%; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.mywrite-container-wrap .common-board-content li .sub-info .post-list > i { background-size: 1.14286rem 1.14286rem; background-position: center center; vertical-align: middle; }

.mywrite-container-wrap .common-board-content li .sub-info .post-list .number { vertical-align: middle; }

.mywrite-container-wrap .common-board-content li .sub-info .post-list-wrap { position: absolute; right: 0; top: -0.14286rem; }

.btn-store-state { display: inline-block; margin-top: 1.57143rem; }

.btn-store-state > .ico { display: inline-block; width: 1.42857rem; height: 1.42857rem; border-radius: 50%; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-store-off.svg") left top no-repeat; background-size: 1.42857rem 1.42857rem; vertical-align: middle; overflow: hidden; text-indent: -9999px; font-size: 0.01em; color: transparent; }

.btn-store-state.on > .ico { background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-store-on.svg"); }

.btn-store-state > .type { margin-top: 0.14286rem; display: inline-block; vertical-align: middle; font-size: 0.85714rem; }

.membership-grade-wrap .grade-img-area {position: relative;width: 100%;height: auto;overflow: hidden;background-color: white;padding-top: 28.666667vw;}

.membership-grade-wrap .grade-img-area img {display: block;margin: 0 5.5555556vw;}

.membership-grade-wrap .badge-header-wrap{background-color: white;padding: 8.3333333vw 5.5555556vw;}

.membership-grade-wrap .badge-header-wrap::after { clear: both;}

.membership-grade-wrap .badge-header-wrap .title-badge { display: inline-block; float: left; color: #fff; font-size: 1.14285rem; line-height: 1.71428rem;}

/* .membership-grade-wrap .badge-header-wrap .btn-quest-veiw { color: #000; font-family: 'NotoSansCJKkr'; font-size: 4.055556vw; font-weight: 400; line-height: 4.7222222vw; height: 4.7222222vw; padding-left: 58.3333333vw;} */

/* .membership-grade-wrap .badge-header-wrap .btn-quest-veiw:after { display: inline-block; content: ''; width: 24px; height: 16px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ic_info.svg") center center no-repeat; background-size: 16px; vertical-align: middle;} */
.membership-grade-wrap .badge-header-wrap button{width: 100%;height: 12vw;border-radius: 2.2222222vw;border: 0.2777778vw solid #fe4f27;background-color: white; color: #fe4f27;font-size: 4.4444444vw}

.membership-welcome-wrapper { background-color: #f7f7f7; }
.membership-welcome-wrapper .image-wrap {height:82.5vw; background:white url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/img_welcome.png") no-repeat center;background-size: 100%;}
.membership-welcome-wrapper .welcome-comment p,
.membership-welcome-wrapper .image-wrap p {width: 100%;text-align: center;font-size: 4.4444444vw;}
.membership-welcome-wrapper .image-wrap p:first-child {padding-top: 11.1111111vw;font-size: 5.5555556vw;}
.membership-welcome-wrapper .image-wrap p:nth-child(2) {padding-top: 3.3333333vw;}
.membership-welcome-wrapper .welcome-comment {background:white;padding: 5.5555556vw 0;}

.membership-stage-info-wrapper { padding: 13.3333333vw 1.3571429rem 1.7857143rem; background-color: #f7f7f7; }

.membership-stage-info-wrapper .stage-title { margin-bottom: 1.42857rem; font-weight: bold; font-size: 6.6666667vw; letter-spacing: -0.96px; text-align: center; word-break: break-all; }

.membership-stage-info-wrapper .text-area { text-align: center; }

.membership-stage-info-wrapper .text-area .title { margin-top: 0.71429rem; font-weight: 600; font-size: 6.6666667vw; letter-spacing: -0.4px; word-break: break-all; }

.membership-stage-info-wrapper .text-area .description { margin-top: 1.42857rem; font-size: 4.4444444vw; letter-spacing: -0.32px; color: #666; word-break: break-all; }

.membership-stage-info-wrapper .text-area .description.caution { margin-top: 0.71429rem; font-size: 1rem; color: #fe4f27; }

.membership-stage-info-wrapper .text-area .description .sub { font-size:1rem; }

.membership-stage-info-wrapper .img-area { margin-top: 1.02857rem; }

.membership-stage-info-wrapper .img-area .top{margin-top: 4.7222222vw;}

.membership-stage-info-wrapper .img-area img { display: block; max-width: 100%; margin: 10px auto;margin-top: 4.9206444vw; }

.membership-stage-info-wrapper .stage-list-wrap .stage-area { margin-top: 5.5555556vw; padding: 1.85714rem 0; border-radius: 0.85714rem; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.membership-stage-info-wrapper .stage-list-wrap .stage-area .stage { display: flex; width: 2.28571rem; height: 2.28571rem; margin: 0 auto; }

.membership-stage-info-wrapper .stage-list-wrap .stage-area .membership-coupon-list-wrap { padding: 1.42857rem 1.42857rem 0; }


.membership-stage-info-wrapper .img-area-grade { margin-top: 1.02857rem; }

.membership-stage-info-wrapper .img-area-grade .top{margin-top: 4.7222222vw;}

.membership-stage-info-wrapper .img-area-grade img { display: block; max-width: 100%; margin: 10px auto;margin-top: 21.1111111vw; width: 100%;}

.membership-stage-info-wrapper .stage-list-wrap .stage-area-grade { margin-top: 5.5555556vw; padding: 1.85714rem 0; border-radius: 0.85714rem; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.membership-stage-info-wrapper .stage-list-wrap .stage-area-grade .stage { display: flex; width: 2.28571rem; height: 2.28571rem; margin: 0 auto; }

.membership-stage-info-wrapper .stage-list-wrap .stage-area-grade .membership-coupon-list-wrap { padding: 1.42857rem 1.42857rem 0; }

.membership-stage-info-wrapper .stage-list-wrap .img-area img{width: 100%;}

.membership-stage-info-wrapper .stage-list-wrap button { height: 12vw; width: 100%; border-radius: 8px; background: #fe4f27; color: white; font-size: 3.75vw; outline: 0; border: none; }

.membership-stage-info-wrapper .stage-list-wrap button[disabled] { background: #666; }

.membership-stage-info-wrapper.champoin .img-area { padding: 0 2.85714rem; }

.membership-stage-info-wrapper.champoin .img-area-grade { padding: 0 2.85714rem; }

.membership-stage-info-wrapper.champoin .text-area .description { font-size: 1rem; }

.membership-stage-info-wrapper.champoin .membership-coupon-list-wrap { margin-top: 1.42857rem; }

.membership-day-box { position: relative; margin: 3.57143rem 1.42857rem 0; padding: 2.85714rem 0 1.42857rem; border-radius: 0.85714rem; border: 1px solid #e5e5e5; }

.membership-day-box .sale-info-wrap { position: absolute; top: -1.28571rem; left: 0; z-index: 1; width: 100%; text-align: center; }

.membership-day-box .sale-info-wrap .info { display: inline-block; padding: 0.42857rem 3rem; font-weight: 600; font-size: 1.14286rem; border: 1px solid #fe4f27; border-radius: 7.14286rem; color: #fe4f27; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.membership-day-box .sale-deatil-wrap .sale-detail { font-size: 1.14286rem; text-align: center; word-break: break-all; }

.membership-day-box .sale-deatil-wrap .sale-detail strong { display: inline-block; position: relative; z-index: 2; font-weight: bold; }

.membership-day-box .sale-deatil-wrap .sale-detail strong:before { display: inline-block; position: absolute; content: ''; left: 0; bottom: 0; z-index: 1; width: 100%; height: 0.71429rem; opacity: 0.08; background-color: #fe4f27; }

.membership-day-box .sale-deatil-wrap .brand-list-wrap ul { max-width: 20rem; margin: 0 auto; text-align: center; }

.membership-day-box .sale-deatil-wrap .brand-list-wrap ul li { margin-top: 1.42857rem; display: inline-block; vertical-align: top; padding: 0 1.21429rem; }

.membership-day-box .sale-deatil-wrap .brand-list-wrap .thumb-wrap { width: 3.42857rem; margin: 0 auto; overflow: hidden; border-radius: 50%; border: 1px solid #e5e5e5; }

.membership-day-box .sale-deatil-wrap .brand-list-wrap .thumb-inner { position: relative; width: 100%; height: 0; padding-bottom: 100%; }

.membership-day-box .sale-deatil-wrap .brand-list-wrap span { margin-top: 0.28571rem; display: block; font-size: 1rem; text-align: center; color: #666666; word-break: break-all; }

.membership-coupon-list-wrapper { padding: 1.42857rem 1.42857rem 0; }

.membership-coupon-list-wrapper > .item-list li { position: relative; width: 20rem; margin: 0.42857rem auto 0; }

.membership-coupon-list-wrapper > .item-list li a { display: block; }

.membership-coupon-list-wrapper .mycoupon-important { position: relative; padding: 2rem; border: 1px solid #e5e5e5; border-bottom: none; border-radius: 0.85714rem; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

.membership-coupon-list-wrapper .mycoupon-important .mycoupon-detail { min-height: 2.85714rem; padding-left: 6rem; padding-right: 0.71429rem; }

.membership-coupon-list-wrapper .mycoupon-important .mycoupon-detail .em.slightly { color: #888888; }

.membership-coupon-list-wrapper .mycoupon-important .mycoupon-detail .detail-title { margin-top: 0.14286rem; font-size: 1rem; font-weight: 600; display: block; display: -webkit-box; max-height: 2.8em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; }

.membership-coupon-list-wrapper .mycoupon-important .mycoupon-thumb { position: absolute; left: 2rem; top: 50%; margin-top: -2.28571rem; width: 4.57143rem; height: 4.57143rem; overflow: hidden; }

.membership-coupon-list-wrapper .mycoupon-sub-info { position: relative; width: 100%; padding: 1rem 0; border: 1px solid #e5e5e5; border-top: 1px dashed #e5e5e5; text-align: center; border-bottom-left-radius: 0.85714rem; border-bottom-right-radius: 0.85714rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.membership-coupon-list-wrapper .mycoupon-sub-info:after, .membership-coupon-list-wrapper .mycoupon-sub-info:before { position: absolute; top: 0; content: ''; width: 9px; height: 16px; border: 1px solid #e5e5e5; background-color: #fff; -webkit-transform: translate(0, -8px); -ms-transform: translate(0, -8px); transform: translate(0, -8px); -webkit-box-sizing: border-box; box-sizing: border-box; }

.membership-coupon-list-wrapper .mycoupon-sub-info:after { top: -1px; left: -1px; border-top-right-radius: 30px; border-bottom-right-radius: 30px; border-left-color: #fff; }

.membership-coupon-list-wrapper .mycoupon-sub-info:before { right: -1px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; border-right-color: #fff; }

.membership-coupon-list-wrapper .mycoupon-sub-info .mycoupon-info { position: relative; left: auto; top: auto; -webkit-transform: inherit; -ms-transform: inherit; transform: inherit; font-size: 0.85714rem; color: #888888; }

.membership-coupon-list-wrap ul img { display: block; margin: 0 auto; max-width: 100%; width: 100%; }

.mypage-content.membership-grade .stage-area .text-area .title { font-size: 6.6666667vw; letter-spacing: -0.4px; word-break: break-all; }

.mypage-content.membership-grade .stage-area .text-area .description { margin-top: 0.57143rem; font-size: 4.4444444vw; }

.mypage-content.membership-grade .stage-area .text-area .description .sub { font-size:1rem; }

.mypage-content .btn_event100 .mybage-content-wrap{background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/Banner03.svg") ;background-repeat: no-repeat; background-position: 0 0; background-size: contain; background-color: transparent; height: 38.8888889vw;width:100vw}

.grade-description-wrapper { padding: 22.1333333vw 5.5555556vw; }

.grade-description-wrapper .grade-description-area .title-wrap { margin-bottom: 1.42857rem; }

.grade-description-wrapper .grade-description-area .title-wrap .title { font-size: 6.6666667vw; }

.grade-description-wrapper .grade-description-area .data-list { margin-top: 1.42857rem; }

.grade-description-wrapper .grade-description-area .grade-info-list { padding-left: 1rem; }

.grade-description-wrapper .grade-description-area .grade-info-list .info-title { display: block; position: relative; font-weight: 600; font-size: 1.14286rem; }

.grade-description-wrapper .grade-description-area .grade-info-list .info-title:before { display: inline-block; position: absolute; top: 50%; left: -0.71429rem; margin-top: -0.14286rem; content: ''; width: 0.28571rem; height: 0.28571rem; background-color: #666666; border-radius: 50%; }

.grade-description-wrapper .grade-description-area .grade-info-list .data-list { margin-top: 0.71429rem; }

.grade-description-wrapper .grade-description-area .grade-info-list .data-list li + li { margin-top: 0.57143rem; }

.grade-description-wrapper .grade-description-area + .grade-description-area { margin-top: 2.85714rem; }

.grade-description-wrapper .etc-info { margin-top: 0.71429rem; font-size: 1rem; color: #888888; word-break: break-all; }

.grade-info-wrapper { padding: 11vw 5.5555556vw; }

.data-table.membership-table { position: relative; }

.data-table.membership-table .ico-grade { display: block; width: 1.7142857rem; height: 1.7142857rem; margin: 4px auto; }

.data-table.membership-table .ico-grade img { display: block; width: 100%; height: 100%; }

.data-table.membership-table th { padding: 1.14286rem 0.71429rem; background-color: rgba(230, 230, 230, 0.3); }

.data-table.membership-table th{ font-size: 0.8571429rem; text-align: center; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; letter-spacing: -.8px; }

.data-table.membership-table td{ font-size: 0.8571429rem; text-align: left; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; letter-spacing: -.8px ;padding-left: 5px;}

.data-table.membership-table.grade td {text-align: center;}

.data-table.membership-table th:first-child, .data-table.membership-table td:first-child { border-left: none; }

.data-table.membership-table td:first-child { font-size: 0.8571429rem; text-align: center; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; letter-spacing: -.8px;}

.data-table.membership-table td:first-child { padding: 1.14286rem 0.71429rem;  border-left: none;}

.data-table.membership-table:after { position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 3px; background-color: #666; }

.data-table.membership-table tr { border-bottom: 0.2777778vw solid #e5e5e5 }

.data-table.membership-table tr.seperator {height:1.6666667vw;}

.grade-text { font-weight: 600; font-size: 0.8571429rem; }

.grade-text.pink { color: #ff7bc1; }

.grade-text.gold { color: #fb9806; }

.grade-text.platinum { color: #303030; }

.grade-text.friend { color: #fb9806; }
.grade-text.family { color: #007afb; }
.grade-text.vip { color: #0a0a80; }
.grade-text.royal { color: #6b2756; }

.grade-list-wrap { margin-top: 2.28571rem; padding: 0 1.42857rem; text-align: center; }

.grade-list-wrap .list { display: inline-block; vertical-align: top; padding: 0 1.78571rem; }

.grade-list-wrap .list .ico-grade { display: block; width: 2.85714rem; height: 2.85714rem; margin: 0 auto; }

.grade-list-wrap .list .ico-grade img { display: block; width: 100%; height: 100%; }

.grade-list-wrap .list .grade-text { display: block; font-size: 1rem; text-align: center; }

.brand-champoin-section { padding: 1.42857rem 1.42857rem 0; }

.brand-champoin-section .etc-info { margin-top: 0.71429rem; font-size: 1rem; color: #888888; word-break: break-all; }

.brand-champoin-wrapper { border-radius: 0.85714rem; overflow: hidden; }

.brand-champoin-wrapper .champoin-header-wrap { padding: 1.42857rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.brand-champoin-wrapper .champoin-header-wrap .champoin-title { text-align: center; }

.brand-champoin-wrapper .champoin-header-wrap .champoin-title .ico { width: 2.28571rem; height: 2.28571rem; display: inline-block; vertical-align: middle; margin-top: -0.21429rem; }

.brand-champoin-wrapper .champoin-header-wrap .champoin-title .ico img { display: block; width: 100%; height: 100%; }

.brand-champoin-wrapper .champoin-header-wrap .champoin-title .title { font-weight: 600; font-size: 1.42857rem; letter-spacing: -0.4px; color: #fff; }

.brand-champoin-wrapper .champoin-body-wrap { padding: 1rem 1.71429rem; }

.brand-champoin-wrapper .champoin-body-wrap .brand-champion-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.brand-champoin-wrapper .champoin-body-wrap .brand-champion-list li { width: 3.71429rem; }

.brand-champoin-wrapper .champoin-body-wrap .brand-champion-list li .img-area { position: relative; width: 100%; padding-bottom: 100%; height: auto; overflow: hidden; }

.brand-champoin-wrapper.pink .champoin-header-wrap { background-color: #ff7bc1; }

.brand-champoin-wrapper.pink .champoin-body-wrap { background-color: rgba(255, 123, 193, 0.1); }

.brand-champoin-wrapper.gold .champoin-header-wrap { background-color: #fb9806; }

.brand-champoin-wrapper.gold .champoin-body-wrap { background-color: rgba(251, 152, 6, 0.1); }

.brand-champoin-wrapper.platinum .champoin-header-wrap { background-color: #555555; }

.brand-champoin-wrapper.platinum .champoin-body-wrap { background-color: rgba(85, 85, 85, 0.1); }

.coupon-detail-wrap { display: flex; flex-wrap: wrap; margin: 0 auto 1.42857rem; justify-content: center; }

.coupon-detail-wrap li { width: 17vw; margin: 0 1vw; }

.coupon-detail-wrap .coupon-wrap { position: relative; background-position: 0 0; background-repeat: no-repeat; background-size: 20rem 8rem; }

.coupon-detail-wrap .coupon-wrap .thumb-circle { position: absolute; width: 4.57143rem; height: 4.57143rem; }

.coupon-detail-wrap .coupon-wrap .thumb-circle img { width: 100%; display: block; }

.coupon-detail-wrap .coupon-wrap .name { display: block; font-size:1rem; color: #666666; overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.coupon-detail-wrap .coupon-wrap .info-txt { margin-top: 0.35714rem; font-size: 0.8571429rem; color: #222222; display: block; display: -webkit-box; max-height: 4.5em; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.5em; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-wrap: break-word; overflow: hidden; font-weight: 600; letter-spacing: -0.0666667vw;}
.coupon-detail-wrap .coupon-wrap .info-txt .small-text { font-size: 2.7777778vw; }
.coupon-detail-wrap .coupon-wrap .info-txt .medium-text { font-size: 0.8571429rem; }

.coupon-detail-wrap .coupon-wrap.hori-wrap { display: table; width: 20rem; height: 8rem; margin: 0 auto; table-layout: fixed; }

.coupon-detail-wrap .coupon-wrap.hori-wrap .thumb-circle { top: 50%; margin-top: -2.28571rem; left: 1.42857rem; }

.coupon-detail-wrap .coupon-wrap.hori-wrap .coupon-detail { width: 100%; height: 100%; display: table-cell; vertical-align: middle; padding-left: 27.7777778vw; padding-right: 16vw; text-align: left; -webkit-box-sizing: border-box; box-sizing: border-box; }

.coupon-detail-wrap.birth {margin: 0 auto 5.5555556vw;}

.coupon-detail-wrap.birth .coupon-wrap { background-size: 88.8888889vw 33.3333333vw; }
.coupon-detail-wrap.birth .coupon-wrap.hori-wrap { width: 88.8888889vw; height: 33.3333333vw; }
.coupon-detail-wrap.birth .coupon-wrap.hori-wrap .coupon-detail { padding-right: 19vw; }
.coupon-detail-wrap.birth .coupon-wrap .info-txt {font-size:1rem;}

.smart-receipt-content { padding: 1.14286rem; }

.smart-receipt-content .smart-receipt-wrap {overflow: hidden;}

.smart-receipt-content .btn-group { padding-top: 1.14286rem; }

.result-empty-container .result-empty-content .promote-area .logo-area { margin-top: 2.85714rem; }

.result-empty-container .result-empty-content .promote-area .logo-area img { display: block; margin: 0 auto; width: 5.14286rem; }

.result-empty-container .result-empty-content .promote-area .ico-area { margin-top: 3.35714rem; }

.result-empty-container .result-empty-content .promote-area .ico-area img { display: block; max-width: 100%; margin: 0 auto; }

.result-empty-container .result-empty-content .promote-area .title { display: block; margin-top: 1.42857rem; font-weight: 600; font-size: 1.42857rem; text-align: center; }

.result-empty-container .result-empty-content .promote-area .sub-text { display: block; margin-top: 0.57143rem; font-size: 0.85714rem; text-align: center; color: #666666; }

.result-empty-container .result-empty-content .promote-area .btn-group { margin-top: 7.85714rem; padding: 0 1.42857rem 1.42857rem; }

.service-policy-content.notice-content .notice-board-list .list:last-child { border-bottom: 1px solid #e5e5e5; }

.policy-detail-wrapper { /* terms2 */ /* term */ }

.policy-detail-wrapper .select-wrapper { padding: 1.42857rem 1.07143rem 0 1.07143rem; }

.policy-detail-wrapper .policy_table {margin: 10px 15px 5px 15px;font-size: 12px;line-height:15px;scroll-behavior:smooth;display: block;text-align:center;overflow-y: scroll;}

.policy-detail-wrapper .policy_table tr {height: 50px;}

.policy-detail-wrapper .policy_table td {cursor: pointer;text-align: left;}

.policy-detail-wrapper .term_contents { line-height: 1.5em; }

.policy-detail-wrapper .term_contents .column > * { font-size: 14px; }

.policy-detail-wrapper .term_contents .column.normal, .policy-detail-wrapper .term_contents .column.first { margin-bottom: 1px; padding: 20px 15px; background-color: #fff; white-space: pre-wrap; }

.policy-detail-wrapper .term_contents .column.normal .title, .policy-detail-wrapper .term_contents .column.tabs > .title { font-weight: bold !important; }

.policy-detail-wrapper .term_contents.type_list ul > li > a, .policy-detail-wrapper .term_contents .column.tabs > .title { display: block; position: relative; border-bottom: 1px solid #e5e5e5; padding: 20px 35px 20px 15px; background-color: #fff; cursor: pointer; }

.policy-detail-wrapper .term_contents.type_list ul > li > a:after, .policy-detail-wrapper .term_contents .column.tabs > .title:after { display: block; position: absolute; top: 50%; right: 13px; width: 13px; height: 8px; margin-top: -3.5px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/ico-arrow-up-26x15.png") left top no-repeat; background-size: 13px 8px; content: ''; -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; -o-transition: transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.policy-detail-wrapper .term_contents .column.tabs > .title.on:after { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }

.policy-detail-wrapper .term_contents.type_list ul > li > a { font-size: 16px; font-weight: normal; }

.policy-detail-wrapper .term_contents.type_list ul > li > a:after { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }

.policy-detail-wrapper .term_contents .column.normal .title + *, .policy-detail-wrapper .term_contents .column.tabs > .title + .detail { display: none; padding: 15px; white-space: pre-wrap; }

.policy-detail-wrapper .term_contents .column.normal .title + *, .policy-detail-wrapper .term_contents .column.tabs > .title.on + .detail { display: block; }

.policy-detail-wrapper .agree_data table, .policy-detail-wrapper .term_contents .column table { width: 100%; white-space: normal; }

.policy-detail-wrapper .agree_data table *, .policy-detail-wrapper .term_contents .column table * { padding: 10px; font-size: 12px; text-align: left; vertical-align: top; }

.policy-detail-wrapper .agree_data table caption, .policy-detail-wrapper .term_contents .column table caption { position: absolute; padding: 0; font-size: 0; color: transparent; }

.policy-detail-wrapper .agree_data table th, .policy-detail-wrapper .term_contents .column table th { font-weight: normal; }

.policy-detail-wrapper .agree_data table thead tr > *, .policy-detail-wrapper .term_contents .column table tfoot th, .policy-detail-wrapper .term_contents .column table thead tr > * { background-color: #d9d9d9; border: solid #c7c7c7; border-width: 1px 0 1px 1px; color: #1c1c1c; text-align: left; }

.policy-detail-wrapper .agree_data table thead tr > * { background-color: transparent; }

.policy-detail-wrapper .term_contents .column table tfoot tr > th { border-top-width: 0; }

.policy-detail-wrapper .agree_data table tbody tr > *, .policy-detail-wrapper .term_contents .column table tfoot tr > *, .policy-detail-wrapper .term_contents .column table tbody tr > * { padding: 10px; border: solid #d9d9d9; border-width: 0 0 1px 1px; }

.policy-detail-wrapper .term_contents .column table tbody td, .policy-detail-wrapper .term_contents .column table tbody th { white-space: pre-wrap; word-break: break-all; }

.policy-detail-wrapper .agree_data table tr > *:first-child, .policy-detail-wrapper .term_contents .column table tr > *:first-child { border-left-width: 0; }

.policy-detail-wrapper .term_contents .column.type_editor > *, .policy-detail-wrapper .term_contents .column.normal { white-space: normal; }

.policy-detail-wrapper .term_contents .column.normal .first, .policy-detail-wrapper .term_contents .column.normal .title + *, .policy-detail-wrapper .term_contents .column.normal > * { padding: 25px 0; white-space: pre-wrap; word-break: break-all; }

.policy-detail-wrapper .term_contents .column.type_editor > * { padding: 0 !important; }

.policy-detail-wrapper .term_contents .column > table { margin-bottom: 25px; }

.policy-detail-wrapper .term_contents .column.normal > .title, .policy-detail-wrapper .term_contents .column.normal > table + *, .policy-detail-wrapper .term_contents .column.normal > *:first-child, .policy-detail-wrapper .term_contents .column.normal .first { padding-top: 0; }

.policy-detail-wrapper .term_contents .column.normal > .title, .policy-detail-wrapper .term_contents .column.normal > *:last-child { padding-bottom: 0; }

.policy-detail-wrapper .term_contents .column .in_depth_wrap { display: block; margin-left: 8px; }

.policy-detail-wrapper .term_contents .column .in_depth.type2 { text-indent: 0; margin-left: 0; }

.policy-detail-wrapper .term { padding-top: 10px; line-height: 1.5em; }

.policy-detail-wrapper .term .column > * { font-size: 14px; }

.policy-detail-wrapper .term .column.normal, .policy-detail-wrapper .term .column.first { margin-bottom: 1px; padding: 20px 15px; background-color: #fff; white-space: pre-wrap; }

.policy-detail-wrapper .term .column.normal .title, .policy-detail-wrapper .term .column.tabs > .title { color: #1c1c1c; font-weight: bold; }

.policy-detail-wrapper .term .column.normal .title + .title { margin-top: 25px; }

.policy-detail-wrapper .term.type_list ul > li > a, .policy-detail-wrapper .term .column.tabs > .title { display: block; position: relative; border-bottom: 1px solid #e5e5e5; padding: 20px 35px 20px 15px; background-color: #fff; cursor: pointer; }

.policy-detail-wrapper .term .column.tabs { background-color: #ebebeb; }

.policy-detail-wrapper .term.type_list ul > li > a:after, .policy-detail-wrapper .term .column.tabs > .title:after { display: block; position: absolute; top: 50%; right: 13px; width: 13px; height: 8px; margin-top: -3.5px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/ico-arrow-up-26x15.png") left top no-repeat; background-size: 13px 8px; content: ''; -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; -o-transition: transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.policy-detail-wrapper .term.type_list ul > li > a:after, .policy-detail-wrapper .term .column.tabs > .title.special:after { display: none; }

.policy-detail-wrapper .term .column.tabs > .title.on:after { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }

.policy-detail-wrapper .term.type_list ul > li > a { font-size: 16px; font-weight: normal; }

.policy-detail-wrapper .term.type_list ul > li > a:after { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }

.policy-detail-wrapper .term .column.normal .title + *, .policy-detail-wrapper .term .column.tabs > .title + .detail { display: none; padding: 15px; white-space: pre-wrap; }

.policy-detail-wrapper .term .column.normal .title + *, .policy-detail-wrapper .term .column.tabs > .title.on + .detail { display: block; }

.policy-detail-wrapper .agree_data table, .policy-detail-wrapper .term .column table { width: 100%; white-space: normal; padding: 40px 0; border-color: #1c1c1c transparent #999; border-style: solid; border-width: 2px 0 1px; }

.policy-detail-wrapper .agree_data table *, .policy-detail-wrapper .term .column table * { padding: 10px; font-size: 16px; text-align: left; vertical-align: top; }

.policy-detail-wrapper .agree_data table caption, .policy-detail-wrapper .term .column table caption { position: absolute; padding: 0; font-size: 0; color: transparent; }

.policy-detail-wrapper .agree_data table th, .policy-detail-wrapper .term .column table th { font-weight: normal; }

.policy-detail-wrapper .agree_data table thead tr > *, .policy-detail-wrapper .term .column table tfoot th, .policy-detail-wrapper .term .column table thead tr > * { background-color: #d9d9d9; border: solid #c7c7c7; border-width: 1px 0 1px 1px; color: #1c1c1c; text-align: left; font-size: 12px; }

.policy-detail-wrapper .agree_data table thead tr > * { background-color: transparent; }

.policy-detail-wrapper .term .column table tfoot tr > th { border-top-width: 0; }

.policy-detail-wrapper .agree_data table tbody tr > *, .policy-detail-wrapper .term .column table tfoot tr > *, .policy-detail-wrapper .term .column table tbody tr > * { padding: 10px; border: solid #d9d9d9; border-width: 0 0 1px 1px; font-size: 12px; }

.policy-detail-wrapper .term .column table tbody td, .policy-detail-wrapper .term .column table tbody th { white-space: pre-wrap; word-break: break-all; }

.policy-detail-wrapper .agree_data table tr > *:first-child, .policy-detail-wrapper .term .column table tr > *:first-child { border-left-width: 0; }

.policy-detail-wrapper .term .column.normal { white-space: normal; }

.policy-detail-wrapper .term .column.normal .first, .policy-detail-wrapper .term .column.normal .title + *, .policy-detail-wrapper .term .column.normal > * { padding: 25px 0; white-space: pre-wrap; word-break: break-all; }

.policy-detail-wrapper .term .column > table { margin-bottom: 25px; }

.policy-detail-wrapper .term .column.normal > .title, .policy-detail-wrapper .term .column.normal > table + *, .policy-detail-wrapper .term .column.normal > *:first-child, .policy-detail-wrapper .term .column.normal .first { padding-top: 0; }

.policy-detail-wrapper .term .column.normal > .title, .policy-detail-wrapper .term .column.normal > *:last-child { padding-bottom: 0; }

.policy-detail-wrapper .term .column .in_depth_wrap { display: block; margin-left: 8px; }

.policy-detail-wrapper .term .column .in_depth_wrap .in_depth { display: block; }

.policy-detail-wrapper .term .column .in_depth.type2 { text-indent: 0; margin-left: 0; }

.policy-detail-wrapper .term .column.normal strong { color: #1c1c1c; font-weight: normal; }

.policy-detail-wrapper .in_depth { display: block; }

.policy-detail-wrapper table { empty-cells: show; border-collapse: collapse; border-spacing: 0; }

.policy-detail-wrapper .column.tabs > .title.on + .detail { border-bottom: 1px solid #E3E3E3; }

#__bs_notify__ { padding: 4px 8px !important; font-size: 11px !important; background-color: rgba(27, 32, 50, 0.4) !important; position: relative; }


/*my-badge AddedHEE 20.09.14 */
.mybage-content .contents-list-bundle .common-bundle-list .item .details-area.list-title { display:flex; justify-content: space-between; align-items: center; border-top: 1px solid #e5e5e5; padding:1.42857rem; }

.mybage-content .contents-list-bundle .common-bundle-list .item:nth-child(1) .details-area.list-title { padding:5.5555556vw 5.5555556vw 5.5555556vw; border-top:none;}

.mybage-content .contents-list-bundle .common-bundle-list.type03.mybage-list .item .details-area .details { padding:0; background: transparent; }

.mybage-content .contents-list-bundle .common-bundle-list .item.accordion-list .accordion-body { display:none; }

.mybage-content .contents-list-bundle .common-bundle-list .item.accordion-list.on .accordion-body{ display:block; }

.mybage-list .list-content .list-title .label img { max-height:2rem; }

.mybage-content .contents-list-bundle .common-bundle-list.type03 .item .thumbnail { display: flex; justify-content: center; align-items: center; width:100%; padding:0; line-height:100%; }

.mybage-content .contents-list-bundle .common-bundle-list.type03 .item .list-image img { width:100%; line-height:100%; }

.mybage-list .date-info { font-size:1rem; font-weight: normal; line-height:1.57; letter-spacing: -0.010rem; color:#888; }

.mybage-list .date-bottom{padding-top: 100px; text-align: right;color: #FE4F27;}

/* .mybage-list .list-content .list-title .date-bottom { font-size:1rem; font-weight: normal; line-height:1.57; letter-spacing: -0.010rem; } */

.mybage-list .list-content .arrowBtn { display:flex; justify-content: center; align-items: center; position:relative; width:2.57rem; height:2.57rem; cursor:pointer; }

.mybage-list .list-content .arrowBtn img { width:100%; max-width:1rem; }

.mybage-list  .item.accordion-list .arrowBtn img.arrowBtn-close { display:none; }

.mybage-list  .item.accordion-list.on .arrowBtn img.arrowBtn-close { display:block; }

.mybage-list  .item.accordion-list.on .arrowBtn img.arrowBtn-open { display:none; }

.mybage-content .contents-list-bundle .common-bundle-list .item .mission { display:flex; justify-content: center; position:relative; }

.mybage-content .contents-list-bundle .common-bundle-list .item .mission .bagenum-area { display:flex; position:absolute; bottom:10vw; font-size: 5vw; line-height:1.6; letter-spacing:-0.04em; font-weight: 400; color:#222; }

.mybage-content .contents-list-bundle .common-bundle-list .item .mission .bagenum-area .bageNum { color:#fe4f27; padding-left:.4rem; }

.mybage-content .contents-list-bundle .common-bundle-list .item.mission_finish { position: relative; }

.mybage-content .contents-list-bundle .common-bundle-list .item.mission_finish::after { content: "퀘스트 종료"; position: absolute; top: 0; bottom: 0; left: 0; right: 0; display:flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.7); color: #fff; font-size: 1.14285rem; }

.mybage-content .contents-list-bundle .common-bundle-list .item.mission_finish .list-title .title-area .title { color:#666; }

.mybage-content .contents-list-bundle .btn-group { padding: 1.42857rem 1.42857rem 4.2857rem; }

.mybage-content .contents-list-bundle .btn-group .btn { height: 3.42857rem; font-size: 1.14285rem; font-weight: 600; }

.mybage-notice {background:#fff; padding: 1.42857rem;}

.mybage-notice .notice-txt { margin-top: 1.42857rem; }

/* 이미지 캐시 */

.my-badge .badge-wrapper.season_finish { position: relative; }

.my-badge .badge-wrapper.season_finish::after { content: "뱃지 NEW시즌 준비중 입니다.\A        (8월 10일 오픈 예정)"; position: absolute; top: 0; bottom: 0; left: 0; right: 0; display:flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.7); font-size: 20px;white-space:pre; }

.my-badge .badge-wrapper.season_finish { color:red; }

.my-badge {
    position: relative;
    background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_bg1.svg") center center no-repeat;
    background-size: 100%;
    height: 148.6111111vw;
}

.my-badge .badge-wrapper { position: relative; padding: 40vw 0; box-sizing: border-box;padding-bottom: 7.7777778vw;height:127.2222222vw ;margin-top: -0.5555556vw; }

.my-badge .badge-wrapper .badge-header-wrap { position: absolute; top: 7.7777778vw; right: 5.5555556vw; text-align: right;width:13.3333333vw ;height: 6.1111111vw;}

.my-badge .badge-wrapper .badge-header-wrap::after { clear: both;}

.my-badge .badge-wrapper .badge-header-wrap .title-badge { display: inline-block; float: left; color: #fff; font-size: 1.14285rem; line-height: 1.71428rem;}

.my-badge .badge-wrapper .badge-header-wrap .title-badge .beta { display: inline-block; margin: -0.5rem 0 0.5rem 0; width: 2.57142rem; height: 1.57142rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico-beta.png") center center no-repeat; background-size: cover; vertical-align: top; }

.my-badge .badge-wrapper .badge-header-wrap .title-badge .new { display: inline-block; width: 2.57142rem; height: 1.57142rem; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ico_new.svg") center center no-repeat; background-size: cover; vertical-align: top;font-size: 3.0555556vw; }

.my-badge .badge-wrapper .badge-header-wrap .btn-quest-veiw {  color: #007afb; font-family: 'NotoSansCJKkr'; font-size: 2.7777778vw; font-weight: 400; line-height: 4.7222222vw;  }
.my-badge .badge-wrapper .badge-header-wrap .badge_imt{
    position: absolute;
    right: -1.1111111vw;
    top: 1.722222vw;
    width: 16.9444444vw;
    height: 5.8333333vw;
}


/* .my-badge .badge-wrapper .badge-header-wrap .btn-quest-veiw:after { display: inline-block; content: ''; width: 24px; height: 16px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/ic_info.svg") center center no-repeat; background-size: 16px; vertical-align: middle;} */

.my-badge .badge-wrapper .badge-body-wrap .btn-group { margin: 1.14285rem auto 0; text-align: center; }

.my-badge .badge-wrapper .badge-body-wrap .btn-group .btn-acquired-badge {position: relative; width: 10.57142rem; border: none; background: #0A0A80; display: inline-block; font-weight: 300; }

.my-badge .badge-wrapper .badge-body-wrap .btn-group .btn-acquired-badge:after { display: inline-block; content: ''; position: absolute; right: 0.71428rem; top: 0.85714rem; width: 12px; height: 12px; background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/arrow/btn-arrow-white-12x12.svg") center center no-repeat; background-size: 12px; vertical-align: middle; }

.my-badge .badge-wrapper .badge-body-wrap .btn-group .btn-acquired-badge strong { font-size: 1.14285rem; }

.my-badge .badge-wrapper .badge-body-wrap .btn-group .Reward{ width: 14.2857rem;}

.my-badge .badge-wrapper .badge-body-wrap .title { text-align: center; }

.my-badge .badge-wrapper .badge-body-wrap .title .txt { display: block; color: #fff;font-weight: 400; line-height: 8.3333333vw; letter-spacing: -0.5555556vw; text-align: left; margin: -3.3333333vw 5.8333333vw 0.57142rem;font-family:'Noto Sans KR';font-size: 6.1111111vw;margin-bottom: 5.5555556vw;}

.my-badge .badge-wrapper .badge-body-wrap .title .txt .twinkle { display: inline-block; margin: 0 5px; }

.my-badge .badge-wrapper .badge-body-wrap .title .date { color: #fff; font-size: 1rem; font-style: normal; font-weight: 100; line-height: 1.28571rem; letter-spacing: 0; }

.my-badge .badge-wrapper .badge-wrap {
    position: relative;
    /* background: transparent url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/bage_bg2.svg")  center no-repeat; */
    background-size:100%;
    /* height: 81.6666667vw;
    border-radius: 1.6666667vw;
    margin: 0 auto;width: 94%; */
}
.my-badge .badge-wrapper .badge-body-wrap .badge_clear{
    position: absolute;
    bottom: -3.0555556vw;
    width: 75.8333333vw;
    left: 11.6666667vw;
}

.my-badge .badge-wrapper .badge-wrap .title { padding: 5.5555556vw 6.9444444vw 2.2222222vw; text-align: left; font-size: 4.4444444vw;line-height:6.1111111vw ;letter-spacing :-0.3666667vw;}

.my-badge .badge-wrapper .badge-wrap .desc { padding: 1.1111111vw 5.5555556vw; font-size: 0.8571429rem; line-height: 3.8888889vw; font-weight: 300; color: #888;letter-spacing: -0.2055556vw;}

.my-badge .badge-wrapper .badge-wrap .score { position: absolute; color: #222; top: 14.555556vw; right: 12.944444vw; font-size: 6.6666667vw; }

.my-badge .badge-wrapper .badge-wrap .desc .highlight,
.my-badge .badge-wrapper .badge-wrap .score .highlight { color: #fe4f27; }

.my-badge .badge-wrapper .badge-list {
    position: relative;
    height: 50vw;
    margin: 0 0 0 10.8333333vw;
    top:8.3333333vw;
    /* background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_road.svg) no-repeat;  */
    /* width: 83.3333333vw;
    background-size: 100%; */
}

.mybage-content .contents-list-bundle .common-bundle-list .badge_caution{
    border-radius: 1.3888889vw;
    background-color: #f5f5f5;
    padding: 3.8888889vw 5.5555556vw;

}
.mybage-content .contents-list-bundle .common-bundle-list .badge_caution_notice{
    background-color: #e5f1ff;
    height: 16.6666667vw;
    /* margin: 0 0 1.1111111vw; */

}
.mybage-content .contents-list-bundle .common-bundle-list .badge_caution p{
    font-size: 3.8888889vw;
    font-weight: 500;
    line-height: 1.57;
    letter-spacing: -0.0777778vw;
    text-align: left;
    color: #222;
}
.mybage-content .contents-list-bundle .common-bundle-list .badge_caution_notice .notice_txt{
    font-size: 4.4444444vw;
    font-weight: 500;
    letter-spacing: -0.0888889vw;
    text-align: left;
    color: #222;
    line-height: 16.6666667vw;
    padding-left: 8.3333333vw;
}
.mybage-content .contents-list-bundle .common-bundle-list li{
    margin-left: 5.5555556vw;
    list-style: disc;
    font-size: 3.3333333vw;
    line-height: 1.83;
    letter-spacing: -0.0666667vw;
    text-align: left;
    color: #666;
}

.my-badge .badge-wrapper .badge-list .badge-icon { display: inline-block; position: absolute; vertical-align: top; background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_stamp.svg) no-repeat; background-size: 100%; width: 15.5555556vw; height: 15.5555556vw;}

.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(1) { top: 2.7777778vw; left: 0;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(2) { top: 2.7777778vw; left: 20.2777778vw; background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_500_p.svg);}
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(3) { top: 2.7777778vw; left: 40.2777778vw;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(4) { top: 2.7777778vw; left: 61.9444444vw;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(5) { top: 18.6111111vw; left: 62.2222222vw; background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_2000_p.svg); }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(6) { top: 18.6111111vw; left: 40.2777778vw;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(7) { top: 18.6111111vw; left: 20.2777778vw;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(8) { top: 34.7222222vw; left: 20.2777778vw;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(9) { top: 34.7222222vw; left: 40.2777778vw;pointer-events: none; }
.my-badge .badge-wrapper .badge-list .badge-icon:nth-child(10) { top: 34.7222222vw; left: 62.2222222vw; background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/badge_4000_p.svg);}

.mybage-content .membership-stage-info-wrapper { margin-top: 1.42857rem; padding-top: 0; background: #F5F5F5;}
.history-wrapper .badge-history-section .badge-history-wrapper{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.history-wrapper .badge-history-section { position: relative; padding: 2.142857rem 0 1.71428rem; background-image: url("https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/img_badge_history_bg.png"); background-repeat: no-repeat; background-size: 100% auto; background-position: 50% 50%; margin-top: -0.5555556vw;}

.history-wrapper .badge-history-section .badge-history-wrapper .total-badge {
    margin-bottom: 2.2222222vw;
    color: #fff;
    font-size: 1.25571rem;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    position: relative;
    right:-8.3333333vw;
    display: flex;
    align-items: center;
}
.history-wrapper .badge-history-section .badge-history-wrapper .badgeicon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 5.5555556vw;
}
.history-wrapper .badge-history-section .badge-history-wrapper .badge1 { width: 16.6666667vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .badge2 { position: relative;
    left: -4.1666667vw;width: 16.6666667vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .total-badge .txt{
    margin-right: 6.1111111vw;
    margin-top: 1.3888889vw;
}
.history-wrapper .badge-history-section .badge-history-wrapper .total-badge .number { font-weight: 300; font-size: 8.3333333vw;}

.history-wrapper .badge-history-section .badge-history-wrapper .total-badge .number > strong{ font-weight: 600; font-size: 9.4444444vw;}

.history-wrapper .badge-history-section .badge-history-wrapper .badge-list { position: relative; height: 30vw; margin: 0 0 0 8.5555556vw; background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/res_history_badge_stamp_paper.svg) no-repeat; width: 83.3333333vw; background-size: 100%; }

.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon {display: inline-block; position: absolute; vertical-align: top; background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/mypage/res_history_badge_stamp.svg) no-repeat; background-size: 100%; width: 13.8888889vw; height: 13.8888889vw; }

/* .history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon + .badge-icon { margin-left: 4.7222222vw;} */

.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-of-type(10) { clear: both;}

/* .history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(n+6) {margin-top: 1.28571rem;} */
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(1) { top: 1.1111111vw; left: 4.7222222vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(2) { top: 1.1111111vw; left: 19.7222222vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(3) { top: 1.1111111vw; left: 34.7222222vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(4) { top: 1.1111111vw; left: 49.7222222vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(5) { top: 1.1111111vw; left: 64.7222222vw; }
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(6) { top: 14.869991vw; left: 4.7222222vw;}
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(7) { top: 14.869991vw; left: 19.7222222vw;  }
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(8) { top: 14.869991vw; left: 34.7222222vw;  }
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(9) { top: 14.869991vw; left: 49.7222222vw;  }
.history-wrapper .badge-history-section .badge-history-wrapper .badge-list .badge-icon:nth-child(10) { top: 14.869991vw; left: 64.7222222vw; }

.history-wrapper .badge-history-section .badge-history-wrapper .date-txt { margin: 1.64285rem auto 0; padding: 0.71428rem 0; width: 17.14285rem; height: 2.85714rem; background: #0371E5; border-radius: 2.85714rem; box-sizing: border-box; color: #fff; font-size: 1rem; line-height: 1.571428rem; font-weight: 300; text-align: center; }

.history-wrapper .mybage-history-list { margin: 1.42857rem 1.42857rem 0;}

.history-wrapper .mybage-history-list .data-table thead th { border-top-color: #666666; font-size:1rem;height:6.1111111vw ; }

.history-wrapper .mybage-history-list .data-table tbody td { font-size: 0.8571429rem; height: 7.7777778vw;font-family: 'noto_sans_cj_kkr';}

.history-wrapper .mybage-history-list .data-table tbody td .empty-title{ font-size:1rem; }

.history-wrapper .mybage-history-list .data-table + .btn-more { border-top: none; }

.reward-point-info { padding-top : 2.42857rem; text-align: center;}

.reward-point-info .img-center-wrap { text-align: center;}

.reward-point-info .badge-info-txt { padding: 1.5rem 0 3.42857rem; text-align: center; font-size: 1.42857rem; line-height: 2.14285rem; letter-spacing: -0.07142rem; }

.reward-point-info .membershi-info-txt { padding: 1.5rem 0 3.42857rem; text-align: center; font-size: 1.42857rem; line-height: 2.14285rem; letter-spacing: -0.07142rem; }

.reward-point-info .bage-info-txt { padding: 1.5rem 0 3.42857rem; text-align: center; font-size: 1.42857rem; line-height: 2.14285rem; letter-spacing: -0.07142rem; }


.badge-reward{ text-align: center;}

.badge-reward .point-info-txt{ font-size: 1.71428rem; line-height: 2.28571rem; }

.badge-reward .article-info-text{ margin-top: 0.57142rem; color:#666; }

.badge-reward .img-center-wrap.point {margin: 2.14285rem 0 2rem; }

.badge-reward .img-center-wrap.point img { width: 100%; }

.preparing-wrapper .badge-preparing { position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100%;}

.preparing-wrapper .badge-preparing .badge-icon {margin: 0 auto; display: flex; align-self: center; height: 100%;}

@media (max-width: 320px) { .preparing-wrapper .badge-preparing .badge-icon img { width: 100%; } }

.member-content .member-join-form .basic-guide-wrap.bolLine { border-top: 12px solid #f5f5f5; }

.admitted { position:relative; }

.admitted .join-title-wrap { padding-bottom: 2.57rem; }

.admitted .quarter { display:flex; justify-content: space-between; align-items: center; }

.admitted .phone-number-row.quarter { margin-top:0.714rem; }

.admitted .send-authentication { margin-top:1rem; }

.admitted .send-authentication .btn {width: 100%; border-radius: 0.57143rem;}

.admitted .selectric-wrapper { width:100%; margin-right: 0.5714rem; }

.admitted .selectric-wrappe:last-child { margin-right: 0; }

.admitted .selectric-wrapper .selectric { border:none; border-bottom:1px solid #bbbbbb; }

.admitted .field > .label.no-space { margin-bottom:1rem; }

.admitted .selectric-items ul, .admitted .birth .selectric-items li { font-size: 1.1428rem; color:#222; }

.admitted .em.warning, .admitted .input-cover.input-btn.time .time { color:#fe4f27; }

.admitted .phone-number-row input { position:relative; border-bottom: 1px solid #bbbbbb; padding:0 1.71429rem; }

.admitted .phone-number-row input::before { position:absolute; content:"-"; left:0; top:0; display:block; }

.admitted .at { display:inline-block; font-size: 0.875rem; color:#222; padding:0 0.571rem; }

.etc.notice .em.grey { color:#888; display:inline-block; line-height:1; font-size: 0.8571rem; }

.etc.notice .dot::before { content:"·"; display:inline-block; color:#888; padding-right:0.1rem; }

.etc.notice .blank::before { content:"·"; display:inline-block; color:transparent; }

/* .choice-wrapper */
.etc-wrapper {width:100%; box-sizing: border-box; background:#0d0f85;}

/* .etc-wrapper .etc-page-contents{padding-top:3.1428rem;} */
.etc-wrapper.location-agree-page { background-color:#0d0f85; height:calc(100vh + 3.1428rem);}

.etc-wrapper.location-agree-page .center-ls {display:flex; justify-content: center; align-items: center; }

.etc-wrapper.location-agree-page .center-ls.textBox {flex-flow: column wrap; padding:3.1428rem 0 2.2857rem; box-sizing: border-box; color:#fff;}

.etc-wrapper.location-agree-page .choice-wrap {padding:0 1.4285rem;}

.etc-wrapper.location-agree-page .choice-wrap .choice {width:100%; background:#fff; border-radius:1vh;}

.etc-wrapper.location-agree-page .double-label {display:flex; justify-content: space-between; align-items: center; padding:1.214rem 1.428rem 1rem; box-sizing: border-box;}

.etc-wrapper.location-agree-page .double-label.border {border-bottom:1px solid #dddddd;}

.etc-wrapper.location-agree-page .choiceBtn {position:relative;}

.etc-wrapper.location-agree-page .choiceBtn img{width:100%; vertical-align: top;}

.etc-wrapper.location-agree-page .choiceBtn .btnWrap{width:100%; padding:0 1.4285rem; box-sizing: border-box; margin-top: -1px;}

.etc-wrapper.location-agree-page .choiceBtn .btnWrap .btn.large{ height:3.1428rem;}

.etc-wrapper.location-agree-page .closeBtn {padding:1.714rem 0 4rem;}

.etc-wrapper.location-agree-page .closeBtn strong{color:#fff; font-size: 1rem; font-weight: 400; padding-left:.5rem;}

/* .location-agree-page.signal */
.etc-wrapper.location-agree-page.signal {background-image: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/@temp/img_signal_bg.png); background-size: cover; background-repeat: no-repeat; background-position: center center;}

.etc-wrapper.location-agree-page.signal .center-ls.textBox {padding:3.1428rem 0 0;}

.etc-wrapper.location-agree-page.signal .textBox h3 {font-size:1.8571rem; line-height:1.31; text-align: center; font-weight: normal; letter-spacing: -0.04em;}

.etc-wrapper.location-agree-page.signal .textBox p {width:17.428rem; text-align: center; font-size: 0.8571rem; line-height: 1.67; font-weight: normal; padding-top: 1.0714rem;}

.etc-wrapper.location-agree-page.signal .choiceBtn .btnWrap {margin-top: -2.8571rem;}

.mg-none{margin:0 !important;}

.hp_story_detail .youtube {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;}

.hp_story_detail .youtube iframe, .hp_story_detail .youtube object, .hp_story_detail .youtube embed{position: absolute; top: 0 !important; left:0 !important; width:100% !important; height: 100% !important;}

.cheering-popup.layer-popup .popup-head {border-bottom: none;}

.cheering-popup.layer-popup .popup-content {padding-bottom: 2.85714rem;}

.cheering-popup .cheering-complete {text-align: center;}

.cheering-popup .cheering-complete .donation-text {color: #000000; font-size: 1.71428rem; line-height: 2.28571rem;}

.cheering-popup .cheering-complete .donation-text > strong {display: block; font-weight: normal;}

.cheering-popup .cheering-complete p {display: block; padding: 1.42857rem 0 0; color: #666666; font-size: 1rem; line-height: 1.57142rem;}

.cheering-popup .cheering-complete img.cheering-complete {display: block; width: 60px; margin: 0 auto 0.71428rem;}

#popupSampleFullLuck.layer-popup .popup-inner,
#popupSampleFullTarot.layer-popup .popup-inner{}
#popupSampleFullLuckEdit.layer-popup .popup-inner,
#popupSampleFullTarotEdit.layer-popup .popup-inner {padding: 0 0 1.14286rem !important; -webkit-overflow-scrolling: touch; overflow-y: scroll;}
/* iframe 전용 팝업 */
.layer-popup.layer-iframe {}
.layer-popup.layer-iframe .popup-wrapper {position: relative;}
.layer-popup.layer-iframe .popup-head {position: absolute; top: 0; left: 0; right: 0; z-index: 1;}
.layer-popup.layer-iframe .popup-inner {padding: 4.14285rem 0 0 !important; -webkit-overflow-scrolling: touch; overflow-y: scroll; height: 100%;}
.layer-popup.layer-iframe.new {}
.layer-popup.layer-iframe.new .popup-head {background: none; border: none;}
.layer-popup.layer-iframe.new .popup-head .btn-close {background-color: #fff; top:8px; right: 8px !important; margin-top: 0; background-color: rgba(255, 255, 255, 0.5); }
.layer-popup.layer-iframe .popup-inner {padding: 0 !important; -webkit-overflow-scrolling: touch; overflow-x: hidden; overflow-y: scroll; height: 100%;}
.layer-popup.layer-iframe .popup-inner iframe {width: 102%;}

/* 해피페이 관련 요청건 */
.pay-content-wrap .pay-wrap {padding: 2.21428rem 1.35714rem;}

.pay-content-wrap .pay-wrap .title {color: #222222; font-size: 1.14286rem; font-weight: bold; line-height: 1.42857rem; letter-spacing: -0.28px;}

.pay-content-wrap .pay-wrap .card-wrap {position: relative; overflow: hidden; width: 17.35714rem; height: 10.8571rem; margin: 1.92857rem auto 2.5rem; border-radius: 0.71428rem; box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, 0.16);}

.pay-content-wrap .pay-wrap .card-wrap .img {position: relative;}

.pay-content-wrap .pay-wrap .card-wrap .img::before {content: ""; background: #fff; opacity: .8; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%;}

.pay-content-wrap .pay-wrap .card-wrap .img > img {width: 100%;}

.pay-content-wrap .pay-wrap .card-wrap .text {position: absolute; top: 50%; left: 0; right: 0; width: 100%; margin-top: -1.21428rem; text-align: center;}

.pay-content-wrap .pay-wrap .card-wrap .text > strong {color: #222222; font-size: 1rem; line-height: 1.28571rem;}

.pay-content-wrap .pay-wrap .card-wrap .text > p {color: #222222; font-size: 0.94286rem; line-height: 1.07142rem; padding-top: 0.35714rem;}

.pay-content-wrap .pay-wrap .card-list {margin: 0 -1.28571rem 2.5rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap {position: relative; padding: 1.78571rem 0 1.78571rem 1.28571rem; border-bottom: 1px solid #dddddd;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .card-cont {display: block; overflow: hidden; padding-right: 3rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .credit-card-image {display: inline-block; float: left; width: 6.85714rem; height: 4.35714rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .card-cont .card-infor {display: block; float: left; width: calc(100% - 8.28571rem); padding: 0.35714rem 0 0 1.28571rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .card-cont .card-infor .card-name {display: block; margin-bottom: 0.78571rem; color: #222222; font-size: 1.14286rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .card-cont .card-infor .card-number {display: block; color: #222222; font-size: 1rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .btn-delete {position: absolute; top: 3.07142rem; right: 1.28571rem; margin-top: 0; display: flex; color: #888888;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .btn-delete img {width: 1.71428rem; height: 1.71428rem;}

.pay-content-wrap .pay-wrap .card-list .card-list-wrap .btn-payment {display: flex; justify-content: center; align-items: center; margin: 1.71428rem auto 0; width: 16rem; height: 2.78571rem; box-sizing: border-box; background: #0D1085; border-radius: 3px; color: #ffffff; font-size: 1rem; text-align: center;}

.pay-content-wrap .pay-wrap .pay-register .btn-register {display: flex; justify-content: center; align-items: center; height: 48px; background: #F5F5F5; border: 1px dashed #0d1085; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); border-radius: 12px; color: #0d1085; font-size: 1.14286rem; font-weight: bold;}

.pay-content-wrap .pay-wrap .pay-register .btn-register::after {content: "+";display: inline-block; margin-left: 5px; color: #0d0f85; font-size: 20px;}

.pay-content-wrap .pay-wrap .pay-btn-wrap {flex-wrap: wrap; display: flex; margin-top: 28px;}

.pay-content-wrap .pay-wrap .pay-btn-wrap .btn {display: inline-flex; justify-content: center; align-items: center; width: calc(50% - 4px); height: 48px; border: 1px solid #888888; box-sizing: border-box; border-radius: 12px; color: #888888; font-size: 1rem;}

.pay-content-wrap .pay-wrap .pay-btn-wrap .btn:nth-child(odd) {margin-right: 4px;}

.pay-content-wrap .pay-wrap .pay-btn-wrap .btn:nth-child(even) {margin-left: 4px;}

.pay-content-wrap .pay-wrap .pay-btn-wrap .btn:nth-child(n + 3) {margin-top: 10px;}

.pay-content-wrap .note-list {background: #F4F4F4;}

.pay-content-wrap .accordion-container .accordion-head .article {font-size: 1.14286rem; line-height: 20px;}

.pay-content-wrap .accordion-container .accordion-body .data-list {padding: 0 23px;}

.pay-content-wrap .accordion-container .accordion-body .data-list > li {margin-left: 6px; text-indent: -6px; color:#888888; font-size: 1rem; line-height: 15px;}

.pay-content-wrap .pay-wrap .triangle-border {position: relative;padding: 0.777778vw;margin: 0 6vw 2.7777778vw;border: 0.5555556vw solid #ECAE9F;-webkit-border-radius: 2.7777778vw;-moz-border-radius: 2.7777778vw;border-radius: 1.3888889vw;font-size: 3.0555556vw;color: #ff826b;text-align: center;width: 46.855556vw;line-height: 6.6666667vw;letter-spacing: 0px;font-weight: 600;}
.pay-content-wrap .pay-wrap .triangle-border:before {content:"";position:absolute;bottom:-2.7777778vw; left:7.8888889vw;border-width:2.7777778vw 2.2vw 0px;border-style:solid;border-color:#ECAE9F transparent;display:block;width:0;}
.pay-content-wrap .pay-wrap .triangle-border:after {content:"";position:absolute;bottom:-2.2222222vw;left:8.4444444vw; border-width:2.2222222vw 1.666667vw 0px;border-style:solid;border-color:#fff transparent;display:block;width:0;}

.pay-content-wrap .pay-wrap  .point-5 img{max-height: 40px;margin-left: 20px;}

.pay-content-wrap .pay_btimg {bottom: -10px;}

.pay-content-wrap .pay_btimg img{width: 100%;}

.brand-coupon-wrap .top-img-wrap {position: relative;}
.brand-coupon-wrap .top-img { position: relative; width: 100%; height: 0; padding-bottom: 90.9333333vw; overflow: hidden; }
.brand-coupon-wrap .top-img .top-descripion { color: white;position: absolute;top: 34.6666667vw;left: 0;right: 0;text-align: center;font-size: 3.7333333vw;line-height: 5.3333333vw;font-family: 'NotoSansCJKkr';}

.brand-coupon-wrap .top-img-caption {position: absolute;font-size: 3.0555556vw;right: 6.6666667vw;bottom: -7.2222222vw;color: #666666;display: flex;}
.brand-coupon-wrap .top-img-caption > span {margin-right: 1.6666667vw;}

.brand-coupon-wrap .title-wrap { display: flex; margin: 11.1111111vw 8.8888889vw 5.5555556vw; font-size: 1.42857rem; }

.brand-coupon-wrap .title-wrap img {width: 24px; height: 24px;margin: auto 10px auto 0;}

.birth-coupon-wrap .top-img-wrap {position: relative;}
.birth-coupon-wrap .top-img { position: relative; width: 100%; height: 0; padding-bottom: 94.7222222vw; overflow: hidden; }
.birth-coupon-wrap .top-img .top-descripion { color: white;position: absolute;top: 34.6666667vw;left: 0;right: 0;text-align: center;font-size: 3.7333333vw;line-height: 5.3333333vw;font-family: 'NotoSansCJKkr';}
.birth-coupon-wrap .title-wrap { margin: 11.1111111vw 8.8888889vw 5.5555556vw; font-size: 5.5555556vw; text-align: center; font-weight: 600; }
.birth-coupon-wrap .desc-wrap { margin: 1.1111111vw	0 5.5555556vw; font-size: 4.4444444vw; text-align: center; color: #666; }


.premiumkit-wrap .title-wrap {margin: 3.111111vw  8.8888889vw 5.5555556vw; font-size: 5.5555556vw; text-align: center; font-weight: 600; }
.premiumkit-wrap .top-img .top-descripion { color: white;position: absolute;top: 34.6666667vw;left: 0;right: 0;text-align: center;font-size: 3.7333333vw;line-height: 5.3333333vw;font-family: 'NotoSansCJKkr';}
.premiumkit-wrap .desc-wrap { font-size: 4.4444444vw; text-align: center; color: #000; }

.premiumkit-wrap .grade-img-area {background: #f4f4f4;}
.premiumkit-wrap .ico-grade {margin-top: 1px;}
.premiumkit-wrap .ico-grade img{align-items: center;}
.premiumkit-wrap .desc-wrap .kit-img{margin: 0;}
.premiumkit-wrap .desc-wrap .kit-img .banner_img{width: 80.5555556vw}
.premiumkit-wrap .desc-wrap .kit-img .top_img{width: 100%}
/* .premiumkit-wrap .desc-wrap .kit-img .banner_img{width: 100%;} */
.premiumkit-wrap .desc-wrap .kit-infomation {padding: 6.3888889vw 0 10.5555556vw; font-size: 5vw;color: #222;}

.premiumkit-wrap .desc-wrap .kit-infomation  .kit-title { float: left; }
.premiumkit-wrap .desc-wrap .kit-infomation  .kit-title img{ float: left; width:8.3333333vw;margin: 0 1.3888889vw 1.3888889vw 13.8888889vw;}
.premiumkit-wrap .desc-wrap .kit-infomation  .kit-title .middle_text{ float: right;}

.premiumkit-wrap .desc-wrap .kit-infomation .top_text{font-size: 8.0555556vw;color: #222;}
.premiumkit-wrap .desc-wrap .kit-infomation .middle_text{font-size: 5vw;color: #222;font-weight: normal}
.premiumkit-wrap .kit-img .middle_text{font-size: 5vw;color: #222;font-weight: normal}


/* .premiumkit-wrap .desc-wrap .kit-infomation .marginTop {margin-top: 4.7222222vw;} */
.premiumkit-wrap .desc-wrap .kit-infomation .dates {font-size:1rem; line-height:5.5555556vw; color: #888;}
.premiumkit-wrap .desc-wrap .premiumkit-btn button {position:relative; font-size:5vw; height: 18.8888889vw;outline:0;background-color: white; color: #000; font-weight: 600; width: 100%;border:none;}
.premiumkit-wrap .desc-wrap .premiumkit-btn button img {position: absolute; right: 20px;top: 5.5555556vw; width:8.8888889vw; height:8.8888889vw;transform:rotate(180deg);}
.premiumkit-wrap .desc-wrap .premiumkit-btn button img.open {transform: rotate(0deg);}
.premiumkit-wrap .desc-wrap .premiumkit-apply button{margin: 8.3333333vw 0 0;height: 12vw;border-radius: 8px;border: 1px solid #fe4f27;background-color: #fe4f27; color: white;width: 100%; font-size:1rem; outline: 0;}

.premiumkit-wrap .user-info-wrap ul{list-style: none;}
.premiumkit-wrap .user-info-wrap li{float: left;}
.premiumkit-wrap .user-info-wrap .title{text-align: left;font-size:1rem;font-weight: 600;line-height: 5.5555556vw; margin: 4.7222222vw 0 2.2222222vw;}
.premiumkit-wrap .user-info-wrap input {font-size: 0.8571429rem;float: right;border: 1px solid #ddd;height: 11.6666667vw;padding-left: 18px; padding-right: calc(1.71429rem + 8px);}
.premiumkit-wrap .user-info-wrap .input-cover {display: inline-block; width: 100%;}
.premiumkit-wrap .user-info-wrap .input-btn .enc_post {width: 90%;padding: 10px 8.166667vw 0px;}
.premiumkit-wrap .user-info-wrap .input-cover .input-element {padding-right: 8px;}
.premiumkit-wrap .user-info-wrap .input-cover.phone {width: auto; margin-right: 3px;}
.premiumkit-wrap .user-info-wrap .input-cover.zip-code {width: 27.5vw;margin-right: 3px;}
.premiumkit-wrap .user-info-wrap .input-element.phone button {background: white; width:19.4444444vw; font-size:0.8571429rem; height: 100%; color: #fe4f27; border: 1px solid #fe4f27; outline: 0;}
.premiumkit-wrap .user-info-wrap .input-element.zip-code button {background: white; width:29.4444444vw; font-size:0.8571429rem; height: 100%; color: #fe4f27; border: 1px solid #fe4f27; outline: 0;}

.premiumkit-wrap .panel-warp {display:none; background:#f4f4f4; }
.premiumkit-wrap .panel-warp.open {display:block;}
.premiumkit-wrap .panel {display: inline-block; background: white; margin: 6.3888889vw 5.5555556vw 8.8888889vw; border-radius: 3.3333333vw;}

.premiumkit-wrap .panel .more-info {border-radius: 5px; margin: 11.1111111vw 5.2777778vw;}
.premiumkit-wrap .panel .more-info .description {font-size:1.1428571rem; font-weight: 300; line-height: 6.6666667vw;}
.premiumkit-wrap .panel .desc {text-align:left; margin: 3.0555556vw 0 0; font-size: 3.0555556vw; color: #888; line-height: 5vw;}

.premiumkit-wrap .gray-bg-wrap {background-color: #c1c1c1; color: #666;}

.premiumkit-popup02 .popup-body .article-block {margin-bottom: 12.7777778vw;}
.premiumkit-popup02 .popup-body .point-info-txt{ font-size: 1.71428rem; line-height: 2.28571rem; }
.premiumkit-popup02 .popup-body .popup-content .popupText p{font-size: 6.1111111vw}
.premiumkit-popup02 .popup-body .popup-content .popupText b{color: #6b2756;}
.premiumkit-popup02 .popup-body .popup-content .popupText span{font-size: 3.8888889vw;color: #666666;font-weight: 400;}
.premiumkit-popup02 .popup-body .article-block img{width:18.2222222vw;margin-bottom: 7.5833333vw;}

.grade-img-area .grade-panel-warp {position: relative; background: #fff;}
.grade-img-area.open .grade-panel-warp {padding-bottom: 16.6666667vw; }

.grade-img-area .grade-panel {position: relative;margin: 0 5.5555556vw;background: white;border-radius: 2.7777778vw 2.7777778vw 0 0;box-shadow: 0 0 10px 10px rgb(0 0 0 / 2%);}
.grade-img-area .grade-panel > p.title {font-size: 4.4444444vw; padding: 2.7777778vw 5.5555556vw; margin-bottom: 1.6666667vw; line-height: 6.6666667vw; color: #fff; border-radius: 4.7222222vw	4.7222222vw 0 0;}
.grade-img-area .grade-panel > p.title .grade {font-weight: bold; float: right; margin-right:8.3333333vw;}
.grade-img-area .grade-panel .content-wrap > p,
.grade-img-area .grade-panel > p {font-size: 0.8571429rem;line-height: 5vw;}
.grade-img-area.open .grade-panel {border-radius: 2.7777778vw;}

.grade-img-area .grade-panel .more-info {display:none;margin-top: 1.9444444vw;padding-bottom: 5.5555556vw; border-radius: 0 0 2.7777778vw 2.7777778vw;text-align: center;}
.grade-img-area.open .grade-panel .more-info {display:block;}
.grade-img-area .grade-panel ul {display: flex;width: 100%;flex-basis: 0;text-align: center;}
.grade-img-area .grade-panel ul li {flex-grow: 1;}

.grade-img-area .grade-panel .more-info .title {font-weight: normal; font-size:1rem;}
.grade-img-area .grade-panel .more-info .chart {margin:1.6666667vw 0 0 0;}
.grade-img-area .grade-panel .more-info .summary {color:#bbbbbb;font-size:0.8571429rem;margin:1.1111111vw 0 6.6666667vw 0;}
.grade-img-area .grade-panel .more-info .summary b {font-weight: normal;color:#2e2e2e;}
.grade-img-area .grade-panel .more-info .desc {color: #666666;font-size: 2.7777778vw;width: 100%;}

.grade-img-area .grade-panel .content-wrap {padding: 3.6111111vw 5.5555556vw;}

.grade-img-area .grade-panel .open-panel {position: absolute;right: 3.3333333vw; top: 1vw;background: url(https://front.happypointcard.com/upfiles/appMain/resources/ha-api/images/common/membership/btn_arrow_down.svg) no-repeat center;height: 11.1111111vw;width: 11.1111111vw;outline: 0;border: 0;}
.grade-img-area.open .grade-panel .open-panel {transform:rotate(180deg);}
.circle-chart__circle {transform: rotate(90deg); transform-origin: center; animation: cubic-bezier(0.84, 0.01, 1, 1) reverse 2s circle-chart-fill; }

.game-content-wrap .game_top img{width: 100%;display: block;}
.game-content-wrap .game_default img{width: 100%;display: block;}
.game-content-wrap .game_middle img{width: 100%;display: block;}
.game-content-wrap .game_bottom img{width: 100%;display: block;}


.daily-coffee-wrap .coffe_top{height: 1610px;}
.daily-coffee-wrap .coffe_top img{width: 100%;height: 100%;}
.daily-coffee-wrap .coffe_middle{height: 120px;}
.daily-coffee-wrap .coffe_middle img{width: 100%;height: 100%;}
.daily-coffee-wrap .coffe_bottom{height: auto;}
.daily-coffee-wrap .coffe_bottom img{width: 100%;height: 100%;}

/*.daily-coffee-wrap .section-parts{ background-color:#FFFFFF; }*/

@keyframes circle-chart-fill { to { stroke-dasharray: 0 100; } }

.membership-notice-wrapper {background: #676769;}
.membership-notice-wrapper .data-list-wrap {margin: 0 5.5555556vw; padding-bottom: 10vw;}
.membership-notice-wrapper .data-list-wrap .data-list-area { margin-top: 5.5555556vw; }
.membership-notice-wrapper .data-list-wrap .data-list-area .title { color: #fff; padding: 5.5555556vw 0; font-weight: 600; font-size: 4.4444444vw; word-break: break-all; }
.membership-notice-wrapper .data-list-wrap .data-list-area .data-list li { font-size: 3.8888889vw; font-weight: normal; color: #fff; }
.membershippop {margin-top: 0;}

.membershippop .data-list-wrap {text-align: center;margin-bottom:1.5714286rem;margin-top: 1.2857143rem;}
.membershippop .grade-main {position: relative;margin: 0 auto;background-color: #ffffff;border-radius: 2.7777778vw 2.7777778vw 2.7777778vw 2.7777778vw; padding-bottom: 15px;box-shadow: 0px 20px 50px 5px #ccc;}

.membershippop .grade-panel {position: relative;margin: 0 auto;background-color: #ffffff;border-radius: 2.7777778vw 2.7777778vw 0 0;padding: 16px 21px 5.5px;}

.membershippop .data-list-wrap img{width: 100%;}

.membershippop .grade-panel .more-info h4{text-align: left;font-size: 1rem;font-weight: 600;margin: 0; padding: 0;}

.membershippop .grade-panel .more-info ul{ display: flex; width: 100%; flex-basis: 0;text-align: center; margin-top: 4.1666667vw;}

.membershippop .grade-panel .more-info li {margin-right: auto;}
.membershippop .grade-panel .more-info li:last-child {margin-right: 0;}

.membershippop .grade-panel .more-info {margin-top: 1.3888889vw;padding-bottom: 0; border-radius: 0 0 2.7777778vw 2.7777778vw;text-align: center;background-color: #ffffff;}

.membershippop .membership-stage-info-wrapper.open .grade-panel .more-info {display:block;}

.membershippop .grade-panel .more-info .title {font-weight: normal; font-size:0.8571429rem;margin:0px auto}

.membershippop .grade-panel .more-info .chart {margin:7px 0 3px;}

.membershippop .grade-panel .more-info .chart svg{width: 18.9333333vw; height: 18.9333333vw;}

.membershippop .grade-panel .more-info .summary {color:#bbbbbb;font-size:0.8571429rem;margin:0px auto}

.membershippop .grade-panel .more-info .summary b {font-weight: normal;color:#2e2e2e;}

.membershippop .grade-main .desc {color: #666666;font-size:0.7142857rem;width: 100%;font-weight: 300;letter-spacing: -0.16px;}
.membershippop .grade-main .remark {padding: 0px 4.1666667vw 3.6111111vw;line-height: 80%;}
.membershippop .grade-main .line {height: 1px;margin: 6.3333333vw 4.1666667vw 2.9166667vw;background-color: #e5e5e5;}
.membershippop .grade-main .bage_click img{float: right;position: absolute;margin-top: 1.522222vw;height: 6.3222222vw;width: 14.4444444vw;}
.membershippop .popup-wrapper .membership-stage-info-wrapper{background-color: #f7f7f7;}

.membershippop .grade-panel .content-wrap {width: 100%;text-align: center;padding-top: 23.3333333vw;background-color: #ffffff;}

.membershippop .popup-head.no-line { background-color: #ffffff; height: 6.4vw; line-height: 6.4vw; border-bottom: 1px solid #cccccc;}

.membershippop .triangle-border {position: relative;-webkit-border-radius: 2.7777778vw;-moz-border-radius: 2.7777778vw;border-radius: 1.1111111vw;text-align: center;line-height: 4.666667vw;letter-spacing: 0.0555556vw;margin: 4vw  3.6944444vw  4.0277778vw 4.0277778vw;  font-size: 2.7777778vw;padding-bottom: 3.8888889vw;}
.membershippop .triangle-border:before {content:"";position:relative;bottom:2.777778vw; left:50%;border-width:0 5.333333vw 5.2777778vw;border-style:solid;border-color:#E7F2FE transparent;display:block;width:0;transform:translateX(-50%);}
.membershippop .triangle-border.changed:before {content:"";position:absolute;bottom:11.777778vw; left:44.8%;border-width:0 5.333333vw 5.2777778vw;border-style:solid;border-color:#E8E8F1 transparent;display:block;width:0;}
.membershippop .triangle-border .ptxt{font-size:0.8571429rem;line-height: 4.2666667vw;}

.membershippop .ico-grade { display: block; width: 11.25vw; height: 11.25vw; margin: 0 auto; margin-bottom: 2.1388889vw;}

.membershippop .ico-grade img { display: block; width: 99%; height: 99%; }

#gradeCouponInfo .pack-title {background: #f3f3f3;font-size:3.8888889vw;line-height: 16.6666667vw;}
#gradeCouponInfo .pack-title > img {vertical-align: middle;width: 24px; height: 24px;}
#gradeCouponInfo .pack-title > span {vertical-align: middle;}

#gradeCouponInfo .pack-content {display: flex;font-size: 3.2vw;vertical-align: middle;height: 11.6666667vw;border-bottom: 1px solid #f5f5f5;}

#gradeCouponInfo .pack-content > span:first-child {width: 26.9444444vw;border-right: 1px solid #f5f5f5; text-align: center; font-weight: 600;}
#gradeCouponInfo .pack-content > span {vertical-align: middle;width: 61.6666667vw; text-align: left;line-height: 12vw;margin-left: 1vw;letter-spacing: -0.6px;}

.tab-grade-wrap {margin: 8.8888889vw 8.3333333vw 0;}
.tab-grade-wrap .tab-grade {display: flex;}
.tab-grade-wrap .tab-grade li {position: relative;flex-grow: 1;text-align: center;width: 22.2222222vw;height: 22.2222222vw;background: #e5e5e5;border-radius: 8px 8px 0 0;margin: 0 1.3888889vw;}
.tab-grade-wrap .tab-grade li.on {background: #fff;}
.tab-grade-wrap .tab-grade li > div {transform: translate(-50%,-50%);position: absolute;left: 50%;top: 50%;}
.tab-grade-wrap .tab-grade li > div img {width: 8vw; height: 8vw; margin: 4px 0;}

button.full-button { height: 12vw; width: 100%; border-radius: 8px; background: #fe4f27; color: white; font-size: 4.4444444vw; outline: 0; border: none; }

.adsBannerWrap {
    position: relative;
    color: #3A3A3F;
    border-radius: 2.13333333vw;
    background-color: #F1F4FA;
    padding: 0 4.8vw;
    margin-top: 4.26666667vw;
    line-height: 12.8vw;
}

.adsBannerWrap::before {
    position: absolute;
    top: 1.066vw;
    right: 1.066vw;
    content: 'AD';
    /*color: rgb(32 170 55 / 30%);*/
    color: #9BB4D2;
    font-size: 2.14vw;
    line-height: normal;
}

.fs13 {
    font-size: 3.166666667vw !important;
    color: #173456;
}

.adsBannerWrap .link {
    float: right;
    color: #173456;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 0.66666667vw;
}