@media (max-width:800px) { /* 모바일용 */
.pc { display: none !important; }
.wrap { width: 94%; }

/* header & footer */
#w_header { height: 60px; }
#w_header.down { height: 100vh; background: #0eaec7; }
#w_header.up { top:-64px; }

#w_header .wrap:before { display: none; }

#w_header h1 { padding-top: 18px;  }
#w_header h1 img { height: 24px; }
#w_header .gnb { position: static; margin: 20px auto 0; width:240px; }
#w_header .gnb li { float:none; font-size:24px; margin-right: 0; border-bottom:1px solid rgba(255,255,255,0.6);  }
#w_header .gnb li:last-child { border:none; }
#w_header .gnb li a { line-height:50px; display: block; text-align: center; color:#fff;  }
#w_header .tel { display: none; }

#nav_btn { position:absolute; right:0; top:12px; }
#nav_btn .line{  width: 30px; height: 2px; background-color: #0eaec7; display: block; margin: 8px auto; transition: all 0.3s ease-in-out;}
#nav_btn:hover{ cursor: pointer;}
#nav_btn.act .line { background:#fff; }
#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);} 

.blank { height: 60px; }
    
#main { height: 56.25vw; border-radius: 0 0 40px 0; }
#main video { width: 100%; height: 56.25vw; }
#main img { width:auto; height:56%; top:22%; left:36%; }

#intro { padding-top: 80px; }
.msg > img { height: 16px; }
.msg h2 { font-size:22px; margin-top: 10px; }
.msg p { font-size:14px; }
.msg p b { font-family: neoeb; color:#222; }
#intro .wrap { height: auto; }
#intro .wrap > img { position: static; border-radius: 40px 0 0 0; width: 108%; margin-left: -4%; margin-top:40px; }

#intro { overflow: hidden; }
#intro ul { height: auto; display: block; }
#intro ul li { width: auto; padding:40px 0; }
#intro ul li:before { width: 140px; height: 2px; left:calc(50% - 70px); top:-1px; }
#intro ul li h3 { font-size:20px; }
#intro ul li strong { font-size:24px; margin:10px 0; } 
#intro ul li p { font-size:16px; }

#service { padding:80px 0; overflow: hidden; }
#service ul { position: static; margin-top: 20px; }
#service ul li { width:48%; margin-left: 0; margin-right: 4%; margin-top: 4vw;  }
#service ul li:nth-child(2n) { margin-top: 4vw; margin-right: 0; }
#service ul li > img { width: 100%; }
#service ul li p { font-size:16px; }
#service .wrap > img { top:-20px; right:-20px; width:160px; opacity: 0.1; }

#portfolio { padding:80px 0; }
#portfolio .pfSlide { margin-top: 40px; }
#portfolio .pfSlide .swiper-slide-prev img,
#portfolio .pfSlide .swiper-slide-next img { opacity: 0.2; }
#portfolio .pfSlide .swiper-slide p { line-height:40px; font-size:14px; }
#portfolio .pfSlide .swiper-button-prev { left:20px; display: none; }
#portfolio .pfSlide .swiper-button-next { right:20px; display: none; }


#qna .wrap { height: auto; padding:60px 0; display: block; }
#qna article { text-align: center;}
#qna article > img { height: 16px; }
#qna article a { margin: 20px auto 0; }
#qna .wrap > img { width: 100%; margin-top: 40px; }

#map { padding:80px 0;}
#map .wrap { flex-direction:column; justify-content: center; }
#map article { width: 100%; height: auto; padding: 40px 20px; }
#map article > img { filter: brightness(0) invert(1); }
#map article ul { margin-top: 10px; }
#map article li { margin-top: 4px; }
#map article li figure { display: none; }
#map article li p { font-size:14px; }
#map article li p span { font-family: neoeb; }
#map .root_daum_roughmap .wrap_controllers { display: none; }
#map .map_border { border:none; }

footer .wrap { display: block; font-size:13px; height: auto; padding:30px 0; text-align: center; line-height:2;  }
footer ul { display:flex; align-items:center; justify-content:center;  flex-wrap: wrap; }
footer ul li { float:left; }
footer ul li:after { content:"|"; margin:0 10px; }
footer ul li:first-child:after { display: none; }

.fblank { height: 60px; }

aside { height: 60px; background: #0eaec7; color:#f8ff34; position: fixed; left: 0; bottom: 0; width: 100%; z-index: 99; }
aside img { height: 40px; position: absolute; top:10px; left:calc(50% - 130px);  }
aside a.fl { font-size:22px; display: block; padding-left: 50px; }
aside a p { margin:0 0 6px; font-size:16px; }

.modal .box { width:90vw; height:80vh; }
.modal .box img { width: 100%; }
.modal .box h3 { font-size:16px;  }
.modal .box p { font-size:13px; }    
}

@media (min-width:801px) { /* PC용 */
.mob { display: none !important; }
    
} 