@charset "utf-8";
@import url('//fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');

/*Reset*/
html, body{width:100%;}
html{-webkit-touch-callout:none; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
body{width:100%; background:#fff; min-width:320px; -webkit-text-size-adjust:none;word-wrap:break-word;word-break:break-all;}
body{border:none;font-size:12px;font-family:'Lato', sans-serif; overflow-x:hidden;}
html{min-width: 1000px; min-height: 1000px}

html, body, h1, h2, h3, div, p, ul, li, section, nav, form, button{margin:0;padding:0;}
ul,li{list-style:none; font-family: sans-serif;}
a{color:#000;text-decoration:none;}
a:link,a:hover,a:active{text-decoration:none;}
img{border:0;}
img, button {vertical-align: middle;}
main,header,section,nav,footer{display:block;}
footer {text-align:center;}
.hide { position: absolute; left: -5000px;}

body { min-width: 1280px; max-width: 100%; overflow-x: hidden; background: #0b1025;}
header { position: fixed; width:100vw; height: 72px; text-align: center; background: #0b1025;z-index:3000}
header h1 { position: fixed; left:80px; top: 0; padding: 14px 0 0;}
header h1 a{ display: block;width: 130px; height: 40px; color: transparent; background: url(../image/upSTASYSlogo.png) no-repeat -50px -15px;}
header .lnb {position: absolute; top:0; left:260px; width: 570px;}
header .lnb ul {width:700px;}
header .lnb li {display: inline-block;}
header .lnb li a {display: block; height: 72px; width: 140px; font-size: 18px; color: #fff; line-height: 70px;}
header .lnb li a:hover { color: #fff; font-weight: bold;}
header .lnb li a span { position: relative;}
header .spot { position: absolute; right:90px; top: 8px;}
header .spot #login { display: block; height: 72px; margin: 7px 0px; line-height: 42px; color:black ;padding-right:0; background: #fff; border-radius: 25px; width:104px; height: 42px; font-size: 18px; }
header .spot .login_layer {position: absolute; display: none; top: 64px; right: 0; background: #fff; width: 306px; height: 292px; border-radius: 10px; box-shadow: 20px 19px 25.6px 6.4px rgba(0, 0, 0, 0.28); font-family: 'Lato' ,'Noto Sans KR';}
header .spot .login_layer .login_title {font-family: 'Noto Sans KR'; font-size: 20px; color: #000; line-height: 28px; position: absolute; top: 24px; left: 26px;}
header .spot .login_layer .layer_close {position: absolute; top: 27px; right: 27px; width: 12px; height: 12px; cursor: pointer;}
header .spot .login_layer input {position: absolute; left: 50%; margin-left: -122px; width: 244px; height: 26px; line-height: 25px; font-family: 'Noto Sans KR'; font-size: 12.5px; border: 0; border-bottom: 1px solid #747474; outline: none; box-sizing: border-box;}
header .spot .login_layer input::placeholder {color: #ababab;}
header .spot .login_layer input[type=text] {top: 77px;}
header .spot .login_layer input[type=password] {top: 117px;}
header .spot .login_layer #login_btn {position: absolute; left: 50%; top: 171px; margin-left: -122px; width: 244px; height: 40px; line-height: 40px; font-family: 'Noto Sans KR'; font-size: 16.67px; font-weight: 600; color: #fff; background: #3a46bb; cursor: pointer; text-align: center; border-radius: 5px;}
header .spot .login_layer .join_bottom {position: absolute; top: 231px; text-align: center; line-height: 12px; width: 100%;}
header .spot .login_layer .join_bottom a {font-family: 'Noto Sans KR'; font-size: 12.5px; color: #ababab; letter-spacing: 0;}

h1, h2 {letter-spacing: calc(-300vw/1280); word-spacing:calc(1000vw/1280)}
h3, a {letter-spacing: calc(-200vw/1280); word-spacing:calc(400vw/1280);}

h1 {font-size:calc(8500vw/1920); font-family: sans-serif;}
h2 {font-size:calc(4800vw/1920); font-family: sans-serif; font-weight: 500;}
h3 {font-size: calc(3800vw/1920); font-family:sans-serif;}
p {font-size: calc(1600vw/1920); font-family:sans-serif; font-weight: lighter}
a {font-size: calc(2000vw/1920)}

.FunPC {position:fixed; left:0; top:72px; color: #fff; font-weight: normal; background: url(../image/FunPC.png) no-repeat 0 calc(-50000vw/1920); background-size:contain; width:100vw; height: calc(90000vw/1920); z-index: -10}
.FunPC h1 {padding-top: calc(8000vw/1920); font-weight:600; text-align: center; font-size: calc(4800vw/1920);}
.FunPC h3 {padding-left: calc(41000vw/1920); padding-top:0.3em; font-weight: lighter;}
.FunPC p {padding-left: calc(41000vw/1920); padding-top:1em}
.FunPC a {display:block; margin-left: calc(41000vw/1920); margin-top: calc(3900vw/1920); padding-left: calc(7000vw/1920);line-height: calc(7000vw/1920); width: calc(21000vw/1920); height: calc(9000vw/1920); background: url(../image/WhiteDown.png) no-repeat 0 0; background-size: contain; color: black; font-size: calc(2200vw/1920); color:#09173e;}
.FunPC input {position: absolute; left: 50%; margin-left: calc(-52100vw/1920); margin-top: calc(6000vw/1920); padding: 0 calc(3800vw/1920); border: 0; outline: 0; box-sizing: border-box; border-radius: calc(500vw/1920); width: calc(104200vw/1920); height: calc(7300vw/1920); line-height: calc(7300vw/1920); background: #fff; font-family: 'Lato'; font-size: calc(2500vw/1920);}
.FunPC input::placeholder {color: #b8b8b8; padding-left: calc(5500vw/1920); background-size: contain; background-image: url(/image/search_icn.png); height: calc(2900vw/1920); background-repeat: no-repeat;}

.Explain {position: absolute; left: 0; top: calc(39200vw/1920 + 72px); background: white; width: 100vw; height: calc(92400vw/1920);}
.Explain #exbg {position: absolute; left: 0; bottom: 0; width: calc(90600vw/1920); height: calc(59200vw/1920); background-size: contain; background-image: url(/image/contact_bg.png); background-repeat: no-repeat;}
.Explain #contact_info {position: absolute; color: #5a5a5a; top: calc(9000vw/1920); left: calc(23200vw/1920); font-size: calc(1500vw/1920);}
.Explain #contact_info div {font-family: 'Lato'; font-size: calc(3000vw/1920); font-weight: 500; margin-bottom: calc(2200vw/1920);}
.Explain #contact_list {position: absolute; color: #5a5a5a; top: calc(9000vw/1920); left: calc(68000vw/1920); font-size: calc(1500vw/1920); width: calc(97000vw/1920);}
.Explain #contact_list .title {font-family: 'Lato'; font-size: calc(3000vw/1920); font-weight: 500; margin-bottom: calc(2200vw/1920);}
.Explain #contact_list table {border: 0; width: 100%; box-sizing: border-box; font-size: calc(1500vw/1920); border-spacing: 0; margin-bottom: calc(4700vw/1920);}
.Explain #contact_list table th {border-bottom: calc(100vw/1920) solid #666; text-align: center; font-weight: 400; vertical-align: top; height: calc(3200vw/1920);}
.Explain #contact_list table td {height: calc(9400vw/1920);}
.Explain #contact_list input {height: calc(6200vw/1920); line-height: calc(6200vw/1920); border: calc(100vw/1920) solid #adadad; outline: 0; box-sizing: border-box; background: #fff; color: #5a5a5a; padding: 0 calc(2800vw/1920); width: 100%; font-size: calc(1500vw/1920);}
.Explain #contact_list textarea {height: calc(27000vw/1920); border: calc(100vw/1920) solid #adadad; outline: 0; box-sizing: border-box; background: #fff; color: #5a5a5a; padding: calc(2000vw/1920) calc(2800vw/1920); width: 100%; font-family: 'Lato'; font-size: calc(1500vw/1920); margin-top: calc(2400vw/1920); margin-bottom: calc(3000vw/1920);}
.Explain #contact_list #inquery_submit {width: calc(11000vw/1920); height: calc(5000vw/1920); line-height: calc(5000vw/1920); background: #284fa9; color: #fff; text-align: center; font-family: 'Lato'; font-size: calc(1500vw/1920); cursor: pointer; border-radius: calc(1000vw/1920);}

.Ready {position:absolute; left:0; top: calc(239500vw/1920); background:url(../image/Ready.png) no-repeat calc(100vw/1920) 0; background-size: contain; width: 100vw; height: calc(42500vw/1920); color:#052535; }
.Ready h2 {text-align:center ; margin-top: calc(13000vw/1920);}
.Ready a {display:block; margin-left: auto;margin-right: auto; margin-top: calc(5000vw/1920); padding-left: calc(7000vw/1920);line-height: calc(7000vw/1920); width: calc(21000vw/1920); height: calc(9000vw/1920); background: url(../image/BlueDown.png) no-repeat 0 0; background-size: contain; color: black; font-size: calc(3000vw/1920); font-size: calc(2200vw/1920); color:#fff}

footer a {letter-spacing: 0px; word-spacing:calc(200vw/1280);}
footer {position:absolute; top: calc(131600vw/1920 + 72px); left: 0; color:#fff;background: white; width: 100%; height: calc(36000vw/1920); z-index: 1000}
footer .top {position:absolute; top: 0; left:0; width:100vw; height:calc(10800vw/1920); text-align: left; background:#071025}
footer .top h2 {position:absolute; left: calc(29500vw/1920); color: transparent; top: calc(1200vw/1920); background: url(../image/upSTASYSlogo.png) no-repeat 0 0; background-size: contain; width: calc(28000vw/1920); height: calc(20000vw/1920)}
footer .top .footnewmenu {padding-left: calc(53000vw/1920)}
footer .top .footnewmenu li {display: inline-block;}
footer .top .footnewmenu a {display: block; color: #fff; padding-left: calc(4500vw/1920); padding-top: 3.2em;font-size: calc(1500vw/1920); font-weight:lighter;}
footer .top .footmenu {position:absolute; left: calc(119000vw/1920); top: 3.2em; padding-top: 0; font-size: calc(1500vw/1920);}
footer .top .footmenu li {display: inline-block; }
footer .top .footmenu a {display: block; color: #fff; padding-left: calc(4500vw/1920); font-size: calc(1500vw/1920); font-weight:normal;}
footer .top a:hover { color: #fff; font-weight: bold;}

footer hr {display: block; height:10px; border: 0; border-top: 1px solid white; margin: 1em 0; padding: 0;}

footer .btm {position:absolute; left: 0; top: calc(10950vw/1920); width:100vw; height:calc(25000vw/1920); background: #071025; color: #fff;}
footer .btm .info {padding-left: calc(35500vw/1920); text-align: left; padding-top: calc(4000vw/1920);}
footer .btm h3 { font-size: calc(2000vw/1920)}
footer .btm p {padding-top: calc(1500vw/1920); font-size: calc(1500vw/1920); font-weight: 200; font-family: sans-serif;}
footer .btm address {padding-top: calc(5000vw/1920); font-size: calc(1700vw/1920)}
footer .btm .extra {position:absolute; right:calc(32500vw/1920); top:3em; font-size: calc(2000vw/1920); text-align: left;}
footer .btm .extra img {width: calc(3000vw/1920); height: calc(3000vw/1920);}
footer .btm .extra ul li:nth-child(2) {padding-left: 1.75em; font-size: calc(2000vw/1920);}
footer .btm .extra ul li:nth-child(3) {padding-top: calc(3000vw/1920)}