/* BASIC css start */
#fullpage { position:relative; }
#wrap {width:100%; height:100%;}

/* »ó´Ü ·Î°í, ÅؽºÆ®, ÇÏ´Ü ¹öÆ° */
.story-logo {position:fixed;top: 30px;left: 50px;z-index:2;}
.story-tit {position:fixed;right: 50px;top: 50px;color:#fff;font-size:18px;z-index:99;font-family: 'Montserrat', sans-serif;}
.go-mall{position:fixed;right: 50px;bottom: 42px;color:#fff;font-size:18px;z-index:99;}
.go-mall a {display: inline-block;border: 1px solid #fff;color: #fff;padding: 10px 30px;border-radius: 33px;font-size: 13px;}

/* ¿ìÃø ³×ºñ°ÔÀÌ¼Ç */
#menu{position:fixed; top:38%; right:80px; z-index: 1;}
#menu li{display: block; width: 25px; height: 1px; margin: 25px 0; position: relative;}
#menu li a{  display: block; position: relative; z-index: 1; width: 100%; height: 100%; cursor: pointer;  position: absolute; z-index: 1; height: 100%; width: 100%; border: 0; background: #fff; left: 50%; top: 50%;-webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;}
#menu li a span{   font-size:0;  }
#menu li.active a span, #menu li a:hover span{   font-size:0;   color: #fff; position: absolute; left: -55px; top: -7px; font-size: 11px;}
#menu li.active  a{font-size:12px; color:#fff;}
#menu li.active  a, #menu li a:hover{width:43px; background:#fff;left:-3px;}

/* Ç®ÆäÀÌÁö °øÅë */
.section .section_cont {display:table-cell; vertical-align:middle; opacity:0; transition:all 1s 0s; -webkit-transform: translate3d(0,50%,0); -moz-transform: translate3d(0,50%,0); transform: translate3d(0,50%,0);}
.section.active .section_cont {-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);transform: translate3d(0,0,0);opacity: 1;transition-delay: .3s !important;}

/* Ç®ÆäÀÌÁö */
#section0 .section_cont{text-align: center;    color: #fff;    position: absolute;    right: 30%;    -webkit-transform: translate3d(30%,50%,0);    -moz-transform: translate3d(30%,50%,0);    transform: translate3d(30%,50%,0);}
#section0.active .section_cont {text-align: center;color: #fff;position: absolute;right: 30%;top: 50%;-webkit-transform: translate3d(30%,-50%,0);-moz-transform: translate3d(30%,-50%,0);transform: translate3d(30%,-50%,0);}
#section0 .section_cont .logo {margin-bottom: 45px;}
#section0 .section_cont .tit p {font-size: 47.95px;margin-bottom: 36px;font-family: 'Noto Sans KR', sans-serif;font-weight: 600;}
#section0 .section_cont .tit span {font-size: 28px;font-family: 'Noto Sans KR', sans-serif;}

#section1 .section_cont{text-align: left;display: table;width: 76%;margin: 0 auto;} 
#section1 .section_cont .left_cont{display: table-cell;padding-right: 115px;}
#section1 .section_cont .right_cont{display: table-cell;}
#section1 .section_cont .tit{color:#fff;}
#section1 .section_cont .tit h1 {font-size: 47.95px;color: #fff;margin-bottom: 58px;font-family: 'Noto Sans KR', sans-serif;font-weight: 600;}
#section1 .section_cont .tit p {font-size: 20.98px;margin-bottom: 15px;font-family: 'Noto Sans KR', sans-serif;line-height: 1.5;text-align: left;}
#section1 .section_cont .tit p.ect1 {font-size: 65px;color: transparent;-webkit-text-stroke: 1px white;font-weight: bold;font-family: 'Montserrat', sans-serif;line-height: 1;margin-top: 60px;}
.go-home{position:fixed;right: 50px;bottom: 88px;color:#fff;font-size:18px;z-index:99;}
.go-home a {display: inline-block;border: 1px solid #fff;color: #fff;padding: 10px 30px;border-radius: 33px;font-size: 13px;}


#section2 .section_cont {
    text-align: center;
    display: block;
}
#section2 .section_cont .tit{margin-bottom: 60px;}

#section2 .section_cont .tit p {
    font-size: 48px;
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    margin-bottom: 15px;
}

#section2 .section_cont .tit span {
    font-size: 21px;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif;
}
#section2 .section_cont .history_wrap {
    width: 80%;
    margin: 0 auto;
    white-space: nowrap;
    /* overflow-x: auto; */
    /* overflow-y: hidden; */
    -webkit-overflow-scrolling: touch;
}
#section2 .section_cont .history_wrap .swiper-slide{
    opacity: 0;
}
#section2 .section_cont .history_wrap .swiper-slide-active {
    opacity: 1;
}
#section2 .section_cont .history_wrap::-webkit-scrollbar {
    width: 10px;
  }
