@media (max-width:800px) { /* 모바일용 */


.w_btn { padding:0 40px; line-height:50px; font-size:14px; }


/* header & footer */
#w_header { height: 60px; }
#w_header .wrap { height: 60px; width: 94%; }
#w_header.up { top:-61px; }
#w_header.down { height: 100vh; }
#w_header h1 img { height: 40px; } 
#w_header #w_gnb { position: absolute; top:100px; left:50%; transform: translateX(-50%); gap: 0; height: auto; display: block; text-align: center; line-height:50px; margin:0 auto; width: 240px; font-size:18px; }
#w_header #w_gnb > li { border-bottom:1px solid #ddd; }
#w_header #w_gnb > li.select > a:after { display: none; }
#w_header #w_gnb > li a { display: block; }
#w_header #w_gnb > li:last-child { border-bottom:none; }
#w_header #w_gnb ul { position: static; font-size:16px; padding-top: 0; display: none; line-height: 50px; }
#w_header #w_gnb ul li { border-top:1px dashed #ddd; }
.blank { height: 60px; }

.lang > a { margin-right: 60px; }
#w_header #lang_btn{ width:16px; height:62px;}
.lang_menu{ top:16px; }
#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);} 

#w_footer { padding:40px 0; }
#w_footer .wrap { width: 94%; }
#w_footer #w_gnb { display: none; }
#w_footer address strong { font-size:16px; }
#w_footer address p { font-size:14px; }
#w_footer .copy { font-size:14px; text-align: left; }


/* index */
#main { text-align: center; }
#main .wrap { align-items: center; width: 94%; }
#main h2 { font-size:28px; }

.title { font-size:14px; }

#latest .wrap { display: block; }
#latest .lat { width: 100%; margin-top: 20px;}
#latest .lat ul { display:block; }
#latest .lat li { width: 100%; }
#latest .lat li a { font-size:14px; display: block; width:calc(100% - 90px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

#about ul { flex-wrap:wrap; }
#about ul li { width: 50%; margin-bottom: 30px; }
#about ul li:last-child { margin-bottom: 0; }
#about ul figure { width: 120px; height: 120px; border-radius: 120px; background: #f1f1f1; margin:0 auto;}
#about ul i { color:#ccc; font-weight: bold; }
#about ul .on i { color: var(--color); }

#vision ul { flex-direction: column; width:280px; margin-left:auto; margin-right: auto; font-size:15px; }
#vision ul li { width:100%; line-height:50px; padding-bottom: 0; }

#process .wrap { display: block; }
#process .slide { width: 100%; }
#process .slide h2  { left: 20px; top: 20px; font-size:20px; }
#process article { width:auto; padding-top: 40px; }
#process article p { position: static; width: auto; margin-top: 20px; }
#process article .under { position: static; margin-left: auto; margin-top: 20px; }

.under { font-size:13px; }

#info ul { flex-wrap: wrap; }
#info ul li { width: 48%; margin-bottom: 4%; }
#info ul li:last-child { margin-bottom: 0; }
#info ul li img { width: 100%; }
#info .under { top:auto; bottom: 0; width: 48%; }

.video { height: 240px; }
.video img { width: 60px; }

.formmail .wrap { display: block; }
.formmail form { width: auto; margin-top: 40px; }
.formmail form ul { display: block; }
.formmail form ul li { width: auto; margin-bottom: 10px; }
.formmail form ul li input { height: 44px; font-size:14px; }
.formmail form ul li textarea { border-radius: 14px; font-size:14px; padding:10px 24px; }
.formmail form button { width: 100%; height: 44px; font-size:14px; }
.formmail form button i { font-size:13px; top:0; }


.sv { height: 240px; }


.sm { position: relative; }
.sm ul { display: none; }
.sm select { width: 100%; border:none; background: transparent; color:#fff; font-size:16px; font-family: ptm; height: 50px; padding:0 3%; appearance: none; background:var(--color); }
.sm i { position: absolute; right: 3%; top:50%; transform: translateY(-50%); }


/* sub1_1 */
#sub1_1 .cont1 { display: block;  }
#sub1_1 .cont1 figure { width: 240px; margin:0 auto 40px; }
#sub1_1 .cont1 figure img { width: 100%;  }
#sub1_1 .cont1 article { width: auto; }
#sub1_1 .cont1 h2 { font-size:2.5rem; }

#sub1_1 .cont2 figure { height: 200px; }
#sub1_1 .cont2 figure img { height: 100%; width: 100%; object-fit: cover; }


.left { width: auto; }
.right { width: auto; }
#sub1_2 .cont1 div { display: block; margin-top: 20px; }
#sub1_2 .cont1 figure { height: 200px; }
#sub1_2 .cont1 figure img { width: 100%; height: 100%; }
#sub1_2 .cont1 p { margin-top: 20px;  }

#sub1_2 .cont2 { display: block; }
#sub1_2 .cont2 ul { border-top:none; }
#sub1_2 .cont2 ul li { position: relative; padding-left: 80px; }
#sub1_2 .cont2 ul li strong { position: absolute; left: 0; width: auto; }

#sub1_2 .cont3 ul { flex-direction: column; gap:40px; }
#sub1_2 .cont3 ul li { width: 300px; height: 300px; }
#sub1_2 .cont3 h3 { margin-bottom: 0; font-size:24px; }
#sub1_2 .cont3 p { font-size:14px; }

#sub1_2 .cont4 ul { gap:4px; margin-top: 30px; }
#sub1_2 .cont4 ul li { width:auto; flex:1; line-height:1.2; height: 50px; display: flex; align-items: center; justify-content: center; font-size:14px; }
#sub1_2 .cont4 img { width: 100%; }


/* sub1_3 */
#sub1_3 .cont1 { display: block; }
#sub1_3 .cont1 .right { margin-top: 40px; }
#sub1_3 .cont1 .right iframe { height: 300px; }
#sub1_3 .cont1 ul.addr li { padding-left: 60px; position: relative; } 
#sub1_3 .cont1 ul.addr li strong { position: absolute; left: 0; }
#sub1_3 .cont1 ul.addr li span {margin-left: 0;}
	
#sub1_3 .cont1 ul.comp { display: block; }
#sub1_3 .cont1 ul.comp li { width: auto; margin-bottom: 30px; }

	
	
/* sub1_4 */
#sub1_4 ul li { width: 48%; margin-bottom: 4%; }
#sub1_4 ul li img { max-width:80%; }



/* sub2_1 */
.prdList ul li { width: 48.5% !important; margin-bottom:20px; margin-right: 3%;  }
.prdList ul li:nth-child(3n) { margin-right: 3% !important; }
.prdList ul li:nth-child(2n) { margin-right: 0 !important; }
.prdList ul li figure { height: auto; aspect-ratio: 380 / 380; }
.prdList ul li p { font-size:16px; }


/* detail */
.detail .cont1 h2 span { margin-left: 20px; }
.detail .thumb figure { width: 100%; border-radius: 14px; overflow: hidden; }
.detail .thumb figure img { width: 100%; }
.detail .thumb figure span { width: 24px; height: 24px; line-height: 24px; }
.detail .thumb .ment { position: static; width: auto; height: auto; padding:20px; margin-top: 10px; }
.detail .thumb .ment p { font-size:14px; }
.detail .thumb .part { position: static; width: 100%; margin-top: 10px; height: auto; padding:20px; box-sizing: border-box; }
.detail .thumb .part img { max-width:70%;  }

.detail .cont2 { padding-left: 0; }
.detail .cont2 strong { position: static; }
.detail .cont2 p { margin-top: 10px; }


/* sub3_1 */
.procSlide .prev, .procSlide .next { left:10px; right:auto; }
.procSlide .next { left:auto; right:10px; }
.procBox { padding:20px; border-radius:14px; }
.procBox > div { flex-direction:column; align-items: flex-start; gap:20px; }
.procBox figure { width: 100%; }
.procBox article { width: 100%; }
.procBox article h3 { font-size:18px; }
.procBox article p { margin-top: 10px; font-size:14px; }

#sub3_1 .cont3 { margin-top: 40px; }
#sub3_1 .cont3 ul { display: block; }
#sub3_1 .cont3 ul li { width: 100%; text-align: left; display: flex; align-items: center; justify-content: start; margin-bottom: 30px;  }
#sub3_1 .cont3 ul li figure { width: 120px; }
#sub3_1 .cont3 ul li figure img { transition:0.3s; transform:scale(0.7); }
#sub3_1 .cont3 ul li dl { width:calc(100% - 140px); margin-left: 20px; }
#sub3_1 .cont3 ul li dt { margin-top: 0; }
#sub3_1 .cont3 ul li dd { font:16px steb; }
#sub3_1 .cont3 ul li dd br { display: none; }
#sub3_1 .cont3 .top { width: 100%; }
#sub3_1 .cont3 .bot { margin-top: 0; display: block; width: 100%;  }
#sub3_1 .cont3 .bot li { margin-left: 0; }

#sub3_1 .cont3 ul li figure:before { display: none; }
#sub3_1 .cont3 ul li figure:after { display: none; }
#sub3_1 .cont3 .top li:nth-child(4) figure:before { display: none; }
#sub3_1 .wrap_2 {width: 100%;}
#sub3_1 .procBox figure{ width:100%; }

/* sub3_2 */
#sub3_2 .cont1 { padding-left: 0; } 
#sub3_2 .cont1 h2 { position: static; }

#sub3_2 .cont2 .hover img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
#sub3_2 .cont2 .hover article { position: relative; left: 0; bottom: 0; padding:40px 20px; box-sizing: border-box; }
#sub3_2 .cont2 .hover article h3 { font-size:20px; }
#sub3_2 .cont2 .hover article ul { font-size:16px; margin-top: 10px; }
#sub3_2 .cont2 .hover article p { font-size:14px; margin-top: 10px; }

/* sub4_1 */
#sub4_1 .cont1 .list { margin-top: 40px; }
#sub4_1 .cont1 .list > li { display: block; padding: 0; border-bottom:none; margin-bottom: 80px; }
#sub4_1 .cont1 .list > li figure { width: 100%; height: 260px; }
#sub4_1 .cont1 .list > li figure img { max-width: 80%; max-height: 90%; }
#sub4_1 .cont1 .list > li article { width: 100%; margin-top: 20px; }
#sub4_1 .cont1 .list > li article h3 { font-size:18px; }
#sub4_1 .cont1 .list > li article p { margin-top: 10px; }
#sub4_1 .cont1 .list > li article p br { display: none; }
#sub4_1 .cont1 .list > li article ul { margin-top: 20px; }
#sub4_1 .cont1 .list > li article ul li strong { width: 140px; }
#sub4_1 .cont1 .list > li article ul li span {margin-left: 143px;}



#sub4_2 .cont1 ul li { width:100%; }

#sub4_3 .cont1 ul li { width:48.5%; margin-right: 3%; }
#sub4_3 ul li:nth-child(3n) { margin-right: 3% !important; }
#sub4_3 ul li:nth-child(2n) { margin-right: 0 !important; }
#sub4_3 .cont1 ul li p { font-size:14px; }

/* sub5_1 */
#sub5_1 .cont1 { display: block; }
#sub5_1 .cont1 figure { width: 100%; margin-top: 40px; }
#sub5_1 .cont1 figure img { width: 100%; }
#sub5_1 .cont2 {display: block; }
#sub5_1 .cont2 p { width: auto; margin-top: 20px; }
#sub5_1 .cont3 { flex-direction: column; gap:40px; }
#sub5_1 .cont3 li { width: 240px; height: 240px; gap:20px; }
#sub5_1 .cont4 .wrap { display: block; }
#sub5_1 .cont4 img { display: none; }
#sub5_1 .cont4 ul { margin-top: 40px; }
#sub5_1 .cont4 ul li { display: block; margin-bottom: 30px;  }
#sub5_1 .cont4 ul li span { display: block; margin-bottom: 10px; }

/* sub5_2 */
#sub5_2 .prc { flex-wrap:wrap; }
#sub5_2 .prc div { width: 48.5%; height: auto; aspect-ratio: 1 / 1; margin-bottom: 3%; transition:.3s;}
#sub5_2 .prc i { display: none; }
#sub5_2 .cont2{ min-height:600px;}
#sub5_2 .cont2 p { padding-left: 0; margin-top: 10px; padding-bottom: 40px; }

#sub5_2 .cont2 .img_wrap{flex-direction:column;}
#sub5_2 .cont2 .img_wrap figure{ width:100% !important; max-width:100% !important;}


	

/* sub5_3 */
#sub5_3 .cont1 figure { text-align: center;  margin-top: 40px; height:350px; display:flex; align-items:center; justify-content:center; width: 100%; }
#sub5_3 .cont1 figure img { max-width:100%; max-height:350px; width:auto; height:auto; display:block;}
#sub5_3 .cont1 div { display: block;}
#sub5_3 .cont1 ul { width: auto; margin-top: 40px; display: flex; flex-wrap:wrap;}
#sub5_3 .cont1 ul li { display: flex; align-items: center; justify-content: space-between; border-bottom:1px solid #ddd; width: 50%;  }
#sub5_3 .cont1 ul li:hover { color:var(--color); }
#sub5_3 .cont1 ul li p { font-size:15px; }
#sub5_3 .cont1 ul li a { font-size:20px; color:var(--color); }

#sub5_3 .cont2 { overflow-x:auto; margin-top: 40px; }
#sub5_3 .cont2 ul { width: 800px; }
#sub5_3 .cont2 ul li { position: relative; }
#sub5_3 .cont2 ul li.on:before { content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; box-sizing:border-box; border:3px solid var(--color); }
#sub5_3 .cont2 ul li img { width: 100%; }


}