.fp-responsive .fullpage-wrapper,
.fp-responsive .fp-section:not(.section--visual),
.fp-responsive .fp-tableCell,
.fp-responsive .fp-scrollable{
    height: auto !important;
}
@media (max-width:1200px){
    .section{
        padding-top: 0 !important;
    }
}
@media (max-width:1024px){
    .fp-scroller{
        height: 100%;
    }
}
@media (max-width:768px){
}
@media (max-width:576px){
}

/* Navigation */
.nav-container{
    z-index: 10; position: fixed; top: 50%; left: 0;
    -webkit-transition: all ease .15s; transition: all ease .15s;
}
.nav-wrapper{
    z-index: 100; position: absolute; top: 50%; left: 90px;
    -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.nav-container ul { margin: 0; padding: 0; animation: slideFade-rightIn 1s ease-out forwards; }
.nav-container li a{
    display: flex; align-items: flex-end; position: relative; margin: 36px 0; padding: 0 0 0 28px;
    line-height: 1; font-family: 'Montserrat'; font-size: 1.4rem; color: rgba(255,255,255,.6);
    -webkit-transition: all ease .15s; transition: all ease .15s;
    text-transform: uppercase;
}
.nav-container li i{
    display: block; position: absolute; top: 0; left: 0;
    width: 17px; height: 15px;
}
.nav-container li i::after{
    content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    margin: auto; width: 7px; height: 7px; background: #ffffff; border-radius: 50%;
    -webkit-transition: all ease .15s; transition: all ease .15s;
    opacity: .2;
}
.nav-container li svg{
    display: block; width: inherit; height: inherit; opacity: 0;
    -webkit-transition: all ease .15s; transition: all ease .15s;
}
.nav-container li.active a { color: rgba(255,255,255,1); }
.nav-container li.active i::after { opacity: 1; }
.nav-container li.active svg { opacity: 1; }

.nav-container[data-nav="off"]{
    left: -3%;
    opacity: 1;
    pointer-events: none;
}
.nav-container[data-nav-theme="dark"] li a{
    color:rgba(34,34,34,.6);
}
.nav-container[data-nav-theme="dark"] li.active a {color:#333;}
.nav-container[data-nav-theme="dark"] li i::after{
    background: #222222;
}
@media(max-width:1200px){
  .nav-container {display:none;}
}
@media(max-width:768px){
    .nav-container { animation: slideFade-leftOut 1s ease-out forwards; opacity: 0 !important; visibility: hidden; }
}

/* scroll-down */
.scroll-down{
    z-index: 10; /*position: fixed;*/ position:absolute; /*bottom: 5%;*/ bottom:0; right: 1.9%;
    -webkit-transition: all ease .3s; transition: all ease .3s; /*width:2px;*/ height:110px;
}
.scroll-down .text{
    display: block; line-height: 1;
    font-family: 'Montserrat'; font-size: 1.2rem; color: #ffffff; font-weight: 300;
    -webkit-transform-origin: top left; transform-origin: top left;
    -webkit-transform: rotate(90deg) translate(-90px, -10px); transform: rotate(90deg) translate(-90px, -10px);
    position:absolute; top:0px; left:-40px; white-space:nowrap;
}
.scroll-down .arrow{
    display: block; width: 10px; height: 9px;
    background: url('/child/img/icon/scroll-down-arrow.png') no-repeat;
    animation: scroll-down 1.8s ease infinite; position: absolute; left:-40px;
}
@keyframes scroll-down {
    0% { opacity: 0; transform: translateY(-10px); }
    10%, 50% { opacity: 1; }
    100% { opacity: 0; transform: translateY(20px); }
}
.scroll-down[data-scroll-down="off"]{
    opacity: 0;
    pointer-events: none;
}
@media(max-width:1200px){

}
@media(max-width:768px){
    .scroll-down {display: none;}
}

.player{z-index: -1 !important;}

/* Common */
.section__inner { height: 100%; }
.section .title { margin:0 0 50px; text-align: center; line-height: 1; font-size: 4.6rem; font-weight: 800; }
.section-block { overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
.section-block__row:first-child { flex: 1 1; display: flex;}

.main-section{
    padding:140px 0;
}
@media(min-width:1201px){
    .section { height: 100vh; }
}
@media(max-width:1200px){
  .section .title { font-size: 4rem; margin-bottom: 40px; }
  .section__inner {
      padding:60px 0;
  }

  .main-section{
      padding:80px 0;
  }
}
@media(max-height:770px){
    .section__inner{
        padding-top: 105px;  /*추가 210629*/ padding-bottom:105px;
    }
}
@media(max-width:768px){
    .section--product { background: #fff; }
    .section .title { font-size: 3rem; margin-bottom: 40px; }
    .section__inner {padding:80px 0px;}

    .main-section{
        padding:60px 0;
    }
}

.swiper-container .prev, .swiper-container .next,
.product-slide .prev, .product-slide .next{
    position: relative;
    display: block;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border:1px solid #d6d6d6;
    background-color: #fff;
}
.swiper-container .prev::before, .swiper-container .next::before,
.product-slide .prev::before, .product-slide .next::before{
    content:'';
    position:absolute;
    top:50%;
    left:50%;
    transform-origin: center;
    display: block;
    width: 12px;
    height: 12px;
    border-top:2px solid #777;
    border-right:2px solid #777;
}
.swiper-container .prev::before,
.product-slide .prev::before{
    transform: translate(calc(-50% + 4px),-50%) rotate(225deg);
}
.swiper-container .next::before,
.product-slide .next::before{
    transform: translate(calc(-50% - 4px),-50%) rotate(45deg);
}

.video-bg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color:rgba(0,0,0,1);}
.video-bg video, .video-bg__video{ opacity: .3; }
.video-bg__video{
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    background-color: black;
    background-position: center center;
    background-size: contain;
    object-fit: cover;
    z-index: 3;
}

/* Intro */
.intro__inner {
    display: flex;
    justify-content: center;
    align-items: center;
}
.txt-box {position:absolute; z-index:1000; max-width:1230px; width:100%; padding:0 15px; margin:0 auto; min-height:530px; display: flex; flex-direction:column; justify-content: space-between;}
.txt-box h1 {color:#fff;font-size:5.6rem; font-weight:700; line-height:1.4;  text-shadow: 2px 2px 8px rgba(0,0,0,.4); }

.sub-tit--box {text-align: right;}
.sub-tit--box p {color:#fff; font-size:2.6rem; font-weight: 300; line-height:1.2; text-shadow: 2px 2px 8px rgba(0,0,0,.4);}
.sub-tit--box em {font-style: normal; font-weight: 700; color:#f47421;}
.sub-tit--box span {position: relative; color:#f47421; display: inline-block; font-size:1.8rem; font-weight:400; margin:8px 0px 30px; text-shadow: 2px 2px 8px rgba(0,0,0,.4);}
.sub-tit--box span::before{
    content:'';
    position:absolute;
    top:50%;
    right: calc(100% + 10px);
    -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);
    display: block;
    width: 150px;
    height: 1px;
    background-color: rgba(244,116,33,.8);
}
.sub-tit--box button {color:#fff; font-size:2.6rem; font-weight:700; display: flex; align-items: center; float:right; text-shadow: 2px 2px 8px rgba(0,0,0,.4);}
.sub-tit--box a {display: block; line-height:1;}
.sub-tit--box .more-btn{
    position: relative;
    padding-right: 20px;
}
.sub-tit--box .more-btn::after {
    content:'';
    position:absolute;
    top:50%;
    right:0;
    transform: translate(0,calc(-50% + 2px)) rotate(45deg);
    display: block;
    width: 10px;
    height: 10px;
    border-top:2px solid #fff;
    border-right:2px solid #fff;
}

.full-scroll {position: absolute; z-index:1000; bottom:40px;}
.full-scroll span {color:rgba(255,255,255,.6); font-size:1.4rem; margin-bottom:6px; display: block;}
.scroll-ani {width:22px; height:30px; background-color:transparent; border:2px solid rgba(255,255,255,.6); border-radius:50px; padding:5px 0px; position: relative; margin:0 auto;}
.scroll-ani::before {content:''; display: block; width:2px; height:6px; background-color:rgba(255,255,255,.6); position: absolute; left:50%; transform: translateX(-50%); top:5px; animation-name: moveing; animation-duration: 1.5s; animation-iteration-count: infinite; animation-timing-function:ease;}
@keyframes moveing {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        transform: translateY(8px)
    }
}

.card-items{
    display: flex;
    flex-wrap: wrap;
    margin:-12px;
}
.card-item{
    width: 33.3333%;
    padding:12px;
    text-shadow: 0 0 5px #fff;
}
.card-item__inner{
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 200px;
    padding:40px 40px 30px;
    border-radius: 10px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
    box-shadow: 0 0 20px rgba(0,0,0,.15);
}
.card-item__tit, .card-item__txt, .card-item__btn{
    width: 100%;
    line-height: 1.2;
}
.card-item__tit{
    font-weight: 600;
    color:#111;
}
.card-item__txt{
    color: #858585;
}
.card-item__btn{
    font-weight: 500;
    color: #444;
    margin-top: auto;
}
.card-item__btn span{
    display: inline-block;
    position: relative;
    padding-right: 16px;
}
.card-item__btn span::before{
    content:'';
    position:absolute;
    top:50%;
    right:0;
    transform: translate(0,-50%) rotate(45deg);
    display: block;
    width: 8px;
    height: 8px;
    border-top:1px solid #444;
    border-right:1px solid #444;
}
@media (max-width:1024px){
    .txt-box h1{
        font-size: 3.6rem;
    }
    .sub-tit--box p, .sub-tit--box button{
        font-size: 2rem;
    }
    .sub-tit--box span{
        font-size: 1.6rem;
    }

    .full-scroll{
        bottom:20px;
    }

    .card-items{
        margin:-5px;
    }
    .card-item{
        padding:5px;
    }
    .card-item__inner{
        min-height: 160px;
        padding:30px;
    }
}
@media (max-width:992px){
}
@media (max-width:768px){
    .txt-box{
        min-height: auto;
        margin-bottom: 60px;
    }
    .txt-box h1{
        font-size: 3rem;
        margin-bottom: 30px;
    }
    .sub-tit--box p, .sub-tit--box button{
        font-size: 1.8rem;
    }
    .sub-tit--box span{
        font-size: 1.4rem;
    }

    .card-item{
        flex: 1 1 auto;
        width: 50%;
    }
}
@media (max-width:576px){
    .card-item{
        width:100%;
    }
    .card-item__inner{
        padding:20px;
        min-height: auto;
    }
    .card-item__btn{
        margin-top: 30px;
    }
}

/* product */
.product-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35px;
}
.product-slide__control{
    display: flex;
    align-items: center;
    margin: auto auto auto 30px;
}
.product-slide .next{
    margin-left:8px;
}
.product-slide__inner{
    display: block;
    width: 100%;
    height: 285px;
    padding: 20px;
    border: 3px solid #f6f6f6;
    border-radius: 20px;
    background-color: #f6f6f6;
    -webkit-transition: all ease-out .2s; -ms-transition: all ease-out .2s; transition: all ease-out .2s;
}
.product-slide__img{
    display: block;
    width: 100%;
    height: 176px;
    background-repeat: no-repeat;
    background-position:center;
    background-size: contain;
}

.new-title{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media (min-width:1025px){
    .product-slide__inner:hover{
        border-color:#ff8435;
    }
}
@media (max-width:1024px){
}
@media (max-width:992px){
}
@media (max-width:768px){
    .product-slide__inner{
        height: auto;
        border-radius: 10px;
    }
    .product-head{
        flex-wrap: wrap;
        margin-bottom: 20px;
    }
    .product-slide__control{
        order: 3;
        margin: 10px 0 0;
    }
}
@media (max-width:576px){
}

/* MALL */
.main-section--mall{
    background-color: #040404;
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
    background-image:url(/child/img/main/mall-bg.png);
}

/* BANNER */
.banner-card{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 300px;
    color:#fff;
    text-shadow: 0 0 10px #c44d00;
    padding:40px 70px;
    background-color: #f47421;
    border-radius: 20px;
}

.main-board-head{
    display: flex;
    flex-wrap: wrap;
}
.main-board-head h2{
    width: 100%;
}
.main-board-item__tit{
    font-size: 2.2rem;
    font-weight: 600;
    color: #111;
    margin-bottom: 15px;
    max-height: 2.4em;
    line-height: 1.2;
    overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.main-board-item__con{
    padding-top: 15px;
    border-top: 1px solid #d6d6d6;
}
.main-board-item__txt{
    font-size: 1.6rem;
    color: #777;
    max-height: 4.2em;
    line-height: 1.4;
    overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
}
.main-board-item__date{
    font-size: 1.4rem;
    color: #777;
    margin-top: 15px;
}
@media (max-width:1024px){
    .main-board-item__tit{
        font-size: 1.8rem;
        margin-bottom: 10px;
    }
    .main-board-item__con{
        padding-top: 10px;
    }
    .main-board-item__txt{
        font-size: 1.4rem;
    }
    .main-board-item__date{
        font-size: 1.2rem;
        margin-top: 10px;
    }
}
@media (max-width:992px){
}
@media (max-width:768px){
    .banner-card{
        min-height: auto;
        justify-content:flex-start;
        padding:30px;
        border-radius: 10px;
    }

    .main-board-head{
        align-items: center;
        justify-content: space-between;
    }
    .main-board-head h2{
        width: auto;
    }
    .main-board-item{
        padding:2px 0;
    }
    .main-board-item__con{
        padding-top: 5px;
    }
    .main-board-item__tit{
        font-size: 1.4rem;
        margin-bottom: 5px;
        max-height: 1.2em;
        -webkit-line-clamp: 1;
    }
    .main-board-item__txt{
        font-size: 1.3rem;
        max-height: 2.8em;
        -webkit-line-clamp: 2;
    }
    .main-board-item__date{
        margin-top: 5px;
    }
}
@media (max-width:576px){
    .banner-card{
        padding:20px;
    }
}

/* TV */
.main-section--tv{
    color:#fff;
    background-color: #000;
}
.main-tv-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}
#vue-app .main-section--tv .row{
    margin: -22px -12px;
}
#vue-app .main-section--tv .row [class*="col-"]{
    padding:22px 12px;
}
.main-gallery-item__img{
    position: relative;
    width:100%;
    padding-top: calc(344/588 * 100%);
    border-radius: 20px;
    -webkit-transition: all ease-out .2s; -ms-transition: all ease-out .2s; transition: all ease-out .2s;
    background-color: #333;
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
}
.main-gallery-item__con{
    margin-top: 15px;
}
.main-gallery-item__tit{
    font-size: 2.2rem;
    font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.main-gallery-item__date{
    font-size: 1.6rem;
    color: #707070;
    margin-top: 5px;
}
@media (min-width:1025px){
    .main-gallery-item:hover .main-gallery-item__img::before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        z-index: 1;
        display: block;
        width: 100%;
        height: 100%;
        border: 4px solid #f47421;
        border-radius: 20px;
    }
}
@media (max-width:1024px){
    #vue-app .main-section--tv .row{
        margin:-15px -8px;
    }
    #vue-app .main-section--tv .row [class*="col-"]{
        padding:15px 8px;
    }
    .main-gallery-item__con{
        margin-top: 10px;
    }
    .main-gallery-item__tit{
        font-size: 1.8rem;
    }
}
@media (max-width:992px){
}
@media (max-width:768px){
    .main-tv-head{
        margin-bottom: 20px;
    }
    #vue-app .main-section--tv .row{
        margin:-8px -5px;
    }
    #vue-app .main-section--tv .row [class*="col-"]{
        padding:8px 5px;
    }
    .main-gallery-item__img{
        border-radius: 10px;
    }
    .main-gallery-item__con{
        margin-top: 5px;
    }
    .main-gallery-item__tit{
        font-size: 1.6rem;
    }
    .main-gallery-item__date{
        font-size: 1.4rem;
    }
}
@media (max-width:576px){
}

