@charset "utf-8";
@media (min-width: 1921px) {
    .interview>img{
        width: 45%;
    }
    .view .l_img{
        width: 45%;
    }
}
@media (max-width: 1440px) {
    .review .review_slide .swiper-slide .p_box p br{
        display: none;
    }
    .review button.next{
        left: -2.5rem;
        width: 5.4rem;
    }
    .point .container article{
        height: auto;
    }
    .point .container article .l_box{
        padding: 5.5rem 6rem;
    }
    .point .container article img{
        width: 32.5%;
        height: 28rem;
        object-fit: cover;
        object-position: 20% 0%;
    }
    .point .container article .l_box p br{
        display: none;
    }
    .interview .l_text{
        width: 49%;
    }
    .interview>img{
        width: 45%;
    }
    .interview .l_text .p_box p br{
        display: none;
    }
    .bna button.next{
        left: -2.5rem;
    }
    .subject .container article .t_box{
        padding: 3.3rem 0 1.4rem;
    }
    .subject .container article .t_box h3{
        font-size: 2.2rem;
    }
    .subject .container article .b_box{
        padding: 3rem;
    }
    .subject .container article .b_box ul li{
        margin-top: .7rem;
    }
    .view{
        gap: 9rem;
    }
    .view .r_box{
        width: calc(50% - 9rem);
    }
    .place .info{
        flex-direction: column;
        justify-content: flex-start;
    }
    .place .info div{
        width: 100%;
        height: auto;
    }
    .place .info .c1{
        height: 90px;
    }
    .place .info .c1 img{
        max-height: 70%;
    }
    .place .info .c2{
        border-right: 0;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
    }
    .place .info .c2 .num{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .place .info .c2 h6{
        width: auto;
        margin: 0;
        margin-right: auto;
        line-height: 5.4rem;
    }
    .place .info .c2 a{
        flex: 0 0 auto;
        width: 35%;
    }
    .place .info .c2{
        padding: 6rem 5rem 5.5rem;
        border-bottom: 1px solid #D9D9D9;
    }
}
@media (max-width: 1024px) {
    .review button.next{
        left: -2rem;
        width: 5.2rem;
    }
    .point .container article{
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .point .container article .l_box h3{
        margin-top: 3rem;
    }
    .point .container article .l_box p{
        margin-top: 3rem;
    }
    .point .container article img{
        width: 100%;
        object-fit: contain;
        object-position: 6.5rem 0;
    }
    .interview{
        height: auto;
        background: url(../img/home/interview.jpg) no-repeat;
        background-size: cover;
        background-color: rgba(0, 0, 0, 0.7);
        background-blend-mode: overlay;
        background-position: 75% bottom;
    }
    .interview .l_text{
        width: 80%;
    }
    .interview>img{
        display: none;
    }
    .bna .top_continer{
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 3.5rem;
    }
    .bna .top_continer a{
        padding: 1.4rem 6rem;
        margin-bottom: 0;
    }
    .bna button.next{
        top: 77%;
        left: -2rem;
    }
    .subject .title{
        margin-bottom: 7rem;
    }
    .subject .container{
        gap: 1rem;
    }
    .subject .container article{
        width: calc(33.33% - .67rem);
    }
    .subject .container article .b_box{
        padding: 2rem 1rem 2rem 2rem;
    }
    .subject .container article .b_box ul li{
        font-size: 15.5px;
    }
    .view{
        gap: 5rem;
    }
    .view .l_img{
        width: 60%;
    }
    .view .r_box{
        width: calc(40% - 5rem);
    }
    .place{
        padding: 14rem 0;
    }
    .place #map{
        height: 45rem;
    }
    .place .info .c2{
        flex-direction: column;
        align-items: center;
        border-right: 0;
        padding: 5.5rem 4.6rem 5rem;
    }
    .place .info .c2 h3{
        width: 100%;
        margin: 0;
        margin-bottom: 1.6rem;
    }
    .place .info .c2 h6{
        width: 100%;
        margin: 0;
        line-height: 3.8rem;
        margin-bottom: 5.2rem;
    }
    .place .info .c2 a{
        width: calc(100% - 1.5rem);
    }
    .place .info .c3{
        padding: 5.5rem 4.6rem 5rem;
    }
    .qna .qna_list{
        padding: 5rem 0;
        box-shadow: 2px 2px 20px rgba(0, 0, 0, .12);
    }
    .qna .qna_list>div .answer{
        gap: 2rem;
      }
}
@media (max-width: 768px) {
    .review .review_slide::after{
        display: none;
    }
    .review .review_slide .swiper-slide small{
        margin-top: .7rem;
    }
    .review .review_slide .swiper-slide h3 {
        margin-top: 3.6rem;
        font-size: 2.4rem;
    }
    .review .review_slide .swiper-slide .p_box {
        margin-top: 2.7rem;
        gap: 1.35rem;
    }
    .review .review_slide .swiper-slide .p_box p{
        font-size: 15px;
    }
    .review button.next{
        display: none;
    }
    .review .swiper-pagination{
        display: block;
    }
    main .wrap{
        padding-top: 55px;
    }
    main h2{
        font-size: 4.1rem;
    }
    .intro-video iframe{
        aspect-ratio: 880 / 496;
    }
    .point .container article{
        width: 95%;
    }
    .point .container article .l_box{
        padding: 5rem 4.5rem;
    }
    .point .container article img{
        height: 32rem;
        object-position: 5rem 0;
    }
    .interview .l_text{
        width: 90%;
    }
    .bna{
        padding-bottom: 28rem;
    }
    .bna .bna_slide .swiper-slide{
        width: 46rem;
    }
    .bna .bna_slide .swiper-slide h3{
        bottom: -1.8rem;
        font-size: 2.5rem;
    }
    .bna button.next{
        display: none;
    }
    .bna .swiper-pagination{
        display: block;
    }
    .subject {
        padding: 14rem 0;
    }
    .subject .container{
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 6rem;
    }
    .subject .container article{
        width: 85%;
        box-shadow: 1px 3px 20px rgba(0, 0, 0, .16);
    }
    .subject .container article .b_box{
        padding: 5rem 3rem;
    }
    .view{
        flex-direction: column-reverse;
        max-height: none;
        gap: 0;
    }
    .view .r_box .title{
        margin-bottom: 4rem;
    }
    .view .l_img{
        width: 100%;
    }
    .view .r_box{
        padding: 10rem 7.5% 6rem;
        width: 100%;
        height: auto;
    }
    .view .r_box .page {
        margin-bottom: 0;
    }
    .view .r_box .view_slide{
        opacity: 0;
        position: absolute;
        left: 0;
        top: 0;
        pointer-events: none;
    }
    .place #map{
        height: 40rem;
    }
    .place .info .c3 ul>li{
        font-size: 15.5px;
    }
    .qna .qna_list>div button .text_box{        
        font-size: 18px;
    }  
    .qna .qna_list>div .answer br{
        display: none;
    }
}
@media (max-width: 480px) {
    main{
        height: 680px;
    }
    main h2{
        font-size: 27px;
    }
    main h5{
        font-size: 15px;
    }
    main p{
        font-size: 15px;
    }
    main a{
        font-size: 15px;
    }
    .intro-video{
        padding: 14rem 0 20rem;
    }
    .review .review_slide .swiper-slide .p_box p{
        font-size: 14px;
    }
    .review .review_slide.login_required .swiper-slide h3{
        font-size: 2.6rem;
    }
    .review .review_slide .swiper-slide p.locked{
        font-size: 14px;
    }
    .point{
        padding: 14rem 0;
    }
    .point .title h2{
        padding: 0 8%;
    }
    .point .title h2 br{
        display: none;
    }
    .point .container article{
        width: 100%;
    }
    .point .container article .l_box{
        padding: 4.6rem 3.5rem;
    }
    .point .container article img{
        width: 100%;
        height: auto;
        object-fit: contain;
        object-position: center center;
    }
    .interview{
        padding: 14rem 0;
    }
    .interview .l_text{
        width: 100%;
    }
    .interview .l_text img{
        margin-right: -1rem;
        width: 32rem;
    }
    .bna{
        padding-bottom: 27rem;
    }
    .bna .top_continer a{
        font-size: 16px;
        padding: 1.2rem 5rem;
    }
    .bna .swiper-pagination{
        bottom: -85px;
    }
    .bna .bna_slide .swiper-slide{
        width: 42rem;
    }
    .subject .container article{
        width: 90%;
    }
    .view .r_box .page button{
        height: 19.2px;
    }
    .view .r_box .page .pagination{
        font-size: 17.6px;
    }
    .view .r_box .page .pagination .swiper-pagination-total{
        font-size: 14.4px;
    }
    .place #map{
        height: 35rem;
    }
    .place .info .c1{
        height: 85px;
    }
    .place .info .c1 img{
        max-height: 75%;
    }
    .place .info .c2 h6{
        font-size: 30px;
    }
    .place .info .c2 a {
        font-size: 16px;
    }
    .qna{
        padding: 14rem 0 11rem;
    }
    .qna .wrap{
        width: 85%;
    }
    .qna .qna_list{
        padding: 4.5rem 0;
    }
    .qna .qna_list>div button{
        padding: 3.1rem 0;
    }
    .qna .qna_list>div button .text_box{        
        font-size: 17px;
    }  
    .qna .qna_list>div button .text_box i{
        margin-top: -2px;
        margin-right: 8px;
    }
    .qna .qna_list>div button .text_box br{
        display: block;
    }
    .qna .qna_list img.toggle-arrow {
        width: 25px;
        height: 25px;
    }
    .qna .qna_list>div .answer{
        width: 100%;
        padding: 0 2rem 4rem;
      }
    .qna .qna_list>div .answer p{
        font-size: 15px;
    }
}