@charset "UTF-8";
@media (max-width:800px) { /* 모바일용 */
/* header & footer */
#w_header { height: 60px; }
#w_header.fix { height: 60px; }
#w_header.up { top:-61px; }
#w_header.down { height: 100vh; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px); }
#w_header .wrap { height: 60px; }
#w_header h1 img { height: 24px; } 
#w_header #w_gnb { position: absolute; gap: 0; height: auto; display: block; text-align: center; line-height:60px; width: 240px; top:100px; left:50%; transform: translateX(-50%); font-size:20px; }
#w_header #w_gnb > li { border-bottom:1px solid #ddd; }
#w_header #w_gnb > li a { display: block; }
#w_header #w_gnb > li:last-child { border-bottom:none; }
#w_header #w_gnb > li.active > a { text-decoration:underline; }


#nav_btn { position:absolute; right:0; top:12px; }
#nav_btn .line{  width: 30px; height: 2px; background-color: #fff; display: block; margin: 8px auto; transition: all 0.3s ease-in-out;}
#nav_btn:hover{ cursor: pointer;}
#nav_btn.act .line:nth-child(2){ opacity: 0;}
#nav_btn.act .line:nth-child(1){ transform: translateY(10px) rotate(45deg);}
#nav_btn.act .line:nth-child(3){ transform: translateY(-10px) rotate(-45deg);}

/* footer */
#w_footer { margin-bottom:60px; }

#w_footer .ft_top { flex-direction:column; }
#w_footer .ft_about { width:100%; padding:30px 0; border-right:0; }
#w_footer .ft_about h2 { font-size:2.8rem; }
#w_footer .ft_about p { max-width:none; }
#w_footer .ft_contact { width:100%; padding:24px 0; border-top:1px solid #ddd; }

#w_footer .ft_bot { flex-direction:column; }
#w_footer .ft_office { width:100%; padding:24px 0; border-right:0; }
#w_footer .ft_office dt { width:100px; font-size:1.4rem; }
#w_footer .ft_office dd { font-size:1.4rem; }

#w_footer .ft_logo { width:100%; padding:24px 0; border-top:1px solid #ddd; }
#w_footer .ft_sns img { width:32px; height:32px; }


/* main visual */
#main .mainSlide { height: 70vh;}
#main .swiper-slide.mainVisual1 { background-image:url(/images/bg_main1_m.png);    }
#main .swiper-slide { text-align: center; }
#main .swiper-slide h2 { font-size:3rem; line-height:1.3; word-break:keep-all; }
#main .swiper-slide p { margin-top:14px; font-size:1.4rem; line-height:1.5; word-break:keep-all; }
#main .swiper-button-prev, #main .swiper-button-next { display:none; }
#main .swiper-pagination { bottom:20px; }
#main .swiper-pagination .swiper-pagination-bullet { width:8px; height:8px; }
#main .swiper-slide .wrap { transform:translateY(-130px);    }


/* 제품 슬라이드 */
#prdSlide { padding:70px 0; }
#prdSlide h2 { font-size:2.8rem; line-height:1.4; word-break:keep-all; }
#prdSlide .prdBox { flex-direction: column; margin-top:30px; }
#prdSlide .prd { width:100%; padding:40px 0; }
#prdSlide .prd .swiper-slide img { width: 50%; }
#prdSlide .prd .swiper-button-prev { left: 3%; }  
#prdSlide .prd .swiper-button-next { right: 3%;}

#prdSlide .prdInfo { width:100%; }
#prdSlide .prdInfo > li { width:100%; padding:30px 4px; border-left:0; border-bottom:0; }
#prdSlide .prdInfo > li + li { border-top:1px solid #ddd; }

#prdSlide .prdInfo .prdName { height:auto; position:static; }
#prdSlide .prdInfo .prdName span { position:static; display:block; margin-top:16px; }

#prdSlide .prdInfo .prdGrh ul { flex-direction: column; justify-content: flex-start; gap:20px; height:auto; }
#prdSlide .prdInfo .prdGrh ul span { width:18px; height:18px; border-width:2px; }


/* VANADIS Different */
#diffSection { padding:70px 0; }
#diffSection .diffTit h2 { font-size:2.8rem; line-height:1.4; word-break:keep-all; }

#diffSection .diffBox { margin-top:30px; }
#diffSection .diffBox li { width:50%; padding:36px 16px; }
#diffSection .diffBox li:nth-child(3n) { border-right:1px solid #ddd; }
#diffSection .diffBox li:nth-child(2n) { border-right:0; }
#diffSection .diffBox li:nth-child(n+4) { border-bottom:1px solid #ddd; }
#diffSection .diffBox li:nth-child(n+5) { border-bottom:0; }
#diffSection .diffBox img { height:50px; }
#diffSection .diffBox h3 { margin-top:16px; font-size:1.8rem; }
#diffSection .diffBox p { margin-top:8px; font-size:1.4rem; word-break:keep-all; }


/* Enjoy Vanadis */
#enjoySection { padding:70px 0; }
#enjoySection h2 { font-size:2.8rem; }

#enjoySection .enjoyVisual { margin-top:24px; }

#enjoySection .viewBtn { height:40px; padding:0 22px; gap:6px; font-size:1.2rem; }

/* sublayout */
.sv .wrap { height: 240px; padding-top: 60px; }



/* brand */
#brand .cont1 { flex-direction:column; gap:24px; padding:70px 0; }
#brand .cont1_tit { width:100%; }
#brand .cont1_tit h2 { font-size:2.8rem; }
#brand .cont1_txt p { font-size:1.6rem; line-height:1.7; }
#brand .cont1_txt p + p { margin-top:30px; padding-bottom:16px; }

#brand .cont2 { flex-direction:column; align-items:flex-start; gap:30px; padding-bottom:70px; }
#brand .cont2_txt { width:100%; }
#brand .cont2_txt .quote { font-size:3.2rem; }
#brand .cont2_txt h2 { font-size:2.8rem; }
#brand .cont2_txt p { font-size:1.5rem; }
#brand .cont2_img { width:100%; }

#brand .cont3 { flex-direction:column; gap:24px; padding-bottom:70px; }
#brand .cont3_tit { width:100%; }
#brand .cont3_tit h2 { font-size:2.8rem; }

#brand .cont3_con .quote { padding-bottom:20px; font-size:1.8rem; }

#brand .cont3_icon { flex-direction:column; }
#brand .cont3_icon li { padding:24px 0; border-right:0; }
#brand .cont3_icon li + li { border-top:1px solid #ddd; }
#brand .cont3_icon img { height:48px; }
#brand .cont3_icon h3 { font-size:1.8rem; }
#brand .cont3_icon p { font-size:1.4rem; }

#brand .cont3_txt { margin-top:30px; }
#brand .cont3_txt p { font-size:1.5rem; line-height:1.7; }
#brand .cont3_txt p + p { margin-top:20px; }


/* product */
#product > div > .wrap { order:2; }

#product .cont1 > img { aspect-ratio:1920/334; }
#product .cont2 > img { aspect-ratio:1920/670; }
#product .cont3 > img { aspect-ratio:1920/648; }
#product .cont4 > img { aspect-ratio:1920/636; }
#product .cont5 > img { aspect-ratio:1920/638; }
#product .cont6 > img { aspect-ratio:1920/745; }
#product > div img { zoom:0.4; object-position: right;}

#product .cont1 .wrap h2 { top:80px; font-size:24px; }

#product article { width:100%; padding:24px 0; top: 0 !important; }
#product article h2 { font-size:2.4rem; }
#product article p:after { margin-top:10px; margin-bottom:14px; }
#product article span { margin-bottom:0; }
#product article .w_btn { margin-top:20px; line-height: 40px; padding:0 20px; height: 40px; }


/* detail (product detail) */
#detail .cont1 { padding:100px 0 70px; }
#detail .detailTit h2 { font-size:2.2rem; }

#detail .detailBox { flex-direction:column; margin-top:30px; }
#detail .detailImg { width:100%; padding:40px 0; }
#detail .detailImg img { width:60%; max-width:240px; height:auto; }

#detail .detailInfo { width:100%; border-left:0; border-top:1px solid #ddd; }
#detail .detailInfo > div { padding:24px 0; }
#detail .detailInfo_top h2 { font-size:2.8rem; }
#detail .detailInfo_top .desc { font-size:1.5rem; }

#detail .detailInfo_mid dt { width:110px; font-size:1.4rem; }
#detail .detailInfo_mid dd { font-size:1.8rem; }

#detail .detailInfo_bot dt { width:110px; }

#detail .detailStore { margin-top:50px; }
#detail .storeBtn { width:120px; height:120px; font-size:1.3rem; }

#detail .cont3 { margin-bottom:80px; }


/* support (contact) */
#support .cont1 { padding:100px 0 70px; }
#support .cont1_tit h2 { font-size:2.8rem; }

#support .cont1_txt { margin-top:40px; }
#support .cont1_txt .label { font-size:1.6rem; padding-bottom:14px; }
#support .cont1_txt .desc1 { font-size:1.5rem; }
#support .cont1_txt .desc2 { font-size:1.4rem; }

#support .cont1_form { margin-top:40px; }
#support .formRow { flex-direction:column; }
#support .field + .field { border-left:1px solid #ddd; }
#support .field { padding:16px 20px; }
#support .field label { width:80px; font-size:1.4rem; }
#support .field input { font-size:1.4rem; }
#support .formRow.row2 textarea { min-height:160px; font-size:1.4rem; }

#support .formBtn { margin-top:40px; }


}