.swiper-slide.mo_main {
    display: none;
}

.swiper-slide {
    display: flex;
}


.pagination {
    position: absolute;
    z-index: 1;
    bottom: 13vh !important;
    display: flex;
    justify-content: center;
}
.swiper-pagination-bullet {
    border-radius: 20px;
    width:12px;
    background:#fff;
    opacity:.5;
}

.swiper-pagination-bullet-active {
    opacity: .8;
    background: #88d4da;
    width: 22px;
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, 
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin:0 3px;
}

.main_banner {
    width: 100%;
    height: 100vh;
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow-x: hidden;
}

.banner_wrap {
    width:100%;
    position:relative;
}


.main_banner .main_visual {
    /*max-width: 1400px;*/
    width: 100%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    background-position: center -8vh;
    background-size: cover;
    background-repeat: no-repeat;
    align-items: center; /*추가*/
}


        .main_banner .main_visual.visual_box {
            position: absolute;
            top: 0;
        }


.main_visual.mo_main {
    display: none;
}
       


.main_banner .banner_wrap.pc_box {
    display: block;
}

.main_banner .banner_wrap.mo_box {
    display: none;
}

.main_banner .banner_wrap .txt_wrap {
    max-width: 1400px;
    width: 100%;
}

.main_banner .banner_wrap.pc_box .txt_box {
    display: flex;
    flex-direction: column;
    width: 1400px;
     padding-left: 5.5%; 
    margin: auto;
}

.main_banner .banner_wrap.pc_box .sub_title {
    font-size: 2.35rem;
    font-weight: 200;
    margin-bottom: 30px;
    letter-spacing: -1px;
}

.main_banner .banner_wrap.pc_box .main_title {
    font-size: 5rem;
    font-weight: 500;
    height: 21vh;
    line-height: 1.2;
}

.main_banner .banner_wrap.pc_box .view_btn {
    margin-top: 30px;
}

    .main_banner .banner_wrap.pc_box .view_btn a {
        display: block;
        padding: 18px 0;
        border: 1px solid #333;
        width: 160px;
        text-align: center;
        color: #333;
    }

        .main_banner .banner_wrap.pc_box .view_btn a > i {
            margin-left: 10px;
        }

        .main_banner .banner_wrap.pc_box .view_btn a:hover {
            background: #333;
            color: #fff;
            font-weight: 600;
            transition: .2s;
        }

    .main_banner .arrow_nav {
        position: absolute;
        bottom: 15vh;
        right: 15%;
        display: flex;
        margin: 0 auto;
        gap: 10px;
        z-index: 2;
    }


.shorts_wrap {
    max-width: 1400px;
    width: 100%;
    margin: 120px auto;
}

    .shorts_wrap .tit_box {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-flow: wrap;
        margin-bottom: 40px
    }

        .shorts_wrap .tit_box .tit {
            color: #333;
            font-size: 2rem;
            font-weight: 700;
        }

            .shorts_wrap .tit_box .tit img {
                width: 25px;
                vertical-align: middle;
            }

            .shorts_wrap .tit_box .tit span {
                color: #dd7a7a;
                margin-left: 5px;
            }

        .shorts_wrap .tit_box .more_txt {
            color: #333;
            font-weight: 500;
        }

            .shorts_wrap .tit_box .more_txt i {
                margin-left: 10px;
            }

    .shorts_wrap .thumb_list {
        display: flex;
        overflow: scroll;
        gap: 20px;
        scrollbar-width: none;
    }

        .shorts_wrap .thumb_list .short_thumb {
            width: 240px;
        }

        .shorts_wrap .thumb_list .shorts_img {
            display: inline-block;
            width: 240px;
        }

        .shorts_wrap .thumb_list .short_thumb img {
            width: 100%;
            border-radius: 20px;
            margin-bottom: 20px;
        }

        .shorts_wrap .thumb_list .short_thumb .tit {
            font-size: 1.2rem;
            font-weight: 500;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            margin-bottom: 15px;
        }

        .shorts_wrap .thumb_list .short_thumb .view_count {
            font-size: 0.9rem;
            font-weight: 700;
            color: #999;
        }



.youtube_wrap {
    width: 100%;
    padding: 120px 0;
    background: #f7efed;
}

    .youtube_wrap .ytb_box {
        max-width: 1400px;
        width: 100%;
        margin: 0 auto;
    }

        .youtube_wrap .ytb_box .tit_box {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-flow: wrap;
            margin-bottom: 40px
        }

            .youtube_wrap .ytb_box .tit_box .tit {
                color: #333;
                font-size: 2rem;
                font-weight: 700;
            }

                .youtube_wrap .ytb_box .tit_box .tit span {
                    margin-left: 10px;
                    color: #dd7a7a;
                }

            .youtube_wrap .ytb_box .tit_box .more_txt {
                color: #333;
                font-weight: 500;
            }

                .youtube_wrap .ytb_box .tit_box .more_txt i {
                    margin-left: 10px;
                }

        .youtube_wrap .ytb_box .youtube_box {
            display: flex;
            gap: 30px;
            align-items: stretch;
        }

            .youtube_wrap .ytb_box .youtube_box .main_ytb {
                width: 55%;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                background: #fff;
                border-radius: 30px;
                padding: 20px 20px 25px 20px;
            }

            .youtube_wrap .ytb_box .youtube_box .ytb_thumb img {
                width: 100%;
                border-radius: 15px;
            }

            .youtube_wrap .ytb_box .youtube_box .title {
                font-size: 1.7rem;
                color: #333;
                font-weight: 700;
                margin: 20px;
                line-height: 1.3;
                word-break: keep-all;
            }

            .youtube_wrap .ytb_box .youtube_box .main_ytb .name {
                font-size: 1.2rem;
                color: #333;
                font-weight: 600;
                margin: 20px 20px 0 20px;
            }

            .youtube_wrap .ytb_box .youtube_box .name span {
                display: inline-block;
                width: 30px;
                height: 30px;
                background: url(/Content/img/main/ytb_logo.png) no-repeat;
                background-position: 0 0;
                background-size: 100%;
                vertical-align: middle;
                margin-right: 10px;
            }

            .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag {
                margin: 20px 20px 0 20px;
                color: #267acf;
                font-size: 1.1rem;
            }

                .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag span {
                    color:#333;
                }
                    .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag span.txt {
                        font-size:1rem;
                        display:block;
                        margin-top:10px;
                        color:#777;
                    }


                .youtube_wrap .ytb_box .youtube_box .ytb_list {
                    width: 50%;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    align-items: stretch;
                }

                    .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn {
                        background: #fff;
                        border-radius: 20px;
                        padding: 20px;
                        display: flex;
                        gap: 20px;
                        width: 100%;
                    }

                    .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .thumb {
                        width: 50%;
                        display: table;
                    }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .thumb img {
                            width: 100%;
                            display: table-cell;
                            border-radius: 10px;
                        }

                    .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box {
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        width: 50%;
                    }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box .tit {
                            font-size: 1.1rem;
                            color: #333;
                            font-weight: 700;
                            line-height: 1.5;
                            text-overflow: ellipsis;
                            overflow: hidden;
                            word-break: break-word;
                            display: -webkit-box;
                            -webkit-line-clamp: 3;
                            -webkit-box-orient: vertical;
                        }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box .view_count {
                            color: #999;
                            font-weight: 700;
                        }



