
/* PC */
@media screen and (max-width: 1560px) {    


  .header .h_inner {width:90%; padding:0; }
  .ms2 .ms2_cont { gap: 5rem;width: 95%;}
  .ms2 .ms2_cont > .slidebox { width: calc(100% - 5rem - 22.5rem);}

}

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

  .ms2 .ms2_cont { width: 95%;}

}

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

  .ms3 .ms3_cont > .imgbox { width: 55%; }

  .about_section2 .ss2_cont { gap: 4rem; }
  .about_section4 .ss4_cont { gap: 2.35rem; }


}


  
/* Tablet */
@media screen and (max-width: 1024px) {

  body { min-width: initial; }
  .pc {display: none !important;}
  .tablet {display: block !important;}

  .header .h_nav { gap: 2rem;}

  .header .nav_menu { display: flex;}


  .footer { padding: 3.5rem 0;}
  .footer .f_inner { padding: 0 1.875rem;}


  .fixed_btnbox { right: 1.875rem; bottom: 4%;}

  
  .m_txt2 { font-size: 2.5rem;}
  .m_txt1 + .m_txt2 { margin-top: 1.5rem;}


  .ms1 .ms1_txtbox .tit { font-size: 2.125rem;}
  .ms2 { height: auto; padding: 8rem 0;}
  .ms2 .ms2_cont { flex-direction: column; width:100%;}
  .ms2 .ms2_cont > .txtbox { width: 90%; margin:0 auto; align-items: center; text-align: center;}
  .ms2 .ms2_cont > .txtbox .m_morebox {  margin-top: 2rem;}
  .ms2 .ms2_cont > .slidebox {  width: 100%;}
  .ms2 .ms2_cont .ms2_slider .swiper-slide { width: 40%;}
  .ms3 .ms3_cont { padding: 8rem 0 12rem;  flex-direction: column-reverse;      align-items: center;}
  .ms3 .ms3_cont > .txtbox { position: relative;  text-align: center;  padding-top: 0; height: auto; width: 100%; margin-bottom: 6rem;}
  .ms3 .ms3_cont > .imgbox { width: 100%;}
  .ms3 .ms3_cont > .imgbox > .item .hoverbox { padding: 0 1rem;  gap: 3rem;}
  .ms3 .ms3_cont > .imgbox > .item .hoverbox .txt { word-break: keep-all; line-height: 1.5;}
  .ms3 .ms3_cont > .imgbox > .item .hoverbox .txt br { display: none;}
  .ms4 { padding: 10rem 0 12.5rem;}


  .sub_top {height: 22rem;}
  .sub_txt1 { font-size: 1.5rem;  word-break: keep-all;}
  .sub_txt2 { font-size: 0.875rem;  word-break: keep-all;}


  .about_section1 { padding: 8rem 0 10rem;}  
  .about_section1 .deco_txt { font-size: 8.5rem;}
  .about_section2 { padding: 10rem 0;  background-attachment: unset;}
  .about_section2 .ss2_cont { gap: 3rem; flex-direction: column;}
  .about_section2 .ss2_cont > .item { width: 100%;}
  .about_section3 { margin: 10rem 0;}
  .about_section4 { padding: 10rem 0;}
  .about_section4 .ss4_cont { gap: 2rem; flex-wrap: wrap;}
  .about_section4 .ss4_cont > .item { width: calc((100% - 2.5rem) / 2);}
  .about_section5 { padding: 10rem 0;}
  .about_section5 .ss5_cont .ss5_map#map { aspect-ratio: unset; height: 18rem;}
  .about_section5 .ss5_cont .infbox { flex-direction: column; gap: 1rem;}

  .customer_section1 { padding: 0 0 12rem;}
  .customer_section1 .ss1_top { flex-direction: column;}
  .customer_section1 .ss1_top > .left { width: 100%;}
  .customer_section1 .ss1_top > .right { width: 100%;}
  .customer_section1 .ss1_top > .right > .box { max-width: unset;}
  .customer_section1 .ss1_cont .contbox { margin-bottom: 4rem; flex-wrap: wrap;}
  .customer_section1 .ss1_cont .contbox > .item { width: calc((100% - 1.5rem* 2) / 3);}
  .customer_section1 .last_txtbox { text-align: center; line-height: 1.5;}
  


}


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

  .ms2 .ms2_cont .ms2_slider .slide_link { padding: 1.875rem;}
  .ms2 .ms2_cont .ms2_slider .slide_link .tit { font-size: 0.75rem;}
  .ms2 .ms2_cont .ms2_slider .slide_link .desc { margin-bottom: 3.25rem;  font-size: 0.625rem;}
  
  .about_section1 .deco_txt { font-size:7rem;}

}



