@charset "utf-8";
/*
(주)파이브센스_FIVESENSES.Corp.
본 라이브러리(소스코드 및 디자인 포함)는 (주)파이브센스의 자산이며, 저작권법 및 부정경쟁방지법에 의해 보호됩니다.
무단 사용, 외부 유출, 복제, 배포, 변형을 금지합니다.
위반 시 민·형사상 법적 책임 및 손해배상 청구 대상이 됩니다.
작성일: 2025-02-05 | 저작권자: (주)파이브센스(520-86-01244) | All Rights Reserved.
*/



.main_sbgb3 * {font-family: "Pretendard",sans-serif; line-height: 1;}
.main_sbgb3 .container_fix{padding: 0;}
.main_sbgb3 .swiper-container{max-width: 1200px; margin: 0 auto; overflow: visible;}

/* 타이틀 */
.main_sbgb3 .content_top {display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px;}
.main_sbgb3 .main_cont_title{width: 100%;}
.main_sbgb3 .main_cont_title h2,
.main_sbgb3 .main_cont_title h2 p{font-size: 30px; color: var(--main-point-color); font-weight: 700;}

/* 컨텐츠 영역 */
.main_sbgb3 .swiper_a {height: 100%; display: block; background-color: #fff; border-radius: 20px; overflow: hidden; position: relative; box-shadow: 0 10px 15px rgba(0, 0, 0, 0.05); transition: all .5s;}
.main_sbgb3 .swiper_a:hover { transform: translateY(-20px); transition: all .5s;}
/* .main_sbgb3 .swiper_a:hover{background-color: #e8e8e8;} */
.main_sbgb3 .swiper_a .post_content {padding: 22px 25px;}
.main_sbgb3 .swiper_a .post_content .post_subject{min-height: 108px; color: #0c0c0c; font-size: 24px; font-weight: 700; line-height: 36px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.main_sbgb3 .swiper_a .post_content .logo {display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; height: 30px;}
.main_sbgb3 .swiper_a .post_content .logo .gallery_logo img {max-width: 150px; max-height: 30px; object-fit: contain; transition: all .5s;}
.main_sbgb3 .swiper_a:hover .post_content .logo .arrow img {content: url(/img/arrow_on.png); transition: all .5s;}



/* 스와이퍼 버튼 */
.main_sbgb3 .tap_content_box .swiper-button{top: 47%; width: 64px; opacity: .35; transition: all .5s; display: none;  transition: all .5s;}
.main_sbgb3 .tap_content_box .swiper-button img{border-radius: 50%; box-shadow: 3px 0 8px rgba(61,61,61,.15);}
.main_sbgb3 .tap_content_box .swiper-button.swiper-button-next{right: -18px;}
.main_sbgb3 .tap_content_box .swiper-button.swiper-button-prev{position: absolute; left: -18px;}
.main_sbgb3 .tap_content_box .swiper-button::after{display: none;}
.main_sbgb3 .tap_content_box:hover .swiper-button{display: block;}
.main_sbgb3 .tap_content_box:hover .swiper-button.swiper-button-disabled{opacity: 0;}
.main_sbgb3 .tap_content_box .swiper-button:hover{opacity: 1;}
.main_sbgb3 .tap_content_box .swiper-button.swiper-button-disabled:hover{opacity: 0;}





@media all and (max-width: 991px) {
    .main_sbgb3 .content_top {display: block; margin-bottom: 20px;}
    .main_sbgb3 .tap_content_box{margin-top: 0px;}

    .main_sbgb3 .swiper_a {border-radius: 10px;}
    .main_sbgb3 .swiper_a:hover {transform: translateY(-10px);}
    .main_sbgb3 .swiper_a .post_content {padding: 15px;}
    .main_sbgb3 .swiper_a .post_content .logo {margin-bottom: 15px;}

    /* .main_sbgb3 .swiper-container .swiper-wrapper {flex-direction: row; flex-wrap: wrap; gap: 15p.main_sbgb3 .img_wrapx 10px;}
    .main_sbgb3 .swiper-container .swiper-wrapper .swiper-slide {display: none;}
    .main_sbgb3 .swiper-container .swiper-wrapper .swiper-slide:nth-child(-n+4) { display: block; width: calc((100% - 10px) /2) !important; margin-right: 0 !important;} */


    .main_sbgb3 .swiper_a .post_content .post_subject {font-size: 15px; line-height: 24px; min-height: 70px;}
    .main_sbgb3 .img_wrap {border-radius: 10px}

    .main_sbgb3 .tap_content_box .swiper-button {display: none !important;}
}

@media (max-width:768px) {
    .main_sbgb3 .content_top {margin-bottom: 15px;}
    .main_sbgb3 .main_cont_title h2,
    .main_sbgb3 .main_cont_title h2 p{font-size: 19px; }

    .main_sbgb3 .swiper_a .post_content .post_subject {font-size: 13px; line-height: 20px; min-height: 63px;}
    .main_sbgb3 .swiper_a .post_content .logo .gallery_logo img {max-width: 65px; width: 100%;}
    .main_sbgb3 .swiper_a .post_content .logo .arrow img {width: 15px;}
}