@charset "utf-8";


/* ************************ PC ************************ */
@media screen and (min-width:1025px) {
	
	/************ 메인-네비게이션 ************/
		.headerH {height:0px; background:none;}
		nav.pc .navbg {background:none;}
		nav.mobile {display:none;}
		nav.pc .navbg .dep1 {border-bottom:none; background:#00282b;}
		/* nav.pc .gnb>ul>li>a,header .head .lang ul li a span,nav.pc .gnb>ul>li.on>a {color:#fff;} */
		/* header .head .logo a .b-logo {display:none !important;} */
		/* header .head .logo a .g-logo {display:none !important;} */
		/* header .head .logo a .w-logo {display:block !important;} */
		header .head .lang .b-earth {display:none !important;}
		header .head .lang .w-earth {display:block !important;}
		
	
	/************ 공통 ************/
		.main {overflow:hidden; position:relative;}
		.w1520 {width:1520px;}
		.alinknone {cursor: default;}
		.img-wrap .img {border-radius: 0 85px 0 0;}
		.title {display:flex; align-items: flex-end; width:1520px; margin:0 auto; padding-bottom:50px;}
		.title span {font-size:30px; font-weight:800; padding-right:15px;}
		.title h3 {font-size:96px; padding-right:30px;}
		.title p {font-size:20px; font-weight:400;}
		img {object-fit:cover;}
	
	
	/************ 메인 비주얼 ************/
	
		@keyframes zoom {
			from {transform:scale(1.5)}
			to {transform:scale(1.2)}
		}
		@keyframes tit_move {
			from{transform: translate3d(-40%, 0, 0);}
			to{transform: translate3d(0, 0, 0);}
		}

		.main .visual {position:relative; width:100%; height:100vh;}
		.main .visual .cover {position:absolute; top:0; left:0; z-index:2; width:100%; height:100%; background: rgba(0,0,0,.4);}
		/* .main .visual .visual-txt {position:absolute; top:50%; left:12vw;  z-index:3; width:calc(100% - 12vw*2); color:#fff; transform:translateY(-50%);} */
		.main .visual .visual-txt {position:absolute; top:50%; left:18vw;  z-index:3; width:calc(100% - 20vw*2); color:#fff; transform:translateY(-50%);}
		/*.main .visual .visual-txt h3 {font-size:70px; padding-bottom:20px; animation:tit_move 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
		.main .visual .visual-txt p {font-size:20px; font-weight:400; animation:tit_move 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}*/
		 
		.main .visual .swiper {overflow:hidden; width:100%; height:100%;}
		.main .visual .swiper .swiper-wrapper {position:relative; width:100%;}
		.main .visual .swiper .swiper-wrapper .swiper-slide img {overflow:hidden;}
		.main .visual .swiper .swiper-wrapper .swiper-slide-active {animation:zoom 3s; transform:scale(1.2);}
		.main .visual .swiper .swiper-wrapper .swiper-slide-active .visual-txt h3 {font-size:60px; padding-bottom:20px; animation:tit_move 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
		.main .visual .swiper .swiper-wrapper .swiper-slide-active .visual-txt p {font-size:18px; font-weight:400; animation:tit_move 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
		
		.main .visual .swiper .swiper-wrapper .swiper-slide img {max-height:100%;}
		
		.main .swiper-button-next {right:5vw; width:100px; height:100px; background-image: url(../images/main/i-next.png); background-size:64px; opacity:.4; transition:.3s;}
		.main .swiper-button-next:hover {right:4vw; opacity:1;}
		.main .swiper-button-prev {left:5vw; width:100px; height:100px; background-image: url(../images/main/i-prev.png); background-size:64px;  opacity:.4;  transition:.3s;}
		.main .swiper-button-prev:hover {left:4vw; opacity:1;}
		
		/* product */
		.main .product {
			width:calc(100% - 5vw); font-size:30px; color:#fff; font-weight:700; 
			background:rgba(0,68,69,90%); padding:55px 90px; margin-left:5vw; border-radius:100px 0 0;
			position:absolute; z-index:999; bottom:0;
		}
		.main .product .product-con {display:flex; align-items:center; justify-content:space-between;}
		.main .product ul {display:flex;}
		.main .product ul li {padding-left:70px;}
		/* .main .product ul li {padding:0 40px} */
	
	
	/************ tsp-img ************/
		.main .main-img {padding:100px 0 150px 0; margin: 0 auto;}
		.main .main-img ul {display:flex; gap:40px; overflow:hidden;}
		.main .main-img ul li {width:calc(100% / 4);}
		.main .main-img ul li img {width:100%; height:350px; object-fit:cover;}
		.main .main-img ul li a {position:relative;}
		.main .main-img ul li .hidden-area {
			background:rgba(0,0,0,.5); width:100%; height:100%; position:absolute; top:100%;
			font-size:20px; color:#fff; font-weight:700; padding:0 20%;
			display:flex;
			justify-content:center;
			text-align:center;
			flex-direction:column;
			transition:.3s;
		}
		.main .main-img ul li:hover .hidden-area {top:0;}
		

	/************ since ************/
		/* .main .since {display:flex; gap:70px;} */
		.main .since .since-wrap {display:flex; align-items:center;}
		.main .since .since-wrap>* {width:50%;}
		.main .since .since-wrap ul {display:flex; flex-direction:row; flex-wrap:wrap; padding-right:5vw;}
		.main .since .since-wrap ul li {width:50%; padding-left:70px; display:flex; flex-direction:column; font-size:20px;}
		.main .since .since-wrap ul li:nth-child(2)~li {margin-top:50px;}
		.main .since .since-wrap ul li:nth-child(1) {background:url(../images/main/i-since1.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(2) {background:url(../images/main/i-since2.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(3) {background:url(../images/main/i-since3.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(4) {background:url(../images/main/i-since4.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(5) {background:url(../images/main/i-since5.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(6) {background:url(../images/main/i-since6.png) no-repeat 70px top;}
		.main .since .since-wrap ul li a {width:100%; min-height:86px; padding:35px 0 35px 115px; line-height:1;}
		.main .since .since-wrap ul li a:hover {color:#006aaf;}
	
	
	/************ R&D ************/
		.main .rnd {padding:150px 0 170px 0; background:url(../images/main/rnd-txt.png) no-repeat center bottom;}
		.main .rnd .tab-wrap {margin:0 auto;}
		.main .rnd .tab-wrap {display:flex; align-items:center;}
		.main .rnd .tab-wrap .common_tab ul {flex-wrap:nowrap;}
		.main .rnd .tab-wrap .common_tab ul li a, 
		.main .rnd .common_tab ul li.on a {background:none;}
		.main .rnd .tab-wrap .common_tab_con {border-top:none;}
		.main .rnd .tab-wrap .common_tab ul li {padding-left:18px;}
		.main .rnd .tab-wrap .common_tab ul li a {position:relative; width:185px; height:185px; border-radius:100%;}
		.main .rnd .tab-wrap .common_tab ul li a span {position:absolute; top:0; left:0; display:inline-block; width:185px; height:185px; border-radius:100%; color:#fff; font-weight:700; background:rgba(0,106,176,90%); opacity:0; transition:.3s;}
		.main .rnd .tab-wrap .common_tab ul li a span p {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); line-height:1.2;}
		.main .rnd .tab-wrap .common_tab ul li.on a span {opacity:1;}
		.main .rnd .tab-wrap .common_tab ul li a:hover span {opacity:1;}
		/* .main .rnd .tab-wrap .common_tab ul li a:hover:before {position:absolute; top:0; left:0; content:""; width:100%; height:100%; border-radius:100%; background:rgba(0,106,176,90%);} */
		
		.main .rnd .tab-wrap .common_tab .rnd-first {background:url(../images/main/rnd-1.jpg) center center no-repeat; background-size:cover;}
		.main .rnd .tab-wrap .common_tab .rnd-second {background:url(../images/main/rnd-2.jpg) center center no-repeat; background-size:cover;}
		.main .rnd .tab-wrap .common_tab_con {margin-left:120px;}
		.main .rnd .tab-wrap .common_tab_con img {width:415px; height:415px; border-radius:100%;}
		.main .rnd .tab-wrap .common_tab_con ul li {width:100%; display:flex; align-items:center; gap:100px; font-weight:700;}
		.main .rnd .tab-wrap .common_tab_con ul li span {font-size:20px; color:#ddd; font-weight:700;}
		.main .rnd .tab-wrap .common_tab_con ul li h3 {font-size:30px; padding:20px 0 30px 0;}
		.main .rnd .tab-wrap .common_tab_con ul li p {font-weight:400; line-height:1.9;}
		.main .rnd .tab-wrap .common_tab_con ul li a {
			display:inline-block; font-size:20px; 
			padding-right:80px; margin-top:35px; background:url(../images/main/i-arrow-s.png) no-repeat 120px;
		}
		.main .rnd .tab-wrap .common_tab_con ul li a:hover {padding-right:80px; background:url(../images/main/i-arrow-s.png) no-repeat 135px;}


	/************ product menu ************/
		.main .proMenu {position:relative; height:100%; margin:155px 0 0 5vw; padding:100px; background:#003566 url(../images/main/pro-bg.png) no-repeat 40% 60%; border-radius:100px 0 0 0; color:#fff;}
		.main .proMenu .title {width:100%;}
		
		.main .proMenu .tit-nav {display:flex;}
		.main .proMenu .tit-nav li {font-weight:800; letter-spacing:.2px;}
		.main .proMenu .tit-nav li:empty {display:none;}
		.main .proMenu .tit-nav li+li {padding-left:50px; position:relative;}
		.main .proMenu .tit-nav li+li:before {position:absolute; top:8px; left:20px; content:""; width:7px; height:12px; background:url(../images/main/i-location.png) no-repeat;}
		
		.main .proMenu .proMenu-list {position:relative; display:flex; height:440px;}
		.main .proMenu .proMenu-list>div {}
		.main .proMenu .proMenu-list>.menuTab {width:300px; height:100%;}
		.main .proMenu .proMenu-list>.menuInner {width:calc(100% - 300px); height:100%;}
		.main .proMenu .proMenu-list>.menuInner>ul {display:none;}
		.main .proMenu .proMenu-list>.menuInner>ul.on {display:block;}

		.main .proMenu .proMenu-item {top:0;}
		.main .proMenu .proMenu-item li {}
		.main .proMenu .proMenu-item li+li {margin-top:10px;}
		.main .proMenu .proMenu-item li a {padding:20px 30px; margin-bottom:15px; display:block; line-height:1.2; font-size:20px; font-weight:800; opacity:.2;}

		/* .main .proMenu .proMenu-list ul li>ul {display:none;} */

		.main .proMenu .proMenu-list .dep1 {width:300px;}
		.main .proMenu .proMenu-list .dep1>li {}
		.main .proMenu .proMenu-list .dep1>li>a {}

		.main .proMenu .proMenu-list .dep2 {position:absolute; width:320px; height:100%; border-left: 1px solid rgba(225,231,237,20%); border-right: 1px solid rgba(225,231,237,20%);}
		.main .proMenu .proMenu-list .dep2>ul {}
		.main .proMenu .proMenu-list .dep2>ul>li {}
		.main .proMenu .proMenu-list .dep2>ul>li>a {}

		.main .proMenu .proMenu-list .dep3 {width:900px; display:none; flex-wrap:wrap; position:absolute; top:0; left:320px; }
		.main .proMenu .proMenu-list .dep3>li {width:33.3333%;}
		.main .proMenu .proMenu-list .dep3>li {margin-top:0;}
		.main .proMenu .proMenu-list .dep3>li:nth-child(3)~li {margin-top:10px;}
		.main .proMenu .proMenu-list .dep3>li a:hover {opacity:1;}
		/* .main .proMenu .proMenu-list .dep3>li.on a {opacity:0;} */

		.main .proMenu .proMenu-list ul li.on>a {opacity:1;}
		.main .proMenu .proMenu-list .dep1>li.on>a {color:#003a66; background:#fff;}

		/* .proMenu .proMenu-list .dep1>li.on>.dep2 {display:block;} */
		.proMenu .proMenu-list .dep2.on>li.on>.dep3 {display:flex;}
		
		
		
}



/* ************************ 태블릿이하 ************************ */
@media screen and (max-width: 1024px) {
	
	
	/************ 메인-네비게이션 ************/
		.headerH {height:0px; background:none;}
		nav.pc .navbg {background:none;}
		nav.mobile {display:none;}
		nav.pc .navbg .dep1 {border-bottom:none;}
		nav.pc .gnb>ul>li>a,header .head .lang ul li a span,nav.pc .gnb>ul>li.on>a {color:#fff;}
		/* header .head .logo a .b-logo {display:none !important;} */
		/* header .head .logo a .w-logo {display:block !important;} */
		header .head .lang .b-earth {display:none !important;}
		header .head .lang .w-earth {display:block !important;}
		
	
	/************ 공통 ************/
		.main {overflow:hidden; position:relative;}
		/* .w1520 {width:1520px;} */
		.alinknone {cursor: default;}
		.img-wrap .img {border-radius: 0 85px 0 0;}
		.title {display:flex; align-items: flex-end; width:100%; padding-bottom:20px;}
		.title span {font-size:30px; font-weight:800; padding-right:15px;}
		.title h3 {font-size:68px; padding-right:30px;}
		.title p {font-size:16px; font-weight:400;}
		img {object-fit:cover;}
	
	
	/************ 메인 비주얼 ************/
	
		@keyframes zoom {
			from {transform:scale(1.4)}
			to {transform:scale(1.1)}
		}
		@keyframes tit_move {
			from{transform: translate3d(-40%, 0, 0);}
			to{transform: translate3d(0, 0, 0);}
		}

		.main .visual {position:relative; width:100%; height:700px;}
		.main .visual .cover {position:absolute; top:0; left:0; z-index:2; width:100%; height:100%; background: rgba(0,0,0,.4);}
		.main .visual .visual-txt {position:absolute; top:50%; left:12vw;  z-index:3; width:calc(100% - 12vw*2); color:#fff; text-align:center; transform:translateY(-50%);}
		.main .visual .visual-txt h3 {font-size:50px; padding-bottom:20px; animation:tit_move 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
		.main .visual .visual-txt p {font-size:18px; font-weight:400; animation:tit_move 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
		
		.main .visual .swiper {overflow:hidden; width:100%; height:100%;}
		.main .visual .swiper .swiper-wrapper {position:relative; width:100%;}
		.main .visual .swiper .swiper-wrapper .swiper-slide img {overflow:hidden;}
		.main .visual .swiper .swiper-wrapper .swiper-slide-active {animation:zoom 3s; transform:scale(1.1);}
		
		.main .visual .swiper .swiper-wrapper .swiper-slide img {max-height:100%;}
		
		.main .swiper-button-next {right:2vw; width:100px; height:100px; background-image: url(../images/main/i-next.png); background-size:52px; opacity:.4; transition:.3s;}
		.main .swiper-button-next:hover {right:0; opacity:1;}
		.main .swiper-button-prev {left:2vw; width:100px; height:100px; background-image: url(../images/main/i-prev.png); background-size:52px;  opacity:.4;  transition:.3s;}
		.main .swiper-button-prev:hover {left:0; opacity:1;}
		
		/* product */
		.main .product {
			width:calc(100% - 30px); font-size:20px; color:#fff; font-weight:700; 
			background:rgba(0,68,69,90%); padding:30px 50px; margin-left:30px; border-radius:70px 0 0;
			position:absolute; z-index:999; bottom:0;
		}
		.main .product .product-con {display:flex; flex-direction:column; text-align:center;}
		.main .product .product-con h3 {font-size:24px; margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted rgba(255,255,255,.1);}
		.main .product ul {display:flex; justify-content:center; flex-wrap:wrap;}
		.main .product ul li {padding:0 30px;}
	
	
	/************ tsp-img ************/
		.main .main-img {padding:0 30px; margin-top:100px;}
		.main .main-img ul {display:flex; gap:30px; overflow:hidden;}
		.main .main-img ul li {width:calc(100%/4);}
		.main .main-img ul li img {width:100%; height:350px; object-fit:cover;}
		.main .main-img ul li a {position:relative;}
		.main .main-img ul li .hidden-area {
			background:rgba(0,0,0,.5); width:100%; height:100%; position:absolute; top:100%;
			font-size:16px; color:#fff; font-weight:700; padding:0 20%;
			display:flex;
			justify-content:center;
			text-align:center;
			flex-direction:column;
			transition:.3s;
		}
		.main .main-img ul li:hover .hidden-area {top:0;}
		

	/************ since ************/
		.main .since {margin-top:100px;}
		.main .since .title {width:100%; padding:0 30px 20px;}
		.main .since .since-wrap {display:flex; align-items:center; flex-direction:column;}
		.main .since .since-wrap>* {width:100%;}
		.main .since .since-wrap .img-wrap {width:calc(100% - 30px); margin-right:30px;} 
		.main .since .since-wrap .img-wrap .img {height:300px !important;}
		.main .since .since-wrap ul {display:flex; flex-direction:row; flex-wrap:wrap; padding-right:5vw; margin-top:30px;}
		.main .since .since-wrap ul li {width:50%; padding-left:70px; display:flex; flex-direction:column; font-size:20px;}
		.main .since .since-wrap ul li:nth-child(2)~li {margin-top:30px;}
		.main .since .since-wrap ul li:nth-child(1) {background:url(../images/main/i-since1.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(2) {background:url(../images/main/i-since2.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(3) {background:url(../images/main/i-since3.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(4) {background:url(../images/main/i-since4.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(5) {background:url(../images/main/i-since5.png) no-repeat 70px top;}
		.main .since .since-wrap ul li:nth-child(6) {background:url(../images/main/i-since6.png) no-repeat 70px top;}
		.main .since .since-wrap ul li a {width:100%; min-height:86px; padding:35px 0 35px 115px; line-height:1;}
		.main .since .since-wrap ul li a:hover {color:#006aaf;}
	
	
	/************ R&D ************/
		.main .rnd {padding:0 30px 100px; background:url(../images/main/rnd-txt.png) no-repeat center bottom; margin-top:100px; background-size:100%;}
		.main .rnd .tab-wrap {margin:0 auto;}
		.main .rnd .tab-wrap {display:flex; align-items:center; flex-wrap:wrap;}
		.main .rnd .tab-wrap>* {width:100%;}
		.main .rnd .tab-wrap .common_tab {}
		.main .rnd .tab-wrap .common_tab ul {flex-wrap:nowrap; justify-content:flex-start; flex-direction:row;}
		.main .rnd .tab-wrap .common_tab ul li a, 
		.main .rnd .common_tab ul li.on a {background:none;}
		.main .rnd .tab-wrap .common_tab_con {border-top:none;}
		.main .rnd .tab-wrap .common_tab ul li {padding-left:18px;}
		.main .rnd .tab-wrap .common_tab ul li a {position:relative; width:150px; height:150px; border-radius:100%;}
		.main .rnd .tab-wrap .common_tab ul li a span {position:absolute; top:0; left:0; display:inline-block; width:150px; height:150px; border-radius:100%; color:#fff; font-weight:700; background:rgba(0,106,176,90%); opacity:0; transition:.3s;}
		.main .rnd .tab-wrap .common_tab ul li a span p {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); line-height:1.2;}
		.main .rnd .tab-wrap .common_tab ul li.on a span {opacity:1;}
		.main .rnd .tab-wrap .common_tab ul li a:hover span {opacity:1;}
		
		.main .rnd .tab-wrap .common_tab .rnd-first {background:url(../images/main/rnd-1.jpg) center center no-repeat; background-size:cover;}
		.main .rnd .tab-wrap .common_tab .rnd-second {background:url(../images/main/rnd-2.jpg) center center no-repeat; background-size:cover;}
		.main .rnd .tab-wrap .common_tab_con {margin-left:0;}
		.main .rnd .tab-wrap .common_tab_con img {width:350px; height:350px; border-radius:100%;}
		.main .rnd .tab-wrap .common_tab_con ul li {width:100%; display:flex; align-items:center; gap:50px; font-weight:700;}
		.main .rnd .tab-wrap .common_tab_con ul li span {font-size:18px; color:#ddd; font-weight:700;}
		.main .rnd .tab-wrap .common_tab_con ul li h3 {font-size:24px; padding:20px 0;}
		.main .rnd .tab-wrap .common_tab_con ul li p {font-weight:400; line-height:1.9; font-size:16px;}
		.main .rnd .tab-wrap .common_tab_con ul li a {
			display:inline-block; font-size:18px; 
			padding-right:80px; margin-top:35px; background:url(../images/main/i-arrow-s.png) no-repeat 120px;
		}
		.main .rnd .tab-wrap .common_tab_con ul li a:hover {padding-right:80px; background:url(../images/main/i-arrow-s.png) no-repeat 135px;}


	/************ product menu ************/
		.main .proMenu {position:relative; height:100%; margin:100px 0 0 30px; padding:70px; background:#003566 url(../images/main/pro-bg.png) no-repeat 40% 60%; border-radius:100px 0 0 0; color:#fff;}
		.main .proMenu .title {width:100%; flex-direction:column; justify-content:flex-start;}
		.main .proMenu .title>* {width:100%;}
		.main .proMenu .title>ul {margin-top:20px;}
		
		.main .proMenu .tit-nav {display:flex;}
		.main .proMenu .tit-nav li {font-weight:800; letter-spacing:.2px;}
		.main .proMenu .tit-nav li:empty {display:none;}
		.main .proMenu .tit-nav li+li {padding-left:50px; position:relative;}
		.main .proMenu .tit-nav li+li:before {position:absolute; top:8px; left:20px; content:""; width:7px; height:12px; background:url(../images/main/i-location.png) no-repeat;}
		
		.main .proMenu .proMenu-list {position:relative; display:flex; height:400px;}
		.main .proMenu .proMenu-list>div {}
		.main .proMenu .proMenu-list>.menuTab {width:30%; height:100%;}
		.main .proMenu .proMenu-list>.menuInner {width:70%; height:100%;}
		.main .proMenu .proMenu-list>.menuInner>ul {display:none;}
		.main .proMenu .proMenu-list>.menuInner>ul.on {display:block;}

		.main .proMenu .proMenu-item {top:0;}
		.main .proMenu .proMenu-item li {}
		.main .proMenu .proMenu-item li+li {margin-top:10px;}
		.main .proMenu .proMenu-item li a {padding:15px 30px; margin-bottom:15px; display:block; line-height:1.2; font-size:16px; font-weight:800; opacity:.2;}

		/* .main .proMenu .proMenu-list ul li>ul {display:none;} */

		.main .proMenu .proMenu-list .dep1 {width:100%; height:100%; border-right:1px solid rgba(225,231,237,20%)}
		.main .proMenu .proMenu-list .dep1>li {}
		.main .proMenu .proMenu-list .dep1>li>a {}

		.main .proMenu .proMenu-list .dep2 {position:absolute; width:40%; height:100%; border-right:1px solid rgba(225,231,237,20%)}
		.main .proMenu .proMenu-list .dep2>ul {}
		.main .proMenu .proMenu-list .dep2>ul>li {}
		.main .proMenu .proMenu-list .dep2>ul>li>a {}

		.main .proMenu .proMenu-list .dep3 {width:100%; display:none; flex-wrap:wrap; position:absolute; top:0; left:100%;}
		.main .proMenu .proMenu-list .dep3>li {width:100%;}
		.main .proMenu .proMenu-list .dep3>li {margin-top:0 !important;}
		.main .proMenu .proMenu-list .dep3>li a:hover {opacity:1;}

		.main .proMenu .proMenu-list ul li.on>a {opacity:1;}
		.main .proMenu .proMenu-list .dep1>li.on>a {color:#003a66; background:#fff;}

		.proMenu .proMenu-list .dep2.on>li.on>.dep3 {display:flex;}
	
	
	
	
	



}


 /*모바일*/
@media screen and (max-width: 767px) {
		/* body {border:3px solid red;} */
		
		.title span {font-size:20px; font-weight:800; padding-right:10px;}
		.title h3 {font-size:46px; padding-right:20px;}
		.title p {font-size:15px; font-weight:400;}
		
		.main .product {font-size:14px; border-radius:50px 0 0 0;}
		.main .product .product-con h3 {display:none;}
		.main .product ul li {padding:0 10px;}
		
		.main .visual {height:500px;}
		.main .visual .visual-txt h3 {font-size:30px; padding-bottom:10px;}
		.main .visual .visual-txt p {font-size:16px;}
		
		.main .swiper-button-next {right:0; width:70px; height:70px; background-image: url(../images/main/i-next.png); background-size:36px; opacity:.4; transition:.3s;}
		.main .swiper-button-next:hover {right:0; opacity:1;}
		.main .swiper-button-prev {left:0; width:70px; height:70px; background-image: url(../images/main/i-prev.png); background-size:36px;  opacity:.4;  transition:.3s;}
		.main .swiper-button-prev:hover {left:0; opacity:1;}
		
		.main .main-img {margin-top:50px;}
		.main .main-img ul {flex-wrap:wrap; gap:0;}
		.main .main-img ul li {width:calc(100%/2);}
		
		.main .since {margin-top:50px;}
		.main .since .title {flex-wrap:wrap;}
		.main .since .title>p {width:100%;}
		.main .since .title>p br {display:none;}
		.main .since .since-wrap .img-wrap .img {height:200px !important;}
		.main .since .since-wrap ul {padding-left:30px;}
		.main .since .since-wrap ul li {width:50%;}
		/* .main .since .since-wrap ul li~li {margin-top:10px !important;} */
		
		.main .since .since-wrap ul li {padding-left:70px; padding-right:30px; display:flex; flex-direction:column; font-size:16px; background-size:70px !important;}
		.main .since .since-wrap ul li:nth-child(2)~li {margin-top:30px;}
		.main .since .since-wrap ul li:nth-child(1) {background:url(../images/main/i-since1.png) no-repeat 0 top;}
		.main .since .since-wrap ul li:nth-child(2) {background:url(../images/main/i-since2.png) no-repeat 0 top;}
		.main .since .since-wrap ul li:nth-child(3) {background:url(../images/main/i-since3.png) no-repeat 0 top;}
		.main .since .since-wrap ul li:nth-child(4) {background:url(../images/main/i-since4.png) no-repeat 0 top;}
		.main .since .since-wrap ul li:nth-child(5) {background:url(../images/main/i-since5.png) no-repeat 0 top;}
		.main .since .since-wrap ul li:nth-child(6) {background:url(../images/main/i-since6.png) no-repeat 0 top;}
		.main .since .since-wrap ul li a {width:100%; min-height:70px; padding:22px 0 22px 20px; line-height:1.2;}
		
		.main .rnd .tab-wrap .common_tab_con ul li {flex-direction:column;}
		
		.main .rnd .tab-wrap .common_tab ul {justify-content:center;}
		
		.main .rnd .tab-wrap .common_tab ul li a span,
		.main .rnd .tab-wrap .common_tab ul li a {width:130px; height:130px;} 
		.main .rnd .tab-wrap .common_tab_con {margin-top:0;}
		.main .rnd .tab-wrap .common_tab_con img {width:270px; height:270px;}
		.main .rnd .tab-wrap .common_tab_con ul li {gap:30px;}
		.main .rnd .tab-wrap .common_tab_con ul li h3 {font-size:20px; padding:10px 0;}
		.main .rnd .tab-wrap .common_tab_con ul li p {font-size:14px;}
		.main .rnd .tab-wrap .common_tab_con ul li a {margin-top:20px;}
		
		.main .proMenu {margin-top:50px; border-radius:50px 0 0 0; padding:50px;}
		.main .proMenu .menuWrap {}
		
		/* .main .proMenu .proMenu-list {flex-direction:column;} */
		/* .main .proMenu .proMenu-list>* {width:100% !important;} */
		
		/*테이블::::*/
		.menuAllWrap {
			width:100%; position:relative;
		}
		.menuAllWrap:before {
			content:"좌 · 우로 드래그(Drag) 할 수 있습니다.";
			display:block; padding:10px 0; font-size:12px; color:#fff; text-align:left; background:transparent;
		}
		.menuAllWrap .menuIn {overflow-x:auto;}
		.menuAllWrap .menuIn .menuWrap {width:150vw !important; margin:0 !important; white-space:nowrap;}
		
		
		
		
		
		
		
		
		
		
}