#section2 .section_cont .history_wrap::-webkit-scrollbar-thumb {
    background-color: #fff;
    border-radius: 10px;
    background-clip: padding-box;
    border: 3px solid transparent;
  }
#section2 .section_cont .history_wrap::-webkit-scrollbar-track {
    background-color: #999999;
    border-radius: 10px;
    box-shadow: inset 0px 0px 5px white;
  }
#section2 .section_cont .history_wrap .history_line {
    margin-bottom: 40px;
    font-size: 0;
}
#section2 .section_cont .history_wrap .top:after{
    content: "";
    display: block;
    width: 1282px;
    border-bottom: 2px solid #fff;
    margin: 40px auto;
}
#section2 .section_cont .history_wrap .history_line:after{content:''; display:block; clear:both;}
#section2 .section_cont .history_wrap .top li::before{
    content: '';
    position: absolute;
    border: 1px solid #fff;
    height: 31px;
    bottom: -33px;
    left: 50%;
    transform: translateX(-50%);
}
#section2 .section_cont .history_wrap .top li::after {
    content: '';
    position: absolute;
    width: 17px;
    height: 17px;
    left: 50%;
    transform: translateX(-50%);
    background: #3f4757;
    border: 3px solid #fff;
    z-index: 2;
    border-radius: 50%;
    bottom: -49px;
    box-sizing: border-box;
}
#section2 .section_cont .history_wrap .bottom{padding-left: 114px;}
#section2 .section_cont .history_wrap .bottom:before{/* content: ""; *//* display: block; *//* width: 100%; *//* border-bottom: 2px solid #fff; *//* margin: 40px auto; */}
#section2 .section_cont .history_wrap .bottom li::before{content: '';position: absolute;border: 1px solid #fff;height: 31px;top: -33px;left: 50%;transform: translateX(-50%);}
#section2 .section_cont .history_wrap .bottom li::after {
    content: '';
    position: absolute;
    width: 17px;
    height: 17px;
    left: 50%;
    transform: translateX(-50%);
    background: #3f4757;
    border: 3px solid #fff;
    z-index: 2;
    border-radius: 50%;
    top: -50px;
    box-sizing: border-box;
}
#section2 .section_cont .history_wrap ul {clear: both;}
#section2 .section_cont .history_wrap ul:after{content:''; clear:both; display:block;}
#section2 .section_cont .history_wrap ul li {
    display: inline-block;
    margin: 0 13px;
    position: relative;
    cursor: pointer;
}
#section2 .section_cont .history_wrap ul img{width:230px; height: 200px;}
#section2 .section_cont .history_wrap ul li .history_cont {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,0.9);
}


#section2 .section_cont .history_wrap ul li .history_cont b {
    font-size: 22.13px;
    color: #1f355e;
    font-family: 'Montserrat', sans-serif;
    padding: 39px 0 25px;
    display: block;
}

