
/*대형 데스크탑 및 대형 스크린*/
@media screen and (max-width: 1620px) {

    .product_txt_con .product_txt01 {
        font-size: 4.2rem;
    }
    .product_swiper_nav {
        margin-top: 2rem;
    }
    .m_product_box {
        padding: 3rem 3rem 15rem;
    }
    .m_product_cate div img {
        width: 80%;
    }
    .m_product_cate .m_product_box01 img {
        bottom: -14rem;
        width: 60%;
    }

}

/*대형 데스크탑 및 대형 스크린*/
@media screen and (max-width: 1440px) {
    #main-partner .map-info-wrap .map-box .p-dot {
        height: 56rem;
    }

    #main-contact .inquiry-box {
        background-position: center;
    }

    .section-04 .more_btn_st {
        width: 60px;
        height: 60px;
        line-height: 60px;
    }
    .section-04 .more_btn_st a {
        font-size: 16px;
    }

    #magnetic-circle {
        top: 30px;
    }
    .m_news_view .left .m_news_btn img {
        width: calc(100% - 135px);
    }
    
}

/*노트북 및 데스크탑*/
@media screen and (max-width: 1280px) {
    /*main-about*/
    #main-about .con-box .info-wrap {
        align-items: center;
        /* padding: 6rem; */
    }
    #main-about .con-box .info-wrap .txt {
        width: 100%;
    }
    /*main-about//*/

}

@media screen and (max-width: 1080px) {
    .newsroom_list {
        flex-wrap: wrap;
    }
    .newsroom_list > div {
        width: calc(33.333% - 2rem);
    }
    .newsroom_img {
        height: auto;
    }

}

