@charset "utf-8";
@import url(https://hangeul.pstatic.net/hangeul_static/css/nanum-gothic.css);

@font-face {
  font-family: 'GmarketSans';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
  font-weight: 700;
  font-style: bold;
}
@font-face {
  font-family: 'GmarketSans';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'GmarketSans';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
}

:root{
  --bk: #000;
  --wh: #fff;

  --gray-100: #F2F3F5;
  --gray-200: #EEEEEE;
  --gray-300: #DDDDDD;
  --gray-400: #DCDCDC;
  --gray-500: #CCCCCC;
  --gray-600: #AAAAAA;
  --gray-700: #999999;
  --gray-800: #666666;
  --gray-900: #333333;
  
  --point-100: #a8dcff;
  --point-200: #009eff;
}

.brand_view_wrap, .brand_list_wrap {box-sizing: border-box;}

@media screen and (max-width:1200px) {
  html,body{font-size: 14px;}  
}
@media screen and (max-width:760px) {
  html,body{font-size: 12px;}  
}
.wrap{width: 100%; overflow-x: hidden;}
.guide{ position: relative; min-width: 280px; height: 100%; margin: 0 auto;}
.ft_nanum{font-family: 'NanumGothic';}
.ft_gmarket{font-family: 'GmarketSans';}
.ft_notosans{font-family: 'Noto Sans KR'; font-weight: 500;}
@media screen and (min-width:761px) {
  .mob_view{display: none !important;}
}
.point_color01{color: var(--point-200);}

/* input */
input::placeholder{color: var(--gray-700); font-size: 1.25em;}
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder { color: transparent !important; }

/* sch_wrap */
.sch_wrap{ position: relative; width: 100%; height: 4.125em; margin-bottom: 2.5em; z-index: 10;}
.sch_field{height: 100%; position: relative; z-index: 1;}
.sch_wrap input{width: 100%; height: 100%; border-radius: 10em; border: 1px solid var(--gray-400); padding: 0.2em 2em 0 9.125em;}
.sch_wrap .sch_btn{width: 7.68em; height: calc(100% - 2px); background-color: var(--gray-100); display: flex; align-items: center; justify-content: center; border-radius: 10em; position: absolute; top: 51%; left: 1px; transform: translateY(-50%);}
.sch_wrap .sch_btn span{font-size: 2.18em; color: var(--gray-800);}

.recent_sch_wrap{ display: none; position: absolute; top: calc(100% + 9px); left: 0; width: 100%; z-index: 100; background-color: var(--wh); border: 1px solid var(--gray-400); padding: 1.5em 1.17em; border-radius: 0.875em; overflow: hidden;}
.recent_sch_mask{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5);}

.recent_sch_wrap .head{display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px;}
.recent_sch_wrap .head .tit{color: var(--gray-700);}
.recent_sch_wrap .cont{overflow: visible;}
.recent_sch_wrap .recent_sch_list{margin: -3px;}
.recent_sch_wrap .recent_sch_list li{width: auto; padding: 3px;}
.recent_sch_wrap .recent_sch_list li a{display: flex; align-items: center; background-color: var( --gray-100); border-radius: 5em; font-size: 12px; padding: 5px 10px;}
.recent_sch_wrap .recent_sch_list li span:nth-child(1) { color: black}
.recent_sch_wrap .recent_sch_list li span:nth-child(2) { color: var(--gray-700); padding-left: 6px;}

.recent_sch_wrap .recent_sch_list li.empty{color: var(--gray-700); text-align: center; width: 100%; padding: 14px 0;}

@media screen and (max-width:760px) {
  .sch_wrap{margin-bottom: 0;}
  .sch_wrap input{padding-left: 5.33em; padding-right: 3.33em}
  .sch_wrap .sch_btn{width: 6em;}  
  
  .sch_wrap.on .recent_sch_wrap,
  .sch_wrap.on .recent_sch_mask{display: block;}
}
/* cate_open_btn */
.cate_open_btn{ position: relative; width: 100%; cursor: pointer; height: 4.125em; background-color: var(--point-100); display: flex; align-items:center; justify-content: center; padding: 0 2em; border-radius: 10em; margin: 1.17em 0;}
.cate_open_btn .txt{font-size: 1.33em; padding-top: 3px;}
.cate_open_btn span{position: absolute; top: 50%; right: 0.8em; transform: translateY(-50%); font-size: 2em; }  

/* 모바일: 선택 카테고리 */
.select_cate_area{margin: -8px;}
.select_cate_area .select_cate{overflow: visible; }
.select_cate_area li{width: auto; min-width: 40%; padding: 8px;}
.select_cate_area li .sel_cate{ display: flex; align-items: center; justify-content: space-between;  border-radius: 5em; border: 1px solid var(--point-200); background-color: var(--wh); padding: 0.8em 1.75em 0.6em; color: var(--point-200);}
.select_cate_area li{font-size: 1.17em; }

.select_cate_area .btn_del{ cursor: pointer;}

