@charset "utf-8";
/* urban board v1.1.0 */

.sr{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px);}
.capntion_sr{width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px);}
.text_line_ellipsis{overflow:hidden; text-overflow: ellipsis; white-space:nowrap;  } /*1줄*/
.list_title{display:flex; align-items: center;}
.list_title .list_new{margin-right:8px; padding:2px 8px; display: block; border-radius: 4px; font-size:10px; font-weight: normal; color:#ffffff; background: #e90e0e; }
.list_title .add_file_icon{flex-shrink: 0; margin:0 8px; display: block; width:15px; height:16px; background: url("../images/board/add_file_icon.svg")no-repeat center;}
.noti{background: rgba(47, 49, 139, 0.04);}
.noti_badge{padding:4px 0; display: block; border-radius: 4px; color:#ffffff; background: var(--main_color);}

#list_header{padding-bottom:20px; display: flex; justify-content:space-between; align-items: flex-end; border-bottom:2px solid var(--main_color); }
#list_header .table_info{display: flex; justify-content: flex-end; font-size:16px;}
#list_header .board_search{display: flex; align-items: center; font-size:14px;}
#list_header .board_search fieldset{display: flex; align-items: center; justify-content: space-between;}
#list_header .board_search fieldset select {padding: 8px; width:120px; height:40px;  border: 1px solid #999999; -webkit-appearance: none; -moz-appearance: none; appearance: none;  background: url("../images/board/short_down-arrow.svg")no-repeat center right 10px / 9px; }
#list_header .board_search fieldset select,
#list_header .board_search fieldset input {margin: 0; font-size: 14px; color: #555; vertical-align: middle; height: 40px; cursor: pointer;}
#list_header .board_search fieldset .keyword {margin: 0 4px; padding: 7px 8px;  height: 40px; width: 220px;  box-sizing: border-box;  border: 1px solid #b5b5b5;}
#list_header .board_search fieldset .search_btn_wrap input{padding: 10px 20px; display: block; height: 40px;  background: var(--main_color); color:#ffffff; transition: background-color, .3s; }
#list_header .board_search fieldset .search_btn_wrap input[type="submit"]{position: relative; outline: none; border: none; }
#list_header .board_search fieldset .search_btn_wrap input:hover{background-color:#222222;}
#list_header .board_search .list_write{margin-left:8px; padding:8px 20px; height: 40px; background-color: var(--main_color); color:#ffffff; transition: background-color, .3s; }
#list_header .board_search .list_write:hover{background-color:#222222;}

/*pagination*/
#board_pagination{/*margin-top:40px;*/ display:flex; justify-content: center;}
#board_pagination .paging_inner_wrap{display:flex; align-items: center;}
#board_pagination .paging_inner_wrap .page_num{margin:0 8px; display: flex; justify-content: center; align-items: center; width:40px; height:40px; text-align: center; font-size:16px; border-radius: 50%; }
#board_pagination .paging_inner_wrap .page_num i{display: block;}
#board_pagination .paging_inner_wrap .page_num i svg{fill:#222222;}
#board_pagination .paging_inner_wrap .arrow_box{display: flex; align-items: center;}
#board_pagination .paging_inner_wrap .arrow_box .page_num{margin:0 2px; /*border:1px solid #999999;*/}
#board_pagination .paging_inner_wrap .page_num_group{display: flex; align-items: center;}
#board_pagination .paging_inner_wrap .page_num_group .page_num{position: relative;}
/* #board_pagination .paging_inner_wrap .page_num_group .page_num::before{content:""; position: absolute; bottom:4px; left:50%; transform:translateX(-50%); display:block; width:70%; height:2px; background:var(--main_color);} */
#board_pagination .paging_inner_wrap a:hover,
#board_pagination .paging_inner_wrap a:focus{background:#add9d0}
#board_pagination .paging_inner_wrap .page_num_group .page_num.active{color:#ffffff; background: var(--main_color);}

#img_list_board {margin:0; padding:0; width:100%; overflow-x: hidden; box-sizing: border-box;}
#img_list_board .img_list_board_wrap{width: 100%; font-size: 16px; }
#img_list_board .img_list_board_wrap ul li a{margin:0 0 20px; padding:24px 0; display: flex; align-items: center; justify-content: space-between; gap:0 28px; border-bottom:1px solid #dddddd;}
#img_list_board .img_list_board_wrap ul li a .img_wrap{position:relative; flex-shrink: 0; width:314px; height: 196px; overflow: hidden;  background: #eeeeee;}
#img_list_board .img_list_board_wrap ul li a .img_wrap figure{width: 100%; height:100%;}
#img_list_board .img_list_board_wrap ul li a .img_wrap img{width: 100%; height:100%; object-fit: cover;}
#img_list_board .img_list_board_wrap ul li a .text_wrap{width:calc(100% - (314px + 24px));}
#img_list_board .img_list_board_wrap ul li a .text_wrap h4{font-size:2.4rem; line-height: 1.5; transition:color .3s;}
#img_list_board .img_list_board_wrap ul li a .text_wrap p{margin-top:12px; color:#696969}
#img_list_board .img_list_board_wrap ul li a .text_wrap .list_item_info{margin-top:52px; display: flex; align-items: center; color:#999999;}
#img_list_board .img_list_board_wrap ul li a .text_wrap .list_item_info>div{position: relative; margin-right:14px; padding-right:15px;}
#img_list_board .img_list_board_wrap ul li a .text_wrap .list_item_info>div::after{content: ""; position: absolute; top:50%; right:0; transform: translateY(-50%); display: block; width: 1px; height:20px; background-color: #999999;}
#img_list_board .img_list_board_wrap ul li a .text_wrap .list_item_info>div:last-child:after{display: none;}
#img_list_board .img_list_board_wrap ul li a:hover .text_wrap h4{color:var(--main_color);}
#img_list_board .img_list_board_wrap ul li a:hover .text_wrap p{color:#222222}

/* #inquiry .inner_wrap{flex-wrap: wrap;}
#inquiry .inner_wrap article{width:100%;}
#inquiry .inquiry_form_wrap{margin:0 auto; width:1000px; }
#inquiry .inquiry_form_wrap fieldset{display: flex; flex-wrap: wrap; margin:0 -20px; }
#inquiry .inquiry_form_wrap fieldset>div{margin-bottom:40px; padding:0 20px; width:50%;}
#inquiry .inquiry_form_wrap fieldset>div:nth-child(n+4){width:100%;}
#inquiry .inquiry_form_wrap fieldset>div label{margin-bottom:4px; display: block; font-size:20px; color:var(--main_color); }
#inquiry .inquiry_form_wrap fieldset>div input{width:100%; padding:16px 20px; background: #eeeeee;  font-weight: normal;   transition:outline .3s; border:none; font-size:16px; }
#inquiry .inquiry_form_wrap fieldset>div textarea{width:100%; padding:16px 20px; font-size:16px; background: #eeeeee; border:none; transition:outline .3s; }
#inquiry .inquiry_form_wrap fieldset>div.submit_wrap{display: flex; justify-content: center;}
#inquiry .inquiry_form_wrap fieldset>div.submit_wrap .inquiry_btn{display:inline-block; padding: 16px 44px; border: none;  width: auto;  font-size: 18px; transition: background-color .3s; background: var(--main_color); color:#ffffff; cursor:pointer; transition: background-color .3s;}
#inquiry .inquiry_form_wrap fieldset>div.submit_wrap .inquiry_btn:hover,
#inquiry .inquiry_form_wrap fieldset>div.submit_wrap .inquiry_btn:focus{background: #222222;}
#inquiry .inquiry_form_wrap fieldset>div.captcha_wrap .captcha_inner{display: flex; align-items: center; flex-wrap: wrap;}
#inquiry .inquiry_form_wrap fieldset>div.captcha_wrap .captcha_input {padding:0; margin:0 8px; width:90px;height:40px;}
#inquiry .inquiry_form_wrap fieldset>div.captcha_wrap span{font-size:14px; color:#E37200;} */



#board_write input[type="text"], 
#board_write input[type="password"], 
#board_write select, 
#board_write input[type="date"], 
#board_write input[type="email"], 
#board_write textarea {padding: 8px; width: 200px; font-size: 15px;  border: 1px solid #DDE3EC; vertical-align: middle; box-sizing: border-box;}
#board_write input[type="text"].full_size, 
#board_write input[type="password"].full_size, 
#board_write input[type="email"].full_size,
#board_write select.full_size {width: 100%;}
#board_write table{margin-top: 12px; width: 100%; table-layout: fixed; border-top: 2px solid var(--main_color);}
#board_write table tr {border-bottom: 1px solid #DDE3EC;}
#board_write table th, 
#board_write table td {padding: 24px 5px; font-size: 15px; vertical-align: middle; text-align: center; }
#board_write table th {width:140px; font-weight: bold;}
#board_write table tbody tr td textarea {width: 100%; resize: vertical;}

#board_view .board_view_inner{width:100%; margin:0 auto; }
#board_view .board_view_inner .view_info{ width: 100%; table-layout: fixed; border-top:2px solid var(--main_color); border-bottom:1px solid #dbdbdb; font-size:16px; }
#board_view .board_view_inner .view_info tr{border-bottom: 1px solid #ebebeb;}
#board_view .board_view_inner .view_info tr th{color:var(--main_color); font-weight: bold; background:#f5f5f5;}
#board_view .board_view_inner .view_info tr th,
#board_view .board_view_inner .view_info tr td{padding:16px; vertical-align: middle; }
#board_view .board_view_inner .view_content{padding:40px 20px;  border-bottom:1px solid #dbdbdb; overflow: hidden;}
#board_view .board_view_inner .view_content img{max-width:100%;}
#board_view .board_view_inner .view_controll_btn_wrap{margin:20px -4px 0; display: flex; justify-content:flex-end ;}
#board_view .board_view_inner .view_controll_btn_wrap .view_controll_btn{padding: 15px 20px; background:var(--main_color); color:#ffffff; font-size:1em; transition: background-color, .3s;}
#board_view .board_view_inner .view_controll_btn_wrap .view_controll_btn:hover{background: #222222;}

input[type="button"] { padding: 15px 20px; border: 1px solid var(--main_color);  color: var(--main_color);  background-color: #ffffff;  transition: background-color, color, .3s; cursor: pointer;}




/* 
.checkbox_wrap{display: flex; align-items: center; flex-wrap: wrap;}
.content_wrap table td .checkbox_wrap label { margin-right: 32px;}
.checkbox_wrap input[type="checkbox"]{border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;width: 1px;}
.checkbox_wrap input[type="checkbox"]:hover,
.checkbox_wrap input[type="checkbox"]:focus{color:var(--main_color);}
.checkbox_wrap input[type="checkbox"]:hover + label:before,
.checkbox_wrap input[type="checkbox"]:focus + label:before{border-color: var(--main_color);}
.checkbox_wrap input[type="checkbox"] + label:hover:before,
.checkbox_wrap input[type="checkbox"] + label:focus:before{border-color: var(--main_color);}
.checkbox_wrap input[type="checkbox"]:active + label:before{transition-duration: 0;filter: brightness(0.2);}
.checkbox_wrap input[type="checkbox"] + label{position: relative; padding: 16px 0 16px 40px; font-weight: normal;}
.checkbox_wrap input[type="checkbox"] + label:before, input[type="checkbox"] + label:after{box-sizing: content-box; position: absolute;content: '';display: block; left: 0;}
.checkbox_wrap input[type="checkbox"] + label:before{top: 50%; width: 32px; height: 32px; margin-top: -18px; border: 1px solid #d9d9d9; text-align: center;}
.checkbox_wrap input[type="checkbox"] + label:after {background-color: var(--main_color); top: 50%; left: 6px; width: 8px; height: 8px; margin-top: -4px; transform: scale(0);  transform-origin: 50%; transition: transform 200ms ease-out;}
.checkbox_wrap input[type="checkbox"] + label:after { background-color: transparent; top: 50%; left: 13px; width: 7px; height: 4px; margin-top: -5px; border-style: solid; border-color: #ffffff; border-width: 0 0 3px 3px; transform: rotate(-45deg) scale(0); transition: none;}
.checkbox_wrap input[type="checkbox"]:checked + label:before {animation: borderscale 200ms ease-in; background: var(--main_color);}
.checkbox_wrap input[type="checkbox"]:checked + label:after { content: ''; transform: rotate(-45deg) scale(1);transition: transform 200ms ease-out;}
.required_dot {margin-left: 4px; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--main_color);}

.confirm_btn_wrap {margin-top: 32px;  display: flex; justify-content: center; height: 86px;}
.confirm_btn_wrap .btn_inner {padding: 20px;}
.confirm_btn_wrap input[type="button"]{padding:10px 32px; margin:0 4px; width:160px; border-radius: 5px; font-size:16px; border:none; cursor: pointer; transition: background-color, color, .3s;}
.confirm_btn_wrap input[type="button"]:first-child{color:#ffffff; background:var(--main_color);}
.confirm_btn_wrap input[type="button"]:nth-child(n+2){ background:#ffffff; border: 1px solid var(--main_color);}
.confirm_btn_wrap input[type="button"]:hover{background:#222222; color:#ffffff;}  */

 
@media(max-width:1240px) { 

}

@media(max-width:1024px) {    

  #list_header .table_info span { font-size: 14px;}
  #board_pagination .paging_inner_wrap .page_num{width:32px; height:32px; }

  #img_list_board .img_list_board_wrap {font-size: 15px;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap h4{font-size: 2rem;} 
  #img_list_board .img_list_board_wrap ul li a .img_wrap {width: 260px; height: 170px;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap {width: calc(100% - (260px + 24px));}
  #img_list_board .img_list_board_wrap ul li a .text_wrap .list_item_info {margin-top: 32px;}

 
  #inquiry .inquiry_form_wrap{width:100% }
  
  #board_view .board_view_inner .view_info {font-size:1em;} 

}

@media(max-width:768px) {
  #list_header {display: block;}
  #list_header .board_search{margin-top:10px;}
  #list_header .board_search form{width:100%;}
  #list_header .board_search fieldset select {width: 25%; flex-shrink: 0;}
  #list_header .board_search fieldset .keyword{width:60%;}
  #list_header .board_search fieldset .search_btn_wrap input[type="submit"] {position:relative; display: block; font-size:0; background-image: url("../images/board/search_icon.svg"); background-repeat: no-repeat; background-position: center center; background-size:16px 16px;}
  #list_header .board_search .list_write { font-size: 0; background-image: url("../images/board/add_rank_icon.svg"); background-repeat: no-repeat; background-position: center center; background-size:16px 16px;}

  #img_list_board .img_list_board_wrap ul li a{padding: 28px 0;}
  #img_list_board .img_list_board_wrap ul li a .img_wrap {width: 180px; height: 120px;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap {width: calc(100% - (180px + 24px));}
  #img_list_board .img_list_board_wrap ul li a .text_wrap h4 {font-size: 1.8rem;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap p {margin-top: 8px;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap .list_item_info {margin-top: 20px;}
    
  #inquiry .inquiry_form_wrap fieldset p label {font-size: 18px;}
}

@media(max-width:540px) {
  #board_pagination .paging_inner_wrap .page_num { margin: 0 4px; font-size: 14px;}  

  #img_list_board .img_list_board_wrap ul li a{margin: 0 -8px; flex-wrap: wrap;}
  #img_list_board .img_list_board_wrap ul li a>div {padding: 0 8px;}
  #img_list_board .img_list_board_wrap ul li a .btn_wrap {margin-left: 8px;}
  #img_list_board .img_list_board_wrap ul li a .img_wrap{width:100%; height: auto;}  
  #img_list_board .img_list_board_wrap ul li a .text_wrap {margin-top:12px; width: 100%;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap h4 i{display: block;}
  #img_list_board .img_list_board_wrap ul li a .text_wrap .text_inner{width: calc(100% - 36px);}


  #board_view .board_view_inner .view_info tr th{width:92px;} 
  #board_view .board_view_inner .view_info tr td{width:100%;}
  #board_view colgroup {display: none;}
 
  #inquiry .inquiry_form_wrap fieldset>div {width: 100%; margin-bottom: 20px;}
  #inquiry .inquiry_form_wrap fieldset>div label {font-size: 16px;}

  #board_write table th {width:80px;}
  /* #board_write table th, 
  #board_write table td {font-size: 14px;} */
  #board_write input[type="file"]{font-size:12px;} 
  .confirm_btn_wrap {margin-top: 8px; height: auto;}
  .confirm_btn_wrap .btn_inner {display: flex;}
  .confirm_btn_wrap input[type="button"] { font-size: 14px;}
    
}