/* Mobile */
@media screen and (max-width: 599px) {

  .mobile {display: block !important;}

  .sub_section.page_board #wrapper {padding: 5rem 0;}
  
  .sub_top .txtbox .title { font-size: 1.5rem; font-weight: 600; color: var(--white);}
  .sub_top .txtbox .sub { font-size: 0.875rem; font-weight: 400; line-height: 1; color: var(--white); font-family: 'poppins';}

  .header { height: 4rem;}
  .header .h_logo { max-width: 70px;}
  .header .h_nav { gap: 1rem;}

  .header .h_nav > li.mall > .link { width: 5.625rem; height: 1.75rem; font-size: 0.625rem; }
  .header .h_nav > li.mall > .link .icon {width: 0.875rem;}

  .footer { padding: 2.5rem 0 3rem;}
  .footer .f_inner { padding: 0 1.25rem; gap: 2rem;}
  .footer .f_top {  padding-bottom: 2rem;}
  .footer .f_bottom .f_infobox { gap: 0.5rem;}
  .footer .f_top .side_nav { display: flex; gap: 1.75rem; font-size: 0.875rem; color: var(--white);}
  .footer .f_bottom .f_infobox .info_txt { font-size: 0.875rem; color: var(--white); font-weight: normal; }
  .footer .f_bottom .copyright { font-size: 0.75rem; color: #555555; }

  .nav_box { padding: 0 1.25rem 3rem;}
  .nav_box .top { height: 4rem;}
  .nav_box .top .logo { max-width: 80px;}
  .nav_box .nav > li { min-height: 5rem; padding: 0 1rem;}
  .nav_box .nav > li > .link { font-size: 1.25rem;}
  .nav_box .nav > li > .link .arrow_icon { font-size: 1.25rem;}
  .nav_box .nav > li > .link_e { font-size: 1.25rem;}
  .nav_box .nav > li > .link_e .arrow_icon { font-size: 1.25rem;}

  .fixed_btnbox { right: 1.25rem;}
  .fixed_btnbox .fixed_btn { width: 2.5rem;}


  .m_txt1 { font-size: 1rem;}
  .m_txt2 { font-size: 2rem;}
  .m_txt3 { font-size: 0.875rem;}
  .m_txt1 + .m_txt2 { margin-top: 1rem;}
  .m_txt2 + .m_txt3 { margin-top: 2rem;}


  .ms1 .scroll_box .txt {font-size: 0.75rem; font-weight:500;}

  .ms1 .ms1_txtbox .tit {font-size: 2rem; word-break: keep-all;}
  .ms1 .ms1_txtbox .desc {font-size: 1rem;  word-break: keep-all;}
  .ms2 .ms2_top .marquee .marquee_group .item { font-size: 4rem;}
  .ms2 .ms2_cont {gap: 4rem;}
  .ms2 .ms2_cont > .txtbox .ms2_control { margin-top: 2rem;}
  .ms3 .ms3_cont > .imgbox { gap: 1rem;}
  .ms3 .ms3_cont > .imgbox > .item { width: calc((100% - 1rem) / 2);}
  .ms3 .ms3_cont > .imgbox > .item .hoverbox { gap: 1.5rem;}
  .ms3 .ms3_cont > .imgbox > .item .hoverbox .txt {font-size: 0.75rem;}

  .ms2 .ms2_cont .ms2_slider .swiper-slide { width: 70%;}


  .sub_top { height: 18rem;}
  .sub_top .txtbox { top: 55%; gap: 1.5rem;}


  .about_section1 { padding: 5rem 0 7rem;}
  .about_section1 .ss1_txtbox .tit br { display: none;}
  .about_section1 .ss1_txtbox .desc {word-break: keep-all;}
  .about_section1 .ss1_txtbox .desc br { display: none; }
  .about_section1 .deco_txt { font-size:4rem;}
  .about_section2 { padding: 7rem 0;}
  .about_section2 .ss2_cont > .item { padding: 2rem 1.75rem;}
  .about_section3 { margin: 7rem 0;}
  .about_section4 { padding: 7rem 0;}
  .about_section4 .ss4_cont > .item { width: 100%;  aspect-ratio: 1 / 0.5;}
  .about_section5 { padding: 7rem 0;}
  .about_section5 .ss5_cont .infbox .infoitem { flex-direction: column; gap: 0.25rem;  align-items: center; justify-content: center;}


  .customer_section1 .ss1_top > .left .sub { font-size: 0.875rem;}
  .customer_section1 .ss1_top > .left .tit { font-size: 2rem; margin: 0.5rem 0 0.875rem;}
  .customer_section1 .ss1_top > .left .desc { font-size: 0.875rem; line-height: 1.3rem; color: #555555; }
  .customer_section1 .ss1_top > .right { width: 100%; flex-direction: column;}
  .customer_section1 .ss1_top > .right > .box { width: 100%; padding:1.25rem; }
  .customer_section1 .ss1_top > .right > .box .tit { font-size: 1rem; }
  .customer_section1 .ss1_top > .right > .box .desc { font-size: 0.875rem; }
  .customer_section1 .ss1_top > .right > .box .more { font-size: 0.875rem; }
  .customer_section1 .ss1_cont .contbox > .item { padding: 0rem 1rem; border-radius: 1rem;}
  .customer_section1 .last_txtbox {font-size: 0.875rem;display: block; padding: 1.5rem 0;}
  .customer_service_popup .popup_contbox {  padding: 1rem 1.25rem; height:30rem;}
  .customer_service_popup .popup_content.cont2 .tbl tbody tr td.desc {padding: 0.75rem;}
  .customer_service_popup .popup_content.cont2 .tbl tbody tr td { font-size: 0.813rem; }
  .customer_service_popup .popup_content.cont2 .tbl thead tr th { font-size: 0.813rem;}
  .customer_service_popup .popup_content.cont3 .tab_navbox { gap: 0.5rem; } 
  .customer_service_popup .popup_content.cont4 .topbox { flex-wrap: wrap;}
  .customer_service_popup .popup_content.cont4 .topbox > .item { width: 100%;  padding: 1.6rem 1.125rem;} 
  .customer_service_popup .popup_content.cont4 .topbox > .item::after {display: none;}
  .customer_service_popup .popup_content.cont4 .topbox > .item {  width: 50%;   padding: 1.6rem 1.125rem;  border-right: 0;  border-bottom: 1px solid #ededed;}
  .customer_service_popup .popup_content.cont4 .topbox > .item:nth-child(1) {  border-left: 0;}
  .customer_service_popup .popup_content.cont6 .contbox .txt { font-size: 0.813rem; }
  .customer_service_popup .popup_content.cont6 .contbox .descbox .desc { font-size: 0.813rem; }

  .customer_section1 .ss1_cont .contbox > .item .txt { font-size: 0.75rem; font-weight: 600; color: var(--black); text-align: center; }

  .customer_service_popup .popup_tit { font-size: 1rem; }
  .customer_service_popup .popup_txt1 { font-size: 0.875rem; }
  .customer_service_popup .popup_content.cont1 .cont1_box > .item .txtbox .tit { font-size: 0.875rem; }
  .customer_service_popup .popup_content.cont1 .cont1_box > .item .txtbox .desc { font-size: 0.813rem; }

  .customer_service_popup .popup_close { top: -2.25rem; width: 1.75rem; }

  .customer_service_popup .popup_content.cont3 .tab_navbox .tab_nav { font-size: 0.813rem; padding: 0.813rem 1.063rem;}
  .customer_service_popup .popup_content.cont3 .tab_cont .box .tit { font-size: 0.875rem; }

  .customer_service_popup .popup_content.cont4 .topbox > .item .tit { font-size: 0.875rem; }
  .customer_service_popup .popup_content.cont4 .topbox > .item .desc { font-size: 0.813rem; }
  .customer_service_popup .popup_content.cont4 .infobox .tit { font-size: 0.875rem;}
  .customer_service_popup .popup_content.cont4 .infobox .descbox .desc { font-size: 0.813rem;}

  .ms2 .ms2_cont .ms2_slider .slide_link .tit {font-size: 0.875rem; }
  .ms2 .ms2_cont .ms2_slider .slide_link .desc {font-size: 0.813rem; }

  .ms2 .ms2_cont .ms2_slider .slide_link .prd_img { width:11.25rem; }

  .ms3 .ms3_cont > .imgbox > .item .hoverbox .arrow { width: 0.938rem; }

  .customer_section1 .ss1_cont .contbox > .item .icon { height:1.563rem; }

  .main_pops_wrap .main_pops_footer { margin-top: 0.938rem;}
  .main_pops_wrap .main_pops_footer > button { font-size: 0.813rem; font-weight: 400;}
  .main_pops_wrap .main_pops_box { width: 80%;}
  .main_pops_wrap .pops_slider .pagination { right: 0.625rem; font-size: 0.813rem; font-weight: 600; }
  

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