.event_wrap {
    max-width: 1400px;
    width: 100%;
    margin: 120px auto;
}

    .event_wrap .tit_box {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-flow: wrap;
        margin-bottom: 40px
    }

        .event_wrap .tit_box .tit {
            color: #333;
            font-size: 2rem;
            font-weight: 700;
        }

            .event_wrap .tit_box .tit span {
                color: #8cb9bd;
            }

        .event_wrap .tit_box .more_txt {
            color: #333;
            font-weight: 500;
        }

            .event_wrap .tit_box .more_txt i {
                margin-left: 10px;
            }

    .event_wrap .event_list {
        display: flex;
        overflow: scroll;
        gap: 20px;
        scrollbar-width: none;
    }

        .event_wrap .event_list .event_ctn {
            background: #f2dcb1;
            border-radius: 20px;
            position: relative;
            width: 340px;
            /*background: #f2dcb1 url(/Content/img/main/main_logo.png) no-repeat;
            background-position: 0 0;
            background-size: cover;*/
        }

            .event_wrap .event_list .event_ctn .event_img {
                width: 340px;
                display: table;
            }

            .event_wrap .event_list .event_ctn img {
                width: 100%;
                border-radius: 20px;
                display: table-cell;
            }

            .event_wrap .event_list .event_ctn .txt_box {
                background: #000000b5;
                position: absolute;
                bottom: 0;
                width: 100%;
                margin: 0;
                border-radius: 0 0 30px 30px;
                color: #fff;
                padding: 10px 20px;
                display: flex;
                justify-content: space-between;
                z-index: 3;
                align-items: center;
            }

                .event_wrap .event_list .event_ctn .txt_box .tit {
                    font-size: 1.4rem;
                }


                .event_wrap .event_list .event_ctn .txt_box .price {
                }

                    .event_wrap .event_list .event_ctn .txt_box .price span {
                        font-size: 2.8rem;
                        color: #efc675;
                        font-weight: 800;
                        letter-spacing: -1px;
                    }




.real_wrap {
    max-width: 1400px;
    width: 100%;
    margin: 0 auto 200px;
}

    .real_wrap .tit_box {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-flow: wrap;
        margin-bottom: 40px
    }

        .real_wrap .tit_box .tit {
            color: #333;
            font-size: 2rem;
            font-weight: 700;
        }

            .real_wrap .tit_box .tit span {
                color: #f6ce80;
            }

    .real_wrap.star {
        margin: 120px auto;
    }
    .real_wrap.star .tit_box .tit span {
        color: #b9a1d7;
    }
	
    .real_wrap.media {
        margin: 120px auto;
    }
    .real_wrap.media .tit_box .tit span {
        color: #f6a280;
    }

	
    .real_wrap .best {
        margin: 120px auto;
    }
    .real_wrap .best .tit_box .tit span {
        color: #c72c48;
    }

    .best .swiper-slide .tit {
        text-align:center;
    }

.btn_box {
    margin-top: 20px;
    text-align: center;
}

.btn_praise {
    background-color: #68b8be;
    color: white;
    font-weight: bold;
    padding: 10px 40px;
    font-size: 16px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
}


        .real_wrap .tit_box .more_txt {
            color: #333;
            font-weight: 500;
        }

            .real_wrap .tit_box .more_txt i {
                margin-left: 10px;
            }

    .real_wrap .real_list {
        display: flex;
        overflow: scroll;
        gap: 20px;
        scrollbar-width: none;
    }

        .real_wrap .real_list .real_ctn.selfi {
            width: 240px;
        }

        .real_wrap .real_list .real_ctn.star_item {
            width: 360px;
        }
        .real_wrap .real_list .real_ctn.best_item {
            width: 275px;
        }

        .real_wrap .real_list .real_ctn.star_item {
            width: 360px;
        }

        .real_wrap .real_list .real_ctn.selfi .real_img {
            width: 240px;
        }
        .real_wrap .real_list .swiper-slide .real_ctn.star_item .real_img {
            width: 360px;
        }


        .real_wrap .real_list .real_ctn .real_img img {
            width: 100%;
            border-radius: 30px;
            margin-bottom: 20px;
        }

    .real_wrap.media .real_list .real_ctn .real_img img {
        border-radius: 0;
        margin-bottom : 0;
    }

            .real_wrap .real_list .real_ctn .tit {
                font-size: 1.2rem;
                font-weight: 500;
                text-overflow: ellipsis;
                white-space: nowrap;
                overflow: hidden;
                margin-bottom: 15px;
            }

            .real_wrap .real_list .real_ctn .txt {
                font-size: 0.9rem;
                font-weight: 600;
                color: #999;
                line-height: 1.5;
            }

        .real_wrap .real_list.star_list .real_ctn .txt {
            color: #333;
            text-align: center;
            font-size: 1rem;
        }


.bar_wrap {
    width:100%;
    display:flex;
    justify-content:center;
}
    .bar_wrap a {
        display: block;
        width: 100%;
        height: 25vh;
        background-image: url(/UploadFile/Main/mainbar04.jpg);
        background-position: center bottom;
        background-repeat: no-repeat;
        background-size: contain;
        background-color: #1449d3;
    }


.benaf_wrap {
    max-width: 1400px;
    width: 100%;
    margin: 120px auto;
}
    .benaf_wrap .tit_box {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-flow: wrap;
        margin-bottom: 40px
    }

        .benaf_wrap .tit_box .tit {
            color: #333;
            font-size: 2rem;
            font-weight: 700;
        }

            .benaf_wrap .tit_box .tit span {
                color: #809dd3;
            }

        .benaf_wrap .tit_box .more_txt {
            color: #333;
            font-weight: 500;
        }

            .benaf_wrap .tit_box .more_txt i {
                margin-left: 10px;
            }

    .benaf_wrap .list-wrap .tab-wrap {
        display: flex;
        margin-top: 10px;
        margin-bottom: 20px;
        flex-wrap: wrap;
        gap: 10px;
    }

        .benaf_wrap .list-wrap .tab-wrap .tab {
            height: 100%;
        }

            .benaf_wrap .list-wrap .tab-wrap .tab input {
                display: none;
            }

            .benaf_wrap .list-wrap .tab-wrap .tab label {
                width: 100%;
                height: 100%;
                display: block;
                padding: 8px 20px;
                cursor: pointer;
                background: #efefef;
                border-radius: 50px;
                font-weight: 500;
            }

                .benaf_wrap .list-wrap .tab-wrap .tab label:hover {
                    color: #fff;
                    background: #809dd3;
                    transition: .2s;
                }


            .benaf_wrap .list-wrap .tab-wrap .tab input:checked + label {
                color: #fff;
                background: #809dd3;
                border-radius: 50px;
            }

