@charset "utf-8";
/* 2025-05-15 이후로 sass 작업이 어려워져서 추가 사항 css */

.board_area .paging a{width:28px;height:28px;display:inline-block; cursor:pointer; text-align:center;}
	.board_area .paging a img{display:none;}
	.board_area .paging a:first-of-type{
		background: url('/kor/assets/images/subpage/btn_arrow.svg') no-repeat;
		background-size:28px 28px;		
	}
	.board_area .paging a:last-of-type{
		transform: rotate(180deg);
		background: url('/kor/assets/images/subpage/btn_arrow.svg') no-repeat;
		background-size:28px 28px;		
	}	
	.board_area .paging a:last-of-type:hover,	.board_area .paging a:first-of-type:hover{
		background: url('/kor/assets/images/subpage/btn_arrow_active.svg') no-repeat;
		 background-size: 28px 28px;
	}
	.board_area .paging a.active{
		color:#72Af2d;
	}
	.board_area .paging a.active{
		position:relative;
		
	}	
	.board_area .paging a.active:before{
		content: "";
		position: absolute;
		bottom: -6px;
		width: 25px;
		height: 1px;
		background: #72AF2D;
		left: 50%;
		transform: translateX(-50%);		
	}
	
	/* 미디어 영역 모달창 */
	.gallery-item{cursor:pointer;}
	.modal_bg {
		position:absolute;	        
		background: rgba(0, 0, 0, 0.5);
        height: 100dvh;
	}
	.modal_bg .img-cont{
		width:600px;		
		background:#fff;
		position:relative;
		left:50%;
		top:50%; 
		transform:translate(-50%,-50%);
		border-radius:10px;
		overflow:hidden;      
        display: flex; 
		
	}

    .modal_bg .slider-cont{
        
        position: relative;

        transition: 1s;
        display: flex;
        /* overflow: hidden; */
    }
    .modal_bg .btn_prev,
    .modal_bg .btn_next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 14px;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: #ffffff;
        color: #333333;
        border: 1px solid #ddd;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transition: all 0.2s ease-in-out;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .modal_bg .btn_prev:hover,
    .modal_bg .btn_next:hover {
        color: #ffffff;
        background-color: #72AF2D;
        border-color: #72AF2D;
        box-shadow: 0 4px 10px rgba(255, 102, 0, 0.4);
        transform: translateY(-50%) scale(1.05);
    }
    
    .modal_bg .btn_prev {
        left: 10px;
    }
    
    .modal_bg .btn_next {
        right: 10px;
    }
    
    .disable {
        opacity: 0.4;
        cursor: not-allowed;
        pointer-events: none;
        filter: grayscale(100%);
    }

    .modal_bg .slider-cont{
        
        height: 300px;
        
        display: flex;
    }


	
	.modal_bg .img-cont img{
		width:600px;
		display:block;
        height: 100%;
        	
		
	}
	.modal_bg .img-cont img:nth-of-type(1){
        background: red;
    }
	.modal_bg .img-cont img:nth-of-type(2){
        background: blue;
    }
	.modal_bg .img-cont img:nth-of-type(3){
        background: green;
    }



	body.modal-open {
		overflow: hidden;
		height: 100%;
		touch-action: none; /* 모바일 터치 스크롤 방지 */
	}
	
	#view_area .btn_area{
		flex-wrap:wrap;
		gap:10px;
	}
	
	#view_area .btn_area a{
		width:100%;
	}


    /* 갤러리 다운로드 영역 */
    .down_area{
        display: flex;
        width: 100%;
        gap:24px;
        padding: 20px 0;
    }

    .down_area p {
        width: 218px;
        height: 68px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 20px;
        background: #f2f2f2;
        font-size: 18px;
    }

    .down_area .attach_list{
        min-height: 123px;
        flex-grow: 1;
        display: flex;
        gap: 6px;
        flex-wrap:wrap;
        background: #f2f2f2;
        border-radius: 20px;    
        padding: 20px;            
    }

    .down_area .attach_list .file-download{
        width: auto;
        height: auto;
        display: flex;
        font-size:18px;
        line-height: normal;
    }
    .file-download {
        display: flex;
        align-items: center;
        gap: 6px;
      }
      .btn_down {
        width: 20px;
        height: 20px;
        background: url('/kor/assets/images/media/btn_attach.png') no-repeat center/cover;
        flex-shrink: 0;
        display: inline-block;
      }
    @media (max-width:747px){
        .down_area{
            flex-direction: column;
            gap: 10px;
        }
        .down_area p {
            width: 100%;
            height: 36px;
            font-size: 14px;
        }
        
        .down_area .attach_list{
            padding: 20px 10px;
            display:block;
        }
     .file-download{
            word-wrap: break-word;     /* 단어 단위 줄바꿈 */
            word-break: break-all;     /* 단어 중간도 줄바꿈 가능 */
            white-space: normal;       /* 줄바꿈 허용 */
            max-width: 100%;
            display: inline !important;
            
        }
        
        .btn_down{
            width: 20px;
            height: 20px;
        }
    }
    
    /* 게시판 영역 b 태그 굵게*/
    .post-content b{
	    font-weight:800;
    }



    .slider__wrap {
        width: 100%;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    .slider__img {  /* 이미지가 보이는 영역 */
        position: relative;
        width: 800px;
        height: 450px;
        overflow: hidden;
        border: 3px solid #fff; /* 파란 계열 강조 */
   
    }
    .slider__inner {/* 전체 이미지를 감싸고 있는 부모 : 움직이는 부분 속성주기 */
        display: flex;
        flex-wrap: wrap;
        width: 4800px; /* 총 여섯개의 이미지 */
        height: 450px;
    }
    .slider {   /* 개별적인 이미지 (각각의 이미지 설정) */
        position: relative;
        width: 800px;
        height: 450px;
 
    }

    .slider::before {
        position: absolute;
        left: 5px;
        top: 5px;
        background: rgba(0, 0, 0, 0.4);
        color: #fff;
        padding: 5px 10px;
    }
    .modal_bg .slider-cont{
        position: relative;
        width: 800px;
        height: 450px;
    }
    .slider__thumb{
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: calc(100% + 36px);
        width: 800px;
        height: 90px;
        display: flex;
        /* justify-content: center; */
        /* gap: 10px; */
        background-color: rgba(0, 0, 0, 0.85);  
        box-shadow: 0 2px 8px rgba(0,0,0,0.05);        
    }
    .slider__thumb li{
        width: 20%;
        height: 100%;
        cursor: pointer;
       
    }

    .slider__thumb li.on img{
        opacity: 1;
        border: 2px solid #fff;
    }
    .slider__thumb li img{
        width: 100%;
        height: 100%;
        opacity: 0.6;
        transition: 0.5s;        
    }
    .slider__thumb li:hover img{
        opacity: 1;
    }
    .slider:nth-child(1)::before {content: '이미지1';}
    .slider:nth-child(2)::before {content: '이미지2';}
    .slider:nth-child(3)::before {content: '이미지3';}
    .slider:nth-child(4)::before {content: '이미지4';}
    .slider:nth-child(5)::before {content: '이미지5';}
    .slider:nth-child(6)::before {content: '이미지6';}


    .slider img{
        width: 100%;
        height: 100%;
        
    }

    .slider__btn a {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
 
        /* background: rgba(0,0,0,0.4); */
        text-align: center;
  
        transition: color 0.5s;
        display: block;
        color: #fff;
        cursor: pointer;
        font-size: 40px;
    }
    .slider__btn a:hover {
        /* border-radius: 50px;
        background: rgba(38, 52, 103, 0.4); */
        color: #72AF2D;
    }
    .slider__btn a.disabled{
        display: none;
    }
    .slider__btn a.prev {
        left: -78px;
    }
    .slider__btn a.next {
        right: -78px;
    }

    .slider__dot .dot.active {
        background: rgba(255,255,255,0.9);
    }


    @media(max-width : 800px){
        .slider__img {
            width: 100%;
            aspect-ratio: 16/9;
            height: auto;
            max-width: 360px;
            border: none;
        }
        .slider {
            width: 100%;
            max-width: 360px;
            height: auto;
            aspect-ratio: 16/9;
        }

        .slider img{
            width: 100%;
            height: auto;
            aspect-ratio: 16/9;
          
        }
        .modal_bg .slider-cont{
            width: 100%;
            max-width: 360px;
            height: auto;
            aspect-ratio: 16/9;
        }
        .slider__thumb{
            width: 100%;
            max-width: 360px;
            height: auto;
            aspect-ratio: 80/9;
            top: 100%;
            /* bottom: 0; */
            z-index: 99;
        }

        .slider__btn a.prev{
            left: 10px;
        }
        .slider__btn a.next{
            right: 10px;
        }

        .slider__btn a{
            font-size: 36px;

        }
    }
    
@media (max-width:747px){
	.post-body img{
		width:100%;
	}
	.card .card-body{
		width:100%;
	}
	.card .card-body .card-title{
		font-size:12px;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 최대 줄 수 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;		
	}
	.card .card-body .card-desc{
	font-size:12px;
  display: -webkit-box;
  -webkit-line-clamp: 3; /* 최대 줄 수 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;	}
}

/*참가업체 리스트*/
#exhi-list{
    padding: 60px 0 72px;
}
.search_area {
    display: flex;
    gap: 10px;
    justify-content: end;
}

.search_area select {
    padding: 0 20px;
    width: 136px;
    height: 36px;
    border-radius: 5px;
    border: 1px solid #ccc;
    color: #727171;
    background: url('../../assets/images/media/btn_tri_green.svg') no-repeat;
    background-position: right 10px center;
}

.search_area .search_box input {
    width: 327px;
    height: 36px;
    padding: 0px 20px;
    border-radius: 5px;
    border: 1px solid #ccc;
    outline: none;
}
.search_area .search_box {
    position: relative;
    margin-bottom: 36px;
}
.search_area .search_box button {
    width: 16px;
    height: 16px;
    background: url(../../assets/images/subpage/search_icon.svg) no-repeat center;
    background-size: 16px 16px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#exhi-list .board_info{
    padding: 10px 0;
}

#exhi-list .board_info span{
    font-size: 18px;
    color: #000;
    line-height: normal;
}
#exhi-list table{
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    text-align: center;
}