/*태블릿(가로모드) 및 작은 노트북*/
@media screen and (max-width: 1024px) {
    /*common*/
    .circular img {
        width: 80%;
    }
    /*common//*/
    .main-visual-dots .bar {    
        top: calc(100% + 13px);
    }

    .main-visual-arrows .cm-fill-btn {
        width: 50px;
        height: 50px;
    }
    /*main-about*/
    #main-visual .main-visual-txt .content .tit {
        font-size: 6rem;
    }
    #main-about .con-box {
        flex-direction: column-reverse;
        height: 100%;
    }
    #main-about .con-box > div {
        width: 100%;
    }
    #main-about .con-box .info-wrap {
        align-items: center;
        padding: 18rem 2rem 8rem;
    }
    #main-about .con-box .img-wrap {
        height: 60rem;
        padding: 2rem;
    }

    #main-about .con-box .info-wrap .about-logo-wrap img {
        height: 6rem;
    }
    /*main-about//*/

    /*main-product*/
    #main-product .big-logo-wrap {
        width: 80%;
    }

    #main-product-quality .main-pd-list .box .txt-box {
        position: absolute;
        top: 30px;
        left: 30px;
        color: #fff;
    }

    #main-product-quality .quality-wrap .qualitySwiper .swiper-wrapper .swiper-slide.on {
        width: 100% !important;
    }

    #main-product-quality .quality-wrap .qualitySwiper {
        padding-right: 20.35vw;
    }
    /*main-product//*/

    /*main-partner*/
    #main-partner .map-info-wrap {
        flex-direction: column;
        gap: 4rem;
    }
    #main-partner .map-info-wrap .info-box,
    #main-partner .map-info-wrap .map-box {
        width: 100%;
        margin-top: 0;
    }

    #main-partner .map-info-wrap .info-box ul {
        display: flex;
        gap: 2rem;
    }
    #main-partner .map-info-wrap .info-box .info {
        width: 100%;
    }
    #main-partner .map-info-wrap .map-box .p-dot {
        height: 100%;
    }

    #footer .footer-right-con {
        width: 100%;
    }
    #footer .bottom-con {
        gap: 5rem;
    }

    #footer .info-box {
        width: calc(100% - 28rem);
    }
    #footer .list-box dl dt {
        max-width: 10rem;
    }
    .footer-left-con {
        width: 100%;
    }
    /*main-partner//*/

    .main_mission_wrap {
        margin: 0 auto;
    }
    .main_tt {
        font-size: 4rem !important;
    }
    .main_mission_con {
        margin-top: 0;
    }
    .product_all_wrap {
        flex-direction: column;
        padding-left: 0;
    }
    .product_all_wrap .left, .product_all_wrap .right {
        width: 100%;
    }
    .product_all_wrap .left {
        padding-left: 0;
        margin-right: 0;
    }

    .product_swiper_nav {
        margin-top: 5rem;
    }
    .product_swiper_nav .swiper-pagination-progressbar {
        max-width: calc(100% - 20rem);
    }
    .product_swiper_nav .swiper-button-next {
        left: auto;
        right: 0;
    }
    .product_swiper_nav .swiper-button-prev {
        left: auto;
        right: 8.5rem;
    }
    .product_swiper_nav .swiper-button-next, .product_swiper_nav .swiper-button-prev {
        top: 0;
    }
    .product_all_wrap .right {
        margin-top: 15rem;
    }


    #magnetic-circle {
        display: none;
        position: inherit !important;
    }
    .visual_con_wrap {
        height: 100%;
    }
    /* .visual_con_txt {
        height: 90rem;
    } */
    .swiper_btn_box {
        max-width: 25rem;
        left: 10px;
    }
    .m_business_top h2.m_big_tt {
        visibility: visible;
        padding-left: 0;
    }
    h2.m_big_tt {
        font-size: 6rem;
    }
    .m_business_con_wrap {
        margin: 3rem;
        padding: 2rem;
    }
    .m_business_do {
        padding-top: 10rem;
    }
    .m_business_do p {
        font-size: 3rem;
    }
    .we_do_con {
        margin-bottom: 5rem;
    }
    .we_do_con_txt {
        position: initial;
    }
    .we_do_con_txt h4 {
        font-size: 7rem;
    }
    .m_business_do p {
        padding: 2rem 0;
    }
    .m_business_do p br {
        display: none;
    }
    .m_more_btn.active::before {
        opacity: 1;
    }

    .m_product_view {
        flex-direction: column;
    }
    .m_product_txt {
        width: 100%;
    }
    .m_product_cate {
        width: 100%;
    }
    .m_product_con_wrap {
        padding: 10rem 0 15rem;
    }
    .m_product_cate div img {
        width: 55%;
    }
    .m_product_cate .m_product_box01 img {
        width: 45%;
    }
    .m_product_txt .m_sub_txt {
        padding: 5rem 0 3rem;
    }
    .m_product_txt .m_more_btn {
        display: none;
    }
    .m_news_con_wrap {
        margin: 3rem;
        padding: 5rem 2rem;
    }
    .m_news_view {
        flex-direction: column;
    }
    .m_news_view > div {
        width: 100%;
    }
    .m_news_view .left .m_news_btn img {
        display: none;
    }
    .m_news_btn .m_more_btn {
        left: auto;
        top: -20rem;
        right: 0;
    }
    .m_news_view .right {
        padding-left: 0;
    }
    .m_sub_txt {
        font-size: 18px;
    }
    .m_news_date p {
        font-size: 14px;
    }
    .m_news_detail p {
        font-size: 15px;
    }
    .m_news_detail span {
        margin-bottom: 5px;
    }
    .m_inquiry_con_wrap {
        margin: 3rem;
    }
    .m_inquiry_view {
        flex-direction: column;
        gap: 5rem;
    }
    .ft_mid {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 5rem;
    }
    .ft_info {
        flex-direction: column;
        gap: 2rem;
    }
    .ft_info1 {
        flex-direction: row;
        gap: 2rem;
        font-size: 13px;
    }
    .ft_sel_link {
        margin-left: auto;
    }
    .ft_menu ul {
        gap: 3rem;
        flex-wrap: wrap;
    }
    .ft_menu ul li a {
        font-size: 12px;
    }
    #footer .copyright {
        font-size: 13px;
    }
    .m_business_btm .f-box {
        flex-direction: column;
    }
    .m_business_btm .f-box > div {
        width: 100%;
    }
    .m_business_btm .f-box > div:last-child {
        margin-top: 2rem;
    }
    .m_business_btm .f-box > div:last-child .m_more_btn {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
    }
    .m_business_detail {
        margin-top: 7rem;
    }
    .we_do_con {
        display: flex;
        flex-direction: column-reverse;
        gap: 2.5rem;
    }
    .m_business_btm .m_big_tt br {
        display: none;
    }
    .visual_con_txt {
        height: 90rem;
    }
}

