@charset "UTF-8";
/* CSS Document */

.clc_wrap{ position:relative; }

.clc_latest_pos{position:absolute;right:0;top:0;bottom:0;transform: translateX(156px);  transition:0.3s}
.clc_latest_pos .pos_open{ position:absolute; left:-53px; top:0; display:flex; justify-content: center; align-items: center; font-size:20px; width:36px; height:36px; background:#000; color:#fff; border-top-left-radius: 20px; border-bottom-left-radius: 20px; }
.clc_latest_pos.open{ right:21px; transform:translateX(0); transition:0.3s}
.clc_latest_pos.open .pos_open{transform:rotate(180deg); right: -36px;left: auto; z-index: 100;}
.clc_latest_wrap{ position:sticky; top:0; background:#f7f7f7; padding-bottom:10px; }
.clc_latest_wrap > span{ display:block;  text-align: center;  background:#2f2f2f; color:#fff; padding:10px 20px; border-top-left-radius: 20px; font-weight:bold; margin-bottom:10px; }
.clc_latest_wrap > a{ display:block; width:100px; margin:0 auto; padding:2px 0; text-align: center; color:#fff; border-radius: 10px; background:#000; }
.clc_latest_list{ padding:0 20px; height:460px;  }
.clc_latest_list .list{ margin:10px 0; }
.clc_latest_list .list > li{ padding:5px 0; }
.clc_latest_list .list > li > a{ display:block; width:100px; height:80px; background-size:cover; background-position:top center; text-indent: -9999px; border:#ddd solid 1px; }
@media all and (min-width:1400px){
    .clc_latest_pos .pos_open{ display:none; }
}

.sch_detail{ display:none; padding:10px 0 0; }
.sch_detail .row{background:#fff; padding:0;font-size: 0;line-height: 0}
.sch_detail .row + .row{padding-top: 10px}

.wrap_period .tab_panel{display: none}
.wrap_period.panel1_on .tab_panel1,
.wrap_period.panel2_on .tab_panel2{display: block}

.group_slider_toggle{display: flex;gap:8px;width: 100%;font-size: 20px}
.group_slider_toggle .btn_view i{color:#b9b9b9;transition: color .3s}
.wrap_period.panel1_on .group_slider_toggle .btn_view_slider i,
.wrap_period.panel2_on .group_slider_toggle .btn_view_select i{color:#000}

.wrap_period .group_range_txt{display: flex;gap: 5px 10px;flex-wrap: wrap;align-items: center;padding: 12px 0 10px;font-size: 16px;line-height: 26px}
.wrap_period.panel2_on .group_range_txt strong,
.wrap_period.panel2_on .group_range_txt .txt_range{display: none}
.wrap_period .group_range_txt strong{font-size: 14px;line-height: 18px;color:#222}
.wrap_period .group_range_txt .txt_range{font-weight: 500;font-size: 14px;line-height: 18px;color:#898989}

#pieceRangeSlider{
  --slider-height: 6px;
  --slider-handle-size: 16px;
  --slider-bg-color: #4191ff;
  --slider-bar-color: #eee;
  --slider-gage-color: #4191ff;
  height: var(--slider-height);border:0;background: var(--slider-bar-color);
}
#pieceRangeSlider .ui-slider-range{background: var(--slider-bg-color)}
#pieceRangeSlider .ui-slider-range, #pieceRangeSlider .ui-slider-handle{transition: all linear .1s}
#pieceRangeSlider .ui-slider-handle{top:50%;margin-left: calc(var(--slider-handle-size) / 2 * -1);width: var(--slider-handle-width-size, var(--slider-handle-size));height: var(--slider-handle-height-size, var(--slider-handle-size));border:0;border-radius: 50%;background:var(--slider-gage-color);cursor: grab;transform: translateY(-50%)}
#pieceRangeSlider .ui-slider-handle:before{display: block;overflow: hidden;font-size: 1px;line-height: 0;color: transparent}
#pieceRangeSlider .ui-slider-handle:nth-of-type(1):before{content: '시작연도 ' attr(data-start-year) '년'}
#pieceRangeSlider .ui-slider-handle:nth-of-type(2):before{content: '종료연도 ' attr(data-end-year) '년'}

.area_piece_list{padding-top: 10px}
.sch_detail .list_period_range{position: relative;min-width: 0;display: flex;width: 100%;word-break: break-all}
.sch_detail .list_period_range li{flex:1;min-width: 0;display: flex;align-items: center;position: relative;width: 100%;padding-top: var(--slider-box-height);font-size: 12px;line-height: 14px;color:#000;writing-mode: vertical-rl;text-orientation: upright;user-select: none}

.group_range_select{display: flex;gap:5px;align-items: center;padding-bottom: 4px;font-size: 12px;line-height: 16px;color:#222}
#startYear, #endYear{width: 100px;height: 32px;padding:0 40px 0 10px;border-radius: 3px;border:1px solid #626262;color:#222}
.select_group{position: relative;font-size: 16px;color:#222}
.select_group i{position: absolute;top:50%;right: 10px;transform: translateY(-50%)}

@media
only screen and (min-width:768px) {
  .group_slider_toggle{width: auto}
  .wrap_period{display: inline-block;width: calc(100% - 140px);padding-right: 10px;vertical-align: top}
  .wrap_period .group_range_txt{padding:0 0 12px;margin-top: -4px}
  .wrap_period .group_range_txt .txt_range{font-size: 13px}
  .area_range_slider{padding:0 8px}
  .sch_detail .list_period_range li{justify-content: center;writing-mode: horizontal-tb}

  .group_range_select{padding-top: 0;margin-top: -2px}
}
@media
only screen and (min-width:1024px) {
  .sch_detail .list_period_range li{font-weight: 500;font-size: 14px;line-height: 18px}
  .group_slider_toggle .btn_view:hover i, .group_slider_toggle .btn_view:focus i{color:#222}
}
@media
only screen and (min-width:1440px) {
  .sch_detail{width: 907px}
}

.sch_detail .row .check_wrap{display: inline-flex;flex-wrap: wrap;row-gap: 5px;padding:10px 0}
.sch_detail .row .title{display:inline-block;position:relative;margin-right:40px;background:#121212;font-size: 16px;line-height: 16px;color:#fff; font-weight: 500; padding:5px 20px 7px; width:100px;  }
.sch_detail .row .title:after{ position:absolute; top:4px; right:-10px; display:block; width:20px; height:20px; transform:rotate(45deg); background:#121212; content:""  }
.sch_detail .row label{ font-size:14px; line-height: 20px; margin:0 3px; padding-left:25px; }
.sch_detail .row .date_wrap{ display:flex; justify-content: space-between; padding:10px 0 5px 0; }
.sch_detail .row .date_wrap input{ height:35px; border:#000 solid 1px; width:45%; padding:0 10px;  }
.sch_detail .row .date_wrap span{ line-height:35px; widows: 10%; }

@media all and (min-width:768px){
    .sch_detail .row{padding: 10px;}
    /* .sch_detail .row .check_wrap{ padding:0} */
    .sch_detail .row label{ margin-right:10px;/* margin-bottom:0; */}
    .sch_detail .row .date_wrap{ display:inline-block; width:400px; padding:0; margin-left:20px; margin-top:20px;}
}
@media all and (min-width:1024px){
    .sch_detail .row .check_wrap{display:inline-block} 
    .sch_detail .row{ padding:10px 0; }
    .sch_detail .row label{font-size:16px; margin-left:0; }
    .sch_detail .row .date_wrap{ margin-left:40px; margin-top:0; }
}

.clc_sch_box{ border:#000 solid 1px; padding:20px; }
.clc_sch_box .notice{ text-align:center; word-break: keep-all; font-size:18px; font-weight:500; }
.clc_sch_box .notice span{ color:#4191ff; font-weight:bold }
.clc_sch_box .sch_row{ padding:5px 0; }
.clc_sch_box .sch_row select{ height:35px; width:100%; }
.clc_sch_box .sch_row .sch_txt{ height:35px; border:#000 solid 1px; width:100%; padding:0 10px; }
.clc_sch_box .btn_set{  display:flex; justify-content: space-between }
.clc_sch_box .btn_set .btn_clc_reset{  height:35px; line-height: 33px; background:#d1d1d1; border:#000 solid 1px; width:30%; }
.clc_sch_box .btn_set .btn_clc_sch{  height:35px; background:#000; border:#000 solid 1px; width:30%; color:#fff; }
.clc_sch_box .btn_set .btn_clc_detail{  height:35px; line-height: 33px; background:#fff; border:#000 solid 1px; width:30%; color:#000; }

.clc_list_wrap .list_total{ display:flex; justify-content: space-between; align-items: center; padding:20px 0; }
.clc_list_wrap .list_total p{ font-size:16px; font-weight:500; }
.clc_list_wrap .list_total .sort_list a{ display:inline-block; font-size:16px; font-weight:500; }
.clc_list_wrap .list_total .sort_list a.active{ color:#000; font-weight:bold; }
.clc_list_wrap .list_total .sort_list a:first-child{ border-right:#ddd solid 1px; padding-right:5px; margin-right:5px;}

.clc_list li{ margin-bottom:10px; }
.clc_list li .thumb{  width:200px; height:200px; background-size:cover; background-repeat:no-repeat; background-position:top center; margin:0 auto;  }
.clc_list li .txt{ padding:10px 0;  text-align:center;}
.clc_list li .txt span{ display:block; font-size:14px; font-weight:300; margin-bottom:5px; }
.clc_list li .txt .title{ font-size:20px; margin-bottom:10px; font-weight:bold; color:#282828; }
.clc_list li.no_data{ width:100%; margin:0; border:#ddd solid 1px; display:flex; justify-content: center; align-items: center; min-height:200px; }
.clc_list li.no_data p{ font-weight:bold; color:#282828; font-size:20px; line-height: 1.3; }
@media all and (min-width:768px){
    .clc_list{ display:flex; flex-wrap:wrap; }
    /*.clc_list li{ width:32%; margin-right:2%; margin-bottom:2%; }*/
  	.clc_list li{ width:32%; margin-right:2%; margin-bottom:5%; }
    .clc_list li:nth-child(3n){ margin-right:0 }
}
@media all and (min-width:1440px){
    
    .clc_sch_box{ padding:30px 0; }
    .clc_sch_box fieldset{ display:flex; flex-wrap:wrap; justify-content: center }
    .clc_sch_box .notice{ width:100%; font-size:22px; font-weight:bold; margin-bottom:20px; }
    .clc_sch_box .sch_row{ width:15%; margin-left:10px; }
    .clc_sch_box .sch_row select,
    .clc_sch_box .sch_row .sch_txt,
    .clc_sch_box .btn_set .btn_clc_reset,
    .clc_sch_box .btn_set .btn_clc_sch,
    .clc_sch_box .btn_set .btn_clc_detail{ height:40px; line-height: 37px; font-size:16px; }
    .clc_sch_box .row_txt{ width:30%; }
    .clc_sch_box .btn_set{ width:30%; }
    
    
    .clc_list_wrap{ padding:30px 0; }
    .clc_list_wrap .list_total{ padding:20px 0 30px; }
    
    /*.clc_list li{ width:19%; margin-right:1.25%; margin-bottom:1.25%; }*/
  	.clc_list li{ width:19%; margin-right:1.25%; margin-bottom:5%; }
    .clc_list li:nth-child(3n){ margin-right:1.25% }
    .clc_list li:nth-child(5n){ margin-right:0 }
    .clc_list li .thumb{ height:230px; width:100%; }
    .clc_list li .txt{ padding:15px 0; text-align:center;}
}

.clc_detail_wrap{ position:relative; }
.clc_detail_wrap .img_wrap img{ display:block; max-width:100%; margin:0 auto; }
.clc_detail_wrap .exp{ font-size:14px; text-align:center; word-break: keep-all; max-width:800px; margin:30px auto; line-height: 1.5 }
.clc_info{ display:flex; flex-wrap: wrap; border:#282828 solid 1px; padding:20px; }
.clc_info dt{ width:30%; font-weight:500; color:#000; line-height: 1.5; display:inline-flex; align-items: center }
.clc_info dt:before{ display:inline-block; content:""; width:5px; height:5px; border-radius:5px; background:#000; margin-right:10px; }
.clc_info dd{ width:70%;  line-height: 1.5 }
@media all and (min-width:768px){
    .clc_info{ padding:30px; }
    .clc_info dt{ width:15%; line-height: 1.8 }
    .clc_info dd{ width:35%; line-height: 1.8 }
}


.clc_thumb_wrap{ position:relative; padding:0 20px; }
.clc_thumb li{ float:left; margin:0 15px; }
.clc_thumb li a{display:block;overflow: hidden;width:150px;height:150px;font-size: 1px;line-height: 0;color:transparent;background-size:cover;background-position:top center}
.clc_thumb li.no_data{ display:inline-flex; align-items: center; justify-content: center; width:320px; height:150px; font-weight:bold; border:#ddd solid 1px; text-align: center; }
.thumb_ctrl{ position:absolute; left:0; top:0; right:0; }
.thumb_ctrl a{ position:absolute; top:60px; display:inline-block; font-size:25px; color:#000; }
.thumb_ctrl a.thumb_prev{ left:0; }
.thumb_ctrl a.thumb_next{ right:0; }