/* font */
@font-face{
    font-family:'ds-digital-font';
    src: url('/static/font/ds_digital.ttf');

    font-family:'ds-difib';
	src: url('/static/font/DS-DIGIB.ttf');
}

/* font list
font-family: 'Orbitron', sans-serif;
font-family: 'Russo One', sans-serif;
font-family: 'Audiowide', cursive;
font-family: 'Michroma', sans-serif;
*/

/* Login */
.error_msg{color: red}

/* common */
html{height: 1920px;}
html::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(64, 64, 64, 0);border-radius: 10px;background-color: #56565600;}
html::-webkit-scrollbar{width: 1px;height: 2px;background-color: #ffffff00;}
html::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: 0 0 6px rgba(156, 156, 156, 0);background-color: #ff9a0300;}

div::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(64, 64, 64, 0);border-radius: 10px;background-color: #56565600;}
div::-webkit-scrollbar{width: 1px;height: 2px;background-color: #ffffff00;}
div::-webkit-scrollbar-thumb{border-radius: 1px;-webkit-box-shadow: 0 0 6px rgba(156, 156, 156, 0);background-color: #ff9a0300;}
.scroll_shadow_div{position:absolute;display: none;z-index: 5;width:100%;height: 5rem;background:#000;}
.scroll_shadow_div.top{position: sticky;top: 0;left:0;background: linear-gradient(to bottom, #0c0c0c 40%,#00000000 100%);}
.scroll_shadow_div.bottom{position: sticky;top: calc(100% - 5rem);left:0;margin-top: -3rem;background: linear-gradient(to top, #0d0d0d 40%,#00000000 100%);}

body{position: relative;width: 1080px;height: 1920px;margin: auto;background-color: #000;background-repeat: no-repeat;background-position: center;/* overflow: hidden; */}
a, a:hover{display: none;text-decoration: none;color: #fff;}
button{background: none;color:#ffffffaa;border:2px solid #ffffffaa;outline: 0 !important;}
button:active, button:hover{filter:drop-shadow(0 0 3px #ffffffaa); border-color:#fff; color:#fff}
button:active:disabled, button:hover:disabled{filter:none;border-color:#ffffffaa;color:#ffffffaa;}

#drop_mask{position:absolute;z-index: 6;width: 1080px;top:0;left: 0;background: #00000000;border: 0;}

.block_btn{border-radius:10px;border:5px solid #52525261;border-top:5px solid #ffffff80;border-bottom:5px solid #3131319e;box-shadow: 0 5px 5px #000000d9;font-family: 'Noto Sans KR', sans-serif;}
.block_btn:hover, .block_btn:hover:disabled{border:5px solid #52525261;border-top:5px solid #ffffff80;border-bottom:5px solid #3131319e; box-shadow:0 5px 5px #000000d9; filter:none}
.block_btn:active{top:5px;filter: brightness(80%) !important;border:5px solid #52525261;border-top:5px solid #ffffff80;border-bottom:5px solid #3131319e;box-shadow:0 1px 5px #000000d9;}
.block_btn:disabled, .block_btn:disabled:active, .block_btn:disabled:hover{filter: brightness(80%);top:auto;border:5px solid #52525261;border-top:5px solid #ffffff80;border-bottom:5px solid #3131319e;}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; margin: 0; }

.container{position: relative;width: 1080px;min-width: 1080px;height: 1920px;margin: 0 auto;padding: 0;overflow: hidden;}
.container.page-disabled{display:none}

.row{position: relative;display: block;max-width: 1080px;height: 1920px;min-height: 1920px;max-height: 1920px;margin: auto;padding: 0;background: #1d1d1d73;overflow: hidden;font-family: Arial, Helvetica, sans-serif;}
.row .body_main{position: absolute;width:100%;height: calc(1920px - 11rem);top: 11rem;}

.row #back_btn{position: absolute;z-index: 8;display: inline-block;width: 6rem;height: 6rem;top: -6rem;left: 0;margin: 0 .2rem;padding: 0;background: none;border:none;color: #fff;outline: none;text-align: center;}
.row #back_btn .back_icon_div{position: absolute;display: table-caption;width: 4rem;height: 4rem;top: 0;bottom: 0;right: 0;left: 0;margin: auto;/* background: #040404aa; */border-radius: 50%;text-align: center;}
.row #back_btn img{width:100%; filter:invert(100%)}

.progress-bar, .progress{transition:none}

.pageLinker.back_white{background-image: url("/static/image/kiosk/back.png");background-repeat:no-repeat;background-position: center 60px;color:#ffffff;text-align:center;}
.pageLinker.back_white p{position: absolute;width: 100%;bottom: 4rem;margin: 0;font-size:18px;}
.pageLinker.back_white:active{background-color: #ffc800;}
.pageLinker.home_white{background-image: url("/static/image/kiosk/home.png");background-repeat:no-repeat;background-position: center 60px; color:#ffffff;text-align:center;}
.pageLinker.home_white p{position: absolute;width: 100%;bottom: 4rem;margin:0;font-size:18px;text-align: center;}
.pageLinker.home_white:active{background-color: #ffc800;}

/* top menu */
.row .top_div{position:relative;display: flex;height: 8rem;margin-top: 3rem;padding-bottom: 1rem;border-bottom: 1px solid #ffffff3d;color: #fff;}
.row .top_div .title_div{position: relative;display: table-cell;width: 100%;height: 100%;min-height: 5rem;vertical-align: middle;}
.row .top_div h1{position: absolute;display: inline-block;width: 100%;bottom: 0;margin: auto;padding: 0 2rem 0 7rem;vertical-align: middle;font-size: 60px;text-align: left;font-weight: 900;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;line-height: 1;font-family: 'Noto Sans KR', sans-serif;}
.row .top_div .sub_title{position: absolute;display: inline-block;right: 2.5rem;bottom: 1rem;margin: 0;color:#fff;font-size: 24px;text-align: center;}

/* spinner */
#spinner{position: absolute;display: inline-table;width: 190px;top: 50%;bottom: 1rem;left: 50%;margin: auto;text-align: center;z-index: 9999;transform: translate(-50%,-50%);}
#spinner p{margin:0;font-size: 24px;color: #ffffff;}
#spinner div {width: 2rem;height: 2rem;background-color: #ffffff;border-radius:50%;display:inline-block;-webkit-animation:bouncedelay 1.4s infinite ease-in-out both;animation:bouncedelay 1.4s infinite ease-in-out both;filter: drop-shadow(0 0 5px #ffffffbb);}
#spinner .bounce1{ -webkit-animation-delay:-0.32s; animation-delay:-0.32s;}
#spinner .bounce2 {-webkit-animation-delay:-0.16s; animation-delay:-0.16s;}
@-webkit-keyframes bouncedelay {
    0%, 80%, 100% {-webkit-transform:scale(0)}
    40% {-webkit-transform:scale(1.0)}
}
@keyframes bouncedelay {
    0%, 80%, 100% {-webkit-transform: scale(0); transform:scale(0);}
    40%{-webkit-transform:scale(1.0); transform:scale(1.0);}

}

/* sound player */
.row #sound_player{position:absolute;z-index: 8;width: 100%;height: 100%;top:0;right:0;background: #000000c7;font-family: Arial, Helvetica, sans-serif;font-weight:900;}
.row #sound_player p{position:absolute;display: none;width: 60rem;height: 40rem;top: 0;bottom:0;right: 2rem;left:0;margin:auto;color:#fff;font-size: 400px;font-weight:900;font-style:italic;text-align:center;}
.row #sound_player .round{font-size:200px}
.row #sound_player .mission_completed{position:absolute;display: none;width: 90%;height: 20rem;top: 0;bottom:0;right:0;left:0;margin:auto;color:#fff;font-size:150px;font-weight:900;font-style:italic;text-align: center;line-height: 150px;}
.row #sound_player .ready, .row #sound_player .set{font-size:250px}

/* system_bar */
.system_bar_div{position:absolute;z-index: 5;width:100%;height:3rem;padding:.4rem 2rem;background: #0000002b;/* border-bottom:1px solid #ffffff26; */color:#ffffffaa;font-size: 20px;font-family: 'Gothic A1', sans-serif;}
.system_bar_div .kiosk_div{position:absolute;width: 20rem;}
.system_bar_div .kiosk_div img{height: 2.2rem;filter: invert(100%);opacity: .7;}
.system_bar_div .kiosk_div .ki_name{position:absolute;left: 2.5rem;top: .2rem;}
.system_bar_div .system_time_div{position:absolute;width: 8rem;height: 3rem;top: 0;left: 0;right: 0;margin: auto;padding-top: .6rem;text-align: center;font-size: 28px;font-weight: 600;line-height: 28px;}
.system_bar_div .class_info_btn{position:absolute;width: 20rem;top: .3rem;right:2rem;text-align: right;border:0;}
.system_bar_div .class_info_btn img{height:2.2rem;margin-top: -.3rem;filter: invert(100%);opacity: .7;}
.system_bar_div .class_info_btn:active img, .system_bar_div .class_info_btn:hover img{filter:invert(100%)}
.system_bar_div .class_info_btn label{/* position:absolute; */right:0;padding-top: .2rem;}

/* system_nav */
.system_nav_div{position: absolute;z-index: 8;width: 1080px;height: 6rem;bottom: 0;margin: auto;padding: .2rem 0;border-top: 1px solid #ffffff26;}
.system_nav_div.no_back{padding-left: 0;}
.system_nav_div.extension{width:100%}
.system_nav_div .system_nav_btn{position: relative;display: inline-block;width: 6rem;height: 100%;margin: 0;padding: 0;background: none;border:none;color: #fff;outline: none;text-align: center;}
.system_nav_div .system_nav_btn:active{color:#ffffff}
.system_nav_div .system_nav_btn.disabled{display:none}
.system_nav_div .system_nav_btn .sys_icon_div{position: absolute;display: table-caption;width: 5rem;height: 5rem;top: 0;bottom: 0;right: 0;left: 0;margin: auto;padding: .9rem 0;background: #040404aa;border-radius: 50%;text-align: center;}
.system_nav_div .system_nav_btn:hover .sys_icon_div{background: #272727;filter: drop-shadow(0px 0px 2px #ffffffaa);}
.system_nav_div .system_nav_btn.active .sys_icon_div{background-color: #8c8c8caa;text-shadow: 0 0 7px white;}

.system_nav_div .system_nav_btn img{height: 100%;filter:invert(100%);}
.system_nav_div .system_nav_btn i{font-size: 50px;}
.system_nav_div .system_nav_btn p{margin-top: .5rem;margin-bottom: 0;}
.system_nav_div #wd_system_nav_open{position: absolute;width: 4rem;height: 5rem;right: 0;padding: 1rem 0;padding-right: .5rem;color:#fff;text-align: center;}
.system_nav_div #class_mb_list_reload_btn{position:absolute;display:none}

/* class mb list */
.class_mb_div{position:absolute;display: none;z-index: 8;width: 20rem;height: 1920px;top: 0;right: 0;background: #171717db;}
.class_mb_div.active{/* display:block */}
.class_mb_div .class_info_div{position: absolute;width: 100%;height: 6.5rem;top: 1rem;right: 0;z-index: 3;/* background: #000000aa; */}
.class_mb_div .leader_div{position: absolute;width: 5.5rem;top: .5rem;left: 1rem;}
.class_mb_div .leader_img_div{position: relative;display: none;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: center;overflow: hidden;width: 5.5em;height: 5.5rem;top: 0;left: 0;border-radius:50%;}
.class_mb_div #class_leader_img.landscape{width:auto; height:100%}
.class_mb_div #class_leader_img.portrait{width:100%; height:auto}
.class_mb_div #class_leader_name{position: absolute;width: 20rem;top: 3.7rem;left: 6rem;color:#ffffffaa;font-size:24px;text-align: left;}

.class_mb_div #class_name{position:absolute;width: calc(100% - 8rem);top: .3rem;left: 7rem;margin: 0;font-size: 50px;font-weight: 500;line-height: 60px;color:#ffffffaa;font-family: Impact, Charcoal, sans-serif;}

.class_mb_div .mb_div{position:relative;float:left;width: calc(16.66% - .2rem);height: 6rem;margin-right: .2rem;margin-bottom:2px;background: #000;text-align:center;color:#fff;}
.class_mb_div .mb_img_div{position: absolute;display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:center;width: 4rem;height: 4rem;top: .3rem;left: .3rem;border-radius: 50%;overflow: hidden;}
.class_mb_div .mb_img_div .landscape{width: auto; height:100%}
.class_mb_div .mb_img_div .portrait{width: 100%; height:auto}
.class_mb_div .mb_div .mb_name{position:absolute;width:4rem;left: .3rem;bottom: .3rem;margin: 0;text-align:center;}

.class_mb_div #class_mb_list{position: absolute;display: none;z-index: 2;width:100%;height: 26rem;top: 6.5rem;padding: 1rem;}

/* local controller */
.row .local_controler_div{position:absolute;z-index:10;height: 6rem;padding: .2rem 0;bottom: 0;left: 12.5rem;text-align: right;}
.row .local_controler_div.two_btn{left:12.5rem}
.row .local_controler_div .lc_btn{position: relative;display: inline-block;width: 6rem;height: 100%;padding: 0;background: none;border:none;color: #ffffff;font-size: 11px;outline: none;}
.row .local_controler_div .lc_btn:disabled{color:#4c4c4c;}
.row .local_controler_div .lc_btn .lc_icon_div{position: absolute;display: table-caption;width: 5rem;height: 5rem;top: 0;bottom: 0;right: 0;left: 0;margin: auto;padding: .9rem 0;background: #040404aa;border-radius: 50%;text-align: center;}
.row .local_controler_div .lc_btn:hover .lc_icon_div{background: #272727;filter: drop-shadow(0px 0px 2px #ffffffaa);}
.row .local_controler_div .lc_btn:hover:disabled .lc_icon_div{filter:none}
.row .local_controler_div .lc_btn:hover i{-webkit-text-stroke-color:#272727}
.row .local_controler_div .lc_btn.active .lc_icon_div{background-color:#404040;text-shadow: 0 0 7px white;}
.row .local_controler_div .lc_btn img{/* position: absolute; */height: 100%;filter: invert(100%);}
.row .local_controler_div .lc_btn.active img{filter: brightness(100);}
.row .local_controler_div .lc_btn:disabled img{filter: invert(40%);}
.row .local_controler_div .lc_btn i{font-size: 50px;-webkit-text-stroke: 2px #000;}
.row .local_controler_div .lc_btn p{margin-bottom: 0;}
.row .local_controler_div #wk_start{color:#333}
.row .local_controler_div #wk_start.pageLinker{color:#ff9a03}
.row .local_controler_div #wk_start i{margin-left:.3rem}
.row .local_controler_div #back_btn i{margin-right:.1rem;}

/* dropdown */
.dropdown_div{position:relative}
.dropdown_toggle{position: relative;z-index: 7;border: 1px solid #ffffffaa;background: none;color: #ffffff8a;}
.dropdown_menu{position: absolute;top: 100%;z-index: 1000;display: none;float: left;min-width: 100%;padding: .5rem 0;margin: .125rem 0 0;font-size: 1rem;color: #212529;text-align: left;list-style: none;background-color: #000000c9;background-clip: padding-box;border: 1px solid rgba(0,0,0,.15);border-radius: .25rem;}
.dropdown_item{display: block;width: 100%;padding: .25rem 1.5rem;clear: both;font-weight: 400;color: #fff;text-align: inherit;white-space: nowrap;background-color: transparent;border: 0;}
.dropdown_item:focus, .dropdown_item:hover{background: #7d7d7d;}
.dropdown_item:active{background:#fff; color:#000; font-weight:600}

/* modal */
.modal-content{border-radius: 0;}
.modal .btn{font-family: Arial, Helvetica, sans-serif; font-weight:600;}
.modal .delete_submit{background:#ed0000; color:#fff}

.modal_div{position: absolute;display: none;z-index: 6;width:100vmin;bottom: 0;margin:auto;background-color:#fff;box-shadow:0px 1px 10px 1px #0000008f;}
.modal_title_div{height: 3rem;padding:.6rem;border-bottom: 1px solid #383838;font-size:20px;color:#353535;text-align:center;}

.modal_title_div .modal_title{display:inline-block;width:80%;white-space:nowrap;overflow:hidden;font-size: 17px;text-overflow:ellipsis;color: #fff;}
.modal_title_div .modal_left{position:absolute;width:3rem;height:3rem;top:0;left:0;padding: 0;background-color:unset;border:none;-webkit-text-stroke: 1px white;}
.modal_title_div .modal_close{position:absolute;width:3rem;height:3rem;top:0;right:0;padding: 0;background-color:unset;border:none;font-size: 28px;-webkit-text-stroke: 3px white;}
.modal_title_div .modal_close img{width: 80%;filter:invert(90%);}
.modal_title_div .modal_close:active{color:#ff9a03}
.modal_title_div .modal_close.left{left:0; right:inherit}
.modal_title_div .modal_left{display:none}
.modal_body_div .modal_submit_btn{width:100%;height:3rem;left:0;bottom:0;background: #353535;border-radius: 5px;color: #fff;}
.modal_body_div .modal_submit_btn:active{background:#ff9a03}

#modal_mask{position: absolute;display:none;z-index: 5;width: 1080px;height: 1920px;top: 0;background-color: #0000004a;border: 0;}
#modal_mask:active, #modal_mask:hover{filter:none}

/* modal class info */
#modal_class_info{z-index: 6;width:20rem;height:1920px;top: 0;background: #171717db;}
#modal_class_info .modal_title_div{border:none}

#modal_class_info .class_info_div{width: 100%;height: 3rem;padding-top: .2rem;color: #fff;}
#modal_class_info .class_info_div .class_name{width: 100%;margin: 0;padding: 0 1rem;font-size:24px;font-weight:600;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
#modal_class_info .class_info_div .class_msg{text-align:center}

#modal_class_info .trainer_div{position: absolute;width: 100%;height: 6rem;top: 6rem;left: 0;border-bottom:1px solid #525252aa;text-align: center;color:#ffffffaa;}
#modal_class_info .trainer_img_div{position: absolute;display: none;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: center;overflow: hidden;width: 5em;height: 5rem;top: 0;left: 1rem;border-radius:50%;}
#modal_class_info #trainer_img.landscape{width:auto; height:100%}
#modal_class_info #trainer_img.portrait{width:100%; height:auto}
#modal_class_info .trainer_lbl{position:absolute; top:.5rem; left:7.5rem}
#modal_class_info #trainer_name{position: absolute;top: 2rem;left: 7.5rem;margin: 0; font-size:26px}

#modal_class_info #class_mb_list{position:absolute;width:100%;height: calc(1920px - 15rem);top: 12rem;left: 0;padding: .5rem;overflow-y: auto;}
#modal_class_info .class_mb_list .mb_info{position:relative;width: 100%;height: 6rem;margin-bottom:2px;text-align:center;color: #ffffff;text-shadow:2px 2px 5px #545454}
#modal_class_info .class_mb_list .mb_info[data-color="fbb0"]{background: #b1b1b1d4;}
#modal_class_info .class_mb_list .mb_info[data-color="fbb1"]{background: #ffda52d1;}
#modal_class_info .class_mb_list .mb_info[data-color="fbb2"]{background: #34deffb0;}
#modal_class_info .class_mb_list .mb_info[data-color="fbb3"]{background: #0089ffb0;}
#modal_class_info .class_mb_list .mb_info[data-color="fbb4"]{background: #00966cc4;}
#modal_class_info .class_mb_list .mb_info[data-color="fbb5"]{background: #ff5722b5;}
#modal_class_info .class_mb_list .mb_info[data-color="fbb6"]{background: #820900c7;}

#modal_class_info .class_mb_list .mb_img_div{position: absolute;z-index: 2;display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:center;width: 5rem;height: 5rem;top: .5rem;left: .5rem;border-radius: 100%;overflow: hidden;box-shadow: 2px 2px 5px #404040;}
#modal_class_info .class_mb_list .landscape{width: auto; height:100%}
#modal_class_info .class_mb_list .portrait{width: 100%; height:auto}
#modal_class_info .class_mb_list .mb_name{position: absolute;width: 100%;top: 0;left: 0;margin: 0;padding-left: 4rem;padding-right: .2rem;background: #00000047;text-align: right;font-weight: 600;}
#modal_class_info .class_mb_list .hr_div{position:absolute;width: calc(100% - 6rem);height: 4.5rem;top: 1.5rem;left: 0;margin-left: 6rem;}
#modal_class_info .class_mb_list .hr_icon_div{position:absolute;width: 3rem;height:2rem;top: .7rem;left:.5rem;}
#modal_class_info .class_mb_list .hr_bpm{position:absolute;width:3rem;top: 2rem;left: .5rem;margin: 0;text-align:center;font-size: 20px;font-weight: 600;}
#modal_class_info .class_mb_list .hr_percent_p{position:absolute;top: .6rem;right: 1.5rem;margin: 0;font-size: 50px;font-family: 'Orbitron', sans-serif;font-weight: 600;line-height: 50px;}
#modal_class_info .class_mb_list .hr_percent_p .unit_span{font-size:20px}

#modal_class_info.bothSide{width: 100%;height: calc(1920px - 17rem);top: 11rem;bottom: initial;background:none;box-shadow:none;}
#modal_class_info.bothSide .modal_body_div{position: absolute;width:10rem;height: 100%;background: #17171794;}
#modal_class_info.bothSide .modal_title_div{display:none}
#modal_class_info.bothSide .class_mb_list{width:100%}

#modal_class_info.bothSide button.mb_info{height:7rem;border:none;margin: 0;}
#modal_class_info.bothSide button.mb_info .mb_record{position:absolute;width:100%;height: 1.5rem;bottom:0;left:0;margin: 0;background: #00000047;}
#modal_class_info.bothSide button.mb_info.active .mb_record{background-color:#358fff;color:#fff;font-weight:600;}
#modal_class_info.bothSide .mb_img_div{width:4rem; height:4rem; top:.2rem; left:.2rem}
#modal_class_info.bothSide .class_mb_list .hr_div{width:100%; margin:0}
#modal_class_info.bothSide .hr_icon_div{width: 2rem;height: 1.5rem;left: .2rem;top: 2.6rem;}
#modal_class_info.bothSide .hr_bpm{height:1.5rem;left: 1.2rem;top: 2.5rem;font-size: 18px;}
#modal_class_info.bothSide .hr_percent_p{right: .3rem;font-size: 35px;}
#modal_class_info.bothSide .hr_percent_p .unit_span{font-size:16px}

/* #modal_class_connection */
#modal_class_connection{width:30rem;height: 28rem;left: 0;right: 0;margin-top: 20rem;background: #000000;}
#modal_class_connection .modal_title_div{height:4rem}
#modal_class_connection .modal_title_div .modal_title{float: left;width: 90%;margin: 0;font-size:30px;text-align:left;}
#modal_class_connection .modal_body_div{position:relative;padding:1rem;text-align: center;}
#modal_class_connection .modal_body_div .cl_div{height: 17rem;}
#modal_class_connection .cl_name{display:inline-block;width:100%;font-size:30px;color:#fff;font-weight:600;text-align: center;overflow:hidden;text-overflow:ellipsis;}
#modal_class_connection .cl_trainer_img_div{position: absolute;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: center;overflow: hidden;width: 10em;height: 10rem;top: 4rem;left: 0;right: 0;margin: auto;border-radius:50%;}
#modal_class_connection .cl_trainer_img_div .landscape{width:auto; height:100%}
#modal_class_connection .cl_trainer_img_div .portrait{width:100%; height:auto}
#modal_class_connection .trainer_name{position:absolute;width: 80%;top:14rem;left: 0;right: 0;margin: auto;font-size: 20px;color: #fff;}
#modal_class_connection #class_connection{width: 10rem;height:4rem;}
#modal_class_connection #class_connection_cancel{width: 10rem;height:4rem;}

/* wk zoomin modal */
#wk_zoomin_modal .modal-dialog{max-width: 800px;}
#wk_zoomin_modal .modal-content{display: table;width: 100%;border: 2px solid #ffffff8a;border-radius: 0;background: #ffffff96;}
#wk_zoomin_modal .modal-header{position:relative;height:100px;background: #000000bd;border: none;border-radius: 0;color:#fff;}
#wk_zoomin_modal .modal-header h5{float: left;font-size: 30px;font-weight:600;}
#wk_zoomin_modal .modal-header .close{right: 0;width: 5rem;height: 5rem;font-size:40px;}
#wk_zoomin_modal .modal-header .close .fa{top: 0;padding: 3px;font-size: 50px;color: #fff;outline: none;}
#wk_zoomin_modal .modal-body{position: relative;display: grid;padding: 0;}
#wk_zoomin_modal .vid_div{width:800px; height:800px}
#wk_zoomin_modal #video_play_tag{position:absolute;top: 35px;right: 100px;padding: 0 20px;background-color: #151515;border-radius:30px;font-size: 20px;font-weight:600;text-align:center;color:#fff;}
#wk_zoomin_modal #video_play_tag.t2{position:absolute;width: 150px;top: 20px;left:10px;right: 0;padding: 0;background: none;text-align: left;font-size:30px;color:#0000009c;}
#wk_zoomin_modal #video_play_tag.t2 span{margin:10px}
#wk_zoomin_modal #video_play_tag span{margin-right:10px}
#wk_zoomin_modal #zoom_in_preview{width:100%}
#wk_zoomin_modal .description{min-height: 0;margin-top: -7px;}

/* detail : challenge_setting_modal */
#challenge_setting_modal .modal-dialog{position:absolute;display: inline-table;width: 30rem;top: 0;bottom: 0;right:0;left:0;margin: auto;}
#challenge_setting_modal .modal-content{background-color:#000000cf; border:2px solid #fff}
#challenge_setting_modal .modal-header{color:#fff; font-weight:600; border-color:#ffffff40}
#challenge_setting_modal .modal-header .close{color:#fff}
#challenge_setting_modal .modal-body{text-align: center;}
#challenge_setting_modal .subtitle{margin:0;padding: 1rem .5rem;font-size:20px;text-align: left;font-weight:600;color:#fff;}

#challenge_setting_modal .timeSet{position:relative;display: inline-block;width: 100%;margin: auto;padding-bottom: 2rem;border-bottom: 1px solid;}
#challenge_setting_modal .time_scroll{position:absolute;z-index: 2;}
#challenge_setting_modal .timeSet_child{position: relative;width: 50%;float:left;padding: .5rem;}
#challenge_setting_modal #work_time{left: 0;}

#challenge_setting_modal .ten_sec_btn{width: 6rem;height: 6rem;margin:0 1rem;background:#fff;border-radius: 50%;font-size: 20px;color:#000;font-weight:600;}

#challenge_setting_modal input{width: 100%;height: 100%;padding: .5rem;background: #02020282;border: 2px solid #9c9c9c;color: #fff;text-align: center;font-size: 32px;font-weight: 600;}
#challenge_setting_modal input:focus{border-color:#fff;color:#fff;filter: drop-shadow(0 0 5px #ffffffd1);outline: 0;}
#challenge_setting_modal .tag{position:absolute;top: 1.5rem;right: 1.5rem;color:#a7a7a7;font-size: 20px;}

#challenge_setting_modal .modal-body .set_edit_div{position: relative;width: 100%;margin:auto;margin-bottom: 2rem;}
#challenge_setting_modal .set_edit_div .set_setting_btn{position: absolute;width:5rem;height:5rem;top: 4rem;border-radius: 50%;background: #ffffff8a;border:0;font-size:40px;color: #171717;}
#challenge_setting_modal .set_edit_div .set_setting_btn.up{right:1rem}
#challenge_setting_modal .set_edit_div .set_setting_btn.down{left:1rem}
#challenge_setting_modal .set_edit_div .set_setting_btn:hover{background:#fff;}
#challenge_setting_modal .set_edit_div .set_setting_btn:active{background:#fff; filter:drop-shadow(0 0 5px #fff)}
#challenge_setting_modal .set_edit_div .set_setting_btn:active ~ .set_div #set{text-shadow: 0 0 10px #fff;}
#challenge_setting_modal .set_edit_div .set_div{position:relative;display: block;width:5rem;height:5rem;margin: auto;color: #fff;}
#challenge_setting_modal .set_edit_div .set_div p{position: absolute;width:100%;top: -1rem;/* margin-top: -1rem; */font-size:20px;text-align:center;font-weight:600;}
#challenge_setting_modal .set_edit_div .set_div #set{position: absolute;width:100%;bottom: .3rem;font-size: 60px;line-height: 60px;text-align:center;font-weight:600;}

#challenge_setting_modal .time_setting_okay{width: calc(100% - 1rem);height: 3.5rem;margin-bottom: 1rem;background-color: #f1f1f1;border:none;font-size:24px;font-weight:600;color: #353535;}
#challenge_setting_modal .time_setting_okay:active{background-color:#ffffff; filter:drop-shadow(0 0 5px #fff)}

/* search bar */
.search_div{position: absolute;width: 100%;height: 3rem;top: 2rem;font-weight:700;border-bottom: 1px solid #ffffff8a;}
.search_div .sort_div{position:absolute; display:inline-block}
.search_div .sort_div.type{left: 17rem;}
.search_div .sort_div.level{right:0;}
.search_div label{float: left;width: 3rem;top:0;margin: 0;margin-top: .5rem;color: #ffffff8a;}
.search_div select{float:left;width: 180px;height: 40px;}
.search_div .sort_div .level_div label{width:2.5rem}

.search_div .dropdown_div{float:left;margin-right: .5rem;}
.search_div .dropdown_toggle{float:left;width: 10rem;height: 2.5rem;}
.search_div .dropdown.show .dropdown_toggle{background: #0000008a;border-color:#fff;color:#fff;filter:drop-shadow(0 0 5px #fff);}

.search_div .level_div{float: left;height: 2.5rem;padding: 0;text-align: center;}
.search_div .level_div input[type='checkbox']{display: none}
.search_div .level_div input[type='checkbox']:checked + label{background-color: #ffffff;filter: drop-shadow(0 0 5px #ffffffaa);color: #000000;}
.search_div .level_div label{width: 2.5rem;height: 2.5rem;margin: 0 3px;padding: .6rem 1px 0 0;border-radius: 50%;background-color: #717171;color: #4a4a4a;text-align:center;font-size: 14px;/* letter-spacing: -4px; */}
.search_div .level_div label i{width: .7rem;margin-left: -.2rem;}

/* home/index */
.row.home{display: flex;overflow: -webkit-paged-y;}
.home .loading{display: inline-table;width: 400px;margin: 500px auto;padding: 20px;background: rgba(0, 0, 0, 0.62);border-radius: 5px;text-align: center;}
.home .loading .title{font-size: 40px; color: #fff; font-weight: 700}
.home .loading #spinner{position:relative; margin-top:50px}
.home .loading #spinner div{background:#fff}

/* home/login */
.login .login_div{width: 400px;margin: 500px auto;padding: 20px 45px;background: rgba(0, 0, 0, 0.62);border-radius: 5px;text-align: center;}
.login .login_div .title{margin-bottom: 30px;font-size: 28px;color: #fff;font-weight: 700;}
.login .login_div .notice{margin-bottom: 40px; font-size: 14px;color: #c3c3c3;font-weight: 700;word-break: keep-all;text-align: center;line-height: 1.5;}
.login .login_div label{float:left;color:#a0a0a0}
.login .login_div .gym_phone_div input{width:300px; height:50px; margin:auto; margin-bottom:10px;}
.login .login_div .gym_phone_div input.fail{border-color:#ff0024; background-color:#ffc2c2}
.login .login_div .gym_phone_div{width:300px;margin:auto;margin-bottom: 60px;}
.login .login_div  #login_submit{width: 300px;height: 50px;margin: 5px 0;background-color:#2eff91;font-size: 20px; font-weight: 600}
.login .login_div  #login_submit:active{background-color:#a5ffd0}

/* home/kiosk_register */
.kiosk_register .pw_reset_div{width: 400px;margin: 500px auto;padding: 20px 45px;background: rgba(0, 0, 0, 0.62);border-radius: 5px;text-align: center;}
.kiosk_register .pw_reset_div .title{margin-bottom:40px; font-size: 30px; color: #fff; font-weight: 700}
.kiosk_register .pw_reset_div .notice{margin-bottom:40px;font-size: 14px;color: #c3c3c3;font-weight: 700;word-break: keep-all;text-align: center;line-height: 1.5;}
.kiosk_register .pw_reset_div label{float:left;color:#a0a0a0}
.kiosk_register .pw_reset_div .gym_pw_div input{width:300px; height:50px; margin:auto; margin-bottom:10px;}
.kiosk_register .pw_reset_div .gym_pw_div input.fail{border-color:#ff0024; background-color:#ffc2c2}
.kiosk_register .pw_reset_div .gym_pw_div{width:300px;margin:auto;}
.kiosk_register .pw_reset_div .gym_pw_div .err{margin:0;color: #f04;}
.kiosk_register .pw_reset_div  #login_submit{width: 300px;height: 50px;margin: 50px 0 5px;background-color:#2eff91;font-size: 20px;font-weight: 600;}
.kiosk_register .pw_reset_div  #login_submit:active{background-color:#a5ffd0}

.kiosk_register .select_kiosk_div{width: 400px;margin: 500px auto;padding: 20px 45px;background: rgba(0, 0, 0, 0.62);border-radius: 5px;text-align: center;}
.kiosk_register .select_kiosk_div .title{margin-bottom: 30px;font-size: 28px;color: #fff;font-weight: 700;}
.kiosk_register .select_kiosk_div .kiosk_btn{width:300px; height:50px; margin:5px; background-color:#73baff; border:0; border-radius:5px; color:#fff; font-weight:600; font-size:20px; outline:none}
.kiosk_register .select_kiosk_div .kiosk_btn:active{background-color: #518aff;}
.kiosk_register .select_kiosk_div .kiosk_btn.active{background-color: #1a65ff;}
.kiosk_register .select_kiosk_div #kiosk_regi_submit{width: 300px; height: 50px; margin: 50px 5px 5px; border:none; border-radius:5px; background-color: #2eff91; color:#1b1b1b; font-size: 20px; font-weight: 600; outline:none}
.kiosk_register .select_kiosk_div #kiosk_regi_submit:disabled{background-color:#313131}
.kiosk_register .select_kiosk_div #kiosk_regi_submit:active{background-color:#a5ffd0}

/* home/suspension */
.suspension .suspension_div{width: 400px;margin: 500px auto;padding: 20px 45px;background: rgba(0, 0, 0, 0.62);border-radius: 5px;text-align: center;}
.suspension .suspension_div .title{margin-bottom: 30px;font-size: 28px;color: #f00;font-weight: 700;}
.suspension .suspension_div p{color:#fff}

/* home/maintainance */
.maintainance .maintainance_div{width: 400px;margin: 500px auto;padding: 20px 45px;background: rgba(0, 0, 0, 0.62);border-radius: 5px;text-align: center;}
.maintainance .maintainance_div .title{margin-bottom: 30px;font-size: 32px; font-family: Arial, Helvetica, sans-serif; color:#f00;font-weight: 900;}
.maintainance .maintainance_div p{color:#fff; font-size:20px}

/* main/index */
.main .top_menu_div{position:absolute; width:100%; top:3rem; padding:2rem}
.main .top_menu_div button{position:absolute; height:6rem; background:#000000aa}
.main .top_menu_div button:active{top:auto; margin-top:5px}
.main .top_menu_div button .icon_div{position:relative;height: 90%;}
.main .top_menu_div button img{height:100%;filter:invert(60)}
.main .top_menu_div .lang_btn{width: 6rem;}
.main .top_menu_div .lang_btn .icon_div{position:absolute; height:70%; top:.2rem; left:0; right:0; margin:auto}
.main .top_menu_div .lang_btn span{position:absolute; width:100%; left:0; bottom:0}
.main .top_menu_div .power_btn{display: none;right:2rem}

.main .title{position: absolute;display: inline-table;width: 100%;top: 20rem;text-align: center;}
.main .title img{width: 80%;margin:auto;filter: drop-shadow(5px 5px 5px #000);}

.main .menu{position: absolute;width: 100%;top: 49rem;margin:auto;text-align:center;}
.main .sub_menu{display: inline-flex;margin-bottom: 40px;}
.main .menu_button{position: relative;width: 14rem;height: 14rem;margin-bottom: 1rem;padding: .5rem 1rem;background: #ffb103e3;background-repeat: no-repeat;background-position: center bottom 3rem;background-size: 70%;color: #2b1e01;font-size: 18px;text-shadow:none;font-weight: 900;white-space: inherit;line-height: 1;outline: none;word-break: keep-all;/* filter: drop-shadow(0 0 3px #ffffffaa); */}
.main .menu_button:active, .main .menu_button:hover{/* filter: drop-shadow(0 0 3px #ffffffaa); *//* color:#fff; */}
.main .menu_button img{margin-top: -1.5rem;filter: brightness(0%);}
.main .menu_button:active img, .main .menu_button:hover img{opacity:1}
.main .menu_button span{position: absolute;bottom: 1rem;left: 0;right: 0;margin: auto;}

/* main/language_setting */
.main_lang .button_div{width: 400px;margin:200px auto;text-align: center;}
.main_lang .button_title{font-size:40px; font-weight: 700; color : #fff;}
.main_lang .lang_button{width: 20rem;height: 5rem;margin: 5px;background:#ff9a01;box-shadow: 1px 1px 5px #000;font-size: 24px;text-shadow:none;font-weight:700;color: #353535;}
.main_lang .lang_button:active{margin-top:10px; margin-bottom:0}
.main_lang .lang_button img{float:left}
.main_lang .heart_button{width: 20rem;height: 5rem;margin: 5px;background:#ff9a01;box-shadow: 1px 1px 5px #000;font-size: 24px;text-shadow:none;font-weight:700;color: #353535;}

/* main/setting */
.setting .btn_div{position:absolute;width: 50rem;top: 15rem;left: 0;right: 0;margin: auto;text-align: center;}
.setting .body_main .setting_btn{width:26rem;height:6rem;margin-bottom: 2rem;background: #000000de;color: #fff;font-size:20px;font-weight: 600;}
.setting .body_main .setting_btn:active{margin-top:5px; margin-bottom:calc(2rem - 5px)}

/* Quick start */
.quick .body_main{padding-top:30px; text-align:center}

.quick .quick_menu_div{position: absolute;width: calc(100% - 20rem);height: calc(100% - 20rem);top: 0;bottom: 6rem;right: 0;left: 0;margin: auto;background-color: #000000aa;}
.quick .quick_menu_div .rep_type_div{margin-bottom: 30px;text-align:center;}
.quick .quick_menu_div input[type="radio"]{display:none}

.quick .menu_div{margin-top:5rem}
.quick .menu_div h3{width: 34.5rem;margin: auto;margin-bottom: 1rem;color:#fff;text-align: center;font-weight: 600;}
.quick .rep_type_div .rep_type_lbl_box{width: 17rem;height: 5rem;margin: 1px;padding: 1.5rem 0;border: 3px solid #ffffffaa;color: #ffffffaa;font-size: 20px;font-weight: 600;}
.quick .rep_type_div input:checked + .rep_type_lbl .rep_type_lbl_box{filter: drop-shadow(0 0 3px #fff);background: #ffffff12;border-color: #fff;color: #fff;}

.quick .rep_tool_div{width: 36rem;margin: auto;text-align:center;}
.quick .rep_tool_div .rep_tool_lbl_box{position: relative;display: table;width: 17rem;height: 17rem;margin: 0 4px;border: 3px solid #ffffffaa;color: #ffffffaa;}
.quick .rep_tool_div .rep_tool_lbl_box img{width: 84%;filter: invert(80%);}
.quick .rep_tool_div .rep_tool_lbl_box p{position: absolute;bottom: 0;width: 100%;font-size: 20px;font-weight: 600;}

.quick .rep_tool_div input:checked + .rep_tool_lbl .rep_tool_lbl_box{filter: drop-shadow(0 0 3px #fff);background: #ffffff12;border-color: #fff;color: #fff;}
.quick .rep_tool_div input:checked + .rep_tool_lbl .rep_tool_lbl_box img{filter: brightness(10);}

.quick .rep_tool_div input:disabled + .rep_tool_lbl .rep_tool_lbl_box{border-color:#313131aa; color:#313131aa}
.quick .rep_tool_div input:disabled + .rep_tool_lbl .rep_tool_lbl_box img{filter:invert(10%)}

.quick .rep_lv_div{margin-bottom:30px; text-align:center}
.quick .rep_lv_div .rep_lv_lbl{width: 9rem;height: 9rem;margin: 0 1rem;padding: 3rem 0;border-radius: 50%;border: 3px solid #ffffffaa;color: #ffffffaa;font-size:25px;}
.quick .rep_lv_div .rep_lv_lbl .fa{margin:auto;}
.quick .rep_lv_div input:checked + .rep_lv_lbl{filter: drop-shadow(0 0 3px #fff);background: #ffffff12;border-color: #fff;color: #fff;}
.quick .rep_lv_div input:disabled + .rep_lv_lbl{border-color:#313131aa; color:#313131aa}

.quick .quick_submit{width: 34rem;height: 100px;margin-top: 40px;border: 3px solid;font-size: 40px;font-weight: 600;}
.quick .quick_submit:active{background: #ffffff12;}

/* workout/index */
.workout .contents_wrapper{position:relative;width: 100%;height: calc(1920px - 21rem);margin: auto;margin-top: 2rem;}
.workout .sub_msg{margin:80px 0;color: #fff; text-align: center;}
.workout .gear_list{position: absolute;display:flex;width: calc(100% - 2rem);top: 1rem;left: 1rem;flex-wrap:nowrap;flex-direction: row;overflow-x:auto;overflow-y:hidden;}
.workout .gear_list::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(64, 64, 64, 0);border-radius: 10px;background-color: #56565600;}
.workout .gear_list::-webkit-scrollbar{width: 1px;height: 2px;background-color: #ffffff00;}
.workout .gear_list::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: 0 0 6px rgba(156, 156, 156, 0);background-color: #ff9a0300;}

.workout .gear_list .gear{position:relative;display: inline-block;flex: 0 0 auto;width: 10rem;height: 10rem;margin: .5rem;background: none;border: 2px solid #ffffffaa;text-shadow: none;font-size: 20px;font-weight:800;white-space: inherit;line-height: 1;outline: none;color: #ffffffaa;}
.workout .gear_list .gear.active, .workout .gear_list .gear:active{filter: drop-shadow(0 0 3px #ffffffaa);border-color: #fff;color: #fff;}
.workout .gear_list .gear img{width: 90%;margin-bottom: 1rem;filter: brightness(10);opacity: .7;}
.workout .gear_list .gear.cfsc img, .workout .gear_list .gear.stc img{filter: drop-shadow(0px 0px 2px white)}
.workout .gear_list .gear:active img, .workout .gear_list .gear.active img{opacity:1}
.workout .gear_list .gear span{position:absolute;width:100%;bottom: .5rem;left: 0;}

.workout .search_div{width: calc(100% - 2rem);top: 14rem;left: 0;right: 0;margin: auto;}

.workout .workout_wrapper{position: absolute;width: calc(100% - 2rem);height: calc(1920px - 40rem);top: 18rem;left: 0;right: 0;margin: auto;}
.workout .workout_wrapper .wk_list_div{display:none;height: calc(1920px - 40rem);overflow: auto;}
.workout .workout_wrapper .wk_list_div.active{display: block;}

.workout .workout_wrapper .wk_div{display: none;float: left;width: 25%;padding: .1rem;color: #fff;}
.workout .workout_wrapper .wk_div.active{display: block;}
.workout .workout_wrapper .wk_div:hover{color:#fff}
.workout .workout_wrapper .wk_div:active{-webkit-filter: contrast(180%);filter: contrast(130%);}
.workout .wk_div .wk_inner_div{position:relative;padding: .5rem;}
.workout .wk_div .thumb_div{position: relative;width: 100%;height: auto;margin: auto;margin-bottom: .5rem;box-shadow: 5px 5px 8px #000;}
.workout .wk_div .thumb_div img{width: 100%;height: auto;}
.workout .wk_div .wk_vid_div{position:absolute;width:100%;top: 0;left: 0;padding: .5rem;}
.workout .wk_div .wk_vid_div video{width:100%}
.workout .wk_div .wk_name{display: grid;height: 2.4rem;}
.workout .wk_div .wk_name p{margin: 0;font-size: 18px;line-height: 20px;text-align: center;font-weight: 600;word-break: keep-all;}
.workout .wk_div .wk_type{position: absolute;top: 1rem;right: 1rem;font-size: 14px;font-weight: 600;color: #353535;}
.workout .wk_div .wk_level{position: absolute;top: 1rem;left: 1rem;color: #ffbe00;-webkit-text-stroke: 1px #fff;}
.workout .wk_div .wk_level i{letter-spacing:-3px;}
.workout .wk_div .icon_div{position:absolute;display:none;bottom: 2.5rem;right: 1rem;color: #989898;font-size:30px;}
.workout .wk_div.pageLinker .icon_div{display:block}

.workout .workout_wrapper .scroll_shadow_div.top{left:2rem;background: linear-gradient(to bottom, #0000008c 40%,#00000000 100%);}
.workout .workout_wrapper .scroll_shadow_div.bottom{bottom: 1rem;left:2rem;background: linear-gradient(to top, #0000008c 40%,#00000000 100%);}

/* workout play */
.workout .play_div{position: relative;width: 100%;/* min-height: 907px; */margin: auto;margin-top: 7rem;}
.workout .play_div video{width:100%; display: none;}
.workout #video_play_tag{position:absolute;top: 35px;right: 100px;padding: 0 20px;background-color:#ff9a01;border-radius:30px;font-size: 20px;font-weight:600;text-align:center;color:#fff;}
.workout #video_play_tag.t2{position:absolute;width: 150px;top: 20px;left:10px;right: 0;padding: 0;background: none;text-align: left;font-size:30px;color:#0000009c;}
.workout #video_play_tag.t2 span{margin:10px}
.workout #video_play_tag span{margin-right:10px}
.workout .manual{position: absolute;width: 100%;height: 28rem;bottom: 6rem;margin:auto;padding: 30px;color:#fff;font-size: 55px;overflow: auto;font-family: 'Gothic A1', sans-serif;}
.workout .manual button{position:relative;display: none;width:100%;border:none;background:none;text-align: left;color: #fff;}
.workout .manual button.active{display:inline-block}
.workout .manual button:hover{filter:none}
.workout .manual label{float: left;height: 100%;margin-bottom: 0;font-size: 90px;color:#ff9a01;}
.workout .manual p{float: left;width: calc(100% - 5rem);margin-bottom: 20px;word-break:keep-all;font-weight: 100;}
.workout .manual .next_div{position:absolute;width: 6rem;top:7rem;right:0;}
.workout .manual .next_div img{width:100%; filter:invert(70%)}

/* challenge */
.challenge .sub_select_box{display: table;margin: auto;}
.challenge .sub_select_box button:active{background-color:#ffc800; outline: none}
.challenge .sub_select_box button{width: 220px; height:220px; margin: 4px; padding: 0;padding-top:120px; background: #ff9a01;border: none; box-shadow: 1px 1px 5px #000; color: #1d1d1d; text-shadow: none; font-size: 20px; font-weight: 900;white-space: inherit;line-height: 1.2;outline: none;}
.challenge .sub_select_box .installed{background-image: url("/static/image/kiosk/installed.png");background-repeat:no-repeat; background-position: center 20px; }
.challenge .sub_select_box .custom{background-repeat:no-repeat;background-position: center 20px;}
.challenge .sub_select_box .rank{background-image: url("/static/image/kiosk/installed.png");background-repeat:no-repeat; background-position: center 20px; }
.challenge .newrep_div{width:100%;margin-top: 3px;text-align:center;}
.challenge .newrep_div .newrep{width: 676px;height: 100px;background-color: #af6b06;border: none;font-size: 30px;font-weight:600;outline: none;}
.challenge .newrep_div .newrep:active{background-color:#ff9a01}
.challenge .newrep_div .newrep img{margin-right:20px}

.challenge .body_main .left_view_div{position:absolute;width:calc(1080px - 24rem);height:calc(1920px - 17rem);top:0;left:0;padding:1rem;}
.challenge .body_main .left_view_div.extension{width:100%}
.challenge .body_main .left_view_div #spinner{display:none;}

.challenge .circuit_btn_div{width:100%;padding-top: 2rem;text-align:center;}
.challenge .circuit_btn_div button{position: relative;width: 9rem;height: 11rem;margin: 0 .3rem;background: #fffffff0;color:#353535;font-size:20px;font-weight:600;}
.challenge .circuit_btn_div button:disabled{filter: brightness(30%)!important;}
.challenge .circuit_btn_div .icon_div{position: absolute;width: 100%;height:70%;top: 0;}
.challenge .circuit_btn_div .icon_div img{height:100%}
.challenge .circuit_btn_div span{position:absolute;width:100%;top: 7.5rem;left:0;word-break: keep-all;line-height: 20px;}

.challenge #loading_porgress{position:absolute;display:none;z-index:3;width: 100%;height: 2rem;top: 6rem;right:0;left:0;bottom: 0;margin:auto;border-radius: 0;background: #ffffff40;overflow: inherit;}
.challenge #loading_porgress .progress-bar{height:100%;background: #fff;filter: drop-shadow(0 0 5px #ffffffaa);}

.challenge .rep_time_div{position:absolute;display: none;width:100%;top: 17rem;left: 0;text-align:center;color: #fff;font-size: 36px;font-weight: 600;}

.challenge #wk_list{position: absolute;display: inline-table;top: 20%;bottom: 0;left: 0;right: 0;margin: auto;transform: translate(0,20%);}
.challenge .wk_btn{position: relative;float:left;width: 33.33%;padding: .5rem;border: none;background: none;outline: none;}
.challenge .wk_btn .expand_arrow_p{position:absolute;z-index: 5;top:1rem;right:1rem;margin: 0;font-size:40px;line-height: 40px;color: #a7a7a7;}
.challenge .wk_btn [tooltip]:after{height: 1rem;top: -2rem;padding: 0 .5rem;line-height: 2rem;}
.challenge .wk_btn .preview{width:100%;}
.challenge .wk_btn .video_label{margin: 0;margin-right: 5px;color:#fff;font-size: 30px;font-style:italic;vertical-align: sub;}
.challenge .wk_btn .option{margin: 0;margin-bottom: 40px;color: #ff9a03;text-align: center;font-size: 26px;font-weight: 800;}
.challenge .wk_btn .workout_name{display: -webkit-box;width: 100%;height: 3rem;margin: 0;font-size: 18px;text-align: center;font-weight: 800;color: #ffc107;overflow: hidden;text-overflow: ellipsis;word-break: break-word;white-space: normal;line-height: 1.5rem;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.challenge .wk_btn .workout_name .wk_label{margin:0;margin-right: .5rem;}
.challenge .wk_btn .wk_option{position:absolute;bottom: 3rem;right: 1.3rem;font-size: 30px;font-weight: 600;color: #353535;}

.challenge #wk_list.over6{width: 100%;top: 10%;}
.challenge #wk_list.under5{width: 100%;}
.challenge .extension #wk_list.over6{top:10%}
.challenge .extension #wk_list.under5{top:18rem}
.challenge #wk_list.under5 .wk_btn{width:50%}

.challenge .bottom_btn_div{position: absolute;width:100%;bottom: 2rem;left: 0;text-align:center;}
.challenge .bottom_btn_div button{position: relative;width: 20rem;height: 6rem;margin: 0 .5rem;padding-left: 3rem;background: #fffffff0;color:#353535;font-size: 24px;font-weight:600;}
.challenge .bottom_btn_div button:disabled{filter:brightness(30%)}
.challenge .bottom_btn_div .icon_div{position: absolute;width: 7rem;height: 100%;top: 0;left: 0;}
.challenge .bottom_btn_div .icon_div img{height:100%}

.challenge .body_main .right_view_div{position: absolute;width: 24rem;height: calc(1920px - 17rem);top: 0;right: 0;padding: 1rem;padding-top: 5rem;background: #000000aa;}
.challenge .body_main .right_view_div.disabled{display:none}
.challenge .body_main #right_view_close{position:absolute;z-index: 5;width: 3rem;height: 3rem;top: 1rem;right: 1rem;border:none;border-radius:50%;background: #000000aa;}
.challenge .body_main #right_view_close.active{border-radius:0;background: none;}
.challenge .body_main #right_view_close img{width:100%; filter:invert(60%)}

.challenge .search_div{position: relative;height: 4rem;top: 0;right: 0;margin-bottom: .5rem;}
.challenge .search_div .sort_div{position:relative;float: left;left: 0;}
.challenge .search_div .sort_div.level{/* float:right */}
.challenge .search_div .dropdown_div{display:none}
.challenge .search_div .dropdown_div.active{display:block;margin: 0;}
.challenge .search_div .dropdown_toggle{width: 10rem;height: 3rem;overflow: hidden;padding: .2rem;}
.challenge .search_div label{width: 3rem;height: 3rem;margin: 0 .2rem;padding: .5rem;background: #b9b9b93d;border-radius: 100%;font-size: 14px;text-align: center;}
.challenge .search_div label img{width: 100%;filter:invert(80%);}
.challenge .search_div .level_div{display:none}
.challenge .search_div .level_div.active{z-index:5;display:block;top:2rem;left:0;padding-top: .3rem;}
.challenge .search_div .level_div label{width: 2.5rem;height: 2.5rem;padding: .6rem 1px 0 0;}

.challenge .dir_list_div{position:relative; width:100%}
.challenge .dir_btn{position:relative;width:100%;height:7rem;margin-bottom: .2rem;text-align:left;}
.challenge .dir_btn img{height:90%; filter:invert(90%)}
.challenge .dir_btn p{position:absolute; width:calc(100% - 7rem); top:2.5rem; left:7rem; font-size:20px}
.challenge .dir_btn.back_dir{display:none}

.challenge .unit_circuit_wrapper{position: relative;display: block;width: 100%;height: calc(1920px - 28em);margin: auto;overflow: auto;}
.challenge .unit_circuit_div{position:relative;display: none;float:left;width: 100%;height: 7.5rem;margin-bottom: .2rem;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.challenge .unit_circuit_div.active{display:block}
.challenge .unit_circuit_div.custom{height:10rem}

.challenge .unit_circuit{position: relative;float: left;width: 100%;height: 100%;background: #40404038;border: 2px solid #ffffff8a;color: #ffffff8a;text-shadow: none;font-size: 22px;font-weight: 600;white-space: inherit;line-height: 1.2;word-break: keep-all;text-align: left;outline: none;}

.challenge .unit_circuit .download{float:left; margin-top:7px; color:#fe9b00}
.challenge .unit_circuit .rep_left_div{position: absolute;width:7rem;height: 7rem;top:0;left:0;background: #00000059;}
.challenge .unit_circuit .rep_gear{position: absolute;display: inline-table;width: 7rem;top: 0;bottom: 0;margin: auto;padding: 0 .35rem;text-align: left;white-space: normal;}
.challenge .unit_circuit .rep_right_div{position:relative;z-index: 3;width: calc(100% - 7rem);height: 7rem;margin-left: 7rem;font-size: 18px;}

.challenge .rep_right_div .trainer_img_div{position: absolute;display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:center;width: 2.5rem;height: 2.5rem;top: .3rem;left: .3rem;border-radius: 50%;overflow: hidden;}
.challenge .rep_right_div .trainer_img_div .landscape{width: auto; height:100%}
.challenge .rep_right_div .trainer_img_div .portrait{width: 100%; height:auto}

.challenge .unit_circuit .rep_level{position: absolute;bottom: .5rem;right: .5rem;font-size: 15px;text-align: center;letter-spacing: -3px; color: #949494;}
.challenge .unit_circuit .rep_level span{margin-right: 10px;font-size: 20px;}
.challenge .unit_circuit .rep_level .fa{width: 15px;margin-top: 5px;color: #000000aa;}
.challenge .unit_circuit .rep_level .fa.light{color:#ffffffaa}

.challenge .unit_circuit .trainer{position:absolute; top:1rem; left:3rem}
.challenge .unit_circuit .name{position: absolute;width: 100%;margin: 0;top: 1rem;padding: 0 .5rem;text-align: left;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.challenge .unit_circuit.custom .name{top:3.2rem}
.challenge .unit_circuit .type{position: absolute;bottom: .5rem;left: .5rem;margin: 0;font-size: 16px;font-weight: 400;}
.challenge .unit_circuit img{width: 2rem;height: 2rem;margin: 1px;background: #fff;filter: brightness(60%);}

.challenge .unit_circuit.active{color: #fff;border-color: #fff;filter: drop-shadow(0 0 3px #ffffffbb);}
.challenge .unit_circuit.active img{filter:brightness(100%)}
.challenge .unit_circuit.active div{color:#fff}
.challenge .unit_circuit.active .rep_level .fa.light{color: #ffffff;}

.challenge .unit_circuit:active{background-color: #565656;outline: none;border-color:#fff; color:#fff}
.challenge .unit_circuit:active img{filter:brightness(100%)}
.challenge .unit_circuit:active .rep_level .fa.light{color: #ffffff;}

.challenge .rep_edit_div{position:absolute;z-index: 2;width: 100%;height: 3rem;bottom: 0;left: 0;padding: .2rem;text-align: center;}
.challenge .rep_edit_div button{position: relative;width: 48%;height: 90%;padding: 0;background: #000000aa;border:2px solid #52525261;border-top:2px solid #ffffff80;border-bottom:2px solid #1b1b1b75;border-radius:5px;font-size: 20px;color: #ffffff8a;}
.challenge .unit_circuit.active + .rep_edit_div button{color:#fff}
.challenge .rep_edit_div button:active{color:#fff}
.challenge .rep_edit_div button:active{filter:drop-shadow(0 0 5px #ffffffbb);top: 1px;}

#rep_delete_modal .modal-dialog{position:absolute;display: inline-table;width: 30rem;top: 0;bottom: 0;right:0;left:0;margin: auto;}
#rep_delete_modal .modal-content{background-color:#000000cf; border:2px solid #fff}
#rep_delete_modal .modal-header{color:#fff; font-weight:600; border-color:#ffffff40}
#rep_delete_modal .modal-header .close{color:#fff}
#rep_delete_modal .modal-body{padding:50px 30px;text-align: center;color: #fff;}
#rep_delete_modal .subtitle{margin:0;padding: 1rem .5rem;font-size:20px;text-align: left;font-weight:600;color:#fff;}
#rep_delete_modal .modal-footer button{width:80px; height:40px; font-weight:600}#rep_delete_modal .modal-footer .btn_submit{background-color: #F44336; border:none; color:#fff}
#rep_delete_modal .modal-footer .btn_cancle{background-color: #dcdcdc; border:none; color:#353535}

.challenge .rank_body #more_rep{width: 100%;height:50px;background: #2d2d2d;border: none;color: #fff;outline: none;font-style: italic;}
.challenge .unit_circuit_wrapper #more_rep{width:900px;height:50px;background: #171717;border: none;color: #fff;outline: none;font-style: italic;}

/* detail : time setting modal */
#time_setting_modal .modal-dialog{max-width: 700px;}
#time_setting_modal .modal-body{background-color:#1d1d1d;text-align: center;}
#time_setting_modal .timeSet{position:relative;display: block;width: 100%;height: 600px;margin: auto;}
#time_setting_modal .time_scroll{position:absolute;z-index: 2;}
#time_setting_modal #work_time{left: 0;}
#time_setting_modal #rest_time{left: 350px;}

#time_setting_modal .timeSet .timeSet_child{position:relative; float: left;width: 135px;height: 470px;overflow: auto;text-align: right;font-weight: 800;}
#time_setting_modal .timeSet .timeSet_child::-webkit-scrollbar{width:0}
#time_setting_modal .timeSet .timeSet_child p{height: 90px;margin:0;padding-right: 10px;font-size: 70px;line-height: 90px;color: #2f2f2f;text-align: center;}
#time_setting_modal .minSet p:nth-child(29), .circuit .minSet p:nth-child(30), .circuit .minSet p:nth-child(31), .circuit .secSet p:nth-child(30), .circuit .secSet p:nth-child(31), .circuit .secSet p:nth-child(32){color: #2f2f2f;}
#time_setting_modal .timeSet .minSet p:nth-child(28){background: -webkit-linear-gradient(#1d1d1d, #444444);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
#time_setting_modal .timeSet .minSet p:nth-child(32){background: -webkit-linear-gradient(#444444, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
#time_setting_modal .timeSet .secSet p:nth-child(29){background: -webkit-linear-gradient(#1d1d1d, #444444);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
#time_setting_modal .timeSet .secSet p:nth-child(33){background: -webkit-linear-gradient(#444444, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
#time_setting_modal .timeSet .round_set p:nth-child(3){background: -webkit-linear-gradient(#1d1d1d, #444444);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
#time_setting_modal .timeSet .round_set p:nth-child(7){background: -webkit-linear-gradient(#444444, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
#time_setting_modal .time_scroll .timeSet_child p.active{height: 110px;margin:0;font-size: 100px;line-height: 110px;}
#time_setting_modal #work_time .timeSet_child p.active{color: #ff0101 !important;}
#time_setting_modal #rest_time .timeSet_child p.active{color: #ffffff !important;}
#time_setting_modal #round .timeSet_child p.active{color: #ff9a02 !important;}
#time_setting_modal .timeSet div h1{margin: auto;background: #121011;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;font-size: 30px;font-weight:800;text-align: center;}
#time_setting_modal #work_time .work_head{padding: 30px 110px;text-align: center;color: #ff0101;}
#time_setting_modal #rest_time .rest_head{padding: 30px 110px;color:#ffffff;}
#time_setting_modal .timeSet .tag{float:left;width: 40px;height: 470px;margin: 0;line-height: 6.6;font-size: 70px;font-weight: 800;text-align: center;}
#time_setting_modal #work_time .tag{color: #ff0101;}
#time_setting_modal #rest_time .tag{color: #ffffff;}

#time_setting_modal .timeSet .selected_box{position:absolute;z-index: 1;width: 100%;height:100px;top: 280px;background: linear-gradient(to bottom, #3f3f3f 0%,#000 100%);}
#time_setting_modal .timeSet .grid{position:absolute;width: 100%;height: 280px;top: 190px; border-top: 1px solid #434343; border-bottom: 1px solid #434343;}

#time_setting_modal .time_setting_okay{width:250px;height:50px; background-color:#ff9100; border:none; font-size:24px; font-weight:600; outline:none}
#time_setting_modal .time_setting_okay:active{background-color:#ffc800}

/* detail : amrap time setting modal */
#amrap_time_setting_modal .modal-dialog{max-width: 700px;}
#amrap_time_setting_modal .modal-body{background-color:#1d1d1d;text-align: center;}
#amrap_time_setting_modal .timeSet{position:relative;display: inline-block;/* width: 100%; */height: 10rem;margin: auto;}
#amrap_time_setting_modal .time_scroll{position:absolute;z-index: 2;}
#amrap_time_setting_modal .timeSet_child{position: relative;float:left;padding: 1rem;}
#amrap_time_setting_modal #work_time{left: 0;}

#amrap_time_setting_modal .work_head{height:5rem; margin: auto; margin-bottom:3rem; padding:1.3rem; background: #121011;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;font-size: 30px;font-weight:800;text-align: center; color:#f00}
#amrap_time_setting_modal input{width: 15rem;height: 5rem;padding: .5rem;background: #121011;border: 2px solid #ff9100;color: #fff;text-align: center;font-size: 32px;font-weight: 600;}
#amrap_time_setting_modal .tag{position:absolute;top: 2.5rem;right: 1.5rem;color:#a7a7a7;font-size: 20px;}

#amrap_time_setting_modal .time_setting_okay{width: 90%;height: 5rem;background-color:#ff9100;border:none;font-size:24px;font-weight:600;outline:none;}
#amrap_time_setting_modal .time_setting_okay:active{background-color:#ffc800}

/* newrep */
.row.newrep{position: relative;}
.newrep .contents_wrapper{display:none}
.newrep .contents_wrapper.active{position: relative;display:block;height: calc(100% - 6rem);}

.newrep .contents_wrapper.page2{position:absolute;z-index: 10;width:calc(100% - 4rem);top:0;left:0;right:0;margin:auto;background:#00000087;border:5px solid #fff;border-radius:10px;}
.newrep .contents_wrapper.page2 .page_close_btn{position:absolute;width: 12rem;height: 5rem;top:.5rem;right:.5rem;padding-bottom: 1rem;background: #fff;font-size: 40px;color: #353535;outline: 0;text-align: center;font-weight: 600;}
.newrep .contents_wrapper.page2 .page_close_btn:active{color:#fff; filter: drop-shadow(0 0 5px #ffffffbb)}
.newrep .contents_wrapper.page2 .page_close_btn img{height: 90%;filter: invert(20%);}

.newrep #modal_mask{z-index:8; background:#000000c7}

.newrep .gear_list_div{position: absolute;display: block;width: 15rem;height: 100%;top: 0;left: 2rem;margin: 0;}
.newrep .gear_list{position: relative;width: 100%;height: 100%;flex-wrap:nowrap;flex-direction: row;overflow-y: auto;overflow-x: hidden;margin-top: 5rem;padding: 2rem .5rem;}
.newrep .gear_list .gear{position: relative;display: inline-block;flex: 0 0 auto;width: 100%;height: 4rem;margin: 0 .2rem;background: none;border: none;text-shadow: none;font-size: 18px;font-weight: 400;white-space: inherit;line-height: 1;outline: none;color: #e0e0e0;}
.newrep .gear_list .gear:not(.active):hover{background:#46464678}
.newrep .gear_list .gear.active{border: 2px solid #fff;filter: drop-shadow(0px 0px 3px #ffffffaa);color: #fff;}
.newrep .gear_list .gear img{position: absolute;width: 4rem;top: 0;bottom: 0;left: 0;margin: auto;padding: 0 .5rem;text-align: center;filter: brightness(100);}
.newrep .gear_list .gear[data-gear="cfsc"] img, .newrep .gear_list .gear[data-gear="stc"] img{filter:drop-shadow(0 0 2px white)}
.newrep .gear_list .gear p{position:absolute;height: 1.2rem;top: 0;bottom: 0;left: 0;margin: auto;margin-left: 4.5rem;}

.newrep .workout_wrapper{width:100%;height: calc(100% - 12rem);margin-top: 4rem;overflow: hidden;}
.newrep .workout_wrapper .wk_list_div{display:none;width:100%;height:100%;overflow-y: auto;}
.newrep .workout_wrapper .wk_list_div.active{display:block}

.newrep .workout_wrapper .scroll_shadow_div.top{left:2rem;background: linear-gradient(to bottom, #0b0b0b 40%,#00000000 100%);}
.newrep .workout_wrapper .scroll_shadow_div.bottom{bottom: 1rem;left:2rem;background: linear-gradient(to top, #070707 40%,#00000000 100%);}

.newrep .wk_div{width: calc(100% - 20rem);height: 100%;margin-left: 19rem;}
.newrep .wk_div .wk_list_head{width: 100%;height: 5rem;margin-bottom: .2rem;padding-top: 8rem;}
.newrep .wk_div .wk_div_wrapper{width:100%;height: calc(100% - 3rem);overflow-y: auto;}

.newrep .search_div{position:relative;width: 100%;top: 0;right: 0;margin: auto;font-weight: 600;}

.newrep .wk_div .wk_div_lbl{width:100%;margin:0;border: none;color: #ffffff;font-size:24px;font-weight:600;}
.newrep .wk_div .wk_btn{position:relative;display: none;width: 25%;padding: .1rem;background: #000000aa;border:none;outline: none;}
.newrep .wk_div .wk_btn:hover{background: #3838386b;}
.newrep .wk_div .wk_btn img{width: 100%;opacity: .7;}
.newrep .wk_div .wk_btn:hover img{opacity: 1;}
.newrep .wk_div .wk_btn.active{display: inline;}
.newrep .wk_div .wk_btn.selected .selected_number_div{position:absolute;}
.newrep .wk_div .wk_btn.selected .selected_number_div{z-index:5; width:1.5rem; height:1.5rem; background:#000;color:#fff; font-weight:600}
.newrep .wk_div .wk_btn.selected img{opacity: 1;}
.newrep .wk_div .wk_btn .wk_vid_div{position:absolute;width:calc(100% - .2rem); top:.1rem}
.newrep .wk_div .wk_btn .wk_vid_div video{width:100%}
.newrep .wk_div .wk_btn p{height:40px;word-break:keep-all;color:#fff;font-size: 14px;}
.newrep .wk_div .wk_btn .wk_type{position:absolute; top:.5rem; right:.5rem; color:#353535; font-weight:600}
.newrep .wk_div .wk_btn .wk_level{position:absolute;bottom: 3.5rem;right: .5rem;color: #ffffff; }
.newrep .wk_div .wk_btn.selected .wk_level, .newrep .wk_div .wk_btn:hover .wk_level{color:#FFC107}

.newrep .new_rep_div{width: 100%;height: 100%;top: 0;right: 0;}
.newrep .new_rep_div .err_msg{display:none}

.newrep .rep_info_div{height:100%;}
.newrep .info_left_div{position: absolute;display: table-cell;width: 22rem;height: 100%;padding: 1rem 3rem;border-right: 1px solid #ffffff3d;vertical-align: top;text-align: center;}
.newrep .info_left_div .info_div{width:100%;/* height:60px; */margin-bottom: 2rem;padding: 0;font-size:20px;text-align: left;}
.newrep .info_left_div .info_div .row_div_lbl{width: 110px;margin: 0;padding-right:10px;color: #ffffff;}
.newrep .info_left_div .info_div #re_mb,
.newrep .info_left_div .info_div #re_type,
.newrep .info_left_div .info_div input[type="text"]{width: 100%;height: 50px;padding: 5px;background: #00000061;border: 2px solid #ffffff8a;border-radius: 0;color: #ffffff8a;outline: none;text-align: center;}
.newrep .info_left_div .info_div .new_mb_p{width:100%; color:#fff; text-align:center}

.newrep .info_left_div .dropdown_div #re_mb,
.newrep .info_left_div .dropdown.show #re_type,
.newrep .info_left_div .info_div input[type="text"]:active,
.newrep .info_left_div .info_div select:focus,
.newrep .info_left_div .info_div input[type="text"]:focus{border-color:#ffffff; color:#ffffff; filter:drop-shadow(0 0 5px #ffffffbb)}

.newrep .info_left_div .dropdown #re_mb:hover,
.newrep .info_left_div .dropdown #re_type:hover,
.newrep .info_left_div .info_div input[type="text"]:hover,
.newrep .info_left_div .info_div select:hover{background: #5a5a5a61;border-color:#fff;color:#fff;}

.newrep .info_left_div .dropdown-menu{padding:0; border:2px solid #ffffff; border-radius:0}
.newrep .info_left_div .dropdown-menu .dropdown-item{width: 245px;height: 40px;background: #000;color: #fff; outline:0}
.newrep .info_left_div .dropdown-menu .dropdown-item:active{background-color:#ffffff; color:#000}
.newrep .info_left_div .dropdown-menu .dropdown-item:hover{background-color:#b9b9b9; color:#000}
.newrep .info_left_div input[type="radio"]{display:none;}
.newrep .info_div .lv_radio{text-align:center}
.newrep .info_div .lv_star{width: 4.5rem;height: 4.5rem;margin: 10px 3px;padding: 1.4rem 0;background: #1d1d1d;border-radius: 50%;text-align: center;color: #969696;font-size: 18px;}
.newrep .info_div .lv_star:hover{background: #5a5a5a61;}
.newrep .info_left_div input[type="radio"]:checked + .lv_star{background-color: #ffffff;color: #000;}
.newrep .info_left_div input[type="radio"]:checked + .lv_star:active{filter: drop-shadow(0 0 5px #ffffffbb)}
.newrep .info_div .lv_star .fa{width: 17px;margin-left: -3px;}
.newrep .info_left_div .new_rep_submit{width: 100%;height: 3.5rem;bottom: 2rem;left: 2rem;background-color: #efefef;outline:none;font-size:24px;font-weight:600;color: #000;}
.newrep .info_left_div .new_rep_submit:active{filter:drop-shadow(0 0 5px #ffffffbb)}
.newrep .info_left_div .new_rep_submit:disabled{background-color: #4c4c4c;color: #636363;}

.newrep .info_left_div .err_msg{position:absolute;display: none;top: 200px;right: 0;left: 0;width: 600px;margin: auto;z-index: 10;box-shadow: 1px 1px 60px #000;}

.newrep .info_right_div{position:relative;display: block;width: calc(100% - 22rem);height: 100%;margin-left: 22rem;}
.newrep .info_time_div{position:relative;width:100%;height: 7rem;padding: 1rem 2rem;border-bottom: 1px solid #ffffff3d;}
.newrep[data-challenge="fortime"] .info_time_div{display:none}
.newrep .new_option_time{width:100%; height:100%}
.newrep .new_option_time .time_div{position:relative;float: left;width: 12rem;height: 100%;margin-right: 1.5rem;}
.newrep .new_option_time label{position: absolute;color: #ffffff;}
.newrep .new_option_time .total_time_lbl{color:#ffffff}
.newrep .new_option_time p{position:absolute;bottom: 1.2rem;margin: 0;right: 1rem;color:#6d6d6d;}
.newrep .new_option_time input{width: 100%;height: 3rem;margin-top: 1.5rem;background-color: #00000061;border: 2px solid #ffffff8a;color:#fff;text-align:center;font-size:20px;outline:none;}
.newrep .new_option_time input:active, .newrep .new_option_time input:focus{border-color:#ffffff; color:#ffffff; filter:drop-shadow(0 0 5px #ffffffbb)}

.newrep #spinner{width: 100%;top: 0;bottom: 0;}
.newrep #spinner div{width:40px;height:40px;background: #FFC107;}
.newrep #loading_porgress{position:absolute; width:200px; top:350px; right:0; left:0; margin:auto}

.newrep .info_video_div{width:100%;height: calc(100% - 7rem);padding: 1rem;}
.newrep[data-challenge="fortime"] .info_video_div{height:100%}
.newrep .info_video_div #vids_sortable{display: block;width: 100%;height: 100%;margin: 0;padding:10px;overflow: auto;}
.newrep #vids_sortable #add_wk{width:11rem;height:11rem;margin: 1rem;background: none;border: 3px solid #ffffff8a;/* border-radius: 10px; */color: #ffffff8a;font-size: 40px;font-weight: 600;outline: none;}
.newrep #vids_sortable #add_wk:active, .newrep #vids_sortable #add_wk:hover{border-color:#fff; color:#fff; filter: drop-shadow(0 0 5px #ffffffbb)}
.newrep #vids_sortable .vid_li{position:relative;float: left;width: 13rem;padding: 1rem;background: none;border: 0;list-style-type:none;color:#fff;}
.newrep #vids_sortable .vid_play{width: 100%;}
.newrep #vids_sortable p{height: 35px;margin: 0;margin-top: 0px;font-size: 14px;line-height: 15px;text-align:center;word-break:keep-all;}
.newrep #vids_sortable .vid_del{position:absolute;top: 1.1rem;right: 1.1rem;width: 2rem;height: 2rem;/* border-radius: 50%; */background: #383838;border: none;color: #fff;outline: none;}
.newrep #vids_sortable .vid_del:active{background-color: #790022;}
.newrep #vids_sortable .wk_count_div{position:relative; text-align:center}
.newrep #vids_sortable .wk_count_div span{position:absolute;top: .5rem;right: 2.5rem;color: #ffffff8a;}
.newrep #vids_sortable .wk_count{width: 70%;height: 2.5rem;padding: 0 .5rem;background: #00000061;border: 2px solid #ffffff8a;color: #ffffff8a;font-size: 24px;line-height: 10px;text-align: center;outline:none;}
.newrep #vids_sortable .wk_count:active, .newrep #vids_sortable .wk_count:focus{border-color:#ffffff; color:#ffffff; filter:drop-shadow(0 0 5px #ffffffbb)}
.newrep #vids_sortable .wk_count:hover{background-color:#5a5a5a61; border-color:#fff; color:#fff}

/* challenge/rep_edit */
.row.rep_edit{position: relative;}
.rep_edit .contents_wrapper{display:none}
.rep_edit .contents_wrapper.active{position: relative;display:block;height: calc(100% - 6rem);}
.rep_edit .contents_wrapper.page2{position:absolute; z-index:9; width:calc(100% - 4rem); top:0; left:0; right:0; margin:auto; background:#00000087; border:5px solid #fff; border-radius:10px}

.rep_edit .contents_wrapper.page2 .page_close_btn{position:absolute;width: 12rem;height: 5rem;top:.5rem;right:.5rem;padding-bottom: 1rem;background: #fff;font-size: 40px;color: #353535;outline: 0;text-align: center;font-weight: 600;}
.rep_edit .contents_wrapper.page2 .page_close_btn:active{color:#fff; filter: drop-shadow(0 0 5px #ffffffbb)}
.rep_edit .contents_wrapper.page2 .page_close_btn img{height: 90%;filter: invert(20%);}

.rep_edit .new_rep_div{width: 100%;height: 100%;top: 0;right: 0;}
.rep_edit .new_rep_div .err_msg{display:none}

.rep_edit #modal_mask{z-index:8; background:#000000c7}

.rep_edit .rep_info_div{height:100%;}
.rep_edit .info_left_div{position: absolute;display: table-cell;width: 22rem;height: 100%;padding: 1rem 3rem;border-right: 1px solid #ffffff3d;vertical-align: top;text-align: center;}
.rep_edit .info_left_div .info_div{width:100%;/* height:60px; */margin-bottom: 2rem;padding: 0;font-size:20px;text-align: left;}
.rep_edit .info_left_div .info_div .row_div_lbl{width: 110px;margin: 0;padding-right:10px;color: #ffffff;}
.rep_edit .info_left_div .info_div #re_mb,
.rep_edit .info_left_div .info_div #re_type,
.rep_edit .info_left_div .info_div input[type="text"]{width: 100%;height: 50px;padding: 5px;background: #00000061;border: 2px solid #ffffff8a;border-radius: 0;color: #ffffff8a;outline: none;text-align: center;}
.rep_edit .info_left_div .info_div .new_mb_p{width:100%; color:#fff; text-align:center}

.rep_edit .info_left_div .dropdown.show #re_mb,
.rep_edit .info_left_div .dropdown.show #re_type,
.rep_edit .info_left_div .info_div input[type="text"]:active,
.rep_edit .info_left_div .info_div select:focus,
.rep_edit .info_left_div .info_div input[type="text"]:focus{border-color:#ffffff; color:#ffffff; filter:drop-shadow(0 0 5px #ffffffbb)}

.rep_edit .info_left_div .dropdown #re_mb:hover,
.rep_edit .info_left_div .dropdown #re_type:hover,
.rep_edit .info_left_div .info_div input[type="text"]:hover,
.rep_edit .info_left_div .info_div select:hover{background: #5a5a5a61;border-color:#fff;color:#fff;}

.rep_edit .info_left_div .dropdown-menu{padding:0; border:2px solid #ffffff; border-radius:0}
.rep_edit .info_left_div .dropdown-menu .dropdown-item{width: 245px;height: 40px;background: #000;color: #fff; outline:0}
.rep_edit .info_left_div .dropdown-menu .dropdown-item:active{background-color:#ffffff; color:#000}
.rep_edit .info_left_div .dropdown-menu .dropdown-item:hover{background-color:#b9b9b9; color:#000}
.rep_edit .info_left_div input[type="radio"]{display:none;}
.rep_edit .info_div .lv_radio{text-align:center}
.rep_edit .info_div .lv_star{width:60px;height:60px;margin: 10px 3px;padding: 17px 0;background: #1d1d1d;border-radius: 50%;text-align: center;color: #969696;font-size: 18px;}
.rep_edit .info_div .lv_star:hover{background: #5a5a5a61;}
.rep_edit .info_left_div input[type="radio"]:checked + .lv_star{background-color: #ffffff;color: #000;}
.rep_edit .info_left_div input[type="radio"]:checked + .lv_star:active{filter: drop-shadow(0 0 5px #ffffffbb)}
.rep_edit .info_div .lv_star .fa{width: 17px;margin-left: -3px;}
.rep_edit .info_left_div .rep_edit_submit{width: 100%;height: 3.5rem;bottom: 2rem;left: 2rem;background-color: #efefef;border:0;outline:none;font-size:24px;font-weight:600;color: #000;}
.rep_edit .info_left_div .rep_edit_submit:active{filter:drop-shadow(0 0 5px #ffffffbb)}
.rep_edit .info_left_div .rep_edit_submit:disabled{background-color:#323232;color: #525252;}

.rep_edit .info_left_div .err_msg{position:absolute;display: none;top: 200px;right: 0;left: 0;width: 600px;margin: auto;z-index: 10;box-shadow: 1px 1px 60px #000;}

.rep_edit .info_right_div{position:relative;display: block;width: calc(100% - 22rem);height: 100%;margin-left: 22rem;}
.rep_edit .info_time_div{position:relative;width:100%;height: 7rem;padding: 1rem 2rem;border-bottom: 1px solid #ffffff3d;}
.rep_edit[data-challenge="fortime"] .info_time_div{display:none}
.rep_edit .new_option_time{width:100%; height:100%}
.rep_edit .new_option_time .time_div{position:relative;float: left;width: 12rem;height: 100%;margin-right: 1.5rem;}
.rep_edit .new_option_time label{position: absolute;color: #ffffff;}
.rep_edit .new_option_time .total_time_lbl{color:#ffffff}
.rep_edit .new_option_time p{position:absolute;bottom: 1.2rem;margin: 0;right: 1rem;color:#6d6d6d;}
.rep_edit .new_option_time input{width: 100%;height: 3rem;margin-top: 1.5rem;background-color: #00000061;border: 2px solid #ffffff8a;color:#fff;text-align:center;font-size:20px;outline:none;}
.rep_edit .new_option_time input:active, .rep_edit .new_option_time input:focus{border-color:#ffffff; color:#ffffff; filter:drop-shadow(0 0 5px #ffffffbb)}

.rep_edit #spinner{width: 100%;top: 0;bottom: 0;}
.rep_edit #spinner div{width:40px;height:40px;background: #FFC107;}
.rep_edit #loading_porgress{position:absolute; width:200px; top:350px; right:0; left:0; margin:auto}

.rep_edit .info_video_div{width:100%;height: calc(100% - 7rem);padding: 1rem;}
.rep_edit[data-challenge="fortime"] .info_video_div{height:100%}
.rep_edit .info_video_div #vids_sortable{display: block;width: 100%;height: 100%;margin: 0;padding:10px;overflow: auto;}
.rep_edit #vids_sortable #add_wk{width:11rem;height:11rem;margin: 1rem;background: none;border: 3px solid #ffffff8a;/* border-radius: 10px; */color: #ffffff8a;font-size: 40px;font-weight: 600;outline: none;}
.rep_edit #vids_sortable #add_wk:active, .rep_edit #vids_sortable #add_wk:hover{border-color:#fff; color:#fff; filter: drop-shadow(0 0 5px #ffffffbb)}
.rep_edit #vids_sortable .vid_li{position:relative;float: left;width: 13rem;padding: 1rem;background: none;border: 0;list-style-type:none;color:#fff;}
.rep_edit #vids_sortable .vid_play{width: 100%;}
.rep_edit #vids_sortable p{height: 35px;margin: 0;margin-top: 0px;font-size: 14px;line-height: 15px;text-align:center;word-break:keep-all;}
.rep_edit #vids_sortable .vid_del{position:absolute;top: 1.1rem;right: 1.1rem;width: 2rem;height: 2rem;/* border-radius: 50%; */background: #383838;border: none;color: #fff;outline: none;}
.rep_edit #vids_sortable .vid_del:active{background-color: #790022;}
.rep_edit #vids_sortable .wk_count_div{position:relative; text-align:center}
.rep_edit #vids_sortable .wk_count_div span{position:absolute;top: .5rem;right: 2.5rem;color: #ffffff8a;}
.rep_edit #vids_sortable .wk_count{width: 70%;height: 2.5rem;padding: 0 .5rem;background: #00000061;border: 2px solid #ffffff8a;color: #ffffff8a;font-size: 24px;line-height: 10px;text-align: center;outline:none;}
.rep_edit #vids_sortable .wk_count:active, .rep_edit #vids_sortable .wk_count:focus{border-color:#ffffff; color:#ffffff; filter:drop-shadow(0 0 5px #ffffffbb)}
.rep_edit #vids_sortable .wk_count:hover{background-color:#5a5a5a61; border-color:#fff; color:#fff}

.rep_edit .gear_list_div{position: absolute;display: block;width: 15rem;height: 100%;top: 0;left: 2rem;margin: 0;}
.rep_edit .gear_list{position: relative;width: 100%;height: 100%;flex-wrap:nowrap;flex-direction: row;overflow-y: auto;overflow-x: hidden;margin-top: 5rem;padding: 2rem .5rem;}
.rep_edit .gear_list .gear{position: relative;display: inline-block;flex: 0 0 auto;width: 100%;height: 4rem;margin: 0 .2rem;background: none;border: none;text-shadow: none;font-size: 18px;font-weight: 400;white-space: inherit;line-height: 1;outline: none;color: #e0e0e0;}
.rep_edit .gear_list .gear:not(.active):hover{background:#46464678}
.rep_edit .gear_list .gear.active{border: 2px solid #fff;filter: drop-shadow(0px 0px 3px #ffffffaa);color: #fff;}
.rep_edit .gear_list .gear img{position: absolute;width: 4rem;top: 0;bottom: 0;left: 0;margin: auto;padding: 0 .5rem;text-align: center;filter: brightness(100);}
.rep_edit .gear_list .gear[data-gear="cfsc"] img, .rep_edit .gear_list .gear[data-gear="stc"] img{filter:drop-shadow(0 0 2px white)}
.rep_edit .gear_list .gear p{position:absolute;height: 1.2rem;top: 0;bottom: 0;left: 0;margin: auto;margin-left: 4.5rem;}

.rep_edit .workout_wrapper{width:100%;height: calc(100% - 12rem);margin-top: 4rem;overflow: hidden;}
.rep_edit .workout_wrapper .wk_list_div{display:none;width:100%;height:100%;overflow-y: auto;}
.rep_edit .workout_wrapper .wk_list_div.active{display:block}
.rep_edit .workout_wrapper .scroll_shadow_div.top{left:2rem;background: linear-gradient(to bottom, #0b0b0b 40%,#00000000 100%);}
.rep_edit .workout_wrapper .scroll_shadow_div.bottom{bottom: 1rem;left:2rem;background: linear-gradient(to top, #070707 40%,#00000000 100%);}

.rep_edit .wk_div{width: calc(100% - 21rem);height: 100%;margin-left: 19rem;}
.rep_edit .wk_div .wk_list_head{width: 100%;height: 5rem;margin-bottom: .2rem;padding-top: 8rem;}
.rep_edit .wk_div .wk_div_wrapper{width:100%;height: calc(100% - 3rem);overflow-y: auto;}

.rep_edit .search_div{position:relative;width: 100%;top: 0;right: 0;margin: auto;font-weight: 600;}

.rep_edit .wk_div .wk_div_lbl{width:100%;margin:0;border: none;color: #ffffff;font-size:24px;font-weight:600;}
.rep_edit .sub_body .wk_div_wrapper{height: 450px;padding: 20px 75px;overflow: auto;background: #2a2a2a;}
.rep_edit .wk_div .wk_btn{position:relative;display: none;width: 25%;padding: .1rem;background: #000000aa;border:none;}
.rep_edit .wk_div .wk_btn img{width: 100%;opacity: .7;}
.rep_edit .wk_div .wk_btn.active{display: inline;}
.rep_edit .wk_div .wk_btn.selected .selected_number_div{position:absolute;}
.rep_edit .wk_div .wk_btn.selected .selected_number_div{z-index:5; width:1.5rem; height:1.5rem; background:#000;color:#fff; font-weight:600}
.rep_edit .wk_div .wk_btn.selected img{opacity: 1;}
.rep_edit .wk_div .wk_btn .wk_vid_div{position:absolute;width:calc(100% - .2rem); top:.1rem}
.rep_edit .wk_div .wk_btn .wk_vid_div video{width:100%}
.rep_edit .wk_div .wk_btn p{height:40px;word-break:keep-all;color:#fff;font-size: 14px;}
.rep_edit .wk_div .wk_btn .wk_type{position:absolute; top:.5rem; right:.5rem; color:#353535; font-weight:600}
.rep_edit .wk_div .wk_btn .wk_level{position:absolute;bottom: 3.5rem;right: .5rem;color: #ffffff; }
.rep_edit .wk_div .wk_btn.selected .wk_level, .newrep .wk_div .wk_btn:hover .wk_level{color:#FFC107}

/* circuit detail */
.challenge_detail .detail_body{position: absolute;display: table;width: 100%;height: calc(1920px - 45rem);top: 0;bottom: 0;margin: auto;padding: 2rem 2.5rem;}
.challenge_detail .detail_body .circuit_info{display:table;margin: auto;}
.challenge_detail #loading_porgress{position:absolute;z-index:3;width: 100%;height: 2rem;right:0;left:0;top: 40rem;margin:auto;border-radius: 0;background: #ffffff40;overflow: inherit;}
.challenge_detail #loading_porgress .progress-bar{height:100%;background: #fff;filter: drop-shadow(0 0 5px #ffffffaa);}

.challenge_detail .bottom_btn_div{position: absolute;width:100%;bottom: 8%;left: 0;text-align:center;}
.challenge_detail .bottom_btn_div button{position: relative;width: 20rem;height: 6rem;margin: 0 .5rem;padding-left: 3rem;background: #fffffff0;color:#353535;font-size: 24px;font-weight:600;}
.challenge_detail .bottom_btn_div button:disabled{filter:brightness(30%)}
.challenge_detail .bottom_btn_div .icon_div{position: absolute;width: 7rem;height: 100%;top: 0;left: 0;}
.challenge_detail .bottom_btn_div .icon_div img{height:100%}

.challenge_detail .workout_wrapper{display: table;min-height: 740px;}
.challenge_detail .workout_wrapper.over6{max-height: 740px;width: 810px;margin: auto;}
.challenge_detail .workout{position: relative;float:left;width: 313px;margin: 0 10px 20px;}
.challenge_detail .workout.over6{width: 260px;margin: 5px;}
.challenge_detail .workout .preview{max-width: 320px;width:100%;}
.challenge_detail .workout_wrapper .workout .video_label{margin: 0;margin-right: 5px;color:#fff;font-size: 30px;font-style:italic;vertical-align: sub;}
.challenge_detail .workout_wrapper .workout .option{margin: 0;margin-bottom: 40px;color: #ff9a01;text-align: center;font-size: 26px;font-weight: 800;}
.challenge_detail .workout .workout_name{height: 36px;margin: 0;font-size: 18px;text-align: center;font-weight: 800;color: #fff;line-height: 24px;word-break: keep-all;}
.challenge_detail .set_round{position: absolute;width: calc(100% - 6rem);top: 1rem;left: 0;margin-left: 6rem;padding: 0 25px;border-radius: 10px;text-align: center;}
.challenge_detail .set_round p{margin: 0;color: #ffffff;font-size: 30px;font-weight: 700;}
.challenge_detail .set_div{position: absolute;width: 21.5rem;height: 15rem;bottom: 0;left: 0;}
.challenge_detail .next_div{position: absolute;width: 1080px;bottom: 0;left: 0;text-align: center;}
.challenge_detail .round_next{position: absolute;width: 46rem;height: 15rem;bottom: 0;right: 0;margin: 0;border-radius: 0;background-color: #ffffff;color: #1d1d1d;font-size: 70px;font-weight: 900;}
.challenge_detail .round_next:active{background-color: #ffc800; outline:none}

.challenge_detail .set_setting_div{position: absolute;width: 21.5rem;height: 15rem;bottom: 0;left: 0;padding-top: 20px;padding-left: 22px;margin: auto;background: #000;}
.challenge_detail .set_setting_div #set{position: absolute;width: calc(100% - 6rem);top: 5rem;margin-left: 6rem;font-size:100px;line-height:110px;color: #ff9a01 !important;font-size: 100px;font-weight:800;line-height:90px;text-align:center;}
.challenge_detail .set_setting_div .set_setting_btn{position:absolute;width:6rem;height:7.5rem;left: 0;padding:2rem;background-color: #ffffff;font-size:40px;border: none;outline: none;}
.challenge_detail .set_setting_div .set_setting_btn:active{background-color:#ff9a01}
.challenge_detail .set_setting_div .set_setting_btn.up{border-bottom:1px solid #000}
.challenge_detail .set_setting_div .set_setting_btn.down{bottom:0}

.challenge_detail .round_scroll_div{position:relative;display: -webkit-box;width: 320px;height: 140px;margin: 0 auto;overflow: -webkit-paged-x;}
.challenge_detail .round_scroll_div::-webkit-scrollbar{width:0}
.challenge_detail #round_scroll{display: inline-flex;height: 120px;left: -290px;margin: auto;text-align: center;font-weight: 800;border-top: 1px solid #585858;border-bottom: 1px solid #585858;/* background: -webkit-linear-gradient(left, rgb(29, 29, 29) 32%,rgba(255, 255, 255, 0.2) 47%,rgba(255, 255, 255, 0.2) 53%,rgb(29, 29, 29) 68%); */}
.challenge_detail #round_scroll div{float: left;width: 100px;height: 90px;margin: auto;font-size: 70px;line-height: 90px;color: #ff0000;}
.challenge_detail #round_scroll div:nth-child(4), .challenge_detail #round_scroll div:nth-child(5), .challenge_detail #round_scroll div:nth-child(6){color:#989898}
.challenge_detail #round_scroll div.active{height: 110px;margin:0;font-size: 100px;line-height: 110px;color: #ff9a01 !important;}
.challenge_detail #round_scroll div:nth-child(4){background: -webkit-linear-gradient(left, #1d1d1d, #9a9a9a);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.challenge_detail #round_scroll div:nth-child(6){background: -webkit-linear-gradient(left, #9a9a9a, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}

/* loading */
.row.loading{display: flow-root;right:0;left:0;margin:auto; opacity:0}
.loading .progress{position:absolute;display: none;z-index: 1;width: 440px;height: 145px;top: 16rem;right:0;left:0;margin: 0 0 0 340px;background: #4d4d4d;}
.loading .progress .progress-bar{height: 145px;background-color: #FFC107;}
.loading .bg_img{position:absolute;z-index:2}
.loading .timer_circle{position:absolute;display: block;z-index: 10;width: 120px;top: 14rem;right: 0;left: 0;margin: auto;}
.loading .timer_circle .circle{float: left;width: 20px;height: 20px;margin: 2px;border: 2px solid #FFC107;border-radius: 50%;}
.loading .timer_circle .circle.active{background-color: #FFC107;}

.loading .timer{position:absolute;z-index: 3;width: 300px;height: 100px;top: 350px;left: 300px;}
.loading h1{margin: 320px 0 150px;color: #fff;text-align: center;font-size: 100px;font-weight: 600;}
.loading .time_circles canvas{display:none}
.loading .time_circles .textDiv_Seconds{display: none;}
.loading .time_circles .textDiv_Millisec{display: none;}
.loading .time_circles .textDiv_Seconds h4{display:none}
.loading .bg_circle{position: absolute;top: 500px;z-index: 0;}

.loading #sound_player{z-index:5;background: #0000000d!important;text-shadow: 10px 9px 20px #00000047;}
.loading #sound_player p{font-size:400px;line-height:400px;}

/* rest_time */
.row.rest_time{display: flow-root; opacity:0}
.row.rest_time #spinner{bottom:1100px}
.row.rest_time #spinner div{width: 40px;height: 40px;background: #FF9a03;}
.rest_time .progress{position:absolute; display:none;z-index: 1;width: 700px;height: 145px;top: 420px;right:0;left:0;margin: 0 0 0 196px;background: #4d4d4d;}
.rest_time .progress .progress-bar{height: 145px; background-color:#ff9a01}
.rest_time .bg_img{position:absolute; z-index:2}

.rest_time .timer{position:absolute;z-index: 4;width: 808px;top: 400px;right: 0;left: 31px;margin: 70px auto;}
.rest_time h1{margin: 320px 0 150px;color: #fff;text-align: center;font-size: 100px; font-weight: 700}
.rest_time .time_circles canvas{display:none}
.rest_time .time_circles .textDiv_Seconds{display:none}
.rest_time .time_circles .textDiv_Millisec{display:none}
.rest_time .bg_circle{position: absolute;top: 500px;z-index: 0;}

.rest_time #sound_player{z-index:5;background: #0000000d!important;text-shadow: 10px 9px 20px #00000047;}
.rest_time #sound_player p{width:56rem; height:30rem; font-size:400px; line-height:400px}
.rest_time #sound_player .ready{width:56rem;height: 15rem;font-size: 220px;line-height: 220px;}

/* complete */
.row.complete{display: flow-root;overflow: hidden;}
.complete .timer{position:absolute;z-index:1;width: 808px;right: 0;left: 12px;margin: 70px auto;}
.complete h1{margin: 360px 0 0;color: #fff;text-align: center;font-size: 120px; font-weight: 700; font-style: italic}
.complete h3{margin: 10px;color: #fff;text-align: center;font-size: 70px; font-weight: 100; font-style: italic}
.complete .timer{display: none}

.complete div::-webkit-scrollbar-track, .complete ul::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.18);border-radius: 0px;background-color: #ffffff3b;}
.complete div::-webkit-scrollbar, .complete ul::-webkit-scrollbar{width: 5px;height: 5px;background-color: #00000087;}
.complete div::-webkit-scrollbar-thumb, .complete ul::-webkit-scrollbar-thumb{border-radius: 1px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ffffff94;}

.complete .rep_result_div{position: absolute;width: 100%;height: 100%;top: 0;right:0;left:0;margin:auto;background-color: #0000008c;color:#fff;text-align:center;}
.complete .rep_result_div .rep_result_title{width:100%;height: 100px;padding: 100px;text-align:center;color: #ffffff;font-size: 70px;font-weight: 900;font-style: italic;}
.complete .rep_result_div .result_wrapper{width:100%;height: 100%;max-height: 90rem;overflow:auto;overflow-x: hidden;padding: 30px 0 20px;}
.complete .rep_result_div.amrap .result_wrapper{max-height: 65rem;}
.complete .mb_result{position:relative;display: flex;height: 3rem;margin-bottom: 15px;padding: 0 1rem;text-align: center;background-color: #ffffff24;}
.complete .fortime .mb_result.renew .result_time{-webkit-text-stroke: 1px #ffffff;-webkit-text-fill-color: #ff9a01;-webkit-animation: fill 0.5s infinite alternate;}

.complete .mb_result .mb_grade{position:absolute;z-index:3;top: .3rem;}
.complete .mb_result .total_point{position:absolute; top:.6rem; left:5rem; font-size:30px}
.complete .mb_result .total_point span{margin-right:.5rem; font-size:20px}
.complete .mb_result .mb_img_div{position: absolute;display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:center;width: 3rem;height: 3rem;top: 0;border-radius: 100%;overflow: hidden;}
.complete .mb_result .mb_img.landscape{height:100%; width:auto}
.complete .mb_result .mb_img.portrait{width:100%; height:auto}
.complete .mb_result .mb_name{position: absolute;top: .3rem;left: 10rem;margin: 0;padding: 0;font-size: 26px;font-weight: 600;}

.complete .fortime .mb_result .idx{position: absolute;width: 3rem;height: 3rem;top: 0;left: 5rem;margin: 0;margin-right: 100px;padding: 8px 0;background-color: #1f1f1f;font-size: 36px;font-weight: 600;line-height: 36px;text-align:center;}
.complete .fortime .mb_result.win .idx{background-color:#ff9a01}
.complete .fortime .mb_result .mb_img_div{left: 10em;}
.complete .fortime .mb_result .mb_name{left: 15rem;}

.complete .amrap .mb_result.active{background: linear-gradient(to right, rgb(255, 255, 255) 0%,rgba(255, 255, 255, 0.4) 43%,rgba(255, 255, 255, 0.08) 48%,rgba(255, 255, 255, 0) 100%);color:#2b2b2b;}
.complete .amrap .mb_result .idx{position: absolute;width: 3rem;height: 3rem;top: 0;left: 6rem;margin: 0;padding: 8px 0;background-color: #1f1f1f;font-size: 36px;font-weight: 600;text-align:center;line-height: 36px;}
.complete .amrap .mb_result.active .idx{background-color:#ff9a01}
.complete .amrap .mb_result .mb_img_div{left: 13rem;}
.complete .amrap .mb_result .mb_name{left: 17rem;}
.complete .amrap .mb_result .progress_div{position:absolute;width: 40rem;height: 100%;right:0;background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%,rgba(0,0,0,0.31) 47%,rgba(0, 0, 0, 0.47) 100%);}
.complete .amrap .mb_result .progress{position:absolute;height: 100%;background: linear-gradient(to right, rgba(255, 154, 1, 0) 0%,#ff9a019e 46%,rgb(255, 154, 1) 100%);border-radius:0;}
.complete .amrap .mb_result .progress_value{position:absolute;top: .3rem;right:2rem;margin-bottom: 0;font-size:26px;font-weight:600;color:#fff;font-style:italic;}

.complete .mb_result .result_time{position:absolute;top: .3rem;right: 4rem;margin:0;color: #ffffff;font-size: 26px;font-weight: 600;}
.complete .mb_result .add_point_div{position:absolute;top: 7px;right: 50px;font-size: 30px;font-weight: 900;}
.complete .mb_result .add_point{-webkit-text-stroke: 1px #ffffff;-webkit-text-fill-color: #ff9a01; -webkit-animation: fill 0.5s infinite alternate;}
@-webkit-keyframes fill {
  from {-webkit-text-stroke-color: #ffefd6; }
  to {-webkit-text-stroke-color: #ff9a01; }
}
.complete .finish_btn, .complete #amrap_report_btn, .complete #amrap_finish_btn{position: absolute;width: 25rem;height: 4rem;bottom: 3rem;left: 0;right: 0;margin: auto;background-color:#ff9a01;border:none;font-size:30px;font-weight:600;color:#1d1d1d;outline: none;}
.complete #amrap_finish_btn{display:none;bottom: 7rem;}
.complete .finish_btn:active, .complete #amrap_finish_btn:active{background-color:#ffc12b}

.complete .record_setting_div{position: relative;display: inline-block;width: 80%;height: 38rem;margin: auto;padding: 1rem;background: #0000006b;}
.complete .record_setting_div .label{border-bottom:1px solid}
.complete .record_set_div{position:absolute; display:none; width: 130px;height: 60px;left: 0;}
.complete .record_setting_div .record_set_div{position: relative;display:block;width: 14rem;height: 5rem;margin: auto;margin-bottom: 2rem;}
.complete .record_wk_div{position:absolute;display: none;width: 130px;height: 60px;right:100px;}
.complete .record_set_div .label, .complete .record_wk_div .label{right: 0;left: 0;margin: auto;font-size: 15px;}
.complete .down, .complete .up{position: absolute;z-index: 2;width: 4rem;height: 4rem;top: .2rem;background: #ff9a01;border: 0;border-radius: 100%;outline: none;color: #fff;}
.complete .down{left:0}
.complete .up{right:0}
.complete .down:active, .complete .up:active{background-color: #ffc12b}
.complete .record_set, .complete .record_wk{position: absolute;z-index: 1;width: 100%;top: 1rem;font-size: 40px;line-height: 33px;}
.complete .wk_list_div{position: relative;display: inline-block;width: 50rem;}
.complete .wk_btn{float:left;width: 10rem;height: 8rem;; border:0; background:none}
.complete .wk_img_div{width: 5rem;height: 5rem;margin:auto; }
.complete .wk_btn.active .wk_img_div img{filter: opacity(100%);}
.complete .wk_img_div img{width:100%;filter: opacity(40%);}
.complete .wk_name{display:inline-block;width: 10rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;}

.complete #rep_result{position:absolute;width:100%;height: 90rem;overflow-y: auto;}
.complete .amrap_result{position:relative;display: flex;height: 3rem;margin-bottom: 15px;padding: 0 1rem;text-align: center;background-color: #ffffff24;}
.complete .amrap_result .idx{position: absolute;width: 3rem;height: 3rem;top: 0;left: 13rem;margin: 0;margin-right: 100px;padding: 8px 0;background-color: #1f1f1f;font-size: 36px;font-weight: 600;line-height: 36px;text-align:center;}
.complete .amrap_result.win .idx{background-color:#ff9a01}

.complete .amrap_result .mb_grade{position:absolute;z-index:3;top: .3rem;}
.complete .amrap_result .mb_img_div{position: absolute;display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:center;width: 3rem;height: 3rem;top: 0;left:19rem;border-radius: 100%;overflow: hidden;}
.complete .amrap_result .mb_img.landscape{height:100%; width:auto}
.complete .amrap_result .mb_img.portrait{width:100%; height:auto}
.complete .amrap_result .mb_name{position: absolute;top: .3rem;left: 24rem;padding: 0;font-size: 26px;font-weight: 600;}
.complete .amrap_result .record_value_div{position:absolute;top: 0;right: 50px;font-size: 30px;font-weight: 900;}
.complete .amrap_result.active .record_value_div .record_value{-webkit-text-stroke: 1px #ffffff;-webkit-text-fill-color: #ff9a01; -webkit-animation: fill 0.5s infinite alternate;}
@-webkit-keyframes fill {
  from {-webkit-text-stroke-color: #ffefd6; }
  to {-webkit-text-stroke-color: #ff9a01; }
}

/* challenge_play */
.challenge_play #sound_player{z-index: 7;}
.challenge_play .top_div{padding: 0;color: #fff;}
.challenge_play .top_div .round_div{position:relative;float:left;width: 15rem;height: 100%;padding: 1rem 0;text-align: center;font-size: 30px;line-height: 0.9;}
.challenge_play .top_div .round_div p{margin-bottom: .2rem;}
.challenge_play .top_div .round_div .round{letter-spacing: 4px;font-size: 60px;font-weight: 600;}
.challenge_play .top_div .round_div #round_count{color:#ff9a03}

.challenge_play .top_div .countdown{position: relative;display: block;width: calc(100% - 15rem);height: 100%;font-size: 30px;line-height: 1;font-weight: 800;}
.challenge_play .top_div .countdown p{position: absolute;top: .7rem;margin: 0;left: 1rem;}
.challenge_play .countdown .timer{position:absolute;display: table;width: 1rem;height: 1rem;top: 0;left: 0;}
.challenge_play .countdown .timer h4{display: none}
.challenge_play .countdown .progress{position: absolute;width: 100%;height: 100%;border-radius: 0;z-index: 0;margin: 0;background: #341f00cc;}
.challenge_play .countdown .progress #time_percent{background: #ff9a03;height: 100%;}
.challenge_play .countdown #clone{position:absolute;bottom: .7rem;margin-left: 1rem;font-size: 80px;}
.challenge_play .countdown #clone div, .challenge_play .countdown #clone span{float:left;}
.challenge_play .countdown #clone span{margin: 0 5px;}

.challenge_play .body_main .rep_name{width: 760px;margin: auto;margin-top: 3.5rem;font-family: Arial, Helvetica, sans-serif;text-align:center;color:#fff;white-space: nowrap;text-align: center;}
.challenge_play .body_main .rep_name h1{overflow: hidden;font-weight:600;text-overflow: ellipsis;}
.challenge_play .workout_wrapper{display: table;width: 760px;min-height: 1325px;top: 10rem;right: 0;left: 0;margin: auto;padding: 0 5px;}
.challenge_play .workout_wrapper.over6{width: 48rem;height: 49rem;}
.challenge_play .workout_wrapper .workout{position:relative;display: none;float:left;width: 48.9%;height: 407px;margin: 4px;}
.challenge_play .workout_wrapper.over6 .workout{width: 15.65rem;height: 16rem;margin: 1px;}
.challenge_play .workout_wrapper .workout .video_label{position:absolute;z-index: 4;top:5px;left:5px;border-radius:50%;color: #353535;font-size:40px;line-height: 40px;font-weight:600;}
.challenge_play .workout_wrapper.over6 .workout .video_label{}
.challenge_play .workout_wrapper .workout video{width: 100%;left: 0;}
.challenge_play .workout .wk_name{position:absolute;bottom: -3rem;color: #fff;font-size: 20px;font-weight: 600;}
.challenge_play .workout .wk_name.sub{bottom:-4rem}

.challenge_play .workout_wrapper .nextvid{position:absolute;display: none;width:300px;height: 300px;bottom: 0;right: 0;border: 7px solid #94949466;}
.challenge_play .workout_wrapper .nextvid.active{display:block}
.challenge_play .workout_wrapper .nextvid .video_label{position: absolute;width: 250px;top: 0;right: 0;left: 0;margin: auto;padding: 0;border-radius:50%;background: none;color: #82828282;font-size: 70px;line-height: 70px;text-align: center;font-weight: 600;}

.challenge_play .class_div{width: 200px;top:350px;right: 10px;color:#fff;}
.challenge_play .class_mb_list{position:absolute;top: 250px;padding: 1px;}
.challenge_play .class_div #class_mb_list_left{left:0}
.challenge_play .class_div #class_mb_list_right{right:0}
.challenge_play .class_mb_list .mb_info{position:relative;width: 122px;height: 134px;margin-bottom: 1px;padding:10px;background-color:#000;text-align:center;/* overflow: hidden; */}
.challenge_play .class_mb_list .mb_img_div{position: absolute;display: flex;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: center;width:5rem;height:5rem;left: 1.4rem;margin: auto;border-radius:100%;overflow:hidden;}
.challenge_play .class_mb_list .landscape{width: auto;height: 100%;}
.challenge_play .class_mb_list .portrait{width: 100%;height: auto;}
.challenge_play .class_mb_list .mb_name{margin:0}
.challenge_play .class_mb_list .mb_medal{position:absolute;z-index:2;bottom: .3rem;right: 0;}
.challenge_play .class_mb_list .mb_grade{position:absolute;z-index:1;width: 6rem;bottom: 0;left: .8rem;}

.challenge_play .class_mb_list.over6 .mb_info{width: 90px;height: 130px;}
.challenge_play .class_mb_list.over6 .mb_grade{width: 90px;top: 83px;left: 0;}
.challenge_play .class_mb_list.over6 .mb_medal{width:50px;top: 80px;left: 48px;}

/* challenge_play - interval */
.challenge_play.interval .workout_wrapper .workout{width:100%;margin: 50px 0;height: 800px;}
.challenge_play.interval .workout .this_wk{position:relative;float: left;display: inline-block;width:100%;}
.challenge_play.interval .sub_botton button{padding-right:50px}
.challenge_play.interval .sub_botton .icon_wrap{/* padding:5px; */}
.challenge_play.interval #reset .icon_wrap{padding: 8px;}

/* fortime/play */
.fortime_play .top_div{padding: 0;background:#002d5a91;color: #fff;}
.fortime_play .top_div .round_div{position:relative;float:left;width: 10rem;height: 100%;padding: 1.3rem 0;border-right: 1px solid #ffffff3d;text-align: center;font-size: 24px;line-height: 0.9;}
.fortime_play .top_div .round_div p{margin-bottom: .2rem;}
.fortime_play .top_div .round_div .round{letter-spacing: 4px;font-size: 60px;}
.fortime_play .top_div .round_div #round_count{color:#ff9a03}

.fortime_play .top_div a span{font-size:24px}
.fortime_play .top_div .fa{display:block;margin-bottom: 13px;font-size: 50px;}
.fortime_play .top_div span{font-weight:700;}

.fortime_play .top_div .countdown{width: 100%;font-size: 40px;line-height: 1;font-weight: 800;}
.fortime_play .countdown .timer{width: 0;height: 0;}
.fortime_play .top_div .timer canvas{display:none}
.fortime_play .top_div .countdown #clone{position: absolute;width: 35rem;top: 0;bottom: 0;right: 0;left: 0;margin: auto;font-size: 120px;color: #ffffff;}
.fortime_play .countdown #clone div{width: 160px;}
.fortime_play .countdown #clone div, .fortime_play .countdown #clone span{float:left}
.fortime_play .countdown #clone .backward, .fortime_play .countdown #clone #mil{margin-top: 0px; font-size:120px}

.fortime_play .body_main .rep_name{display:table;width: 750px;margin:auto;font-family: Arial, Helvetica, sans-serif;color: #fff;white-space: nowrap;text-align: center;}
.fortime_play .body_main .rep_name h1{width: 750px;margin: 70px 0 100px;font-size: 40px;text-align: center;color: #fff;overflow: hidden;}
.fortime_play .body_main .player_list_odd, .fortime_play .body_main .player_list_even{position: absolute;display: table;top: 0;width: 166px;}
.fortime_play .body_main .player_list_odd{left: 0;}
.fortime_play .body_main .player_list_even{right: 0;}

.fortime_play .workout_wrapper{position: absolute;width: 44rem;min-height: 1325px;right: 0;left: 0;margin: auto;}
.fortime_play .workout_wrapper .workout{position: relative;display: inline-block;float: left;margin: 0 3px;margin-bottom: 10px;width: 21.6rem;height: 28rem;}
.fortime_play .workout_wrapper .workout video{width: 100%;}
.fortime_play .workout_wrapper .workout:nth-child(even){float:unset}
.fortime_play .workout_wrapper .video_label{position: absolute;top: .5rem;left: .5rem;margin: 0;padding: 0;background: none;font-weight: 700;font-size: 40px;line-height: 40px;color: #353535;}
.fortime_play .workout_wrapper .workout .option{position: absolute;color:#fff;text-align: left;font-size: 20px;}

.fortime_play .class_div{width: 200px;top:350px;right: 10px;color:#fff;}
.fortime_play .class_mb_list{position:absolute;width: 165px;max-height: 1698px;top: 222px;/* overflow: auto; */padding:0;}
.fortime_play .class_div #class_mb_list_left{left:0;}
.fortime_play .class_div #class_mb_list_right{right:0}
.fortime_play .class_mb_list .mb_info{position:relative;width:165px;height: 100%;max-height: 165px;max-height: 165px;margin-bottom:2px;padding: 0;background-color:#333;border:0;text-align:center;outline:none;color:#fff;font-weight:600;}
.fortime_play .class_mb_list .mb_info:active{background-color:#ffc12b; color:#1d1d1d}
.fortime_play .class_mb_list .mb_info.active{background-color:#1871ad}
.fortime_play .class_mb_list .mb_record{position: absolute;width: 100%;top: 0;font-size: 24px;line-height: 24px;}
.fortime_play .class_mb_list .mb_img_div{position: absolute;display: flex;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: center;width:6rem;height:6rem;top: 2rem;left: 2rem;margin: auto;border-radius:100%;overflow:hidden;border: 3px solid #fff;}
.fortime_play .class_mb_list .mb_img_div .landscape{width: auto; height:100%}
.fortime_play .class_mb_list .mb_img_div .portrait{width: 100%; height:auto}
.fortime_play .class_mb_list .mb_name{position: absolute;bottom: .5rem;left: 4rem;}
.fortime_play .class_mb_list .mb_medal{position:absolute;z-index:2;top: 92px;left: 85px;}
.fortime_play .class_mb_list .mb_grade{position:absolute;z-index:1;width:120px;top: 95px;left:20px;}

/* amrap/play */
.amrap_play .top_div{padding: 0;background:#002d5a91;color: #fff;}
.amrap_play .top_div .round_div{position:relative;float:left;width: 12rem;height: 100%;padding: 1.3rem 0;border-right: 1px solid #ffffff3d;text-align: center;font-size: 24px;line-height: 0.9;}
.amrap_play .top_div .round_div p{margin-bottom: .2rem;}
.amrap_play .top_div .round_div .round{letter-spacing: 4px;font-size: 60px;}
.amrap_play .top_div .round_div #round_count{color:#ff9a03}

.amrap_play .top_div .countdown{position: relative;display: block;width: calc(100% - 12rem);height: 100%;font-size: 30px;line-height: 1;font-weight: 800;}
.amrap_play .top_div .countdown p{position: absolute;top: .7rem;margin: 0;left: 1rem;}
.amrap_play .countdown .timer{position:absolute;display: table;width: 1rem;height: 1rem;top: 0;left: 0;}
.amrap_play .countdown .timer h4{display: none}
.amrap_play .countdown .progress{position: absolute;width: 100%;height: 100%;border-radius: 0;z-index: 0;margin: 0;background: #341f00cc;}
.amrap_play .countdown .progress #time_percent{background: #ff9a03;height: 100%;}
.amrap_play .countdown #clone{position:absolute;bottom: .7rem;margin-left: 1rem;font-size: 80px;}
.amrap_play .countdown #clone div, .challenge_play .countdown #clone span{float:left;}
.amrap_play .countdown #clone span{float: left;margin: 0 5px;}

.amrap_play .body_main .rep_name{width: 760px;margin: auto;font-family: Arial, Helvetica, sans-serif;text-align:center;color:#fff;white-space: nowrap;text-align: center;}
.amrap_play .body_main .rep_name h1{display: inline-block;width: 680px;margin: 4rem 0;font-size: 40px;text-align: center;color: #fff;overflow: hidden;font-weight: 600;text-overflow: ellipsis;}
.amrap_play .body_main .player_list_odd, .amrap_play .sub_body .player_list_even{position: absolute;display: table;top: 0;width: 166px;}
.amrap_play .body_main .player_list_odd{left: 0;}
.amrap_play .body_main .player_list_even{right: 0;}
.amrap_play .workout_wrapper{display: table;width: 755px;min-height: 1325px;right: 0;left: 0;margin: auto;padding: 0 30px;}
.amrap_play .workout_wrapper .workout{position: relative;float: left;margin: 0 3px;margin-bottom: 10px;width: 341px;height: 27rem;}
.amrap_play .workout_wrapper .workout:nth-child(even){float:unset}
.amrap_play .workout_wrapper .workout video{width:100%}
.amrap_play .workout_wrapper .video_label{position: absolute;top: .5rem;left: .5rem;padding: 0;background: none;font-weight: 700;font-size: 50px;line-height: 50px;color: #353535;}
.amrap_play .workout_wrapper .workout .option{height: 50px;color:#fff;text-align: left;font-size: 20px;}

.amrap_play .class_div{width: 200px;top:350px;right: 10px;color:#fff;}
.amrap_play .class_mb_list{position:absolute;width: 165px;max-height: 1698px;top: 222px;/* overflow: auto; */padding:0;}
.amrap_play .class_div #class_mb_list_left{left:0;}
.amrap_play .class_div #class_mb_list_right{right:0}
.amrap_play .class_mb_list .mb_info{position:relative;width:165px;height: 100%;min-height: 140px;max-height: 165px;max-height: 165px;margin-bottom:2px;padding: 5px 0;background-color:#333;border:0;text-align:center;outline:none;color:#fff;font-weight:600;}
.amrap_play .class_mb_list .mb_info:active{background-color:#ffc12b; color:#1d1d1d}
.amrap_play .class_mb_list .mb_info.active{background-color:#1871ad}
.amrap_play .class_mb_list .mb_record{position: absolute;width: 100%;top: 0;font-size: 24px;line-height: 24px;}
.amrap_play .class_mb_list .mb_img_div{position: absolute;display: flex;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: center;width:6rem;height:6rem;top: .6rem;left: 2rem;margin: auto;border-radius:100%;overflow:hidden;border: 3px solid #fff;}
.amrap_play .class_mb_list .mb_img_div .landscape{width: auto; height:100%}
.amrap_play .class_mb_list .mb_img_div .portrait{width: 100%; height:auto}.amrap_play .class_mb_list .mb_name{position: absolute;top: 110px;left: 60px;}
.amrap_play .class_mb_list .mb_medal{position:absolute;z-index:2;bottom: 1.2rem;right: .6rem;}
.amrap_play .class_mb_list .mb_grade{position:absolute;z-index:1;width: 6rem;bottom: .8rem;left: 1.5rem;}

/* timer/timer_countdown */
.timer_countdown #time_set_bg{position: absolute;z-index: 1;width: 50rem;height: 18.3rem;top: 5.7rem;right: 0;left: 0;margin: auto;}
.timer_countdown .body_main .selected_box{position:absolute;top: 5.5rem;width: 100%;height:120px;right:0;left:0;margin:auto;background: #33333354;}
.timer_countdown .body_main .grid{position:absolute;top: 0;width: 100%;height: 100%;right:0;left:0;margin:auto;border-top:1px solid #323232;border-bottom:1px solid #323232;}
.timer_countdown .timeSet{position:relative;display: table;width: 50rem;height: 30rem;margin: auto;margin-top: 200px;margin-bottom: 200px;background: #0000006b;border-radius: 20px;font-family: Arial, Helvetica, sans-serif;}
.timer_countdown .timeSet .timeSet_child{position: absolute;z-index: 3;width: 200px;height: 470px;overflow: auto;text-align: center;font-weight: 800;}
.timer_countdown .timeSet .timeSet_child::-webkit-scrollbar{width:0}
.timer_countdown .timeSet .timeSet_child p{height: 90px;margin:0;font-size: 90px;line-height: 90px;color:#0c0c0c;}
.timer_countdown #minSet{left:10rem}
.timer_countdown #secSet{right:10rem}

.timer_countdown #minSet p:nth-child(29), .timer_countdown #minSet p:nth-child(30), .timer_countdown #minSet p:nth-child(31), .timer_countdown #secSet p:nth-child(30), .timer_countdown #secSet p:nth-child(31), .timer_countdown #secSet p:nth-child(32){color:#292b2c}
.timer_countdown .timeSet .timeSet_child p.active{height: 110px;margin:0;font-size: 140px;line-height: 110px;color: #ffffff!important;}
.timer_countdown .timeSet #minSet p:nth-child(28){background: -webkit-linear-gradient(#0c0c0c, #292b2c);-webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_countdown .timeSet #minSet p:nth-child(32){background: -webkit-linear-gradient(#292b2c, #0c0c0c);-webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_countdown .timeSet #secSet p:nth-child(29){background: -webkit-linear-gradient(#0c0c0c, #292b2c);-webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_countdown .timeSet #secSet p:nth-child(33){background: -webkit-linear-gradient(#292b2c, #0c0c0c);-webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0.3);}

.timer_countdown .timeSet .tag{position:absolute;z-index: 3;width: 60px;top: 15rem;margin: 0;font-size: 30px;font-weight: 800;color: #ffffff;}
.timer_countdown .timeSet .minutes{left:22rem}
.timer_countdown .timeSet .seconds{left:42rem}

.timer_countdown .clock{position:relative;}
.timer_countdown .timer{width: 1000px;margin: auto;margin-top: 100px;}
.timer_countdown .timer .textDiv_Minutes{display:none;}
.timer_countdown #clone{position:absolute;display: none;width: 717px;top: 180px;left:0;right:0;margin:auto;}
.timer_countdown #min, .timer_countdown #sec{top: 200px;left: 60px;color: #ffffff;font-size: 290px;font-family: 'ds-difib', Fallback, sans-serif;letter-spacing: -15px;line-height:230px;z-index: 1;}
.timer_countdown .colon{color:#fff;font-size: 50px;font-weight: 800;}
.timer_countdown #clone div{position: absolute;height: 230px;padding-right: 12px;}
.timer_countdown #clone div div.one{padding-right: 0;}
.timer_countdown #clone #min{width: 280px;text-align:right;}
.timer_countdown #clone #min div{width: 144px;text-align: right;}
.timer_countdown #clone #min .tens{left: 0px;}
.timer_countdown #clone #min .units{left: 133px;}
.timer_countdown #clone #sec{left: 390px;width: 270px;height: 250px;text-align: right;}
.timer_countdown #clone #sec div{width: 144px;text-align: right;}
.timer_countdown #clone #sec .tens{left: 0px;}
.timer_countdown #clone #sec .units{left: 133px;}

.timer_countdown #clone .colon{width: 100px;top: 195px;left: 350px;font-size: 150px;font-family: 'ds-difib', Fallback, sans-serif;}
.timer_countdown #clone .seven_segment{position:absolute; top:200px; color: #242424;font-size: 290px;font-family: 'ds-difib', Fallback, sans-serif;letter-spacing: -15px;line-height:230px; z-index:0}
.timer_countdown #clone .seven_segment.min{left:60px}
.timer_countdown #clone .seven_segment.sec{left:390px}

.timer_countdown .buttons{position: absolute;width: 1080px;text-align: center;}
.timer_countdown .buttons button{position: relative;width: 20rem;height: 6rem;margin: 0 5px;color: #fff;font-size: 30px;font-weight: 900;outline: none;text-align:center;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;}
.timer_countdown .buttons .time_set_btn{display:none;}
.timer_countdown .buttons span{position: absolute;top: 1.3rem;left: 2rem;right: 0;margin: auto;margin-right:30px;}
.timer_countdown .buttons .icon_wrap{position:absolute;float:left;width: 4rem;height: 4rem;top:0;bottom:0;left: 1rem;margin:auto;padding-top: .3rem;border-radius:50%;/* border: 3px solid #ffffffaa; */}
.timer_countdown .icon_wrap img{width: 80%;filter:invert(100%);}

.timer_countdown button:disabled{color:#696969}
.timer_countdown button:disabled .icon_wrap img{filter:invert(50%)}

.timer_countdown #playToggle{background-color: #00ce5e9c;}
.timer_countdown #playToggle.pause{background-color: #ffc107d1;}
.timer_countdown #cancel{background-color: #ff4c4cde;}

.timer_countdown #cancel:disabled{background:#616161b8}

/* timer/timer_stopwatch */
.timer_stopwatch .body_main{padding:100px 0}
.timer_stopwatch .body_main .clock{position: absolute;width: 100%;top: 7rem;}
.timer_stopwatch .body_main #Timer .time_circles{display:none}
.timer_stopwatch .body_main #clone{position:relative;display:table;width: 50rem;height: 18rem;margin:auto;background: #000000aa;border-radius: 10px;font-family: 'ds-difib';}
.timer_stopwatch #clone .unit_segment_div{position:absolute;height: 100%;width: 16rem;top: 0;padding: 1.5rem 0;font-size: 230px;line-height: 230px;color: #fff;text-align: center;z-index: 1;}
.timer_stopwatch .unit_segment_div .unit_segment{position:absolute;float:left;z-index:2;width: 130px;text-align: right;}
.timer_stopwatch .unit_segment_div .unit_segment.tens{left: 10px;padding-right: 10px;}
.timer_stopwatch .unit_segment_div .unit_segment.units{left: 128px;padding-right: 11px;}
.timer_stopwatch .unit_segment_div .unit_segment.one{padding: 0;}

.timer_stopwatch #clone #min{left: 0;}
.timer_stopwatch #clone #sec{left: 17rem;}
.timer_stopwatch #clone #mil{right: 0;}
.timer_stopwatch #clone .colon{position: absolute;left: 16rem;width: 1rem;line-height: 270px;background: none;font-size: 100px;color: #fff;}
.timer_stopwatch #clone .dot{position: absolute;left: 33rem;width: 50px;background: none;font-size: 100px;line-height: 320px;color: #fff;}

.timer_stopwatch .clock .tag_div{position: absolute;z-index: 5;display: flex;width: 100%;bottom: .5rem;right: 0;left: 0;margin: auto;color: #ffffffaa;}
.timer_stopwatch .clock .tag_div div{float:left;width: 33.33%;padding: 0 1rem;text-align:right;font-size: 40px;}

.timer_stopwatch .unit_segment_div .shadow{position:absolute;z-index: 1;width: 100%;background: none;color: #242424;text-align: center;box-shadow: none !important;}

.timer_stopwatch .buttons{position: absolute;display: block;width: 100%;top: 30rem;text-align: center;}
.timer_stopwatch .buttons button{position: relative;width: 20rem;height: 6rem;margin: 0 5px;color: #fff;font-size: 30px;font-weight: 900;outline: none;text-align:center;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;}
.timer_stopwatch .buttons span{position: absolute;top: 1.3rem;left: 2rem;right: 0;margin: auto;margin-right:30px;}
.timer_stopwatch .stopwatch .icon_wrap{position:absolute;float:left;width: 4rem;height: 4rem;top:0;bottom:0;left: 1rem;margin:auto;padding-top: .3rem;border-radius:50%;}
.timer_stopwatch .icon_wrap img{width: 80%;filter:invert(100%);}

.timer_stopwatch .buttons #lap{padding:0;text-align:center;background: #2196f3b5;}
.timer_stopwatch .buttons #lap:disabled{background:#38383861; color:#86828266}
.timer_stopwatch .buttons #lap span{margin: 0;left: 0;}

.timer_stopwatch .stopwatch .fa{color: #0c0c0c;}

.timer_stopwatch #playToggle{background-color:#00ce5e9c;}
.timer_stopwatch #playToggle.pause{background-color:#ffc107d1;}
.timer_stopwatch #reset{display:none;background-color:#ff4c4cde;}

.timer_stopwatch .record{position: absolute;display:none;width: 50rem;height: 58rem;top: 42rem;right: 0;left: 0;margin: auto;overflow: auto;}
.timer_stopwatch .record::-webkit-scrollbar{width: 3px; background-color: #040404;border-radius: 0;}
.timer_stopwatch .record::-webkit-scrollbar-thumb{background-color:#fff;border-radius: 0;}

.timer_stopwatch .record .record_child{width:100%;height: 60px;margin-bottom: 1px;padding: .6rem 3rem 0 3rem;background: #00000073;color:#fff;font-size: 26px;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;}
.timer_stopwatch .record .record_child.largest{color: #ff4c4c;}
.timer_stopwatch .record .record_child.lowest{color: #19ff82;}
.timer_stopwatch .record .record_child .record_time{float:right}

/* timer/timer_interval */
.timer_interval .body_main .head *{position: absolute; top:100px;font-size:100px; font-weight:800}
.timer_interval .timeSet{position:relative;display: block;width: 850px;height: 600px;margin: auto;margin-top: 200px;background: #000000a1;font-family: Arial, Helvetica, sans-serif;z-index : 999;}
.timer_interval .time_scroll{position:absolute;z-index: 2;}
.timer_interval #work_time{left: 0;}
.timer_interval #rest_time{left: 350px;}

.timer_interval #round{left: 675px;width: 200px;}

.timer_interval .timeSet .timeSet_child{position:relative; float: left;width: 135px;height: 470px;overflow: auto;text-align: right;font-weight: 800;}
.timer_interval .timeSet .timeSet_child::-webkit-scrollbar{width:0}
.timer_interval .timeSet .timeSet_child p{height: 90px;margin:0;padding-right: 10px;font-size: 70px;line-height: 90px;color: #2f2f2f;text-align: center;}
.timer_interval .minSet p:nth-child(29), .timer_interval .minSet p:nth-child(30), .timer_interval .minSet p:nth-child(31), .timer_interval .secSet p:nth-child(30), .timer_interval .secSet p:nth-child(31), .timer_interval .secSet p:nth-child(32){color: #2f2f2f;}
.timer_interval .timeSet .minSet p:nth-child(28){background: -webkit-linear-gradient(#1d1d1d, #444444);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_interval .timeSet .minSet p:nth-child(32){background: -webkit-linear-gradient(#444444, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_interval .timeSet .secSet p:nth-child(29){background: -webkit-linear-gradient(#1d1d1d, #444444);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_interval .timeSet .secSet p:nth-child(33){background: -webkit-linear-gradient(#444444, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_interval .timeSet .round_set p:nth-child(3){background: -webkit-linear-gradient(#1d1d1d, #444444);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_interval .timeSet .round_set p:nth-child(7){background: -webkit-linear-gradient(#444444, #1d1d1d);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0, 0, 0, 0.3);}
.timer_interval .time_scroll .timeSet_child p.active{height: 110px;margin:0;font-size: 100px;line-height: 110px;}
.timer_interval #work_time .timeSet_child p.active{color: #ff0101 !important;}
.timer_interval #rest_time .timeSet_child p.active{color: #ffffff !important;}
.timer_interval #round .timeSet_child p.active{color: #ff9a02 !important;}
.timer_interval .timeSet div h1{margin: auto;background: #121011;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;font-size: 30px;font-weight:800;text-align: center;}
.timer_interval #work_time .work_head{padding: 30px 110px;text-align: center;color: #ff0101;}
.timer_interval #rest_time .rest_head{padding: 30px 110px;color:#ffffff;}
.timer_interval #round .round_head{width: 150px;padding: 30px 10px;color: #ff9a02;}
.timer_interval .timeSet .tag{float:left;width: 40px;height: 470px;margin: 0;line-height: 6.6;font-size: 70px;font-weight: 800;text-align: center;}
.timer_interval #work_time .tag{color: #ff0101;}
.timer_interval #rest_time .tag{color: #ffffff;}
.timer_interval #round .round_set{width: 200px;text-align:center;}

.timer_interval .timeSet .selected_box{position:absolute;z-index: 1;width: 100%;height:100px;top: 285px;background: #2d2d2d66;}
.timer_interval .timeSet .grid{position:absolute;width: 100%;height: 280px;top: 190px; border-top: 1px solid #434343; border-bottom: 1px solid #434343;}

.timer_interval .clock{position:relative;}
.timer_interval .timer .textDiv_Minutes{display:none;}
.timer_interval .clock .work canvas, .timer_interval .clock .rest canvas{display:none}
.timer_interval .clock .active canvas{display:block;}

.timer_interval #roundDisplay{display: none;margin-top: 80px;font-size:100px;text-align:center;color:#fff;font-weight: 600;}
.timer_interval #roundDisplay p{margin:0}
.timer_interval #roundDisplay #setRound{color:#ffc12b}
.timer_interval .clone{position:absolute;display: none;width: 1000px;top: 240px;left:0;right:0;margin:auto;color:#fff;font-size:40px;text-align:center;font-weight: 800;line-height: 200px;}
.timer_interval .clone .work_head{font-size: 80px;color: #ff0101;}
.timer_interval .clone .seven_segment_div{position: relative;display: flex;font-family: 'ds-difib', Fallback, sans-serif;font-size: 300px;}
.timer_interval .clone .seven_segment_div div{float:left;font-size: 310px;}
.timer_interval .clone .seven_segment_div .unit_segment{position: absolute;z-index: 1;width: 170px;top: 0;padding-right: 13px;text-align: right;letter-spacing: -15px;}
.timer_interval .clone .seven_segment_div .unit_segment.units{left: 304px;}
.timer_interval .clone .seven_segment_div .unit_segment.tens{left: 146px;}
.timer_interval .clone .seven_segment_div .unit_segment.one{padding:0}

.timer_interval .clone .seven_segment_div .shadow_div{width: 865px;margin: auto;color:#2c2c2c;}
.timer_interval .clone .shadow_div .shadow_min{position: absolute;left: 160px;z-index: 0;}
.timer_interval .clone .shadow_div .shadow_sec{position: absolute;left: 525px;z-index: 0;}
.timer_interval .clone #min{position: relative;width: 500px;}
.timer_interval .clone .seven_segment_div .colon{position: absolute;right: 0;left: 0;width: 50px;height: 200px;margin: auto;font-size: 100px;line-height: 190px;z-index: 1;}
.timer_interval .clone #sec{position: relative;}

.timer_interval .clone .rest_head{font-size: 80px;color: #ff9a02;}
.timer_interval #work_clone{color: #fff;}

.timer_interval .buttons{position: absolute;width: 1080px;}

.timer_interval .buttons{width: 100%;margin-top: 70px;text-align: center;}
.timer_interval .buttons .scroll_set_btn{display:none}

.timer_interval .buttons button{position: relative;width: 20rem;height: 6rem;margin: 0 5px;color: #fff;font-size: 30px;font-weight: 900;outline: none;text-align:center;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;}
.timer_interval .buttons span{position: absolute;top: 1.3rem;left: 2rem;right: 0;margin: auto;margin-right:30px;}
.timer_interval .interval .icon_wrap{position:absolute;float:left;width: 4rem;height: 4rem;top:0;bottom:0;left: 1rem;margin:auto;padding-top: .3rem;border-radius:50%;}
.timer_interval .icon_wrap img{width: 80%;filter:invert(100%);}

.timer_interval #playToggle.play{background-color:#00ce5e9c;}
.timer_interval #playToggle.stop{background-color:#ff4c4cde;}

/* timer/timer_tabata */
.timer_tabata .tabata_info{position: absolute;width: 20rem;left: 50%;transform: translate(-50%, 0);margin: auto;margin-top: 4rem;}
.timer_tabata .tabata_info td{width: 115px;padding:10px 5px 2px;/* border: 1px solid #ffffff; */color: #ffffff;text-align:center;}
.timer_tabata .tabata_info h3{margin:0; font-size: 40px; font-weight:600}

.timer_tabata .clock{position: relative;margin-top: 20rem;}
.timer_tabata .timer .textDiv_Seconds{display:none;}
.timer_tabata .clock .work canvas, .timer_tabata .clock .rest canvas{display:none}
.timer_tabata .clock .active canvas{display:block;}

.timer_tabata #roundDisplay{position: absolute;display: none;bottom: 360px;right: 0;left: 0;margin: auto;font-size: 40px;text-align:center;color:#fff;font-weight:800;}
.timer_tabata #roundDisplay div{width: 280px;height: 70px;margin:auto;}
.timer_tabata #roundDisplay p{float:left;margin: 30px 10px 0 0;color: #ff9a02;}
.timer_tabata #roundDisplay .round{font-size: 80px;margin: 0;}

.timer_tabata .clone{position:absolute;display: none;width: 1000px;top: 210px;left:0;right:0;margin:auto;color:#fff;font-size: 30px;text-align:center;font-weight:800;line-height: 200px;}
.timer_tabata .clone .work_head{height: 100px;margin-top: 80px;font-size: 80px;line-height: 100px;}
.timer_tabata .clone #min{position:absolute;left: 180px;font-size:200px}
.timer_tabata .clone .colon{font-size:200px; line-height:160px;}
.timer_tabata .clone #sec{position: relative;width: 500px;height: 300px;margin: auto;font-size: 330px;font-family: 'ds-difib', Fallback, sans-serif;}
.timer_tabata .clone .unit_segment{position:absolute;z-index: 3;width: 200px;padding-right: 15px;top: 7px;right: 0;left: 0;text-align: right;}
.timer_tabata .clone .unit_segment.tens{left: 63px;}
.timer_tabata .clone .unit_segment.units{left: 232px;}
.timer_tabata .clone .unit_segment.one{padding:0}
.timer_tabata .clock .shadow_div{position:absolute;z-index: 1;display: none;width:400px;top: 250px;right:0;left:0;margin:auto;font-family: 'ds-difib', Fallback, sans-serif;font-size: 330px;text-align: center;}
.timer_tabata .clock .shadow_div .shadow{box-shadow: none !important;}

.timer_tabata .buttons{position: absolute;width: 20rem;top: 13rem;right: 0;left: 0;margin: auto;}
.timer_tabata #playToggle{position: relative;width: 100%;height: 80px;font-weight: 800;color: #fff;font-size: 24px;font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;outline: none;}
.timer_tabata #playToggle.play{background-color:#00ce5e9c;}
.timer_tabata #playToggle.stop{background-color:#ff4c4cde;}
.timer_tabata #playToggle .icon_wrap{position: absolute;width: 40px;height: 40px;top: 1rem;left: 6rem;padding: 2px;border-radius: 50%;color: #fff;}
.timer_tabata #playToggle span{margin-left: 30px;}
.timer_tabata #playToggle.play .icon_wrap{padding-left: 7px;}
.timer_tabata #playToggle.stop .icon_wrap{padding: 3px;font-size: 22px;}
.timer_tabata #playToggle .fa-play{color: #ffffff;}