html {overflow:auto; min-height: 780px;min-width:340px;  background:#0B0B0B;}
body {margin:0;padding:0;font-size:0.75em; height:100%;font-family: 'Pretendard'; -webkit-font-smoothing: antialiased;/*overflow:auto;*/ -moz-osx-font-smoothing: grayscale;  position: relative; width: 100%; min-width:340px;margin:0 auto; }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img { margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family: 'Pretendard';}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle; font-family: 'Pretendard';}
input, button {margin:0;padding:0;font-size:1em;font-family: 'Pretendard';;}
button {cursor:pointer}
input[type=text], input[type=password], input[type=submit], input[type=image], button {font-size:1em; -webkit-appearance:none}
textarea, select {font-size:1em;font-family: 'Pretendard';}
textarea {border-radius:0;-webkit-appearance:none;font-family: 'Pretendard';;}
select {margin:0;background:none;font-family: 'Pretendard';}
p {margin:0;padding:0;word-break:break-all; font-family: 'Pretendard';}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#000;text-decoration:none; font-weight:400; font-family: 'Pretendard';}
ul,li,dl,dt,dd {padding:0;margin:0; font-family: 'Pretendard';}
ul {list-style:none}
*,:after,:before {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
input[type="text"]:focus {outline: none;}
input[type="password"]:focus {outline: none;}
textarea:focus {outline: none;}
input[type="text"]::placeholder {color:#888;}
input[type="password"]::placeholder {color:#888;}
textarea::placeholder {color:#888;}


html::-webkit-scrollbar {
    width: 10px;
}
html::-webkit-scrollbar-thumb {
    background-color: #222;
    border-radius: 10px;
}
html::-webkit-scrollbar-track {
    background-color: #0b0b0b;
    border-radius: 10px;
}



header {height:100px; background:#0B0B0B; z-index: 10; position: fixed; left:0; top:0; width:100%; padding:0 60px;}
header .logo {display: inline-block; margin-top:24px;}
header .logo img {width:146px;}
header .right {position: absolute; right:60px; top:25px;}
header .right .setting {height:50px; background:#fff; color:#0b0b0b;  border:none; font-size:17px; font-weight:500; border-radius:50px;  width:50px; }
header .right .setting img {width:25px; margin-top:-2px;}
header .right .api {height:50px; background:none; color:#fff;  border:1px solid #fff; font-size:16px; font-weight:400; border-radius:50px;  width:160px; margin-right:7px; letter-spacing: -.2px;}
header .right .api b {color:#ed970d}
header .right .profile {position: relative; float:right; margin-left:7px;}
header .right .profile_open .img {width:50px; height:50px; border-radius:50%; floaT:left; margin:0 0 0 5px;}
header .right .profile_open {border:none; background:none; position: relative;}
header .right .profile_open img {margin:22px 0 0 15px;}
header .right .pro_view {background:#252525; border-radius:25px; position:absolute; right:-10px; top:65px;  width:135px; display: none;}
header .right .pro_view.on {display: block;}
header .right .pro_view li {text-align: center; font-size:15px ;color:#888; padding:15px 0; cursor: pointer;}
header .right .pro_view li img {margin:0 -5px 0 4px; width:16px;}







footer {border-top:1px solid #222 ;color:#666; font-size:13px; font-weight:300; padding:25px 60px;}






@media screen and (max-width:1500px) {
    header {padding:0 25px;}
    header .right {right:25px;}

    footer {padding:25px 25px;}
}


@media screen and (max-width:1279px) {
    header {height:70px;}
    header .logo {margin-top:16px;}
    header .logo img {width:110px;}
    header .right {top:15px;}
    header .right .setting {height:40px; font-size:15px; width:40px;}
    header .right .api {height:40px; font-size:14px; width:130px;}
    header .right .setting img {width:20px;}
    header .right .profile {margin-left:5px;}
    header .right .profile_open .img {width:40px; height:40px; }
    header .right .profile_open img {margin:16px 0 0 10px; width:15px;}
    header .right .pro_view {right:-25px; top:50px;}

    footer {font-size:12px;}
}

@media screen and (max-width:767px) {
    header {padding:0 20px;}
    header .right {right:15px;}
    header .right .profile_open img {display: none;}
    header .right .profile {margin-left:3px;}
    header .right .api {width:115px; font-size:13px; margin-right:4px;}
}