/* mv */
.mv-wrap{height: 940px; width: 100%; position: relative; min-width:1300px; overflow: hidden;}
.mv-con{height: 940px; width: 100%; position: relative; overflow: hidden;}
.mv{height: 940px; width: 100%; position: relative; overflow: hidden;}
.mv-slide{float: left; height: 940px; width: 100%; position: relative; z-index: 1 !important; overflow: hidden;}
.mv-img{width: 100%; height: 100%; -ms-transform:scale(1.1); -o-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); transform:scale(1.1); -webkit-transition:transform 5000ms ease-in-out; -moz-transition:transform 5000ms ease-in-out; -o-transition:transform 5000ms ease-in-out; -ms-transition:transform 5000ms ease-in-out; transition:transform 5000ms ease-in-out;}
.mv-slide .mv-txt{top: 270px; left: 50%; position: absolute; width: 1300px; margin-left: -650px; z-index: 2;}
.mv-slide .mv-txt span{font-size: 40px; line-height:1; letter-spacing:-0.09em; color: #fff; font-weight: 400; display: block; position: relative; text-shadow: 3px 3px 3px rgb(0 0 0 / 30%);}
.mv-slide .mv-txt b{margin-top: 20px; font-size: 62px; line-height:66px; letter-spacing:-0.07em; color: #fff; font-weight: 500; display: block; text-shadow: 3px 3px 3px rgb(0 0 0 / 30%);}
.mv-slide .mv-txt a{margin-top: 60px; width: 240px; font-size: 16px; line-height:60px; letter-spacing:0; font-weight: 800; color: #fff; position: relative; background: #ff7364; display: block; text-align: center; box-shadow:2px 2px 5px 2px rgba(0,0,0,0.2);}

.mv-bg01{ background: url(../img/mv-img01.jpg) center center no-repeat; background-size:cover !important; -ms-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); -webkit-transition: transform 5000ms ease-in-out; -moz-transition: transform 5000ms ease-in-out; -o-transition: transform 5000ms ease-in-out; -ms-transition: transform 5000ms ease-in-out; transition: transform 5000ms ease-in-out;}
.mv-bg02{ background: url(../img/mv-img02.jpg) center center no-repeat; background-size:cover !important; -ms-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); -webkit-transition: transform 5000ms ease-in-out; -moz-transition: transform 5000ms ease-in-out; -o-transition: transform 5000ms ease-in-out; -ms-transition: transform 5000ms ease-in-out; transition: transform 5000ms ease-in-out;}
.mv-bg03{ background: url(../img/mv-img03.jpg) center center no-repeat; background-size:cover !important; -ms-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); -webkit-transition: transform 5000ms ease-in-out; -moz-transition: transform 5000ms ease-in-out; -o-transition: transform 5000ms ease-in-out; -ms-transition: transform 5000ms ease-in-out; transition: transform 5000ms ease-in-out;}