.benaf_wrap .table-wrap {
    display: flex;
    justify-content: space-between;
}

    .table-wrap .bna_wrap {
        display: flex;
        flex-direction: column;
        width: 75%;
    }

    .table-wrap .bna_wrap .bna_txt {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .table-wrap .bna_wrap .bna_txt .sur_name span {
            font-weight: 700;
        }

        .table-wrap .bna_wrap .bna_txt .deg_btn div {
            display: inline-block;
            padding: 8px 12px;
            background: #65b6bc;
            color: #fff;
            margin-left: 5px;
            border-radius: 5px;
            font-weight: 500;
            cursor: pointer;
        }

        .table-wrap .bna_wrap .bna_box {
            width: 100%;
            margin-bottom: 20px;
            height: 525px;
        }

            .table-wrap .bna_wrap .bna_box .bna_img {
                display: flex;
                width: 100%;
                height: 100%;
                border-radius: 30px;
                overflow: hidden;
                border: 1px solid #cecece;
            }

            .table-wrap .bna_wrap .bna_box .bna_img .be_img,
            .table-wrap .bna_wrap .bna_box .bna_img .af_img {
                width: 50%;
                position: relative;
            }
                .table-wrap .bna_wrap .bna_box .bna_img .be_img img,
                .table-wrap .bna_wrap .bna_box .bna_img .af_img img {
                    width: 100%;
                    display: table-cell;
                }

                .table-wrap .bna_wrap .bna_box .bna_img .af_img .login {
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    background: #333333db;
                    color: #fff;
                    font-weight: 500;
                    display: flex;
                    flex-direction: column;
                    text-align: center;
                    align-items: center;
                    justify-content: center;
                    backdrop-filter: blur(10px);
                    -webkit-backdrop-filter: blur(10px);
                    font-size: 1.5rem;
                    padding: 10px;
                }

                    .table-wrap .bna_wrap .bna_box .bna_img .af_img .login .txt {
                        word-break: keep-all;
                    }

                    .table-wrap .bna_wrap .bna_box .bna_img .af_img .login a {
                        padding: 10px 30px;
                        color: #88d4da;
                        border: 2px solid #88d4da;
                        border-radius: 50px;
                        margin-top: 20px;
                    }

                        .table-wrap .bna_wrap .bna_box .bna_img .af_img .login a:hover {
                            background: #88d4da;
                            color: #fff;
                            transition: .2s;
                        }


                .table-wrap .bna_wrap .bna_box .bna_img .be_img .be_txt,
                .table-wrap .bna_wrap .bna_box .bna_img .af_img .af_txt {
                    position: absolute;
                    top: 20px;
                    left: 20px;
                    padding: 5px 10px;
                    border-radius: 5px;
                    background: #333;
                    color: #fff;
                    font-size: 1.1rem;
                    font-weight: 500;
                }
.table-wrap .col_bar {
    width: 1px;
    background: #cecece;
}

.thumb_wrap {
    width: 20%;
    overflow: scroll;
    height: 525px;
    scrollbar-width: none;
	margin-top:40px;
}


    .thumb_wrap .thumb_list {
        display: flex;
        gap: 10px;
        justify-content: space-between;
        width: 100%;
        flex-direction: column;
    }

        .thumb_wrap .thumb_list .thumb_box {
            width: 100%;
            border: 1px solid #cecece;
            border-radius: 20px;
            cursor: pointer;
            overflow: hidden;
            display: flex;
        }

            .thumb_wrap .thumb_list .thumb_box .thm_be,
            .thumb_wrap .thumb_list .thumb_box .thm_af {
                width: 50%;
                position: relative;
                display: flex;
            }


                .thumb_wrap .thumb_list .thumb_box .thm_be img,
                .thumb_wrap .thumb_list .thumb_box .thm_af img {
                    width: 100%;
                }

            .thumb_wrap .thumb_list .thumb_box.click {
                border: 5px solid #65b6bc;
            }

            .thumb_wrap .thumb_list .thumb_box .thm_af .thm_login {
                position: absolute;
                width: 100%;
                height: 100%;
                background: #98a5a8b5;
                color: #fff;
                font-weight: 500;
                display: flex;
                flex-direction: column;
                text-align: center;
                align-items: center;
                justify-content: center;
                backdrop-filter: blur(10px);
                -webkit-backdrop-filter: blur(10px);
            }






/*미디어쿼리 시작*/
@media (min-width: 768px) and (max-width: 1024px) {
    .main_banner .main_visual .txt_box {
       width:60%;
    }

    .main_banner .main_visual .sub_title {
        font-size: 2rem;
    }
    /*.main_banner .arrow_nav {*/
        /*display: none;*/
    /*}*/


    .shorts_wrap .tit_box,
    .event_wrap .tit_box,
    .real_wrap .tit_box,
    .benaf_wrap .tit_box,
	.main_review_section .review_title_area {
        margin-bottom: 20px;
        padding: 0 3vw;
    }

        .shorts_wrap .tit_box .tit img {
            width: 18px;
        }

        .shorts_wrap .tit_box .tit,
        .youtube_wrap .ytb_box .tit_box .tit,
        .event_wrap .tit_box .tit,
        .real_wrap .tit_box .tit,
        .benaf_wrap .tit_box .tit,
		.main_review_section .review_title_area .title_text {
            font-size: 1.3rem;
        }

        .shorts_wrap .tit_box .more_txt,
        .youtube_wrap .ytb_box .tit_box .more_txt,
        .event_wrap .tit_box .more_txt,
        .real_wrap .tit_box .more_txt, 
        .benaf_wrap .tit_box .more_txt,
		.main_review_section .review_title_area .more_txt {
            font-size: 0.7rem;
        }

            .shorts_wrap .tit_box .more_txt i,
            .youtube_wrap .ytb_box .tit_box .more_txt i,
            .event_wrap .tit_box .more_txt i,
            .real_wrap .tit_box .more_txt i,
			.main_review_section .review_title_area .more_txt i {
                margin-left: 5px;
            }

    .shorts_wrap .thumb_list,
    .event_wrap .event_list,
    .real_wrap .real_list,
    .benaf_wrap .list-wrap {
        margin: 0 3vw;
    }


    .youtube_wrap .ytb_box {
        width: unset;
        padding: 0 3vw;
    }

        .youtube_wrap .ytb_box .tit_box {
            margin-bottom: 20px;
        }

        .youtube_wrap .ytb_box .youtube_box {
            gap: 10px;
        }

            .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag span.txt {
                display: none;
            }

            .youtube_wrap .ytb_box .youtube_box .main_ytb {
                padding: 20px;
            }

            .youtube_wrap .ytb_box .youtube_box .title {
                margin: 20px 0 0 0;
                font-size: 1.5rem;
            }

            .youtube_wrap .ytb_box .youtube_box .name span {
                width: 25px;
                height: 25px;
                margin-right: 10px;
            }

            .youtube_wrap .ytb_box .youtube_box .main_ytb .name,
            .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag {
                margin: 15px 0 0 0;
                font-size: 0.9rem;
            }

            .youtube_wrap .ytb_box .youtube_box .ytb_list {
                gap: 10px;
            }

                .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn {
                    gap: 10px;
                }

                    .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .thumb {
                        width: 50%;
                    }

                    .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box {
                        width: 50%;
                    }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box .tit {
                            font-size: 0.85rem;
                        }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box .view_count {
                            font-size: 0.7rem;
                        }

    .bar_wrap a {
        background-image: url(/UploadFile/Main/momainbar04.jpg);
    }

    .real_wrap {
        margin-bottom: 150px;
    }
        .real_wrap.star {
            margin-bottom: 80px;
        }



    .table-wrap .bna_wrap .bna_box .bna_img .be_img .be_txt,
    .table-wrap .bna_wrap .bna_box .bna_img .af_img .af_txt {
        font-size: 0.9rem;
    }

    .table-wrap .bna_wrap .bna_box .bna_img .af_img .login {
        font-size: 1rem;
    }

    .benaf_wrap .table-wrap {
        flex-direction: column;
    }
    .table-wrap .bna_wrap {
        width:100%;
    }

        .table-wrap .bna_wrap .bna_box {
            height:unset;
        }

    .thumb_wrap {
        width: 100%;
        height: unset;
        display: flex;
        margin-top: 30px;
    }

        .thumb_wrap .thumb_list {
            flex-direction: row;
            width: unset;
        }

            .thumb_wrap .thumb_list .thumb_box {
                width: 250px;
            }

}




@media screen and (max-width: 767px) {

    .main_visual.pc_main {
        display: none;
    }

    .main_visual.mo_main {
        display: flex;
    }

    .main_banner {
        justify-content: end;
        height:90vh;
    }


    .pagination {
        bottom: 7vh !important;
    }

    .swiper-pagination-bullet {
        width: 15px;
    }

    .swiper-pagination-bullet-active {
        width: 25px;
    }


        .main_banner .main_visual {
            padding-left: unset;
            background-position: center center;
            background-size: cover;
            justify-content: flex-end;
        }

            .main_banner .banner_wrap.pc_box {
                display: none;
            }
        .main_banner .banner_wrap.mo_box {
            display:block;
        }
            .main_banner .banner_wrap.mo_box .txt_wrap {
                top: 51%;
                position: absolute;
            }

            .main_banner .banner_wrap.mo_box .txt_box {
                align-items: center;
                width: unset;
                padding: 0 30px 8vh 30px;
                text-align: center;
            }

            .main_banner .banner_wrap.mo_box .sub_title {
                font-size: 1.5rem;
                font-weight: 200;
                margin-bottom: 10px;
                color: #fff;
                text-shadow: 2px 2px 8px #000000cc;
            }

            .main_banner .banner_wrap.mo_box .main_title {
                font-size: 3rem;
                height: 17vh;
                line-height: 1.2;
                color: #fff !important;
                text-shadow: 4px 4px 10px #0000005c;
            }


            .main_banner .banner_wrap.mo_box .view_btn a {
                display: block;
                padding: 10px;
                font-size: 0.8rem;
                width: 100px;
                color: #fff;
                border: 1px solid #fff;
                background: #ffffff2b;
                margin: 10px auto;
            }
            .main_banner .banner_wrap.mo_box .view_btn i {
                margin-left: 3px;
            }

            /*.main_banner .arrow_nav {*/
                /*display: none;*/
            /*}*/

    .shorts_wrap,
    .youtube_wrap,
    .event_wrap,
    .benaf_wrap {
        margin: 80px 0;
    }

        .shorts_wrap .tit_box,
        .event_wrap .tit_box,
        .real_wrap .tit_box,
        .benaf_wrap .tit_box,
		.main_review_section .review_title_area {
            margin-bottom: 20px;
            padding: 0 3vw;
        }

            .shorts_wrap .tit_box .tit img {
                width: 18px;
            }

            .shorts_wrap .tit_box .tit,
            .youtube_wrap .ytb_box .tit_box .tit,
            .event_wrap .tit_box .tit,
            .real_wrap .tit_box .tit,
            .benaf_wrap .tit_box .tit,
			.main_review_section .review_title_area .title_text {
                font-size: 1.3rem;
            }

            .shorts_wrap .tit_box .more_txt,
            .youtube_wrap .ytb_box .tit_box .more_txt,
            .event_wrap .tit_box .more_txt,
            .real_wrap .tit_box .more_txt,
            .benaf_wrap .tit_box .more_txt,
			.main_review_section .review_title_area .more_txt {
                font-size: 0.7rem;
            }

                .shorts_wrap .tit_box .more_txt i,
                .youtube_wrap .ytb_box .tit_box .more_txt i,
                .event_wrap .tit_box .more_txt i,
                .real_wrap .tit_box .more_txt i,
                .benaf_wrap .tit_box .more_txt i,
				.main_review_section .review_title_area .more_txt i {
                    margin-left: 5px;
                }

        .shorts_wrap .thumb_list,
        .event_wrap .event_list,
        .benaf_wrap .list-wrap {
            margin: 0 3vw;
        }



            .shorts_wrap .thumb_list .short_thumb {
                width: 220px;
            }

            .shorts_wrap .thumb_list .shorts_img {
                display: inline-block;
                width: 220px;
            }

            .shorts_wrap .thumb_list .short_thumb img {
                margin-bottom: 10px;
            }
            .shorts_wrap .thumb_list .short_thumb .tit {
                margin-bottom: 5px;
                font-size: 1rem;
            }
            .shorts_wrap .thumb_list .short_thumb .view_count {
                font-size: 0.8rem;
            }


            .youtube_wrap {
                padding: 80px 0;
            }

        .youtube_wrap .ytb_box {
            width: unset;
            padding: 0 3vw;
        }

            .youtube_wrap .ytb_box .tit_box {
                margin-bottom: 20px;
            }

            .youtube_wrap .ytb_box .youtube_box {
                flex-direction: column;
                gap: 10px;
            }

                .youtube_wrap .ytb_box .youtube_box .main_ytb {
                    width: unset;
                    padding: 20px;
                    border-radius: 20px;
                }

                .youtube_wrap .ytb_box .youtube_box .title {
                    margin: 20px 0 0 0;
                    font-size: 1.5rem;
                }


                .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag span.txt {
                    display:none;
                }

                .youtube_wrap .ytb_box .youtube_box .name span {
                    width: 25px;
                    height: 25px;
                    margin-right: 10px;
                }

                .youtube_wrap .ytb_box .youtube_box .main_ytb .name,
                .youtube_wrap .ytb_box .youtube_box .main_ytb .hashtag {
                    margin: 15px 0 0 0;
                    font-size: 0.9rem;
                }

                .youtube_wrap .ytb_box .youtube_box .ytb_list {
                    width: unset;
                    gap: 10px;
                }

                    .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn {
                        gap: 10px;
                        border-radius: 15px;
                    }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .thumb {
                            width: 50%;
                        }

                        .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box {
                            width: 50%;
                        }

                            .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box .tit {
                                font-size: 0.85rem;
                            }

                            .youtube_wrap .ytb_box .youtube_box .ytb_list .sub_ctn .txt_box .view_count {
                                font-size: 0.7rem;
                            }



    .real_wrap.media {
        margin: 80px auto;
    }


    .event_wrap .event_list .event_ctn {
        width:280px;
    }
        .event_wrap .event_list .event_ctn .event_img {
            width: 280px;
        }

        .event_wrap .event_list .event_ctn .txt_box .tit {
            font-size: 1.1rem;
        }

        .event_wrap .event_list .event_ctn .txt_box .price span {
            font-size: 2.2rem;
        }


        .real_wrap {
            margin-bottom: 120px;
        }
        .real_wrap.star {
            margin-bottom: 80px;
            margin-top: 80px
        }

    .real_wrap .real_list {
        margin: 0 3vw;
    }

        .real_wrap .real_list .real_ctn .txt {
            font-size: 0.8rem;
        }


        .real_wrap .real_list .real_ctn {
            width: 200px;
        }

            .real_wrap .real_list .real_ctn .real_img {
                width: 200px;
            }


    .bar_wrap {
        /*padding: 0 3vw;*/
    }

        .bar_wrap a {
            background-image: url(/UploadFile/Main/momainbar04.jpg);
            height: 27.7vh;
        }


    .table-wrap .bna_wrap .bna_box .bna_img .be_img .be_txt,
    .table-wrap .bna_wrap .bna_box .bna_img .af_img .af_txt {
        font-size: 0.65rem;
        top: 5px;
        left: 5px;
    }
    .table-wrap .bna_wrap .bna_box .bna_img {
        border-radius: 10px;
    }

        .table-wrap .bna_wrap .bna_box .bna_img .af_img .login {
            font-size: 0.8rem;
        }

            .table-wrap .bna_wrap .bna_box .bna_img .af_img .login a {
                padding: 4px 25px;
                margin-top: 5px;
            }

    .table-wrap .bna_wrap .bna_txt {
        flex-direction: column-reverse;
        gap: 10px;
        font-size: 0.85rem;
    }

    .benaf_wrap .table-wrap {
        flex-direction: column;
    }

    .table-wrap .bna_wrap {
        width: 100%;
    }

        .table-wrap .bna_wrap .bna_box {
            height: unset;
        }

    .thumb_wrap {
        width: 100%;
        height: unset;
        display: flex;
        margin-top: 30px;
    }

        .thumb_wrap .thumb_list {
            flex-direction: row;
            width: unset;
        }

            .thumb_wrap .thumb_list .thumb_box {
                width: 180px;
                border-radius: 15px;
            }

                .thumb_wrap .thumb_list .thumb_box .thm_af .thm_login {
                    font-size: 0.7rem;
                }

    .benaf_wrap .list-wrap .tab-wrap .tab label {
        font-size: 0.9rem;
    }

}

@media screen and (max-width: 400px) {
    @media screen and (max-width: 767px) {

        .bar_wrap a {
            height: 33.8vh;
            background-position: center center;
        }
    }
}


/* =============================
   Before/After 메인 비교 UI 스타일
   ============================= */

.bna-main-wrap {
  max-width: 1120px;
  margin: 0 auto 60px;
  padding: 0 20px;
  box-sizing: border-box;
}

.surgery-title {
  font-size: 16px;
  font-weight: bold;
  margin: 10px 0;
  color: #333;
}

.view-toggle-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 16px 0 24px;
}