#exhi-list table thead{
    border-top: 2px solid #727171;
    background: #F2F2F2;
    height: 56px;
    
}

#exhi-list table thead th{
    vertical-align: middle;
    color: #727171;
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
}

#exhi-list table tbody tr{
    border-top: 1px solid #ccc;
    height: 56px;
}

#exhi-list table tbody tr:hover{
    background: #DCECCB;
}
#exhi-list table tbody td{
    vertical-align: middle;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;

}
#exhi-list table tbody td:nth-of-type(4){
    font-size: 14px;
}

#exhi-list table tbody tr:last-of-type{
    border-bottom: 1px solid #ccc;
}
#exhi-list .btn-details{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 128px;
    height: 36px;
    border-radius: 30px;
    background: #72af2d;
    color: #fff;
    font-size: 18px;
    line-height: normal;
    margin: 0 auto;
}

#exhi-list table tbody tr:hover .btn-details{
    background: #fff;
    color: #000;
}

@media (max-width:747px){
    #exhi-list{
        padding:10px 20px 40px;
    }
    #exhi-list .board_info{
        display: none;
    }
    .board_area .search_area select{
        background-position: right 20px center;
    }
    #exhi-list table thead{
        display: none;
    }
    #exhi-list table tbody tr{
        position: relative;
        display: flex;
        flex-direction: column;
        height: auto;
    }
    #exhi-list table tbody td{
        display: flex;
        padding: 0 20px;
        align-items: center;
    }


    #exhi-list table tbody tr:first-of-type{
        border-top: 1px solid #727171;
    }

    #exhi-list table tbody td.company{
        height: 52px;
        background: #F2F2F2;
        font-size: 16px;
    }
    #exhi-list table tbody td.code{
        
        height: 28px;
        font-size: 12px;
        font-weight: 900;
        color: #999;
    }
    #exhi-list table tbody td.item{
        height: 36px;
        font-size: 14px;

    }
    #exhi-list table tbody td.homepage{
        position: absolute;
        right: 0px;
        transform: translateY(50%);
    }
    #exhi-list table tbody td.view_detail{
        height: 48px;
        padding-bottom: 10px;
        justify-content: space-between;
    }
    #exhi-list table tbody td.view_detail::before{
        content: "세부정보";
        font-size:14px;
        line-height: normal;
        display: none;
    }
    #exhi-list .btn-details{
        margin: 0;
        width: 74px;
        height: 26px;
        font-size: 14px;
        margin-left: auto;

    }
    #exhi-list tr:hover td:nth-of-type(2){
        background: #DCECCB;
    }

}



.paging a b{
	font-weight:normal;
	position:relative;
	color:#72AF2D;
	font-size:16px;
}

.paging a b:before{
    content: "";
    position: absolute;
    bottom: -6px;
    width: 25px;
    height: 1px;
    background: #72AF2D;
    left: 50%;
    transform: translateX(-50%);
}

    header .select_area{
        display: none;
    }
@media (max-width: 767px) {
   .sidemenu .sidemenu_top .select_area{
        display: block;
        bottom: 0;
        right: 20px;
    }

    header .select_area{
        display: block;
        position: fixed;
        right:20px;
    }

    
}

.visitor_info table{
    width: 100%;
}