.mv .slick-dots{width: 12px; position: absolute; top: 335px; left: 50%; margin-left: 626px; z-index: 3;}
.mv .slick-dots li{margin-bottom: 8px;}
.mv .slick-dots li:last-of-type{margin-bottom: 0;}
.mv .slick-dots li button{width: 12px; height: 12px; border: 1px solid #fff; background: none; box-sizing:border-box; display: block; font-size: 0; text-indent:-9999px; padding: 0; margin: 0; cursor:pointer;}
.mv .slick-dots li.slick-active button{background: #ff7364; border: 1px solid #ff7364;}

.active-item .mv-img{-ms-transform: scale(1.0,1.0) rotate(0.01deg); -o-transform: scale(1.0,1.0) rotate(0.01deg); -moz-transform: scale(1.0,1.0) rotate(0.01deg); -webkit-transform: scale(1.0,1.0) rotate(0.01deg); transform: scale(1.0,1.0) rotate(0.01deg);}

.mv-slide .mv-txt span.mv-ani01{opacity: 0; filter: Alpha(opacity=0); -ms-transform: translateX(-50px); -o-transform: translateX(-50px); -moz-transform: translateX(-50px); -webkit-transform: translateX(-50px); transform: translateX(-50px); -webkit-transition: opacity 2.0s, transform 2.0s; -moz-transition: opacity 2.0s, transform 2.0s; -o-transition: opacity 2.0s, transform 2.0s; -ms-transition: opacity 2.0s, transform 2.0s; transition: opacity 2.0s, transform 2.0s; -webkit-transition-delay: 1.3s; -moz-transition-delay: 1.3s; -o-transition-delay: 1.3s; -ms-transition-delay: 1.3s; transition-delay: 1.3s;}
.mv-slide .mv-txt b.mv-ani02{opacity: 0; filter: Alpha(opacity=0); -ms-transform: translateX(-50px); -o-transform: translateX(-50px); -moz-transform: translateX(-50px); -webkit-transform: translateX(-50px); transform: translateX(-50px); -webkit-transition: opacity 2.0s, transform 2.0s; -moz-transition: opacity 2.0s, transform 2.0s; -o-transition: opacity 2.0s, transform 2.0s; -ms-transition: opacity 2.0s, transform 2.0s; transition: opacity 2.0s, transform 2.0s; -webkit-transition-delay: 1.7s; -moz-transition-delay: 1.7s; -o-transition-delay: 1.7s; -ms-transition-delay: 1.7s; transition-delay: 1.7s;}
.mv-slide .mv-txt a.mv-ani03{opacity: 0; filter: Alpha(opacity=0); -ms-transform: translateX(-50px); -o-transform: translateX(-50px); -moz-transform: translateX(-50px); -webkit-transform: translateX(-50px); transform: translateX(-50px); -webkit-transition: opacity 2.0s, transform 2.0s; -moz-transition: opacity 2.0s, transform 2.0s; -o-transition: opacity 2.0s, transform 2.0s; -ms-transition: opacity 2.0s, transform 2.0s; transition: opacity 2.0s, transform 2.0s; -webkit-transition-delay: 2.0s; -moz-transition-delay: 2.0s; -o-transition-delay: 2.0s; -ms-transition-delay: 2.0s; transition-delay: 2.0s;}

.mv-slide.active-item .mv-txt span.mv-ani01{opacity: 1.0; filter: Alpha(opacity=100); -ms-transform: translateX(0px); -o-transform: translateX(0px); -moz-transform: translateX(0px); -webkit-transform: translateX(0px); transform: translateX(0px);}
.mv-slide.active-item .mv-txt b.mv-ani02{opacity: 1.0; filter: Alpha(opacity=100); -ms-transform: translateX(0px); -o-transform: translateX(0px); -moz-transform: translateX(0px); -webkit-transform: translateX(0px); transform: translateX(0px);}
.mv-slide.active-item .mv-txt a.mv-ani03{opacity: 1.0; filter: Alpha(opacity=100); -ms-transform: translateX(0px); -o-transform: translateX(0px); -moz-transform: translateX(0px); -webkit-transform: translateX(0px); transform: translateX(0px);}
/* mv */

/* m-news */
.m-news{bottom: 100px; left: 50%; margin-left: -650px; width: 1300px; background: rgba(0,0,0,0.51); position: absolute; z-index: 3;}
.m-newsIn{}
.m-newsBox{padding: 19px 35px 0; height: 60px; width: 50%; border-right: 1px solid rgba(255,255,255,0.2); box-sizing:border-box; float: left;}
.m-newsBox p{margin-top: 2px; width: 115px; font-size: 20px; line-height: 20px; letter-spacing:0; font-weight: 500; float: left;}
.m-newsBox p.colorR{color: #ff7364;}
.m-newsBox p.colorB{color: #4a7395;}
.m-newsBox p img{width: 20px; height: 20px; margin-right: 10px; display: inline-block; vertical-align: top;}
.m-newsBox span{margin-top: 2px; padding-left: 15px; width: calc(100% - 150px); float: left; display: block; box-sizing:border-box;}
.m-newsBox span a{font-size: 15px; line-height:20px; letter-spacing:-0.025em; font-weight: 300; color: #fff; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; display: block;}
.m-newsBox a.more{width: 23px; height: 23px; float: right; display: block;} 
/* m-news */

/* comNav */
.comNav-wrap{max-width:1920px; margin: 0 auto;}
.comNavIn{}
.comNavLeft{height: 390px; width: 50%; float: left; overflow: hidden;}
.comNavLeft > a{width: 960px; height: 100%; float: right; display: block;}
.comNavLeft > a .black-bg{opacity: 0; filter: Alpha(opacity=0); top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); position: absolute; z-index: 2; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; -o-transition: opacity 0.3s; -ms-transition: opacity 0.3s; transition: opacity 0.3s;}
.comNavLeft > a:hover .black-bg{opacity: 1.0; filter: Alpha(opacity=100);}
.comNavLeft > a img{width: 100%; height: 100%; display: block;}
.comNavLeft > a:hover img{-webkit-animation: imgScale .3s linear alternate; -moz-animation: imgScale .3s linear alternate; -ms-animation: imgScale .3s linear alternate; -o-animation: imgScale .3s linear alternate; animation: imgScale .3s linear alternate;}
.comNavLeft > a span{padding-right: 100px; top: 50%; right: 0; width: 100%; box-sizing:border-box; position: absolute; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); text-align: right; z-index: 3;}
.comNavLeft > a span b{font-size: 35px; line-height:1; letter-spacing:-0.05em; font-weight: 500; color: #fff; display: block;}
.comNavLeft > a span em{margin: 15px 0; font-size: 16px; line-height:25px; letter-spacing:-0.05em; font-weight: 400; color: rgba(255,255,255,0.7); font-style: normal; display: block;}
.comNavLeft > a span i{font-size: 15px; line-height:18px; letter-spacing:-0.025em; font-weight: 400; color: #fff; font-style: normal; display: block;}
.comNavRight{height: 390px; width: 50%; float: right; overflow: hidden;}
.comNavRight > a{width: 960px; height: 100%; float: left; display: block;}
.comNavRight > a .black-bg{opacity: 0; filter: Alpha(opacity=0); top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); position: absolute; z-index: 2; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; -o-transition: opacity 0.3s; -ms-transition: opacity 0.3s; transition: opacity 0.3s;}
.comNavRight > a:hover .black-bg{opacity: 1.0; filter: Alpha(opacity=100);}
.comNavRight > a img{width: 100%; height: 100%; display: block;}
.comNavRight > a:hover img{-webkit-animation: imgScale .3s linear alternate; -moz-animation: imgScale .3s linear alternate; -ms-animation: imgScale .3s linear alternate; -o-animation: imgScale .3s linear alternate; animation: imgScale .3s linear alternate;}
.comNavRight > a span{padding-left: 100px; top: 50%; right: 0; width: 100%; box-sizing:border-box; position: absolute; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); text-align: left; z-index: 3;}
.comNavRight > a span b{font-size: 35px; line-height:1; letter-spacing:-0.05em; font-weight: 500; color: #fff; display: block;}
.comNavRight > a span em{margin: 15px 0; font-size: 16px; line-height:25px; letter-spacing:-0.05em; font-weight: 400; color: rgba(255,255,255,0.7); font-style: normal; display: block;}
.comNavRight > a span i{font-size: 15px; line-height:18px; letter-spacing:-0.025em; font-weight: 400; color: #fff; font-style: normal; display: block;}
/* comNav */

/* 제품안내 */
.pro-wrap{padding: 100px 0; box-sizing:border-box;}
.pro-title{margin-bottom: 55px; text-align: center;}
.pro-title p{font-size: 37px; line-height:1; letter-spacing:-0.05em; font-weight: bold; color: #222;}
.pro-title span{margin-top: 20px; font-size: 15px; line-height:19px; letter-spacing:-0.05em; font-weight: 400; color: #777; display: block;}
.pro-in{}
.proBox{width: 300px; margin-right: 33px; float: left;}
.proBox:last-of-type{margin-right: 0;}
.proBox a{display: block; position: relative; overflow: hidden; box-sizing:border-box; border: 1px solid #d0d0d0;}
.proBox a.bdb1{border-bottom: 4px solid #ff7364;}
.proBox a.bdb2{border-bottom: 4px solid #4a7395;}
.proBox a > img{height: 200px; width: 100%; display: block;}
.proBox a .proText{padding-top: 40px; height: 200px; display: block; box-sizing:border-box; text-align: center;}
.proBox a .proText b{font-size: 30px; line-height:1; letter-spacing:0; font-weight: 500; color: #222; display: block;}
.proBox a .proText span{margin: 15px 0 30px; font-size: 15px; line-height:19px; letter-spacing:-0.05em; font-weight: 300; color: #777; display: block;}
.proBox a .proText img{width: 28px; height: 28px; margin: 0 auto; transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; z-index: 3; position: relative;}
.proBox a .posBg{opacity: 0; filter: Alpha(opacity=0); position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s;}
.proBox a:hover .proText img{transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg);}
.proBox a:hover .posBg{opacity: 1.0; filter: Alpha(opacity=100);}
/* 제품안내 */

/* THE SERVICE */
.service-wrap{padding: 100px 0; background: #f2f2f2; box-sizing:border-box;}
.serviceTit{margin-bottom: 55px; text-align: center;}
.serviceTit p{font-size: 37px; line-height:1; letter-spacing:-0.05em; font-weight: bold; color: #222;}
.serviceTit span{margin-top: 20px; font-size: 15px; line-height:19px; letter-spacing:-0.05em; font-weight: 400; color: #777; display: block;}
.serviecInner{}
.serviceBox{width: 300px; margin-right: 33px; float: left; text-align: center;}
.serviceBox:last-of-type{margin-right: 0;}
.serviceBox > img{width: 139px; height: 133px; margin: 0 auto 25px;}
.serviceBox:hover > img{-webkit-animation: imgScale .3s linear alternate; -moz-animation: imgScale .3s linear alternate; -ms-animation: imgScale .3s linear alternate; -o-animation: imgScale .3s linear alternate; animation: imgScale .3s linear alternate;}
.serviceBox b{font-size: 25px; line-height:1; letter-spacing:-0.05em; font-weight: bold; color: #222; display: block;}
.serviceBox span{margin: 15px 0 25px; font-size: 15px; line-height:20px; letter-spacing:-0.05em; font-weight: 400; color: #777; display: block;}
.serviceBox a{width: 175px; font-size: 14px; line-height: 41px; letter-spacing:0.025em; font-weight: bold; text-align: center; box-sizing:border-box; box-shadow:3px 3px 6px 3px rgba(0,0,0,0.12); display: block; background: rgba(242,242,242,0.84); font-style: italic; margin: 0 auto;}
.serviceBox a.serviceBtn1{border: 1px solid #fd877b; color: #fd877b;}
.serviceBox a.serviceBtn2{border: 1px solid #6587a4; color: #6587a4;}
/* THE SERVICE */

/* info */
.info-wrap{height: 370px; background: url(../img/infobg.jpg) center center no-repeat; background-size: cover; position: relative;}
.infoTxt{top: 50%; left: 50%; margin-left: -630px; width: 1300px; text-align: center; position: absolute; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%);}
.infoTxt p{font-size: 45px; line-height:1; letter-spacing:0; font-weight: bold; color: #fff;}
.infoTxt span{margin: 15px 0 25px; font-size: 16px; line-height:25px; letter-spacing:-0.05em; font-weight: 400; color: #fff; display: block; opacity:0.7;}
.infoTxt a{width: 175px; font-size: 14px; line-height:43px; letter-spacing:-0.025em; font-weight: bold; color: #fff; display: block; position: relative; overflow: hidden; z-index: 2; background: none; font-style: italic; margin: 0 auto; box-shadow:3px 3px 6px 3px rgba(0,0,0,0.12);}
.infoTxt a:before{opacity:1; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid #fff; box-sizing:border-box; background: none; content:""; position: absolute; z-index: -2; transition: .15s; -webkit-transition: .15s; -o-transition: .15s; -moz-transition: .15s; -ms-transition: .15s; box-shadow:3px 3px 6px 3px rgba(0,0,0,0.12);}
.infoTxt a:after{top: 0; left: 0; width: 0; background: #4a7395; height: 100%; content:""; position: absolute; z-index: -1; transition: .3s; -webkit-transition: .3s; -o-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; box-shadow:3px 3px 6px 3px rgba(0,0,0,0.12);}
.infoTxt a:hover:before{opacity:0;}
.infoTxt a:hover:after{width: 100%;}
/* info */