@charset "utf-8";

/* CSS Document */
[id^="sect_0"] {
    /*padding: calc(var(--sec_pd) / 1.25) 0;*/
    transition: all var(--q_trans);
}

.half {
    width: 49% !important;
}

.sect_tit {
    line-height: 1.125;
}


/*섹션1*/
#sect_01 {
    padding: var(--sec_pd) 0;
    background-image: url("../images/sect_01_bg.png");
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

    #sect_01 .sect_01_cont {
    }

/*섹션2*/
#sect_02 {
    padding: var(--sec_pd) 0;
    background-image: url("../images/sect_02_bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

    #sect_02 .sect_tit {
        margin-top: -11rem
    }

    #sect_02 .sect_02_card {
        width: fit-content;
        min-width: 465px;
        min-height: 440px;
        box-shadow: 0 0 30px 0px rgba(0,0,0,0.25);
        line-height: 1.2;
    }


/*섹션3*/
#sect_03 {
    padding: calc(var(--sec_pd) * 1.5) 0 var(--sec_pd);
}

    #sect_03 .sect_03_cont {
        width: 100%;
    }



/*섹션4*/
#sect_04 {
    padding: calc(var(--sec_pd) / 2) 0;
}

    /*카드슬라이드*/
    #sect_04 .card_slide {
        width: 125%;
        margin-left: -12.5%;
        height: auto;
    }

        #sect_04 .card_slide .swiper {
            width: 100%;
            height: 100%;
            padding: 1rem;
        }

            #sect_04 .card_slide .swiper .swiper-slide {
                display: flex;
                justify-content: center;
                align-items: center;
                padding: 1rem;
            }

                #sect_04 .card_slide .swiper .swiper-slide .card {
                    width: 100%;
                    text-align: center;
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    border-radius: var(--br_s);
                    background: var(--white);
                    overflow: hidden;
                }

                    #sect_04 .card_slide .swiper .swiper-slide .card.shadow {
                        box-shadow: 0 0rem 0.5rem 0.125rem rgba(0,0,0,0.15) !important;
                    }

                    #sect_04 .card_slide .swiper .swiper-slide .card img {
                        display: block;
                        width: 100%;
                        height: auto;
                        object-fit: cover;
                        margin: 0rem auto;
                    }

                    #sect_04 .card_slide .swiper .swiper-slide .card .bg_point {
                        padding: 1.75rem .5rem;
						border-radius: var(--br_s);
                    }

/*섹션5*/
#sect_05 {
    padding: 0rem 0 calc(var(--sec_pd) * 1.25);
}

#sect_06 {
    padding: var(--sec_pd) 0 3rem;
}
/* 전체 슬라이드 박스 */
.sect_05_card, .sect_06_card {
    width: 100%;
    max-width: 650px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    box-sizing: border-box;
}

/* 썸네일 슬라이더 (위쪽) */
.sect5_card_SwiperT,
.sect6_card_SwiperT {
    width: 100%;
    max-width: 700px;
}

.sect6_card_SwiperT {
    max-width: 800px;
}

    /* 기본 썸네일 스타일 */
    .sect5_card_SwiperT .swiper-slide,
    .sect6_card_SwiperT .swiper-slide {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 1rem 1.5rem;
        border-radius: var(--br_l);
        background-color: var(--gray_f5);
        color: var(--gray_8);
        transition: all var(--q_trans);
        /*filter: drop-shadow(0 0.3rem 0.1rem rgba(0, 0, 0, 0.15));*/
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
        /* 마우스 오버 시 
        .sect5_card_SwiperT .swiper-slide:hover,
        .sect6_card_SwiperT .swiper-slide:hover {
            background-color: var(--point);
            color: var(--white);
            filter: drop-shadow(0 0.3rem 0.1rem rgba(0, 0, 0, 0.25));
        }
*/
    /* 선택된 썸네일(active) - Swiper 자동 클래스 사용 */
    .sect5_card_SwiperT .swiper-slide-thumb-active,
    .sect6_card_SwiperT .swiper-slide-thumb-active {
        background-color: var(--purple);
        color: var(--white);
    }
/* 아래 큰 이미지 슬라이더 전체 래퍼 */
.sect5_card_SwiperB,
.sect6_card_SwiperB {
    position: relative; /* 기준점 */
    width: 100%;
    max-width: 1000px;
    height: auto;
    box-sizing: border-box;
    filter: drop-shadow(0 0.2rem 0.5rem rgba(0, 0, 0, 0.25));
    margin: 0 auto; /* 중앙정렬 */
}

    .sect5_card_SwiperB img,
    .sect6_card_SwiperB img {
        display: block;
        object-fit: contain;
        margin: 0 auto
    }
/**/
#sect_07 {
    padding: var(--sec_pd) 0 calc(var(--sec_pd) * 2);
}

    #sect_07 .sect_07_cont {
        width: 70%;
    }

    #sect_07 .review_wrap {
        position: relative;
        overflow: hidden;
    }

    /*섹션7_질문섹션*/

    #sect_07 .accord_list {
        border-top: 1pt solid #9d9aa5;
        display: flex;
        flex-direction: column;
        gap: 0;
        width: 100%;
        /*max-width: 760px;*/
        margin: 0 auto;
        align-items: stretch;
    }

        #sect_07 .accord_list li {
            border-bottom: 1pt solid #9d9aa5;
        }

        #sect_07 .accord_list .accord_btn {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 3rem 0 1.5rem;
            /*border-radius: var(--br_m);*/
            background-color: var(--white);
            width: 100%;
            height: 4.5rem;
            cursor: pointer;
            position: relative;
            color: var(--gray_4);
            font-weight: 600;
        }

