@charset "utf-8"; /*공통*/ .title-area h1{font-size:70px; font-weight:400;} .title-area h1 strong{font-weight:800;} .title-area p{font-size:30px; font-weight:700; margin-top:30px;} .title-area p strong{font-weight:800;} @media (max-width:1024px){ .title-area h1{font-size:60px;} .title-area p{font-size:26px;} } @media (max-width:840px){ .title-area h1{font-size:50px;} .title-area p{font-size:22px;} } @media (max-width:640px){ .title-area h1{font-size:40px;} .title-area p{font-size:18px; margin-top:20px;} } @media (max-width:480px){ .title-area h1{font-size:30px;} .title-area p{font-size:16px;} } #visual-section{position:relative;overflow:hidden} #visual-section .visual-swiper{overflow:hidden;height:940px;} #visual-section .visual-swiper .swiper-slide{} #visual-section .visual-swiper .swiper-slide .vis-img{ position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; background-position:center center; background-repeat:no-repeat; background-size:cover; } #visual-section .visual-swiper .swiper-slide.visual01 .vis-img{background:url("../img/visual01.jpg?v3") no-repeat center; background-size:cover;} #visual-section .visual-swiper .swiper-slide.visual02 .vis-img{background:url("../img/visual02.jpg?v3") no-repeat center; background-size:cover;} #visual-section .visual-swiper .swiper-slide.visual03 .vis-img{background:url("../img/visual03.jpg?v3") no-repeat center; background-size:cover;} #visual-section .visual-swiper .swiper-slide.visual04 .vis-img{background:url("../img/visual04.jpg?v3") no-repeat center; background-size:cover;} #visual-section .visual-swiper .swiper-slide.visual05 .vis-img{background:url("../img/visual05.jpg?v3") no-repeat center; background-size:cover;} #visual-section .visual-swiper .swiper-slide.swiper-slide-active .vis-img { animation:vis-img 5s both; animation-fill-mode:both; } @keyframes vis-img { 0% { -webkit-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2); } 100% { -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); } } #visual-section .vis-txt{width:100%; top:50%; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); position:absolute;} #visual-section .vis-txt:after{clear:both; content:""; display:block;} #visual-section .vis-txt .vis-ibox{width:60%; margin:0 auto; color:#fff; float:right; padding:0 20px;} #visual-section .visual04 .vis-txt .vis-ibox{width:90%; margin:0 auto; color:#fff; float:none; text-align:center;} #visual-section .vis-txt .vis-ibox h1{font-size:60px; letter-spacing:-0.05em; line-height:1.4em; opacity:0;} #visual-section .vis-txt .vis-ibox h1 strong{font-weight:800;} #visual-section .vis-txt .vis-ibox h1 span{color:#7bdbff;} #visual-section .visual05 .vis-txt .vis-ibox h1 span{color:#604f36;} #visual-section .vis-txt .vis-ibox p{margin-top:40px; font-size:20px; letter-spacing:-0.05em; line-height:1.5em; opacity:0;} #visual-section .vis-txt .vis-ibox ul{margin-top:40px;} #visual-section .vis-txt .vis-ibox ul li{font-size:26px; margin:0 30px 10px 0; font-weight:500;} #visual-section .visual05 .vis-txt .vis-ibox ul li{font-size:18px; font-weight:400;} #visual-section .swiper-slide.swiper-slide-active .vis-txt .vis-ibox h1{animation:visual-txt 1s .4s both;} #visual-section .swiper-slide.swiper-slide-active .vis-txt .vis-ibox p{animation:visual-txt 1s .7s both;} #visual-section .swiper-slide.swiper-slide-active .vis-txt .vis-ibox ul{animation:visual-txt 1s .7s both;} @keyframes visual-txt { 0% {opacity:0; transform:translateY(40px);} 100% {opacity:1; transform:translateY(0);} } .main-swiper-button{display:flex;align-items:center;position:absolute;bottom:100px;left:50%;z-index:5;transform:translateX(-50%);width:1400px;} .main-swiper-button .swiper-pagination{position:initial;text-align:left;color:#fff} .main-swiper-button .swiper-pagination .swiper-pagination-bullet{display:inline-flex;align-items:center;position:relative;width:auto;margin-right:18px;background:none;opacity:.7;font-size:19px;font-weight:400} .main-swiper-button .swiper-pagination .swiper-pagination-bullet .progress-bar{display:none;position:relative;width:150px;height:2px;margin-left:23px;margin-right:6px;background-color:rgba(255,255,255,.4)} .main-swiper-button .swiper-pagination .swiper-pagination-bullet .progress-bar .progress-inner{display:block;min-width:100%;height:100%;background-color:#fff;transform:scaleX(0);transform-origin:0%;-webkit-animation-play-state:paused;animation-play-state:paused} .main-swiper-button .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{opacity:1} .main-swiper-button .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active .progress-bar{display:block} .main-swiper-button .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active .progress-bar .progress-inner{ -webkit-animation-name:progress;animation-name:progress;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:running;animation-play-state:running; -webkit-animation-duration:10s;animation-duration:10s} @-webkit-keyframes progress{100%{transform:scaleX(1)}}@keyframes progress{100%{transform:scaleX(1)}} .main-swiper-button .swiper-player-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:url(https://www.taihan.com/resources/asset/images/icon/pause.svg) 50% 50% no-repeat; display:none;} .main-swiper-button .swiper-player-button.active{background-image:url(https://www.taihan.com/resources/asset/images/icon/play.svg)} @media (max-width:1420px){ .main-swiper-button{width:1000px;} #visual-section .vis-txt .vis-ibox br{display:none;} #visual-section .vis-txt .vis-ibox h1{font-size:56px;} #visual-section .vis-txt .vis-ibox p{margin-top:40px; font-size:18px;} #visual-section .vis-txt .vis-ibox ul{margin-top:40px;} #visual-section .vis-txt .vis-ibox ul li{font-size:24px;} } @media (max-width:1140px){ #visual-section .vis-txt .vis-ibox h1{font-size:52px;} #visual-section .vis-txt .vis-ibox p{margin-top:30px;} #visual-section .vis-txt .vis-ibox ul{margin-top:30px;} #visual-section .vis-txt .vis-ibox ul li{font-size:20px;} } @media (max-width:1024px){ .main-swiper-button{bottom:60px; width:700px;} #visual-section .visual-swiper{height:880px;} #visual-section .vis-txt .vis-ibox{width:90%; margin:0 auto; color:#fff; float:none; text-align:center;} } @media (max-width:860px){ .main-swiper-button{width:500px;} #visual-section .visual-swiper{height:700px;} #visual-section .vis-txt .vis-ibox h1{font-size:46px;} #visual-section .vis-txt .vis-ibox p{margin-top:30px; font-size:16px;} #visual-section .vis-txt .vis-ibox ul{margin-top:30px;} #visual-section .vis-txt .vis-ibox ul li{font-size:18px;} } @media (max-width:740px){ .main-swiper-button{bottom:30px; width:440px;} .main-swiper-button .swiper-pagination .swiper-pagination-bullet{margin-right:15px;font-size:16px;} .main-swiper-button .swiper-pagination .swiper-pagination-bullet .progress-bar{width:100px; margin-left:18px;margin-right:4px;} #visual-section .visual-swiper{height:650px;} #visual-section .vis-txt .vis-ibox h1{font-size:40px;} #visual-section .vis-txt .vis-ibox p{margin-top:20px; font-size:16px;} #visual-section .vis-txt .vis-ibox ul{margin-top:20px;} #visual-section .vis-txt .vis-ibox ul li{font-size:18px;} } @media (max-width:640px){ .main-swiper-button{width:340px; bottom:10px;} #visual-section .visual-swiper{height:450px;} #visual-section .vis-txt .vis-ibox h1{font-size:34px; line-height:1.2em;} #visual-section .vis-txt .vis-ibox p{margin-top:20px; font-size:14px;} #visual-section .vis-txt .vis-ibox ul{margin-top:20px;} #visual-section .vis-txt .vis-ibox ul li{font-size:16px;} #visual-section .visual05 .vis-txt .vis-ibox ul li{font-size:14px;} } @media (max-width:480px){ .main-swiper-button .swiper-pagination .swiper-pagination-bullet{margin-right:10px;font-size:14px;} .main-swiper-button .swiper-pagination .swiper-pagination-bullet .progress-bar{width:60px; margin-left:12px;margin-right:0px;} .main-swiper-button{width:80%;} #visual-section .vis-txt .vis-ibox{width:95%; padding:0;} #visual-section .vis-txt .vis-ibox h1{font-size:30px; line-height:1.3em;} #visual-section .vis-txt .vis-ibox p{margin-top:20px; font-size:14px;} #visual-section .vis-txt .vis-ibox ul{margin-top:20px;} #visual-section .vis-txt .vis-ibox ul li{font-size:14px;} } #main-cont-bg{background:url("../img/main_cont_bg.jpg") no-repeat center bottom; background-size:cover;} /*비즈니스*/ #mcont1-section{padding:120px 0;} #mcont1-section .cont-area{max-width:1800px; position:relative;} #mcont1-section .swiper{width:100%; height:100%; position:relative;} #mcont1-section .swiper-slide{height:850px; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-position:center center !important; background-repeat:no-repeat !important; background-size:cover !important;} #mcont1-section .swiper-slide.busi01{background:url("../img/mcont1_busi01.jpg") no-repeat;} #mcont1-section .swiper-slide.busi02{background:url("../img/mcont1_busi02.jpg") no-repeat;} #mcont1-section .swiper-slide.busi03{background:url("../img/mcont1_busi03.jpg") no-repeat;} #mcont1-section .swiper-slide.busi04{background:url("../img/mcont1_busi04.jpg") no-repeat;} #mcont1-section .swiper-slide.busi05{background:url("../img/mcont1_busi05.jpg") no-repeat;} #mcont1-section .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover;} #mcont1-section .busi-slider {height:100%;width: 100%;} #mcont1-section .busi-txt{color:#fff; width:75%; max-width:1200px; margin:80px auto 0;} #mcont1-section .busi-txt:after{clear:both; content:""; display:block;} #mcont1-section .busi-txt h1{font-size:140px; color:#fff; opacity:.2; font-weight:900; letter-spacing:-0.05em;} #mcont1-section .busi02 .busi-txt h1{color:#08ffff; opacity:.2;} #mcont1-section .busi-txt h2{font-size:36px; font-weight:800; margin-top:30px;} #mcont1-section .busi-txt h3{font-size:72px; font-weight:800; margin:20px 0;} #mcont1-section .busi-txt h4{font-size:22px; font-weight:800; line-height:1.4em;} #mcont1-section .busi-txt h4 span{color:#ffd800;} #mcont1-section .busi-txt p{font-size:22px; font-weight:800; margin-bottom:30px;} #mcont1-section .busi-txt span.view{} #mcont1-section .busi-txt span.view a{display:inline-block; width:133px; line-height:15px; font-size:12px; color:#fff; font-weight:700; padding-bottom:10px; background:url("../img/mcont1_more_bg.png") no-repeat center;} #mcont1-section .busi-thum {width:100%; max-width:1600px; height:240px; margin-top:-120px;} #mcont1-section .thum-slider {width:100%; max-width:1200px; margin:0 auto; box-sizing: border-box; position:relative; padding-top:24px;} #mcont1-section .thum-slider .swiper-slide {width:25%; height: 100%; cursor:pointer;} #mcont1-section .thum-slider .swiper-slide.thum01{color:#fff; background:#091d4e;} #mcont1-section .thum-slider .swiper-slide.thum02{color:#fff; background:#00cdae;} #mcont1-section .thum-slider .swiper-slide.thum03{color:#fff; background:#bcb1a3;} #mcont1-section .thum-slider .swiper-slide.thum04{color:#091d4e; background:#fff;} #mcont1-section .thum-slider .swiper-slide.thum05{color:#091d4e; background:#dedede;} #mcont1-section .thum-slider .swiper-slide .box{} #mcont1-section .thum-slider .swiper-slide .box span.arrow{position:absolute; top:-24px; left:42%; display:none;} #mcont1-section .thum-slider .swiper-slide-thumb-active .box span.arrow{display:block;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt{padding:30px 40px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h2{font-size:10px; font-weight:700;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1{font-size:30px; font-weight:400; margin-top:50px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1 strong{font-weight:900;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1 strong span{font-weight:300;} #mcont1-section .busi-next, #mcont1-section .busi-prev{width:35px; height:35px; background:#fff; border:1px solid #dedede; border-radius:50px;} #mcont1-section .busi-next i, #mcont1-section .busi-prev i{text-align:center; width:100%; line-height:35px; color:#091d4e; font-size:22px;} #mcont1-section .busi-next{position:absolute;bottom:100px; z-index:10;right:280px;} #mcont1-section .busi-prev{position:absolute;bottom:100px; z-index:10;left:280px;} @media (max-width:1800px){ #mcont1-section .busi-next, #mcont1-section .busi-prev{display:none;} } @media (max-width:1420px){ #mcont1-section .swiper-slide{height:800px;} #mcont1-section .busi-txt{margin:40px auto 0;} #mcont1-section .busi-txt h1{font-size:120px;} #mcont1-section .busi-txt h2{font-size:32px;} #mcont1-section .busi-txt h3{font-size:66px;} #mcont1-section .busi-txt h4{font-size:22px; font-weight:800; line-height:1.4em;} #mcont1-section .busi-txt p{font-size:22px; font-weight:800; margin-bottom:30px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1{font-size:26px; margin-top:30px;} } @media (max-width:1024px){ #mcont1-section{padding:100px 0;} #mcont1-section .swiper-slide{height:700px;} #mcont1-section .busi-txt{width:90%; margin:30px auto 0;} #mcont1-section .busi-txt h1{font-size:90px;} #mcont1-section .busi-txt h2{font-size:28px; margin-top:20px;} #mcont1-section .busi-txt h3{font-size:60px;} #mcont1-section .busi-txt h4{font-size:20px;} #mcont1-section .busi-txt p{font-size:20px; margin-bottom:20px;} #mcont1-section .busi-thum {height:200px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt{padding:30px 20px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1{font-size:24px; margin-top:20px;} } @media (max-width:740px){ #mcont1-section{padding:80px 0;} #mcont1-section .swiper-slide{height:600px;} #mcont1-section .busi-txt h1{font-size:70px;} #mcont1-section .busi-txt h2{font-size:24px; margin-top:20px;} #mcont1-section .busi-txt h3{font-size:52px;} #mcont1-section .busi-txt h4{font-size:18px;} #mcont1-section .busi-txt p{font-size:18px; margin-bottom:20px;} #mcont1-section .busi-thum {height:200px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt{padding:20px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1{font-size:20px; margin-top:20px;} #mcont1-section .thum-slider .swiper-slide .arrow img{height:20px; margin-top:5px; padding:0;} } @media (max-width:640px){ #mcont1-section{padding:70px 0;} #mcont1-section .swiper-slide{height:460px;} #mcont1-section .busi-txt h1{font-size:50px;} #mcont1-section .busi-txt h2{font-size:20px; margin-top:20px;} #mcont1-section .busi-txt h3{font-size:44px;} #mcont1-section .busi-txt h4{font-size:16px;} #mcont1-section .busi-txt p{font-size:16px; margin-bottom:20px;} #mcont1-section .busi-txt h4 br, #mcont1-section .busi-txt p br{display:none;} #mcont1-section .busi-thum {height:140px;margin-top:-50px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h2{display:none;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt h1{font-size:16px; margin-top:0;} #mcont1-section .thum-slider .swiper-slide .arrow img{height:14px; margin-top:10px; padding:0;} } @media (max-width:480px){ #mcont1-section{padding:50px 0;} #mcont1-section .swiper-slide{height:400px;} #mcont1-section .busi-txt h1{font-size:40px;} #mcont1-section .busi-txt h2{font-size:18px; margin-top:10px;} #mcont1-section .busi-txt h3{font-size:36px;} #mcont1-section .busi-txt h4{font-size:14px;} #mcont1-section .busi-txt p{font-size:14px; margin-bottom:20px;} #mcont1-section .busi-thum {height:140px;margin-top:-30px;} #mcont1-section .thum-slider .swiper-slide .busi-thum-txt{padding:20px 10px;} #mcont1-section .thum-slider .swiper-slide .arrow img{height:14px; margin-top:12px; padding:0;} } #mcont2-section{padding:90px 0;} #mcont2-section .cont-area{max-width:1400px;} #mcont2-section .cont-area:after{clear:both; display:block; content:"";} #mcont2-section .cont-area .tit-area{width:35.833%; max-width:430px; float:left; border-right:1px solid #dfdfdf;} #mcont2-section .cont-area .tit-area h1{text-align:center;} #mcont2-section .cont-area .tit-area h1 img{max-width:100%;} #mcont2-section .cont-area .count-area{width:64.166%; max-width:770px; float:right;} #mcont2-section .cont-area .count-area ul{} #mcont2-section .cont-area .count-area ul:after{clear:both; display:block; content:"";} #mcont2-section .cont-area .count-area ul li{float:left; text-align:center; color:#091d4e;} #mcont2-section .cont-area .count-area ul li:first-child{width:45%;} #mcont2-section .cont-area .count-area ul li:nth-child(2){width:34%;} #mcont2-section .cont-area .count-area ul li:last-child{width:21%;} #mcont2-section .cont-area .count-area ul li h1{font-family:'Montserrat'; letter-spacing:-0.05em;} #mcont2-section .cont-area .count-area ul li h1 em{font-size:100px; line-height:1em; font-weight:800;} #mcont2-section .cont-area .count-area ul li h1 span{font-size:48px; vertical-align:top; font-weight:800;} #mcont2-section .cont-area .count-area ul li p{font-size:20px; font-weight:900; letter-spacing:-0.05em;} #mcont2-section p.slogan{font-size:52px; color:#091d4e; text-align:center; margin-top:50px; line-height:1.4em;} #mcont2-section p.slogan strong{font-weight:900;} @media screen and (max-width:1420px){ #mcont2-section{padding:80px 0;} #mcont2-section .cont-area .tit-area{width:100%; max-width:100%; border-right:0; float:none;} #mcont2-section .cont-area .count-area{width:100%; max-width:100%; float:none; margin-top:40px;} #mcont2-section .cont-area .count-area ul li:first-child{width:35%;} #mcont2-section .cont-area .count-area ul li:nth-child(2){width:35%;} #mcont2-section .cont-area .count-area ul li:last-child{width:30%;} #mcont2-section .cont-area .count-area ul li h1 em{font-size:80px;} #mcont2-section .cont-area .count-area ul li h1 span{font-size:36px;} #mcont2-section .cont-area .count-area ul li p{font-size:20px;} #mcont2-section p.slogan{font-size:46px; margin-top:50px;} } @media screen and (max-width:1240px){ #mcont2-section{padding:70px 0;} #mcont2-section .cont-area .tit-area h1 img{width:280px;} #mcont2-section .cont-area .count-area ul li h1 em{font-size:70px;} #mcont2-section .cont-area .count-area ul li h1 span{font-size:34px;} #mcont2-section .cont-area .count-area ul li p{font-size:18px;} #mcont2-section p.slogan{font-size:40px; margin-top:30px;} } @media screen and (max-width:980px){ #mcont2-section{padding:50px 0;} #mcont2-section .cont-area .tit-area h1 img{width:200px;} #mcont2-section .cont-area .count-area ul li h1 em{font-size:60px;} #mcont2-section .cont-area .count-area ul li h1 span{font-size:30px;} #mcont2-section .cont-area .count-area ul li p{font-size:18px;} #mcont2-section p.slogan{font-size:34px; margin-top:30px;} } @media screen and (max-width:780px){ #mcont2-section{padding:40px 0;} #mcont2-section .cont-area .count-area ul li h1 em{font-size:50px;} #mcont2-section .cont-area .count-area ul li h1 span{font-size:24px;} #mcont2-section .cont-area .count-area ul li p{font-size:16px;} #mcont2-section p.slogan{font-size:28px; margin-top:30px;} } @media screen and (max-width:480px){ #mcont2-section{padding:30px 0;} #mcont2-section .cont-area .tit-area h1 img{width:150px;} #mcont2-section .cont-area .count-area ul li{padding:0 10px;} #mcont2-section .cont-area .count-area ul li h1 em{font-size:40px;} #mcont2-section .cont-area .count-area ul li h1 span{font-size:20px;} #mcont2-section .cont-area .count-area ul li p{font-size:14px; margin-bottom:10px; font-weight:700;} #mcont2-section p.slogan{font-size:20px; margin-top:20px;} } /* AI SMART FREE PASS */ #mcont3-section{width:100%;position:relative;z-index:60; position:relative; padding:100px 0 180px; position:relative;} #mcont3-section .banner-area{position:relative;height:730px} #mcont3-section .banner-area .cont-area{position:relative;z-index:10;height:100%;color:#fff;} #mcont3-section .banner-area::before{content:'';position:absolute;top:0;left:0;width:100%;max-width:1380px;height:100%;background:url('../img/mcont3_bg.jpg?v2') no-repeat center center; background-size:cover;} #mcont3-section .banner-area .tit-area{display:-ms-flexbox;display:flex;-ms-flex-align:flex-start;align-items:flex-start;-ms-flex-direction:column;flex-direction:column;position:relative;z-index:10;padding-top:7.65625vw} #mcont3-section .banner-area .tit-area h2{font-size:18px; font-weight:700;} #mcont3-section .banner-area .tit-area h1{font-size:42px; font-family:'Montserrat';} #mcont3-section .banner-area .tit-area p{font-size:20px; line-height:1.4em;} #mcont3-section .banner-area .tit-area a{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-top:3.1875rem;letter-spacing:-1px;font-size:20px; color:#04285b;} #mcont3-section .banner-area .tit-area a i{background:#fff; border-radius:50px; width:40px; line-height:40px; text-align:center;} #mcont3-section .box-section{position:absolute;bottom:10rem; right:0; z-index:10; width:75%;} #mcont3-section .box-area{overflow:visible; width:100%;} #mcont3-section .box-area:after{clear:both; display:block; content:"";} #mcont3-section .box-area .txt{float:left;width:33.333%;background:#fff; height:30rem;padding:4rem; display:flex;-ms-flex-align:flex-start;align-items:flex-start;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column;} #mcont3-section dl{color:#313033} #mcont3-section dl dt{font-size:30px;line-height:1.5em;} #mcont3-section dl dd{margin-top:20px;font-size:16px;color:inherit} #mcont3-section .box-area .box:first-child .txt{background-color:#04285b} #mcont3-section .box-area .box span{font-weight:800;} #mcont3-section .box-area .box:first-child span{color:#fff;} #mcont3-section .box-area .box:first-child dl, #mcont3-section .box-area .box:nth-child(3) dl{color:#fff;} #mcont3-section .box-area .box:nth-child(3) .txt{background-color:#313033} #mcont3-section .box-area .box:nth-child(3) span{color:#fff} #mcont3-section .box-area .txt{position:relative;} #mcont3-section .box-area .txt .xi-arrow-right{background:#04285b; color:#fff; border-radius:50px; width:40px; line-height:40px; text-align:center; opacity:0;position:absolute;top:2rem;right:2rem;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transition:all .4s} #mcont3-section .box-area .box:first-child .xi-arrow-right{background:#fff; color:#04285b;} #mcont3-section .box-area .box:nth-child(3) .xi-arrow-right{background:#fff; color:#313033;} #mcont3-section .box-area .txt:hover .xi-arrow-right{opacity:1} @media screen and (max-width:1240px){ #mcont3-section{padding:80px 0 150px;} #mcont3-section .banner-area{height:550px} #mcont3-section .banner-area .tit-area h2{font-size:16px;} #mcont3-section .banner-area .tit-area h1{font-size:36px;} #mcont3-section .banner-area .tit-area p{font-size:18px;} #mcont3-section .box-section{width:90%;} #mcont3-section .box-area .txt{height:26rem;padding:3rem;} #mcont3-section dl dt{font-size:28px;} } @media screen and (max-width:840px){ #mcont3-section{padding:50px 0 100px;} #mcont3-section .banner-area{height:480px} #mcont3-section .banner-area .tit-area p{font-size:16px;} #mcont3-section .banner-area .tit-area p br{display:none;} #mcont3-section .box-section{bottom:2rem; width:95%;} #mcont3-section .box-area .txt{height:22rem;padding:2rem;} #mcont3-section dl dt{font-size:24px;} #mcont3-section dl dd{font-size:14px ;} } @media screen and (max-width:640px){ #mcont3-section{padding:40px 0 50px;} #mcont3-section .banner-area{height:auto; padding:0 0 30px 0;} #mcont3-section .banner-area .tit-area h1{font-size:30px;} #mcont3-section .banner-area .tit-area p{font-size:14px;} #mcont3-section .banner-area .tit-area a{margin-top:1rem;font-size:15px;} #mcont3-section .banner-area .tit-area a i{background:#fff; border-radius:50px; width:30px; line-height:30px; text-align:center;} #mcont3-section .box-section{position:relative;bottom:0; right:0; z-index:10; width:100%;} #mcont3-section .box-area .txt{float:none; width:100%; height:auto;padding:2rem 2rem 0 2rem;} #mcont3-section .box-area .box span{font-size:12px; margin-bottom:10px;} #mcont3-section dl dt{font-size:20px;} #mcont3-section dl dd{margin-top:15px;} #mcont3-section dl dd br{display:none;} } @media screen and (max-width:480px){ #mcont3-section .box-area .box span{font-size:10px;} #mcont3-section dl dt{font-size:18px;} } #mcont4-section{width:100%; padding:100px 0; background:#f8f8f8;overflow:hidden;} #mcont4-section .cont-area{max-width:1400px;position:relative;} #mcont4-section .notice-area{} #mcont4-section .notice-area:after{clear:both; display:block; content:"";} #mcont4-section .notice-area .notice-tit{position:relative; float:left; width:20.833%; max-width:250px; height:300px;} #mcont4-section .notice-area .notice-tit span a{font-size:16px; font-weight:800; color:#000; border-bottom:1px solid #000; display:inline-block; margin-top:40px;} #mcont4-section .notice-area .notice-control{bottom:0; left:0; z-index:9999; position:absolute;} #mcont4-section .notice-area .notice-control:after{clear:both; display:block; content:"";} #mcont4-section .notice-area .notice-next, #mcont4-section .notice-area .notice-prev{width:50px; height:50px; z-index:99; line-height:50px; text-align:center; color:#555; border:1px solid #aeaeae; border-radius:50px; background-color:#fff; cursor:pointer; float:left; display:inline-block;} #mcont4-section .notice-area .notice-prev{margin-left:10px;} #mcont4-section .notice-area .notice-page{margin-right:10px; font-size:20px; line-height:50px; float:left; display:none;} #mcont4-section .notice-area .swiper-pagination-current{} #mcont4-section .notice-area .notice-slider{position:absolute;left:50%;width:100%;right:0;top:0;z-index:1;margin-left:-300px; height:420px;} #mcont4-section .notice-area .box{background:#fff;height:300px; text-align:left; padding:50px; border:1px solid #dedede;} #mcont4-section .notice-area .box .cate{width:100px; line-height:30px; font-weight:500; font-size:14px; text-align:center; background:#fff; margin:0 auto;} #mcont4-section .notice-area .box .txt-area{} #mcont4-section .notice-area .box .ct{font-size:18px; font-weight:900; color:#0152c6;} #mcont4-section .notice-area .box .date{font-size:13px; line-height:100%; color:#7c7c7c; margin-top:10px;} #mcont4-section .notice-area .box .subj{width:100%; margin-top:30px; font-weight:800; font-size:23px; line-height:100%; color:#050505; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; line-height:1.4em;height:2.8em;} #mcont4-section .notice-area .box .cont{margin-top:30px; font-size:16px; color:#050505; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:1; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word;} @media screen and (max-width:1240px){ #mcont4-section{padding:80px 0;} #mcont4-section .cont-area{min-height:420px;} #mcont4-section .notice-area .notice-tit{width:100%; max-width:100%; height:auto;} #mcont4-section .notice-area .notice-tit span{display:none;} #mcont4-section .notice-area .notice-control{bottom:auto; left:auto;top:20px; right:0;} #mcont4-section .notice-area .notice-slider{left:0; padding-left:100px;top:150px;margin-left:0; height:auto;} } @media screen and (max-width:1024px){ #mcont4-section{padding:80px 0;} #mcont4-section .cont-area{min-height:420px;} #mcont4-section .notice-area .notice-slider{left:0; padding-left:60px;top:140px;margin-left:0; height:auto;} #mcont4-section .notice-area .box{height:260px; padding:40px;} #mcont4-section .notice-area .box .ct{font-size:16px;} #mcont4-section .notice-area .box .subj{font-size:20px;} } @media screen and (max-width:840px){ #mcont4-section{padding:60px 0;} #mcont4-section .cont-area{min-height:380px;} #mcont4-section .notice-area .notice-slider{padding-left:40px;} #mcont4-section .notice-area .box{height:230px; padding:30px;} #mcont4-section .notice-area .box .ct{font-size:14px;} #mcont4-section .notice-area .box .subj{font-size:18px;} #mcont4-section .notice-area .box .cont{margin-top:20px; font-size:15px;} } @media screen and (max-width:640px){ #mcont4-section{padding:50px 0;} #mcont4-section .notice-area .notice-slider{padding-left:20px; top:120px;} #mcont4-section .cont-area{min-height:350px;} #mcont4-section .notice-area .notice-next, #mcont4-section .notice-area .notice-prev{width:40px; height:40px; z-index:99; line-height:40px; text-align:center; color:#555; border:1px solid #aeaeae; border-radius:50px; background-color:#fff; cursor:pointer; float:left; display:inline-block;} } @media screen and (max-width:480px){ #mcont4-section{padding:40px 0;} #mcont4-section .notice-area .notice-slider{top:100px;} #mcont4-section .cont-area{min-height:300px;} #mcont4-section .notice-area .box{height:180px; padding:20px;} #mcont4-section .notice-area .box .ct{font-size:13px;} #mcont4-section .notice-area .box .subj{font-size:16px;-webkit-line-clamp: 1; /* 라인수 */ height:1.4em;} #mcont4-section .notice-area .box .cont{margin-top:10px; font-size:14px;} } /*무인관제시스템 설치현황*/ #mcont5-section{background:#000; background-size:cover; padding:100px 0 150px; max-width:100%; display:none;} #mcont5-section .tit-area{color:#fff;} #mcont5-section .tit-area h1{letter-spacing:-0.05em; font-weight:400;} #mcont5-section .tit-area h1 b{font-weight:900;} #mcont5-section .more a{font-size:20px; color:#fff; display:inline-block; padding:10px 7px; border-bottom:1px solid #fff; margin:60px 0;} #mcont5-section .more a i{padding-left:50px; vertical-align:middle;} #mcont5-section .install-tab{} #mcont5-section .install-tab:after{clear:both; display:block; content:"";} #mcont5-section .install-tab li{display:inline; padding-right:20px; margin-right:20px; position:relative;} #mcont5-section .install-tab li:after{width:5px; height:5px; top:5px; right:0px; background:#fff; border-radius:50px; content:""; display:block; position:absolute;} #mcont5-section .install-tab li:last-child:after{width:0; height:0; top:5px; right:0px; background:#fff; border-radius:50px; content:""; display:block; position:absolute;} #mcont5-section .install-tab li a{font-size:24px;color:#CCCCCC; position:relative; padding-bottom:5px;} #mcont5-section .install-tab li.active a{font-weight:700;color:#fff; border-bottom:1px solid #fff;} #mcont5-section .install-slide{position:relative; margin-top:50px;} #mcont5-section .install-slide .box{width:100%; background:#fff; -border:10px solid #9dc4ff; border-radius:20px;} #mcont5-section .install-slide .box a{width:100%; display:inline-block; padding:30px;} #mcont5-section .install-slide .img{width:150px; height:150px; background-repeat:no-repeat; background-position:center center; background-size:cover; border-radius:100%; border:1px solid #dedede; margin:0 auto;} #mcont5-section .install-slide .name{font-size:28px; color:#363636; font-weight:800; text-align:center; margin-top:20px;} #mcont5-section .cont-area .install-control{top:-70px; right:0; z-index:9999; position:absolute;} #mcont5-section .cont-area .install-control:after{clear:both; display:block; content:"";} #mcont5-section .cont-area .next, #mcont5-section .cont-area .prev{width:50px; height:50px; z-index:99; line-height:50px; text-align:center; color:#fff; border:1px solid #fff; border-radius:50px; cursor:pointer; display:inline-block; float:left;} #mcont5-section .cont-area .prev{margin-left:10px;} #mcont5-section .cont-area .next{margin-left:10px;} #mcont5-section .cont-area .swiper-pagination{width:auto; bottom:auto; left:auto; margin-right:10px; font-size:24px; line-height:50px; font-weight:600; color:rgba(255,255,255,.8); display:inline-block; position:relative; float:left;} #mcont5-section .cont-area .swiper-pagination-current{color:rgba(255,255,255,1);} @media (max-width:1420px){ #mcont5-section{padding:90px 0 140px; height:auto;} #mcont5-section .cont-area .install-control{bottom:50px; right:20px;} } @media (max-width:1024px){ #mcont5-section{padding:100px 0 120px;} #mcont5-section .cont-area{padding:0 60px;} #mcont5-section .cont-area .install-next, #mcont5-section .cont-area .install-prev{width:40px; height:40px; line-height:40px;} #mcont5-section .cont-area .install-page{font-size:20px; line-height:40px;} #mcont5-section .install-slide .img{width:130px; height:130px;} #mcont5-section .install-slide .name{font-size:26px;} } @media (max-width:840px){ #mcont5-section{padding:80px 0 100px;} #mcont5-section .cont-area{padding:0 40px;} #mcont5-section .more a{font-size:18px;margin:30px 0;} #mcont5-section .install-tab li a{font-size:18px;} #mcont5-section .cont-area .install-control{bottom:30px;} #mcont5-section .cont-area .next, #mcont5-section .cont-area .prev{width:40px; height:40px; line-height:40px;} #mcont5-section .cont-area .swiper-pagination{font-size:20px; line-height:40px;} #mcont5-section .install-slide .img{width:110px; height:110px;} #mcont5-section .install-slide .name{font-size:24px;} } @media (max-width:640px){ #mcont5-section{padding:60px 0 70px;} #mcont5-section .cont-area{padding:0 20px;} #mcont5-section .more a{font-size:16px;margin:20px 0 30px;} #mcont5-section .install-tab li a{font-size:16px;} #mcont5-section .install-slide {padding:0 0; overflow:hidden;} #mcont5-section .cont-area .install-control{display:none;} #mcont5-section .cont-area .install-next, #mcont5-section .cont-area .install-prev{width:34px; height:34px; line-height:34px;} #mcont5-section .cont-area .install-page{font-size:18px; line-height:34px;} #mcont5-section .cont-area .install-control{bottom:20px;} #mcont5-section .install-slide .img{width:90px; height:90px;} #mcont5-section .install-slide .name{font-size:22px;} } @media (max-width:480px){ #mcont5-section{padding:50px 0 50px;} #mcont5-section .more a{font-size:14px;margin:10px 0 30px;} #mcont5-section .install-tab li a{font-size:14px;} #mcont5-section .install-slide{margin-top:20px; width:100%;} #mcont5-section .install-slide .box a{padding:10px;} #mcont5-section .cont-area .install-next, #mcont5-section .cont-area .install-prev{width:30px; height:30px; line-height:30px;} #mcont5-section .cont-area .install-prev{margin-left:5px;} #mcont5-section .cont-area .install-page{font-size:15px; line-height:30px;} #mcont5-section .cont-area .install-control{bottom:20px;} #mcont5-section .install-slide .name{font-size:18px;} } #mcont6-section{background:url("../img/mcont6_bg.jpg") no-repeat center; background-size:cover; padding:150px 0;} #mcont6-section .tit-area h1{text-align:center; font-size:46px; color:#fff;} #mcont6-section .box-area ul{width:100%; margin-top:80px;} #mcont6-section .box-area ul:after{clear:both; display:block; content:"";} #mcont6-section .box-area ul li{width:33.333%; float:left; text-align:center; border-right:1px solid rgba(255,255,255,.5); padding:0 0 20px 0;} #mcont6-section .box-area ul li:last-child{border:0;} #mcont6-section .box-area ul li a div.tit{display:inline-block;padding:20px; position:relative;} #mcont6-section .box-area ul li h1{font-size:30px; font-weight:700; color:#fff;} #mcont6-section .box-area ul li p{font-size:20px; color:#fff; line-height:1.4em; margin-top:20px;} #mcont6-section .box-area ul li div.tit .line{margin:auto; z-index:20; position:absolute; -webkit-transition:all .5s ease-out; -moz-transition:all .5s ease-out; -o-transition:all .5s ease-out; transition:all .5s ease-out; opacity:0;} #mcont6-section .box-area ul li a:hover div.tit .line{opacity:1;} #mcont6-section .box-area ul li a div.tit .line-t{width:0; height:100%; top:0; right:100%; bottom:0; left:0; border-top:3px solid #fff;} #mcont6-section .box-area ul li a div.tit .line-r{width:100%; height:0; top:0; right:0; bottom:100%; left:0; border-right:3px solid #fff;} #mcont6-section .box-area ul li a div.tit .line-b{width:0; height:100%; top:0; right:0; bottom:0; left:100%; border-bottom:3px solid #fff;} #mcont6-section .box-area ul li a div.tit .line-l{width:100%; height:0; top:100%; right:0; bottom:0; left:0; border-left:3px solid #fff;} #mcont6-section .box-area ul li a:hover div.tit .line-t{width:100%; right:0;} #mcont6-section .box-area ul li a:hover div.tit .line-r{height:100%; bottom:0;} #mcont6-section .box-area ul li a:hover div.tit .line-b{width:100%; left:0;} #mcont6-section .box-area ul li a:hover div.tit .line-l{height:100%; top:0;} @media (max-width:1420px){ #mcont6-section{padding:120px 0;} #mcont6-section .tit-area h1{font-size:42px;} #mcont6-section .tit-area h1 br{display:none;} } @media (max-width:1024px){ #mcont6-section{padding:100px 0;} #mcont6-section .tit-area h1{font-size:38px;} #mcont6-section .box-area ul li h1{font-size:26px;} #mcont6-section .box-area ul li p{font-size:18px;} } @media (max-width:840px){ #mcont6-section{padding:80px 0;} #mcont6-section .tit-area h1{font-size:32px;} #mcont6-section .box-area ul li h1{font-size:24px;} #mcont6-section .box-area ul li p{font-size:17px;} } @media (max-width:640px){ #mcont6-section{padding:60px 0;} #mcont6-section .tit-area h1{font-size:28px;} #mcont6-section .box-area ul li a div.tit{padding:10px 20px;} #mcont6-section .box-area ul{margin-top:0;} #mcont6-section .box-area ul li{width:100%; float:none; border-bottom:1px solid rgba(255,255,255,.5); border-right:none; padding:30px 0;} #mcont6-section .box-area ul li h1{font-size:22px;} #mcont6-section .box-area ul li p{font-size:16px; border-top:0;} #mcont6-section .box-area ul li p br{display:none;} } @media (max-width:480px){ #mcont6-section{padding:40px 0;} #mcont6-section .tit-area h1{font-size:22px;} #mcont6-section .box-area ul li h1{font-size:20px;} #mcont6-section .box-area ul li p{font-size:14px;} }