
@font-face{font-family:Gellix;font-weight:300;src:url(../../fonts/Gellix-Light.woff2) format("woff2")}
@font-face{font-family:Gellix;font-weight:400;src:url(../../fonts/Gellix-Regular.woff2) format("woff2")}
@font-face{font-family:Gellix;font-weight:500;src:url(../../fonts/Gellix-Medium.woff2) format("woff2")}
@font-face{font-family:Gellix;font-weight:600;src:url(../../fonts/Gellix-SemiBold.woff2) format("woff2")}
@font-face{font-family:Gellix;font-weight:700;src:url(../../fonts/Gellix-Bold.woff2) format("woff2")}

*{font-family:"Gellix","Apple SD Gothic Neo","Nanum Gothic",sans-serif!important; font-size: 16px;}

html{margin:0!important;cursor: default;height:100%;}

body{margin:0!important;min-height:100%;height: 100%;background-color:#fff;}

/* header */
.header {height: 100px; width: 100%; box-sizing: border-box; background-color: rgba(255, 255, 255, 0); display: flex; justify-content: center; position: relative; top: 0; z-index: 99;}
.header .con {width: 100%; height: auto; padding: 0 20px; margin: 0 auto; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between;}

.header .navbar-header { height: auto; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; }
.header .navbar-brand { display: block; height: auto;}

.header .navbar-brand .logo { float: left; display: block; height: auto; text-decoration: none;}
.header .navbar-brand svg{width: 72px; height: auto;}
.header .navbar-brand h1{font-size: 34px; color: #2b2b2b; float: right; padding-left: 15px; line-height: 55px;}
.header .navbar-brand span { font-size: 12px; }
.header .nav{display: inline-block;}
.header .nav li { display: flex; align-items: center; padding-right: 32px; height: 40px; box-sizing: border-box; float: left;}
.header .nav li i{padding-right: 10px; display: flex; align-items: center; float: left;}
/* .header .nav li i.blogico{background: url(../images/blog-ico.png) center no-repeat; width: 22px; height: 22px;} */
.header .nav li i svg{margin-top: -2px; color: #a9a9a9;}
.header .nav li i img{display: block; width: 100%; height: auto;}
.header .nav li i #svg4{margin-top: 0px;}

.header .nav li a { position: relative; font-size: 18px; color: #292929; line-height: 40px; box-sizing: border-box; text-decoration: none; display: inline-block;}
.header .nav li a::before{content: ""; position: absolute; width: 100%; height: 1px; bottom: 8px; margin-bottom: -4px; left: 0px; background-color: #292929; visibility: hidden; transform: scaleX(0); transition: all 0.2s ease-in-out 0s;}

.header .nav li a:hover { color: #292929;}
.header .nav li a:hover::before{visibility: visible; transform: scaleX(1); transition: all 0.2s ease-in-out 0s;}

.header .navbar-toggle { display: none; height: 37px; background: rgba(0, 0, 0, 0); border: none; cursor: pointer; }
.header .navbar-toggle span { display: block; width: 30px; margin: 4px 0; border-bottom: 2px solid #292929; }

@media screen and (max-width: 1520px) {
  /* .header .con{justify-content: space-between;} */
}
@media screen and (max-width: 1279px) {
  .header .nav li { padding: 0 10px; }
}
@media screen and (max-width: 1000px) {
  .header .con { display: block; }
  .header .navbar-header { height: 100px; }
  .header .navbar-brand{position: static;}
  .header .navbar-toggle { display: flex; flex-flow: column; justify-content: center; align-items: center; }
  .header .collapse { display: none; }
}
@media screen and (max-width: 768px) {
  .header .navbar-header { height: 100px; }
  .header .navbar-brand h1{font-size: 20px;}
  .header .navbar-brand { margin: 0; }
  .header .navbar-brand span { display: none; }
}

@media screen and (max-width: 390px) {
  .header .con { padding: 0; }
  .header .navbar-brand h1 { font-size: 20px; }
}



.sidebar-wrapper{position: relative; height: 100%; overflow: auto;}
#sidebar { background-color: #d9d7df;}
#sidebar .logo{padding-left: 10px;}
#sidebar .logo svg{margin: 10px 0;}
#sidebar .nav { margin-top: 20px; line-height: 40px; list-style-type: none; padding: 0;}
#sidebar .nav a { display: block; padding: 0 20px; color: #384558; text-decoration: none;}
#sidebar .nav a:hover { background-color: #b0aeb6;}
[data-simplersidebar='active'] { box-shadow: -3px 0 3px 0 rgba(0, 0, 0, 0.5);}
#toggle-sidebar{float: right; display: none;}
@media screen and (max-width: 1000px) {
  #toggle-sidebar{display: block;}
}


.footer{height: 40px; width: 100%; background-color: #0a0a0a; display: flex; justify-content: center; align-items: center;}
.footer p{font-size: 12px; color: #fff;}
.footer ul{padding: 11px 0;}
.footer ul li{padding: 0 5px; float: left; list-style: none; color: #fff; font-size: 12px; line-height: 18px;}
.footer ul a{color: #fff; font-size: 12px; text-align: center; text-decoration: none; line-height: 18px; padding: 0 2px;}
.footer ul a:hover{color: #16b6a8;}
@media screen and (max-width: 768px) {
  .footer{height: auto;}
}
