@charset "utf-8";
#contents{padding: 0;overflow: hidden;}

section{position:relative;padding:10% 0;z-index:1;}
section:before,section:nth-child(even):before{content :'';width:100%;display:table;clear:both;}

section h2,section h3{display:block;position:relative;text-align:left; /* font-family:'NanumSquare'; */ font-family: 'Noto Sans Korean'; font-weight:800;}
section h2{font-size:240%;margin-bottom:2.5vh;}
section h2 em{font-size:60%;font-weight:600;display:block;}
section h3 {font-size:220%;margin-bottom:2vh;}

section img{max-width:100%;}
section .more{font-family:'Raleway';letter-spacing:0.04em;bottom:2px;position:absolute;font-weight:600;font-size:95%;border-bottom:1px solid;padding-bottom:5px; display: inline-block;}
section .more:after{content:'';background:url(../img/sprite.png) no-repeat -224px -163px;background-size:250px auto;width:12px;height:12px;margin-left:20px;display:inline-block;}
section .more.s02{color:#fff;}
section .more.s02:after{background-position:-224px -208px;}

section .left{float:left;margin-right:5%;}
section .right{float:right;margin-left:5%;}
section .left + div,section .right + div{overflow:hidden;word-wrap:break-word;word-break:keep-all; }
section .left+div:after,
section .right:before,section .left:before,section .right + div:after{ content: ''; clear: both; display: block;}

section .Photo{position:relative; text-align: ;}
/*section .Photo:before{ content:'';position:absolute;left:0;right:0;bottom:0;top:0;background:rgba(0,0,0,0.15);}*/
section .txt{font-size:125%;line-height:1.5;}
  
#sec01{padding:0;}
#sec01 .owl-carousel:after{content:'';background:#fff;position:absolute;left:50%;right:0;bottom:0;height:72px;z-index:10;}
#sec01 .owl-nav,#sec01 .owl-page{position:absolute;bottom:15px;z-index:11;}
#sec01 .owl-nav{left:calc(50% + 105px);}
#sec01 .owl-nav button{width:40px;height:40px;background-image:url(../img/sprite.png);background-repeat:no-repeat;}
#sec01 .owl-nav button span{font-size:0;}
#sec01 .owl-prev{left:0;background-position:-120px -175px;}
#sec01 .owl-next{right:0;background-position:-117px -258px;}
#sec01 .owl-page{left:50%;line-height:40px;text-indent:30px;letter-spacing:0.1em;color:#aaa;}
#sec01 .owl-page strong{color:#222;}
#sec01 .owl-item{max-width:100%;height: 100%}
#sec01 .owl-item .item {position: relative; height: 100%}
#sec01 .item:before{content:'';position:absolute;left:0;right:0;bottom:0;top:0;background:rgba(0,0,0,0.5);z-index:10;display:block;}
#sec01 .active img{animation-name:scaleIn;animation-duration:3.2s;}

/* #sec01 .text{position:absolute;top:0;left:0;z-index:11;display:table;height:100%; width:100%; transform:translate(0,0);text-align:left;}*/
/* #sec01 .text div{display:table-cell;vertical-align:middle;color:#fff;text-shadow:0px 1px 5px rgba(0,0,0,0.3);font-size:140%;padding-left:20px;} */
#sec01 .text{position:absolute;top:50%;left:0;z-index:11;display:block;height:fit-content; width:100%; transform:translateY(-50%);text-align:left;}
#sec01 .text div{color:#fff;text-shadow:0px 1px 5px rgba(0,0,0,0.3);font-size:140%;padding-left:20px;}
#sec01 .text strong,#sec01 .text p{transform:translateY(50px);opacity:0;transition-timing-function: ease;}
#sec01 .text strong{font-family:'NanumSquare';font-size:300%;font-weight:800;transition: 1.1s ease-out;transition-delay: 1.2s; display:block}
#sec01 .text p{margin-top:5%;transition: 1.5s ease-out;transition-delay: 1.5s;}
#sec01 .active .text strong,#sec01 .active .text p {transform:translateY(0px);opacity:1;}

#sec02 h2{font-size:330%;margin-bottom:3%;}
#sec02 h2 span{color:#fff;display:inline-block;}
#sec02 h2 p{white-space:nowrap;display:inline-block;}
#sec02 fieldset{margin-top:6.5%; overflow: hidden;}
#sec02 fieldset:nth-of-type(1){margin-top: 0;}
#sec02 .more{position: relative; margin-top: 10%;}
#sec02 .left {width:40%;}
#sec02 .Photo:last-child{float:right;margin-top:-15%;}

#sec03{background:url(../img/main/s03.png) no-repeat 0 100% #242527;padding:10% 0;color:#fff;background-size:auto 100%; margin-top: 5%;max-height:450px;}
#sec03 .left{margin-top:-20%;width:30%;}

#sec04 .right + div{padding-bottom:8%;}
#sec04 .right{width:55%;}
#sec04 .ytframe{position:relative;width:100%;height:0;padding-bottom:56.25% !important;}
#sec04 .ytframe > iframe{position:absolute;left:0;top:0;width:100% !important;height:100% !important;}

#sec05{background:#f5f5f5; margin-bottom:-7vw;}
#sec05 ul{display:grid;grid-template-columns:repeat(3, 1fr);gap:0 3%;}
#sec05 ul:after{content:'';clear:both;}
#sec05 ul li{flex:auto;overflow:hidden;position:relative; background-color: #0066cc;}
#sec05 ul li img{width: 100%; height: auto;text-align:left;}
#sec05 ul li a{color:#fff;position:absolute;left:0;right:0;top:0;bottom:0;font-size:130%;padding:20px;overflow:hidden;}
#sec05 ul li p{margin-top: 78%;}
#sec05 ul li em{font-weight:100;padding:0 2px;}
#sec05 ul li:before{content:'';position:absolute;left:0;right:0;top:0;bottom:0;; background: rgba(0,0,0,0.35);}
#sec05 ul li a:before{content:'';background-image:url(../img/main/cs.png);background-repeat:no-repeat;background-size: 100% auto;;position:absolute;width:100px;height:100px;left:50%;top:35%;transform:translateX(-50%);}
#sec05 ul li:nth-child(1) a:before{background-position:50% 0;}
#sec05 ul li:nth-child(2) a:before{background-position:50% 50%;}
#sec05 ul li:nth-child(3) a:before{background-position:50% 100%;}
#sec05 .more{font-weight:600;font-size:65%;white-space: nowrap;left:20px; bottom:20px}

#quick{top:15vw}

@media screen and (max-width:1600px){
    
}

@media screen and (max-width:1440px){
}

@media screen and (max-width:1280px){
    #sec01 .text div{font-size:135%;}
    #sec01 .text strong{font-size:240%;}
    #sec02 h2{font-size:280%}

    #sec02 .Photo:last-of-type{width:40%;}

    #sec05 ul li a:before{width:70px;height:70px;top:30%}
}
@media screen and (max-width:992px){
    section h2 em{font-family:normal;}
    section .txt{font-size:110%;}

    #sec02 h2{font-size:250%}

    section h2{font-size:200%}
    section h3{font-size:180%}
    
    #sec01 .owl-carousel:after{content: none;}
    
    #sec01 .owl-page,#sec01 .owl-nav{bottom:10px; height: 30px;}
    #sec01 .owl-page{left:10px;text-align: center;}
    #sec01 .owl-page strong{color:#fff}
    #sec01 .owl-nav{left:auto; right:10px;}
    #sec01 .owl-nav button{height: 30px;}
    #sec01 .owl-prev{background-position:-202px -180px;}
    #sec01 .owl-next{background-position:-202px -263px;}

    #sec05 ul li a:before{width:60px;height:60px;}
    
}
@media screen and (max-width:767px){
    section h2{font-size:180%}
    section h3{font-size:160%}
    section .txt{font-size:105%;}

    
    #sec01 .item{height:0;padding-bottom:85%;position:relative;}
    #sec01 .item img{position:absolute;left:0;right:0;top:0;bottom:0;width:auto;height: 100%; max-width: none;}
    #sec01 .active .item img{left:-20%;}
    #sec01 .text div{font-size:120%;}
    #sec02 h2{font-size:230%}

    #sec03 .left{margin-top:-35%;margin-bottom:7%;} 
    #sec05 ul li a{font-size:115%}  

   
}
@media screen and (max-width:640px){

    #sec02 .Photo:last-of-type{width:auto;margin-top:5%;}
    section .right,section .left{width: auto !important;float: none;margin: 0 0 10%;}
    #sec03 .left{ display: none;}
    #sec05 ul li a:before{width:40px;height:40px;}
    #sec05 ul li a{font-size:110%}  
}
@media screen and (max-width:501px){     
    section h2{font-size:160%}
    section h3{font-size:140%}   
    section .txt{font-size:100%;}
    #sec01 .text div{font-size:110%;}
    #sec01 .text strong{font-size:200%;}
    #sec02 h2{font-size:180%}

    #sec05 ul{grid-template-columns:repeat(1, 1fr);gap:3% 0}
    #sec05 ul li{height:100px; text-align: right;background-repeat: no-repeat;background-position:0 50%;background-size: auto 100%;}
    #sec05 ul li p{margin-top:3%;}
    #sec05 ul li img{opacity: 0;height:0;}
    #sec05 ul li a{font-size:120%}  
    #sec05 ul li a:before{left:20px;transform:translate(0, -10%);width:50px;height:50px;}
    #sec05 ul li:nth-child(1) {background-image:url(../img/main/s06_01.png);}
    #sec05 ul li:nth-child(2) {background-image:url(../img/main/s06_02.png);}
    #sec05 ul li:nth-child(3) {background-image:url(../img/main/s06_03.png);}
    #sec05 .more{left:auto;right: 20px;}

}