@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Lato);

/*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, input{border:none;font-size:12px;font-family:'Lato', sans-serif}

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; z-index:300; background: #0b1025;}
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; letter-spacing: calc(-200vw/1280); word-spacing: calc(400vw/1280);}
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;}

h2 {letter-spacing: calc(-4vw/1280); word-spacing:calc(6vw/1280)}
p{ letter-spacing: calc(-1vw/1280); word-spacing:calc(2vw/1280);}

.charging {position:absolute; left:0px; top:72px; background: url(../image/STASYScharging.png) no-repeat 0px 0px; background-size: contain; width: 100vw; height: calc(120000vw/1920); text-align: center;}
.charging h2 {color: transparent}
.charging ul {position: absolute; left: calc(26000vw/1920); top:calc(87500vw/1920);}
.charging ul li:nth-child(1) a {position:absolute; left:0; color: transparent; background: url(../image/5000.png)no-repeat 0 0; background-size: contain; width:265px; height: calc(20000vw/1920); }
.charging ul li:nth-child(2) a {position:absolute; left:calc(28000vw/1920); color: transparent; background: url(../image/10000.png)no-repeat 0 0; background-size: contain; width:265px; height:calc(20000vw/1920); }
.charging ul li:nth-child(3) a {position:absolute; left:calc(56200vw/1920); color: transparent; background: url(../image/30000.png)no-repeat 0 0; background-size: contain; width:265px; height:calc(20000vw/1920); }
.charging ul li:nth-child(4) a {position:absolute; left:calc(84000vw/1920); color: transparent; background: url(../image/50000.png)no-repeat 0 0; background-size: contain; width:265px; height:calc(20000vw/1920); }
.charging ul li:nth-child(5) form {position:absolute; left:calc(112000vw/1920); color: transparent; background: url(../image/anymoney.png)no-repeat 0 0; background-size: contain; width:265px; height:calc(20000vw/1920); }
.charging ul li:nth-child(5) form input[type=text] {position:absolute; left:calc(2300vw/1920); top: calc(7000vw/1920);height:calc(4500vw/1920);width:calc(22500vw/1920);border-radius: calc(1000vw/1920); text-align:center; font-size: calc(2000vw/1920); margin: 0 0; padding: 0 0; text-indent: 0;}
input::placeholder {font-size:1vw;}
.charging ul li:nth-child(5) form input[type=submit] {position:absolute; left: calc(9500vw/1920); top:calc(13500vw/1920); height:calc(4200vw/1920); width:calc(8200vw/1920); border-radius:calc(1000vw/1920); text-align:center; font-size: calc(2000vw/1920);background-color: #2e3133; color: #fff}


.STASYSpoint {width:100vw; height:calc(57800vw/1920); position:absolute; left:0px; top: calc(110000vw/1920 + 72px); background: url(../image/STASYSpoint.png) no-repeat 0px 0px; background-size: contain;}
.STASYSpoint h2 {position:absolute; left:calc(22500vw/1920); top:calc(10000vw/1920); width:900px; font-size: calc(4200vw/1920); color:#052535; font-weight: normal;}
.STASYSpoint p {position:absolute; left:calc(22500vw/1920); top:calc(17500vw/1920);font-size: 1vw; color:#052535;line-height: 1.8; font-weight: lighter;}
.STASYSpoint ul {position:absolute; left:calc(22500vw/1920); top:calc(26700vw/1920); font-size: 1vw; color:#052535; line-height:1.9; font-weight: lighter;}
.STASYSpoint ul li {font-family: sans-serif;}
.STASYSpoint ul li:nth-child(3) a {color: #2d52d7; text-decoration: underline;}

footer {position:absolute; top: calc(167000vw/1920 + 72px); left: 0; color:#fff;background: white; width: 100%; height: calc(35000vw/1920)}
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)}