/*태블릿(세로모드)*/
@media screen and (max-width: 768px) {

    .title-box .tit {
        font-size: 5rem !important;
    }

    #main-visual .swiper {
        height: 90rem;
    }

    #main-visual .main-visual-txt .content .tit .txt_stroke {
        -webkit-text-stroke: 1px #fff;
    }

    #main-about .marquee span {
        font-size: 8rem;
    }

    #main-about .con-box .info-wrap {
        padding-top: 10rem !important;
        padding-bottom: 0;
    } 
    #main-about .con-box .info-wrap .view-more-btn .cursor-inner {
        width: 70px;
    }
    #main-about .con-box .info-wrap .view-more-btn {
        width: 105px;
        height: 105px;
    }
    #main-about .marquee-wrap::before, #main-about .marquee-wrap::after {
        width: 100px;
    }
    .main-slide-custom-box {
        padding-right: 15px;
    }
    /*main-product*/
    #main-product-quality .bg-blue {
        padding: 10rem 0;
    }
    #main-product .swiper-btn .next-prev {
        width: 20rem;
        display: none;
    }
    #main-product-quality .main-pd-list .box .txt-box small {
        font-size: 1.6rem;
    }
    #main-product-quality .main-pd-list .box .txt-box strong {
        font-size: 3rem;
    }
    #main-product-quality .main-pd-list .box2,
    #main-product-quality .main-pd-list .box3 {
        bottom: 0;
    }
    /* #main-product-quality .pd-wrap {
        margin-bottom: 10rem;
    } */

    #main-product-quality .quality-wrap .swiper_arw {
        width: 40px;
        height: 40px;
    }
    #main-product-quality .quality-wrap .controller {
        gap: 0 20px;
    }
    #main-product-quality .quality-wrap .qualitySwiper .swiper-wrapper .swiper-slide .thumb {
        padding-bottom: 344px !important;
    }
    #main-product-quality .quality-wrap .qualitySwiper .desc {
        left: -9px;
        right: 20px;
        padding: 30px;
        bottom: 30px;
        width: 100%;
    }

    #main-product-quality .quality-wrap .qualitySwiper .swiper-slide-next {
        width: 100% !important;
    }

    #main-product-quality .quality-wrap .qualitySwiper {
        padding-right: 0;
    }

    .main-visual-arrows .cm-fill-btn {
        width: 40px;
        height: 40px;
    }

    #main-product-quality .w_custom {
        width: 100%;
    }

    #main-product-quality .quality-wrap .controller {
        right: 8px;
    }

    #main-product-quality .img-box>span img {
        height: 40rem;
        object-fit: cover;
        object-position: top;
    }

    #main-product-quality .quality-wrap::after {
        content: none;
    }

    .qualitySwiper .swiper-slide.on .card .more {
        position: absolute;
        left: 20px;
        bottom: 60px;
    }

    /*main-product//*/

    /*main-partner*/
    #main-partner .con-box {
        padding: 10rem 0;

    }
    /*main-partner//*/
    #main-contact .main_btn a {
        width: 50px;
        height: 50px;
    }

    #main-contact .main_btn a img {
        width: 15px;
        height: 15px;
    }

    #main-contact .title .tit br {
        display: block !important;
    }

    .custom-cursor {
        position: fixed;
        top: 0;
        left: 0;
        pointer-events: none;
        z-index: 9999;
        width: 64px;
        height: 64px;
        transform: translate(-50%, -50%);
    }

    .cursor-inner {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 70px;
        height: 70px;
        transform: translate(-50%, -50%);
    }

    .cursor-ring {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100px;
        height: 100px;
        transform: translate(-50%, -50%);
        animation: rotate-ring 5s linear infinite;
    }
    
    .main_sub_txt {
        font-size: 17px;
    }
    .newsroom_top .main_tt {
        padding-bottom: 10px;
    }
    .newsroom_list > div {
        width: calc(50% - 1.5rem);
    }
    .newsroom_top {
        flex-direction: column;
        align-items: flex-start;
    }
    .newsroom_top > a {
        width: 50px;
        height: 50px;
        line-height: 50px;
        margin-left: auto;
        font-size: 18px;
    }
    .newsroom_top > a {
        padding-bottom: 10px;
    }
    .newsroom_txt {
        padding: 2.5rem;
    }
    .newsroom_txt > div {
        width: 65px;
        font-size: 12px;
    }
    .newsroom_txt > p:nth-child(2) {
        font-size: 17px;
    }

    #main-visual .visual-wrap {
        height: 70rem;
    }
    #main-visual .video-wrap video {
        height: 100%;
    }

    .process_con_wrap > div:first-child {
        font-size: 8rem;
        bottom: -30px;
    }
    .visual_swiper_con > span {
        font-size: 18px;
    }
    .visual_swiper_con h2 {
        font-size: 6rem;
        line-height: 1.2;
    }
    .visual_swiper_con p {
        font-size: 16px;
    }
    .custom-pagination .swiper-pagination-bullet {
        font-size: 14px;
    }

    .m_business_detail {
        flex-wrap: wrap;
        gap: 2rem;
    }
    .m_business_detail div {
        width: calc(50% - 1rem);
    }
    .m_business_detail div p {
        position: initial;
        transform: none;
        font-size: 14px;
        margin-top: 10px;
        font-weight: 500;
    }

    .intro_wrap {
        flex-direction: column;
    }
    .intro_box {
        width: 100%;
        height: 33.3333%;
    }
    .intro_box a {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }
    .intro_box .txt_con img {
        width: 13rem;
    }
    .intro_box .txt_con h4 {
        font-size: 20px;
    }
    .intro_box .txt_con p {
        font-size: 14px;
    }
    .intro_box a .btn {
        max-width: 15rem;
        font-size: 14px;
        padding: 0.6rem 0;
    }
    .intro_box .txt_con {
        margin-bottom: 3rem;
    }

    

}