/* LINK */
.main-section--link{
    padding:70px 0 100px;
    background-color: #0b3a5d;
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
    background-image:url(/child/img/main/link-bg.png);
}
.link-item{
    display: flex;
    align-items: center;
}
.link-item__icon{
    display:block;
    width: 55px;
    height: 35px;
    background-repeat: no-repeat;
    background-position:left center;
}
.link-item__tit{
    position: relative;
    display: inline-block;
    font-size: 2.6rem;
    font-weight: 600;
    color:#fff;
    padding-right: 24px;
}
.link-item__tit::before{
    content:'';
    position:absolute;
    top:50%;
    right:0;
    transform: translate(0,-50%) rotate(45deg);
    display: block;
    width: 8px;
    height: 8px;
    border-top:2px solid #fff;
    border-right:2px solid #fff;
}
@media (max-width:1024px){
    .main-section--link{
        padding: 60px 0;
    }
    .link-item__tit{
        font-size: 2rem;
    }
}
@media (max-width:992px){
}
@media (max-width:768px){
    .main-section--link{
        padding: 40px 0;
    }
    #vue-app .link-row{
        margin: -10px;
    }
    #vue-app .link-row [class*="col-"]{
        padding:10px;
    }
    .link-item__tit{
        font-size: 1.6rem;
    }
}
@media (max-width:576px){
}