@charset "utf-8";
@import url(bbs.css);
@import url(menu.css);
@import url(animations.css);

::-webkit-scrollbar {
  width: 10px; 
  height: 8px;
  /* width는 세로 스크롤바에만 적용된다. */
  /* height: 8px; */ 
  /* 마찬가지로 height는 가로 스크롤바에만 적용된다 */
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(59, 60, 66, 0.4);
  border-radius: 20px;
  background-clip: padding-box;
  border: 1px solid transparent;
  transition: all 0.3s;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(59, 60, 66, 0.7);
  background-clip: padding-box;
  border: 1px solid transparent;
}

::-webkit-scrollbar-button {

  display: none; /* 버튼 숨기기 */
  
  }
  
   
.tooltip {font-size: 12px;}
.bs-tooltip-bottom{left: 15px !important;}

.dropdown-menu {  border: 1px solid rgba(0, 0, 0, 0.07); }

.error_page {position: relative; height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; background-color:rgba(255,255,255,0.6); z-index: 999; }
.error_box {display: block; text-align: center; font-size:16px; padding:20px}
.error_box strong{display: block; font-size: 150%; color:var(--pink); padding: 10px 0; font-weight:700}
.error_box p{font-size: 140%; font-weight: 700; color:#111;}


@media only screen and (max-width:560px) {
  
  .error_box strong, .error_box p{font-size:110%; word-break:keep-all}
    
  }
  


input[type="hidden"] + label,
input[type="checkbox"] + label,
input[type="radio"] + label {padding-right:10px;white-space: nowrap;position: relative;line-height: 20px;display: flex;padding-left: 24px;}

.check_list button { overflow: hidden; display: block; text-align:left}
.input_check{padding-top:7px; display: flex; flex-wrap: wrap;}
.input_check::after {content: ''; display: block; overflow: hidden; width: 100%;}
.check_box {display: flex; align-items: center; margin-right: 10px}
.check_box img{height: 22px;}

.comment {font-size: 110%; color:#484c64}
.comment90 {font-size: 90%; color:#6b727e}
.comment80 {font-size: 80%; color:#6b727e}

.icon_checkbox {position: relative; }
.icon_checkbox input[type="checkbox"] + label::before,
.icon_checkbox input[type="radio"] + label::before {content: '\e9c6';display: inline-block;position: absolute;left: 0;font-family: 'xeicon';padding-right: 5px;padding-left: 0px;color:#c6cacf;line-height: 20px;font-size: 130%;vertical-align:top;font-weight: 300 !important;transition: all 0.5s;}
.icon_checkbox input[type="checkbox"] + label::before {content: '\ea0e';}

.icon_checkbox input[type="checkbox"]:checked + label::before {content: '\e92d'; color: var(--default_color); }
.icon_checkbox input[type="radio"]:checked  + label::before {content: '\e9c7';  color: var(--default_color); }
.icon_checkbox input[type="radio"]:disabled + label::before, .icon_checkbox input[type="checkbox"]:disabled + label::before  {   color: #ccc; }

.icon_checkbox input[type="checkbox"]:checked + label,
.icon_checkbox input[type="radio"]:checked  + label {}

.icon_checkbox input[type="checkbox"],
.icon_checkbox input[type="radio"] {position: absolute; left:-9999999px}
/*
.icon_checkbox input[type="checkbox"]:focus + label,
.icon_checkbox input[type="radio"]:focus + label  
 { text-decoration: underline; outline: 1px !important; outline-color: red;}
*/
 .icon_checkbox input[type="checkbox"]:focus + label::before,
 .icon_checkbox input[type="radio"]:focus + label::before 
  {color:#7f7f92; /* box-shadow:inset 0px 0px 0px 1px #949494 !important; */ }
  .icon_checkbox input[type="checkbox"]:checked:focus + label::before,
  .icon_checkbox input[type="radio"]:checked:focus + label::before 
   { color:#002385; }
 
.icon_checkbox.bbs_checkbox input[type="checkbox"] + label, 
.icon_checkbox.bbs_checkbox input[type="radio"] + label  
{ width:20px; height: 20px; }

.icon_checkbox.bbs_checkbox input[type="checkbox"] + label span, 
.icon_checkbox.bbs_checkbox input[type="radio"] + label span 
 { position: absolute; left: -9999px;}
 




/* 회의록 체크박스 */
.check {position: relative; }
.check input[type="checkbox"] + label::before,
.check input[type="radio"] + label::before {content: '\e9c6'; display: inline-block;   font-family: 'xeicon'; padding-right: 5px; padding-left: 0px;   color:#c6cacf; line-height: 20px; font-size: 130%; vertical-align:top; font-weight: 300 !important; transition: all 0.5s;}
.check input[type="checkbox"] + label::before {content: '\ea0e';}

.check input[type="checkbox"]:checked + label::before {content: '\e92d'; color: var(--default_color); line-height:20px !important}
.check input[type="radio"]:checked  + label::before {content: '\e9c7';  color: var(--default_color);line-height:20px !important }
.check input[type="radio"]:disabled + label::before, .check input[type="checkbox"]:disabled + label::before  {   color: #ccc;line-height:20px !important }

.check input[type="checkbox"]:checked + label,
.check input[type="radio"]:checked  + label {line-height:20px !important}

.check input[type="checkbox"],
.check input[type="radio"] {position: absolute; left:-9999999px; line-height:20px !important}
/*
.icon_checkbox input[type="checkbox"]:focus + label,
.icon_checkbox input[type="radio"]:focus + label  
 { text-decoration: underline; outline: 1px !important; outline-color: red;}
*/
 .check input[type="checkbox"]:focus + label::before,
 .check input[type="radio"]:focus + label::before 
  {color:#7f7f92; /* box-shadow:inset 0px 0px 0px 1px #949494 !important; */ }
  .check input[type="checkbox"]:checked:focus + label::before,
  .check input[type="radio"]:checked:focus + label::before 
   { color:#002385; }
 

 


input[type="text"] + button,
input[type="hidden"] + button {margin-left:2px;}

input[type="checkbox"],
input[type="radio"] {
  border: 0;
  width: 14px;
  height: 14px;
  margin: 3px 3px 0 0;
  vertical-align: middle !important;
  float: left;
  
}
input[type="text"] + button {margin-left:3px}
input[type="text"] + button.input-group-append {border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px; }
.input-group > .form-control:not(:first-child) {border-top-left-radius:4px;border-bottom-left-radius:4px;}

.input0 {margin: 0px 0px 0 0 !important; padding:0 !important; float: none !important;} 
input[type="checkbox"].input0 + label, input[type="radio"].input0 + label {padding-top:0}

.check_toggle {padding-top: 0;}
.check_toggle .check_box {position: relative;}
.check_toggle input[type="checkbox"], .check_toggle input[type="radio"]  {  position: absolute;   text-align: left; /* width:95%; height: 35px; */top:0; left:-2000px; right:0; bottom:0; top:0; overflow: hidden;}
.check_toggle input[type="checkbox"]:focus + label, .check_toggle input[type="radio"]:focus + label {border:1px solid #ddd}
.check_toggle input[type="checkbox"] + label, .check_toggle input[type="radio"] + label {display: inline-block;  padding: 0 15px; margin-right: 0px; transition: all 0.3s; background-color: #fff; line-height: 30px; border-radius: 50px; position: relative; border: 1px solid #ddd;}
.check_toggle input[type="checkbox"]:checked + label, .check_toggle input[type="radio"]:checked + label{color:#fff; background-color:var(--default_color);  border-color:var(--default_color)}

  


@media only screen and (max-width:560px) {
  
  .check_toggle input[type="checkbox"] + label, .check_toggle input[type="radio"] + label { line-height: 32px; border-radius: 30px;}
    
  }
  
.toggle_btn {display: inline-block; line-height: 25px; margin: 5px 0; border-radius: 20px; background-color:#cfd3d8; width: 70px; padding: 3px 5px; transition: 0.4s;}
.toggle_btn .slider_toggle { display: block; width:20px; height: 20px; border-radius: 50%; background-color: #fff; transition: 0.4s;}
.toggle_btn.active {background-color: var(--default_color); text-align: right;}

/* The switch - the box around the slider */
.toggle_switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 26px;
  margin-top: 7px; 
}

/* Hide default HTML checkbox */
.toggle_switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider_toggle {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 34px;
}

.slider_toggle:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
  box-shadow:3px 3px 5px rgba(0,0,0,0.2);
}

input:checked + .slider_toggle {
  background-color: #2196F3;
}


input:checked + .slider_toggle:before {
  -webkit-transform: translateX(24px);
  -ms-transform: translateX(24px);
  transform: translateX(24px);
}

.t_blue{color:#007eff !important}
.t_orange{color:orangered !important;}
.t_sky{color:#458bff !important;}
.t_deep_blue{color:#364783 !important;}
.t_deep_gray{color:#666 !important;}
.t_green{color:#1e8e2b !important;}
.t_pink{color:#dc3545 !important;}
.t_red{color:#dd2c3b !important;}


.bg_blue{background-color:#007eff !important;}
.bg_orange{background-color:orangered !important;}
.bg_sky{background-color:#458bff !important;}
.bg_deep_blue{background-color:#364783 !important;}
.bg_gray{background-color:#aaa !important;}
.bg_gray2{background-color:#ccd1df !important;}
.bg_deep_gray{background-color:#666 !important;}
.bg_green{background-color:#1e8e2b !important;}
.bg_lightgray{background-color:#a0a6b4 !important;}
.bg_pink{background-color:#f6294b !important;}
.bg_red{background-color:#d91a0c !important;}
.bg_black{background-color:#000 !important;}
.bg_white{background-color:#fff !important;}
.bg_light_sky {background-color:#e7f4ff !important;}



.t_c00{color: var(--default_color)  !important; }
.t_c01{color: #dc3545 !important; }
.t_c02{color:#008504 !important;}
.t_c03{color: #0e3053 !important; }
.t_c04{color: #f56025 !important;}
.t_05{color: #0395da !important; }
.t_c06{color:#01ad7a !important;}
.t_gray{color:#697085 !important;}
.t_lightgray{color:#e8e9f1 !important; }
.t_white{color:#fff !important;}
.t_black{color: #060b19 !important; }


.bold400 {font-weight: 400 !important;}
.bold500 {font-weight: 500 !important;}
.bold600 {font-weight: 600 !important;}
.bold700 {font-weight: 700 !important;}
.bold800 {font-weight: 800 !important;}




.select2-container {z-index: 1100;}
.select2-container .select2-selection--single,
.select2-container--default .select2-selection--single .select2-selection__rendered
{height:40px;line-height:38px;}
.select2-container--default .select2-selection--single .select2-selection__arrow {height: 38px;}

.select2-container .select2-selection--single .select2-selection__rendered {text-align: left; padding-left: 12px;}
.select2-container .select2-selection--single,
.select2-container--default .select2-selection--multiple
 {border-radius: 5px;border: 1px solid #e2e7ee; }

.select2-container {/* height:40px; */}
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-selection--multiple {text-align: left;}
.select2-container .select2-search--inline .select2-search__field {height:30px;line-height:25px;min-height:30px;  margin-top: 0; }
.select2-container .select2-search--inline .select2-search__field:focus {box-shadow: none !important;}
.select2-container--default .select2-selection--multiple .select2-selection__choice {margin-top: 0 !important; line-height:28px;min-height:28px; vertical-align: middle;}
.select2-container--default .select2-selection--multiple {padding:4px 3px 4px 3px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {line-height: 25px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__display {line-height: 25px;}

/* 싱글 셀렉트  스몰버전*/ 
.select2_small .select2-container .select2-selection--single ,
.select2_small .select2-container .select2-selection--single .select2-selection__rendered{
    height: 37px !important; line-height: 37px !important;    width: 100% !important;}
.select2_small .select2-selection__arrow {    height: 37px !important; line-height: 37px !important;}
/* 멀티플 스몰버전*/
.select2_small .select2-container .select2-selection--multiple {line-height: 35px !important; min-height:35px;}
.select2_small .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {height: 24px !important; line-height: 24px !important;}
.select2_small .select2-container--default .select2-selection--multiple .select2-selection__choice__display {height:24px;line-height: 24px;}
.select2_small .select2-container--default .select2-selection--multiple .select2-selection__choice {height: 24px !important; line-height: 24px !important; min-height: 24px !important;}

.select2_small .select2-selection__rendered {  font-size: 90%; height: 24px !important; line-height: 24px !important; min-height: 24px; }
.select2_small .select2-container--default .select2-selection--multiple {padding:0;}

.select2-search--dropdown .select2-search__field { margin-top: 0; border-radius: 3px; font-size: 80%;}
.select2-container--default .select2-selection--multiple .select2-selection__choice {margin-top: 0;}

@media only screen and (max-width:768px){

  .select2_small .select2-container .select2-selection--single ,
  .select2_small .select2-container .select2-selection--single .select2-selection__rendered{
      height: 30px !important; line-height: 30px !important;    width: 100% !important;}
  .select2_small .select2-selection__arrow {    height: 30px !important; line-height: 30px !important;}
  /* 멀티플 스몰버전*/
  .select2_small .select2-container .select2-selection--multiple {line-height: 30px !important; min-height:30px;}

}


.dropdown-menu {border-radius: 10px; box-shadow:3px 3px 10px rgba(0, 0, 0, 0.1);}
.dropdown-menu a{font-size: 14px; line-height: 20px; padding: 7px 20px;}


/* 버튼 */
.btnPack{ height:40px;line-height:39px;text-align:center;margin:0px 0px 2px 0;vertical-align:middle;padding:0 12px;text-decoration:none;letter-spacing:-0.02em;color:#fff;word-break:break-all;white-space:nowrap; transition: all 0.3s ease-out; font-weight: 500; position: relative; border-radius: 7px; background-color:var(--default_color); box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.35); box-sizing: border-box; display: inline-flex; align-items: center;}
.btnPack *{background:none;white-space:inherit;display:inline-block;text-align:center;font-size:inherit;line-height: inherit;background-image:none !important;text-decoration:none !important;letter-spacing:inherit;word-break:inherit;text-transform:capitalize; color: inherit;}
.btnPack.icon {}
.btnPack.icon > span{ position: absolute; left: 0px; text-align: left; width: 1px; height: 1px;  right: -1000000px; overflow: hidden;}
.btnPack.icon i{ margin-top: 0px;}
.btnPack.icon i.fas {font-size: 90%;}
.btnPack.btnshadow{box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.15);}
.btnPack.shadow_none{box-shadow: none}

.btnPack:disabled {cursor:not-allowed; opacity: 1; filter: grayscale(1);}
a.btnPack {color:#fff}

.btnPack i{ line-height: inherit; margin: 0 5px; font-size: 90%;}
.btnPack i + span {padding-right: 7px;}
.btnPack span + i{padding-right: 0px; margin-right: 0;}

.btnPack + .btnPack {margin-left:3px}
/* .btnPack:last-child{margin:0} */
.btnPack.strong{font-weight:700 !important;}

/* 버튼 컬러 */
.btnPack.c01{background-color: #dc3545; }
.btnPack.c02{background-color:#008504;}
.btnPack.c03{background-color: #0e3053; }
.btnPack.c04{background-color: #f56025; }
.btnPack.c05{background-color: #0395da; }
.btnPack.c06{background-color:#01ad7a;}

.btnPack.gray{background-color:#697085;}
.btnPack.lightgray{background-color:#e8e9f1; color:#4b505f !important;}
.btnPack.white{background-color:#fff; color: #444 !important;}
.btnPack.black{background-color: #323538; }

.btnPack.border {border:1px solid var(--default_color) !important; ; background-color: #fff; color: var(--default_color) !important; }
.btnPack.border_c01 {border:1px solid ; background-color: #fff; border-color: #dc3545 !important; color:#dc3545 !important;}
.btnPack.border_c01_2 {border:1px solid ; background-color: #fff; border-color: #dc3545 !important; color:#dc3545 !important;}
.btnPack.border_c02 {border:1px solid ; background-color: #fff; border-color: #008504 !important; color:#008504 !important;}
.btnPack.border_c02_2 {border:1px solid ; background-color: #fff; border-color: #008504 !important; color:#008504 !important;}
.btnPack.border_c03{border:1px solid ; background-color: #fff; border-color: #0a0b72 !important; color:#0a0b72 !important;}
.btnPack.border_c03_2{border:1px solid ; background-color: #fff; border-color: #0a0b72 !important; color:#0a0b72 !important;}
.btnPack.border_c04 {border:1px solid ; background-color: #fff; border-color: #f56025 !important; color:#f56025 !important;}
.btnPack.border_c04_2 {border:1px solid ; background-color: #fff; border-color: #f56025 !important; color:#f56025 !important;}
.btnPack.border_c05 {border:1px solid ; background-color: #fff; border-color: #0395da !important; color:#0395da !important;}
.btnPack.border_c05_2 {border:1px solid ; background-color: #fff; border-color: #0395da !important; color:#0395da !important;}
.btnPack.border_c06 {border:1px solid ; background-color: #fff; border-color: #01ad7a !important; color:#01ad7a !important;}
.btnPack.border_c06_2 {border:1px solid ; background-color: #fff; border-color: #01ad7a !important; color:#01ad7a !important;}





.btnPack.border_black {border:1px solid ; background-color: #fff; border-color: #56585f !important; color:#191f2e !important;}
.btnPack.border_gray {border:1px solid #a3a3a3 !important;  background-color: #fff; color: #414141 !important; }
.btnPack.border_lightgray {border:1px solid #dddddd !important;  background-color: #fff; color: #777777 !important; }


.btnPack.pad5{padding: 0 5px;}
.btnPack.pad7{padding: 0 7px;}
.btnPack.pad10{padding: 0 10px;}
.btnPack.pad15{padding: 0 15px;}
.btnPack.pad20{padding: 0 20px;}
.btnPack.pad30{padding: 0 30px;}
.btnPack.pad40{padding: 0 40px;}
.btnPack.pad50{padding: 0 50px;}
.btnPack.block{padding: 0 5px; display: block !important; width: 100%; }
.btnPack.round5{border-radius: 5px;}
.btnPack.round7{border-radius: 7px;}
.btnPack.round10{border-radius: 10px;}
.btnPack.round20{border-radius: 20px;}
.btnPack.round30{border-radius: 30px;}
.btnPack.round_one{border-radius: 50%;}
.btnPack.round0{border-radius: 0px;}


.btnPack.strong *,.btnPack.black *{color:inherit;font-weight:inherit; line-height: inherit;}
.btnPack.white.down {background-color: #eee;border: 1px solid #666; }

.btnPack.yellow span, .btnPack.sky span{color:#111}


.btnPack.kakao{background-color: #fee300; font-size: 120%; color:#333; height:60px;line-height:58px;}
.btnPack.kakao span {position: relative; }
.btnPack.kakao span:before {background-image: url(/module/common/images/renewal/login_kakao.png); content: ''; display: inline-block; width:37px; height: 30px; background-position: center center; background-repeat: no-repeat; vertical-align: middle; margin-right:10px; background-size: auto 90%;}

.xxsmall{font-size:80% !important;height:20px !important;line-height:19px !important;}
.xsmall{font-size:83% !important;height:27px !important;line-height:26px !important;}
.small{font-size:90% !important;height:37px !important;line-height:36px !important; }
.medium{height:45px !important;line-height:44px !important;font-size:115% !important;}
.large{height:50px !important;line-height:49px !important;font-size:125% !important; padding: 0 20px;}
.xlarge{height:55px !important;line-height:54px !important;font-size:135% !important; padding: 0 20px;}





/* 버튼 반응형 */
@media only screen and (max-width:768px){
  .btnPack{padding:0 10px;}

  .btnPack, .input_file .file_name, .input_file label span {  height:32px;    line-height: 30px;}
  .xsmall{font-size:85% !important;height:23px !important;line-height:22px !important;}
  .small{font-size:90% !important;height:30px !important;line-height:30px !important;}
  .medium{height:36px !important;line-height:34px !important;font-size:110% !important;}
  .large{height:40px !important;line-height:38px !important;font-size:115% !important;  padding: 0 15px;}
  .xlarge{height:45px !important;line-height:43px !important;font-size:125% !important; padding: 0 15px;}

  select {}
  select,
  input[type="text"],
  input[type="password"],
  .input_file .file_name,
  input[type="datetime"],
  input[type="datetime-local"],
  input[type="date"],
  input[type="month"],
  input[type="time"],
  input[type="week"],
  input[type="number"],
  input[type="email"],
  input[type="url"],
  input[type="search"],
  input[type="tel"],
  input[type="color"] {
    height: 32px;
    line-height: 30px;
  }
}
  







.dot_list {margin:0}
.dot_list li{position:relative;padding:0px 5px 3px 10px;text-align:left; line-height: 120%; margin-bottom: 5px;}
.dot_list li:last-child{padding-bottom:0}
.dot_list li:before{content:''; position:absolute; top:7px; left:0px; background:#999; width:3px; height:3px; border-radius:10px; }
.dot_list li ul{margin:5px 0; }
.dot_list li ul li{font-size:90%;  line-height: 25px; color:#777}
.dot_list li ul li:before{background:#999; width:6px; height:2px;  }
.dot_list.check li:before{content:'\f105';font-family:'FontAwesomeS';font-size:16px; background:none; top:0px; color:#666; color: #e8575c;}
.dot_list.check li{padding-left:15px;}
.dot_list.line li:before{top:10px; left:0px; background:#999; width:5px; height:2px; border-radius:0px; background-color: #a5acc6;}


.dot_list.w50 { display: flex; flex-wrap: wrap; } 
.dot_list.w50 li { flex: 1 0 50%; } 

/*
@media only screen and (max-width:768px){
    .dot_list li{ padding:0px 5px 7px 7px;}
    .dot_list li:before{top:7px; }
    .dot_list li ul li{line-height: 18px; }
    .dot_list li ul li:before{top:9px }
    .dot_list.line li:before{top:8px; width: 4px; height: 1px;}
    .dot_list.w50 li { flex: 1 0 100%; } 
}
*/

.jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar {
  width: 6px
}


/* 개인정보처리방침 목록 */
ol.num  {margin-left:30px}
ol.num > li {list-style:decimal-leading-zero !important;  padding-left: 0 !important; padding-bottom:8px;}
ol.num > li:before{display:none}

.privacy dl dt {text-align: left !important; font-size:100% !important}
.privacy dl dd {font-weight:300; color:#222; line-height: 140%;}
.privacy .f90 {line-height: 140%;}

ol.num2 {counter-reset: type1; }
ol.num2 > li {list-style:none; position:relative; padding-left:20px; padding-bottom:5px;}
ol.num2 > li:before { counter-increment: type1; content: counter(type1,decimal)"."; font-weight: 300; position: absolute; left:0; top:0; }

ol.num3 {counter-reset: type2; }
ol.num3 > li {list-style:none; position:relative; padding-left:20px; padding-bottom:8px;}
ol.num3 > li:before { counter-increment: type2; content: counter(type2,decimal)")"; font-weight: 300; position: absolute; left:0; top:0px; line-height: inherit;}

ol.num4 {counter-reset: type3; }
ol.num4 > li {list-style:none;position:relative;padding-left:23px;line-height: 150%;margin-bottom: 10px;}
ol.num4 > li:before {counter-increment: type3;content: counter(type3,decimal);font-weight: 300;position: absolute;left:0px;top: 4px;width:17px;height:17px;border: 1px solid #666;border-radius: 50%;text-align: center;font-size: 70%;color: #000;line-height: 15px;}

ol.no_num { display:block; }
ol.no_num > li {list-style:none; position:relative; padding-left:0px; padding-bottom:8px; margin-bottom:15px}


.pad_box2 { padding-top:2%; padding-bottom:2%; overflow:hidden }
.pad_box3 { padding-top:3%; padding-bottom:3%; overflow:hidden }
.pad_box4 {padding-top:4%; padding-bottom:4%; overflow:hidden }
.pad_box5 {padding-top:5%; padding-bottom:5%; overflow:hidden }
.pad_box6 {padding-top:6%; padding-bottom:6%; overflow:hidden }
.pad_box7 {padding-top:7%; padding-bottom:7%; overflow:hidden }
.pad_box8 {padding-top:8%; padding-bottom:8%; overflow:hidden }
.pad_box9 {padding-top:9%; padding-bottom:9%; overflow:hidden }
.pad_box10 {padding-top:10%; padding-bottom:10%; overflow:hidden }
.pad_box15 {padding-top:15%; padding-bottom:15%; overflow:hidden }


.table_design{border-collapse: collapse; background: #fff;  width: 100%;  font-size: 90%;  border-top:solid 2px; border-color: var(--black); table-layout: fixed; }
.table_design thead th {background: #e4e6e8;padding:9px 10px;color: #000; font-weight: 700;  text-align: center;  border-bottom: 1px solid #d4d4d4; font-family: var(--default_font); }
.table_design th, .table_design td { padding:9px 12px;word-break: break-all !important; }
.table_design td {box-sizing: border-box; border-bottom: 1px solid #d4d4d4;text-align: center;color: #444;background-color: #fff;}
.table_design tbody th {background: #f4f6f8;  border-bottom: 1px solid #d4d4d4; text-align: center; font-weight: 500; color: #000;}
.table_design td + td, .table_design th + td, .table_design th + th , .table_design td + th { border-left: 1px solid #d4d4d4;}
.table_design td[rowspan], .table_design th[rowspan] {border-right: 1px solid #d4d4d4;}
.table_design td[rowspan]:last-child {border-right:none}


/* 썸네일 설정 */
.item {display: block;}
.item .thumbnail {width: 100%;  display: block;  overflow: hidden;  background-color: #f2f4f7;  position: relative;  padding-bottom: 90%;  border-radius: 7px;}
.item .thumbnail.no_img::after {content:'No Images'; white-space: nowrap;  position: absolute; left:0; top:0px; right:0; bottom:0; font-size: 200%; display: flex; align-items: center; justify-content: center; font-weight: 700; color:#898b99}
.item .thumbnail img, .item .thumbnail video {  position: absolute;  top: 0;  left: 0;  right: 0;  bottom: 0;  max-width: 100%;  max-height: 100%;  margin: auto; transition: all 2s ;transform: scale(1); }

.item:hover .thumbnail img {transform: scale(1);  }
.item .thumbnail.mov::after{content:'\f144'; font-family: 'FontAwesomeR'; position: absolute; left:0; top:0px; right:0; bottom:0; font-size: 300%; color:#fff; text-shadow: 0 0 10px rgba(0, 0, 0, 0.4); display: flex; justify-content: center; align-items: center;}

.item.detail .thumbnail{display: block; overflow: hidden; background-color: #000; position: relative; padding-bottom:100%; width:100%;} 
.item.detail .thumbnail img{ transition: all 1s ;  object-fit: cover;position: absolute;  height: 100%; left: 0; right:100%; width:100%;  }
.item.detail:hover .thumbnail img {transform: scale(1);  }



.page_tit {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.page_tit h3{font-size:130%;   font-weight:600; position: relative; padding-left: 20px; color: var(--black); margin: 10px 0;}
.page_tit h3 span{font-weight: 800; color:var(--default_color); }

.page_tit h3::before{content: ''; position: absolute; top:8px; width: 7px; height: 7px; background-color: var(--default_color); border-radius: 50%; left:5px}
.page_tit h4{font-size:100%; font-weight:500;  position: relative; padding-left: 20px; color: var(--black); margin: 10px 0;}
.page_tit h4::before{content: ''; position: absolute; top:11px; width: 6px; height: 3px; background-color: #bfc4d6;  left:9px; border-radius: 5px;}



.sns_list{ left:-25px; width:98px; }

.sns_list ul {display: flex; flex-wrap: wrap;}
.sns_list li {flex: 1 0 50%; text-align: center; padding:4px 2px;}
.sns_list a {text-align:center; width:35px; line-height: 35px; display: block; border-radius:50%; overflow:hidden; }
.sns_list a img{ width:35px; height: 35px;} 

.sns_list .facebook{background:#4c69ba}
.sns_list .twitter{background:#000}
.sns_list .blog, .sns_list .band{background:#00c73c}
.sns_list .kakao{ background-color: #f8e049;}
.sns_list .youtube{ background-color:red;}
.sns_list .instar{background:url(/module/common/images/renewal/sns_instar.jpg); background-size:100% 100% }



.t_mar1 {margin-top:1% !important}
.t_mar2 {margin-top:2% !important}
.t_mar3 {margin-top:3% !important}
.t_mar4 {margin-top:4% !important}
.t_mar5 {margin-top:5% !important}
.t_mar6 {margin-top:6% !important}
.t_mar7 {margin-top:7% !important}
.t_mar8 {margin-top:8% !important}
.t_mar9 {margin-top:9% !important}
.t_mar10 {margin-top:10% !important}

.f80 {font-size:80% !important}
.f90 {font-size:90% !important}
.f110 {font-size:110% !important}
.f120 {font-size:120% !important}
.f130 {font-size:130% !important}
.f140 {font-size:140% !important}
.f150 {font-size:150% !important}
.f160 {font-size:160% !important}
.f170 {font-size:170% !important}
.f200 {font-size:200% !important}
.img_bor img{border:1px solid #ccc; box-shadow:3px 3px 4px rgba(0,0,0,0.05);}

.lh {
  line-height: 0px;
}
.tal {
  text-align: left !important;
}

.fll {
  float: left !important;
}
.flr {
  float: right !important;
}
.fln {
  float: none !important;
}
.tac {
  text-align: center !important;
}
.tal {
  text-align: left !important;
}
.tar {
  text-align: right !important;
}

.pad0 {padding:0 !important;}
.pt10 {
  padding-top: 10px;
}
.pt12 {
  padding-top: 12px;
}
.pt15 {
  padding-top: 15px;
}
.pt18 {
  padding-top: 18px;
}
.pt20 {
  padding-top: 20px;
}
.pt25 {
  padding-top: 25px;
}
.pt30 {
  padding-top: 30px;
}
.pt35 {
  padding-top: 35px;
}
.pt40 {
  padding-top: 40px;
}
.pt50 {
  padding-top: 50px;
}
.pt60 {
  padding-top: 60px;
}

.pb10 {
  padding-bottom: 10px;
}
.pb12 {
  padding-bottom: 12px;
}
.pb15 {
  padding-bottom: 15px;
}
.pb20 {
  padding-bottom: 20px;
}
.pb25 {
  padding-bottom: 25px;
}
.pb30 {
  padding-bottom: 30px;
}
.pb35 {
  padding-bottom: 35px;
}
.pb40 {
  padding-bottom: 40px;
}
.pb50 {
  padding-bottom: 50px;
}
.pb60 {
  padding-bottom: 60px;
}

.pr10 {
  padding-right: 10px;
}
.pr15 {
  padding-right: 15px;
}
.pr20 {
  padding-right: 20px;
}
.pr25 {
  padding-right: 25px;
}
.pr30 {
  padding-right: 30px;
}
.pr35 {
  padding-right: 35px;
}
.pr40 {
  padding-right: 40px;
}
.pr45 {
  padding-right: 45px;
}
.pr50 {
  padding-right: 50px;
}
.pr55 {
  padding-right: 55px;
}

.pl10 {
  padding-left: 10px;
}
.pl15 {
  padding-left: 15px;
}
.pl20 {
  padding-left: 20px;
}
.pl25 {
  padding-left: 25px;
}
.pl30 {
  padding-left: 30px;
}
.pl35 {
  padding-left: 35px;
}
.pl40 {
  padding-left: 40px;
}
.pl45 {
  padding-left: 45px;
}
.pl50 {
  padding-left: 50px;
}
.pl55 {
  padding-left: 55px;
}


.mt0 {
  margin-top: 0px !important;
}
.mt5 {
  margin-top: 5px !important;
}
.mt10 {
  margin-top: 10px !important;
}
.mt12 {
  margin-top: 12px !important;
}
.mt15 {
  margin-top: 15px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt25 {
  margin-top: 25px !important;
}
.mt30 {
  margin-top: 30px !important;
}
.mt35 {
  margin-top: 36px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mt45 {
  margin-top: 45px !important;
}
.mt50 {
  margin-top: 50px !important;
}
.mt60 {
  margin-top: 60px !important;
}
.mt65 {
  margin-top: 65px !important;
}
.mt70 {
  margin-top: 70px !important;
}
.mt75 {
  margin-top: 75px !important;
}
.mt80 {
  margin-top: 80px !important;
}
.mt95 {
  margin-top: 95px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}
.mb7 {
  margin-bottom: 7px !important;
}
.mb10 {
  margin-bottom: 10px !important;
}
.mb15 {
  margin-bottom: 15px !important;
}
.mb20 {
  margin-bottom: 20px !important;
}
.mb25 {
  margin-bottom: 25px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.mb35 {
  margin-bottom: 35px !important;
}
.mb40 {
  margin-bottom: 40px !important;
}
.mb45 {
  margin-bottom: 45px !important;
}
.mb50 {
  margin-bottom: 50px !important;
}
.mb55 {
  margin-bottom: 55px !important;
}
.mb60 {
  margin-bottom: 60px !important;
}
.mb80 {
  margin-bottom: 80px !important;
}
.mb100 {
  margin-bottom: 100px !important;
}

.ml0 {
  margin-left: 0px !important;
}
.ml10 {
  margin-left: 10px !important;
}
.ml15 {
  margin-left: 15px !important;
}
.ml20 {
  margin-left: 20px !important;
}
.ml25 {
  margin-left: 25px !important;
}
.ml30 {
  margin-left: 30px !important;
}
.ml35 {
  margin-left: 35px !important;
}
.ml40 {
  margin-left: 40px !important;
}
.ml45 {
  margin-left: 45px !important;
}
.ml50 {
  margin-left: 50px !important;
}
.ml55 {
  margin-left: 55px !important;
}
.ml60 {
  margin-left: 60px !important;
}
.ml65 {
  margin-left: 65px !important;
}
.ml70 {
  margin-left: 70px !important;
}
.mr5 {
  margin-right: 5px !important;
}
.mr10 {
  margin-right: 10px !important;
}
.mr15 {
  margin-right: 15px !important;
}
.mr20 {
  margin-right: 20px !important;
}
.mr25 {
  margin-right: 25px !important;
}
.mr30 {
  margin-right: 30px !important;
}
.mr35 {
  margin-right: 35px !important;
}
.mr40 {
  margin-right: 40px !important;
}
.mr45 {
  margin-right: 45px !important;
}
.mr50 {
  margin-right: 50px !important;
}
.mr90 {
  margin-right: 90px !important;
}

.fs11 {
  font-size: 11px !important;
}
.fs12 {
  font-size: 12px !important;
}
.fs13 {
  font-size: 13px !important;
}
.fs14 {
  font-size: 14px !important;
}
.fs15 {
  font-size: 15px !important;
}
.fs16 {
  font-size: 16px !important;
}
.fs17 {
  font-size: 17px !important;
}
.fs18 {
  font-size: 18px !important;
}
.fs19 {
  font-size: 19px !important;
}
.fs20 {
  font-size: 20px !important;
}
.fs21 {
  font-size: 21px !important;
}
.fs22 {
  font-size: 22px !important;
}
.fs23 {
  font-size: 23px !important;
}
.fs24 {
  font-size: 24px !important;
}
.fs22 {
  font-size: 22px !important;
}
.fs24 {
  font-size: 24px !important;
}
.fs28 {
  font-size: 28px !important;
}
.fs30 {
  font-size: 30px !important;
}
.fs32 {
  font-size: 32px !important;
}
.fs34 {
  font-size: 34px !important;
}
.fs36 {
  font-size: 36px !important;
}

.ls5 {
  letter-spacing: -0.5px;
}
.ls10 {
  letter-spacing: -1px;
}
.ls15 {
  letter-spacing: -1.5px;
}
.newimg {
  margin-top: 6px;
  margin-left: 10px;
}

.clear {
  clear: both;
}

.after:after {
  content: "";
  display: block;
  clear: both;
}
select::-ms-expand {
  display: none;
}




/* bootstrap */
.form-control,
.input-group-text,
.input_file .file_name {
  border-radius: 4px;
}
.form-row > .col,
.form-row > [class*="col-"] {
}
.input-group > .input-group-append:last-child > .input-group-text {
  background-color: #f0f0f0;
  border-color: #ccc;
  color: #000;
}

.row {
  margin-right: -20px;
  margin-left: -20px;
}
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col,.col-auto,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm,.col-sm-auto,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-md,.col-md-auto,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg,.col-lg-auto,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl,.col-xl-auto {
  padding-left: 20px;
  padding-right: 20px;
}

@media only screen and (max-width:1400px) {

.row {
  margin-right: -15px;
  margin-left: -15px;
}
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col,.col-auto,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm,.col-sm-auto,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-md,.col-md-auto,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg,.col-lg-auto,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl,.col-xl-auto {
  padding-left: 15px;
  padding-right: 15px;
}
}




/* datetimepicker */
.bootstrap-datetimepicker-widget.timepicker-sbs {
    width: 100%;
  }
  .bootstrap-datetimepicker-widget {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border: none;
    width:270px !important
  
  }
  .bootstrap-datetimepicker-widget table {
    font-size: 15px;
    width:100%
  
  }
  .bootstrap-datetimepicker-widget table th,
  .bootstrap-datetimepicker-widget table td.day {
    height: 35px;
  }
  
  .datepicker .table {
    font-weight: 400;
    color: #333;
    font-family: "Roboto", "Noto Sans KR";
    
  }
  .datepicker .table th,
  .datepicker .table td,
  .datepicker .table thead th {
    border: none;
  }
  .datepicker .table th::before {display: none; }
  .datepicker .table thead tr:nth-child(2) th:first-child,
  .datepicker .table tr td:first-child {
    color: #0065ff;
  }
  .datepicker .table thead tr:nth-child(2) th:last-child,
  .datepicker .table tr td:last-child {
    color: #e83e8c;
  }
  .bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"] {
    height: auto;
  }
  .bootstrap-datetimepicker-widget .picker-switch {
    font-weight: 700;
    font-size: 120%;
  }
  .bootstrap-datetimepicker-widget table td.active {color:#fff !important;}
  



/* datepicker */
.ui-widget-header {
    border: 0px solid #dddddd;
    background: #fff;
    }
    
    .ui-datepicker-calendar>thead>tr>th {
    font-size: 14px !important;
    }
    
    .ui-datepicker .ui-datepicker-header {
    position: relative;
    padding: 10px 0;
    }
    
    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 0px solid #c5c5c5;
    background-color: transparent;
    font-weight: normal;
    color: #454545;
    text-align: center;
    }
    
    .ui-datepicker .ui-datepicker-title {
    margin: 0 0em;
    line-height: 16px;
    text-align: center;
    font-size: 14px;
    padding: 0px;
    font-weight: bold;
    }
    
    .ui-datepicker {
    display: none;
    background-color: #fff;
    border-radius: 4px;
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;
    padding: 20px;
    padding-bottom: 10px;
    width: 300px;
    box-shadow: 10px 10px 40px rgba(0,0,0,0.1);
    }
        
    .ui-widget.ui-widget-content {
        border: 1px solid #eee;
    }
    
    #datepicker:focus>.ui-datepicker {
    display: block;
    }
    
    .ui-datepicker-prev,
    .ui-datepicker-next {
    cursor: pointer;
    }
    
    .ui-datepicker-next {
    float: right;
    }
    
    .ui-state-disabled {
    cursor: auto;
    color: hsla(0, 0%, 80%, 1);
    }
    
    .ui-datepicker-title {
    text-align: center;
    padding: 10px;
    font-weight: 100;
    font-size: 20px;
    }
    
    .ui-datepicker-calendar {
    width: 100%;
    }
    
    .ui-datepicker-calendar>thead>tr>th {
    padding: 5px;
    font-size: 20px;
    font-weight: 400;
    }
    
    
    .ui-datepicker-calendar>tbody>tr>td>a {
    color: #000;
    font-size: 12px !important;
    font-weight: bold !important;
    text-decoration: none;
        
    }
    
    
    .ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover {
    cursor: auto;
    background-color: #fff;
    }
        
    .ui-datepicker-calendar>tbody>tr>td {
        border-radius: 100%;
        width: 44px;
        height: 30px;
        cursor: pointer;
        padding: 5px;
        font-weight: 100;
        text-align: center;
        font-size: 12px;
    }
        
    .ui-datepicker-calendar>tbody>tr>td:hover {
        background-color: transparent;
        opacity: 0.6;
    }
    
    .ui-state-hover,
    .ui-widget-content .ui-state-hover,
    .ui-widget-header .ui-state-hover,
    .ui-state-focus,
    .ui-widget-content .ui-state-focus,
    .ui-widget-header .ui-state-focus,
    .ui-button:hover,
    .ui-button:focus {
    border: 0px solid #cccccc;
    background-color: transparent;
    font-weight: normal;
    color: #2b2b2b;
    }
    
    .ui-icon-circle-triangle-e {
    background-position: -20px 0px;
    background-size: 36px;
    }
    
    .ui-icon-circle-triangle-w {
    background-position: -0px -0px;
    background-size: 36px;
    }
        
    .ui-datepicker-calendar>tbody>tr>td:first-child a{
    color: red ;
    }
        
    .ui-datepicker-calendar>tbody>tr>td:last-child a{
    color: #0099ff ;
    }
        
    .ui-datepicker-calendar>thead>tr>th:first-child {
        color: red ;
    }
        
    .ui-datepicker-calendar>thead>tr>th:last-child {
        color: #0099ff ;
    }
    
    .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
        border: 0px;
        background: #f1f1f1;
        border-radius: 50%;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    .bootstrap-datetimepicker-widget table td.active {color:#fff !important}




/*로딩*/
.loading{}
.loading > .loading_box {top:40%; width:250px;  padding:30px; color:#000; text-align:center; position:fixed; left:50%; margin-left:-125px; z-index:9999999; background-color:#fff;  box-shadow: 0px 0px 10px rgba(0,0,0,0.2); border-radius:20px}
.loading > .loading_box i{font-size:500%; opacity: 0.8;color:var(--default_color); }
.loading > .loading_box strong{display:block; font-weight:500; padding-top:20px; font-size:110%; color:#333;}