.arrow {
    position: relative;
    display: inline-block;
	width: 28.5px;
	height: 15.7px;
}

    .arrow::before,
    .arrow::after {
        content: "";
        position: absolute;
        top: 0;
        left: calc(50% - 1px);
		  width:2px;
		  height: 21px;
        /*border-radius: 9999px;*/
        background-color: #666666;
        transform-origin: 50% calc(100% - 1px);
    }

    .arrow::before {
        transform: rotate(45deg);
    }

    .arrow::after {
        transform: rotate(-45deg);
    }


#sect_07 .accord_list .accord_btn.active {
    background-color: var(--gray_f5);
}

    #sect_07 .accord_list .accord_btn.active .arrow {
        transform: rotate(180deg)
    }


#sect_07 .accord_list .accord_desc {
    padding: 2rem 3rem 2rem 1.5rem ;
    background-color: var(--gray_f5);
    /*border-radius: var(--br_m);*/
    margin-top: -1.2rem;
    display: none;
	line-height: 1.3;
	letter-spacing:-1px
}
#sect_07 .accord_list .accord_desc p{
	display: flex
}
    #sect_07 .accord_list .accord_desc.accord_desc_open {
        padding-bottom: 2em
    }

#sect_08 {
    padding: calc(var(--sec_pd) / 1.5) 0 var(--sec_pd);
}
/*아코디언 질답qa*/
span.qa{ display: inline-flex; justify-content: center;  min-width: 2rem; margin-right: 0.75rem }
/* 전체 슬라이드 박스 */
.sect_08_card {
    width: 100%;
    max-width: 970px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    box-sizing: border-box;
}

/* 썸네일 슬라이더 (위쪽) */
.sect8_card_SwiperT {
    width: 100%;
    height: 450px;
    max-width: 980px;
}

    .sect8_card_SwiperT .swiper-slide {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        transition: transform 0.3s ease;
    }

    .sect8_card_SwiperT .swiper-slide-thumb-active img {
        transform: translateY(-1rem);
        border-radius: calc(var(--br_m) + 2px );
        filter: drop-shadow(0 0.3rem 0.1rem rgba(140,50,250,0.56));
    }

    .sect8_card_SwiperT .swiper-slide-thumb-active p {
        color: var(--purple)
    }

    .sect8_card_SwiperT .swiper-slide img {
        cursor: pointer;
        transition: all var(--q_trans);
        outline: none;
    }

        .sect8_card_SwiperT .swiper-slide img:hover {
            outline: none;
            filter: drop-shadow(0 0.3rem 0.1rem rgba(140,50,250,0.25));
        }
/* 아래 큰 이미지 슬라이더 */
.sect8_card_SwiperB {
    width: 100%;
    max-width: 510px;
    height: autos; /* 660 - 350 = 310 */
    box-sizing: border-box;
    filter: drop-shadow(0 0.2rem 0.5rem rgba(0, 0, 0, 0.25));
}

    .sect8_card_SwiperB .swiper-slide {
        display: flex;
        align-items: center;
    }

    .sect8_card_SwiperB img {
        margin: auto;
        display: block;
        object-fit: contain;
    }

/* 좌우 버튼 */
.swiperB-prev,
.swiperB-next,
.swiperB-prev-06,
.swiperB-next-06,
.swiperB-prev-08,
.swiperB-next-08 {
    position: absolute;
    top: 50%;
    /*transform: translateY(-50%);*/
    z-index: 10;
    width: 38px !important;
    height: 38px !important;
    background-color: var(--white);
    border-radius: 50%;
    cursor: pointer;
}

/* 바깥으로 빼기 */
.swiperB-prev,
.swiperB-prev-06,
.swiperB-prev-08 {
    left: -50px; /* 이미지 왼쪽 바깥으로 */
}

.swiperB-next,
.swiperB-next-06,
.swiperB-next-08 {
    right: -50px; /* 이미지 오른쪽 바깥으로 */
}
    /* 내부 아이콘 크기/색상 조절 */
    .swiperB-prev::after,
    .swiperB-next::after,
    .swiperB-prev-06::after,
    .swiperB-next-06::after,
    .swiperB-prev-08::after,
    .swiperB-next-08::after {
        font-size: 20px !important;
        color: #666666;
        font-weight: 900;
    }


/* ==================== 해상도 1280px 이상 ==================== */