.toggle-switch {
  display: flex;
  align-items: center;
  background: #f1f1f1;
  border-radius: 30px;
  padding: 6px 12px;
  gap: 12px;
}

.toggle-switch span {
  font-size: 14px;
  white-space: nowrap;
}

.toggle-btn {
  width: 36px;
  height: 18px;
  background: #aee4e7;
  border-radius: 30px;
  position: relative;
  cursor: pointer;
}

.toggle-btn::before {
  content: "";
  width: 16px;
  height: 16px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 1px;
  left: 1px;
  transition: left 0.3s;
}

.toggle-btn.active {
  background: #aee4e7;
}

.toggle-btn.active::before {
  left: 19px;
}

.compare-wrap {
  /*border: 1px solid #ddd;*/
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  margin-bottom: 20px;
  /*padding: 12px;*/
  box-sizing: border-box;
}

/*.split-view {*/
  /*display: flex;*/
  /*gap: 0;*/
  /*aspect-ratio: 2 / 1;*/
  /*overflow: hidden;*/
/*}*/

/*.split-box {*/
  /*width: 50%;*/
  /*position: relative;*/
  /*display: flex;*/
  /*border: 1px solid #ddd;*/
  /*border-radius: 12px;*/
  /*justify-content: center;*/
  /*align-items: center;*/
  /*overflow: hidden;*/
