@CHARSET "UTF-8";

/*===============================================================================
* 부트 스트랩을 최대한 건드리지 않고 필요한 부분만 사용할 수 있도록 합니다.
* 이곳은 사이트에 관련된 css파일입니다. 하나가 변경되면 전체적인 틀이 깨질 수 있습니다.
* 주석은 필수입니다. 
=================================================================================*/
/* 사이트 폰트를 설정합니다 */
@font-face {
 font-family: 'Noto Sans KR';
 font-weight:700;
 src: url("/assets/default/css/font/NotoSansKR-Bold.woff") format("woff");
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-weight:600;
  src: url("/assets/default/css/font/NotoSansKR-Medium.woff") format("woff");
  }
@font-face {
  font-family: 'Noto Sans KR';
  font-weight:500;
  src: url("/assets/default/css/font/NotoSansKR-Regular.woff") format("woff");
  }
@font-face {
  font-family: 'Noto Sans KR';
  font-weight:400;
  src: url("/assets/default/css/font/NotoSansKR-Light.woff") format("woff");
  }
@font-face {
  font-family: 'Noto Sans KR';
  font-weight:300;
  src: url("/assets/default/css/font/NotoSansKR-Thin.woff") format("woff");
  }          

body{font-family:;}
.text-overflow{overflow:hidden; text-overflow:ellipsis; white-space: nowrap;}

