@charset "utf-8";
html, body { font-size: 15px; }




/*--------------------------------------1300----------------------------------*/
@media screen and (max-width:1300px) {
/*--------------------------------------header----------------------------------*/
#header nav #gnb li {width: 110px;height: 74px;}
#header .depth_toggle {
    top: 70px;
}
#header nav .depth_toggle .sub_nav li a {font-size: 1rem; word-break: inherit;}
#header nav .depth_toggle .sub_nav {width: 110px;}


/*--------------------------------------visual----------------------------------*/
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
    bottom: 3rem !important;
    left: 3rem !important;
}
#fp-nav.fp-right {
    left: 1vw;
}
.sec1::before {
    display: none;
}

/*---------------------------------------main-----------------------------------*/

.section .inner {
    padding: 4rem 2rem 2rem;
    width: 100%;
}
.sec_introduction .introduction_wrap .intro_left .intro_ring{
    left: 0;
}
.sec_introduction .introduction_wrap .intro_left .intro_cirtxt{
    right: 25px;
}
.sec_notice .side_list .side_item .side_img{
    max-width: 194px;
}



}

/*--------------------------------------1024----------------------------------*/
@media screen and (max-width:1024px) {
    
/********************************* main *******************************/
.sec_introduction .introduction_wrap .intro_left .intro_ring{
    scale: 0.8;
    left: -28px;
    bottom: 20px;
}



}

/*--------------------------------------860----------------------------------*/
@media screen and (max-width:860px) {
.sec_introduction .introduction_wrap{
    flex-direction: column;
}

.sec_introduction .introduction_wrap .intro_left,
.sec_introduction .introduction_wrap .intro_right{
    width: 100%;
}
.sec_introduction .introduction_wrap .intro_left .intro_img{
    width: 400px;
    height: 400px;
}
.sec_introduction .introduction_wrap .intro_left .intro_ring{
    bottom: 0;
    left: 12%;
    scale: 0.8;
}
.sec_introduction .introduction_wrap .intro_left .intro_cirtxt{
    right: 16%;
}
.sec_archive .archive_wrap{
    grid-template-columns: 25% 75%;
}

.sec_archive .archive_wrap{
    grid-template-columns: 100%
}
.sec_archive .left_area{
    min-height: 0;
}

.sec_archive .right_area .img_grid{
    gap: 1rem;
    place-content: space-evenly;
}
.sec_archive .img_grid .card{
    flex: 0 0 calc((100% - 2*16px)/3);
}
.sec_archive .txt{
    margin-bottom: 4px;
}

}

/*--------------------------------------640----------------------------------*/
@media screen and (max-width:640px) {
.section .sec_tit h2{
    font-size: var(--txt-3xl);
}
.sec_introduction .introduction_wrap .intro_left .intro_ring{
    left: 2%;
}

.sec_notice .notice_wrap{
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.sec_notice .feature .feature_img{
    aspect-ratio: auto;
    max-height: 250px;
}
.sec_notice .side_list .side_item .side_img{
    max-width: 160px;
}
   
}

/*--------------------------------------480----------------------------------*/
@media screen and (max-width:480px) {
.sec_introduction .introduction_wrap .intro_left .intro_img{
    width: 300px;
    height: 300px;
}
.sec_introduction .introduction_wrap .intro_left .intro_ring{
    bottom: -35px;
    left: -10px;
    scale: 0.6;
}
.sec_introduction .introduction_wrap .intro_left .intro_cirtxt{
    right: 18px;
    top: -14px;
    scale: 0.8;
}
.sec_archive .img_grid .card,
.sec_archive .img_grid .card.wide{
    flex: 0 0 calc((100% - 16px)/2);
}

.sec_archive .img_grid .cluster{
    flex-direction: row;
    flex: 1;
}
.sec_archive .img_grid .card.short{
    height: auto;
    aspect-ratio: 1/1;
    width: calc(50% - 8px);
}
.sec_archive .img_grid .card .card_overlay .card_caption{
    font-size: var(--txt-sm);
}
.sec_archive .txt{
    font-size: var(--txt-xl);
}
.sec_notice .side_list .side_item{
    flex-direction: column;
}
.sec_notice .side_list .side_item .side_img{
    max-width: none;
}
.sec_notice .notice_wrap .feature{
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--c-black-6);
}
.sec_notice .notice_wrap{
    gap: 1rem;
}
.sec_notice .side_list .side_item{
    align-items: flex-start;
}

}

/*--------------------------------------380----------------------------------*/
@media screen and (max-width:380px) {
    .section .sec_tit{
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        margin-bottom: 1rem;
    }
    .section .sec_tit .tit_line{
        display: none;
    }
    .sec_introduction .introduction_wrap .intro_left .intro_ring{
        bottom: -48px;
        left: -55px;
        scale: 0.5;
    }
    .sec_introduction .introduction_wrap .intro_left .intro_cirtxt{
        right: -14px;
        height: -24px;
    }

}