/*}*/

.split-view {
  display: flex;
  gap: 0;
  aspect-ratio: 2 / 1;
  border: 1px solid #ddd;
  border-radius: 12px;
  overflow: hidden;
}
.split-box {
  width: 50%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  /* border랑 radius 제거 */
  border: none;
  border-radius: 0;
}


.split-box img {
  width: 100%;
  object-fit: contain;
}

.split-label {
  position: absolute;
  top: 12px;
  left: 12px;
  background: #333;
  color: #fff;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: bold;
}

.split-box.right .split-label {
  right: 12px;
  left: auto;
}

.overlay-view {
  position: relative;
  aspect-ratio: 1 / 1;
  max-width: 560px;
  margin: 0 auto 20px;
  background: #e1f6f7;
  border: 1px solid #ddd;
  border-radius: 12px;
  overflow: hidden;
  touch-action: none;
}

.overlay-view img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
}

.before-img {
  z-index: 2;
  clip-path: inset(0 0 50% 0);
}

.after-img {
  z-index: 1;
}

.slider {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 40px;
  z-index: 3;
  cursor: ns-resize;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
}

.slider::before {
  content: "";
  position: absolute;
  height: 2px;
  width: 100%;
  background-color: white;
  z-index: -1;
}

.slider::after {
  content: "";
  width: 36px;
  height: 36px;
  background-color: white;
  border-radius: 50%;
  border: 2px solid #ccc;
}

.arrow {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
}

.arrow.up {
  top: 6px;
  border-width: 0 6px 6px 6px;
  border-color: transparent transparent #666 transparent;
}

.arrow.down {
  bottom: 6px;
  border-width: 6px 6px 0 6px;
  border-color: #666 transparent transparent transparent;
}

.util-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  gap: 10px;
}

.angle-buttons {
  display: flex;
  gap: 8px;
}

.angle-btn {
  background: #7ac5ca;
  padding: 8px 14px;
  border-radius: 10px;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  cursor: pointer;
  transition: background 0.2s;
}

.angle-btn.active {
  background: #5eb3b8;
}

.icon-buttons {
  display: flex;
  gap: 10px;
  font-size: 24px;
  color: #888;
}

@media (max-width: 768px) {
  .split-view {
    /*flex-direction: column;*/
    aspect-ratio: auto;
  }

  .split-box {
    width: 100%;
    aspect-ratio: 1 / 1;
  }

  .angle-buttons {
    flex-wrap: wrap;
  }

  .compare-wrap {
    padding: 8px;
  }
}


.split-box .login {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(51, 51, 51, 0.2); /* 어두운 반투명 배경 */
  color: #fff;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  font-size: 1rem;
  z-index: 1;
  padding: 10px;
  box-sizing: border-box;
  text-align: center;
}

.split-box .login .txt {
  line-height: 1.4;
}

    .split-box .login a {
        margin-top: 15px;
        padding: 8px 24px;
        color: #fff;
        border: 2px solid #fff;
        background: rgb(255 255 255 / 20%);
        border-radius: 50px;
        text-decoration: none;
        font-weight: bold;
        transition: 0.2s;
    }

        .split-box .login a:hover {
            background: #88d4da;
            border: 2px solid #88d4da;
            color: #fff;
        }








@media (max-width: 980px) {
  .split-box .login {
	  font-size: 0.7rem;
  }
}




/*a.main_visual {*/
  /*opacity: 0.3; /* 또는 0.5 정도로도 테스트 가능 */*/
/*}*/

.banner_wrap {
  position: relative;
  position: relative;
  width: 100%;
  height: 100%; /* 또는 필요하면 고정값 */
  overflow: hidden;
  
}

.banner_wrap video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90%;
  min-width: 100%;
  /*object-fit: contain; /* 비율 유지하면서 꽉 안 채움 */*/
  object-fit: cover;
  z-index: 2;
  pointer-events: none;
}

.banner_wrap .main_visual {
  position: relative;
  z-index: 1; /* 또는 아예 z-index 생략 */
}












/*****************************************/

/* pc  */
@media (min-width: 769px) {
	/* 비디오 부분 */
	.mo_box2 {
		display: none !important;
	}
	

	.main_banner .arrow_nav a {
		display: block;
		width: 50px;
		height: 50px;
		background-color: #00000036;
		border-radius: 100%;
		color: #fff;
	}

	.main_banner .arrow_nav a > i {
		padding: 16px 20px;
	}
}


/* mobile  */
@media (max-width: 768px) {

	/* 비디오가 있는 배너 슬라이드 wrapper */
	.banner_wrap2.mo_box2 {
	  display: flex;
	  flex-direction: column;
	  width: 100%;
	  height: 100vh; /* 총 높이 100%로 고정 */
	}

	/* 배경 이미지 부분 */
	.main_visual2.mo_main2 {
	  display: block;
	  width: 100%;
	  height: 30vh; /* 화면 절반 */
	  background-size: cover;
	  background-position: center;
	}

	/* 비디오 부분 */
	.mo_box2 video {
	  display: block;
	  width: 100%;
	  height: 50vh; /* 화면 절반 */
	  object-fit: cover;
	  margin-top: 0; /* 여백 제거 */
	  border:1px
	}


	.arrow_nav {
	  width: 112px;
	}
    .main_banner .arrow_nav {
		position: absolute;
		bottom: 1vh;
		left: 50%;
		transform: translateX(-60%);
		display: flex;
		gap: 10px;
		z-index: 2;
    }

	.main_banner .arrow_nav a {
		display: block;
		padding:6px 6px 6px 12px;
		width: 30px;
		height: 30px;
		background-color: #00000036;
		border-radius: 100%;
		color: #fff;
		font-size: 12px;
	}
	
}
.swiper-slide {
  overflow: hidden !important;
}




/* 모바일만  */
@media (max-width: 576px) {
	.main_banner {
		background-color: #000000;
		height: 1223px;
	}
}

/* 모바일만  */
@media (max-width: 576px) {
	.main_banner {
		background-color: #000000;
		height: 1223px;
	}
}

/* 성필 */
@media (max-width: 430px) {
	.main_banner {
		background-color: #000000;
		height: 803px;
	}
}

/* 팀장님 */
@media (max-width: 393px) {
	.main_banner {
		background-color: #000000;
		height: 730px;
	}
}

/* 보라 */
@media (max-width: 384px) {
	.main_banner {
		background-color: #000000;
		height: 714px;
	}
}

/* 혜민 */
@media (max-width: 360px) {
  /* 스마트폰 전용 */
	.main_banner {
		background-color: #000000;
		height: 670px;
	}
}


/* 배경 오버레이 */
.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* 반투명 배경 */
  /*display: flex;*/
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

/* 팝업 본체 */
.popup-box {
  background: rgba(0, 0, 0, 0.85); /* 반투명 검정 */
  border-radius: 16px;
  padding: 30px 20px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  position: relative;
  text-align: center;
  font-size: 16px;
  line-height: 1.6;
  color: #fff; /* 텍스트 색상 흰색으로 */
}

/* 닫기 버튼 (X) */
.popup-close {
  position: absolute;
  top: 10px;
  right: 15px;
  background: none;
  border: none;
  font-size: 22px;
  cursor: pointer;
}

/* 확인 버튼 */
.popup-confirm {
  margin-top: 20px;
  padding: 10px 20px;
  background: #222;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  cursor: pointer;
}








/* 배너 원더체인지 Mo */
.mo_layer {
	position: absolute;
	left: 50%;
	top: 32%;
	transform: translate(-50%, -50%);
	width: 60%;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
	text-align: center;
	z-index: 10;
}

