@charset "utf-8";

/* base */
html,body {margin:0;padding:0;}
body {color:#000;font-style:normal;-webkit-text-size-adjust:none}/* -webkit-text-size-adjust:none 웹표준 검사에 오류로 표시 */
p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,table,form,fieldset {margin:0;padding:0}
body,input,textarea,select,button,table {font-size:16px;font-family:Malgun Gothic, 맑은 고딕, Verdana, dotum, Sans-serif}
table {empty-cells:show}
caption,legend {display:none}
a img,img {vertical-align:top;}
img,fieldset {border:0}
ul,dl,dd {list-style:none;margin:0;padding:0;}
ul li img {vertical-align:top}
em,address {font-style:normal}
a {text-decoration:none}
a:hover,a:active,a:visited,a:focus {}/* text-decoration:underline */

/* layout */
.container{position: absolute;display: flex;width: 100%;height: 100%;padding:50px;justify-content: center;align-items: center;flex-wrap: wrap;box-sizing: border-box;background: url(image/background.jpg) no-repeat 50% 50%;background-size: cover;overflow-y:auto;}
.wrap{position: relative;display: flex;width: 800px;padding: 50px;box-sizing:border-box;border-radius: 10px;background: rgba(0,0,0,.7);align-items: center;justify-content: center;flex-direction: column;border: 1px solid rgba(255,255,255,.2);box-shadow: 0px 0px 8px 0px rgb(0 0 0 / 80%);overflow:hidden;}
.logo{position:relative;width:285px;height:127px;margin-right:40px;background:url(image/sky_logo.png) no-repeat center;}
.txt1{color:#fff;text-align:center;font-size:50px;letter-spacing: -2px;font-family:'Noto+Sans+KR', 맑은 고딕, Verdana, dotum, Sans-serif;font-weight:700;}
.txt1 > .txt_span1{color:#ffc600;font-size:58px;}
.txt2{margin-top: 30px;color:#999;font-size:26px;text-align:center;}
.telegram{display: flex;align-items: center;justify-content: center;color:#fff;font-size:16px;overflow:hidden;}
.telegram > .icon{display: flex;align-items: center;}
.telegram > .icon:before{content:'';display:inline-block;width:39px;height:39px;margin: 0 10px;background:url('image/telegram.png') no-repeat;}
.url{display:block;color:#fc00ff;font-size:46px;}

@media (min-width : 300px) and (max-width : 1024px){
.container{display:block;padding:20px;background: url(image/background.jpg) no-repeat 50% 50%;background-size: cover;}
.wrap{display: block;width: 100%;padding: 20px;}
.logo{width:100%;margin: 30px 0;}
.txt1{font-size:9vw;}
.txt1 > .txt_span1{font-size:10vw;}
.txt2{font-size:4vw;}
.telegram{font-size:3vw;}
.url{text-align:center;font-size: 8vw;}
}