#section2 .section_cont .history_wrap ul li .history_cont p {
    font-size: 20px;
    color: #000;
    font-family: 'Noto Sans KR', sans-serif;
    white-space: normal;
}
#section2 .section_cont .history_wrap .swiper-pagination-progressbar {
    bottom: 0;
    top: auto;
    left: 50%;
    transform: translateX(-50%);
    width: 160px;
    height: 2px;
    background: #999999;
}

#section2 .section_cont .history_wrap .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: #fff;
}


#section3 .section_cont{display:table;width:100%;height: 100%;table-layout:fixed;overflow: hidden;-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
#section3 .section_cont .brand_cont{display:table-cell;/* position: relative; */    background-size: cover !important;}
#section3 .section_cont .brand_cont .brand_pointer{cursor:pointer;}
#section3 .section_cont .brand_cont.brand01 .brand_pointer {
    width: 33.333%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
}
#section3 .section_cont .brand_cont.brand02 .brand_pointer {
    width: 33.333%;
    position: absolute;
    top: 0;
    left: 33.333%;
    bottom: 0;
}
#section3 .section_cont .brand_cont.brand03 .brand_pointer {
    width: 33.333%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
/*
#section3 .section_cont .brand_cont{
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);
    -webkit-transition:all .3s linear;
    -moz-transition:all .3s linear;
    -ms-transition:all .3s linear;
    -o-transition:all .3s linear;
    transition:all .3s linear;
}
#section3 .section_cont .brand_cont:hover{
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);   
    -o-transform:scale(1.2);
    transform:scale(1.2);
    z-index:98;
    cursor:pointer;
}*/
#section3 .section_cont .brand_cont .view{display:none;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index:99;background: #fff;}
#section3 .section_cont .brand_cont .view .img_wrap {float: left;height: 100%;}
#section3 .section_cont .brand_cont .view .img_wrap img{width: auto;height: 100%;}
#section3 .section_cont .brand_cont .view .go-brand{position:fixed;right: 213px;bottom: 45px;}
#section3 .section_cont .brand_cont .view .go-brand a{font-size:18px;z-index:100;display: inline-block;border: 1px solid #18355e;color: #18355e;padding: 10px 30px;border-radius: 33px;font-family: 'Noto Sans KR', sans-serif;}
#section3 .section_cont .brand_cont .view .go-back{position:fixed;right:78px;bottom: 45px;font-size:18px;z-index:100;display: inline-block;border: 1px solid #000;color: #000;padding: 10px 30px;border-radius: 33px;cursor: pointer;}
#section3 .section_cont .brand_cont .view .txt_wrap {float: left;vertical-align: middle;color: #000;padding-left: 122px;}
#section3 .section_cont .brand_cont .view .txt_wrap .txt_cont{position: absolute;top: 50%;transform: translateY(-50%);}
#section3 .section_cont .brand_cont .view .txt_wrap .logo {margin-bottom: 57px;}
#section3 .section_cont .brand_cont .view .txt_wrap .tit p {font-size: 20px;}
#section3 .section_cont .brand_cont .view .txt_wrap .tit span {font-size: 20px;font-family: 'Noto Sans KR', sans-serif;line-height: 1.5;text-align: left;font-weight: normal;}

#section4 .video_wrap{position:relative;width: 69%;margin: 0 auto;}
#section4 .video_wrap .video_bg{position: relative; width: 100%; padding-bottom: 49.25%;}
#section4 .video_wrap .video_bg iframe { position: absolute; width: 100%; height: 100%; }
#section4 h1{position:absolute;left: 298px;top: 70px;font-size:48px;font-weight:bold;color:#fff;}
#section4 .video_wrap .go-youtube{position:fixed;right: 50px;bottom: 92px;}
#section4 .video_wrap .go-youtube a{font-size: 13px;z-index:100;display: inline-block;border: 1px solid #ffffff;color: #fff;background: #c00;padding: 10px 30px;border-radius: 33px;font-family: 'Noto Sans KR', sans-serif;}

/* BASIC css end */