@charset "utf-8";
@font-face { font-family: 'S-CoreDream-4Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff'); font-weight: normal; font-style: normal; } 
@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,700,300);

h1,h2,h3,h4,h5,h6,p,a,span,input,button,ul,li,b,label,div{font-family: 'S-CoreDream-4Regular' !important;}
input::placeholder{font-family:'S-CoreDream-4Regular' !important;}
button:focus,
button:active{box-shadow: unset !important;}
.fa{font: normal normal normal 14px / 1 FontAwesome !important;}
.fit_pop{position: fixed; width: 100%; height: 100%; z-index: 99999; backdrop-filter: blur(2px); background: rgba(0, 0, 0, 0.5);top: 0;left: 0;}
p.pager{display: flex; justify-content: center; align-items: center; margin: 20px 0 0;}
p.pager a{width: 30px; height: 30px; text-align: center; line-height: 30px; background: #f0f0f0; border-radius: 5px; margin: 0 3px; color: #000 !important;display:block;}
p.pager a.atv{color: #fff !important;}
p.pager a i{}
/* head 시작 */
#nt_menu{background:#fff;z-index:1030 !important;}
#nt_menu .nt-container .d-flex{height: 60px;align-items: center;}
#nt_menu .nt-container .d-flex .me-list{height: 100%;}
#nt_menu .nt-container .d-flex .me-list .logo_wrap{width: fit-content; padding: 15px 20px; height: 100%;cursor: pointer;}
#nt_menu .nt-container .d-flex .me-list .logo_wrap #logo_img{height: 85%;}
#nt_menu .nt-container .d-flex .scan_wrap{cursor: pointer;}
#nt_menu .nt-container .d-flex .me-icon i{font-size: 25px !important; line-height: 30px !important;}
#nt_menu .me-li.on .me-a, #nt_menu .me-li:hover .me-a{background: unset !important;}
#google_fit_pop{}
#google_fit_pop>.wrap{width: calc(100% - 40px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; max-width: 600px; height: calc(100% - 100px); border-radius: 10px; padding: 20px 0;}
#google_fit_pop>.wrap #google_fit_content{}
#google_fit_content{width: calc(100% - 40px);max-width: 1200px;margin: 0 auto;}
#google_fit_content .title{text-align: center; margin-bottom: 20px; font-size: 15px; font-weight: bold; line-height: 21px;word-break:keep-all;}
#google_fit_content .content{}
#google_fit_content .content>b{}
#google_fit_content .content>div{}
#google_fit_content .content>div p{}
#google_fit_content .content>div.img_wrap{}
#google_fit_content .content>div.img_wrap img{}
#google_fit_content .content>p{}
#google_fit_content .content>button{}
#google_fit_content .content>span{}
/* head 끝 */
/* tail 시작 */
#nt_footer{position: fixed; width: 100%; left: 0; bottom: 0;background:#fff;z-index:1030; border-top: 1px solid #eee;}
#nt_footer>div{}
#nt_footer>div>ul{display: flex;justify-content: space-between;align-items: center;}
#nt_footer>div>ul li{width: 25%;text-align: center;height: 50px;padding: 10px;line-height: 30px;cursor: pointer;}
#nt_footer>div>ul li p{}
#nt_footer>div>ul li p i{font-size: 20px !important;}
#nt_footer>div>ul li p img{height: 25px; margin-bottom: 4px;}
.sns_modal_bg{ display: none; width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: fixed; top:0; left:0; z-index: 999999; padding-bottom: 100px; }
.sns_modal_bg .modal{width:calc(100% - 40px);background: #fff;padding: 100px 20px 50px 20px;border-radius: 20px;position: relative;top: 25%;margin: 0 auto;max-width: 500px;height: auto;text-align: center;display: block;}
.sns_modal_bg .modal .sns_main_img{ position: fixed; width: 170px; transform: translate(-50%, -50%); top: 22%; left: 50%; }
.sns_modal_bg .modal h2{ text-align: center; font-size: 18px; font-weight: 900; margin-top: 20px; margin-bottom: 30px; }
.sns_modal_bg .modal p{ text-align: center; font-size: 15px; font-weight: 700; color: #999; line-height: 1.5; word-break:keep-all;}
.sns_modal_bg .modal ul{ margin-top: 50px !important; }
.sns_modal_bg .modal ul li{ width: 24%;height: fit-content;}
.sns_modal_bg .modal ul li a img{ width: 70%; margin: 0 auto;height: auto; }
.sns_modal_bg .modal ul li p{ font-size: 13px; margin-top: 5px; font-weight: 500; }
.sns_modal_bg .modal .sns_modal_close{display: block; width: 100%; height: 40px; line-height: 40px;text-align: center;cursor: pointer;color: #777;font-size: 13px;font-weight: 900;margin-top: 50px;}
@media (max-width:600px){
    #nt_footer{display: none;}
}
/* tail 끝 */
/* 메인 시작 */
#index{}
#index .visual{width: 100%;padding: 40px 0 13px;position: relative;top: 0;left: 0;z-index: 1;overflow: hidden;}
#index .visual .rolling_wrap {position: absolute;width: 200%;height: 100%; top:0;left: 0;z-index: -1; display: flex; overflow: hidden;}
#index .visual .rolling_wrap .rolling-list{width: 100%;height: 100%;}
#index .visual .rolling_wrap .rolling-list ul { display: flex;width: 100%;height: 100%;}
#index .visual .rolling_wrap .rolling-list ul li {width: 100%;height: 100%;background-image: url(/img/visual_1.svg); background-repeat: repeat-y; background-position: center; background-size: 100%; opacity: 0.2; }
#index .visual .rolling_wrap .rolling-list.original {}
#index .visual .rolling_wrap .rolling-list.clone {}
@keyframes rollingleft1 {
0% { transform: translateX(0); }
50% { transform: translateX(-100%); }
50.01% { transform: translateX(100%); }
100% { transform: translateX(0); }
}
@keyframes rollingleft2 {
0% { transition: translateX(0); }
100% { transform: translateX(-200%); }
}

@property --rotate {
    syntax: "<angle>";
    initial-value: 132deg;
    inherits: false;
}
:root {
    --icon-height: 70px;
    --icon-width: calc(var(--icon-height) / 1.5);
}
#index .visual .one{}
#index .visual .one .work_icon { background: #fff; width: 70px; height: 70px; margin: 0px auto 40px; border-radius: 50%;position: relative;top: 0 ;left: 0;background-image: linear-gradient(#fff, #fff),  linear-gradient(145deg, #01BC96 10%, #298CD0 30%, #FFC42E 70%, #FF3FA7 100%); background-origin: border-box; background-clip: content-box, border-box;border: 3px solid transparent;cursor: pointer;}
#index .visual .one .work_icon.atv{border: none;}
#index .visual .one .work_icon.atv::before { content: ""; width: 100%; height: 100%; border-radius: 50px; background-image: linear-gradient( var(--rotate) , #01BC96 10%, #298CD0 30%, #FFC42E 70%, #FF3FA7 100%); position: absolute; z-index: 2; top: 0; left: 0; animation: spin 2.5s linear infinite; }
#index .visual .one .work_icon.atv::after {border-radius: 50px;  position: absolute; top: 0; content: ""; left: 0; right: 0; z-index: 1; height: 100%; width: 100%; margin: 0 auto; filter: blur(calc(var(--icon-height) / 6)); background-image: linear-gradient( var(--rotate) , #01BC96 10%, #298CD0 30%, #FFC42E 70%, #FF3FA7 100%); opacity: 1; transition: opacity .5s; animation: spin 2.5s linear infinite;}
@keyframes spin {0% {  --rotate: 0deg;}100% {  --rotate: 360deg;}}
#index .visual .one .work_icon img{display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 90%; width: 90%; z-index: 3; background: #fff; border-radius: 50px; padding: 10px;}
#index .visual .one .point{position: relative; top: 0; left: 0; width: fit-content; margin: 0 auto; text-align: center; font-size: 13px; color: #fff;}
#index .visual .one .point b{width: fit-content; margin: 0 auto; background: #fff; color: #000; font-size: 15px; border-radius: 30px; padding: 0 10px; min-width: 100px; text-align: center; line-height: 30px;display: block;}
#index .visual .one .point .tool_tip{position: absolute; top: 25px; right: -13px; width: 25px; height: 25px; background: #ffab02;font-weight:bold; border-radius: 20px; color: #fff; font-size: 13px; line-height: 25px;cursor: pointer;}
#index .visual .one .point .tool_content{display: none; position: absolute; width: 300px; left: 50%;top: 63px; transform: translateX(-50%); line-height: 16px; color: #ffffff; box-shadow: 2px 2px 2px #0000002e; word-break: keep-all; background: #ffab02; padding: 20px; border-radius: 20px; z-index: 9;font-weight: bold;}
#index .visual .one .point .tool_content::after{content: ""; position: absolute; top: -19px; right: 30%; transform: translateX(-50%); width: 0; height: 0; border-bottom: 10px solid #ffab02; border-top: 10px solid transparent; border-left: 5px solid transparent; border-right: 5px solid transparent;}
#index .visual .one .point .tool_content.atv{display: block;}
#index .visual .one .point .tool_tipx{position: absolute; top: 25px; right: -13px; width: 25px; height: 25px; background: #ffab02;font-weight:bold; border-radius: 20px; color: #fff; font-size: 13px; line-height: 25px;cursor: pointer;}
#index .visual .one .point .tool_contentx{display: none; position: absolute; width: 300px; left: 50%;top: 63px; transform: translateX(-50%); line-height: 16px; color: #ffffff; box-shadow: 2px 2px 2px #0000002e; word-break: keep-all; background: #ffab02; padding: 20px; border-radius: 20px; z-index: 9;font-weight: bold;}
#index .visual .one .point .tool_contentx::after{content: ""; position: absolute; top: -19px; right: 30%; transform: translateX(-50%); width: 0; height: 0; border-bottom: 10px solid #ffab02; border-top: 10px solid transparent; border-left: 5px solid transparent; border-right: 5px solid transparent;}
#index .visual .one .point .tool_contentx.atv{display: block;}
#index .visual .two{padding: 50px 0;}
#index .visual .two .now_work{color: #fff;width: fit-content;margin: 0 auto;align-items: baseline;cursor: pointer;}
#index .visual .two .now_work>b{font-size: 40px;line-height: 40px;}
#index .visual .two .now_work>span{font-size: 13px;padding-left: 5px;}
#index .visual .two ul{justify-content: center; align-items: center;}
#index .visual .two ul li{color: #fff;align-items: center;cursor: pointer;}
#index .visual .two ul li:first-child{margin-right: 20px;}
#index .visual .two ul li img{height: 20px;width: 20px;filter: brightness(0) invert(1);}
#index .visual .two ul li b{font-size: 17px; padding: 0 5px;}
#index .visual .two ul li span{font-size: 15px;}
#index .visual .three{width: calc(100% - 40px);max-width:300px; margin: 0 auto;}
#index .visual .three #now_work_comment{background: #fff; width: 100%; padding: 10px 20px; border-radius: 100px; margin: 0 auto 20px;position: relative;top: 0;left: 0;cursor: pointer;min-height: 92px;flex-flow: column; justify-content: center; align-items: center;}
#index .visual .three #now_work_comment>p{display: block; width: calc(100% - 60px);word-break: keep-all;text-align: center; font-size: 13px; line-height: 18px;}
#index .visual .three #now_work_comment>span{display: block; width: calc(100% - 60px);word-break: keep-all;text-align: center; font-size: 13px; line-height: 18px; margin-top: 10px; color: #777;}
#index .visual .three #now_work_comment::after{content: ""; position: absolute; bottom: -29px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-bottom: 15px solid transparent; border-top: 15px solid #fff; border-left: 5px solid transparent; border-right: 5px solid transparent;}
#index .visual .three .now_work_graph { width: 100%; height: auto; background: lightgray; border-top-left-radius: 300px; border-top-right-radius: 300px; position: relative; overflow: hidden; z-index: 0; display: inline-block; aspect-ratio: auto 1 / 0.5;border: 10px solid #fff;border-bottom: none;}
#index .visual .three .now_work_graph::before { content: ''; width: calc(100% - 40px); height: auto; aspect-ratio: auto 1 / 0.5; background: #fff; border-top-left-radius: 300px; border-top-right-radius: 300px; position: absolute; top: 20px; left: 20px; }
#index .visual .three .now_work_graph .now_work_graph_bar{ font-size: 0; width: 100%; height: 100%; background: linear-gradient(279deg, #01BC96 10%, #298CD0 30%, #FFC42E 70%, #FF3FA7 100%); position: absolute; z-index: -1; top: 140px; transform-origin: top; transform: rotate(calc(var(--percent)* 1.8deg)); } /* top: 전체 크기의 절반 */
#index .visual .three .now_work_graph .now_work_graph_bar::after{content: ""; position: absolute; top: -10px; left: 0px; width: 20px; height: 20px; background: #48cfad; border: 5px solid #fff; border-radius: 50px;}
#index .visual .three .now_work_graph .now_work_graph_label {width: 100%; position: absolute; text-align: center; top: 54%; transform: translateY(-50%); font-weight: bold; font-size: 25px;}
#index .visual .three .now_work_graph .goal_comment{position: absolute; bottom: 13px; left: 50%; transform: translate(-50%, -50%); font-size: 13px; color: #777;}
#index .floating{position: relative;top: 0;left: 0;width: 100%;height: fit-content;background-color: #fff;z-index: 500; -webkit-transform:translate3d(0,0,0);}
#index .floating::after{content:"";position: absolute;top: -20px;background: #fff;width: 100%;height: 40px;box-shadow: 0px -3px 3px -2px rgba(50, 60, 70, 0.15); -webkit-box-shadow: 0px -3px 3px -2px rgba(50, 60, 70, 0.15); -moz-box-shadow: 0px -3px 3px -2px rgba(50, 60, 70, 0.15); border-radius: 20px 20px 0 0;z-index: -1;}
#index .floating .information{position: absolute; top: -70px; right: 10px; width: fit-content; font-size: 13px; color: #ffffff; background: #00000047; height: 40px; line-height: 40px; padding: 0 10px; border-radius: 50px;cursor: pointer;}
#index .floating .title{width: calc(100% - 40px);max-width: 1200px;margin: 0 auto 30px;justify-content: space-between;align-items: center;}
#index .floating .title .left{}
#index .floating .title .left b{font-size: 17px;}
#index .floating .title .left p{font-size: 13px;color: #777;}
#index .floating .title .right{height: 50px; width: 50px; text-align: right; line-height: 50px;}
#index .floating .title .right i{font-size: 20px !important; color: #777;}
#index .floating .history_slide{width: calc(100% - 40px);max-width: 1200px;}
#index .floating .history_slide .swiper-wrapper{}
#index .floating .history_slide .swiper-wrapper .swiper-slide{}
#index .floating .history_slide .swiper-wrapper .swiper-slide .graph{width: 100%; max-width: 100px; margin: 0 auto 10px; height: auto; aspect-ratio: auto 1 / 1; text-align: center; border-radius: 100px; color: #fff;}
#index .floating .history_slide .swiper-wrapper .swiper-slide .graph .pie-chart { position: relative; }
#index .floating .history_slide .swiper-wrapper .swiper-slide .graph .pie-chart_canvas { height: 100%; right: 0; position: absolute; transform: rotateY(-180deg); top: 0; width: 100%; }
#index .floating .history_slide .swiper-wrapper .swiper-slide .graph .pie-chart_percentage {font-size: 16px; font-weight:bold; left: 50%;position: absolute;top: 50%;transform: translateX(-50%) translateY(-50%); text-shadow: 0px 0px 10px #ffffff; z-index: 2;}
#index .floating .history_slide .swiper-wrapper .swiper-slide>p{font-size: 13px; text-align: center;}
#index .floating .history_slide .swiper-wrapper .no_data{display: block; width: 100%; line-height: 100px; text-align: center; font-size: 15px; color: #777;}
.welcome_pop{ display: none; width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: fixed; top:0; left:0; z-index: 9999; padding-bottom: 100px; }
.welcome_pop .modal{width:calc(100% - 40px);background: #fff;padding: 50px 20px 20px 20px;border-radius: 20px;position: relative;top: 20%;margin: 0 auto;max-width: 500px;height: auto;text-align: center;display: block;}
.welcome_pop .modal .welcome_main_img{ position: fixed; width: 170px; transform: translate(-50%, -50%); top: 13%; left: 50%; }
.welcome_pop .modal .welcome_Swiper{padding-bottom: 25px;}
.welcome_pop .modal .welcome_Swiper .swiper-wrapper{}
.welcome_pop .modal .welcome_Swiper .swiper-wrapper .swiper-slide{}
.welcome_pop .modal .welcome_Swiper .swiper-wrapper .swiper-slide img{display: block;width: 100%;max-width: 400px; margin: 0 auto;border-radius: 10px;}
.welcome_pop .modal .welcome_Swiper .swiper-wrapper .swiper-slide p{position: absolute; top: 74%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 50px; line-height: 48px; font-size: 15px; padding: 0; color: #48cfad !important; border-radius: 50px;}
.welcome_pop .modal .welcome_Swiper .swiper-horizontal>.swiper-pagination-bullets,
.welcome_pop .modal .welcome_Swiper .swiper-pagination-bullets.swiper-pagination-horizontal,
.welcome_pop .modal .welcome_Swiper .swiper-pagination-custom,
.welcome_pop .modal .welcome_Swiper .swiper-pagination-fraction{top: unset;bottom: -6px;}
.welcome_pop .modal .welcome_Swiper .swiper-pagination-bullet-active{background: #48cfad;}
.welcome_pop .modal .welcome_modal_close{display: block; width: 100%; height: 40px; line-height: 40px;text-align: center;cursor: pointer;color: #777;font-size: 13px;font-weight: 900;margin-top: 20px;}
.two_pop{ display: none; width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: fixed; top:0; left:0; z-index: 999999; padding-bottom: 100px; }
.two_pop .wrap{width:calc(100% - 40px);background: #fff;padding: 30px 20px;border-radius: 20px;position: relative;top: 15%;margin: 0 auto;max-width: 500px;height: auto;display: block;}
.two_pop .wrap .two_pop_close{position: absolute; top: 0; right: 0; height: 50px; width: 50px; text-align: center; line-height: 60px; cursor: pointer;}
.two_pop .wrap .two_pop_close i{font-size: 25px !important;}
.two_pop .wrap>b{font-size: 18px; font-weight: 900; margin-top: 20px; margin-bottom: 30px;}
.two_pop .wrap>p{font-size: 15px; font-weight: 700; color: #999; line-height: 1.5; word-break: keep-all;}
.two_pop .wrap>ul{}
.two_pop .wrap>ul li{padding: 40px 0 30px;border-bottom:1px solid #ddd;}
.two_pop .wrap>ul li:last-child{border-bottom:none;padding-bottom: 0}
.two_pop .wrap>ul li>div{justify-content: center; align-items: center;}
.two_pop .wrap>ul li>div img{ height: 50px; margin-right: 10px;}
.two_pop .wrap>ul li>div b{font-size: 40px; line-height: 40px;}
.two_pop .wrap>ul li>div span{font-size: 15px;font-weight:bold;}
.two_pop .wrap>ul li>p{text-align: center; color: #777; margin: 20px 0;word-break:keep-all;}
.two_pop .wrap>ul li>p b{font-size: 15px;color: #000;}
.history_pop{ display: none; width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: fixed; top:0; left:0; z-index: 999999; padding-bottom: 100px; }
.history_pop .wrap{width:calc(100% - 40px);background: #fff;padding: 30px 20px;border-radius: 20px;position: relative;top: 15%;margin: 0 auto;max-width: 500px;height: auto;display: block;}
.history_pop .wrap .history_pop_close{position: absolute; top: 0; right: 0; height: 50px; width: 50px; text-align: center; line-height: 60px; cursor: pointer;}
.history_pop .wrap .history_pop_close i{font-size: 25px !important;}
.history_pop .wrap>b{font-size: 18px; font-weight: 900; margin-top: 20px; margin-bottom: 30px;}
.history_pop .wrap>p{font-size: 15px; font-weight: 700; color: #999; line-height: 1.5; word-break: keep-all;}
.history_pop .wrap>ul{margin-top: 30px;}
.history_pop .wrap>ul li{justify-content: space-between; align-items: center; margin-bottom: 10px;}
.history_pop .wrap>ul li p{font-size: 13px; color: #777;}
.history_pop .wrap>ul li span{font-size: 13px;}
@media screen and (max-width:410px){
    .two_pop .wrap>ul li>p b{display: block; line-height: 18px;}
}
/* 메인 끝 */

/* 구글핏 연동하기 시작 */
#google_fit{width: calc(100% - 40px);margin: 50px auto 0;}
#google_fit .title{font-size: 17px; color: #333;margin-bottom: 50px;line-height: 25px; word-break: keep-all;text-align: center;}
/* #google_fit .content{margin: 20px auto;border: 1px solid #dee2e6;padding: 30px 20px;border-radius: 20px;} */
/* #google_fit .content>b:first-child{border: none;} */
#google_fit .content>b{display: block;width: 100%;text-align: center;font-size: 15px;padding-top: 50px;border-top: 1px dashed #dee2e6; margin: 50px 0 20px;}
#google_fit .content>div{}
#google_fit .content>div p{font-size: 13px;color: #777;line-height: 1.5;margin-bottom: 15px;word-break: keep-all;}
#google_fit .content>img.google_fit{display: block; margin: 50px auto 20px;width: 100%; max-width: 600px;}
#google_fit .content>img.heart{display: block; margin: 0 auto;width: 50px;}
#google_fit .content>p{font-size: 13px;color: #777;line-height: 1.5;margin-bottom: 10px;word-break: keep-all;text-align: center;}
#google_fit .content>button{border: none; padding: 0 40px; background: #fff; display: block; margin: 0 auto; width: 100%; max-width: 300px;}
#google_fit .content>button img{width: 100%;}
/* 구글핏 연동하기 끝 */

/* google_privacy시작 */
#google_privacy{width: calc(100% - 40px); margin: 0 auto; max-width: 1200px;padding: 20px 0;}
#google_privacy>.title{font-size: 15px; font-weight: bold; text-align: center; word-break: keep-all; height: 50px; line-height: 20px;}
#google_privacy>span{text-align: right; display: block; width: 100%; padding-bottom: 10px; border-bottom: 1px solid #dee2e6; font-size: 13px; color: #777;}
#google_privacy ul{}
#google_privacy ul>li{margin-top: 30px;}
#google_privacy ul>li b{font-size: 13px;}
#google_privacy ul>li p{font-size: 13px;word-break:keep-all;}
#google_privacy ul>li>ol{}
#google_privacy ul>li>ol>li{word-break:keep-all;font-size: 13px;color: #777;}
#google_privacy>p{margin-top: 30px;text-align: center;display: block;width: 100%;word-break:keep-all;font-size: 13px;}
#google_privacy>p a{color: red;text-decoration: underline;}
/* google_privacy끝 */

/* provision시작 */
#provision{width: calc(100% - 40px); margin: 0 auto; max-width: 1200px;}
#provision>.title{font-size: 15px; font-weight: bold; text-align: center; word-break: keep-all;}
#provision>span{text-align: right; display: block; width: 100%; margin-top: 20px; padding-bottom: 10px; border-bottom: 1px solid #dee2e6; font-size: 13px; color: #777;}
#provision ul{}
#provision ul>li:first-child{margin-top: 0px;}
#provision ul>li{margin-top: 30px;}
#provision ul>li b{font-size: 13px;}
#provision ul>li p{font-size: 13px;word-break:keep-all;}
#provision ul>li>ol{}
#provision ul>li>ol>li{word-break:keep-all;font-size: 13px;color: #777;}
#provision>p{margin-top: 30px;text-align: center;display: block;width: 100%;word-break:keep-all;font-size: 13px;}
#provision>p a{color: red;text-decoration: underline;}
/* provision끝 */

/* 걸음기록 시작 */
#step_record_list{}
#step_record_list>.wrap{}
#step_record_list .wrap .title{padding: 50px 20px;}
#step_record_list .wrap .title p{font-size: 15px; color: #333;text-align: center;}
#step_record_list .wrap .title p span{font-size: 17px;font-weight: bold;}
#step_record_list>.wrap .list{padding: 0 20px;}
#step_record_list>.wrap .list li.no_data{text-align: center;font-size: 13px;color: #777;}
#step_record_list>.wrap .list li{border-top: 1px dashed #dee2e6; padding: 20px 10px; margin: 0px 0;}
#step_record_list>.wrap .list li:last-child{border-bottom:1px dashed #dee2e6;}
#step_record_list>.wrap .list li div{justify-content: space-between;align-items: center;margin-bottom: 10px;}
#step_record_list>.wrap .list li div:last-child{margin-bottom: 0px;}
#step_record_list>.wrap .list li div p{font-size: 13px;color: #777;}
#step_record_list>.wrap .list li div span{font-size: 13px;}
#step_record_list>.wrap .list li.atv{position: relative; top: 0; left: 0;background: #48cfad17;}
#step_record_list>.wrap .list li.atv img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 80%; opacity: 0.1;}
/* 걸음기록 끝 */

/* 룰렛티켓 내역 시작 */
#ticket_history{}
#ticket_history>.wrap{}
#ticket_history .wrap .title{padding: 50px 20px;}
#ticket_history .wrap .title p{font-size: 15px; color: #777;text-align: center;}
#ticket_history .wrap .title p span{font-size: 17px;font-weight: bold;color: #000;}
#ticket_history>.wrap .list{padding: 0 20px;}
#ticket_history>.wrap .list li.no_data{text-align: center;font-size: 13px;color: #777;}
#ticket_history>.wrap .list li{border-top: 1px dashed #dee2e6; padding: 20px 10px; margin: 0px 0;align-items: center;justify-content: space-between;}
#ticket_history>.wrap .list li:last-child{border-bottom:1px dashed #dee2e6;}
#ticket_history>.wrap .list li>div{}
#ticket_history>.wrap .list li>div img{display: block;height: 50px;width: 50px;}
#ticket_history>.wrap .list li>div .text{}
#ticket_history>.wrap .list li>div .text p{font-size: 13px;}
#ticket_history>.wrap .list li>div .text p span{font-weight: bold;font-size: 15px;color: red;}
#ticket_history>.wrap .list li>span{font-size: 12px; color: #777;}
/* 룰렛티켓 내역 끝 */

/* 포인트내역 시작 */
#token_list{}
#token_list>.wrap{}
#token_list .wrap .title{padding: 50px 20px;}
#token_list .wrap .title p{font-size: 15px; color: #777;text-align: center;}
#token_list .wrap .title p span{font-size: 17px;font-weight: bold;color: #000;}
#token_list>.wrap .list{padding: 0 20px;}
#token_list>.wrap .list li.no_data{text-align: center;font-size: 13px;color: #777;}
#token_list>.wrap .list li{border-top: 1px dashed #dee2e6; padding: 20px 10px; margin: 0px 0;}
#token_list>.wrap .list li:last-child{border-bottom:1px dashed #dee2e6;}
#token_list>.wrap .list li div{justify-content: space-between;align-items: center;}
#token_list>.wrap .list li div:last-child{margin-bottom: 0px;}
#token_list>.wrap .list li div.top{}
#token_list>.wrap .list li div.top p{font-size: 15px;}
#token_list>.wrap .list li div.top p.minus{color: red; font-weight: bold;}
#token_list>.wrap .list li div.top p.plus{color: #000; font-weight: bold;}
#token_list>.wrap .list li div.bt{}
#token_list>.wrap .list li div.bt p{font-size: 13px;color: #777;}
#token_list>.wrap .list li.atv{position: relative; top: 0; left: 0;background: #48cfad17;}
#token_list>.wrap .list li.atv img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 80%; opacity: 0.1;}
/* 포인트내역 끝 */

/* 캘린더 시작 */
#calendar-container{}
#calendar-container #calendar{height: 557px !important;}
#calendar-container #calendar a{text-decoration: unset;}
#calendar-container #calendar a.koHolidays{pointer-events: none;}
#calendar-container #calendar .fc-header-toolbar{margin: 20px 0; position: relative; top: 0; left: 0; width: 100%; height: 50px;z-index: 1;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk:nth-child(1){z-index: 2;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk:nth-child(2){z-index: 1;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk .fc-button-group{display: flex; justify-content: space-between; align-items: center;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk .fc-button-group button{color: #fff; background-color: unset; border-color: unset; width: 50px; height: 50px; display: block; flex: unset; border-radius: 3px; padding: 0; margin: 0; border: none;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk .fc-button-group button.fc-button-active{}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk .fc-button-group button span{color: #777 !important;font-size: 30px !important;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk .fc-button-group button:active span{color: #48cfad !important;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk>button{font-size: 13px;height: 40px;padding: .375rem .75rem;color: #fff; background-color: #6c757d; border-color: #6c757d;opacity: 1;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk>button:hover{color: #fff; background-color: #5a6268; border-color: #545b62;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk>div>button{font-size: 13px;height: 40px;padding: .375rem .75rem;}
#calendar-container #calendar .fc-header-toolbar div.fc-toolbar-chunk .fc-toolbar-title{font-size: 17px; font-weight: bold;text-align: center;}
#calendar-container #calendar .fc-view-harness{}
#calendar-container #calendar .fc-view-harness>div{}
#calendar-container #calendar .fc-view-harness>div>table{border: none;}
#calendar-container #calendar .fc-view-harness>div>table>thead{}
#calendar-container #calendar .fc-view-harness>div>table>thead table{}
#calendar-container #calendar .fc-view-harness>div>table>thead th{border: none;border-bottom: 1px solid #eee; padding-bottom: 15px;}
#calendar-container #calendar .fc-view-harness>div>table>thead th:first-child a{color: red;}
#calendar-container #calendar .fc-view-harness>div>table>thead th:last-child a{color: blue;}
#calendar-container #calendar .fc-view-harness>div>table>thead td{border: none;}
#calendar-container #calendar .fc-view-harness>div>table>thead th a{font-weight: normal;font-size: 15px;color: #777;cursor: context-menu;}
#calendar-container #calendar .fc-view-harness>div>table>tbody{}
#calendar-container #calendar .fc-view-harness>div>table>tbody td{border: none;}

#calendar-container #calendar .fc-view-harness>div>table>tbody .c-scroller-harness{height: fit-content !important;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .c-scroller-harness{height: fit-content !important;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scroller{height: fit-content !important;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table{height: fit-content !important;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr{display: flex; justify-content: space-between; align-items: center;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td{border: none; width: 14.285714%; height: 70px;cursor: pointer;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td:active a{color: #48cfad !important;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td.fc-day-today{background: unset;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div::before{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div::after{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-top{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 100%; aspect-ratio: auto 1 / 1;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-top a{pointer-events: none; padding: 0; font-size: 15px; color: #777; width: 100%; text-align: center; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events{position: absolute; height:90%; top: 50%; left: 50%; transform: translate(-50%, -50%); aspect-ratio: auto 1 / 1;margin: 0;z-index: -1;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events::before{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events::after{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div{padding: 0;width: 100%;height: 100%;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div.fc-daygrid-event-harness{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div.fc-daygrid-day-bottom{display: none;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div::before{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div::after{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div>a.koHolidays{display: none;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div>a{margin: 0; width: 100%; height: 100%; border-radius: 100px;    background: #48cfad17 !important; border: 1px solid #48cfad !important;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div>a .fc-event-main{display: none;}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div>a .fc-event-main .fc-event-main-frame{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div>a .fc-event-main .fc-event-main-frame .fc-event-title-container{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-events div>a .fc-event-main .fc-event-main-frame .fc-event-title-container .fc-event-title{}
#calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td>div>.fc-daygrid-day-bg{}
#eventModal{background: rgb(0 0 0 / 0%) !important; padding: 0 !important;}
#eventModal .modal-dialog{position: relative; top: 70px;width: calc(100% - 40px);max-width: 500px;margin: 0 auto; height: auto;background: #fff; padding: 0; border-radius: 20px; display: block;overflow: hidden;}
#eventModal .modal-dialog .modal-content{border: none !important;padding: 30px 20px; }
#eventModal .modal-dialog .modal-content .modal-header{padding: 0;border-bottom: none;} 
#eventModal .modal-dialog .modal-content .modal-header h5{font-size: 18px; font-weight: 900; margin-bottom: 30px; line-height: 25px; margin-top: 0;} 
#eventModal .modal-dialog .modal-content .modal-header button{position: absolute; top: 0; right: 0; height: 50px; width: 50px; text-align: center; line-height: 60px; cursor: pointer; border: none; background: url(); padding: 0;} 
#eventModal .modal-dialog .modal-content .modal-header button i{font-size: 25px !important;} 
#eventModal .modal-dialog .modal-content .modal-body{padding: 0;} 
#eventModal .modal-dialog .modal-content .modal-body form{max-height: calc(100vh - 350px); overflow: auto;} 
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap{justify-content: space-between; align-items: center;flex-flow: row wrap;margin-bottom: 50px;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>p{font-size: 15px;display: block;width: 100%;margin-bottom: 20px;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label{margin-bottom: 0;cursor: pointer;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label{width: 33.333333%;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label .icon,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label .icon{width: 50%; height: auto; aspect-ratio: auto 1 / 1; margin: 0 auto; border-radius: 50px; background: #efefef;position: relative;top: 0;left: 0;transition: 0.2s;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label .icon img,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label .icon img{width: 50%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);filter: brightness(0.8);transition: 0.2s;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label input,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label input[type="checkbox"]{position: absolute; top: 0; left: 0; z-index: -1; opacity: 0;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label span,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label span{color: #999;font-size: 13px;display: block;width: 100%;text-align: center;margin-top: 10px;transition: 0.2s;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label.atv,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label.atv{}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label.atv .icon img,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label.atv .icon img{filter: unset;}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label.atv input,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label.atv input[type="checkbox"]{}
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.meals_label.atv span,
#eventModal .modal-dialog .modal-content .modal-body form .check_wrap>label.snack_label.atv span{color: #000;font-weight: bold;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap{justify-content: space-between; align-items: center;flex-flow: row wrap;margin-bottom: 50px;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>p{font-size: 15px;display: block;width: 100%;margin-bottom: 20px;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div{width: 33.333333%;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.pm{}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.pm div{width: 50%; height: auto; aspect-ratio: auto 1 / 1; margin: 0 auto; border-radius: 50px;padding: 0;margin: 0 auto;position: relative;top: 0;left: 0;display: block;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.pm div i{font-size: 20px !important;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.text{}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.text img{display: block;width: 40%; margin: 0 auto;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.text>span{font-size: 13px; font-weight: bold; display: block; text-align: center;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.text p{color: #000; font-size: 13px; display: block; width: 100%; text-align: center; margin-top: 10px; transition: 0.2s;font-weight: bold;}
#eventModal .modal-dialog .modal-content .modal-body form .pm_wrap>div.text p span{padding-right: 5px;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap{justify-content: space-between; align-items: center;flex-flow: row wrap;margin-bottom: 50px;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>p{font-size: 15px;display: block;width: 100%;margin-bottom: 20px;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label{margin-bottom: 0;cursor: pointer;width: 25%;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label:nth-child(2) .icon::after{display: none;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label:nth-child(3){}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label:nth-child(4){}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label:nth-child(5) .icon::before{display: none;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label .icon{width: 100%; height: auto; margin: 0 auto; position: relative; top: 0; left: 0; z-index: 1;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label .icon::after{content: ""; position: absolute; top: 50%; left: 0; width: 50%; height: 2px; background: #b0b0b0; transform: translateY(-50%); z-index: -1;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label .icon::before{content: ""; position: absolute; top: 50%; right: 0; width: 50%; height: 2px; background: #b0b0b0; transform: translateY(-50%); z-index: -1;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label .icon img{width: 50%; display: block; margin: 0 auto; filter: grayscale(1); transition: 0.2s; background: #fff;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label input[type="radio"]{position: absolute; top: 0; left: 0; z-index: -1; opacity: 0;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label span{color: #999;font-size: 13px;display: block;width: 100%;text-align: center;margin-top: 10px;transition: 0.2s;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label.atv{}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label.atv .icon img{filter: unset;}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label.atv input[type="radio"]{}
#eventModal .modal-dialog .modal-content .modal-body form .radio_wrap>label.atv span{color: #000;font-weight: bold;}
#eventModal .modal-dialog .modal-content .modal-body form::-webkit-scrollbar {width: 2px;}
#eventModal .modal-dialog .modal-content .modal-body form::-webkit-scrollbar-thumb {background-color: #dbdbdb;}
#eventModal .modal-dialog .modal-content .modal-body form::-webkit-scrollbar-track {background-color: unset;}
#eventModal .modal-dialog .modal-content .modal-footer{padding: 0; border-top: none; margin-top: 50px; display: flex; justify-content: space-between; align-items: center; flex-flow: inherit;}
#eventModal .modal-dialog .modal-content .modal-footer button{height: 50px; line-height: 48px;border-radius: 50px; padding: 0; font-size: 15px; margin: 0; width: 100%;margin-left: 5px;}
#eventModal .modal-dialog .modal-content .modal-footer button:nth-child(1){margin-left:0px !important;}
#calendar-container .calendar_list{margin-top: 50px;border-top: 20px solid #f7f7f7;}
#calendar-container .calendar_list b.title{font-size: 17px; text-align: center; display: block; width: 100%; padding: 50px 20px;}
#calendar-container .calendar_list .list{padding: 0 20px;}
#calendar-container .calendar_list .list li{border-top: 1px dashed #dee2e6; padding: 20px 10px; margin: 0px 0;}
#calendar-container .calendar_list .list li:first-child{border-top:none;}
#calendar-container .calendar_list .list li:last-child{border-bottom:1px dashed #dee2e6;}
#calendar-container .calendar_list .list li.no_data{text-align: center;font-size: 13px;color: #777;border-bottom: none;}
#calendar-container .calendar_list .list li>div{justify-content: space-between;margin-bottom: 10px; /*align-items: center;*/}
#calendar-container .calendar_list .list li>div:last-child{margin-bottom: 0px;}
#calendar-container .calendar_list .list li>div>p{font-size: 13px;color: #777;}
#calendar-container .calendar_list .list li>div>span{font-size: 13px;}
#calendar-container .calendar_list .list li>div .img_wrap{}
#calendar-container .calendar_list .list li>div .img_wrap p{background: #efefef;width: 23px;height: 23px;margin-left: 10px;border-radius: 20px;position: relative;top: 0;left: 0;}
#calendar-container .calendar_list .list li>div .img_wrap p img{filter: brightness(0.8); width: 60%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#calendar-container .calendar_list .list li>div .img_wrap p.atv{background: #48cfad;}
#calendar-container .calendar_list .list li>div .img_wrap p.atv img{filter: unset;}
#calendar-container .calendar_list .list li .comment_wrap{position: relative;top: 0;left: 0 ;width: 100%;}
#calendar-container .calendar_list .list li .comment_wrap .comment_btn{width: 100%; height: 50px; line-height: 48px; padding: 0; text-align: center; justify-content: center;align-items: center;border-radius: 50px;}
#calendar-container .calendar_list .list li .comment_wrap .comment_btn p{font-size: 15px;}
#calendar-container .calendar_list .list li .comment_wrap .comment_btn img{height: 20px;width: 20px;display: block;margin-left: 10px;}
#calendar-container .calendar_list .list li .comment_wrap .comment_content{display: none;position: absolute;bottom: 70px;width: 100%;left: 0;background: #000000db !important;border-radius: 5px;padding: 20px;}
#calendar-container .calendar_list .list li .comment_wrap .comment_content::after {content: "";position: absolute;bottom: -29px;left: 50%;transform: translateX(-50%);width: 0;height: 0;border-bottom: 15px solid transparent;border-top: 15px solid #000000db !important;border-left: 5px solid transparent;border-right: 5px solid transparent;}
#calendar-container .calendar_list .list li .comment_wrap .comment_content span{font-size: 13px;color: #fff;word-break:keep-all;display: block;}
#calendar-container .calendar_list .list li .comment_wrap .comment_content span:nth-child(2){margin-top: 20px;}
#calendar-container .calendar_list .list li .comment_wrap .comment_content span:nth-child(3){margin-top: 20px;}
#calendar-container .calendar_list .list li .comment_wrap .comment_content span.good{}
#calendar-container .calendar_list .list li .comment_wrap .comment_content span.bad{}
@media screen and (max-width:500px){
    #calendar-container #calendar{height: 437px !important;}
    #calendar-container #calendar .fc-view-harness>div>table>tbody .fc-scrollgrid-sync-table tr td{height: 50px;}
}
/* 캘린더 끝 */

/* 포인트전환 시작 */
#point_changing{padding: 20px 20px 0;}
#point_changing ul{}
#point_changing ul li{width: 100%;}
#point_changing ul li>span{font-size: 13px;}
#point_changing ul li>input{width: 100%; font-size: 15px; text-align: center; height: 70px; line-height: 70px;font-weight: bold;border: none; border-radius: 10px;}
#point_changing ul li>input::-webkit-inner-spin-button { appearance: none; -moz-appearance: none; -webkit-appearance: none; }
#point_changing ul li>input:focus { outline: none; box-shadow: unset;border: none;}
#point_changing ul li>input::placeholder{font-weight: normal;}
#point_changing ul li>p{text-align: right;font-size: 13px;}
#point_changing ul li>p span{}
#point_changing ul>i{display: block; width: 100%; height: 100px; line-height: 100px !important; text-align: center; font-size: 40px !important;}
#point_changing .comment{margin-top: 100px;}
#point_changing .comment p{color: #ffab02; font-size: 13px; position: relative; top: 0; left: 0; padding-left: 20px; line-height: 17px; margin-bottom: 10px;word-break:keep-all;}
#point_changing .comment p:last-child{margin-bottom: 0;}
#point_changing .comment p::after{content:"*";position: absolute;top: 0;left: 0;}
#point_changing button{font-size: 15px; padding: 0; height: 50px; line-height: 48px; border-radius: 50px;display: block;width: 100%;margin-top: 20px;}
/* 포인트전환 끝 */

/* 포인트전환 완료페이지 시작 */
#point_changed{padding: 0 20px;}
#point_changed .icon{display: block; width: 130px; height: 130px; border: 5px solid #474c54; border-radius: 100px; text-align: center; margin: 100px auto 50px;}
#point_changed .icon i{line-height: 120px !important;color: #fff;font-size: 50px !important;}
#point_changed>b{font-size: 17px; display: block; text-align: center; word-break: keep-all; padding-bottom: 50px; margin-bottom: 50px; position: relative; top: 0; left: 0;}
#point_changed>b::after{content: ""; position: absolute; bottom: 0; left: 50%; width: 90%; transform: translateX(-50%); height: 1px; background: #ddd; }
#point_changed>p{font-size: 13px;}
#point_changed>ul{border-radius: 10px; padding: 20px; background: #48cfad17;}
#point_changed>ul li{justify-content: space-between; align-items: center;margin-bottom: 10px;}
#point_changed>ul li:last-child{margin-bottom: 0px;}
#point_changed>ul li p{font-size: 15px;}
#point_changed>ul li b{font-size: 15px;}
#point_changed>.btn_wrap{justify-content: space-between; align-items: center;margin-top: 50px;}
#point_changed>.btn_wrap button{width: calc(50% - 5px); padding: 0; line-height: 48px; font-size: 15px; border-radius: 50px;}
#point_changed>.btn_wrap button:nth-child(1){color: #48cfad !important;}
/* 포인트전환 완료페이지 끝 */



/* 룰렛 시작 */
#roulette{}
#roulette>.resultLayer{position: fixed; width: 100%; height: 100vh; display: none; top: 0; left: 0; background:  rgba(0, 0, 0, 0.4);z-index: 9999;}
#roulette>.resultLayer .wrap{position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); background: #fff; width: 100%; max-width: 600px; padding: 120px 0px 0px; text-align: center; border-radius: 20px;}
#roulette>.resultLayer .wrap .icon{position: absolute; top: -35px; left: 50%; transform: translateX(-50%); width: 150px; height: 150px; background: #fff; border-radius: 100px; padding: 5px;}
#roulette>.resultLayer .wrap .icon img{display: block; height: 70%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#roulette>.resultLayer .wrap>span{text-align: center;display: block; font-size: 18px; margin-bottom: 0; padding: 0;color: #777;}
#roulette>.resultLayer .wrap>b{font-size: 20px;}
#roulette>.resultLayer .wrap .img_wrap{justify-content: center; align-items: center; margin: 20px 0 5px;}
#roulette>.resultLayer .wrap .img_wrap #resultImg{height: 40px; width: 40px;margin-right: 10px;}
#roulette>.resultLayer .wrap .img_wrap #result_price{font-size: 30px;font-weight: bold;line-height: 25px;}
#roulette>.resultLayer .wrap #result_text{font-size: 18px; color: #000;font-weight: bold;}
#roulette>.resultLayer .wrap #closeLayer{font-size: 15px; text-align: center; height: 80px; line-height: 80px; cursor: pointer; width: 100%; display: block;padding: 0;border-radius: 0 0 20px 20px;margin-top: 30px;}
#roulette>.resultLayer#pop particule{ position: absolute; top: 0; left: 0; border-radius: 50%; width: 30px; height: 30px; box-shadow: 1px 1px 4px #eb6383; z-index: -1; opacity: 0.5; }
#roulette .sub_baby{box-shadow: 0px -3px 3px -2px rgba(50, 60, 70, 0.15); -webkit-box-shadow: 0px -3px 3px -2px rgba(50, 60, 70, 0.15); -moz-box-shadow: 0px -3px 3px -2px rgba(50, 60, 70, 0.15);padding-top: 0;}
#roulette .view{width: 100%;max-width: 1200px;margin: 0 auto; justify-content: space-between;flex-flow: row wrap;}
#roulette .view .roulette_wrap{width:calc(50% - 5px);padding:20px 20px 0;overflow: hidden;}
#roulette .view .roulette_wrap .roulette_title{font-size: 18px; margin-bottom: 50px; justify-content: center; align-items: center;}
#roulette .view .roulette_wrap .roulette_title p{padding: 0; width: 30px; height: 30px; text-align: center; line-height: 28px; border-radius: 50px; font-size: 16px; margin-left: 10px;}
#roulette .view .roulette_wrap>.roulette-wrapper{position: relative; left: 50%; top: 0; transform: translateX(-50%); width: 100%; max-width: 400px;}
#roulette .view .roulette_wrap>.roulette-wrapper::after{ content: ""; position: absolute; top: -35%; left: 50%; transform: translateX(-50%); background-image: URL('../../../../img/roulette/roulette_color_bg.svg'); background-repeat: no-repeat; background-position: center; background-size: 100% auto; z-index: -1;width: 0;opacity: 0; height: 100%;}
#roulette .view .roulette_wrap>.roulette-wrapper.atv::after{animation: roulette_bg 0.5s 0s forwards;}
@keyframes roulette_bg {
    from {
        width: 0;
        opacity: 0;
    }
    to {
        width: 120%;
        opacity: 1;
    }
}
#roulette .view .roulette_wrap>.roulette-wrapper #roulette-bg{width: 100%;}
#roulette .view .roulette_wrap>.roulette-wrapper #roulette-gift{width: calc(100% - 14px); position: absolute; top: 7px; left: 6px;}
#roulette .view .roulette_wrap>.roulette-wrapper #roulette-niddle{position: absolute; top: 5px; left: 50%; transform: translateX(-50%); width: 9%;}
#roulette .view .roulette_wrap>.roulette-wrapper #start-rotate{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 30%; padding: 0; margin: 0; border: none;background:unset; }
#roulette .view .roulette_wrap>.roulette-wrapper #start-rotate:active img{ scale: 0.9; }
#roulette .view .roulette_wrap>.roulette-wrapper #start-rotate img{width: 100%;}
#roulette .view .roulette_wrap .ticket{ margin: 20px auto 0px;justify-content: space-between; align-items: center;}
#roulette .view .roulette_wrap .ticket .wrap{background: #fff; border: 1px solid #dee2e6; padding: 10px 20px; border-radius: 15px;justify-content: space-between; align-items: center; width: calc(100% - 110px);}
#roulette .view .roulette_wrap .ticket .wrap .text{align-items: center;}
#roulette .view .roulette_wrap .ticket .wrap .text img{height: 50px;width: 50px;}
#roulette .view .roulette_wrap .ticket .wrap .text p{font-size: 15px; padding-left: 10px;}
#roulette .view .roulette_wrap .ticket .wrap>b{font-size: 15px;}
#roulette .view .roulette_wrap .ticket>b{width: 100px; height: 72px; text-align: center; display: block; border-radius: 15px; color: #fff; font-weight: normal; cursor: pointer;padding: 0; font-size: 15px; flex-flow: column; align-items: center; justify-content: center;}
#roulette .view .roulette_wrap .ticket>b img{width: 25px;height: 25px;margin-bottom: 5px;}
#roulette .view .border-line{width: 10px;background: #f7f7f7; margin: 20px 0 0;}
#roulette .view .roulette_list{width: calc(50% - 5px); height: calc(100vh - 255px); overflow: hidden; padding:20px 20px 0px; min-height: 645px;}
#roulette .view .roulette_list#ticket_list{display: none;}
#roulette .view .roulette_list .list_title{margin: 0 auto 20px;padding: 0;justify-content: space-between;align-items: center;}
#roulette .view .roulette_list .list_title b{font-size: 18px; display: flex; align-items: center;}
#roulette .view .roulette_list .list_title b img{ height: 30px; margin-right: 10px;}
#roulette .view .roulette_list .list_title p{font-size: 15px; height: 40px; line-height: 40px; padding: 0 10px; border-radius: 50px;}
#roulette .view .roulette_list ul{height: calc(100% - 110px); overflow-y: auto; padding: 3px 20px;margin-bottom: 20px}
#roulette .view .roulette_list ul::-webkit-scrollbar { width: 2px; }
#roulette .view .roulette_list ul::-webkit-scrollbar-thumb { background-color: #e8f1e1; }
#roulette .view .roulette_list ul::-webkit-scrollbar-track { background-color: #fff; }
#roulette .view .roulette_list ul li{background: #fff; box-shadow: 0px 0px 5px #e4e4e4; padding: 15px; border-radius: 5px; margin-bottom: 10px; justify-content: space-between; align-items: center; position: relative; top: 0; left: 0;}
#roulette .view .roulette_list ul li#hide_motion{box-shadow: unset; text-align: center; justify-content: center;}
#roulette .view .roulette_list ul li> p{font-size: 15px;}
#roulette .view .roulette_list ul li> p span{font-weight: bold; font-size: 15px;font-weight: bold;}
#roulette .view .roulette_list ul li> span{font-size: 13px; color: #747474;text-align: right;}
#roulette .view .roulette_list .pager_wrap{display: flex; justify-content: center; align-items: center; margin: 0;}
#roulette .view .roulette_list .pager_wrap a{width: 30px; height: 30px; text-align: center; line-height: 30px; background: #f0f0f0; border-radius: 5px; margin: 0 3px; color: #000 !important;display:block;}
#roulette .view .roulette_list .pager_wrap a.atv{color: #fff !important;}
#roulette .view .roulette_list .pager_wrap a i{}
#roulette .roulette_notice{display: none; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); position: fixed; top: 0; left: 0; z-index: 9999; padding-bottom: 100px;}
#roulette .roulette_notice .wrap{position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%); width: fit-content; z-index: -1; text-align: center; padding: 0;height: fit-content;width: calc(100% - 40px);max-width: 600px; background: #fff;padding: 0;border-radius: 20px;overflow: hidden;}
#roulette .roulette_notice .wrap>b{display: block; font-size: 18px; margin-bottom: 0; padding: 30px 0 20px;}
#roulette .roulette_notice .wrap>ul{padding: 20px 20px 0;}
#roulette .roulette_notice .wrap>ul li{margin-bottom: 15px;}
#roulette .roulette_notice .wrap>ul li>div{ text-align: left; justify-content: flex-start; align-items: flex-start;font-size: 13px;}
#roulette .roulette_notice .wrap>ul li>div>img{width: 35px;height: 35px; margin-right: 5px;}
#roulette .roulette_notice .wrap>ul li>div>p{width: calc(100% - 35px); word-break: keep-all; line-height: 18px; padding-left: 5px; font-size: 15px; margin-top: 8px;}
#roulette .roulette_notice .wrap>ul li .q{font-weight: bold;margin-bottom: 20px;}
#roulette .roulette_notice .wrap>ul li.add{margin: 30px 0;}
#roulette .roulette_notice .wrap>ul li.add b{width: 100%; display: block; height: 40px; line-height: 38px; text-align: center; border: 1px solid; border-radius: 20px; margin-top: 10px; cursor: pointer;}
#roulette .roulette_notice .wrap>ul li.add b:active{background: #f5f5f5;}
#roulette .roulette_notice .wrap>ul li.add p{font-size: 12px; line-height: 20px; color: #777; word-break:keep-all;text-align: center;}
#roulette .roulette_notice .wrap>p{font-size: 15px; text-align: center; height: 80px; line-height: 80px; cursor: pointer; width: 100%; display: block;}
@media (max-width:1000px){
	#roulette .view .border-line{width: 100%;height: 20px;margin:40px 0 0;}
    #roulette .view .roulette_wrap {width: 100%;}
    #roulette .view .roulette_wrap .ticket{width: 100%;}
    #roulette .view .roulette_list{width: 100%; height: fit-content; overflow: auto; min-height:unset;}
    #roulette .view .roulette_list .list_title{width: 100%;}
    #roulette .view .roulette_list ul{height: fit-content;padding:3px;width: 100%;}
    #roulette .view .roulette_list ul li> p{font-size: 13px;font-weight: bold;}
}
@media (max-width:499px){
	#roulette .view .roulette_wrap{overflow: inherit;}
	#roulette .view .roulette_wrap>span{margin-bottom: 30px;}
	#roulette .view .roulette_wrap>.roulette-wrapper{max-width: 350px;}
	#roulette .view .roulette_wrap .ticket{justify-content: center; flex-flow: row wrap;}
	#roulette .view .roulette_wrap .ticket .wrap{width: 100%;padding: 20px;}
	#roulette .view .roulette_wrap .ticket .wrap .text img{width: 30px;height: 30px;}
	#roulette .view .roulette_wrap .ticket>b{margin-top: 10px; width: 100%;height: 50px;line-height: 50px;flex-flow: unset;}
	#roulette .view .roulette_wrap .ticket>b img{margin: 0 5px 0 0;}
}
/* 룰렛 끝*/


/* 룰렛티켓 선물하기 시작 */
#ticket_send{padding: 20px 20px 0;}
#ticket_send #send_form{}
#ticket_send #send_form ul{}
#ticket_send #send_form ul li{width: 100%;}
#ticket_send #send_form ul li>span{font-size: 13px;}
#ticket_send #send_form ul li>div{justify-content: space-between;align-items: center;}
#ticket_send #send_form ul li>div input{width: calc(100% - 110px); font-size: 15px; text-align: center; height: 70px; line-height: 70px; font-weight: bold; border-radius: 10px;border: 2px solid #ddd;}
#ticket_send #send_form ul li>div input::-webkit-inner-spin-button { appearance: none; -moz-appearance: none; -webkit-appearance: none; }
#ticket_send #send_form ul li>div input:focus { outline: none; box-shadow: unset;}
#ticket_send #send_form ul li>div input::placeholder{font-weight: normal;}
#ticket_send #send_form ul li>div button{display: block;padding: 0;width: 100px;font-size: 13px;height: 70px; line-height: 68px;border-radius: 10px;}
#ticket_send #send_form ul li>p{text-align: right; font-size: 13px;}
#ticket_send #send_form ul li>p span{}
#ticket_send #send_form ul li>p input{font-size: 13px;text-align: right;border: none !important;pointer-events: none;width: 45px;}
#ticket_send #send_form ul>i{display: block; width: 100%; height: 100px; line-height: 100px !important; text-align: center; font-size: 40px !important;}
#ticket_send #send_form>button{font-size: 15px; padding: 0; height: 50px; line-height: 48px; border-radius: 50px;display: block;width: 100%;margin-top: 100px;}
/* 룰렛티켓 선물하기 끝 */