/* 버튼 커스텀 */
.btn.btn-info-new{background:rgba( 255, 255, 255, 0.0 ); border:2px solid #19a7ba !important; color:#000 !important; border-radius:7px !important;-webkit-transition: all ease-in 0.2s;transition: all ease-in 0.2s;}
.btn.btn-primary-new{background:rgba( 255, 255, 255, 0.0 ); border:2px solid #016d6f !important; color:#000 !important; border-radius:7px !important;-webkit-transition: all ease-in 0.2s;transition: all ease-in 0.2s;}
.btn.btn-warning-new{background:rgba( 255, 255, 255, 0.0 ); border:2pxs solid #fe6828 !important; color:#000 !important; border-radius:7px !important;-webkit-transition: all ease-in 0.2s;transition: all ease-in 0.2s;}
.btn.btn-danger-new{background:rgba( 255, 255, 255, 0.0 ) ; border:2px solid #bf2111 !important; color:#000 !important; border-radius:7px !important;-webkit-transition: all ease-in 0.2s;transition: all ease-in 0.2s;}
.btn.btn-success-new{background:rgba( 255, 255, 255, 0.0 ); border:2px solid #07885b !important; color:#000 !important; border-radius:7px !important;-webkit-transition: all ease-in 0.2s;transition: all ease-in 0.2s;}
.btn.btn-inverse-new{background:rgba( 255, 255, 255, 0.0 ); border:2px solid #293141; color:#000 !important; border-radius:7px !important;-webkit-transition: all ease-in 0.2s;transition: all ease-in 0.2s;} 

.btn.btn-info-new:hover{background-color:#5ad9e9;border-color:#5ad9e9;color:#ffffff;}
.btn.btn-info-new:active{background-color:#19a7ba !important;border-color:#19a7ba;-webkit-box-shadow:none;box-shadow:none;color:#fff}
.btn.btn-info-new:focus{-webkit-box-shadow:none;box-shadow:none;color:#fff;background-color:#5ad9e9}

.btn.btn-primary-new:hover{background-color:#01dbdf;border-color:#01dbdf}
.btn.btn-primary-new:active{background-color:#016d6f !important;border-color:#016d6f;-webkit-box-shadow:none;box-shadow:none;color:#fff}
.btn.btn-primary-new:focus{-webkit-box-shadow:none;box-shadow:none;color:#fff;background-color:#01dbdf}

.btn.btn-warning-new:hover{background-color:#feb798;border-color:#feb798}
.btn.btn-warning-new:active{background-color:#fe6828 !important;border-color:#fe6828;-webkit-box-shadow:none;box-shadow:none;color:#fff}
.btn.btn-warning-new:focus{-webkit-box-shadow:none;box-shadow:none;color:#fff;background-color:#feb798}

.btn.btn-danger-new:hover{background-color:#ef5f51;border-color:#5ad9e9}
.btn.btn-danger-new:active{background-color:#bf2111 !important;border-color:#bf2111;-webkit-box-shadow:none;box-shadow:none;color:#fff}
.btn.btn-danger-new:focus{-webkit-box-shadow:none;box-shadow:none;color:#fff;background-color:#5ad9e9}

.btn.btn-success-new:hover{background-color:#0df3a3;border-color:#0df3a3}
.btn.btn-success-new:active{background-color:#07885b !important;border-color:#07885b;-webkit-box-shadow:none;box-shadow:none;color:#fff}
.btn.btn-success-new:focus{-webkit-box-shadow:none;box-shadow:none;color:#fff;background-color:#0df3a3}

.btn.btn-inverse-new:hover{background-color:#546686;border-color:#546686}
.btn.btn-inverse-new:active{background-color:#293141 !important;border-color:#293141;-webkit-box-shadow:none;box-shadow:none;color:#fff}
.btn.btn-inverse-new:focus{-webkit-box-shadow:none;box-shadow:none;color:#fff;background-color:#546686}

.btn.btn-info-new.btn-sm{font-size:12px;}
.btn.btn-primary-new.btn-sm{font-size:12px;}
.btn.btn-warning-new.btn-sm{font-size:12px;}
.btn.btn-danger-new.btn-sm{font-size:12px;}
.btn.btn-success-new.btn-sm{font-size:12px;}
.btn.btn-inverse-new.btn-sm{font-size:12px;}

.btn.btn-info-new.btn-mini{font-size:10px;}
.btn.btn-primary-new.btn-mini{font-size:10px;}
.btn.btn-warning-new.btn-mini{font-size:10px;}
.btn.btn-danger-new.btn-mini{font-size:10px;}
.btn.btn-success-new.btn-mini{font-size:10px;}
.btn.btn-inverse-new.btn-mini{font-size:10px;}


/* 사물함 현황 (트레이너) */
.locker_bg{background:#fff; width:100%; z-index:99999;}
.locker_bg .locker_num_tab_box{margin-bottom:15px;}
.locker_bg .locker_num_tab_box.on{position:fixed;  padding:0px 55px 0; width:100%;  left:0; background:#fff; height:85px; z-index:99999;}
.locker_bg .locker_num_tab_box ul {overflow:hidden;}
.locker_bg .locker_num_tab_box ul li{float:left; width:25%;}
.locker_bg .locker_num_tab_box ul li a {text-align:center; display:block; font-size:18px; font-weight:600;padding:10px 0;}
.locker_bg .locker_num_tab_box ul li a.active{color:#01a9ac;}
.locker_bg .locker_num_tab_box.on h2{font-size:22px;}

/*
.locker_bg .locker_num_tab_box ul li:nth-child(1){border-bottom:4px solid #01a9ac;}
.locker_bg .locker_list_wrap {height:500px; overflow:hidden; overflow-y:scroll;}*/


.locker_bg > h2 { color:#000; font-size:26px; font-weight:500; margin-bottom:10px; margin-left:20px; margin-top:25px; }
.locker_bg .nav-tabs > li > a {font-size:16px;}
.locker_bg .nav-tabs > li > a.active{font-weight:700;}
.locker_bg .tab-content .row div{}
.locker_bg .locker_list_item {min-height:100px; width:10%;}

/* 파일 업로드 미리보기 */
.jFiler{width:100%;}
.fileUploadImgSub{width:50px;height:50px;}



/* 통합 검색 창 Tpye_1 */
.well.wc {width:900px; margin:0 auto;}
.well.searchTBox{background:none;border:none;box-shadow:none;padding-left:0; padding-right:0; margin-bottom:5px;}
.well .input-group-addon{background: #b9b9b9;}
.well .commonSearchBox.focus{display:block;}
.well .commonSearchBg {display:none; position:fixed;left:0;top:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}
.well .search_input_box{position:relative; min-width:250px !important; flex:unset;}
.well .search_input_box:focus{border:1px solid #ddd !important;}
.well .commonSearchBox{display:none; background:#fff; position:absolute; top:99%; width:100%; min-height:100px; z-index:2;  border:1px solid #ddd; padding:10px; box-shadow: 0 1px 20px 0 rgba(69,90,100,0.08); padding:15px;}
.well .commonSearchBox h4{display:none; text-align:center; color:#546686; margin-top:15px;}
.well .commonSearchBox label{color:#61686e; font-weight:600;}


/* 통합 검색 창 Tpye_2 */
.searchBox_type2{}
.searchBox_type2 #select2-search_cost_id-container{line-height:20px !important;}
.searchBox_type2 .select2-selection__arrow{top:6px !important;}
.searchBox_type2 .form-control {height: calc(2.25rem + 2px) !important;}
.searchBox_type2 .select2-container--default .select2-selection--single{}
.searchBox_type2 .select2-container--default .select2-selection--single .select2-selection__rendered {line-height:22px !important;}

/* 모든 테이블에 관련된 버티컬 얼라인을 미들로 만듭니다. */
table tr td {vertical-align:middle !important;}
table tr td .input-group {margin-bottom:0px;}




/* 출석 회원 리스트 */
.jg_visit_area {display:flex;  flex-wrap: wrap;  background:#f6f6f6; padding-left:0; padding-right:0;}
.jg_visit_area .user_visit_chk_list{flex-basis: 24%; padding:7px; }
.jg_visit_area .user_visit_chk_list .jg_bg{padding:5px; background:#fff; border:2px solid #ccc; border-radius:6px;}
.jg_visit_area .user_visit_chk_list .jg_bg .user_name_title{text-align:center; background:#f1f1f1; padding:8px 0; font-weight:600;  font-size:15px;}
.jg_visit_area .user_visit_chk_list .jg_bg .user_message_box{text-align:center; background:#fff; padding:8px 0; font-weight:600;  font-size:15px; color:#eb3422;} 
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents {display:flex; align-items:center;}
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .img_box{width:85px; height:85px; }
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .img_box img{width:85px; height:85px; object-fit: cover;}
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .user_info_box{flex-wrap: wrap;  padding-left:8px; width:auto; flex-grow:1; display:flex; flex:1;}
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .user_info_box .visit_chk_time{width:50%;  font-weight:600; font-size:18px; text-align:center; }
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .user_info_box .visit_chk_count{width:50%; font-weight:600; font-size:18px; text-align:center;}
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .user_info_box .visit_chk_count span{font-weight:bold; color:#0069d9; font-size:18px; margin-right:1px;}
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .user_info_box .user_use_product{/*flex:1 0 auto;*/ display:flex; flex-wrap: wrap; padding:10px 0; height:100px;}
.jg_visit_area .user_visit_chk_list .jg_bg .visit_contents .user_info_box .user_use_product li {/*width:23.5%;*/ margin-bottom:5px; margin-right:4px;}
.jg_visit_area .user_visit_chk_list .jg_bg .btn_in_out{display:flex;}
.jg_visit_area .user_visit_chk_list .jg_bg .btn_in_out > div {display:flex; flex-wrap: wrap; flex:1;}
.jg_visit_area .user_visit_chk_list .jg_bg .btn_in_out div .btn_boxt{margin-left:auto; margin-top:3px;}


/* 핸드폰번호 출석 체크 */
.center_visit_page_phone_check{text-align: center; padding:20px 0; background:#fff; width: 100%; font-size:22px; font-weight: bold; margin-bottom: 0px;}
.lt_number_box{position:relative; background:#f1f1f1; padding-left:0; padding-right: 0; min-height:500px;}
.lt_number_box > div {position:absolute;top:50%; left:50%; transform:translateX(-50%) translateY(-50%); }
.lt_number_box h4{ text-align: center; font-weight: bold;}
.lt_number_box h2{ text-align: center; color:#0088ff; font-size:48px; font-weight: bold; margin-bottom:30px;}
.lt_number_box p.st1_ptag{font-weight: bold; font-size:24px; margin-bottom:20px;}
.lt_number_box input {border:1px solid #0088ff; padding-top:15px; padding-bottom: 15px; margin-bottom:30px;}
.lt_number_box p {margin-bottom:2px; text-align: center; font-size:16px;}
.lt_number_box .user_phone{border:1px solid #0088ff;  margin-bottom:30px; background:#fff; padding-left:15px; height:55px; line-height: 55px; font-size:20px; color:#0088ff; font-weight: bold;}

.rt_key_box{position: relative; background:#555; padding-left:0; padding-right: 0; min-height:500px;}
.rt_key_box > div {position:absolute;top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
.rt_key_box .ft_key {overflow:hidden; display: flex; flex-wrap:wrap; width: 380px;}
.rt_key_box .ft_key li{width:25%; text-align: center; padding:5px;}
.rt_key_box .ft_key li > div {width:85px; height:85px; line-height: 85px; margin:0 auto; background:#f1f1f1; border-radius: 12px; font-size:24px; font-weight: bold; color:#555; box-shadow: inset 0px 0px 4px 5px #fff, 0px 2px 3px 1px #000;}
.rt_key_box .ft_key li > div:active{background:#d0d0d0;}
.rt_key_box .se_key {overflow:hidden; display: flex; flex-wrap:wrap; width: 380px;}
.rt_key_box .se_key li {width:50%; text-align: center; padding:5px;}
.rt_key_box .se_key li > div{width:100%; height:85px; line-height: 85px; margin:0 auto; background:#f1f1f1; border-radius: 12px; font-size:24px; font-weight: bold; color:#555; box-shadow: inset 0px 0px 4px 5px #fff, 0px 2px 3px 1px #000;}
.rt_key_box .se_key li > div:active{background:#d0d0d0;}





@media screen and (min-width:1201px)
{
    .locker_bg .locker_list_item {width:10%;}
}

@media screen and (max-width:1200px)
{
    .locker_bg .locker_list_item {width:10%;}
}

@media screen and (max-width:992px)
{
    .locker_bg .locker_list_item {width:20%;}
}


@media screen and (max-width:768px)
{
    .locker_bg .locker_list_item {width:20%;}
}

@media screen and (max-width:576px)
{
    .locker_bg .locker_list_item {width:33.3333%;}
}