@keyframes dotFill {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@media (max-width: 767px){
    /* .sub-visual .bg::after {
        content: "";
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background-color: rgba(0,0,0,0.3); 
        pointer-events: none; 
    } */

    #main-visual .swiper-slide .main-visual-img::after {
        content: "";
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background-color: rgba(0,0,0,0.4); 
        pointer-events: none;
    }
  .main-visual-dots{
    display:block;          
    width:100%;
    padding:0 15px 0;         
    box-sizing:border-box;
  }

  .main-visual-dots .swiper-pagination-bullet > button{
    display:none !important;
  }

  .main-visual-dots .swiper-pagination-bullet{
    display:none !important;
    width:100%;
    height:4px;             
    border-radius:2px;
    position:relative;
    overflow:hidden;
  }

  .main-visual-dots .swiper-pagination-bullet.swiper-pagination-bullet-active{
    display:block !important;
  }

  .main-visual-dots .swiper-pagination-bullet .bar{
    position:absolute;
    left:0; top:0;
    width:100%; height:100%;
    transform-origin:left center;
    transform: scaleX(0);
  }

  .main-visual-dots::before {
        right: auto;
    }
}

/*소형 장치 (스마트폰 가로모드)*/
@media screen and (max-width: 500px) {
    /*common*/
    .circular img {
        width: 60%;
    }

    #main-visual .swiper-slide .main-visual-img {
        background-position: top;
    }

    #main-product-quality .main-pd-list {
        flex-wrap: wrap;
    }

    #main-product-quality .main-pd-list .box {
        width: 100%;
    }

    #main-product-quality .quality-wrap .qualitySwiper .swiper-slide.on .desc h4 {
        font-size: 4rem;
   }

    /*main-partner*/
    #main-partner .map-info-wrap .map-box .p-dot .d-img {
        width: 50%;
    }
    #main-partner .map-info-wrap .info-box ul {
        flex-wrap: wrap;
    }
    #main-partner .main-customer-list .main-customer-flow .flow-item img {
        height: 50px;
    }
    /*main-partner//*/
    #main-contact .main_btn a {
        width: 40px;
        height: 40px;
    }

    #main-contact .main_btn a img {
        width: 12px;
        height: 12px;
    }

    #main-contact .inquiry-box .tit2 {
        font-size: 2.7rem;
    }

    #main-product-quality .quality-wrap .swiper_arw {
        width: 30px;
        height: 30px;
    }

    #main-visual .visual-wrap {
        height: 55rem;
    }

    .product_txt_con .product_txt01 {
        font-size: 5.2rem;
    }
    .product_all_swiper .swiper-slide {
        min-height: 52rem;
    }


    .visual_swiper_con {
        top: 20rem;
    }
    .m_product_cate {
        flex-direction: column;
    }
    .m_product_cate > div {
        width: 100%;
        flex-wrap: wrap;
        padding: 3rem;
    }
    .m_product_box_txt span {
        font-size: 14px;
    }
    .m_product_cate div img {
        position: initial;
        transform: none;
        margin: 2rem auto 0;
    }
    .m_product_cate div:hover img {
        transform: none;
    }
    .m_news_view .left .m_sub_txt {
        padding: 2rem 0;
    }
    .m_news_btn {
        height: 9rem;
    }
    .m_news_btn .m_more_btn {
        top: 0;
        left: 0;
    }
    .ft_sel_link {
        width: 100% !important;
    }


}

/*초소형 장치 (스마트폰)*/
@media screen and (max-width: 320px) {}