@charset "utf-8";

/*
css name : content
use : all page css
*/

/* ==================================================
	메인
================================================== */
.main_wrp {position: relative;width: 100%;height: 100vh;background: url(../img/common/intr0_bg.jpg) no-repeat 50% 100%;background-size: cover;text-align: center;}
.main_wrp .logo {position: absolute;top: 32.63%;left: 0;width: 100%;height: 152px;background: url(../img/common/logo_intro.png) no-repeat 50%;background-size: contain;font-size: 0;}
.main_wrp .btns {position: absolute;top: 63.54%;left: 0;width: 100%;}
.main_wrp .btns a {margin: 0 4px;}
.main_wrp .copyright {position: absolute;bottom: 4.92%;left: 0;width: 100%;font-size: 1rem;font-weight: 900;}
.main_wrp .option-box {display: block; padding-top: 20px;}
.main_wrp .option-box > label {margin-left: -89px;}
.main_wrp .option-box > label input {width: 15px; height: 15px; border-color: #fff; border-radius: 0;}
.main_wrp .option-box > label input:checked {border-width: 4px; border-color: #fff;}
.main_wrp .option-box > label span {font-size: 1.2rem; color: #fff;}
.main_wrp .option-box > label input:checked + span {color: #fff;}
@media all and (orientation: landscape) {
  .main_wrp .logo {top: 28.63%;height: 80px;}
}

/* ==================================================
	로그인
================================================== */
.login_wrp {padding: 40px 15px;}
.login_frm .input_wrp + .input_wrp {margin-top: 40px;}
.login_frm .input_wrp {position: relative;}
.login_frm .input_wrp input {font-family: 'Helvetica', 'Apple SD Gothic Neo', sans-serif;}
.login_frm .input_wrp .icon-sch-clear {position: absolute;top: 0;right: 0;height: 40px;background-position: 50%;}
.login_frm .input_wrp.pw_wrp .icon-sch-clear {right: 35px;}
.login_frm .pw_wrp .icon-eye {position: absolute;top: 0;right: 0;height: 40px;background-position: 50%;}
.login_frm .pw_wrp input {padding-right: 55px;}
.login_frm .option-box {margin-top: 23px;margin-left: 9px;}
.login_frm .area-button {margin-top: 32px;}
.sns_login {margin: 38px 9px 0;}
.sns_login .list li {float: left;width: 50%;padding: 6px 7px;text-align: center;box-sizing: border-box;}
.sns_login .list li a {display: block;border: 1px solid #EDEDED;line-height: 42px;font-weight: 900;}
.sns_login .list li a i {margin-right: 10px;}
.sns_login .notice {margin: 10px 7px 0;color: #C4C4C4;font-weight: 100;}
.login_btm {margin-top: 50px;text-align: center;}
.login_btm .etc_menu li {display: inline-block;margin: 0 15px;font-weight: 900;}
.login_btm .logo {margin-top: 25px;font-size: 0;}
.login_btm .logo img {height: 58px;}
.login_btm .copyright {margin-top: 25px;color: #C4C4C4;font-size: 1rem;}
.certi_wrp {text-align: center;}
.certi_wrp .certi_ment {margin-top: 24%;font-size: 1.8rem;font-weight: 900;}
.certi_wrp .certi_ment strong {color: #4FCDE0;font-weight: 900;}
.certi_wrp .ment {font-size: 2.4rem;font-weight: 100;line-height: 1.5;}
.certi_wrp .subment {margin-top: 23px;color: #C4C4C4;font-weight: 100;line-height: 1.5;}

/* 2019-07-31 아이디 비번찾기 추가 */
.find-info {padding: 45px 0 20px 15px;}
.find-info h3 {font-size: 2rem; font-weight: 700;}
.find-info p {margin-top: 10px; font-size: 1rem; color: #858585; line-height: 15px;}

.find-result {padding: 100px 0 50px; text-align: center; font-size: 1.8rem; font-weight: 700;}
.find-result strong {display: block; margin-top: 15px; color: #4FCDE0; }
.find-result .copy {margin-top: 10px; line-height: 20px; font-size: 1.2rem; border-bottom: 1px solid #000;}

/* ==================================================
	회원가입
================================================== */
.join_frm .pf-img {margin: 20px auto 15px;text-align: center;}
.join_frm .input_wrp {margin-top: 15px;}
.join_frm .input_wrp + .input_wrp {margin-top: 24px;}
.join_frm .input_wrp > label {display: block;margin: 5px 15px;color: #858585;font-size: 1rem;font-weight: 700;}
.join_frm .input_wrp input {padding: 0 15px;}
.join_frm .input_wrp input::-webkit-input-placeholder {font-size: 1.8rem;}
.join_frm .select_wrp {-webkit-display: flex;display: flex;-webkit-flex-direction: row;flex-direction: row;padding: 0 15px 0 5px;border-bottom: 1px solid #EDEDED;}
.join_frm .select_wrp select {-webkit-flex: 1;flex: 1;border-width: 0;width: 100%;}
.join_frm .id_wrp { position: relative; }
.join_frm .id_wrp .btn-small { position: absolute; bottom: 8px; right: 15px; }
.join_frm .tel_wrp {position: relative;}
.join_frm .tel_wrp input {padding-right: 105px;}
.join_frm .tel_wrp button {position: absolute;right: 15px;bottom: 8px;}
.join_frm .cert_wrp {position: relative;margin-top: 18px;}
.join_frm .cert_wrp input {padding-right: 160px;}
.join_frm .cert_wrp .btns {position: absolute;right: 15px;bottom: 8px;}
.join_frm .cert_wrp .link {margin-right: 15px;border-bottom: 1px solid #858585;color: #858585;font-weight: 900;vertical-align: -3px;}
.join_frm .input_wrp .att {margin: 10px 15px;color: #FF4B4B;font-size: 1rem;font-weight: 700;text-align: right;}

.memberOut {position:fixed; z-index: 9999; top:0; right: 0; bottom:0; left:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.2); }
.memberOut .modalAlign {width:100%; padding:24px; background:#fff; border-radius:8px; margin:0 16px; border:1px solid #F0F0F0; box-sizing:border-box}
.memberOut h3 {font-size:18px; line-height:28px; font-weight:700;}
.memberOut .outRules {margin-top:16px; line-height:24px;}
.memberOut .outRules p {padding-left:20px; position:relative; color:#2d2d2d}
.memberOut .outRules p:before {display:block; width: 2px; height: 2px; border-radius:50%; position:absolute; top:10px; left:10px; background:#2d2d2d; content: '';}
.memberOut .outRules ul li {padding-left:24px; color:#858585}
.memberOut .modalButtons {display:flex; gap:0 12px; justify-content:flex-end; margin-top:24px;}
.memberOut .modalButtons [class^="btn-"] {font-size:14px; font-weight:700; min-width:80px; height: 40px; display:flex; align-items:center; justify-content:center; border-radius:8px; box-sizing:border-box;}
.memberOut .modalButtons .btn-line {border:1px solid #E5E7EB; background:#fff}
.memberOut .modalButtons .btn-color {background:#4ECDE0; color:#fff}


.radio_txt {padding: 0 10px;font-size: 0;}
.radio_txt > div {position: relative;display: inline-block;width: 50%;padding: 0 5px;box-sizing: border-box;}
.radio_txt input[type="radio"] {position: absolute;width: 1px;height: 1px;visibility: hidden;border: none;}
.radio_txt input[type="radio"] + label {position: relative;display: block;height: 30px;border: 1px solid #EDEDED;background: #fff;color: #C4C4C4;font-size: 1.5rem;text-align: center;line-height: 30px;}
.radio_txt input[type="radio"]:checked + label {border-color: #2D2D2D;color: #2D2D2D;}
.join_select_list .input_wrp {float: left;width: 50%;margin-top: 24px;}
.resv_sch .user_list {max-height: 55px;overflow: scroll;padding: 10px;}
.resv_sch .user_list ul li {line-height: 2.6rem;font-size: 1.6rem;cursor: pointer;}

.select_coach {margin: 15px;}
.select_coach > .list {text-align: justify;text-justify: inter-cluster;}
.select_coach > .list:after {display: inline-block;width: 100%;height: 0;content: "";}
.select_coach > .list button {position: relative;display: inline-block;padding-top: 18px;vertical-align: middle;}
.select_coach > .list button .photo {display: block;width: 45px;height: 45px;opacity: .3;border: 1px solid #B4BCD6;border-radius: 50%;box-shadow: 0 4px 4px rgba(0, 0, 0, .11);background-repeat: no-repeat;background-position: 50%;background-size: cover;font-size: 0;}
/*.select_coach > .list button.active:before {position:absolute;top:0;left:50%;width:0;height:0;margin-left:-4px;border-top:8px solid #4FCDE0;border-left:5px solid transparent;border-right:5px solid transparent;content:"";}*/
.select_coach > .list button.active .photo {width: 70px;height: 70px;opacity: 1;}
.select_coach .coach_info {margin-top: 20px;}
.select_coach .coach_info .name {float: left;font-size: 1.8rem;font-weight: 900;}
.select_coach .coach_info .stars_wrp {float: right;font-weight: 100;line-height: 25px;}
.select_coach .coach_info .stars_wrp .star-rating {vertical-align: middle;}
.select_coach .coach_info .stars_wrp strong {font-weight: 900;}
.select_coach .coach_info .intro {margin-top: 10px;color: #858585;line-height: 1.9;}

.coach_info .review {margin-top: 20px;border-top: 1px dashed #858585;}
.coach_info .review .btn {width: 100%;text-align: center;}
.coach_info .review .btn span {position: relative;display: inline-block;padding-top: 7px;font-size: 1rem;font-weight: 900;}
.coach_info .review .btn span:before,
.coach_info .review .btn span:after {position: absolute;left: 50%;width: 0;height: 0;margin-left: -10px;border-left: 10px solid transparent;border-right: 10px solid transparent;content: "";}
.coach_info .review .btn span:before {top: -5px;border-top: 11px solid #B4BCD6;}
.coach_info .review .btn span:after {top: -6px;border-top: 11px solid #fff;}
.coach_info .review .list {display: none;}
.coach_info .review .list li {position: relative;margin: 20px 0;padding-left: 90px;}
.coach_info .review .list li .date {position: absolute;top: 0;left: 0;font-weight: 900;}
.coach_info .review .list li .txt {color: #858585;}
.coach_info .review .list li .stars {margin-top: 5px;}
.coach_info .review.on .btn span:before,
.coach_info .review.on .btn span:after {-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.coach_info .review.on .btn span:before {top: -7px;}
.coach_info .review.on .list {display: block;}

/* ==================================================
	마이페이지
================================================== */
/* 코치 */
.my_intro {padding: 35px 15px 0;}
.my_intro .date {font-size: 1.2rem;}
.my_intro .my_info {position: relative;min-height: 95px;margin-top: 20px;padding-left: 118px;}
.my_intro .my_info .photo {position: absolute;top: 0;left: 0;display: block;width: 95px;height: 95px;border-radius: 50%;background-repeat: no-repeat;background-position: 50%;background-size: cover;font-size: 0;}
.my_intro .my_info .cont .ment {font-size: 2.2rem;font-weight: 100; word-break: keep-all;}
.my_intro .my_info .cont .ment strong {font-weight: 900;}
.my_intro .my_info .cont .state {margin-top: 2px;color: #858585;font-weight: 100;}
.my_intro .my_info .cont .stars_wrp {margin-top: 10px;font-weight: 100;}
.my_intro .my_info .cont .stars_wrp .star-rating {vertical-align: middle;}
.my_intro .my_info .cont .stars_wrp strong {font-weight: 900;}
.my_intro .intro_write {margin-top: 45px;}
.my_intro .intro_write textarea {width: 100%;height: 105px;padding: 10px 15px;color: #2D2D2D;font-size: 1.2rem;line-height: 1.9;}
.my_intro .intro_write .att {color: #858585;font-size: 1.1rem;line-height: 25px;}
.my_intro .intro_write .btn-small {float: right;}

.my_menu {margin-top: 27px;}
.my_menu > ul {width: 100%;padding: 28px 30px;border-bottom: 1px solid #EDEDED;background: #fff;box-sizing: border-box;}
.my_menu > ul > li {float: left;width: 33.33%;padding: 0 3.5px;box-sizing: border-box;}
.my_menu > ul > li > button {display: block;width: 100%;padding: 13px 0 4px;border-radius: 4px;background: #F1F3F9;color: #C4C4C4;font-weight: 900;text-align: center;}
.my_menu > ul > li .tit {font-size: 1rem;}
.my_menu > ul > li i {height: 22px;margin-top: 6px;background-position: 50%;}
.my_menu > ul > li .count {margin-top: 2px;font-size: 1.8rem;}
.my_menu > ul > li > button.active {background: #4FCDE0;color: #fff;}
.my_menu.fix {padding-top: 143px;}
.my_menu.fix > ul {position: fixed;top: 56px;left: 0;z-index: 1;}

.my_resv_list {padding: 30px 15px 20px 23px;border-bottom: 1px solid #EDEDED;}
.my_resv_list ul {position: relative;}
.my_resv_list ul:before {position: absolute;top: 6px;left: 19px;bottom: 40px;width: 2px;background: #f1f3f9;content: "";}
.my_resv_list ul li + li {margin-top: 30px;}
.my_resv_list .itm {position: relative;padding: 8px 55px;}
.my_resv_list .itm .photo {position: absolute;top: 5px;left: 0;width: 35px;height: 35px;border: 3px solid #C4C4C4;border-radius: 50%;background: no-repeat 50%;background-size: cover;}
.my_resv_list .itm .time {display: flex;display: -webkit-flex;-webkit-flex-direction: row;font-size: 1.2rem;font-weight: 900;}
.my_resv_list .itm .time > span {-webkit-flex: auto;flex: auto;}
.my_resv_list .itm .time > span.voucher-name {display: flex;justify-content: flex-end;font-size: 1.2rem;font-weight: 100;margin-right: 15px;}
.my_resv_list .itm .info {display: -webkit-flex;display: flex;-webkit-flex-direction: row;flex-direction: row;margin-top: 3px;}
.my_resv_list .itm .info > span {-webkit-flex: auto;flex: auto;font-weight: 100;}
.my_resv_list .itm .info > span.count {display: flex;justify-content: flex-end;font-weight: 100;margin-right: 15px;}
.my_resv_list .itm .info strong {font-weight: 900;}
.my_resv_list .itm .btns {position: absolute;top: 16px;right: 0;opacity: .5;}
.my_resv_list .itm .btns > a + a {margin-left: 12px;}

.my_memb_list {padding: 10px 15px 60px 23px;border-bottom: 1px solid #EDEDED;}
.my_memb_list .sorting {text-align: right;}
.my_memb_list .sorting select {height: 20px;border: 0;font-size: 1rem;font-weight: 700;}
.my_memb_list ul {margin-top: 30px;}
.my_memb_list ul li + li {margin-top: 40px;}
.my_memb_list .itm {position: relative;padding: 0 55px;}
.my_memb_list .itm .photo {position: absolute;top: 0;left: 0;width: 38px;height: 38px;border: 1px solid #E5E5E5;border-radius: 50%;background-repeat: no-repeat;background-position: 50%;background-size: cover;}
.my_memb_list .itm .name {font-size: 1.8rem;font-weight: 900;}
.my_memb_list .itm .name:after {display: inline-block;width: 10px;height: 10px;margin-left: 7px;background: url(../img/icon/icon_arrow_right.png) no-repeat;background-size: contain;content: "";}
.my_memb_list .itm .info {display: flex;display: -webkit-flex;-webkit-flex-direction: row;flex-direction: row;margin-top: 3px;}
.my_memb_list .itm .info > span {-webkit-flex: auto;flex: auto;font-weight: 100;}
.my_memb_list .itm .info strong {font-weight: 900;}
.my_memb_list .itm .btns {position: absolute;top: 10px;right: 0;}
.my_memb_list .itm .btns > a + a {margin-left: 12px;}
.my_memb_list .itm.end {opacity: .3;}
.my_memb_list .itm.new .photo:after {position: absolute;top: 2px;right: 1px;width: 7px;height: 7px;border-radius: 50%;background: #FF4B4B;content: "";}
.my_memb_list .itm .btns a.disabled {pointer-events: none;}

.my_notice_list .itm {position: relative;padding-left: 70px;border-bottom: 1px solid #EDEDED;}
.my_notice_list .itm .date {position: absolute;top: 0;left: 0;width: 70px;padding: 25px 0;}
.my_notice_list .itm .date > span {display: block;font-size: 1rem;font-weight: 900;line-height: 1.2;text-align: center;}
.my_notice_list .itm .date .d {font-size: 3rem;line-height: 1;}
.my_notice_list .itm .list {padding: 25px 15px;border-left: 1px solid #EDEDED;}
.my_notice_list .itm .list > li + li {margin-top: 40px;}
.my_notice_list .itm .list .tit {margin-left: 10px;font-size: 1.5rem;font-weight: 900;line-height: 20px;vertical-align: middle;}
.my_notice_list .itm .list .tit.regist {color: #4FCDE0;}
.my_notice_list .itm .list .tit.cancel {color: #FF4B4B;}
.my_notice_list .itm .list .tit.noti {color: #f17430;}
.my_notice_list .itm .list .time {margin-left: 7px;vertical-align: bottom;}
.my_notice_list .itm .list .txt {margin-top: 10px;color: #858585;line-height: 1.5;}
.my_notice_list .itm .list .txt strong {font-weight: 900;}
.my_notice_list .itm .list .btn_link {display: inline-block;margin-top: 16px;font-size: 1rem;font-weight: 900;}
.my_notice_list .itm .list .btn_link:after {display: inline-block;width: 10px;height: 10px;margin-left: 7px;background: url(../img/icon/icon_arrow_right.png) no-repeat;background-size: contain;vertical-align: middle;content: "";}
.my_notice_list .itm .list .icon-brand {width: 20px;height: 20px;background-position: 50%;}

/* 일반 */
.my_intro .my_info .cont .coach {margin-top: 5px;}
.my_intro .my_info .cont .coach span {display: inline-block;line-height: 36px;}
.my_intro .my_info .cont .coach strong {font-weight: 900;}
.my_intro .my_info .cont .coach a {position: relative;display: inline-block;margin-left: 10px;}
.my_intro .my_info .cont .coach a i {position: absolute;top: -2px;right: -12px;}
.my_intro .my_info .cont .coach .profile_img {width: 34px;height: 34px;border-color: #C4C4C4;}

.my_menu > ul > li .icon-ticket {opacity: .3;background-image: url(../img/icon/icon_ticket_b.png);}
.my_menu > ul > li .active .icon-ticket {opacity: 1;background-image: url(../img/icon/icon_ticket_c.png);}
.my_menu > ul > li .icon-whistle {opacity: .3;background-image: url(../img/icon/icon_whistle_b.png);}
.my_menu > ul > li .active .icon-whistle {opacity: 1;background-image: url(../img/icon/icon_whistle_c.png);}
.my_menu > ul > li > button.new {position: relative;}
.my_menu > ul > li > button.new:after {position: absolute;top: 6px;right: 3px;width: 6px;height: 6px;border-radius: 3px;background: #FF4B4B;content: "";}

.active .customer_detail_btn {float: right; margin: -25px 15px 0 0;}
.customer_ticket ul li.disabled {color: #C4C4C4;}
.customer_ticket .end {margin-top: 55px;text-align: center;}
.customer_ticket .end .ment {color: #FF4B4B;font-size: 1.5rem;font-weight: 100;}
.customer_ticket .end .ment strong {font-weight: 900;}
.customer_ticket .end .subment {margin-top: 10px;line-height: 1.5;}
.customer_ticket .end .rating_wrp {margin-top: 26px;}
.customer_ticket .end .btn-small {margin-top: 23px;}

.active .customer_ticket_detail_area {padding: 20px 0 20px 20px;border-bottom: 1px solid #E5E5E5;}
.active .customer_ticket_detail_area .customer_ticket_detail p {font-size: 15px;line-height: 2.2em;}
.active .customer_ticket_detail_area .customer_ticket_detail .customer_ticket_detail_name {font-weight: bold;font-size: 20px;}
.active .customer_ticket_detail_area .customer_ticket_detail p .ticket_detail_count {font-weight: bold;margin: 0 10px;}
.active .customer_ticket_detail_area .customer_ticket_detail p .ticket_detail_period {color: red;margin-left: 17px;}

/* ==================================================
	고객정보
================================================== */
.profile_img {display: inline-block;width: 98px;height: 98px;border-radius: 50%;border: 1px solid #B4BCD6;background-repeat: no-repeat;background-size: cover;background-position: 50%;font-size: 0;}
.customer_info {padding: 30px 15px 25px;border-bottom: 1px solid #E5E5E5;}
.customer_info .profile_img {display: block;margin: 0 auto 16px;}
.customer_info .name {font-size: 2.4rem;font-weight: 900;}
.customer_info .birth {margin-left: 9px;font-weight: 900;}
.customer_info .info {float: left;margin-top: 20px;}
.customer_info .info li {margin: 3px 0;font-weight: 100;}
.customer_info .info li strong {font-weight: 900;}
.customer_info .util {float: right;margin-top: 15px;font-size: 0;}
.customer_info .util a {display: inline-block;padding: 10px;}
.customer_info .util .icon-call {width: 28px;height: 27px;}
.customer_info .util .icon-register {width: 24px;height: 27px;}

.customer_menu > ul {width: 100%;border-bottom: 1px solid #EDEDED;background: #fff;box-sizing: border-box;}
.customer_menu > ul > li {float: left;width: 33.33%;text-align: center;}
.customer_menu > ul > li button {width: 100%;padding: 16px 0 13px;color: #E5E5E5;font-weight: 900;}
.customer_menu > ul > li .tit {font-size: 1rem;}
.customer_menu > ul > li [class^="icon-"] {height: 22px;margin-top: 4px;background-position: 50%;}
.customer_menu > ul > li .count {margin-top: 4px;font-size: 1.8rem;}
.customer_menu > ul > li button.active {color: #2D2D2D;}
.customer_menu > ul > li button.active .icon-my-calendar {background-image: url(../img/icon/icon_calendar_b_dark.png);}
.customer_menu.fix {padding-top: 99px;}
.customer_menu.fix > ul {position: fixed;top: 56px;left: 0;z-index: 1;}

.cus_resv_list .itm {position: relative;min-height: 86px;padding-left: 70px;border-bottom: 1px solid #EDEDED;}
.cus_resv_list .itm .date {position: absolute;top: 0;left: 0;width: 70px;padding: 20px 0;text-align: center;}
.cus_resv_list .itm .date .year {font-size: 1rem;font-weight: 900;letter-spacing: 3px;}
.cus_resv_list .itm .date .month {font-size: 3rem;font-weight: 900;line-height: 1;}
.cus_resv_list .itm .list {min-height: 46px;padding: 22px 16px;border-left: 1px solid #EDEDED;}
.cus_resv_list .itm .list li {font-size: 0;}
.cus_resv_list .itm .list li + li {margin-top: 40px;}
.cus_resv_list .itm .list li > span {display: inline-block;font-size: 1.2rem;vertical-align: middle;}
.cus_resv_list .itm .list li > span.day {display: inline-block;font-size: 1.2rem;vertical-align: middle;}
.cus_resv_list .itm .list li > span.time {display: inline-block;font-size: 1.2rem;vertical-align: middle; font-weight: 700; float: right;}
.cus_resv_list .itm .list .row {display: inline-block;width: 80%;float: left;font-weight: 900;vertical-align: top;}
.cus_resv_list .itm .list .row > div:first-child {margin-bottom: 3px;}
.cus_resv_list .itm .list .row span {font-size: 1.3rem; font-weight: 100;}
.cus_resv_list .itm .list .row span.day {font-weight: 900;}
.cus_resv_list .itm .list .row span.time {font-weight: 700;float: right;}
.cus_resv_list .itm .list .row span.history {float: right;}
.cus_resv_list .itm .list .cancel {width: 20%;opacity: .5;text-align: right; float: left; vertical-align: top;}
.cus_resv_list .itm .list .cancel .icon-call-cancel {margin-top: 6px;}
.cus_resv_list .itm .list .cancel {width: 15%;opacity: .5;text-align: right;}

.cus_resv_list.lesson .itm .list .row {width: 95%;}
.cus_resv_list.lesson .itm .list .row > div:first-child { margin-bottom: 3px }
.cus_resv_list.lesson .itm .list .row span.hour {display: inline-block;font-size: 1.2rem;vertical-align: middle; font-weight: 700; float: right;text-align: right;}
.cus_resv_list.lesson .itm .list .row span.history-end {color: #FF4B4B;display: inline-block;font-size: 1.2rem;vertical-align: middle; font-weight: 700;}
.cus_resv_list.lesson .itm .list li + li {margin-top: 30px;}
.cus_resv_list.lesson .itm .list .ticket {width: 35%;font-weight: 100;text-align: center;}
.cus_resv_list.lesson .att {margin-top: 10px;color: #C4C4C4;font-size: 1rem;font-weight: 700;text-align: center;}

.customer_ticket {padding: 65px 0 50px;border-bottom: 1px solid #E5E5E5;}
.customer_ticket ul {display: -webkit-flex;display: flex;-webkit-flex-direction: row;flex-direction: row;}
.customer_ticket ul li {-webkit-flex: 1;flex: 1;border-left: 1px solid #E5E5E5;text-align: center;box-sizing: border-box;}
.customer_ticket ul li:first-of-type {border-left: 0;}
.customer_ticket .tit {font-size: 1.4rem;}
.customer_ticket .count {font-size: 1.8rem;}
.customer_ticket .count strong {font-size: 3.2rem;font-weight: 900;}
.customer_ticket .info strong {font-weight: 900;}
.customer_ticket .info .remain {color: #FF4B4B;}

/* ==================================================
	예약등록·정보
================================================== */
.flex_container {display: -webkit-flex;display: flex;-webkit-flex-direction: column;flex-direction: column;min-height: calc(100vh - 56px);}
.flex_container .flex_btm {margin-top: auto;}

.resv_sch {position: relative; margin: 60px 0 0 60px; overflow: hidden;}
.resv_sch .input_sch {position: relative;}
.resv_sch .input_sch .icon-sch {position: absolute;bottom: 13px;left: 0; transition: all .3s; -webkit-transition: all .3s;}
.resv_sch .input_sch input {width: 100%;padding: 0 30px;border-color: #2D2D2D;font-size: 2.4rem;font-weight: 900; transition: all .3s; -webkit-transition: all .3s;}
.resv_sch .input_sch input:focus {padding-left: 0; color: #2D2D2D;}
.resv_sch .input_sch input::placeholder {font-size: 1.8rem; font-weight: 100;}
.resv_sch .input_sch input:focus + i {top: 11px; left: -30px;}
.resv_sch .input_sch .btn_clear {display: block !important;position: absolute; z-index: 5; bottom: 13px;right: 35px; transition: all .3s; -webkit-transition: all .3s; opacity: 0;}
.resv_sch .input_sch .btn-search {position: absolute; bottom: 7px; right: -15px; z-index: 5; font-size: 1.2rem; width: 40px; height: 30px; font-weight: 700; transition: all .3s; -webkit-transition: all .3s; opacity: 0;}
.resv_sch .input_sch.focused .btn_clear {display: block !important; right: 50px; opacity: 1;}
.resv_sch .input_sch.focused .btn-search {opacity: 1; right: 0;}

.resv_sch .input_sch .autocomp {position: absolute;top: 100%;left: 0;right: 0;z-index: 10;padding-top: 15px;}
.resv_sch .input_sch .autocomp div {padding: 7px 30px;color: #C4C4C4;font-size: 1.5rem;font-weight: 100;}
.resv_wrp .pay_select {margin: 25px 15px;padding-bottom: 35px;border-bottom: 1px solid #EDEDED;}
.resv_wrp .pay_select .att {color: #858585;font-size: 1rem;font-weight: 700;}
.resv_wrp .pay_select .option-box {position: relative;display: block;}
.resv_wrp .pay_select .option-box label > input {position: absolute;}
.resv_wrp .pay_select .option-box label > span {margin-left: 42px;font-weight: 900;}
.resv_wrp .pay_select .option-box label.period-over {opacity: 0.5;}
.resv_wrp .pay_select .option-box label .info {display: inline-block;margin-left: 10px;font-size: 1.2rem;font-weight: 400;}
.resv_wrp .pay_select .option-box label .info span {font-size: 1.2rem;color: #FF4B4B;font-weight: 400;margin: 0;}
.resv_wrp .pay_select.def {margin-top: 10px;padding-top: 55px;border-top: 1px solid #EDEDED;border-bottom: 0;}
.resv_wrp .resv_info {position: relative; padding: 60px 15px 0;}
.resv_wrp .resv_info h3 {margin-bottom: 3px;font-size: 1.5rem;font-weight: 100;}
.resv_wrp .resv_info .date,
.resv_wrp .resv_info .time {font-size: 2.4rem;font-weight: 900;line-height: 1.7;}
.resv_wrp .resv_info_detail {margin: 0 15px;font-size: 1.8rem;}
.resv_wrp .resv_info_detail .profile_img {display: block;width: 104px;height: 104px;margin: 10px 0 25px;box-shadow: 0 3px 6px rgba(0, 0, 0, .16);}
.resv_wrp .resv_info_detail label {display: block;margin-bottom: 10px;color: #858585;font-size: 1rem;font-weight: 700;}
.resv_wrp .resv_info_detail .name,
.resv_wrp .resv_info_detail .tel {float: left;width: 50%;padding-bottom: 23px;border-bottom: 1px solid #EDEDED;}
.resv_wrp .resv_info_detail .pay {margin-top: 25px;padding-bottom: 5px;border-bottom: 1px solid #EDEDED;}
.resv_wrp .resv_info_detail .pay .info {margin-left: 5px;font-size: 1.2rem;}

.tabmenu {margin-top: 30px;}
.tabmenu li {float: left;width: 50%;border-bottom: 3px solid #EDEDED;font-size: 1.8rem;font-weight: 900;text-align: center;}
.tabmenu li a {display: block;padding: 5px 0;}
.tabmenu li.on {border-color: #4FCDE0;color: #4FCDE0;}

#calendar {margin: 50px 5px 0;}
#calendar .pignose-calendar-top {text-align: center;}
#calendar .pignose-calendar-top-date {display: inline-block;width: 130px;font-size: 1.8rem;font-weight: 900;vertical-align: middle;}
#calendar .pignose-calendar-top-nav {display: inline-block;width: 25px;height: 25px;background: url(../img/icon/icon_arrow_right.png) no-repeat 50%;background-size: 14px;vertical-align: middle;}
#calendar .pignose-calendar-top-prev {-webkit-transform: rotate(180deg);transform: rotate(180deg);}
#calendar .pignose-calendar-header {overflow: hidden;margin-top: 30px;}
#calendar .pignose-calendar-row {overflow: hidden;}
#calendar .pignose-calendar-week,
#calendar .pignose-calendar-unit {float: left;width: 14.28%;height: 2.8em;font-size: 1.4rem;line-height: 2em;text-align: center;}
#calendar .pignose-calendar-week {color: #858585;font-weight: 900;}
#calendar .pignose-calendar-week:first-child {color: red;}
#calendar .pignose-calendar-week:last-child {color: blue;}
#calendar .pignose-calendar-unit {position: relative;font-weight: 100;}
#calendar .pignose-calendar-week:last-child,
#calendar .pignose-calendar-unit:last-child {width: 14.32%;}
#calendar .pignose-calendar-unit a {display: inline-block;width: 24px;height: 24px;border-radius: 50%;line-height: 24px;text-align: center;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-active:before {position: absolute;top: 2px;left: 50%;width: 24px;height: 24px;margin-left: -12px;border-radius: 50%;background-color: #4FCDE0;box-shadow: 0 3px 6px rgba(0, 0, 0, 0.26);content: "";}
#calendar .pignose-calendar-unit.pignose-calendar-unit-active a {position: relative;color: #fff;}
#calendar .pignose-calendar-unit.today {font-weight: 900;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled a {position: relative;z-index: 1;color: #000;}
/*#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled:before {position:absolute;top:2px;left:78%;z-index:1;width:4px;height:4px;margin-left:-12px;border-radius:50%;background-color:#4FCDE0;box-shadow:0 3px 6px rgba(0, 0, 0, 0.26);content:"";}*/
#calendar .pignose-calendar-unit.pignose-calendar-unit-date.pignose-calendar-unit-disabled a{background-color: #FF4B4B;color: #FFF;opacity: 0.7;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-active a {background-color: #4FCDE0;color: #FFF;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-weekdays:before { display: none; }
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-weekdays a {color: #FFF;background-color: #FF4B4B;opacity: 0.7;}
/* 20190828 */
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-range a {color: #E5E5E5; opacity: 1; background: #FFFFFF;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-range:before {display: none;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-range .pignose-calendar-button-schedule-pin-reservation {display: none;}
/* 20190828 */
/*새로추가*/
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-multiple-range:before {display: none;}
#calendar .pignose-calendar-unit.pignose-calendar-unit-disabled.pignose-calendar-unit-disabled-multiple-range a {color: #FFF;opacity: 0.7;background-color: #FF4B4B;}

/* 20191106 */
.pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range a {background-color: rgba(79, 205, 224, 0.3);width: 100% !important;border-radius: 0 !important;}
.pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-range-first a {border-top-left-radius: 1.2em !important;border-bottom-left-radius: 1.2em !important;}
.pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-range-last a {border-top-right-radius: 1.2em !important;border-bottom-right-radius: 1.2em !important;}

.pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container {width: 100%;height: auto;position: absolute;top: 0;text-align: center;white-space: nowrap;}
.pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container .pignose-calendar-button-schedule-pin {width: 4px;height: 4px;border-radius: 50%;content: "";display: inline-block; white-space: nowrap;margin: 0 0 0 1px;top: -13px;position: relative;}
/*.pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container:first-child {margin-left: 1px;}*/
/*.pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container span:nth-child(2) {margin-left: 1px;}*/

/* ******************************************************** */
.resv_wrp .select_time {position: relative;height: 125px;margin-top: 30px;padding-left: 5px; padding-right: 10px; border: 1px solid #EDEDED;border-width: 1px 0;}
.resv_wrp .select_time .today {position: absolute;top: 0;left: 0;width: 86px;padding: 25px 0;border-right: 1px solid #EDEDED;text-align: center;}
.resv_wrp .select_time .today span {display: block;font-size: 1rem;font-weight: 900;}
.resv_wrp .select_time .today span strong {font-size: 4.1rem;line-height: 1.2;}
.resv_wrp .select_time .time {overflow-x: auto;width: 100%;height: 100%;-webkit-overflow-scrolling: touch;}
.resv_wrp .select_time .time .list {display: -webkit-flex;display: flex;-webkit-flex-flow: column wrap;flex-flow: column wrap;height: 100%;padding: 18px 0;box-sizing: border-box;}
.resv_wrp .select_time .time .list li {margin: 8px 5px;}
.resv_wrp .select_time .time .list li button {display: block;width: 72px;height: 28px;border: 2px solid #EDEDED;border-radius: 14px;font-size: 1rem;font-weight: 700;text-align: center;}
.resv_wrp .select_time .time .list button.on {border-color: #4FCDE0;background-color: #4FCDE0;color: #fff;}
.resv_wrp .select_time .time .list button.reg {position: relative;padding-left: 20px;border-color: #FF4B4B;background-color: #FF4B4B;color: #fff;box-shadow: 0 3px 6px rgba(0, 0, 0, .16);}
.resv_wrp .select_time .time .list button.reg .profile_img {position: absolute;top: -4px;left: -5px;width: 28px;height: 28px;border: 2px solid #FF4B4B;box-shadow: 0 3px 6px rgba(0, 0, 0, .16);}
.resv_wrp .select_time .time .list button.reg .nm {display: block;font-weight: 900;}
.resv_wrp .select_time .time .list button.reg .t {display: block;font-size: .8rem;}
.resv_wrp .select_time .time .list button:disabled {color: #E5E5E5;}
.resv_wrp .resv_ment {margin-top: 35px;font-size: 1.8rem;text-align: center;}
.resv_wrp .resv_ment .ment {margin-top: 10px;font-weight: 100;}
.resv_wrp .resv_ment .ment strong {font-weight: 900;}
.resv_wrp .my_resv_list {margin-top: 25px;border-top: 1px solid #EDEDED;border-bottom: 0;}
.resv_wrp .my_resv_list ul:before {left: 49px;}
.resv_wrp .my_resv_list .itm {padding-right: 30px;padding-left: 85px;}
.resv_wrp .my_resv_list .itm .photo {left: 30px;}
.resv_wrp .my_resv_list .option-box {position: absolute;top: 7px;left: 0;}
.resv_wrp .my_resv_list .option-box [type="checkbox"] {width: 14px;height: 14px;}
.resv_wrp .my_resv_list .option-box [type="checkbox"]:checked {border-width: 4px;}

.resv-next-step .resv_info:before {display: block; content: ""; position: absolute; bottom: -25px; left: 50%; margin-left: -5px; width: 10px; height: 10px; background: url(../img/icon/icon_back_top.png) no-repeat; background-size: contain;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
}
.resv-next-step {position: fixed; z-index: 50; width: 100%; height: calc(100% - 56px); bottom: -100%; background: #fff; overflow-y: auto; transition: all .5s; -webkit-transition: all .5s;}
.resv-next-step .resv_sch {margin: 45px 10px 0 20px; }
.resv-next-step.next-mode {bottom: 0;}
.resv-next-step .member-detail .inner {display: none;}
.resv-next-step .member-detail .resv_info {padding-top: 30px;}
.resv-next-step .member-detail .resv_info:before {display: none;}
.resv-next-step .member-detail.normal {height: 100%;}
.resv-next-step .member-detail.normal .inner {display: block; height: calc(100% - 120px); overflow-y: auto;}
.resv-next-step .member-detail.normal .inner .area-button {position: absolute; right: 0; bottom: 0; left: 0;}

.weekly {position: relative;margin: 20px 15px;border: 1px solid #EDEDED;}
.weekly .timetable caption {visibility: hidden;font-size: 0;height: 0;}
.weekly .timetable thead th {height: 85px;border: 1px solid #EDEDED;border-width: 0 1px 0 0;color: #B4BCD6;line-height: 1.6;}
.weekly .timetable thead th:last-of-type {border-right: 0;}
.weekly .timetable tbody td {height: 60px;border: 1px solid #EDEDED;border-width: 0 1px 1px 0;text-align: center;}
.weekly .timetable tbody tr:last-of-type td {border-bottom: 0;}
.weekly .timetable tbody tr td:last-of-type {border-right: 0;}
.weekly .timetable .year {color: #2D2D2D;font-size: 1rem;font-weight: 900;}
.weekly .timetable .month {color: #2D2D2D;font-size: 2.4rem;font-weight: 900;line-height: 1;}
.weekly .timetable .day {font-size: 1.5rem;}
.weekly .timetable thead th.dayoff {color: #FF4B4B;}
.weekly .timetable tbody td.dayoff {background: rgba(255, 75, 75, .1);}
.weekly .timetable .disabled {background: #EDEDED;}
.weekly .timetable .disabled > span {color: #fff;font-size: 1rem;font-weight: 900;}
.weekly .timetable .profile_img {width: 28px;height: 28px;border: 0;box-shadow: 0 3px 6px rgba(0, 0, 0, .16);}
.weekly.def .timetable .profile_img {width: 40px;height: 40px;box-shadow: none;vertical-align: middle;}
.weekly .timetable .name {margin-top: 2px;color: #2D2D2D;font-size: 1rem;font-weight: 900;}

.dataTable,
.dataTable th,
.dataTable td {box-sizing: content-box;}
.dataTable {width: 100%;margin: 0 auto;clear: both;table-layout: fixed;word-wrap: break-word;}
.dataTable th {width: 65px;}
.dataTable td {width: 55px;}
.dataTables_scrollHead .dataTable thead tr th,
.dataTables_scrollBody .dataTable thead tr th {width: 55px;}
.dataTables_scrollHead .dataTable thead tr th:first-of-type,
.dataTables_scrollBody .dataTable thead tr th:first-of-type {width: 65px;border-right: 0;}
.dataTable tbody tr {background-color: #fff;}
.dataTable tbody tr:first-child th,
.dataTable tbody tr:first-child td {border-top: none;}
.DTFC_LeftBodyWrapper .dataTable tbody th,
.DTFC_LeftBodyWrapper .dataTable tbody td {border-top: 0;}
.dataTables_scrollHeadInner {border-bottom: 1px solid #EDEDED;}
.dataTables_wrapper {position: relative;clear: both;*zoom: 1;zoom: 1;}
.dataTables_wrapper .dataTables_scroll {clear: both;}
.dataTables_wrapper .dataTables_scroll .dataTables_scrollBody > table > thead > tr > th > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll .dataTables_scrollBody > table > thead > tr > td > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll .dataTables_scrollBody > table > tbody > tr > th > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll .dataTables_scrollBody > table > tbody > tr > td > div.dataTables_sizing {height: 0;overflow: hidden;margin: 0 !important;padding: 0 !important;}
.dataTables_wrapper:after {visibility: hidden;display: block;content: "";clear: both;height: 0;}
.DTFC_Cloned thead,
.DTFC_Cloned tfoot,
.DTFC_Blocker {background-color: #fff;}
.DTFC_LeftWrapper .dataTable,
.DTFC_RightWrapper .dataTable {margin-bottom: 0;z-index: 2;}
.DTFC_LeftWrapper .dataTable.no-footer,
.DTFC_RightWrapper .dataTable.no-footer {border-bottom: none;}
.DTFC_LeftHeadWrapper,
.DTFC_LeftBodyWrapper {border-right: 1px solid #EDEDED;}
.DTFC_LeftHeadWrapper {border-bottom: 1px solid #EDEDED;}
.DTFC_ScrollWrapper:before,
.DTFC_ScrollWrapper:after,
.DTFC_LeftBodyWrapper:before,
.DTFC_LeftBodyWrapper:after {position: absolute;z-index: 1;width: 10px;height: 10px;opacity: .3;background: url(../img/icon/icon_arrow_down.png) no-repeat;background-size: 10px;content: "";}
.DTFC_ScrollWrapper:before {top: 40px;left: 67px;-webkit-transform: rotate(90deg);transform: rotate(90deg);}
.DTFC_ScrollWrapper:after {top: 40px;right: 2px;-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}
.DTFC_LeftBodyWrapper:before {top: 5px;left: 28px;-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.DTFC_LeftBodyWrapper:after {bottom: 5px;left: 28px;}
.dataTable tbody > tr > td.selected {position: relative;background-color: #4FCDE0;}
.dataTable tbody > tr > td.selected:before,
.dataTable tbody > tr > td.selected:after {position: absolute;top: 50%;left: 50%;background: #fff;content: "";}
.dataTable tbody > tr > td.selected:before {width: 25px;height: 1px;margin-left: -12px;}
.dataTable tbody > tr > td.selected:after {width: 1px;height: 25px;margin-top: -12px;}

/* 회원 검색 */
.memsch_wrp .mem_info {margin: 35px 20px 0;}
.memsch_wrp .mem_info .ment {font-size: 1.8rem;font-weight: 100;}
.memsch_wrp .mem_info .ment strong {color: #4FCDE0;font-weight: 900;}
.memsch_wrp .mem_info .subment {margin-top: 3px;font-weight: 900;}
.memsch_wrp .resv_sch {margin: 25px 15px 0 20px;}
.memsch_wrp .resv_sch .input_sch input::-webkit-input-placeholder {color: #E5E5E5;font-size: 1.8rem;font-weight: 100;}
.memsch_wrp .my_memb_list {padding-bottom: 10px;border: 0;}

/* ==================================================
	안내취소·예약
================================================== */
.flex_container .flex_md {margin: auto 0 0;}
.noti_wrp {text-align: center;}
.noti_wrp .ment {font-size: 2.4rem;font-weight: 100;}
.noti_wrp .subment {margin-top: 15px;font-size: 1.5rem;font-weight: 900;}

/* ==================================================
	푸시 알림
================================================== */
.push_alarm .duration {padding: 10px 15px 0;text-align: right;}
.push_alarm .duration select {border: 0;font-size: 1rem;font-weight: 700;}
.push_alarm .my_notice_list {border-top: 1px solid #EDEDED;}
.push_alarm .my_notice_list .itm .list .time {float: right;line-height: 20px;}
.push_alarm .my_notice_list .itm .list .icon-notice {box-shadow: 0 3px 6px rgba(0, 0, 0, .16);}
.push_alarm .my_notice_list .itm .list li p:first-of-type:after {clear: both;display: block;content: "";}

/* ==================================================
	결제 내역
================================================== */
.payment_history .total {padding: 50px 15px 0;}
.payment_history .total strong {font-weight: 900;}
.payment_history .total .tit {font-size: 1.5rem;font-weight: 100;}
.payment_history .total .tot_pay {font-size: 1.8rem;}
.payment_history .total .tot_pay strong {font-size: 2.9rem;}
.payment_history .history .duration {padding: 0 15px;text-align: right;}
.payment_history .history .duration select {border: 0;font-size: 1.2rem;font-weight: 700;}
.payment_history .history .list {padding: 20px 15px 0;border-top: 1px solid #E5E5E5;}
.payment_history .history .list .itm {position: relative;margin: 20px 0;padding-left: 60px;padding-right: 15px;padding-bottom: 5px;border-bottom: 1px solid #E5E5E5;}
.payment_history .history .list .itm .date {position: absolute;top: 0;left: 0;text-align: center;}
.payment_history .history .list .itm .date span {display: block;font-size: 1rem;font-weight: 900;letter-spacing: 3px;}
.payment_history .history .list .itm .date strong {display: block;font-size: 3rem;font-weight: 900;line-height: 1;}
.payment_history .history .list .itm .rows {margin: 10px 0;}
.payment_history .history .list .itm .rows:after {clear: both;display: block;content: "";}
.payment_history .history .list .itm .rows strong {font-weight: 900;}
.payment_history .history .list .itm .rows .tit {float: left;}
.payment_history .history .list .itm .rows .tit strong {font-size: 1.5rem;}
.payment_history .history .list .itm .rows .con {float: right;}
.payment_history .history .list .itm .rows p.con strong {vertical-align: top;}
.payment_history .history .list .itm .rows p.con .tag {vertical-align: top;margin-top: -1px;}
.payment_history .history .list .itm .rows .tag {display: inline-block;width: 60px;height: 17px;margin-left: 5px;border-radius: 4px;background: #4FCDE0;color: #fff;font-size: 1rem;font-weight: 900;line-height: 17px;text-align: center;}
.payment_history .history .list .itm .rows .tag.cancel {background: #FF4B4B;}
.payment_history .history .list .itm .rows .price {color: #FF4B4B;}

/* ==================================================
	환경 설정
================================================== */

.btn-toggle-wrap { padding: 0 15px; }
.btn-toggle-wrap .clear:after { content: ""; display: block; clear: both; }
.btn-toggle-wrap .title { float: left; font-size: 20px; font-weight: bold; line-height: 44px; }
.btn-toggle-wrap .btn-toggle { float: right; position: relative; width: 50px; height: 24px; border: 1px solid #C4C4C4; border-radius: 50px; margin-top: 10px; }
.btn-toggle-wrap .btn-toggle .circle { width: 22px; height: 22px; border-radius: 50%; background-color: #C4C4C4; position: absolute; top: 1px; left: 1px; }
.btn-toggle-wrap .description { font-size: 10px; text-align: left; color: #858585; }
.btn-toggle-wrap .btn-toggle.active { background-color: #4FCDE0; border-color: #4FCDE0; }
.btn-toggle-wrap .btn-toggle.active .circle { left: auto; right: 1px; background-color: #fff; }

/* ==================================================
	회원 프로필 사진 확대
================================================== */
.lyr-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.7); z-index: 1000; display: none; }
.lyr-popup .content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 75%; background-color: #fff; }
.lyr-popup .content .pf-img { width: 100%; vertical-align: top; }
.lyr-popup .btn-close { position: absolute; top: -15px; right: -15px; }
.lyr-popup .icon-btn-close { display: inline-block; width: 30px; height: 30px; background: url(../img/icon/icon_btn_close_blk.png) no-repeat center; background-size: cover; }

/* ==================================================
	tutorial
================================================== */

.tutorial { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 100; background-color: rgba(0, 0, 0, 0.5); }
.tutorial .slider { position: absolute; top: 50%; left: 0; width: 100%; transform: translate(0, -50%) }
.tutorial .slider .con { display: inline-block; width: 290px; height: 500px; background-color: #fff; padding: 14px; box-sizing: border-box; }
.tutorial .con .top .status { float: left; }
.tutorial .con .top .btn-skip { float: right; font-weight: 900; }
.tutorial .con .title { font-size: 1.5rem; margin: 38px 0 0; font-weight: 900;}
.tutorial .con .desc { line-height: 18px; }
.tutorial .con .img-wrap { text-align: center; }
.tutorial .con .img-wrap img { display: inline-block; }

.tutorial.main .inner { padding: 0 10px; box-sizing: border-box; }
.tutorial .txt-intro { text-align: left; font-size: 23px; line-height: 1.6;}
.tutorial .txt-intro strong { font-weight: 900; }
.tutorial .txt-intro .point { color: #4FCDE0; }
.tutorial .links { text-align: left; }
.tutorial .links a { font-weight: 900; }
.tutorial .btm-logo { width: 140px; position: absolute; bottom: 16px; left: 50%; transform: translate(-50%, 0);}

.date-top { text-align: center; margin-top: 50px;}
.date-top .inner { display: inline-block; }
.date-top .btn-arrow-left { display: inline-block; width: 25px; height: 25px; background: url(../img/icon/icon_arrow_right.png) no-repeat 50%; background-size: 14px; vertical-align: middle; transform: rotate(180deg);}
.date-top .btn-arrow-right { display: inline-block; width: 25px; height: 25px; background: url(../img/icon/icon_arrow_right.png) no-repeat 50%; background-size: 14px; vertical-align: middle;}
.date-top .date { display: inline-block; font-size: 1.8rem; text-align: center; width: 130px; font-weight: 900; vertical-align: middle;}

.report_sales .total-sales .top { text-align: right; padding: 0 16px; margin: 35px 0 20px; }
.report_sales .total-sales .top span { font-size: 1.5rem; }
.report_sales .total-sales .top strong { font-size: 2.4rem; margin-left: 17px;}

.report_sales .card-payment { padding: 0 11px; }
.report_sales .card-payment li { width: 50%; float: left; padding: 0 5px;box-sizing: border-box; margin-bottom: 13px; }
.report_sales .card-payment li .box { padding: 13px 0; background-color: #F1F3F9; text-align: center; border-radius: 4px; }
.report_sales .card-payment li .label { font-size: 1.2rem; font-weight: bold; margin-bottom: 5px; color: #C4C4C4; }
.report_sales .card-payment li .price { font-size: 1.5rem; font-weight: bold; color: #C4C4C4; }
.report_sales .card-payment li.active .box { background-color: #51CDE0; }
.report_sales .card-payment li.active .box .label,
.report_sales .card-payment li.active .box .price { color: #fff; }

.payment_history .history.type02 .list { padding-top: 0; border-bottom: 1px solid #e5e5e5; }
.payment_history .history.type02 .list h1 {font-size: 20px;text-align: center;padding: 13px;}
.payment_history .history.type02 .list .itm { margin: 0; padding-bottom: 0; padding-left: 60px; border-bottom: none;min-height: 65px;}
.payment_history .history.type02 .list .itm .date span { font-size: 1.5rem;}
.payment_history .history.type02 .list .itm .rows .tit strong { font-size: 1.2rem; }
.payment_history .history.type02 .list .itm .rows .price.blue { color: #51CDE0; }
.payment_history .history.type02 .list .itm .date { top: 20px; }
.payment_history .history.type02 .list .itm .info { padding-bottom: 40px;}
.payment_history .history.type02 .list .itm .info:last-child { padding-bottom: 20px; }
.payment_history .history.type02 .info-list { padding-top: 20px; padding-left: 20px; border-left: 1px solid #eee; }
.payment_history .history.type02 .list .itm .rows { margin-top: 0; }

.status-graph { padding: 40px 16px 0; }
.status-graph .tit { font-size: 1.5rem; margin-bottom: 6px; }
.status-graph .con { margin-bottom: 60px; }
.status-graph .graph-wrap .row { position: relative; }
.status-graph .graph-wrap .label { position: absolute; top: 13px; left: 0; font-size: 1.2rem; color: #C4C4C4; }
.status-graph .graph-wrap .graph { padding-left: 40px; }
.status-graph .graph-wrap .graph .inner { padding: 10px 0; border-left: 1px solid #e5e5e5; }
.status-graph .graph-wrap .graph .bar-wrap { width: 75%;position: relative; }
.status-graph .graph-wrap .graph .bar { position: relative; width: 100%; height: 10px; background-color: #F0F0F0; border-radius: 0 10px 10px 0; }
.status-graph .graph-wrap .graph .bar .value { position: absolute; top: -2px; right: -48px; color: #797979; }
.status-graph .graph-wrap .row.dark .label { color: #000; }
.status-graph .graph-wrap .row.dark .graph .bar { background-color: #000; }
.status-graph .graph-wrap .row.dark .graph .bar .value { font-size: 1.8rem; font-weight: bold; top: -6px; right: -63px;}
.status-graph .graph-wrap .row.dark .graph .bar .value.blue { color: #51CDE0; }
.status-graph .graph-wrap .row.dark .graph .bar .value.red { color: #FC4A4A; }
.status-graph .graph-wrap .row.dark .graph .bar .comment { position: absolute; top: 16px; left: 10px; font-size: 1.2rem; width: 200px; }

.report_member .expire-info { padding: 0 15px; }
.report_member .expire-info .row { position: relative; margin-bottom: 40px; }
.report_member .expire-info .row span { float: left; font-size: 1.5rem; margin-top: 3px; }
.report_member .expire-info .row strong { float: right; font-size: 1.8rem; }
.report_member .expire-info .row .comment { font-size: 1.2rem; color: #C4C4C4; position: absolute; top: 30px; left: 0; }

.off-day { padding: 0 15px; }
.off-day .input-wrap { padding-top: 30px; }
.off-day .input-wrap .label { display: block; font-size: 1.2rem; color: #C4C4C4; }
.off-day .input-wrap .option-box label { font-size: 1.8rem;}
.off-day .input-wrap input { width: 100%; font-size: 1.8rem; padding-left: 0; }
.off-day .input-wrap input::placeholder { font-size: 1.8rem;}
.off-day .input-wrap .select-time { border-bottom: 1px solid #ededed; }
.off-day .input-wrap .select-time select { border-bottom: 0; }
.off-day .input-wrap .select-time span { display: inline-block; font-weight: bold; margin-left: 10px;}

.lyr-holiday-management { padding: 6px 14px; border-radius: 8px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); position: absolute;background-color: #fff; z-index: 10;max-height: 10rem;overflow: scroll;}
.lyr-holiday-management .icon-btn-close { width: 8px; height: 8px; background: url(../img/icon/icon_btn_close.png) no-repeat center;}
.lyr-holiday-management .row { min-width: 170px; padding: 7px 0;}
.lyr-holiday-management span { vertical-align: middle; font-size: 1rem; }
.lyr-holiday-management label { vertical-align: middle; font-size: 1rem; display: inline-block; width: 82px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.lyr-holiday-management button { vertical-align: middle; margin-left: 10px; }
.lyr-holiday-management .color-tag { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background-color: red; margin-right: 5px; }
.lyr-holiday-management .color-tag.black { background-color: #2d2d2d;}
.lyr-holiday-management .color-tag.green { background-color: #4EAF3D;}
.lyr-holiday-management .color-tag.red { background-color: #FC4A4A;}

.policy-wrap .inner-wrap { padding: 0 15px;}
.policy-wrap .caption { font-size: 1.2rem; font-weight: 900; }
.policy-wrap textarea { width: 100%; font-size: 1.2rem; line-height: 1.8rem; color: #858585; text-align: left; }

.check-with-text label { font-size: 1.4rem; line-height: 1.4; }
.privacy-policy-detail { padding: 0 15px; }
.privacy-policy-detail p { line-height: 1.5;}
