@charset "UTF-8";
@import "./library/datepicker.min.css";
@import "./library/swiper.min.css";
@import "./reset.css";
@import "./layout.css";

/* margin */
.mt0 {margin-top:0 !important;}
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt10 {margin-top:10px !important;}

.mt13 {margin-top:13px !important;}

.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:20px !important;}

.mt23 {margin-top:23px !important;}

.mt30 {margin-top:30px !important;}
.mt40 {margin-top:40px !important;}
.mt50 {margin-top:50px !important;}
.mb20 {margin-bottom:20px !important;}
.mb60 {margin-bottom:60px !important;}
.pb30 {padding-bottom:30px !important;}
.pb100 {padding-bottom:100px !important;}

/* font */
.txt-red{color:#f30000 !important;}
.txt-666 {color:#666 !important;}
.txt-999 {color:#999 !important;}
.txt-111 {color:#111 !important;}
.txt-blue {color:#4490e9 !important;}
.txt-darkblue {color:#3f60d5 !important;}
.txt-green {color:#00b67e !important;}
.txt-black {color:#000 !important;}
.asterisk {color:#f30000;}

.txt-14 {font-size:14px !important;}
.txt-13 {font-size:13px !important;}

.regular {font-weight:400 !important;}

.offscreen {display: inline-block; position: absolute;
  overflow: hidden; border: 0; width: 1px;
  height: 1px; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
}

.title-section {font-size:16px; line-height:1.5; font-weight:700; color:#000;}
.title-sub {font-size:15px; line-height:1.8; color:#000;}
.title-search {margin-top:27px; font-size:13px; line-height:1.5; color:#666;}
.desc-str {font-size:14px; color:#000; line-height:1.43; font-weight:bold;}
.desc {font-size:13px; color:#666; line-height:1.43;}
.desc2 {margin-top:5px; font-size:13px; color:#999; line-height:1.43;}
.txt-link {display:inline-block; font-size:13px; line-height:1.3; border-bottom:1px solid #111;}
.txt-link.txt-666 {border-color: #666;}
/* .arrow-link-right {display:block; margin-top:20px; padding-top:8px; border-top:1px solid #eee; font-size:13px; color:#666; line-height:1.3; text-align:right;}
.arrow-link-right:after {content:''; display:inline-block; width:4px; height:9px; margin-left:5px; background:url('../images/common/spr_common.png') -156px -98px no-repeat; background-size:360px auto;} */
.desc-str + .desc {margin-top:2px;}
.input-point + .desc {margin-top:8px;}

/* desc */
.bullet-list {font-size:14px;}
.bullet-item {position:relative; padding-left:13px; color:#666;}
.bullet-item + .bullet-item {margin-top:8px;}
.bullet-item:after {position:absolute; left:0; top:.6em; content:''; display:inline-block; width:3px; height:3px; background-color:#666; border-radius:50%;}
.bullet-list.txt-13 .bullet-item,
.bullet-item.txt-13 {padding-left:9px;}

.number-list {counter-reset:li;}
.number-list .number-item {position:relative; padding-left:19px; color:#666;}
.number-list .number-item:after {content:counter(li) '.'; counter-increment:li; position:absolute; left:0; top:0;  display:inline-block;}
.number-list.txt-13 .number-item {padding-left:15px;}

/* text align */
.align-left {text-align:left !important}
.align-right {text-align:right !important}
.align-center {text-align:center !important}
.contents.center-item {height:100vh;}
.center-item {display:flex; align-items:center; height:calc(100vh - 112px); justify-content:center; box-sizing:border-box;}
.center-item .nodata {padding-top:0;}
.v-center {display:flex; align-items:center; flex-direction:column; justify-content:center; height:100%; min-height:80vh;}
.v-center .inner {}
.block {display:block;}

/* box */
[class^='box'] {padding-right:20px; padding-left:20px; border-radius:10px;}

/* submain banner */
.banner {padding:20px; border-radius:10px; text-align:center;}
.banner [class^='btn'] {margin-top:10px;}

/* bg color */
.blue {background-color:#4490E9; color:#fff;}
.light-blue {background-color:#c8e7ff;}
.light-blue2 {background-color:#e9f6fe;}
.light-blue3 {background-color:#f0f9fe;}
.purple {background-color:#3f60d5; color:#fff;}
.light-purple {background-color:#e7e7ff;}
.green {background-color:#00b67e; color:#fff;}
.light-green {background-color:#d0f1e3;}
.light-green2 {background-color:#e8faf2;}
.gray {background-color:#f8f9fc;}
.white {background-color:#fff;}
/* 20200909추가 */
.light-gray {background-color: #f1f1f1;}

.firecracker {z-index:999999; position:absolute; top:0; left:0; width:100%; pointer-events:none;}

/* section */
[class^='section'] {position:relative;}
[class^='section'] + [class^='section'] {margin-top:40px;}
[class^='section'] + .banner {margin-top:40px}
[class^='section'] .title-section {margin-bottom:12px;}
.section-more {position:absolute; right:0; top:1px; line-height:19px; font-size:13px; color:#666;}
.section-more:after {box-sizing:border-box; content:''; display:inline-block; width:15px; height:15px; vertical-align:-3px; background: url('../images/common/spr_common.png') -150px -95px no-repeat; background-size:360px auto;}
.no-section {display:flex; justify-content:center; align-items:center; border-radius:10px; height:90px; background-color:#f8f9fc; font-size:14px; color:#666;}

/* button */
[class^='btn-'] {display:inline-block; padding:0 10px; font-weight:700; text-align:center; white-space:nowrap; vertical-align:middle; border:1px solid transparent; box-sizing:border-box; transition:color 0.1s ease-in-out, background-color 0.1s ease-in-out, border-color 0.1s ease-in-out; border-radius:5px;}
[class^='btn'][class*='white'] {color:#4490e9; background-color:#fff; border-color:#4490e9;}
[class^='btn'][class*='blue'] {color: #fff; background-color:#4490e9; border-color:#4490e9;}
[class^='btn'][class*='blue'][class*='line'] {background-color:transparent; color:#4490e9;}
[class^='btn-white']:disabled,
[class^='btn-white'].disabled {background-color:#fff; color:#bfbfbf; border-color:#bfbfbf;}
[class^='btn-blue']:disabled,
[class^='btn-blue'].disabled {background-color:#d9d9d9; color:#999; border-color:#d9d9d9;}
[class^='btn-white']:active {background-color:#e9f6fe;}
[class^='btn-blue']:active {background-color:#3561b5; border-color:#3561b5;}

[class^='btn'][class*='sm'] {height:36px; line-height:34px; padding:0 20px; font-size:13px;}
[class^='btn'][class*='md'] {height:44px; line-height:42px; padding:0 35px; font-size:14px;}
[class^='btn'][class*='lg'] {height:54px; line-height:52px; padding:0 55px; font-size:15px;}

.btn:active {filter: brightness(90%);}
.btn:disabled {opacity:.65; pointer-events:none;}
.btn:not(:disabled):not(.disabled) {cursor:pointer;}

.modal-footer,
.row-btns {display:flex; justify-content:center; width:100%; box-sizing:border-box;}
.foot-btm {position:absolute; left:0; right:0; bottom:0; z-index: 1; height:115px; /*background-color:#fff;*/}
.foot-btm .row-btns {position:absolute; left:0; bottom:0; right:0; padding:0 20px calc(20px + var(--safeBtm));}
.fix-btm {position:fixed; left:0; right:0; bottom:0; z-index: 1; box-sizing:border-box;  padding:0 20px calc(20px + var(--safeBtm));}
.modal-footer .col,
.row-btns .col {position:relative; display:inline-block; flex: 1 1 100%;}
.modal-footer [class^='btn'],
.row-btns [class^='btn'] {width:100%; padding:0 20px;}
.row-btns .col + .col {margin-left:3px;}
.row-btns .col:nth-last-child(2) {margin-right:3px;}
.row-btns.column {flex-direction:column;}
.row-btns.column .col {margin:0;}
.row-btns.column .col + .col {margin-top:6px;}
.modal.sm .row-btns {/*padding:30px 0 24px;*/}

.sticky-btn {flex-shrink:0; height:78px;}
.sticky-btn-inner {display:flex; position:absolute; bottom:0; left:0; width:100%; padding:0 20px calc(24px + var(--safeTop));}

.btn-radio-group {display:flex; table-layout:fixed; width:100%; padding:0; border-radius:5px; overflow:hidden;}
.btn-radio-group input {position:absolute; opacity:0;}
.btn-radio {flex:1 0 1px; border:1px solid #d9d9d9; border-right:none; height:44px; line-height:44px; font-size:14px; color:#999; border-radius:0;}
.btn-radio:first-child {border-radius:5px 0 0 5px;}
.btn-radio:last-child {border-right:1px solid #d9d9d9; border-radius:0 5px 5px 0;}
.btn-radio + .btn-radio {border-left:1px solid #d9d9d9;}
.btn-radio.active .txt,
.btn-radio input:checked + .txt {color:#4490e9; font-weight:700;}
.btn-radio.active {border:1px solid #4490e9;}
.btn-radio.active + .btn-radio {border-left:none;}
.btn-radio .txt {font-weight:400;}

.btn-select {position:relative; width:100%; padding-left:46px; font-weight:400; text-align:left; height:44px; line-height:43px; border:1px solid #d9d9d9;}

.checkbox.type2,
.radio.type2 {display:block; height:auto; min-height:52px; padding:15px 40px 15px 15px; box-sizing:border-box; border-radius:5px; border:1px solid #eee;}
.checkbox.type2 + .checkbox.type2,
.radio.type2 + .radio.type2 {margin-top:10px;}
.radio.type2.active,
.checkbox.type2.active {border-color:#4490e9;}
.checkbox.type2 .icon,
.radio.type2 .icon{position:absolute; right:15px; top:50%; transform:translateY(-50%);}
.checkbox.type2.disabled,
.radio.type2.disabled {background-color:#f8f9fc; color:#999}

.checkbox.type2 .icon input,
.radio.type2 .icon input {margin:0;}
/*.checkbox.type2 i,
.radio.type2 input[type='radio']:checked + i {position:absolute; left:auto; right:22px; top:50%; transform:translateY(-50%);}
.radio.type2 input[type='radio']:checked + i {right:26px;}*/

/* tab */
[data-tab-content] {display:none;}
[data-tab-content].active {display:block;}

.tab-card {font-size:0; white-space:nowrap; overflow-x:auto;}
.tab-card li {display:inline-block;}
.tab-card li + li {margin-left:6px;}
.tab-card a {display:block; height:40px; min-width:74px; padding:0 10px; line-height:40px; box-sizing:border-box; color:#111; font-size:14px; text-align:center; background-color:#f8f9fc; border-radius:5px;}
.tab-card li.active a {background-color:#e9f6fe; color:#4490e9; font-weight:700;}

.tab-list {display:table; table-layout:fixed; width:100%; padding:0; border-radius:5px; overflow:hidden;}
.tab-list li {display:table-cell; border:1px solid #d9d9d9; border-right:none; height:44px; font-size:14px; color:#666; border-radius:0; text-align:center;}
.tab-list li:first-child {border-radius:5px 0 0 5px;}
.tab-list li:last-child {border-right:1px solid #d9d9d9; border-radius:0 5px 5px 0;}
.tab-list li + li {border-left:1px solid #d9d9d9;}
.tab-list a {display:block; height:100%; line-height:44px;}
.tab-list li.active {border:1px solid #4490e9;}
.tab-list li.active + li {border-left:none;}
.tab-list li.active a {color:#4490e9; font-weight:700;}

.tab-list2 {margin-top:10px;}
.tab-list2 li {display:inline-block;}
.tab-list2 li + li:before {content:''; display:inline-block; height:12px; margin:0 10px; border-left:1px solid #e1e1e1;}
.tab-list2 a {font-size:16px; color:#999; font-weight:700;}
.tab-list2 li.active a {color:#000;}

.tab-card {font-size:0; white-space:nowrap; overflow-x:auto; scrollbar-width:0;}
.tab-card li {display:inline-block;}
.tab-card li + li {margin-left:6px;}
.tab-card a {display:block; height:40px; min-width:74px; padding:0 10px; line-height:40px; box-sizing:border-box; color:#111; font-size:14px; text-align:center; background-color:#f8f9fc; border-radius:5px;}
.tab-card li.active a {background-color:#e9f6fe; color:#4490e9; font-weight:700;}

/* datepicker */
.datepicker-group {position:relative; display:flex; align-items:center;}
.datepicker-group .dash {flex:1 0 auto; display:inline-block; width:8px; height:1px; margin:0 9px; background-color:#000;}
.datepicker-group [class^='btn'] {position:absolute; top:0; right:0; width:56px; padding:0 10px;}
.datepicker-group.type2 [class^='btn'] {position:static; margin-left:6px;}
input.icon-calendar {padding-right:35px; background:url('../images/common/icon_calendar.png') right 13px top 12px no-repeat; background-size:16px auto;}

.datepicker-inline .datepicker {width:100%; border:none;}
.datepicker-inline .datepicker--nav {border:0;}
.datepicker-inline .datepicker--nav-title {width:100%;}
.datepicker-inline .datepicker--nav-title i {position:relative; top:-1px; color:#000;}
.datepicker--cell.-selected-, .datepicker--cell.-selected-.-current-, .datepicker--cell.-selected-.-focus-{background:none;}
.datepicker--cells .datepicker--cell.-focus-{background:none;}

/* Icon */
.icon-act {display:inline-block; width:40px; height:40px;}
.icon-tooltip {display:inline-block; width:20px; height:20px; margin-left:5px; background:url('../images/common/spr_common.png') -280px -75px no-repeat; background-size:360px auto; vertical-align:top;}
.icon-help {display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') -175px -110px no-repeat; background-size:360px auto; vertical-align:top;}
.activity-item.disabled .icon-link {opacity:.4;}

[class^='icon-weather'] {display:inline-block; width:35px; height:35px; background:url('../images/common/spr_common.png') 0 -110px no-repeat; background-size:360px auto;}
.icon-weather-sun {}
.icon-weather-cloud {background-position:-35px -110px;}
.icon-weather-cloud2 {background-position:-70px -110px;}
.icon-weather-rain {background-position:-105px -110px;}
.icon-weather-drizzle {}
.icon-weather-lightning {}
.icon-weather-none {background:none;}

[class^='icon-state'] {display:block; width:80px; height:80px; margin:0 auto 20px; background:url('../images/common/spr_state.png') 0 0 no-repeat; background-size:595px auto;}
.icon-state-join {width:150px; height:146px; margin-bottom:26px; background:url('../images/common/join_complete.png') 0 0 no-repeat; background-size:150px auto;}
.icon-state-sprout {}
.icon-state-pig {background-position:-85px 0;}
.icon-state-account {background-position:-170px 0;}
.icon-state-use {background-position:-255px 0;}
.icon-state-use2  {background-position:-425px -80px;}
.icon-state-gift {background-position:-340px 0;}
.icon-state-donate {background-position:-425px 0;}
.icon-state-nfc {background-position:-510px 0;}
.icon-state-survey {background-position:0 -80px;}
.icon-state-finger {background-position:-85px -80px;}
.icon-state-invite {background-position:-170px -80px;}
.icon-state-mountain {background-position:-255px -80px;}
.icon-state-running {background-position:-340px -80px;}
.icon-state-error {background-position:-510px -80px;}
.icon-state-pig-disabled {background-position:0 -160px;}
/* Table */
.table {font-size:14px; border-top:1px solid #d9d9d9;}
.table th,
.table td {padding:10px; line-height:1.5; text-align:left;}
.table th {color:#000; font-weight:700;}
.table td {color:#666; border-bottom:1px solid #d9d9d9;}
.table thead th {border-bottom:1px solid #000;}
.table tbody th {border-right:1px solid #000; border-bottom:1px solid #d9d9d9;}
.table thead th + th {border-left: 1px solid #d9d9d9;}
.table tbody td + td {border-left: 1px solid #d9d9d9;}
.table.align-center th,
.table.align-center td {text-align:center;}

.table-terms {margin:10px 0; font-size:14px; border-bottom:1px solid #d9d9d9;}
.table-terms th {padding:10px; line-height:1.5; text-align:center; border-top:1px solid #d9d9d9; border-bottom:1px solid #000; color:#000;}
.table-terms th + th {border-left:1px solid #d9d9d9;}
.table-terms td {padding:20px; line-height:1.5; text-align:left;}

/* step */
.step-list {counter-reset:step; font-size:0;}
.step-list li {position:relative; display:inline-block; border-radius:50%; width:18px; height:18px; border:1px solid #d9d9d9; text-align:center; box-sizing:border-box;}
.step-list li + li {margin-left:12px;}
.step-list li:before {content:counter(step); counter-increment:step; line-height:16px; vertical-align:top; color:#999; font-size:10px; font-weight:700;}
.step-list li:after {position:absolute; left:-13px; top:7px; content:''; display:inline-block; width:12px; height:1px; background-color:#eee;}
.step-list li:first-child:after {content:none;}
.step-list .success:after,
.step-list .current:after {background-color:#000;}
.step-list .current {border-color:#000;}
.step-list .current:before {color:#000;}
.step-list .success {border-color:#000; background-color:#000;}
.step-list .success:before {content:''; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') -120px -95px no-repeat; background-size:360px auto;}

/* 이용약관 */
.agree-list li {padding:6px 0;}
.agree-list .agree-item {position:relative;}
.agree-list .agree-item.line {padding-bottom:20px; margin-bottom:14px; border-bottom:1px solid #e1e1e1;}
.agree-list .agree-item .txt-link {position:absolute; right:0; top:9px; color:#666;}

/* Section State */
.section-state {text-align:center; color:#666; font-size:14px;}
.section-state .title {font-size:26px;}
.section-state .title + .txt {margin-top:10px;}

/* data list */
.data-option {margin:20px 0 10px; text-align:right;}
.data-option + .data-list {margin-top:10px;}
.data-option .data-option-item {display:inline-block; margin-left:-4px;}
.data-option .data-option-item + .data-option-item:before {content:''; display:inline-block; vertical-align:-2px; margin:0 8px; height:12px; border-left:1px solid #e1e1e1;}

[class^='data-list'] {border-top:1px solid #000;}
[class^='data-list'] .data-item {position:relative; display:flex; justify-content:space-between; align-items:center; min-height:72px; padding:15px 10px 14px; box-sizing:border-box; border-bottom:1px solid #e1e1e1;}
[class^='data-list'] .data-item .info {}
[class^='data-list'] .data-item .name {color:#000;}
[class^='data-list'] .data-item .name .name-arrow {position:relative; padding-right:15px;}
[class^='data-list'] .data-item .name .name-arrow:after {content:''; position:absolute; right:0; top:0; width:15px; height:15px; background:url(../images/common/spr_common.png) -165px -95px no-repeat; background-size:360px auto;}
[class^='data-list'] .data-item .time {color:#999; font-size:13px;}
[class^='data-list'] .data-item .value {color:#000; white-space:nowrap; margin-left:auto;}
[class^='data-list'] .data-item .delete {width:24px; height:100%; font:0/0 a; margin-left:10px;}
[class^='data-list'] .data-item .delete:after {content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') -320px -75px no-repeat; background-size:360px auto; pointer-events:none;}

.data-list2 .data-item {padding-right:10px;}
.data-list2 .data-item button{display:none;}

.data-list.service {margin-top:20px;}
.data-list.service .data-item button {flex-grow: 0; margin-left:10px;}

/* nodata */
.nodata {padding-top:120px; text-align:center; font-size:14px; color:#666;}
.nodata [class^='icon-no'] {display:inline-block; width:60px; height:60px; margin-bottom:8px; background:url('../images/common/spr_common.png') 0 0 no-repeat; background-size:360px auto;}
.nodata .icon-nodata {background-position-x: 0px;}
.nodata .icon-noevent {background-position-x: -60px;}
.nodata .icon-novideo {background-position-x: -120px;}
/* .nodata.full {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); padding-top:0;} */
.nodata.full {display:flex; flex-direction:column; align-items:center; justify-content:center; padding-top:0; min-height:300px; padding-bottom:60px; height:80vh; box-sizing:border-box;}

.result-txt {margin-top:20px; text-align:center; font-size:14px; color:#666;}
.result-txt .img {width:80px; height:80px; margin:0 auto 20px;}
.result-txt + .desc {margin-top:30px;}
.result-txt .title-sub {margin-bottom:6px;}
.result-txt .name {font-weight: bold; color: #4490e9; margin-bottom: 4px;}

.modal-point-state {margin-top:40px; text-align:center; font-size:14px; color:#000;}
.modal-point-state p + p {margin-top:5px;}
.ellipsis-2 {overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-box;}


/*
** Page
*/
/* 나의 SVP 실천 */
.sv-list {margin-top:10px; padding:0 24px; border:1px solid #eee; border-radius:10px;}
.sv-item {display:flex; align-items:center; justify-content:space-between; font-size:14px;}
.sv-item + .sv-item {border-top:1px solid #eee;}
.sv-item .name {font-size:13px; color:#666;}
.sv-item .value {font-size:18px; color:#000; letter-spacing:5px;}
.sv-item .link-arrow {position:relative; padding-right:23px;}
.sv-item .icon-link {position:absolute; right:0; top:3px; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') 0 -95px no-repeat; background-size:360px auto;}
.sv-list.light-purple .sv-item + .sv-item {border-top:1px solid #dbdefc;}

.box-score {position:relative; padding:25px 20px 15px;}
.box-score .title-sub {padding-right:80px;}
.box-score .title-sub .name {display:inline-block; max-width:110px; vertical-align:top; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.box-score .score {font-size:30px;}
.box-score .score strong {font-size:34px;}
.box-score .btn-score {position:absolute; right:20px; top:20px; height:30px; line-height:30px; padding:0 12px; background-color:#fff; font-size:13px; font-weight:400;}
.box-score.light-blue .btn-score {color:#4490e9;}
.box-score.light-green .btn-score {color:#00b67e;}
.box-score .hr {margin:25px 0 15px; border-top: 1px solid #b9d9fa;}
.box-score.light-green .hr {border-color:#00b67e; opacity:.2;}
.box-score .sv-item .icon-link {background-position:-135px -95px;}

.box-qr {margin-top:10px; padding:15px 20px; text-align:center;}
.box-qr .icon-qr {display:inline-block; vertical-align:top; width:20px; height:20px; background:url('../images/common/spr_common.png') -60px -75px no-repeat; background-size:360px auto;}

.section-score .title-sub {line-height:1.4;}
.box-level {margin-top:10px; padding:15px 20px;}
.box-level .sv-progress {margin-top:15px;}

.sv-progress {height:6px; border-radius:3px; overflow:hidden; background-color:#fff;}
.sv-progress span {display:block; height:100%; border-radius:0 3px 3px 0; background-color:#95a1e6;}
.progress-desc {margin-top:6px; color:#3f60d5; font-size:13px;}

.stamp-list {font-size:0;}
.stamp-list .stamp-item {display:inline-block; width:25%; margin-top:20px; vertical-align:top; text-align:center;}
.stamp-list .stamp-item .img {width:66px; height:66px; margin:0 auto;}
.stamp-list .stamp-item:nth-child(-n+4) {margin-top:15px;}
.stamp-list .stamp-item .txt {display:block; margin-top:5px; font-size:13px; color:#666;}
.section-stamp .stamp-list {margin:0 -20px; padding:0 20px; white-space:nowrap; overflow-x:auto;}
.section-stamp .stamp-list .stamp-item {width:auto; margin-top:0;}
.section-stamp .stamp-list .stamp-item + .stamp-item {margin-left:12px;}

.section-weather hr {margin:11px 0 15px; border-color:#eee;}
.section-weather .desc {margin-top:5px; font-size:13px; color:#999;}
.box-weather {padding:12px 20px 0; border:1px solid #eee;}
.box-weather + .box-weather {margin-top:10px;}
.box-weather .title-weather {color:#666; font-weight:700; font-size:13px;}
.weather-list {display:flex; align-items:center; justify-content:space-between; margin:0 -12px;}
.weather-list:after {content:''; display:block; clear:both;}
.weather-list .weather-item {width:20%; box-sizing:border-box; text-align:center;}
.weather-list .weather-item .txt {display:block; font-size:13px; color:#666; line-height:1.5;}
.weather-data {}
.weather-data:after {content:''; display:block; clear:both;}
.weather-data .data-item {float:left; min-width:50%; margin-bottom:10px;}
.weather-data .data-item .name {display:block; margin-bottom:5px; font-size:13px; color:#666;}
.weather-data .data-item .value {font-size:18px; color:#000; letter-spacing:5px;}

.activity-list {}
.activity-list:after {content:''; display:block; clear:both;}
.activity-list .activity-item {position:relative; padding:20px 40px 20px 77px; border:1px solid #eee; border-radius:10px; box-sizing:border-box;}
.activity-list .activity-item + .activity-item {margin-top:10px;}
.activity-list .activity-item a {display:block; height:100%;}
/* .activity-list .activity-item a:active {opacity:.5;} */
.activity-list .activity-item .name {font-size:14px; color:#000;}
.activity-list .activity-item .value {font-size:14px; color:#666; white-space:nowrap; text-overflow:ellipsis;}
.activity-list .activity-item .value strong {color:#4490e9;}
.activity-list .activity-item .desc {height:auto; margin-top:10px; text-decoration:underline;}
.activity-list .activity-item .icon-link {position:absolute; right:20px; top:30px; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') 0 -75px no-repeat; background-size:360px auto;}
.activity-list .activity-item .icon-act {position:absolute; left:22px; top:20px;}

/* 20200909 수정,추가 start */
.activity-item .tooltip-wrap.show .tooltip {padding:15px 22px 15px;}
.activity-item .tooltip-wrap .tooltip .tooltip-contents {font-size:13px; line-height:20px; padding-left: 5px;}
.activity-item .tooltip-wrap .tooltip-banner {display:block; width:100%; border-radius:10px; margin:25px 0; padding:18px 14px 15px; box-sizing: border-box; text-align:center;}
.activity-item .tooltip-wrap .tooltip-banner.light-blue2 {text-align: center;}
.activity-item .tooltip-wrap [class^='icon-active'] {display:inline-block; width:44px; height:44px; margin:0 auto 12px; background:url('../images/common/spr_activity.png') 0 0 no-repeat; background-size:auto 100%;}
.activity-item .tooltip-wrap [class^='icon-active'] + [class^='icon-active'] {margin-left:10px;}
.activity-item .tooltip-wrap .icon-active-step {background-position:-43.6px 0;}
.activity-item .tooltip-wrap .icon-active-system {background-position:-87.4px 0;}
.activity-item .tooltip-wrap .icon-active-img {background-position:-131px 0;}
.activity-item .tooltip-wrap .icon-active-admin {background-position:-175px 0;}
.activity-item .tooltip-wrap .tooltip-banner .banner-txt {display:block; text-align:left; white-space:normal; line-height:1.4;}
.activity-item .tooltip-wrap .tooltip-banner .banner-txt > span { }
.activity-item .tooltip-wrap .tooltip-banner .banner-txt > strong {display:block; color:#000; text-align:left; margin-bottom:4px;}
.activity-item .tooltip-wrap .tooltip-banner .banner-txt > strong + span {text-align:left; display:block;}
.activity-item .tooltip-wrap .tooltip-banner .banner-txt + .banner-txt {margin-top: 20px;}
/* 20200909 수정,추가 end */

.activity-item .value .txt-link {display:inline-block; position:absolute; right:16px; bottom:16px; height:auto; color:#666; border-bottom:1px solid #666; }
.activity-item .value .title {display:block; color:#000 !important;}
.activity-item .value p + .title {margin-top:10px;}

.activity-list .activity-item.disabled a:active {opacity:1;}
.activity-list .activity-item.disabled .name,
.activity-list .activity-item.disabled .value,
.activity-list .activity-item.disabled .value strong {color:#bfbfbf;}
.activity-list[data-columns='2'] {margin-left:-16px;}
.activity-list[data-columns='2'] .activity-item {float:left; width:calc(50% - 16px); height:120px; margin-top:0; margin-top:16px; margin-left:16px; padding:20px;}
.activity-list[data-columns='2'] .activity-item .name {white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.activity-list[data-columns='2'] .activity-item:nth-child(-n+2) {margin-top:0;}
.activity-list[data-columns='2'] .activity-item [class^='icon-act'] {left:auto; top:auto; right:16px; bottom:20px;}
.activity-list[data-columns='2'] .activity-item .icon-link {left:20px; top:72px; right:auto;}

.activity-list.sm {padding:8px 0; border: solid 1px #eee; border-radius:10px;}
.activity-list.sm .activity-item {display:flex; justify-content: space-between; height:48px; line-height:48px; margin-top:0; padding:0 20px 0 54px; border:none; border-radius:0;}
.activity-list.sm .activity-item .icon-act {width:24px; height:24px; top:11px; left:22px;}
.activity-list.sm .activity-item .name {white-space: nowrap; overflow:hidden; text-overflow: ellipsis; margin-right:10px;}
.activity-list.sm .activity-item .desc {display:inline-block; font-size:13px; font-weight:400}
.activity-list.sm .activity-item .value {font-size:13px;}
.activity-list.sm .activity-item .value strong {font-size:14px;}



.desc-rank {display:flex; justify-content:space-between; margin:15px 0 6px;}
.desc-rank .total {font-size:13px; color:#000;}
.desc-rank .desc-right {margin-bottom:0;}
.desc-right {margin-bottom:5px; text-align:right; font-size:13px; color:#999;}
.filter + .desc-right {margin-top:18px;}
.desc + .ranking-list,
.desc-right + .ranking-list {margin-top:5px;}
.ranking-item + .ranking-list {margin-top:12px;}
.wide-notice + .ranking-list {margin-top:5px;margin: 5px -20px 0px;}
.wide-notice {margin:10px -20px 0; padding:10px; font-size:13px; text-align:center; color:#999; background-color:#f8f9fc;}
.ranking-list {}
.ranking-item {position:relative; height:52px; display:flex; align-items:center; justify-content:space-between;}
.ranking-item.active {background-color:#f8f9fc;}
ol.ranking-list .ranking-item {padding: 0 20px 0 24px;}
ol.ranking-list .ranking-item.active {margin:0 -20px; padding-right:40px; padding-left:44px;}
.ranking-item .number {flex-grow:0; display:inline-block; margin-right:20px; font-size:13px; font-weight:700; color:#999;}
.ranking-item .number.best {color:#00b67e;}
.ranking-item.active .number {left:40px;}
.ranking-item .info {display:flex; flex-grow:1; align-items:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-right:10px;}
.ranking-item .picture {flex-shrink:0; display:inline-block; width:36px; height:36px; margin-right:10px; border-radius:50%; overflow:hidden;}
.ranking-item .level,
.ranking-item .name {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; color:#111;}
.ranking-item [class^='vary'] {margin-left:6px; font-size:11px;}
.ranking-item [class^='vary']:before {content:''; display:inline-block; margin-right:3px; border-left:4px solid transparent; border-right:4px solid transparent;}
.ranking-item .vary-up {color:#39b54a; vertical-align:1px;}
.ranking-item .vary-down {color:#f30000;}
.ranking-item .vary-up:before {border-top:0; border-bottom:6px solid #39b54a;}
.ranking-item .vary-down:before {border-top:6px solid #f30000; border-bottom:0;}
.ranking-item .score {flex-shrink:0; font-size:13px; color:#666;}
.ranking-item .rank {font-size:13px; color:#111;}

ul.ranking-list {padding:10px 20px; border-radius:10px;}
.ranking-list.sm {padding-top:0; padding-bottom:0;}
.ranking-item.my {height:72px; padding:0 20px 0 18px; background-color:#e9f6fe; border-radius:10px}
.ranking-item.my .number {margin-right:10px; color:#111;}
.ranking-item.my .info {}
.ranking-item.my .picture {width:50px; height:50px;}
.ranking-item.my .score {color:#000;}
.ranking-item.my .level {font-size:13px; color:#111;}
.ranking-item.my .vary-up {vertical-align:2px;}

/* .ranking-item.type2 .info {flex-direction:column; align-items:flex-start;}
.ranking-item.type2 .picture {margin-right:16px;} */

.level-info {z-index:2; position:relative; padding:30px 0;border-top:1px solid #e1e1e1;}
.level-info:before,
.level-info:after {position:absolute; left:50%; top:-8px; margin-left:-6px; content:''; display:inline-block; border-left:6px solid transparent; border-right:6px solid transparent; border-top:0;}
.level-info:before {border-bottom:7px solid #e1e1e1;}
.level-info:after {border-bottom:7px solid #fff; top:-7px;}
.level-info .swiper-slide {opacity:0 !important;padding:0 20px; box-sizing:border-box; background: #fff;}
.level-info .swiper-slide-active {opacity:1 !important;}
/*.level-info .swiper-slide > .inner {opacity:0; background:#fff; transform: translateY(100px); transition: transform 300ms ease-in-out 0s,  opacity 300ms ease-in-out 0s;}
.level-info .swiper-slide.swiper-slide-active > .inner {opacity:1; transform: translateY(0);}*/
.level-info .bullet-list {margin-top:30px;}
.progress-info {display:flex; justify-content:space-between;}
.progress-info .state {color:#3f60d5; font-size:14px;}
.progress-info .desc {color:#999;}
.lv-progress {height:6px; border-radius:3px; overflow:hidden; background-color:#e7e7ff;}
.lv-progress span {display:block; height:100%; border-radius:0 3px 3px 0; background-color:#3f60d5;}
.level-reword {position:relative; display:flex; align-items:center; justify-content:space-around; padding:20px 0; background-color:#f8f9fc;}
.lv-progress + .level-reword {margin-top:30px;}
.level-reword:before {position:absolute; left:50%; top:50%; margin-top:-30px; content:''; display:inline-block; width:1px; height:60px; background-color:#e1e1e1;}
.level-reword .reword-item { text-align:center;}
.level-reword .reword-item .desc {margin-top:6px;}

.level-list {padding:102px 0 15px; white-space:nowrap; background-color:#f8f9fc;}
.level-list .level-item {display:block; width:auto; opacity:.4;}
.level-list .level-item .info {position:absolute; bottom:0; left:50%; width:100vw; margin-left:-50vw; text-align:center;}
.level-list .level-item .name {font-weight:700; font-size:15px;}
.level-list .level-item .value {font-size:16px;}
.level-list .level-item .value:before {content:''; display:inline-block; vertical-align:-2px; margin:0 8px; height:15px; border-left:1px solid #e1e1e1;}
.level-list .level-item.swiper-slide-active {opacity:1;}
.level-list .level-item a {position:relative; padding-bottom:38px; display:block;}

.icon-level {display:block; width:100px; height:100px; margin:0 auto; text-align:center;}
.icon-level img {width:100%;}

.pop-levup {margin-top:40px; text-align:center; font-size:14px; color:#000;}
.pop-levup .icon-level {width:80px; height:80px; margin-bottom:20px;}

.result-txt + .upload {margin-top:30px;}
.upload {position:relative; display:flex; align-items:center; height:200px; overflow:hidden; justify-content:center; background-color:#f8f9fc; border:1px solid #eee; border-radius:10px; text-align:center;}
.upload label {color:#4490e9; font-size:13px;}
.upload label span[class^='btn'] {margin-top:15px; background-color:transparent;}
.upload input[type='file'] {position:absolute; opacity:0;}

/* 2021.07.19 수정 start */
.upload .upload-image { background: #fff; width: 100%; height: 100%; position:absolute; left:0; top:0; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.upload .upload-image .img-box { max-height: 100%; position: relative; display: flex; flex-grow: 1; min-width: 49%; align-items: center; justify-content: center; }
.upload .upload-image .img-box ~ .img-box { padding-left: 2%; }
.upload .upload-image .img-box img { height:100%; max-height: 200px; }
/* 2021.07.19 수정 end */

.upload .upload-close {position:absolute; top:0; right:0; width:40px; height:40px; font:0/0 a;}
.upload .upload-close:after {content:''; display:inline-block; width:25px; height:25px; background:url('../images/common/spr_common.png') -25px -145px no-repeat; background-size:360px auto;}

.input-point {position:relative;}
.input-point input {padding-right:50px;}
.input-point .unit {position:absolute; top:11px; right:16px; font-size:14px; color:#000;}

.input-quantity {display:flex;}
.input-quantity [class^='btn'] {flex:0 0 44px; padding:0; font-weight: 600; font-size:20px;}
.input-quantity input {flex:1 1 auto; margin:0 10px; text-align:center;}

.input-search {position:relative;}
.input-search input {padding-right:70px;}
.input-search .delete {position:absolute; top:0; right:50px; width:20px; height:100%; font:0/0 a;}
.input-search .delete:after {content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') -340px -75px no-repeat; background-size:360px auto; pointer-events:none;}
.input-search .btn-search {position:absolute; top:0; right:3px; width:40px; height:100%; padding:0; font:0/0 a;}
.input-search .btn-search:after {width:25px; height:25px; content:''; display:inline-block; background:url('../images/common/spr_common.png') -50px -145px no-repeat; background-size:360px auto;}
.btn-input-search {position:relative; display:block; height:44px; line-height:44px; padding:0 16px; color:#999; font-size:14px; text-align:left; font-weight:400; border:1px solid #d9d9d9; border-radius:5px;}
.btn-input-search:after {position:absolute; top:9px; right:12px; width:25px; height:25px; content:''; display:inline-block; font-size:14px; color:#000; background:url('../images/common/spr_common.png') -50px -145px no-repeat; background-size:360px auto;}

.input-qr {position:relative;}
.input-qr input {padding-right:40px;}
.input-qr:after {position:absolute; top:12px; right:16px; width:20px; height:20px; content:''; display:inline-block; font-size:14px; color:#000; background:url('../images/common/spr_common.png') -60px -75px no-repeat; background-size:360px auto;}

.input-card {display:flex; align-items:center;}
.input-card .dash {flex:1 0 auto; display:inline-block; width:8px; height:1px; margin:0 9px; background-color:#000;}

.input-hash {position:relative;}
.input-hash input {padding-left:30px;}
.input-hash:after {position:absolute; top:12px; left:16px; content:'#'; width:20px; height:20px; font-size:14px; color:#000;}

.input-unit {position:relative;}
.input-unit input {padding-right:30px;}
.input-unit .unit {position:absolute; top:11px; right:16px; font-size:14px; color:#000;}

.input-reward {display:flex; align-items:center; margin-left:-3px;}
.input-reward + .input-reward {margin-top:10px;}
.input-reward [class^='btn'] {flex:0 0 44px; margin-left:7px; padding:0 10px; font-weight:700; font-size:16px;}
.input-reward > span {margin:0 3px;}
.input-reword-total {margin-top:12px; padding-top:8px; border-top:1px solid #eee; text-align:right; font-size:13px; color:#666;}

.form-group {}
.form-group + .form-group {margin-top:30px;}
.image + .form-group {margin-top:28px;}
.form-group .title-group {display:flex; justify-content:space-between;}
.form-group .title-form {margin-bottom:8px; font-size:13px;}
.form-group .title-form-sub {font-size:13px; color:#999;}
.title-form small {margin-left:3px; font-size:13px; color:#666; font-weight:400;}

.accordion {}
.accordion .acco-item {border-bottom:1px solid #eee;}
.acco-head {position:relative; display:block; width:100%; min-height:56px; padding:15px 30px 15px 10px; box-sizing:border-box; text-align:left; font-size:15px; color:#111;}
.acco-head.flex {display:flex; justify-content: space-between; align-items:center;}
.acco-head:after {position:absolute; right:10px; top:50%; transform:translateY(-50%); content:''; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') -180px -95px no-repeat; background-size:360px auto; -webkit-transition:-webkit-transform .2s ease-in; transition:transform .2s ease-in; pointer-events:none;}
.acco-head.active:after {-webkit-transform: rotate(180deg) translateY(50%); transform: rotate(180deg) translateY(50%);}

.acco-head .txt-group,
.acco-head .txt-group .title {white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.acco-head [class^='c-label'] {flex-shrink:0; margin-left:15px; margin-right:10px;}
.acco-head .date,
.acco-head small {display:block; font-size:13px; color:#999;}
.acco-head .acco-btn-move {position:absolute; left:0; top:0; bottom:0; width:34px; font:0/0 a;}
.acco-head .acco-btn-move:after {content:''; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') -240px -95px no-repeat; background-size:360px auto; pointer-events:none;}
.acco-head .acco-btn-toggle {position:absolute; right:0; top:0; bottom:0; width:35px;}
.acco-head .txt-link {position:absolute; right:42px; top:21px; color:#666; border-color:#666;}
.acco-head .item-info:after {content:''; display:block; clear:both;}
.acco-head .item-info li {float:left; line-height:1.5; font-size:13px; color:#999; font-weight:400;}
.acco-head .item-info li + li:before {content:''; display:inline-block; height:10px; width:1px; margin:0 8px; background-color:#e1e1e1;}
.acco-content {display:none; padding:10px 15px; background-color:#f8f9fc; color:#666; line-height:1.78;}
.acco-content p + p {margin-top:10px;}
.acco-content .file-area {margin-top:28px;}
.acco-content .file-area .label {font-size:13px; font-weight:700; color:#666;}
.acco-content .file-area a {margin-left:3px; font-size:13px; color:#4490e9; text-decoration:underline;}
.acco-content .answer {padding-top:20px; border-top:1px solid #eee; margin-top:20px;}
.acco-content .answer .c-label {margin-bottom:8px;}
.accordion.move-type .acco-head {padding-left:34px; padding-right:75px; line-height:28px;}
.accordion.move-type .acco-head:after {content: none;}
.acco-btn-toggle::after {position:absolute; right:10px; top:50%; transform:translateY(-50%); content:''; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') -180px -95px no-repeat; background-size:360px auto; -webkit-transition:-webkit-transform .2s ease-in; transition:transform .2s ease-in; pointer-events:none;}
.acco-btn-toggle.active::after {-webkit-transform: rotate(180deg) translateY(50%); transform: rotate(180deg) translateY(50%);}

.board-list {margin-top:10px; border-top:1px solid #000;}
[data-tab-content] + .board-list {margin-top:20px;}
.board-list .acco-head {font-size:14px;}
.board-list .acco-content {padding:20px;}
.board-list .acco-content p + .image,
.board-list .acco-content .image + p {margin-top:20px;}
.board-list .acco-content .image + .image {margin-top:10px;}

.search-fix {padding:0 20px 12px; border-bottom:1px solid #eee; background-color:#fff;}
.search-result {}
.search-result .title {margin:27px 0 10px; font-size:13px; color:#666; font-weight: 400;}
.group-search-result {margin-top:12px;}
.group-search-result .group-title {padding:10px; display:flex; align-items:center; min-height:56px; box-sizing:border-box; font-size:14px; color:#111; }
.group-search-result .member-list {padding-left:15px; padding-right:15px; border-top:1px solid #eee; border-bottom:1px solid #eee; background-color:#f8f9fc;}
.acco-head.active {font-weight:700;}
.acco-head.active .date,
.acco-head.active small {font-weight:400}
.member-list {}
.member-nodata {text-align: center; color: #666666;margin-top: 30px;}
.member-list .member-item {display:flex; align-items:center; height:50px;}
.member-list .member-item .radio {vertical-align:-14px;}
.member-list .member-item .member-delete {display:inline-block; width:20px; height:20px; margin-left:5px; background:url('../images/common/spr_common.png') -320px -75px no-repeat; background-size:360px auto; font:0/0 a;}
.member-list.box {max-height:224px; overflow:auto; padding:5px 16px; border:1px solid #d9d9d9; border-radius:5px;}
.member-list.box .member-item {display:flex; align-items:center;}
.member-list.box::-webkit-scrollbar {width:3px !important; -webkit-appearance:inherit; display:inherit;}
.member-list.box::-webkit-scrollbar-thumb {background:#bfbfbf !important;}

.sticky-btn.sticky-pic {height:157px;}
.sticky-btn.sticky-pic .sticky-btn-inner {background-color:#fff;}
.sticky-pic-inner {position:absolute; bottom:78px; left:0; right:0; width:100%; padding:15px 20px 10px; box-sizing:border-box; border-top:1px solid #4490e9; background-color:#fff;}
.sticky-pic-inner .pick-list {margin-left:-20px; margin-right:-20px; padding-right:20px; padding-left:14px; white-space:nowrap; overflow-x:auto;}
.pick-list {margin-top:15px; margin-left:-6px; font-size:0;}
.pick-list .pick-item {position:relative; display:inline-block; height:30px; line-height:30px; margin:0 0 10px 6px; padding:0 25px 0 15px; background-color:#e9f6fe; border:1px solid #c8e7ff; border-radius:18px; box-sizing:border-box; color:#4490e9; font-weight:700; font-size:13px;}
.pick-item .delete {position:absolute; right:7px; top:7px; width:15px; height:15px; background:url('../images/common/spr_common.png') -225px -95px no-repeat; background-size:360px auto; font:0/0 a;}

.agree-box {position:relative; padding:18px 60px 18px 16px; background-color:#f8f9fc;}
.agree-box + .agree-box {margin-top:10px;}
.agree-box .txt-link {position:absolute; right:16px; top:18px; color:#666; border-color:#666;}

.textarea {position:relative;}
.textarea textarea {border:none;}
.textarea .byte {position:absolute; right:16px; bottom:16px; font-size:12px; color:#999;}

.giftcard {max-width:640px;}
.giftcard .textarea {height:85px; padding:15px 16px 30px; box-sizing:border-box; border:1px solid #eee; border-radius:0 0 10px 10px; border-top:none;}
.giftcard .textarea textarea {height:100%; padding:0;}
.tab-card + .form-group {margin-top:30px;}

.gift-replay {}
.gift-replay .image {margin-left:-24px; margin-right:-24px;}
.gift-replay .info {display:flex; justify-content:space-between; align-items:center; padding:16px 0; border-bottom:1px solid #eee;}
.gift-replay .info + .name {margin-top:15px}
.gift-replay .msg {margin-top:15px; color:#666;}
.gift-replay .msg + .name {margin-top:10px;}
.gift-replay .name {display:block; font-size:13px;}
.gift-replay .name + .msg {margin-top:10px;}

/* 20210406 start */
/*.box-buddy {padding:20px; background-color:#fff6cc;}*/
.box-buddy {padding:20px; background-color:#ffe1a7;}
.box-buddy .title {font-size:16px;}
.box-buddy .section-more {top:24px; right:18px;}
.box-buddy .rangking {text-align:center;}
.box-buddy .rangking .graph {position:relative; margin-top:12px;}
.box-buddy .rangking .graph:after {position:absolute; left:50%; top:22px; transform: translateX(-50%); content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') -180px -75px no-repeat; background-size:360px auto;}
.box-buddy svg.half-circle {width:78px; height:42px;}
.box-buddy .my-rank {font-size:20px; color:#000;}
.box-buddy .my-rank strong {font-size:24px;}
.box-buddy .my-sv {margin-top:6px; font-size:15px; color:#666;}
.box-buddy .btn-rank {height:30px; margin-top:20px; padding:0 12px; line-height:30px; font-weight:400; font-size:13px; color:#ffa500; background-color:#fff; border-radius:5px;}
/* 20201029 */
.box-buddy.member-nodata {margin-top:0;background:#f8f9fc;}
/* 20210406 end */
.acco-content .box-buddy.member-nodata {border:none;}

/* 20210406 start */
.buddy-swiper { margin-top: 20px; padding-bottom:40px;}
.buddy-swiper .box-buddy {padding-bottom:25px;}
.buddy-swiper .my-rank { margin-top: 5px; }
.buddy-swiper .my-sv { margin-top: 10px; }
/* 20210406 end */

.svc-shop-wrap {margin-top:20px;}
.svc-shop-wrap .upload {}
.btn-svc-shop {display:block; min-height:40px; margin-top:20px; padding:8px; color:#4490e9; font-size:13px; font-weight:400; border-radius:5px; background-color:#e9f6fe;}
.btn-svc-shop span {text-decoration:underline;}

.chlg-swiper {overflow:visible;}
.chlg-swiper .swiper-pagination {position:static; height:6px; margin-top:12px;}

.box-chlg {position:relative; padding:20px; border:1px solid #c8e7ff;}
.box-chlg .c-label {margin-bottom:5px;}
.box-chlg .name {font-weight:700; color:#000; font-size:16px;}
.box-chlg .date {color:#999; font-size:13px;}
.box-chlg .info {margin-top:19px;}
.box-chlg .info:after {content:''; display:block; clear:both;}
.box-chlg .info li {position:relative; float:left;}
.box-chlg .info li + li {margin-left:60px;}
.box-chlg .info li + li:before {position:absolute; left:-30px; top:3px; content:''; display:inline-block; height:30px; border-left:1px solid #c8e7ff;}
.box-chlg .info .tit {color:#000; font-size:12px;}
.box-chlg .info .val {color:#3f60d5; font-size:13px;}
.box-chlg .pic {position:absolute; right:20px; bottom:20px; width:44px; height:44px; border:2px solid #fff; border-radius:50%;}
.box-chlg .pic img {width:100%; height:100%;}

.chlg-manual {margin:0 -20px 30px; padding:20px; background-color:#f8f9fc;}
.chlg-manual [class^='manual-head'] {height:80px; padding-top:16px; box-sizing:border-box; border-radius:10px 10px 0 0; color:#fff; text-align:center; overflow:hidden; background-position:0 0; background-repeat:no-repeat; background-size:cover; box-shadow:0 1px 4px 0 rgba(0, 0, 0, .1);}
.chlg-manual .manual-head-sky {background-image:url('../images/bg/chlg_bg_sky.png');}
.chlg-manual .manual-head-purple {background-image:url('../images/bg/chlg_bg_purple.png');}
.chlg-manual .manual-head-green {background-image:url('../images/bg/chlg_bg_green.png');}
.chlg-manual [class^='manual-head'] .type {font-size:13px; line-height: 1.85; opacity:.8;}
.chlg-manual [class^='manual-head'] .title {font-size:16px; color:#fff;}
.chlg-manual .manual-body {padding:20px 20px 25px; border-radius:0 0 10px 10px; overflow:hidden; background-color:#fff; box-shadow:0 1px 4px 0 rgba(0, 0, 0, .1);}
.chlg-manual .manual-body .bullet-item {font-size:13px;}

.section-chlg {margin-top:35px !important;}
.section-chlg .row-btns {margin-top:20px;}
.section-chlg .sort-list {position:absolute; right:0; top:0;}
.section-chlg .no-section {height:112px; letter-spacing:-0.5px; text-align:center;}

.section-chlg-ing {position:relative; margin-top:0 !important; margin-left:-20px; margin-right:-20px; padding:24px 20px 0; text-align:center; background-position:0 0; background-repeat:no-repeat;  background-size:100% auto;}
.section-chlg-ing .title-section {margin-top:7px; color:#fff;}
.section-chlg-ing .badge {position:absolute; top:24px; right:0; height:22px; line-height:22px; padding:0 10px; border-top-left-radius:2px; border-bottom-left-radius:2px; font-size:11px; background-color:rgba(0,0,0,.5); color:#fff;}
.sudden-death {background-image:url(../images/bg/bg_chl_01.png);}
.judgment {background-image:url(../images/bg/bg_chl_02.png);}
.chlg-league {background-image:url(../images/bg/bg_chl_03.png);}
.special-chlg {background-image:url(../images/bg/bg_chl_04.png);}

.box-prize {margin-top:20px; padding-top:18px; padding-bottom:20px;background-color:#fff; -webkit-box-shadow:0 1px 4px 0 rgba(0, 0, 0, .1); box-shadow:0 1px 4px 0 rgba(0, 0, 0, .1);}
.box-prize .info {padding-bottom:15px; border-bottom:1px solid #eee;}
.box-prize .info li {display:inline-block; margin-left:-4px; font-size:13px; color:#666;}
.box-prize .info li + li::before {content:''; display:inline-block; height:12px; margin:0 5px 0px 8px; border-left:1px solid #e1e1e1; vertical-align:-1.5px;}
.box-prize .comment {margin-top:24px; padding:16px 0; border-radius:5px; background-color:#f8f9fc; color:#111;}
.box-prize .comment strong {font-size:15px; margin-left:7px;}

.prize-info {padding:20px 0 0;}
.prize-info .time {font-size:15px; color:#111;}
.prize-info .txt {font-size:14px; color:#111;}
.prize-info i {display:block; margin:0 auto; width:70px; height:60px; margin-bottom:14px;  background:url(../images/common/spr_common.png) -180px 0 no-repeat; background-size:360px auto;}
.prize-info .value {display:inline-block; font-size:20px;}
.prize-info .tit {margin-top:5px; font-size:13px; color:#999;}

.prize-state .graph {}
.prize-state .rank {font-size:20px; color:#000; font-weight:700;}
.prize-state .score {margin-top:2px; font-size:16px; color:#111;}

.box-prize .graph-wrap {position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; width:190px; height:190px; margin:30px auto 0;}
.box-prize .graph-info {display:flex; justify-content:center; align-items:center; margin-top:15px; font-size:13px; color:#666;}
.box-prize .graph-info li + li {margin-left:20px;}
.box-prize .graph-info li:before {content:''; display:inline-block; width:12px; height:12px; margin-right:6px; border-radius:50%;}
.box-prize .graph-info .info-1:before {background-color:#b193f5;}
.box-prize .graph-info .info-2:before {background-color:#80e3e9;}

.circle-graph {position:absolute; width:190px; height:190px; transform:rotate(90deg) scale(1,-1);}
.circle-graph svg {height:100%; width:100%;}
.circle-graph svg:first-child {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%)}

.box-prize .score-list {display:flex; justify-content:space-around; align-items:center; margin-top:12px; padding-top:18px; padding-bottom:14px; border-radius:5px;}
.box-prize .score-list .score-item {width:50%;}
.box-prize .score-list .score-item + .score-item {border-left:1px solid #eee;}
.box-prize .score-list .value {margin-left:0; font-size:16px; color:#111;}
.box-prize .score-list .name {font-size:13px; color:#999;}

.section-chlg-ing.end {background:url(../images/bg/bg_chl_05.png) 0 0 no-repeat; background-size:100% auto;}
.section-chlg-ing.end .score-list {margin-top:24px; border-radius:5px; background-color:#f8f9fc;}
.section-chlg-ing.end ~ .section-info {margin-bottom:-40px; padding-bottom:40px;}

.box-rank {display:flex; align-items:center; height:54px; margin-top:10px; box-sizing:border-box; background-color:#fff; border:1px solid #eee; color:#111;}
.box-rank .img {overflow:hidden; width:36px; height:36px; margin-right:10px; border-radius:50%;}
.box-rank .rank::after {content:''; display:inline-block; height:12px; margin:0 8px; border-left:1px solid #e1e1e1;}
.box-rank .value {position:absolute; right:20px; font-size:13px;}
.point-rank {display:flex; justify-content:space-around; align-items:center; margin-top:10px; font-size:13px; text-align:center;}
.point-rank a {display:block; margin:0 auto;}
.point-rank .img {width:60px; height:60px; margin:0 auto;}
.point-rank-item {position:relative;}
.point-rank-item [class^='badge'] {position:absolute; left:7px; top:0; width:20px; height:20px; line-height:20px; border-radius:50%; font-weight:700; color:#fff; box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.1);}
.point-rank-item .badge-gold {background-color:#febe2d;}
.point-rank-item .badge-silver {background-color:#bfbfc0;}
.point-rank-item .badge-bronze {background-color:#d88f49;}
.point-rank .name {margin:5px 0; color:#000;}

.point-rank .value {display:block; height:24px; line-height:24px; padding:0 12px; box-sizing:border-box; background-color:#fff; border:1px solid #eee; border-radius:12px; color:#111;}
.section-pointrank .icon-tooltip {vertical-align:bottom;}
.section-pointrank .tooltip .tooltip-contents {font-size:13px; line-height:20px;}
.section-pointrank .tooltip .title {display:block; font-size:15px;}
.section-pointrank .tooltip p {margin-top:10px; color:#666;}
.box-progress {margin-top:10px; padding-top:20px; padding-bottom:16px; background-color:#fff; border:1px solid #eee; color:#111;}
.box-progress .sv-progress {background-color:#e7e7ff;}
.box-progress .sv-progress span {background-color:#3f60d5;}
.box-progress .info {display:flex; justify-content:space-between; margin-top:6px;}
.box-progress .info .value {color:#3f60d5;}
.box-progress .info .goal {font-size:13px; color:#666;}
.goal-list {display:flex; margin-top:10px; text-align:center; font-size:13px; color:#999;}
.goal-list .goal-item {width:calc(100% / 3); padding:10px 0; background-color:#fff; border:1px solid #eee; border-radius:10px; box-sizing:border-box;}
.goal-list .goal-item + .goal-item {margin-left:10px;}
.goal-list .img {width:60px; height:60px; margin:0 auto;}
.goal-list .name {padding:5px 0 8px; color:#000;}
.section-info {margin:0 -20px; padding:30px 20px 10px; background-color:#fff;}

/*2021.04.06 추가*/
.challenge-info .section-info { padding-bottom: 30px; }
.challenge-info .section-info + .section-info { margin-top: 20px; }

.sort-list {}
.sort-list:after {content:''; display:block; clear:both;}
.sort-list .sort-item {float:left;}
.sort-list .sort-item a {font-size:13px; color:#666;}
.sort-list .sort-item.active a {color:#3f60d5; font-weight:700;}
.sort-list .sort-item + li:before {content:''; display:inline-block; height:12px; margin:0 6px; border-left:1px solid #e1e1e1;}
.sort-list.right {text-align:right;}
.sort-list .sort-item {display: inline-block; float: none;}

.label-list {font-size: 0;}
[class^='c-label'] {display:inline-block; height:22px; line-height:22px; padding:0 10px; box-sizing:border-box; font-size:11px; text-align:center; color:#4490e9; border:1px solid #c6ddf8; border-radius:11px;}
[class^='c-label'] + [class^='c-label'] {margin-left:6px;}
.c-label-orange {border-color:#ff9b91; color:#ff7a68;}
.c-label-white {border-color:rgba(255, 255, 255, 0.6); color:#fff;}

.chlg-list {}
[class^='chlg-item'] {position:relative; border:1px solid #eee; border-radius:10px;}
[class^='chlg-item'] + [class^='chlg-item'] {margin-top:10px;}
[class^='chlg-item'] a {display:block; padding: 20px 20px 25px;}
[class^='chlg-item'] .badge {position:absolute; right:-10px; top:20px; display:inline-block; min-width:49px; height:22px; line-height:22px; background-color:#4490e9; color:#fff; font-size:11px; border-radius:2px; text-align:center;}
[class^='chlg-item'] .name {font-weight:700; color:#000; font-size:16px;}
[class^='chlg-item'] .info {display:flex; justify-content:space-between; align-items:center; margin-top:16px;}
[class^='chlg-item'] .name {margin-top:5px;}
[class^='chlg-item'] .info-list:after {content:''; display:block; clear:both;}
[class^='chlg-item'] .info-list li {float:left; font-size:13px; color:#666;}
[class^='chlg-item'] .info-list li + li:before {content:''; display:inline-block; height:12px; margin:0 6px; border-left:1px solid #e1e1e1;}
[class^='chlg-item'] .date {font-size:13px; color:#999;}
[class^='chlg-item'] .chlg-foot {display:flex; align-items:center; justify-content:space-between; margin:20px -20px 0; padding-left:20px; padding-right:54px; box-sizing:border-box; background-color:#f8f9fc;}
[class^='chlg-item'] .foot-item {font-size:0;}
[class^='chlg-item'] .foot-item dt {display:inline-block; margin-right:10px; font-size:13px;}
[class^='chlg-item'] .foot-item dd {display:inline-block; font-size:13px;}
.chlg-item-2 a {padding-bottom:0;}
.chlg-item-2 .chlg-foot {min-height:48px;}
.chlg-item-2 .chlg-foot strong {color: #666;}
.chlg-item-2 .date {position:absolute; right:20px; top:20px; vertical-align: top;}
.chlg-item-2 .state {vertical-align:text-top; vertical-align: top;}
/* .chlg-item.active {border-color:#c8e7ff;} */

/* App 설정 */
.section-profile {display:flex; justify-content:space-between; align-items:center; margin:0 -20px; padding:20px 20px; border-bottom: 1px solid #e1e1e1;}
.section-profile .image {overflow:hidden; width:52px; height:52px; border-radius:50%;}
.section-profile .name:after {transform:rotate(-90deg); content:''; display:inline-block; width:16px; height:16px; margin-left:3px; background:url(../images/common/spr_common.png) -180px -95px no-repeat; background-size:360px auto;}
.section-profile .info {flex-grow:1; padding: 6px 0 6px 20px;}
.section-profile .info .name {font-size:18px;}
.section-profile .info .email {color:#666;}
.section-profile .txt-link {margin-top:25px; border-color:#666; color:#666;}
.section-setting {margin-top:0 !important; padding-top:20px;}
.section-setting .title-setting:nth-of-type(1) {margin-top:0;}
.title-setting {margin-top:30px; margin-bottom:10px; font-weight:400; font-size:13px; color:#666;}
.setting-list .setting-item {position:relative; border-bottom:1px solid #eee;}
.setting-list .setting-item.last {border-bottom:0;}
.setting-list .setting-item .info {display:flex; justify-content:space-between; width:100%; padding:17px 0; color:#000;}
.setting-list .setting-item .info .name {font-size: 15px;}
.setting-list .setting-item .info .name:after {position:absolute; right:0; top:50%; transform:rotate(-90deg) translateY(-50%); transform-origin:50% 0%; content:''; display:inline-block; width:16px; height:16px; background:url(../images/common/spr_common.png) -180px -95px no-repeat; background-size:360px auto;}
.setting-list .setting-item .info .version {position: absolute;top: calc(50% + 1px);right: 20px;transform: translateY(-50%);transform-origin: 50% 0%;font-size: 13px;color:#999;}

.value-list .value-item {padding:18px 0;}
.value-list .value-item + .value-item {border-top:1px solid #eee;}
.value-list .value-item .name {display:inline-block; padding:16px 0;}

.my-profile {margin:0 auto; text-align:center;}
.my-profile .pic {position:relative; width:136px; height:136px; margin:0 auto;}
.my-profile .pic .btn-pic {position:absolute; right:0; bottom:0; width:36px; height:36px; padding:0; background-color:#000; border:2px solid #fff; box-sizing:border-box; border-radius:50%; font:0/0 a;}
.my-profile .pic .btn-pic:after {content:''; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') -195px -95px no-repeat; background-size:360px auto;}
.my-profile .name {margin-top:16px; font-size:18px; color:#111; font-weight:bold;}
.my-profile .email {margin-top:4px; font-size:14px; color:#666;}

.pic-list {margin-top:10px; padding-left:4px;}
.pic-list:after {content:''; display:block; clear:both;}
.pic-list li {position:relative; float:left; width:40px; height:40px; margin:10px 8px 0; border-radius:50%; overflow:hidden;}
.pic-list li.active:before {position:absolute; left:0; top:0; right:0; bottom:0; content:''; display:inline-block; background-color:rgba(0,0,0,.3);}
.pic-list li.active:after {position:absolute; left:10px; top:10px; content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') -200px -75px no-repeat; background-size:360px auto;}
.pic-list [class^='icon-profile'] {transform: scale(.5);}
.pic-content {width:190px; height:190px; margin:0 auto;}

.section-pwchange input + input {margin-top:10px;}
.section-pwchange .reset-pw {text-align: right; margin-top: 8px;}
.section-pwchange .reset-pw .txt-link {color:#666; border-color:#666;}
.section-pwchange .bullet-list {margin-top:30px}
.title-pwchange {padding:20px 0 30px; font-weight:400; color:#000;}
.section-terms .setting-list .setting-item:last-child {border-bottom:0;}
.section-terms .name:after {position:absolute; right:0; top:50%; transform:rotate(-90deg) translateY(-50%); transform-origin:50% 0%; content:''; display:inline-block; width:16px; height:16px; background:url(../images/common/spr_common.png) -180px -95px no-repeat; background-size:360px auto;}

.modal.full .terms {padding-bottom:60px; font-size:13px; color:#666;}
.terms h2 {font-size:14px;}
.terms h2 ~ h2 {margin-top:40px; margin-bottom:15px;}
.terms h2 + p {margin-top:15px; margin-bottom:10px;}
.terms ol li + li,
.terms ol ol,
.terms ul {margin-top:10px;}
.terms h2 + .bullet-list {margin-top:15px; font-size:13px;}
.terms .bullet-list .bullet-item + .bullet-item {margin-top:6px;}
.terms p + p {margin-top:10px;}
.terms a {display:inline-block; border-bottom:1px solid #4490e9;}
.terms a + a {margin-top:8px;}
.terms .important-txt {font-size:14px; line-height:25px; color:#111;}
.terms .important-txt + ol {margin-top:30px; padding-bottom:40px; border-bottom:1px solid #e1e1e1; font-size:14px; color:#111;}
.terms .important-txt + ol li {margin-top:6px;}
.terms .important-txt + h2 {margin-top:40px;}
.terms .list-txt {margin-top:40px;}
.terms .list-txt + p {margin-bottom:10px; line-height:23px;}
.terms h3 {margin-top:30px; margin-bottom:10px;}
.terms span {margin-top:10px; line-height:21px;}
.terms span + .bullet-list {margin-top:10px}
.terms span + .bullet-list .bullet-item + .bullet-item {margin-top:10px;}
.terms .articulate-list {margin-top:24px;}
.terms .articulate-list li {margin-bottom:20px;}
.terms .underline {text-decoration:underline;}
.terms .table {margin:10px 0;}
.terms .agree-group {margin-top:40px; text-align:center; color:#000;}
.terms .agree-group .form-group {margin-top:20px;}
.terms .form-group label + label {margin-left:30px;}

.section-secession {margin-top:20px;}

.stamp-info {margin-top: 15px;padding-top: 9px;border-top:1px solid #eee;}
.stamp-info li {display:flex;justify-content:space-between;align-items:center;padding-top: 6px; color: #000;}

.pop-profile {text-align: center;}
.pop-profile .image {margin: 0 auto 20px;width: 80px;height: 80px;overflow: hidden;border-radius: 50%;}

/* SV story */
.section-event .swiper-slide {border-radius:10px; overflow:hidden;}
.section-event img {width:100%;}
.section-event .swiper-pagination {bottom:-18px; height:6px;}
.section-event .swiper-container {overflow:visible;}
.swiper-pagination-bullet {opacity:1; width:6px; height:6px; background-color:#e1e1e1; vertical-align:top;}
.swiper-pagination-bullet-active {background-color:#999;}

.wide-visual {margin:0 -20px;}
.wide-visual img {width:100%;}
.section-notice {margin:0 -20px; padding:20px 20px 30px; background-color:#f8f9fc;}
.section-notice .panel {position:relative; padding:20px 20px 5px; background-color:#fff; border-radius:10px; border:1px solid #eee; /*-webkit-box-shadow:0 1px 4px 0 rgba(0, 0, 0, .1); box-shadow:0 1px 4px 0 rgba(0, 0, 0, .1);*/}
.section-notice .title-section {margin-bottom:0;}
.section-notice .section-more {top:23px; right:18px;}
.section-notice .section-more:after {top:-1px;}
.notice-box {}
.notice-box .notice-item {padding: 16px 0;}
.notice-box .notice-item + .notice-item {border-top:1px solid #eee;}
.notice-box .notice-item .title {font-size:14px; color:#000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.notice-box .notice-item .date {display:inline-block; margin-top:5px; font-size:13px; color:#999;}
.notice-box .notice-item.nodata {padding:125px 10px; text-align:center;}

.section-event {margin-top:30px !important;}

.video-group {}

.survey-list {}
.survey-list:after {content:''; display:block; clear:both;}
.survey-list .survey-item {position:relative; border:1px solid #eee; border-radius:10px; box-sizing:border-box; overflow:hidden; background-color: #fff;}
.survey-list .survey-item + .survey-item {margin-top:10px;}
.survey-list .survey-item a {display:block; height:100%; padding:20px 40px 20px 20px;}
.survey-list .survey-item .badge {position: absolute;left:20px;top:0;display: inline-block;padding:0 6px;height: 22px;line-height: 22px;background-color: #4490e9;color: #fff;font-size: 11px;border-radius: 2px;}
.survey-list .survey-item .badge + .title {margin-top:15px;}
.survey-list .survey-item .title {font-size:14px; color:#000; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.survey-list .survey-item small {font-size:13px; color:#666;}
.survey-list .survey-item:after {position:absolute; right:20px;top:50%; transform: translateY(-50%); content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') 0 -75px no-repeat; background-size:360px auto;}
.survey-list .survey-item.nodata {padding:30px 10px; text-align:center;}
.survey-list .survey-item.nodata:after {content:none;}

.section-video {margin-top:47px !important;}
/* 20200909수정 start */
/* .sv-video {display:flex;} */
.sv-vide:after{content:''; display:block; clear:both;}
.sv-video-item {display: inline-block;width:49%; position:relative; border-radius:10px; overflow:hidden;}
.sv-video-item:before {content:''; display:block; position:absolute; left:0; top:0; right:0; bottom:0; background-color:rgba(0,0,0,.15);}
.sv-video-item:after {content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:20px; height:20px; background:url('../images/common/spr_common.png') -220px -75px no-repeat; background-size:360px auto;}
.sv-video-item + .sv-video-item {margin: 0; float:right;}
.sv-video-item a {display: block;}
.sv-video-item a img{width:100%}
/* 20200909수정 end */

.survey-txt {margin-top:30px;}
.survey-txt-item {position:relative; display:flex; justify-content:space-between; align-items:center; min-height:52px; padding:10px 15px; box-sizing:border-box; border:1px solid #f1f1f1; border-radius:4px;}

/* 2020-09-23 */
.survey-txt-item.right {border: 1px solid #ff8282;}
/* //2020-09-23 */
.survey-txt-item.active {border: 1px solid #c6ddf8;}
/* 20200909추가 start */
.survey-txt-item.answer {border: 1px solid #ff8282;}
.survey-txt-item.answer .text {color: #ff8282;}
/* 20200909추가 end */
.survey-txt-item + .survey-txt-item {margin-top:10px;}
.survey-txt-item .title {position:relative; z-index:1; color:#000;}
.survey-txt-item .text {position:relative; z-index:1; margin-left:10px; color:#666; flex-shrink:0;}
.survey-txt-item .survey-progress {position:absolute; left:0; top:0; bottom:0; overflow:hidden; border-top-left-radius:4px; border-bottom-left-radius:4px; background-color:#f1f1f1;}
/* 2020-09-23 */
.survey-txt-item.right .text{color:#ff8282;}
/* //2020-09-23 */
.survey-txt-item.active .text{color:#4490e9;}
.survey-txt-item.active .survey-progress {background-color:#c8e7ff;}

/* 20200909추가 */
.survey-txt + .banner.light-gray.mt20 {border-radius: 5px; text-align:left}

.video-item {}
.video-item + .video-item {border-top:1px solid #eee;}
.video-item a {display:flex; justify-content:space-around; align-items:center; padding:12px 0;}
.video-item .image {overflow:hidden; position:relative; flex:1 0 50%; border-radius:15px;}
.video-item .image img {width:100%;}
.video-item .image::before {content:''; position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%,-50%); width:20px; height:20px; background:url('../images/common/spr_common.png') -220px -75px no-repeat; background-size:360px auto;}
.video-item .image::after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.15)}
.video-item .title {margin-left:20px; width:50%;}

.event-item {display:block; position:relative; border:1px solid #eee; border-radius:10px;}
.event-item + .event-item {margin-top:15px;}
.event-item .badge {position:absolute; right:-10px; bottom:20px; height:22px; line-height:22px; padding:0 10px; border-radius:2px; font-size:11px; background-color:#999; color:#fff;}
.event-item .image {overflow:hidden; position:relative; border-top-left-radius:10px; border-top-right-radius:10px;}
.event-item img {width:100%;}
.event-item.close .image:after{content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.35)}
.event-item .info {padding:20px; line-height:normal;}
.event-item .info .title {padding-right:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.event-item .info .date {margin-top:3px; font-size:13px; color:#999; letter-spacing:0;}

.event-detail {}
.event-detail .event-image {margin-left:-20px; margin-right:-20px;}
.event-detail .event-image img {width:100%;}
.event-detail .event-info {margin-top:20px; font-size:13px; line-height:normal; color:#666;}
.event-detail .event-info-item {display:flex;}
.event-detail .event-info-item + .event-info-item {margin-top:4px}
.event-detail .event-info-item .title {flex-shrink:0; margin-right:6px;}
.event-detail .event-contents {margin-top:30px; color:#666; font-size:13px;}

.suggest-msg {height:210px; margin:10px 0; padding:20px 16px; line-height:21px; letter-spacing:-0.5px;}
.upload-file {overflow:hidden; position:relative; border:1px solid #4490e9; border-radius:5px; color:#4490e9; line-height:27px;}
.upload-file label {display:block; padding:9px 0; font-weight:700; text-align:center;}
.upload-file input[type='file'] {position:absolute; opacity:0;}
.upload-info {position:relative; margin:10px 0 23px; padding:15px 16px 13px; border:1px solid #d9d9d9; border-radius:5px;}
.upload-info .text{padding-right:43px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:initial;}
.upload-info .upload-close {position:absolute; top:14px; right:16px; width:20px; height:20px; font:0/0 a;}
.upload-info .upload-close:after{content: ''; display: inline-block; width:20px; height:20px; background: url(../images/common/spr_common.png) -260px -75px no-repeat; background-size: 360px auto;}
.icon-camera {display:inline-block; width:20px; height:20px; margin-right:6px; background:url('../images/common/spr_common.png') -240px -75px no-repeat; background-size:360px auto; vertical-align:-4px;}

.survey-image {display:flex; flex-wrap:wrap; justify-content:space-between}

/* 2020-09-23 */
.survey-image + .banner.light-gray.mt23 {border-radius: 5px; text-align:left}
/* //2020-09-23 */

.survey-image-item {width:calc((100% - 10px) / 2);}
.survey-image-item:nth-child(n+3) {margin-top:20px;}
.survey-image-item .img {position:relative; display:block; height:auto; padding-top:100%; overflow:hidden; border-radius:10px; border:1px solid #d9d9d9; box-sizing:border-box;}
/*2020-09-23  */
.survey-image-item .img.right {border:1px solid #ff8282; }
/*//2020-09-23  */
.survey-image-item .img img {position:absolute; left:4px; top:4px; right:4px; bottom:4px; width:100%; width:calc(100% - 8px); height:calc(100% - 8px); border-radius:8px;}
.survey-image-item .img input {margin:0;}

/* 2020-09-23 */
.survey-image-item .img.answer {border:1px solid #ff8282;}
.survey-image-item .img.answer .value-txt  {color:#ff8282;}
.survey-image-item .img.active {border:1px solid #c6ddf8;}
/* //2020-09-23 */

.survey-image-item.active .img {border-color:#4490e9;}
.survey-image-item .icon {position:absolute; bottom:12px; right:12px;}
.survey-image-item .value {position:absolute; top:4px; bottom:4px; left:4px; right:4px; border-radius:8px; overflow:hidden;}
/* .survey-image-item .value:after {content:attr(data-value) '% ('attr(data-peaple) '명)'; position:absolute; bottom:15px; left:0; width:100%; font-size:15px; line-height:18px; font-weight:bold; color:#4490e9; text-align:center;} */

/* 2020-09-23 */
.survey-image-item .value .value-title {position:absolute; width:100%; bottom:32px; left:0; right:0; text-align:center; color:#000000;}
/* //2020-09-23 */

.survey-image-item .value .value-txt {position:absolute; bottom:11px; left:0; right:0; text-align:center; color:#4490e9;}
/*  2020-09-23*/
.survey-image-item .else .value-txt {color:#666666;}
.survey-image-item .right .value-txt {color:#ff8282;}
/* //2020-09-23 */
.survey-image-item .value .state {position:absolute; bottom:0; left:0; width:100%; background:rgba(200, 231, 255, 0.6);}

/* 2020-09-23 */
.survey-image-item .answer .state {background:#fff; opacity:0.6;}
.survey-image-item .else .state {background:#fff; opacity:0.6;}
.survey-image-item .right .state {background:#fff; opacity:0.6;}
/* //2020-09-23 */

.survey-image-item .txt {display:block; margin-top:10px; font-size:14px; line-height:21px; color:#000;}


.chlg-guide {padding-top: 30px;}
.chlg-guide .title {margin-bottom:10px; color:#000; font-size:20px; line-height:1.45;}
.chlg-guide .desc {font-size: 14px;}
.chlg-guide .guide-list {margin-top: 40px;}
.guide-list li + li {margin-top: 10px;}
.guide-list .guide-item {position: relative;}
.guide-list .guide-item img {width: 100%;}
.guide-list .guide-item .guide-txt {position: absolute;top: 50%;left: 9.3%;width: 43%;transform: translateY(-50%);color: #fff;font-weight: 700;}
.guide-list .guide-item .guide-txt::after {content: '';display: block;margin-top: 10px;width: 20px;height: 20px;background: url('../images/common/spr_common.png') -300px -75px no-repeat;background-size:360px auto;}


.app-guide .swiper-container,
.guide-contents .swiper-container,
.app-guide .swiper-wrapper,
.guide-contents .swiper-wrapper,
.app-guide .swiper-slide,
.guide-contents .swiper-slide {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-perspective: 1000;
    perspective: 1000;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.swiper-img,
.swiper-slide-active {-webkit-backface-visibility:hidden;}
.swiper-close {position:absolute; right:15px; top:4px; z-index:10; width:34px; height:34px; font:0/0 a;}
.swiper-close:after {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') -195px -110px no-repeat; background-size:360px auto;}

.app-guide,
.guide-contents {padding:0; box-sizing:border-box;}
.app-guide .swiper-container,
.guide-contents .swiper-container {overflow:visible; position:fixed; left:0; top:0; bottom:0;}
.guide-contents .swiper-wrapper {box-sizing:border-box;}
.guide-contents .swiper-slide {position:relative;}
.guide-contents .swiper-pagination {position:fixed; bottom:20px; left:0; right:0; height:6px; z-index:10;}
.guide-contents .img a {display:block;}
.guide-contents img {width:100%;}
.guide-contents .guide-txt {padding:30px 30px 0; color:#666;}
.guide-contents .guide-txt .sub {font-size:13px; margin-top:6px;}
.app-guide .btn-prev,
.guide-contents .btn-prev {position:absolute; top:0; left:0; padding:15px 24px; font-size:13px; color:#fff; font-weight:400;}
.app-guide .btn-prev::before,
.guide-contents .btn-prev::before {content:''; display:inline-block; width:15px; height:15px; background:url('../images/common/spr_common.png') -210px -95px no-repeat; background-size:360px auto; vertical-align:-2px;}

.app-guide .img {border:1px solid transparent} /* iOS 버그대응 */
.app-guide .swiper-pagination {position:fixed; bottom:99px; left:0; right:0; height:6px; z-index:10;}
.app-guide .swiper-pagination-bullet {}
.app-guide .row-btns {z-index:10; margin-top:25px; padding:0 20px 20px;}

.sv-guide .txt-say {margin:35px 0 20px; line-height:1.33; text-align:center; font-size:15px; color:#000;}
.sv-guide .txt-say:before,
.sv-guide .txt-say:after {content:''; display:block; width:25px; height:25px; margin:0 auto; background:url('../images/common/spr_common.png') -75px -145px no-repeat; background-size:360px auto;}
.sv-guide .txt-say:before {margin-bottom:6px;}
.sv-guide .txt-say:after {margin-top:5px; background-position:-100px -145px;}
.sv-guide p {line-height: 1.79;; color:#666; font-size:14px;}
.sv-guide p + p {margin-top:10px;}
.sv-guide mark {background-color:#c8e7ff; font-weight:700; color:#666;}
.sv-guide table {margin:20px 0 30px;}
.sv-guide table thead th {text-align:center;}
.sv-guide .visual {margin:0 -20px; text-align:center;}
.sv-guide .image {margin:20px 0 30px; text-align:center;}

.reword-visual {position:relative; margin-top:20px; text-align:center; background-color:#f8f9fc; border-radius:5px;}
.reward-wrap + .form-group,
.reword-visual + .form-group {margin-top:30px;}
.reword-visual + .bullet-list,
.reword-visual + .bullet-item {margin-top:10px;}
.reword-visual img {display:block; margin:0 auto;}
.reword-visual [class^='btn'] {margin:-5px 0 30px; background-color:transparent;}

.txt-manual {font-size:14px; color:#666;}
.txt-manual .title {margin:20px 0 5px; color:#4490e9;}

.loading {display:none; position:fixed; left:0; top:0; right:0; bottom:0; z-index:1000; background-color:rgba(255,255,255,.5);}
.loading .icon-loading {position:fixed; left:50%; top:50%; width:60px; height:60px; transform: translate(-50%, -50%);}

.splash {position:fixed; left:0; right:0; top:0; bottom:0; z-index:500; text-align:center;}
.splash img {max-height:100%;}

.activity-form .bullet-list {margin-top:30px; letter-spacing:-0.5px;}
.activity-form .bullet-list .txt-link {color:#4490e9; font-size:13px; border-color:#4490e9; letter-spacing:-0.5px;}
.activity-form .form-group {margin-top:30px;}
.activity-form .form-group textarea {height:120px;}

/* SV 인스타 */
.insta-item {}
.insta-item + .insta-item {margin-top:30px;}
.insta-item .info {display:flex; justify-content: space-between; align-items: center;}
.insta-item .info .name {color:#000; font-size:14px;}
.insta-item .info .hits {color:#999; font-size:12px;}
.insta-item .post {position: relative;}
.insta-item .insta-swiper {margin-top:10px;}
.insta-item .insta-swiper img {width:100%}
.insta-item .insta-swiper .swiper-slide {border-radius:10px; overflow: hidden;}
.insta-item .insta-swiper .swiper-pagination {position:static; margin-top:15px; height:12px;}
.insta-item .insight {position: absolute; left:0; right:0; bottom:0; height:20px; display:flex; justify-content: space-between; align-items: center; }
.insta-item .insight .insight-item {}

[class^='icon-insta']:before {content:''; display:inline-block; width:20px; height:20px; background:url('../images/common/spr_common.png') 0 0 no-repeat; background-size:360px auto; vertical-align: top;}
[class^='icon-insta'] + [class^='icon-insta'] {margin-left:12px;}
[class^='icon-insta'] .txt {display: inline-block; margin-left:2px; line-height:20px; font-size:13px; color:#999;}
.icon-insta-like:before {background-position: -215px -110px;}
.icon-insta-comment:before {background-position: -235px -110px;}
.icon-insta-edit:before {background-position: -255px -110px;}
.icon-insta-delete:before {background-position: -275px -110px;}
.insta-item .content {margin-top:16px; color:#666; font-size:14px;}

.comment-list {margin-top:10px; }
.comment-list .comment-item {line-height:20px;}
.comment-item + .comment-item {margin-top:4px;}
.comment-item .comment-name {color:#000;}
.comment-item time {display:block; margin-top:4px; color:#999; font-size:12px;}
.comment-more {display:block; margin-top:10px; color:#999; font-size:13px; }
.comment-more:after {content:''; display: inline-block; width:10px; height:15px; background:url('../images/common/spr_common.png') -255px -95px no-repeat; background-size:360px auto; vertical-align: -3px;}

.section-comment .comment-item {margin-top:15px;}

.input-comment {position:fixed; left:0; right:0; bottom:0; height:60px; padding:0 20px; box-sizing:border-box; display: flex; align-items: center; border-top:1px solid #e1e1e1; background-color:#fff;}
.input-comment input {}
.input-comment .btn-submit {color:#4490e9;}

.insta {}
.insta .input-search {margin-top:20px;}
.insta .sort-list {margin-top:10px;}

.flex-bar {display:flex; justify-content: space-between; align-items: center; padding-bottom:8px; border-bottom:1px solid #eee;}
.flex-bar .txt {font-size:14px; color:#666;}
.btn-refesh {width:25px; height:25px;  background:url('../images/common/spr_common.png') -125px -145px no-repeat; background-size:360px auto; vertical-align: -3px; text-indent: -99999px; border-radius: 0; border:none;}

.modal-survey .image img {width:100%; margin-bottom:20px; border-radius:10px;}

.upload-txt {padding:20px 0 24px; text-align:center;}
.upload-txt .txt-1 {font-size:16px; color:#4490e9;}
.upload-txt .txt-2 {font-size:14px; color:#666; margin-top:4px;}
.photo-upload {margin:0 -20px 30px; padding:0 0 20px 20px; border-top:1px solid #eee; border-bottom:1px solid #eee; white-space: nowrap; font-size:0; overflow:hidden;}
.photo-upload .upload-file {position:relative; display: inline-block; width:80px; height:80px; margin-top:20px; margin-right:16px; border:1px solid #e1e1e1; border-radius:4px; text-align:center;}
.photo-upload .upload-file:before {content:''; display:block; width:40px; height:35px; margin:17px auto 0;
    background:url('../images/common/spr_common.png') -215px -110px no-repeat; background-size:360px auto;}
.photo-upload .upload-file input {position: absolute;left:0; top:0; bottom:0; width:100%;}
.photo-upload .upload-file .txt {font-size:14px; color:#999; line-height:1.2;}
.photo-upload .upload-file .txt .active {color:#4490e9; font-weight: 600;}
.upload-thumb-list {display: inline-block; width:calc(100% - 96px); padding-top:20px; white-space: nowrap; overflow-x:auto; font-size:0; vertical-align: top;}
.upload-thumb-item {position:relative; display: inline-block;  margin-right:16px; vertical-align: top; }
.upload-thumb-item .image {position:relative; width:80px; height:80px; overflow:hidden; border-radius:4px;}
.upload-thumb-item img {position:absolute; left:0; top:50%; right:0; width:100%; transform:translateY(-50%)}
.upload-thumb-item .btn-delete {position:absolute; right:-10px; top:-10px; width:25px; height:25px; background:url('../images/common/spr_common.png') -25px -145px no-repeat; background-size:360px auto; text-indent: -99999px;}


/* 2021.03.18 추가 */
.eating-setting .form-group {margin: 10px 0 15px;}
.eating-setting .btn-radio-group +.btn-radio-group {margin-top: 15px;}
.eating-setting .btn-radio-group .btn-radio {padding: 0;}
.eating-habits {font-size: 0;}
.eating-habits.gray {margin-top: 30px; border-radius: 10px;	padding:12px 12px 0;}
.eating-habits li {text-align: left; box-sizing: border-box; display: inline-block;	vertical-align: top; margin-bottom: 15px; width: 50%;	font-size: 11px; padding-left:40px; background: url('../images/activity/icon_act_cafe.png') left 5px top 5px  no-repeat; background-size: 30px 30px;}
.data-list2 .data-item .eating-detail {display: flex; flex: 1; align-items: center;}
.data-list2 .data-item .eating-detail .info {width: 50%;}
.eating-date {text-align: center; margin: 15px auto 40px;}
.eating-date strong {font-size:15px;border-bottom: 1px solid #000;}
.my-menu.gray {color: #666; text-align: center; padding: 12px 0; border: 1px solid #eee; border-radius: 10px;}
.appropriate {color: #00b67e;}
.shortage {color: #f30000;}
.excess {color: #f9c105;}
.eating .swiper-button-prev {top: 27px; left: 50px;}
.eating .swiper-button-next {transform: rotate(180deg); top: 27px; right:50px;}
.eating .swiper-button-next:after, .eating .swiper-button-prev:after {background: url(../images/common/spr_common.png) -85px -75px no-repeat; background-size: 360px auto; width: 8px; height: 20px; font-size: 0; opacity: 0.5;}
.eating-habits.detail {margin-bottom: 10px;}
.eating-habits.detail li {width:32.5%;}
.eating-habits.detail li:first-child {width:35%;}
.eating-habits li span {display: inline-block; width: 100%;	font-size: 15px;}
.my-calorie .desc {margin-top: 10px;}
.my-calorie .light-blue2 {display: flex; justify-content: space-between; align-items: center; padding: 5px 10px; box-sizing: border-box;}
.my-calorie .light-blue2 .standard {font-size: 13px;}
.my-calorie li {font-size:15px;	text-align: center;}
.my-calorie .info {width: 65px;	text-align: left;}
.my-calorie .calorie {width: 70px; text-align: right;}
.my-calorie .state {width: 50px;}
.my-calorie .standard {width: 70px;}

/* 2021.03.22 */
.eating-habits .time {background: url('../images/activity/icon_act_meal.png') left 5px top 5px no-repeat;	background-size: 30px 30px;}
.eating-habits .intake {background: url('../images/activity/icon_act_scale.png') left 5px top 5px no-repeat; background-size: 30px 30px;}
.eating-habits .waste {background: url('../images/activity/icon_act_waste.png') left 5px top 5px no-repeat; background-size: 30px 30px;}
.eating-habits .calorie {background: url('../images/activity/icon_act_kcal.png') left 5px top 5px no-repeat; background-size: 30px 30px;}

/* 2021.06.09 */
.box-campaign {border: 1px solid #eee; border-radius:10px; overflow: hidden; padding:0;}
.box-campaign .banner {width: 100%; padding: 0;}
.box-campaign .banner img {width: 100%;}
.box-campaign .info {padding: 10px 20px 15px; text-align: center; font-size: 13px;}
.box-campaign .info .goal {color: #ff7a68; display: block; font-size: 18px; margin-bottom: 3px;}
.chlg-list.campaign [class^='chlg-item'] + [class^='chlg-item'] {margin-top: 15px;}
.chlg-list.campaign [class^='chlg-item'] a {padding-bottom: 15px;}
.chlg-list.campaign .date {position: absolute; top: 20px; right: 20px;}
.chlg-list.campaign .info .info-list {width: 100%; border-top: 1px solid #eee; padding-top: 10px;}
.chlg-list.campaign .info .info-list:after {content: ''; display: block; clear: both;}
.chlg-list.campaign .info .info-list li {float: left;}
.chlg-list.campaign .info .info-list li + li {float: right;}
.chlg-list.campaign .info .info-list li + li:before {display: none;}
.campaign-detail .box-campaign {margin: 0 -20px 0; border-radius: 0; border-left: 0; border-right: 0;}
.campaign-detail .myprogress {margin: 0 -20px; padding: 30px 20px; background: #f8f9fc;}
.campaign-detail .myprogress .box-progress {margin: 0 0 20px 0;}
.campaign-detail .myprogress .box-progress .title {display: block; text-align: center; margin-bottom: 15px;}
.campaign-detail .myprogress .ranking-item.my {margin-top: 10px;}
.campaign-detail .explain {text-align: center;}
.campaign-detail .explain .title {display: block; font-size: 16px; margin: 30px 0 20px;}
.campaign-detail .explain .btn-white-sm {margin: 30px auto;}
.campaign-detail .bullet-list {border-top: 1px solid #eee; padding-top: 20px;}

 /* 2021.06.17 */
.reword-visual.estore {position: relative; border-radius: 10px; overflow: hidden; background: #fff;}
.reword-visual.estore img { width: 100%; }
.reword-visual.estore .btn-white-sm { position: absolute; bottom: 20px; left: 50%; margin: 0; transform: translateX(-50%); background: rgb(255 255 255 / 80%);}

/* 2021.06.29 */
.camp-swiper {overflow:visible;}
.camp-swiper .swiper-pagination {position:static; height:6px; margin-top:12px;}
.camp-swiper .box-campaign {background:#fff; }
.camp-swiper .box-campaign .banner { height:85px; overflow: hidden; border-radius: 0 }
.camp-swiper .box-campaign .banner img { max-height: 100% }

/* 2021.07.06 */
.activity-detail {}
.activity-detail .data-item .value {color: #4490e9;}
.activity-detail .data-item .value.return {color: #ffa500;}
.activity-detail .data-item .value > div {text-align: right;}
.activity-detail .data-item .name .name-arrow { padding-right: 20px; }
.activity-detail .data-item .name .name-arrow:after {content:''; display: block; margin-top: 2px; width: 16px; height: 16px; background: url(../images/common/spr_common.png) -165px -95px no-repeat; background-size: 360px auto;}

/* 2021.07.19 수정 start */
.activity-image { width: 100%; height: 130px; background: #fff; box-sizing: border-box; border:1px solid #eee; border-radius:10px; overflow: hidden; margin-bottom: 20px; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.activity-image .img-box { min-width: 49%; max-height: 100%; display: flex; align-items: center; justify-content: center; }
.activity-image .img-box ~ .img-box { padding-left: 2%; }
.activity-image .img-box img { height:100%; max-height: 130px; }
/* 2021.07.19 수정 end */

.activity-message {color: #666;}
.activity-message li + li { margin-top: 15px; }
.activity-message .tit { color: #4490e9; font-weight: bold; }
.activity-message .exp { max-height: 88px; overflow-y: auto; line-height: 1.6; margin-top: 3px; position: relative;}

/* 2021.07.09 추가 */
.activity-message .exp .state { display: inline-block; width:50%;}
.activity-message .exp .date { position: absolute; top: 2px; right: 0; text-align: right; font-size: 12px;}

/* 2021.10.20 수정*/
.activity-list.sm .activity-item.row { justify-content: flex-start; }
.activity-list.sm .activity-item.row .line { display: flex; margin-right: 10px; width: 100%; }
.activity-list.sm .activity-item.row .name { margin-right: 0; }
.activity-list.sm .activity-item.row .desc { margin: 15px 0 0 3px;	flex: none; }
.activity-list.sm .activity-item.row .value { margin-left: auto; }
@media all and (max-width:359px) {
	.activity-list.sm .activity-item.row .line { width: 50%; }
	.activity-list.sm .activity-item.row .name { max-width: 50%; }
}