@charset "utf-8";
.main #fp-nav.fp-right{right:50px}
.main #fp-nav ul li{height:auto;position:relative}
.main #fp-nav ul li+li{margin-top:20px}
.main #fp-nav ul li a span+span{display:none}
.main #fp-nav ul li a span{display:block;position:relative;width:12px;height:12px;font-size:0;background:#fff;opacity:.4}
.main #fp-nav ul li a.active span{height:44px;margin:-2px 0 0 -2px;border-radius:6px;background:#fff;opacity:1}
.main #fp-nav ul li:hover a span{width:12px;height:12px;margin:-2px 0 0 -2px}
.main #fp-nav ul li:hover a.active span{height:44px;margin:-2px 0 0 -2px;border-radius:6px}
.main .fp-controlArrow{border:0;width:60px;height:60px}
.main .fp-controlArrow.fp-prev{left:150px;width:60px;background:url(/assets/img/contents/ho/btn_prev.png) no-repeat;background-size:60px auto}
.main .fp-controlArrow.fp-next{right:150px;width:60px;background:url(/assets/img/contents/ho/btn_next.png) no-repeat;background-size:60px auto}
.main .fp-slidesNav.fp-bottom{bottom:140px}
.main .fp-slidesNav ul{text-align:center}
.main .fp-slidesNav ul li{width:auto;height:auto;position:relative;margin:0}
.main .fp-slidesNav ul li+li{margin-left:10px}
.main .fp-slidesNav ul li a span+span{display:none}
.main .fp-slidesNav ul li a span{display:block;position:relative;width:6px;height:6px;margin:0;left:0;top:0;font-size:0;background:#fff;opacity:.4}
.main .fp-slidesNav ul li a.active span{width:44px;height:6px;margin:0;border-radius:6px;background:#fff;opacity:1}
.main .fp-slidesNav ul li:hover a span{width:6px;height:6px;margin:0}
.main .fp-slidesNav ul li:hover a.active span{width:44px;height:6px;margin:0;border-radius:6px}
.ho001{position:relative;display:table;width:100%;height:calc(100%);background:url(/assets/img/contents/ho/home_bg_01_po.jpg) no-repeat 0 0;background-size:cover;line-height:1}
.ho001:after{position:absolute;bottom:0;left:0;right:0;height:20%;opacity:1;background-image:linear-gradient(to top,#000,rgba(0,0,0,0) 75%);content:""}
.ho001 .align_box{display:table;width:100%;height:100%}
.ho001 .slogan{display:table-row;height:60%}
.ho001 .slogan .inner{display:table-cell;padding-top:80px;text-align:center;vertical-align:middle;opacity:0;transition:opacity .5s linear}
.ho001 .slogan .tit{position:relative;display:inline-block;text-align:center;font-size:50px;font-weight:700;color:#fff;letter-spacing:-.25px}
.ho001 .slogan .tit span{display:block;padding-bottom:20px;font-size:18px;font-weight:500}
.ho001 .slogan .tit:after{position:absolute;top:10px;right:-45px;display:block;width:54px;height:28px;text-align:center;line-height:27px;border-radius:4px;font-size:16px;font-weight:600;background:#fb4949;content:"NEW"}
.ho001 .slogan .tit:before{position:absolute;top:12px;right:-25px;border-top:17px solid transparent;border-right:17px solid transparent;border-bottom:17px solid transparent;border-left:17px solid #fb4949;content:""}
.ho001 .slogan .txt{display:block;padding-top:20px;text-align:center;font-size:20px;color:#fff;letter-spacing:-.2px;line-height:1.5}
.ho001 .slogan .btn_box{padding-top:30px;text-align:center}
.ho001 .slogan .btn_box .btn{height:50px;line-height:48px;display:inline-block;font-size:18px}
.ho001 .slogan .btn_box .btn span{font-size:18px}
.ho001 .ani_img{display:table-row;height:40%;position:relative}
.ho001 .ani_img .box{position:relative;overflow:hidden;margin:0 auto;max-width:1580px;width:55%}
.ho001 .ani_img .box:before{position:absolute;top:6%;left:2px;right:2px;bottom:0;background:#000;content:""}
.ho001 .ani_img .frame_bg{z-index:1;position:relative}
.ho001 .ani_img .frame_bg img{display:block;width:100%}
.ho001 .ani_img .frame_img{position:absolute;top:0;left:0;right:0;bottom:0}
.ho001 .ani_img .frame_img span{position:absolute;top:0;left:0;width:100%}
.ho001 .ani_img .frame_img span img{display:block;width:100%}
.ho001 .ani_img .frame_img span.img01{animation-delay:.2s}
.ho001 .ani_img .frame_img span.img02{animation-delay:.4s}
.ho001 .ani_img .frame_img span.img03{animation-delay:.6s}
.ho001 .ani_img .frame_img span.img04{animation-delay:.8s}
.fp-viewing-0 .ho001 .slogan .inner{opacity:1}
.ho002{position:relative;height:100%;background:url(/assets/img/contents/ho/home_bg_02_store.jpg) no-repeat 0 0;background-size:cover}
.ho002 .slogan{display:table;width:100%;height:100%}
.ho002 .slogan .inner{display:table-cell;vertical-align:middle;padding:0 0 0 16%}
.ho002 .slogan .tit{display:block;font-size:50px;color:#fff;letter-spacing:-.25px}
.ho002 .slogan .txt{display:block;padding-top:20px;font-size:24px;color:#fff;letter-spacing:-.2px;line-height:1.5}
.ho002 .slogan .btn_box{padding-top:30px;text-align:left}
.ho002 .slogan .btn_box .btn{height:50px;line-height:50px;display:inline-block}
.ho002 .slogan .btn_box .btn span{font-size:18px}
.ho002 .slogan .btn_box .btn.download{display:none}
html:lang(ko) .ho002 .slogan .btn_box .btn.download{display:inline-block}
.ho002.slide_img{background:0 0}
.ho002.slide_img .slide{background-size:cover}
.ho002.slide_img .slide.slide01{background-image:url(/assets/img/contents/ho/home_bg_03_solution01.jpg)}
.ho002.slide_img .slide.slide02{background-image:url(/assets/img/contents/ho/home_bg_03_solution02.jpg)}
.ho002.slide_img .slide.slide03{background-image:url(/assets/img/contents/ho/home_bg_03_solution03.jpg)}
.ho002.slide_img .slide.slide04{background-image:url(/assets/img/contents/ho/home_bg_03_solution04.jpg)}
.ho002.slide_img .slide.slide05{background-image:url(/assets/img/contents/ho/home_bg_03_solution05.jpg)}
.ho002.slide_img .slide.slide06{background-image:url(/assets/img/contents/ho/home_bg_03_solution06.jpg)}
.ho003{position:relative;text-align:center;height:calc(100%);background:url(/assets/img/contents/ho/home_bg_01_po.jpg) no-repeat 0 0;background-size:cover}
.ho003 .movie_frame{margin:0 auto;position:relative}
.ho003 .slide .box{position:relative;margin:0 auto;max-width:890px;text-align:center}
.ho003 .slide .box a{display:block}
.ho003 .slide .box .blank{position:relative;display:inline-block}
.ho003 .slide .box .blank img{width:100%;background:#000}
.ho003 .slide .box iframe{border:0;position:absolute;top:0;left:0;width:100%;height:100%}
.ho003 .slide .tit{position:absolute;top:-100px;left:0;right:0;padding:0 40px;display:block;text-align:center;font-size:34px;color:#fff}
.ho003 .slide .descript{position:absolute;left:0;right:0;bottom:-50px;text-align:center;font-size:24px;color:#fff}
.scroll_txt{z-index:20;position:fixed;bottom:30px;left:50%;margin-left:-40px;padding-top:44px;width:80px;text-align:center;font-size:12px;color:#fff;opacity:.6;background:url(/assets/img/contents/ho/mouse_scroll_down.png) no-repeat 50% 0;background-size:20px auto}
.scroll_txt.up{padding-top:40px;background:url(/assets/img/contents/ho/mouse_scroll_up.png) no-repeat 50% 0;background-size:32px auto;cursor:pointer}

.inter_sign {padding:50px 50px 65px 50px;text-align:center;background:#193565}
.inter_sign .tit {display:block;text-align:center;font-size:34px;font-weight:700;color:#fff;}
.inter_sign .list {text-align:center;padding-top:25px;}
.inter_sign .list li {display:inline-block;width:470px;vertical-align:top;}
.inter_sign .list li + li {margin-left:50px;}
.inter_sign .list li .img {display:block;text-align:center;}
.inter_sign .list li .img img {display:inline-block;height:110px;}
.inter_sign .list li .corp {display:block;padding:8px 0 18px 0;font-size:18px;color:#fff;font-weight:400}
.inter_sign .list li .descript {font-size:16px;color:#d1d6e0;font-weight:300}


@media screen and (max-width:1366px){
    .ho001 .slogan .inner{padding-top:50px}
    .main .fp-controlArrow.fp-prev{left:80px}
    .main .fp-controlArrow.fp-next{right:80px}
    .ho003 .slide .box .blank img{max-width:600px}
    .main #fp-nav.fp-right{top:18%;right:10px}
    .main #fp-nav.fp-right{top:18%}
    .main #fp-nav ul li+li{margin-top:10px}
    .main #fp-nav ul li a span{width:6px;height:6px}
    .main #fp-nav ul li a.active span{width:6px;height:34px}
    .main #fp-nav ul li:hover a.active span{width:6px;height:34px}
    .main #fp-nav ul li:hover a span{width:6px;height:6px}
}
@media screen and (max-width:1280px){
    .ho001 .ani_img .box{position:absolute;bottom:0;left:320px;right:320px;width:calc(100% - 640px)}
}

@media screen and (max-width:1100px){
    .inter_sign .list li {display:block;width:auto;}
    .inter_sign .list li + li {margin:50px 0 0 0}
}

@media screen and (max-width:1024px){
    .scroll_txt{display:none}
    .ho001 .slogan{height:45%}
    .ho001 .slogan .inner{text-align:left}
    .ho001 .slogan .tit{text-align:left;font-size:28px}
    .ho001 .slogan .tit:before{top:8px}
    .ho001 .slogan .tit:after{top:6px}
    .ho001 .slogan .txt{text-align:left;font-size:15px}
    .ho001 .slogan .inner{padding:80px 40px 0 40px;vertical-align:top}
    .ho001 .ani_img{height:55%}
    .ho001 .ani_img .box{position:absolute;bottom:0;left:40px;right:0;width:600px}
    .ho002{background-size:auto 100%;background-position:50% 0}
    .ho002 .slogan{height:100%}
    .ho002 .slogan .inner{padding:80px 50px 0 50px;vertical-align:top}
    .ho002 .slogan .tit{font-size:22px}
    .ho002 .slogan .txt{font-size:15px}
    .ho002 .fp-tableCell{vertical-align:top}
    .ho003 .slide .tit{font-size:22px}
    .ho003 .slide .descript{font-size:15px}
    .ho003 .fp-controlArrow{display:none}
    .ho001 .slogan .btn_box,.ho002 .slogan .btn_box{padding-top:20px;text-align:left}
    .ho001 .slogan .btn_box .btn,.ho002 .slogan .btn_box .btn{display:block;height:40px;line-height:40px}
    html:lang(ko) .ho002 .slogan .btn_box .btn.download{display:block}
    .ho001 .slogan .btn_box .btn span,.ho002 .slogan .btn_box .btn span{font-size:14px}
    .ho001 .slogan .btn_box .btn+.btn,.ho002 .slogan .btn_box .btn+.btn{margin:10px 0 0 0}
    .main .fp-controlArrow.fp-prev{left:10px;margin-top:-16px;width:32px;height:32px;background-size:32px auto}
    .main .fp-controlArrow.fp-next{right:10px;margin-top:-16px;width:32px;height:32px;background-size:32px auto}
    .main .fp-slidesNav.fp-bottom{bottom:20px}
    .scroll_txt{display:none!important}
}
@media screen and (max-width:640px){
    #brosure.layer_pop .inner{top:0!important;right:0;bottom:0;left:0!important;width:auto!important;margin:0!important;border-radius:0}
    .layer_pop h1{font-size:16px}
    .layer_pop .inner .contents{height:calc(100% - 24px)}


    .inter_sign {padding:80px 10px 50px 10px}
    .inter_sign .tit {font-size:20px;}
    .inter_sign .list li + li {margin:20px 0 0 0}
    .inter_sign .list li .corp {font-size:16px;}
    .inter_sign .list li .descript  {font-size:14px;}
}