.mo_layer_top {
	background-color: #000; /* 불투명한 검정색 */
	color: #fff;
	padding: 8px 10px;
	font-size: 16px;
	line-height: 1.5;
}

.mo_layer_bottom {
	background-color: #fff;
	padding: 7px 5px;
	display: flex;
	flex-direction: column; /* 세로 정렬 */
	align-items: center;
	gap: 2px;

}

.mo_layer_bottom img {
	width: 50vw;
	height: auto;
	cursor: pointer;
}

/* 글씨 */
.mo_layer_top .txt1 {
	font-size: 16px;
	font-weight: normal;
	margin-bottom: -2px; /* 아래 간격 줄이기 */
}

.mo_layer_top .txt2 {
	font-size: 20px;
	font-weight: bold;
	margin-top: 0;
}


/* 배너 원더체인지 PC */
.pc_layer {
	position: absolute;
    bottom: 28vh;
	left: 27vw;
	transform: translateX(-50%);
	display: flex;
	gap: 1vw; /* 버튼 간 간격 */
	z-index: 10;
}

    .pc_layer img {
        width: 7vw;
        height: auto;
        cursor: pointer;
        box-shadow: 0px 10px 20px #0f4abe36;
        border-radius: 16px;
        border: 2px solid #b4cdff;
    }










/* 이벤드 영역 리뉴얼 PC*/
.event_list {
	position: relative;
	overflow: hidden;
	width: 100%;
}

/* 슬라이더 전체 wrapper */
#eventSlider {
	display: flex;
	transition: transform 0.5s ease;
	width: max-content;
	gap: 13px;
}

/* 슬라이드 개별 항목 */
#eventSlider .swiper-evSlide {
	box-sizing: border-box;
	flex-shrink: 0;
}

/* 동그라미 좌우 버튼 */
.slide-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    background: rgb(0 0 0 / 75%);
    color: white;
    border: none;
    z-index: 3;
    cursor: pointer;
    width: 50px;
    height: 50px;
    font-size: 20px;
}

#overlay_black {
	z-index: 2; /* 필요 시 더 높여도 됨 */
	pointer-events: auto;
}
#overlay_black * {
	pointer-events: none; /* 내부 요소는 클릭 안되게 */
}

.slide-btn.prev {
	left: 220px;
}

.slide-btn.next {
	right: 220px;
}

/* 시스루 공통 */
.event_list .overlay {
	position: absolute;
	top: 0;
	width: 340px;      /* 각 칸 비율에 맞춤 */
	height: 100%;
	z-index: 2;
	pointer-events: none; /* 클릭 방해 안 되게 */
}

/* 오버레이1 (첫 번째 배너 위) */
.event_list .overlay.left {
	left: 0;
	background: rgba(255, 255, 255, 0.7); /* 흰색 시스루 */
}

/* 오버레이2 (세 번째 배너 위) */
.event_list .overlay.black {
	position: absolute;
	top: 0;
	left: 706px;        /* 👉 3번째 배너 정확히 */
	width: 340px;       /* 배너 너비와 정확히 동일 */
	height: 100%;
	background: rgba(0, 0, 0, 0.85); /* 검정 시스루 */
	z-index: 5;
	pointer-events: none;
	border-radius: 20px;
}

/* 오버레이3 (네 번째 배너 위) */
.event_list .overlay.right {
	right: 1px;
	background: rgba(255, 255, 255, 0.7); /* 흰색 시스루 */
}


/* 오버레이2의 텍스트 (세 번째 배너 위) */
.overlay.black {
	position: relative; /* 부모 기준 */
}
    .overlay.black .desc {
        text-align: left;
        padding: 40px 30px;
        color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height:100%;
    }

/*오버레이3의 more 텍스트*/
.overlay.right .more_text {
	position: absolute;
	bottom: 20px;
	left: 20px;
	font-size: 50px;
	font-weight: bold;
	color: #000;
}

.event_label {
    color: #c8c8c8;
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
}

.event_number {
    font-size: 60px;
    font-weight: 900;
    /*margin-bottom: 10px;*/
    line-height: 1;
    display: inline-block;
}

.event_title {
    font-size: 35px;
    font-weight: 600;
}



/* 이벤드 영역 리뉴얼 MOBILE */
@media screen and (max-width: 768px) {
    .mo_evt_wrap {
        background: #fff;
        margin: 80px auto;
    }

    .mo_evt_row {
        gap:4px;
    }

    .mo_event_box {
        margin: 0 3vw;
    }
    .mo_evt_wrap img {
        width: 100%;
        display: block;
        border-radius: 8px;
    }
	.mo_evt_main { margin-bottom: 12px; }
			.mo_evt_slider {
				display: flex;
				align-items: stretch;
				flex: 1;
				overflow: hidden;
			}

			.mo_evt_slider .swiper-wrapper {
				display: flex;
			}

			.mo_evt_slider .swiper-slide {
				width: 23%;
				box-sizing: border-box;
			}

.mo_evt_more_fixed {
	width: 25%;
	/*padding: 0 4px;*/
	box-sizing: border-box;
    padding:0 !important;
}

.mo_evt_more_fixed a {
	display: flex;
	flex-direction: column;
	justify-content: flex-end; /* 아래쪽 정렬 */
	align-items: flex-start;   /* 왼쪽 정렬 */
	width: 100%;
	height: 100%;
	background-color: #000;
	color: #fff;
	border-radius: 10px;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	padding: 10px; /* 내부 여백 */
	box-sizing: border-box;
	position: relative;
}

.slide_overlay {
	/*left: 3px;*/
	/*width: 95%;*/
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	border-radius: 8px;
	transition: opacity 0.3s;
	pointer-events: none;
	box-sizing: border-box;
}

.swiper-slide {
	position: relative;
	overflow: hidden;
}

/* 활성화 슬라이드일 경우 오버레이 숨김 */
.swiper-slide.active .slide_overlay {
	opacity: 0;
}



	.mo_evt_title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 12px 12px;
		font-size: 18px;
		font-weight: 700;
	}

	.mo_evt_tit {
		font-weight: 700;
		color: #222;
		font-size: 20px;
	}

	.mo_evt_tit span {
		color: #99c4c1;  /* 기존 WONDER 컬러 */
		margin-right: 5px;
		font-weight: 700;
	}

	.mo_evt_more {
		font-size: 12px;
		font-weight: 400;
		color: #333;
		text-decoration: none;
		display: flex;
		align-items: center;
		gap: 4px;
	}
}

/* 슬라이드 3개 이하일 때 적용되는 스타일 */
.mo_evt_slider.flex_mode .swiper-wrapper {
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
	gap: 4px;
}

.mo_evt_slider.flex_mode .swiper-slide {
	flex: 1;
	max-width: 34%;
	/* padding: 0 5px; // 원하면 추가 */
}

.mo_evt_slider.flex_mode + .mo_evt_more_fixed {
	flex: 1;
	max-width: 25%;
	/* padding: 0 3px; // 원하면 추가 */
}




/* 이벤드 영역 리뉴얼  */
@media screen and (max-width: 768px) {
	.event_wrap {
		display: none !important;
	}
}
@media screen and (min-width: 769px) {
	.mo_evt_wrap { display: none !important; }
}


/* =========================================
   Main Review (인기 급상승 후기) — scoped
   ========================================= */

/* Section */
.main_review_section {
  width: 100%;
  padding: 30px 0;
  background: #fff;
  margin-bottom: 130px;
}

/* Title row */
    .main_review_section .review_title_area {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        max-width: 1400px;
        margin: 0 auto 40px;
        padding: 0 10px;
        box-sizing: border-box;
    }

/* HOT 뱃지 */
    .main_review_section .hot_blink {
        border-radius: 5px;
        display: inline-block;
        padding: 7px 10px;
        color: #fff;
        font-weight: 700;
        font-size: 1.1rem;
        line-height: 1;
        animation: blinkBg 0.4s infinite alternate;
    }