/* 카테고리 리스트  */
.cate_field_head{text-align: center; margin-bottom: 10%;}
.cate_field_head .tit{font-size: 2em; line-height: 1em;}
.cate_field_head .desc{font-size: 1.17em; line-height: 1.14em; margin-top: 6px; color: var(--gray-800);}
.cate_field_list {display: flex; gap: 10px; padding-bottom: 2.5em;}
.cate_field_wrap .cate_field{width: auto;}
.cate_field input[type="checkbox"]{display: none;}
.cate_field label{ display: block; font-size: 1.125em; padding: 0.65em 1.68em 0.55em; border-radius: 10em; background-color: transparent; word-break: keep-all; line-height: 1.2em;}
.cate_field input[type="checkbox"]:checked + label{background-color: var(--point-100);}
@media screen and (min-width:1201px) {
  .cate_field_list{flex-wrap: wrap;}
}
@media screen and (min-width:761px) and (max-width: 1200px) {
  .cate_field_wrap{overflow: visible;}
}
@media screen and (min-width:761px) {
  .cate_wrap{display: block !important; opacity: 1 !important;}
}
@media screen and (max-width:760px) {
  .cate_wrap{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; background-color: rgba(0,0,0,0.44); min-width: 280px;}
  .cate_box{ width: 100%; background-color: var(--wh); position: absolute; bottom: -100%; left: 50%; transform: translateX(-50%); padding: 9% 8% 0; border-radius: 2em 2em 0 0;}
  .cate_field_list{ flex-wrap: wrap; gap: 5% 9%; height: 19.7em; overflow-y: auto; padding-bottom: 9%;}
  .cate_field_list::-webkit-scrollbar{display: none;}
  .cate_box .cate_field{width: calc(50% - 4.5%); height: auto; text-align: center;}
  .cate_field label{padding: 0.7em 0.3em; background-color: var(--gray-200); color: var(--gray-800); font-size: 1.16em;}
}

