@charset "utf-8";

.section {height: 100vh;position: relative;overflow: hidden;}
.section-nav {position: fixed;left: 50%;transform: translateX(-50%);bottom: 50px;display: flex;flex-wrap: wrap;background: rgba(0,0,0,0.4);padding: 0 25px 0 120px;border-radius: 100px;height: 36px;align-items: center; z-index: 10;}
.section-nav::before, .section-nav::after {position: absolute; top: 50%; transform: translateY(-50%); color: #fff;}
.section-nav::before {content: 'scroll';text-transform: uppercase;font-family: 'Roboto', sans-serif;font-size: 13px;font-weight: 700;letter-spacing: 1.5px;left: 25px; opacity: 0.7;}
.section-nav::after {content: '\e94b'; font-family: xeicon; font-size: 15px; left: 90px;}
.section-nav li {height: 100%;}
.section-nav .pager {text-indent: -9999px;width: 8px;height: 8px;background: #e1e1e1;border-radius: 100%;padding: 0;margin-right: 28px;position: relative; transition: all 0.3s;}
.section-nav .pager::before, .section-nav .pager::after {position: absolute;content: '';width: 3px;height: 3px;background: inherit;border-radius: 100%;top: 50%;transform: translateY(-50%);left: 15px;}
.section-nav .pager::after {left: 25px;}
.section-nav li:last-child .pager {margin-right: 0;}
.section-nav li:last-child .pager::before, .section-nav li:last-child .pager::after {opacity: 0;}
.section-nav li.active .pager {background: #e98900; width: 12px; height: 12px;}
.section-nav li.active .pager::before {left: 18px;}
.section-nav li.active .pager::after {left:28px;}

/*메인 이미지 슬라이드*/
.main-slide {height: 100%;}
.main-slide .visual-txt {position: absolute;z-index: 10;color: #fff; width: 100%; max-width: 1500px; left: 50%; top: 40%; transform: translate(-50%, -50%); font-size: 55px; line-height: 1.5;}
.main-slide .visual-txt h2 {font-weight: 700; font-style: italic; transform: translateY(50px); opacity: 0; transition: all 0.7s 0.7s;}
.main-slide .swiper-slide-active .visual-txt h2 {transform: translateY(0); opacity: 1;}
.main-slide .swiper-slide img {width: 100%; height:100%; object-fit: cover; transform: scale(1.1,1.1); transition: transform 4.5s ease-in-out;}
.main-slide .swiper-slide-active img {transform: scale(1.0,1.0);}

/*제품 슬라이드*/
.swiper.main-slide2 {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 1500px; height: 530px;}
.main-slide2 .inner-box {position: absolute;width: 480px;height: 480px;padding: 50px;box-sizing: border-box;right: 0;top: 50%;transform: translateY(-50%);display:none !important}
.main-slide2 .img-box {width: 375px; height: 375px; background: #fff; overflow: hidden; position: relative; transform: rotate(45deg); border-radius: 80px;}
.main-slide2 .img-box img {position: absolute; width: 80%; height: 80%; left: 50%; top: 50%; transform:rotate(-45deg) translateY(-50%); object-fit: cover; opacity: 0; transition: all 0.45s 0.2s;}
.main-slide2 .swiper-slide-active .img-box img {transform:rotate(-45deg) translateY(-70%); opacity: 1; }
.main-slide2 .products-name {position: absolute;font-size: 24px;color: #fff;font-weight: 500;bottom: -30px;left: 50%;transform: translateX(-50%);min-width: 150px; text-align:center;}
.main-slide2 .pro-lnk {position: absolute;top: 80px;left: 20px;display: block;width: 90px;height: 90px;border-radius: 100%;background: #464646;color: #fff;text-align: center;line-height: 85px;font-size: 40px;box-sizing: border-box;border: 3px solid #fff;}
.slide-btn {position: absolute;width: 500px;height: 100px;z-index: 10;top: 280px;left: 0;display: flex;align-items: center;}
.slide-btn .swiper-button-next, .slide-btn .swiper-button-prev {position: relative;left: auto;top: auto;margin-top: 0;width: 99px;height: 99px;margin-right: 30px; outline: none;}
.slide-btn .swiper-button-next {margin-right: 0;}
.slide-btn .swiper-button-next:before, .slide-btn .swiper-button-prev:before {position: absolute;content: '';width: 75px;height: 75px;background: rgba(255,255,255,0.3);border-radius: 18px;transform: rotate(45deg);}
.slide-btn .swiper-button-next:after, .slide-btn .swiper-button-prev:after {content: '';background: url('../../images/prev-btn.png') 50% 50% no-repeat;width: 20px;height: 34px;background-size: 100%;z-index: 1;}
.slide-btn .swiper-button-next:after {background-image: url('../../images/next-btn.png');}

/*progress*/
.main-slide2 .progress {width: 90px;height: 90px;position: absolute;left: 50%;top: 50%;opacity: 0;transform: translate(-50%, -50%);}
.main-slide2 .progress > em {width: 50%; height: 100%; overflow: hidden; position: absolute; top: 0; z-index: 1;}
.main-slide2 .progress .left {left: 0;}
.main-slide2 .progress .right {right: 0;}
.main-slide2 .progress .progress-bar {width: 100%; height: 100%; border: 3px solid #ff9600; position: absolute; top: 0;box-sizing: border-box;}
.main-slide2 .progress .left .progress-bar {left: 100%; border-top-right-radius: 90px; border-bottom-right-radius: 90px; border-left: 0; transform-origin: center left; -webkit-transform-origin: center left;}
.main-slide2 .progress .right .progress-bar {left: -100%; border-top-left-radius: 90px; border-bottom-left-radius: 90px; border-right: 0;}

.main-slide2 .swiper-slide-active .progress {opacity: 1;}
.main-slide2 .swiper-slide-active .progress .left .progress-bar {-webkit-animation: right-bar 2.5s linear forwards 2.5s;animation: right-bar 2.5s linear forwards 2.5s;}

.main-slide2 .swiper-slide-active .progress .right .progress-bar { -webkit-transform-origin: center right; transform-origin: center right;-webkit-animation: left-bar 2.5s linear forwards;animation: left-bar 2.5s linear forwards;}

@keyframes left-bar {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    to {-webkit-transform: rotate(180deg);transform: rotate(180deg);}
}

@keyframes right-bar {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    to {-webkit-transform: rotate(180deg);transform: rotate(180deg);}
}

/*동영상 section*/
.video-wrap {height: 100%;}
.video-box {height: 100%; position: relative;}
.video-box .play-btn {width: 110px; height: 110px; background: rgba(70,70,70,0.4); color :#fff; font-size: 40px; position: absolute;left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3; text-align: center; border-radius: 100%; border: 3px solid #fff; padding: 0; transition: all 0.3s;}
.video-box .play-btn:hover {background: #dc851b; border-color: #dc851b;}
.video-box .video-cover {position: absolute; width: 100%; height: 100%; object-fit: cover; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2;}
/*.video-box .yb-btn {position: absolute;z-index: 3;color: #fff;top: 10%;right: 0;background: #dc851b;}*/
.iframe-wrap {height: 100%;}
.iframe-wrap::after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 77%;z-index:1;display: block;}
.video-box iframe {position: absolute; width: 100% !important; height: 100% !important; object-fit: cover; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-overflow-scrolling: touch;}

/*제품소개*/
@keyframes lnk-arrow {
    0% {right: 30px; top: 22px;}
    100% {right: -15px; top: -12px;}
}

.intro-section {padding-top: 80px;}
.intro-section .top-wrap {margin: 70px 0 65px; text-align: center;}
.intro-section .top-wrap .section-tit {font-size: 50px;font-weight: 700;color: #282828;margin-bottom: 10px;}
.intro-section .top-wrap .section-txt {font-size: 16px; color: #3d3d3d;}
.intro-section .top-wrap .section-tit a {padding: 0 35px;position: relative;display: inline-block;color: #282828;}

.intro-section .list-warp {display: flex;flex-wrap: wrap;height: calc(100vh - 320px);}
.intro-section .list-warp li {width: 25%;box-sizing: border-box;background-size: 100%; border-top: 1px solid #eee; border-right: 1px solid #eee; transition: all 0.3s; background-size: contain; height: 50%; background-position: right bottom; background-repeat: no-repeat;}
.intro-section .list-warp li a {display: block;padding: 65px;box-sizing: border-box;height: 100%;}
.intro-section .list-warp li .num {font-size: 15px; font-weight: 700; color: #dc851b; transition: all 0.3s;}
.intro-section .list-warp li .list-name {font-size: 30px; font-weight: 700; color: #282828; padding: 8px 0 5px; transition: all 0.3s;}
.intro-section .list-warp li .list-name-en {color: #3d3d3d; font-size: 15px; text-transform: uppercase; transition: all 0.3s;}

.intro-section .list-warp li.list01 {background-image: url('../../images/ma-pipe.png');}
.intro-section .list-warp li.list02 {background-image: url('../../images/ma-joint.png');}
.intro-section .list-warp li.list03 {background-image: url('../../images/ma-alu.png');}
.intro-section .list-warp li.list05 {background-image: url('../../images/ma-roller.png'); }
.intro-section .list-warp li.list04 {background-image: url('../../images/ma-sub.png'); border-right:0;}
.intro-section .list-warp li.list06 {background-image: url('../../images/ma-con.png'); }
.intro-section .list-warp li.list07 {background-image: url('../../images/ma-par.png'); }
.intro-section .list-warp li.list08 {background-image: url('../../images/ma-agv.png'); border-right: 0;}

.ico-lnk {display: block;width: 25px;height: 25px;background: #083994;border-radius: 100%;position: relative;overflow: hidden;margin-top: 25px;}
.ico-lnk::before {position: absolute;content: '';background:url('../../images/arrow.png') 50% 50% no-repeat; width: 10px; height: 10px;right: 8px;top: 7px;}
.intro-section .list-warp li:hover {background-color: #dc851b; }
/* .intro-section .list-warp li:hover {height: 50%; } */
.intro-section .list-warp li:hover .num, .intro-section .list-warp li:hover .list-name, .intro-section .list-warp li:hover .list-name-en {color: #fff;}

.intro-section .list-warp li.list01:hover {background-image: url('../../images/ho-ma-pipe.png');}
.intro-section .list-warp li.list02:hover {background-image: url('../../images/ho-ma-joint.png');}
.intro-section .list-warp li.list03:hover {background-image: url('../../images/ho-ma-alu.png');}
.intro-section .list-warp li.list05:hover {background-image: url('../../images/ho-ma-roller.png');}
.intro-section .list-warp li.list04:hover {background-image: url('../../images/ho-ma-sub.png');}
.intro-section .list-warp li.list06:hover {background-image: url('../../images/ho-ma-con.png');}
.intro-section .list-warp li.list07:hover {background-image: url('../../images/ho-ma-par.png');}
.intro-section .list-warp li.list08:hover {background-image: url('../../images/ho-ma-agv.png');}

.intro-section .top-wrap .section-tit a:hover .ico-lnk::before, .intro-section .list-warp li:hover .ico-lnk::before {animation: lnk-arrow 1s infinite linear;}

.intro-section .top-wrap .section-tit .ico-lnk {position: absolute;top: 10px;right: 0;margin-top: 0;} .list-warp .ico-lnk {display: none;}
.intro-section .list-warp li:hover .ico-lnk {display: block;}

/*적용사례*/
.bg-wrap {background: url('../../images/section-bg03.jpg') 50% 50% no-repeat; background-size: cover; height: 100%;display:flex;flex-direction: column;justify-content: center;align-items: center; padding-top: 0;}
.bg-wrap .top-wrap .section-tit a, .bg-wrap .top-wrap .section-txt {color: #fff;}

.swiper.case-slide {max-width: 1400px; overflow:visible; width: 100%;}
.case-slide .swiper-slide {margin-top: 40px;opacity: 0.4;display: flex;flex-direction: column;cursor: pointer;align-items: center;}
.case-slide .swiper-slide:nth-child(2n) {margin-top: 0;}
.case-slide .swiper-slide.swiper-slide-active, .case-slide .swiper-slide.swiper-slide-prev, .case-slide .swiper-slide.swiper-slide-next {opacity: 1;}
.case-slide .swiper-slide .img-box {max-width: 370px;position: relative;padding-top: 66%;transition: all 0.3s;width: 100%;margin: 0 auto;}
.case-slide .swiper-slide .img-box::before {opacity: 0; transition: all 0.3s; position: absolute; content: ''; width: 100%; height: 100%; border:1px solid #ffcf8b; right: 0; top: 0; z-index: 1;border-top-left-radius: 30px;}
.case-slide .swiper-slide .img-box img {position: absolute;width:100%;height: 100%;left: 50%;top: 50%;transform: translate(-50%, -50%);object-fit: cover;border-top-left-radius: 30px;}
.case-txt {max-width: 370px; width: 100%;}
.case-txt .case-type {font-size: 15px; color: #ffcf8b; font-weight: 500; display: block; margin: 30px 0 10px;}
.case-txt a {font-size: 24px;text-transform: uppercase;display: inline-block;padding-right: 40px;position: relative;font-weight: 500;color: #fff;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display: block;}
.case-txt a .ico-lnk {position: absolute; right: 0; margin-top: 0; top: 5px; opacity: 0; transition: all 0.3s;}
.case-slide .swiper-button-prev, .case-slide .swiper-button-next {background: url('../../images/case-prev.png')  50% 50% no-repeat; margin-top: 0; width: 34px; height: 61px; left: -20px; top: 30%;}
.case-slide .swiper-button-next {left: auto; right: -20px; background-image: url('../../images/case-next.png');}
.case-slide .swiper-button-prev:after, .case-slide .swiper-button-next:after {content: '';}
.case-slide .swiper-slide:hover .img-box {box-shadow: 10px 14px 20px rgba(0,0,0,0.4);}
.case-slide .swiper-slide:hover .img-box::before {opacity: 1;right: -8px; top: -8px;}
.case-slide .swiper-slide:hover .case-txt a .ico-lnk {opacity: 1;}
.case-slide .swiper-slide:hover .case-txt a .ico-lnk::before {animation: lnk-arrow 1s infinite linear;}

/*고객 서비스*/
.bg-wrap2 {height: 100%;display: flex;align-items: center;flex-direction: column;background: url('../../images/section-bg04.jpg') 50% 50% no-repeat;background-size: cover;justify-content: center;padding-top: 0;}
.service-wrap {max-width: 1500px;margin: 0 auto;width: 100%; padding-top: 30px;}
.service-wrap ul {display: flex;width: 100%;justify-content: space-between;align-items: flex-start;flex-wrap: wrap;}
.service-wrap ul li {transition: all 0.3s;position: relative;z-index: 1;width: calc(25% - 30px);margin-right: 40px;padding-top: 22%;}
.service-wrap ul li:last-child {margin-right: 0;}
.service-wrap .service-list {transition: all 0.3s;display: flex;flex-direction: column;box-sizing: border-box;padding:45px;/* height: 330px; */background: url('../../images/service01.jpg') 50% 50% no-repeat;background-size: cover;border-top-left-radius: 20px;overflow: hidden;justify-content: flex-end;text-align: center;align-items: center;font-size: 30px;color: #fff;font-weight: 500;position: absolute;width: 100%;height: 100%;left: 50%;top: 50%;transform: translate(-50%,-50%) !important;}
.service-wrap .service-list.list02 {background-image: url('../../images/service02.jpg');}
.service-wrap .service-list.list03 {background-image: url('../../images/service03.jpg');}
.service-wrap .service-list.list04 {background-image: url('../../images/service04.jpg');}
.service-wrap ul li::before {position: absolute; content:'';width:100%; height: 100%; background: #dc851b; z-index: -1; left: 0; top: 0; opacity: 0; transition: all 0.3s;border-top-left-radius: 20px;}
.service-wrap .service-list span {display: inline-block; position: relative; transition: all 0.3s;}
.service-wrap .service-list .ico-lnk {display: none; margin-top: 0; position: absolute; right: 0; top: 50%; transform: translateY(-50%); transition: all 0.3s; opacity: 0;}
.service-wrap ul li:hover {margin-top: -30px;}
.service-wrap ul li:hover::before {opacity: 1;left: 10px;top: 10px;}
.service-wrap ul li:hover .service-list {box-shadow: 20px 16px 40px 0 rgba(54, 54, 54, .4);}
.service-wrap ul li:hover .service-list span {padding-right: 35px;}
.service-wrap ul li:hover .service-list .ico-lnk {display: block; opacity: 1;}
.service-wrap ul li:hover .service-list .ico-lnk::before {animation: lnk-arrow 1s infinite linear;}

.w-br {display: block;}


@media screen and (max-width:1600px) {
	.main-slide .visual-txt {font-size: 50px; padding: 0 40px; box-sizing: border-box;}
	.swiper.main-slide2 {padding: 0 40px; box-sizing: border-box;}
	.slide-btn {left: 40px;}
	.service-wrap {padding: 0 40px; box-sizing: border-box;}
}
@media screen and (max-width:1500px) {
	.swiper.case-slide {max-width: 1200px;}
	.case-slide .swiper-slide .img-box {max-width: 300px; padding-top: 60%;}
	.case-txt {max-width: 300px;}
	.case-txt .case-type {margin: 20px 0 5px;}
	.service-wrap .service-list {padding: 30px; font-size: 22px;}
}
@media screen and (max-width:1400px) {
    .intro-section .list-warp li .list-name {font-size: 25px;}

}
@media screen and (max-width:1300px) {
	.swiper.case-slide {max-width: 1100px; padding: 0 40px; box-sizing: border-box;}
	.case-slide .swiper-slide .img-box {max-width: 270px;}
	.case-txt {max-width: 270px;}
	.case-slide .swiper-button-prev, .case-slide .swiper-button-next {left: 15px;}
	.case-slide .swiper-button-next {left: auto; right: 15px;}
}
@media screen and (max-width:1200px){
	.swiper.main-slide2 {top: 65%;}
	.main-slide2 .inner-box {width: 435px; height: 435px;}
	.main-slide2 .img-box {width: 340px; height: 340px;}
	.main-slide .visual-txt {top: 30%;}
	.main-slide2 .pro-lnk {top: 65px;left: 40px;width: 80px;height: 80px;line-height: 75px;font-size: 26px;}
	.main-slide2 .progress {width: 80px; height: 80px;}
	.main-slide2 .products-name {font-size: 20px; min-width: 120px;}
	.main-slide .visual-txt {font-size: 45px;}
	.slide-btn {top: 30px;}
	.intro-section .list-warp li {width: 50%; height: 25%; background-position: right bottom; background-image: url('../../images/01_mo.png');}
	.intro-section .list-warp li.list02 {background-image: url('../../images/02_mo.png');}
	.intro-section .list-warp li.list03 {background-image: url('../../images/03_mo.png');}
	.intro-section .list-warp li.list05 {background-image: url('../../images/04_mo.png');}
	.intro-section .list-warp li.list04 {background-image: url('../../images/05_mo.png'); border-bottom: 1px solid #eee; border-bottom: none;}
	.intro-section .list-warp li.list06 {background-image: url('../../images/06_mo.png'); border-right: 1px solid #eee;}
	.intro-section .list-warp li.list07 {background-image: url('../../images/07_mo.png'); border-right: 1px solid #eee;}
	.intro-section .list-warp li.list08 {background-image: url('../../images/08_mo.png'); border-right: 1px solid #eee;}

	.intro-section .list-warp li:hover {background-image: url('../../images/01_mo_ho.png');}
	.intro-section .list-warp li.list02:hover {background-image: url('../../images/02_mo_ho.png');}
	.intro-section .list-warp li.list03:hover {background-image: url('../../images/03_mo_ho.png');}
	.intro-section .list-warp li.list05:hover {background-image: url('../../images/04_mo_ho.png');}
	.intro-section .list-warp li.list04:hover {background-image: url('../../images/05_mo_ho.png');}
	.intro-section .list-warp li.list06:hover {background-image: url('../../images/06_mo_ho.png');}
	.intro-section .list-warp li.list07:hover {background-image: url('../../images/07_mo_ho.png');}
	.intro-section .list-warp li.list08:hover {background-image: url('../../images/08_mo_ho.png');}
	.intro-section .list-warp li a {padding: 30px;}
	.intro-section .list-warp li .list-name {font-size: 26px;}
	.ico-lnk {margin-top: 20px;}
	.service-wrap .service-list {padding: 20px; font-size: 18px;}
	.section-nav {bottom: 30px;}
}
@media screen and (max-width:1023px) {
	.iframe-wrap::after {display: none;}
	.service-wrap {padding: 0 30px;}
	.bg-wrap, .bg-wrap2 {justify-content: flex-start;}
	.intro-section .top-wrap .section-tit {font-size: 45px;}
	.section-nav {display: none;}
	.section {height: auto;}
	.swiper.main-slide {height: 100vh;}
	.main-slide .visual-txt {padding: 0 30px;}
	.swiper.main-slide2 {padding: 0 30px;}
	.slide-btn {top: 10px; left: 30px;}
	.slide-btn .swiper-button-next, .slide-btn .swiper-button-prev {width: 80px; height: 80px; margin-right: 20px;}
	.slide-btn .swiper-button-next:before, .slide-btn .swiper-button-prev:before {width: 60px; height: 60px; border-radius: 14px;}
	.slide-btn .swiper-button-next:after, .slide-btn .swiper-button-prev:after {width: 12px;}
	.intro-section {padding-top: 0;}
	.section3 .bg-wrap, .section4 .bg-wrap2 {padding-bottom: 100px;}
	.case-slide .swiper-slide {margin-top: 0;}
	.case-slide .swiper-slide .img-box {max-width: 340px; padding-top: 0; height: 265px;}
	.case-txt {max-width: 340px;}
	.service-wrap ul li {width: calc(50% - 30px); margin-bottom: 40px; padding-top: 40%;}
	.service-wrap ul li:nth-child(2n) {margin-right:0;}
	.service-wrap ul li:hover {margin-top: 0;}
	.swiper.case-slide {padding: 20px 0; overflow: hidden;}
	.case-slide .swiper-button-prev, .case-slide .swiper-button-next {width: 24px; height: 50px; background-size: 100%;}
	
	.intro-section .list-warp {min-height: 550px;}
	.video-box {padding-top: 57%;}
	/*.video-box iframe {display: none;}*/
	.video-box .play-btn {width: 90px; height: 90px; font-size: 30px;}

	@media not all and (min-resolution:.001dpcm) {
		@supports (-webkit-appearance:none) and (stroke-color:transparent) { 
			.video-box iframe {width: 100%; padding: 0; min-width: 500px;}
		} 
	}
}
@media screen and (max-width:767px) {
	.service-wrap {padding: 0 20px;}
	.main-slide .visual-txt {font-size: 30px; top: 20%; padding: 0 20px;}
	.swiper.main-slide2 {top: 65%; height: 600px; padding: 0 20px;}
	.main-slide2 .inner-box {right: auto; left:50%; transform: translate(-50%, -50%);}
	.w-br {display: inline-block;}
	.swiper.main-slide {height: 800px;}
	.slide-btn {left: 20px;top: -20px;}
	.service-wrap ul li {margin-right: 20px; width: calc(50% - 10px); margin-bottom: 20px;}
	.service-wrap ul li:hover::before {display: none;}
	.intro-section .list-warp {height: auto;}
	.intro-section .list-warp li {width: 100%; height: 190px;}
	.intro-section .top-wrap .section-tit {font-size: 38px;}
	.intro-section .list-warp li.list05 {border-bottom: 0;}
	.intro-section .list-warp li.list04 {border-right: 0;}
	.intro-section .top-wrap {margin: 70px 0 40px;}
	.case-slide .swiper-button-prev, .case-slide .swiper-button-next {top: 40%;}
	.slide-btn .swiper-button-next, .slide-btn .swiper-button-prev {width: 70px; height: 70px; margin-right: 10px;}
	.slide-btn .swiper-button-next:before, .slide-btn .swiper-button-prev:before {width: 50px; height: 50px;}
	.video-box .play-btn {width: 70px; height: 70px; font-size: 22px;}
}

@media screen and (max-width:500px) {
	.main-slide2 .img-box img {width: 70%; height:70%;}
	.main-slide2 .inner-box {width: 320px; height: 320px; padding: 30px;}
	.main-slide2 .img-box {width: 260px; height: 260px; border-radius: 70px;}
	.main-slide2 .pro-lnk {top: 30px; left: 20px; width: 70px; height: 70px; line-height: 65px;}
	.main-slide2 .progress {width: 70px; height: 70px;}
	.main-slide2 .products-name {text-align: center; min-width: 320px;}
	.swiper.case-slide {padding: 20px 30px;}
	.intro-section .list-warp li {height: 150px;}
	.case-slide .swiper-slide {padding: 0 30px; box-sizing: border-box;}
	.case-slide .swiper-slide .img-box {padding-top: 80%; height: 0;}
	.case-slide .swiper-button-prev, .case-slide .swiper-button-next {top: 30%;}
	.section3 .bg-wrap, .section4 .bg-wrap2 {padding-bottom: 70px;}
	.case-txt a {font-size: 20px;}
	.service-wrap .service-list {font-size: 16px; padding: 10px;}
	.intro-section .list-warp li a {padding: 20px 30px;}
	.intro-section .list-warp li .list-name {font-size: 22px; padding: 5px 0 2px;}
	.intro-section .list-warp li .list-name-en {font-size: 14px;}
	.ico-lnk {margin-top: 8px;}
	.video-box .play-btn {width: 50px; height: 50px;}
}
@media screen and (max-width:360px) {
	.service-wrap ul li {width: 100%; margin-right: 0; padding-top: 90%;}
}

/* main pop-up */
@media screen and (max-width:1024px) {
    .pu_pop {top: 10% !important; left: 10% !important; width: 61vw !important; height: 46vw !important; min-width: 300px !important; min-height: 245px !important;}
    .pu_pop > form > table tr { height: 100% !important;}
    .pu_pop .txc-image {width: 100% !important;}
}
@media screen and (max-width:900px){
    .pu_pop>form>table >tbody tr:nth-child(2) > td { padding-top: 5px !important;}
}
@media screen and (max-width:767px){
   .pu_pop {width: 90vw !important; height: 60vw !important;top: 11% !important; left: 3% !important; }
}
@media screen and (max-width:755px) {
    .pu_pop { height: 68vw !important;}   
}
@media screen and (max-width:550px){
    .pu_pop>form>table >tbody tr:nth-child(2) > td { padding-top: 0px !important;}
}
@media screen and (max-width:450px) {
    .pu_pop { height: 70vw !important;}   
}
@media screen and (max-width:420px) {
    .pu_pop { min-width: 270px !important; min-height: 225px !important; }
    .pu_pop>form>table >tbody tr:nth-child(2) > td { padding-top: 0px !important;}
    .pu_pop>form>table tr td:nth-child(1) {font-size: 11px !important;}
    .pu_pop>form>table tr td:nth-child(2) {font-size: 13px  !important;}
}