@keyframes blinkBg{0%{background:#d80000}100%{background:#000}}

/* 제목 */
.main_review_section .title_text{
  font-weight: 700;
  color: #222;
  font-size: 2rem;
  margin-right: auto !important;
}

/* 더보기 */
.main_review_section .review_title_area .more_txt {
    color: #333;
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items:center;
    white-space: nowrap;
    font-size: 1rem;
}

.main_review_section .review_title_area .more_txt i{ margin-left:10px; }

/* 카테고리 */
.main_review_section .review_category_btns {
    display: flex;
    gap: 25px;
    margin-bottom: 15px;
}
    .main_review_section .review_category_btns button {
        all: unset;
        cursor: pointer;
        font-size: 1rem;
        font-weight: 600;
        color: #888;
        position: relative;
    }
.main_review_section .review_category_btns button.active{ color:#000; font-weight:700; }
.main_review_section .review_category_btns button.active::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:#000;
}

/* 레이아웃 */
.main_review_section .review_wrap{
  display:flex; flex-wrap:nowrap; justify-content:space-between;
  max-width:1400px; margin:0 auto; padding:0 10px; box-sizing:border-box;
}
.main_review_section .review_visual_area{ width:60%; flex:0 0 60%; box-sizing:border-box; }
.main_review_section .review_description_area {
    width: 40%;
    flex: 0 0 40%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* 미디어 */
.main_review_section .main_review_media{ perspective:1000px; width:100%; position:relative; }
.main_review_section .media_aspect_wrap{ width:100%; position:relative; }
.main_review_section .media_flip_card,
.main_review_section .media_flip_inner{ width:100%; height:100%; position:relative; }
.main_review_section .media_flip_inner{ transform-style:preserve-3d; transition:transform .3s ease-in-out; }
.main_review_section .media_flip_card.flipped .media_flip_inner{ transform:rotateY(180deg); }
.main_review_section .media_front,
.main_review_section .media_back{
  position:absolute; inset:0; backface-visibility:hidden; border-radius:10px; overflow:hidden;
}
.main_review_section .media_front img{ width:100%; height:100%; object-fit:cover; display:block; }

/* 전/후 한 세트 */
.media_front_pair{
  display:flex; flex-direction:row !important; flex-wrap:nowrap !important;
  gap:0; align-items:stretch; width:100%;
  border-radius:14px; overflow:hidden; background:#000;
}
.media_front_pair > .media_front{
  position:relative !important; flex:1 0 50% !important; width:auto !important;
  border-radius:0; overflow:hidden;
}
.media_front_pair > .media_front img{ display:block; width:100%; height:100%; object-fit:cover; }

/* 썸네일(기본) */
.review_thumbnails.pairs { display:flex; gap:3px; }
.review_thumbnails .thumb_set{
  display:flex; overflow:hidden; border-radius:10px; border:2px solid transparent;
  opacity:.4; transition:all .3s;
}
.review_thumbnails .thumb_set.active{ opacity:1; border-color:#000; }
    .review_thumbnails .thumb_set img {
        width: 80px;
        height: 80px;
        object-fit: cover;
        display: block;
    }
        .review_thumbnails .thumb_set img:first-child {
            border-radius: 8px 0 0 8px;
        }
        .review_thumbnails .thumb_set img:last-child {
            border-radius: 0 8px 8px 0;
        }
.review_thumbnails .thumb {
    width: 43px !important;
    height: 43px !important;
    object-fit: cover;
    cursor: pointer;
}

/* 수술 플랜 텍스트 */
.main_review_section .surgery_plan_text_mo,
.main_review_section .surgery_plan_text_pc{
  font-size:1rem; color:#222; line-height:1.4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.main_review_section .surgery_plan_wrap_mo{ margin-top:20px; display:block; }
.main_review_section .surgery_plan_wrap_pc {
    margin: 20px 0 10px 0;
    display: none;
    width: 80%;
    min-height: 350px;
}
.surgery_plan_wrap_pc .hashtag_area {
	
	margin-top:10px;
	display: flex;
	flex-wrap: wrap;   /* 줄바꿈 허용 */
	gap: 6px;          /* 버튼 간격 */

}

/* 각도 버튼 */
.main_review_section .angle_btn {
    font-size: 16px;
    background: #ccc;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
    transition: background .3s;
    line-height: 1;
    padding: 5px 12px;
}
.main_review_section .angle_button_group_mo .angle_btn.active,
.main_review_section .angle_button_group_pc .angle_btn.active{ background-color:#000; color:#fff; }
.main_review_section .angle_button_group_mo{ display:flex; gap:8px; }
.main_review_section .angle_button_group_pc{ display:none; }

/* 안내/버튼 */
.main_review_section .review_action_box{ text-align:left; margin-top:5px; }
.main_review_section .action_row{ margin-bottom:10px; font-size:16px; color:#333; }
.main_review_section .go_btn {
    background: #e5e5e5;
    border: none;
    border-radius: 5px;
    padding: 5px 10px;
    margin-left: 8px;
    font-size: 14px;
    color: #333;
    line-height: 1;
    cursor: pointer;
}

.main_review_section .warning_text {
    margin-top: 20px;
    font-size: 12px;
    color: #a8a8a8;
}
.main_review_section .warning_text strong{ color:#333; font-weight:700; }

/* 공용 버튼 */
.main_review_section .review_more_btn{
  padding:12px 32px; font-size:16px; font-weight:600; border:1px solid #ccc; border-radius:30px;
  background:#fff; color:#333; cursor:pointer; transition:.3s; outline:none; -webkit-tap-highlight-color:transparent;
}
.main_review_section .review_more_btn:hover{ background:#000; color:#fff; border-color:#000; }
.main_review_section .review_more_btn:active{ background:#eee; color:#333; }
.main_review_section .review_more_btn_wrap{ width:100%; display:flex; justify-content:center; margin-top:40px; }

/* 해시태그 */

.hashtag_area span {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}


.hashtag_area .hashtag {
    border: 1px solid #26c6da;
    color: #26c6da;
}

.hashtag_area .noHashtag {
    border: 1px solid #ccc;
    color: #888;
}


/* 이미지 드래그 방지 */
.main_review_section img{
  user-drag:none; -webkit-user-drag:none; -moz-user-drag:none; -ms-user-drag:none;
  user-select:none; pointer-events:auto;
}

/* 클릭/터치 효과 */
.media_aspect_wrap img{ transition: filter .2s ease, transform .2s ease; }
.media_aspect_wrap:active img{ filter: brightness(1.1) saturate(1) blur(2px); transform: scale(1.01); }

/* 수술 경과 라벨 */
.media_aspect_wrap {
    position: relative;
}
.corner_badge {
    position: absolute;
    top: 10px;
    line-height: 2;
    padding: 0 8px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    z-index: 2;
    pointer-events: none;
    background: var(--angle-active-bg, #111);
    color: #fff;
}
.angle_btn.active {
    background-color: #000;
    color: #fff;
}
.badge_left {
    left: 10px;
}
.badge_right {
    right: 10px;
}



/*미디어쿼리 태블릿 시작*/
@media (min-width: 768px) and (max-width: 1024px) {

    .main_review_section .surgery_plan_wrap_pc {
        min-height: auto;
    }


}





    /* =========================
   모바일 전용 (≤768px)
   ========================= */
        @media (max-width:768px) {

            /* ▼▼ 여기 두 값만 바꾸면 됩니다 ▼▼
     - --mo-thumb-gap: 미리보기(썸네일) 사이 간격
     - --mo-thumbhash-gap: 미리보기와 해시태그 사이 "세로 여백"
  */
            .main_review_section {
                --mo-thumb-gap: 1px; /* ← 썸네일 사이 간격(최대한 줄임). 더 줄이려면 1px */
                --mo-thumbhash-gap: 0px; /* ← 미리보기 아래 해시태그까지의 여백. 마음대로 조절 */
            }

                .main_review_section .review_wrap {
                    flex-direction: column;
                    gap: 20px;
                }

                .main_review_section .review_visual_area,
                .main_review_section {
                    width: 100%;
                    flex: 1 1 100%;
                }

                    .main_review_section .hot_blink {
                        font-size: 1rem;
                    }

                    .main_review_section .title_text {
                        font-size: 1.3rem;
                    }

                    .main_review_section .review_title_area {
                        margin-bottom: 20px;
                        padding: 0 3vw;
                    }

                        .main_review_section .review_title_area .more_txt {
                            font-size: .7rem;
                        }

                            .main_review_section .review_title_area .more_txt i {
                                margin-left: 5px;
                            }

                    /* 카테고리 오른쪽에 앵글 버튼 */
                    .main_review_section .review_visual_area {
                        display: flex;
                        flex-wrap: wrap;
                        align-items: center;
                        justify-content: space-between;
                        gap: 10px;
                    }

                    .main_review_section .review_category_btns {
                        flex: 1 1 auto;
                        margin-bottom: 0;
                        gap: 20px;
                    }

                    .main_review_section .angle_button_group_mo {
                        position: static;
                        transform: none;
                        margin-left: auto;
                        display: flex;
                        gap: 6px;
                    }

                        .main_review_section .angle_button_group_mo .angle_btn {
                            /*width: 44px;
        height: 22px;*/
                            font-size: 10px;
                            background: rgba(0,0,0,.4);
                        }


                    /* 큰 이미지 한 줄 아래(네가 HTML 순서 바꾼 상태 기준) */
                    .main_review_section .review_visual_area .media_thumbnail_wrap {
                        order: 3;
                        flex: 1 1 100%;
                        width: 100%;
                    }

            /* 전/후 이미지는 가로 2열 유지, 비율 보존 */
            .media_front_pair {
                flex-direction: row !important;
            }

                .media_front_pair > .media_front img {
                    width: 100%;
                    height: auto;
                    object-fit: cover;
                }

            /* ▼ 썸네일 트랙: 간격 최소화 + 5칸 계산 (간격 변수에 맞춰 자동 반영) */
            .main_review_section .thumbs_viewport .review_thumbnails.pairs {
                flex-direction: row;
                gap: var(--mo-thumb-gap);
            }

                .main_review_section .thumbs_viewport .review_thumbnails.pairs .thumb_set {
                    margin-top: 10px;
                    /* (총너비 - 간격*4) / 4칸 */
                    flex: 0 0 calc((100% - (var(--mo-thumb-gap) * 4)) / 4);
                    /* 썸네일 1칸 비율 고정(좌/우 2장 → 2:1) */
                    aspect-ratio: 2 / 1;
                    border-radius: 10px;
                    overflow: hidden;
                }

            /* 썸네일 내부 이미지: 반반 채움 */
            .review_thumbnails.pairs .thumb_set .thumb {
                flex: 1 0 50%;
                width: 50% !important;
                height: 100% !important;
                object-fit: cover;
                display: block;
            }
            /* 고정 px 규칙 무력화(모바일에서만) */
            .review_thumbnails .thumb_set img {
                width: 100% !important;
                height: 100% !important;
                object-fit: inherit;
            }

            .review_thumbnails .thumb {
                width: auto !important;
                height: auto !important;
            }

            /* ▼ 미리보기(썸네일) 아래 해시태그 여백 — 이 값만 바꿔 조절 */
            .main_review_section .review_thumbnails {
                margin-bottom: 0; /* ← 썸네일과 해시태그 사이 간격 */
            }

            .main_review_section .surgery_plan_wrap_mo {
                margin-top: 20; /* 위에서 margin-bottom으로 조절하므로 0으로 */
            }

            /* 설명 영역 숨김 */
            .review_description_area {
                display: none;
            }

            .main_review_section {
                padding: 0;
                margin-bottom: 80px;
            }

            .corner_badge {
                top: 5px;
            }

            .badge_left {
                left: 5px;
            }

            .badge_right {
                right: 5px;
            }

            .hashtag_area span {
                margin: 0 5px 8px 0;
                font-size: 12px;
            }

            .main_review_section .review_description_area {
                width: 100%;
            }

            .main_review_section .action_row {
                margin-bottom: 8px;
                font-size: 14px;
            }

            .main_review_section .warning_text {
                margin-top: 15px;
                font-size: 11px;
            }

            .thumbs_scrollbar {
                margin-top: 10px;
            }

        }
        /* =========================
   PC 전용 (≥769px)  ※ PC는 손대지 않음
   ========================= */
        @media (min-width:769px) {
            .main_review_section .review_thumbnails {
                flex-direction: row;
                gap: 5px;
                width: 100%;
                justify-content: flex-start;
            }

                /* PC 썸네일: 5개 고정 + 높이 자동 */
                .main_review_section .review_thumbnails .thumb_set {
                    flex: 0 0 calc((100% - (6px * 4)) / 5); /* gap 6px 기준 5칸 */
                    aspect-ratio: 2 / 1; /* ← 가로로 긴 비율 (모바일과 통일하려면 2:1 추천) */
                    border-radius: 14px;
                    overflow: hidden;
                    transition: transform .25s ease, opacity .25s ease;
                    box-sizing: border-box; /* ✅ border 포함 크기 계산 */
                }

                    /* 내부 이미지 꽉 차게 */
                    .main_review_section .review_thumbnails .thumb_set img {
                        width: 100% !important;
                        height: 100% !important;
                        object-fit: cover;
                        display: block;
                    }

                    /* active 효과: border 대신 scale */
                    .main_review_section .review_thumbnails .thumb_set.active {
                        opacity: 1;
                        transform: scale(1.05); /* 살짝 확대 */
                        border: 3px solid #000; /* 테두리 유지하되 얇게 */
                        margin: 2px;
                    }


            .main_review_section .thumbs_viewport {
                margin-top: 15px; /* ← 여백 추가 */
                padding-left: 3px; /* ← 추가 */
                box-sizing: border-box;
            }

            .main_review_section .review_description_area {
                margin: 0 0 0 30px;
            }

            .main_review_section .angle_button_group_mo {
                display: none;
            }

            .main_review_section .angle_button_group_pc {
                display: flex;
                gap: 10px;
            }

            .main_review_section .surgery_plan_wrap_mo {
                display: none;
            }

            .main_review_section .surgery_plan_wrap_pc {
                display: block;
            }
        }
        /* =========================
   썸네일 슬라이더 (공통)
   (런타임에 .thumbs_slider / .thumbs_viewport 래퍼 생성)
   ========================= */
        .main_review_section .thumbs_slider {
        display: flex;
        gap: 8px;
    }

    .main_review_section .thumbs_viewport {
        position: relative;
        overflow: hidden;
        flex: 1 1 auto;
        touch-action: pan-y;
        user-select: none;
        -webkit-user-select: none;
        cursor: grab;
        min-height: 30px;
    }

        .main_review_section .thumbs_viewport:active {
            cursor: grabbing;
        }

        .main_review_section .thumbs_viewport .review_thumbnails.pairs {
            display: flex;
            transition: transform .25s ease;
            will-change: transform;
            margin: 0;
            padding: 0;
            user-select: none;
            -webkit-user-select: none;
        }

    .main_review_section .thumb_nav_btn {
        display: none !important;
    }
    /* 버튼은 숨김 */

    /* (참고) Swiper 기본 네비게이션이 붙는 경우를 대비해 강제 숨김 */
    .swiper-button-prev,
    .swiper-button-next {
        display: none !important;
    }


    /* 스크롤 바 */
.thumbs_scrollbar {
    width: 100%;
    height: 5px;
    background: #f7f7f7;
    margin-top: 20px;
    position: relative;
    border-radius: 3px;
}

.thumbs_scrollbar_handle {
    height: 100%;
    width: 25%; /* 기본: 5칸/20칸 = 25% → JS에서 계산됨 */
    background: #d3d3d3;
    border-radius: 3px;
    position: absolute;
    left: 0;
    cursor: pointer;
}




.media_aspect_wrap {
	position: relative;
}

.media_aspect_wrap .watermark {
	position: absolute;
	top: 65%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0.3;           /* 투명도 */
	pointer-events: none;   /* 클릭/드래그 방지 */
	user-select: none;
	width: 28%;             /* 필요시 크기 조정 */
	max-width: 330px;       /* 너무 커지지 않게 제한 */
}