/* gallery_wrap */
.gallery_wrap{position: relative;}
.gallery_wrap .gallery_list{display: flex; flex-wrap: wrap; margin: -1.35% -2.2%;}
.gallery_list li{width: 25%; padding: 1.35% 2.2%;}
.gallery_list li .img{ position: relative; width: 100%; padding-top: 100%;} 
.gallery_list li .img img{object-fit: cover; display: block;width: 100%; height: 100%; border-radius: 0.875em; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.gallery_list li .txt_box{padding-top: 1.25em;} 
.gallery_list li .txt_box .brand_name{font-size: 1.25em; line-height: 1.2em; color: var(--point-200);}
.gallery_list li .txt_box .cate{font-size: 0.875em; line-height: 1.14em; margin-top: 5px; }

.gallery_list li.empty{color: var(--gray-700); text-align: center; width: 100%; padding: 5em 0;} 
@media screen and (max-width:1200px) {
  .gallery_list li{width: 33.33%;}
}
@media screen and (max-width:760px) {
  .gallery_wrap{padding-top: 3em;}
  .gallery_wrap .gallery_list{margin: -10px -8px;}
  .gallery_list li{width: 50%; padding: 10px 9px;}
  .gallery_list li .txt_box .cate{font-size: 12px;}
}

/* view */
.brand_view_wrap .guide{max-width: 1400px;}
.view_head{display: flex; flex-wrap: wrap;}
.view_head .brand_img{width: 15.875em; height: 15.875em;}
.view_head .brand_img img{display: block; width: 100%; height: 100%; border-radius: 0.875em; object-fit: cover; object-position: center;} 
.view_head .brand_info{width: calc(100% - 15.875em); padding-left: 2.375em;}
.brand_info .name{font-size: 1.875em; line-height: 1.17em; padding-bottom: 10px; border-bottom: 1px solid var(--gray-300);}   
.brand_info li + li{margin-top: 1.5em;}
.brand_info .info_cont{display: flex; flex-wrap: wrap; gap: 22px;}
.brand_info .info_cont .tit{ font-size: 1.5em;}
.brand_info .info_cont .desc{ flex: 1; font-size: 1.375em; font-weight: 700; margin-top: 1px;}
.brand_info .info_cont .brand_url{ display: flex; align-items: center; justify-content: center; width: 10em; padding: 0.7em 0 0.8em; border-radius: 5em; text-align: center; background-color: var(--gray-200); color: var(--gray-800); transition: all 0.2s;}
.brand_info .info_cont .brand_url:hover{background-color: var( --point-100);} 

.view_cont{margin-top: 3.125em;}
.brand_detail + .brand_detail{padding-top: 4.375em;}
.brand_detail .tit{font-size: 1.5em;}
.brand_detail .desc{line-height: 1.5em; padding-top: 1em;}

/* slide */
.brand_view_etc_wrap{position: relative; margin-top: 2.625em;}
.brand_view_img_slide .item{padding-top: calc(25% - 36px); position: relative;}
.brand_view_img_slide img{object-fit: cover; object-position: center; display: block; width: 100%; height: 100%; border-radius: 0.875em; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.brand_view_etc_wrap .swiper-button{top: 50%; width: 3.5em; height: 3.5em; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: var(--wh); border: 1px solid var(--gray-500); color: var(--gray-500); cursor: pointer; z-index: 10;}
.brand_view_etc_wrap .swiper-button::after{font-size: 1.5em; font-weight: 700;}
.brand_view_etc_wrap .swiper-button-next{right: -2%;} 
.brand_view_etc_wrap .swiper-button-prev{left: -2%;} 

@media screen and (max-width:960px) {
  .brand_view_img_slide .item{padding-top: calc(50% - 10px);}
}
@media screen and (max-width:760px) {
  .view_head{flex-direction: column; align-items: center;}
  .view_head .brand_info{width: 100%; padding-left: 0; padding-top: 3.67em;}
  .brand_info .info_cont:has(.brand_url){justify-content: space-between; gap: 0;}
  .brand_info .info_cont .brand_url{width: 45%; padding: 1em 0 0.85em; font-size: 1.17em;}

  .brand_detail + .brand_detail{padding-top: 2em;}
  .brand_detail .desc{font-size: 1.17em;}
}
@media screen and (max-width:560px) {
  .brand_view_etc_wrap{width: 64%; margin: 2.5em auto 0;}
  .brand_view_img_slide .item{padding-top: 100%;}  
  .brand_view_etc_wrap .swiper-button-next{right: -10%;} 
  .brand_view_etc_wrap .swiper-button-prev{left: -10%;}
}

/* pagination */
.pagination{ display: flex; align-items: center; justify-content: center; padding-top: 2.5em; width: 100%; text-align: right;}
.pagination > ul{display: flex; align-items: center; justify-content: center;}
.pagination > ul > li > span {color: var(--gray-700); display: flex; align-items: center; justify-content: center; width: 1.5em; height: 1.5em; transition: all 0.2s; border-radius: 3px; padding-bottom: 3px}

.pagination .move_btn{transition: all 0.2s;}
.pagination .move_btn span{color: var(--gray-700);}
.pagination > ul > li.now {background-color: var(--point-100);}
.pagination > ul > li:hover,
.pagination .move_btn:hover span{color: var(--point-200); cursor: pointer;}
@media screen and (max-width:760px) {
  .pagination { display: none;}
}

.pagination .page_btn {font-size: 16px; font-weight: 600;}

.sch_wrap .sch_close_btn {width: 5em; border:none; height: calc(100% - 2px);  display: flex; align-items: center; justify-content: center; border-radius: 10em; position: absolute; top: 50%; right: 1px; transform: translateY(-50%); background: none;}
.sch_wrap .sch_close_btn span{font-size: 2.18em; color: var(--gray-800);}

.cate {color: black}
.exhibitor_info:hover .cate {color: var(--point-200)}

.menu_wrap {
  display: flex;
  justify-content: center;
}

.menu_wrap div {
margin: 0 40px 20px;
}

.text_center {
text-align: center;
}

.text_left {
text-align: left;
}

.cat-tbl {
  line-height: 25px;
  border-top: none;
  width: 100%;
  /*display: table;
table-layout: fixed;*/
}

.cat-tbl tr th {
  text-align: center;
  background-color: #fff;
  border-top: 2px solid #666;
  border-bottom: 2px solid #666;
  border-left: none;
  border-right: none;
  padding: 10px 5px !important;
  /*white-space: nowrap;*/
}

.cat-tbl tr td {
  background-color: #fff;
  padding: 10px 5px !important;
  white-space: normal;
  border: none;
  border-bottom: 1px solid #c8c8c8;
}

.cat-btn {
  background: var(--point-200);
  color: #fff;
  border-radius: 0;
  padding: 10px 0;
  margin: 0;
  width: 100%;
  display: block;
}

.cat-btn:hover {
  color: #fff;
  background: var(--point-200);
}

.cat-btn:focus {
  color: #fff;
  background: var(--point-200);
}


.cat-tbl th,
.cat-tbl td {
  font-size: 13px;
}


.cat-tbl tr th:nth-child(1) {
  width: 8%;
  text-align: center;
}

.cat-tbl tr th:nth-child(2) {
  width: 15%;
  text-align: center;
}

.cat-tbl tr th:nth-child(3) {
  width: 20%;
  text-align: center;
}

.cat-tbl tr th:nth-child(4) {
  width: 46%;
}

.cat-tbl tr th:nth-child(5) {
  width: auto;
}

.cat-tbl tr th:nth-child(6) {
  width: 100px;
}

@media (max-width: 760px) {
  .cat-tbl tr th:nth-child(1) {
    width: 15%;
  }

  .cat-tbl tr th:nth-child(2) {
    width: 35%;
  }
  
  .cat-tbl tr th:nth-child(5) {
    width: 30%;
  }

  .menu_wrap div {
    margin: 0 20px 20px;
  }

}