@import "../../css/nanum_square_regular.css";
@import "../../css/Font/NotoSans.css";

h1, h2, h3, h4, h5, h6,body{font-family:"NanumSquare",dotum,sans-serif;}

.container{width:100%;height:100vh;padding:0;margin:0;background:rgba(0,0,0,0.6)}

.container .txt{position:absolute;top:53%;left:50%;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);text-align: center;width:100%;}
.container .txt h2{font-size:85px;color:#fff;font-weight:bold;font-family:'Noto Sans CJK KR Black',dotum,sans-serif;line-height:94px;letter-spacing: -2px;}
.container .txt h3{font-size: 24px;letter-spacing: 2px;color: #fff;margin-top: 15px;font-weight: lighter;font-family: "Noto Sans CJK KR Thin",dotum,sans-serif;line-height: 18px;}
.container .txt h2 br{display:none}
.container .txt .btn{margin:180px 0 160px 0}
.container .txt .btn button{border:5px solid #fff;background:transparent;color:#fff;font-size:20px;font-family: "Noto Sans CJK KR Black",dotum, sans-serif;padding:8px 15px;width:220px;-webkit-border-radius:50px 50px;-moz-border-radius:50px 50px;border-radius:50px 50px;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;}
.container .txt .btn button:hover{border:5px solid #24b7be;background:#24b7be;color:#fff;}
.container .txt .btn button:first-child{margin-right:20px;}
.container .txt .logo{text-align:center;}
.container .txt .logo img{width:160px;}

.video_container{width:100%;height:100vh;position:fixed;z-index:-1;top:0;left:0;overflow: hidden;}
.video_container video{position: absolute;top:50%;left:0;z-index: 99;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);object-fit: cover;min-width: 100%;min-height: 100%;width: auto;height: auto;}

@media all and (max-width: 1200px){

}

@media all and (max-width: 880px){
    .container .txt{top:50%;}
    .container .txt h2{font-size: 12vw;line-height: 13vw;}
    .container .txt h3{font-size: 3vw !important;font-weight: normal;}
    .container .txt h2 br{display:block;}
    .container .txt .btn{width: 100%;margin: 10vw 0;height: auto;left: 0;text-align: center;}
    .container .txt .btn:after{content:"";clear:both;display:block;}
    .container .txt .btn button{display: block;width: 60%;margin: 0 auto;font-size: 4vw;}
    .container .txt .btn button:first-child{margin-right: auto;margin-bottom: 3vw;}
    /*.container .txt .btn button{width:calc(40% - 10px);font-size:3vw;padding:1vw;border:4px solid #fff;}*/

    .container .txt .logo{width:160px;text-align: center;margin:0 auto;}
    .container .txt .logo img{width:100%;}
}