@media(max-width: 1380px) {
    #sect_04 .card_slide .swiper .swiper-slide {
        padding: 1.5rem;
    }

        #sect_04 .card_slide .swiper .swiper-slide .card img {
            width: 80%;
        }
}

/* ==================== 모바일 레이아웃 ==================== */
@media(max-width: 1280px) {
    .sect_tit .fs_32 {
        margin: 0.5rem 0 1.5rem;
    }
    /*섹션1*/
    #sect_01 {
        padding-top: var(--sec_pd);
    }

        #sect_01 .sect_tit img {
            width: 60px;
        }
        /*섹션1_유일무이*/
        #sect_01 .sect_01_cont {
            flex-direction: column;
        }

            #sect_01 .sect_01_cont .sect_01_card {
                min-width: 90%;
            }

                #sect_01 .sect_01_cont .sect_01_card .card_cont {
                    min-height: unset
                }

                #sect_01 .sect_01_cont .sect_01_card:first-child {
                    order: 1
                }

    #sect_02 > .wrap.d_flex {
        flex-direction: column
    }


    #sect_02 .sect_tit {
        margin-top: unset !important;
        text-align: center;
    }

    #sect_02 .sect_02_cont {
        width: 80%;
        flex-direction: column
    }

        #sect_02 .sect_02_cont .d_flex {
            width: 100%;
        }

    #sect_02 .sect_02_card {
        gap: 1rem;
        align-items: center;
        text-align: center;
        width: 100% !important;
        min-width: 100% !important;
        min-height: unset;
    }

    


    /*섹션4*/
    #sect_04 .sect_tit .fs_56.semibold.fc_navy {
        font-size: 2.5rem
    }


    /*섹션5*/
    #sect_05 {
    }

    /* 썸네일 슬라이더 (위쪽) */
    .sect5_card_SwiperT,
    .sect6_card_SwiperT,
    .sect8_card_SwiperT {
        max-width: 100% !important;
    }

    /* 아래 큰 이미지 슬라이더 */
    .sect5_card_SwiperB,
    .sect6_card_SwiperB,
    .sect8_card_SwiperB {
        width: 100% !important;
        height: unset; /* 660 - 350 = 310 */
    }
    /* 좌우 버튼 */
    .swiperB-prev,
    .swiperB-next,
    .swiperB-prev-06,
    .swiperB-next-06,
    .swiperB-prev-08,
    .swiperB-next-08 {
        display: none !important;
        /*width: 30px!important;
			height: 30px!important;
			opacity: 0.5*/
    }

    #sect_05 .wrap img,
    #sect_06 .wrap img {
        width: 100%;
        margin: 0 auto !important;
    }

    .sect8_card_SwiperT {
        width: 100%;
        height: fit-content;
    }

        .sect8_card_SwiperT .swiper-slide {
            padding: 1.5rem 0 0 0;
            margin: 0
        }


    /* 아래 큰 이미지 슬라이더 */
    .sect8_card_SwiperB {
        width: 100%;
        height: unset; /* 660 - 350 = 310 */
    }

    #sect_07 .sect_07_cont {
        width: 100%;
    }

    #sect_07 .accord_list .accord_btn {
        padding: 0 1rem;
    }
#sect_07 .accord_list .accord_desc {
	padding: 1rem 4rem 1rem 1rem;}
	
    #sect_07 .accord_list .accord_btn .fs_28{
		font-size: 1.5rem!important;
    }

    #sect_07 .accord_list .arrow {
        transform: scale(0.4);
    }

    #sect_07 .accord_list .accord_btn.active .arrow {
        transform: rotate(180deg) scale(0.4);
    }

    #sect_07 > .wrap.d_flex {
        width: 100% !important;
        flex-direction: column;
        align-items: center
    }

    #sect_07 .sect_tit {
        text-align: center;
    }

    #sect_07 .accord_list .accord_desc.accord_desc_open {
        
    }

    #sect_07 .accord_list, #sect_07 .accord_list li {
        max-width: 100% !important;
    }

        #sect_07 .accord_list .accord_desc {
            font-size: 1.5rem;
        }

    .half {
        width: 100% !important;
    }
}

@media(max-width: 900px) {
    /*섹션4*/
    #sect_04 .card_slide .swiper .swiper-slide {
        padding: 1.25rem;
    }


    .sect4_card_SwiperR .swiper-wrapper .swiper-slide .see_btn {
        bottom: 0rem !important;
    }
}

@media(max-width: 600px) {
	#sect_01 {
    padding: calc(var(--sec_pd) / 2) 0 var(--sec_pd);
    
}
	#sect_01 .sect_tit .fs_56{
		font-size: 2.5rem;
	}
	/*섹션3*/
    #sect_03 .sect_03_cont {
		flex-direction: column;
    }
	#sect_03 .sect_03_cont img{
		width: 80%;
	}
    #sect_04 .card_slide .swiper .swiper-slide {
        padding: .5rem;
    }
	.sect6_card_SwiperT .swiper-slide.fs_24{
		font-size:14px
	}
}