@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300,400);
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);
@font-face {
  font-family: myriad;
  src: url(../images/font-material/myriad-web-pro.ttf); }
@font-face {
  font-family: myriad-light;
  src: url(../images/font-material/MyriadPro-Light.otf); }
@font-face {
  font-family: Roboto-Condensed-Light;
  src: url(../images/font-material/RobotoCondensed-Light.ttf); }
@font-face {
  font-family: Lato-Regular;
  src: url(../images/font-material/Lato-Regular.ttf); }
.click-more {
  font-family: 'Roboto Condensed', sans-serif; }

@-webkit-keyframes illuminate {
  0% {
    opacity: 0; }
  40% {
    opacity: 0.15; }
  70% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes illuminate {
  0% {
    opacity: 0; }
  40% {
    opacity: 0.15; }
  70% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-webkit-keyframes flash {
  0% {
    opacity: 0; }
  20% {
    opacity: 1; }
  40% {
    opacity: 0; }
  60% {
    opacity: 1; } }
@keyframes flash {
  0% {
    opacity: 0; }
  20% {
    opacity: 1; }
  40% {
    opacity: 0; }
  60% {
    opacity: 1; } }
html {
  font-size: 62.5%; }

body {
  background: #000000;
  font-family: Roboto-Condensed-Light; }

div.light-box {
  position: fixed;
  width: 50vw;
  height: 28.125vw;
  background-color: #353535;
  top: 50%;
  z-index: 10000;
  transform: translateY(-50%);
  left: 25vw; }
  div.light-box video {
    width: 50vw;
    height: 28.125vw;
    background: url(../images/tranparent.png) no-repeat center center;
    background-size: cover; }

nav#general-top-navigation {
  z-index: 10000;
  position: fixed;
  top: 0;
  right: 0;
  display: block;
  background-color: #000000;
  width: 150px;
  height: 75px; }
  nav#general-top-navigation div#close-btn {
    display: block;
    float: left;
    width: 75px;
    height: 75px;
    border: 0px;
    background: url(../images/icons/back_arrow.png) center center no-repeat;
    background-size: 13px 21px;
    cursor: pointer; }
    nav#general-top-navigation div#close-btn a {
      display: block;
      width: 100%;
      height: 100%; }
      nav#general-top-navigation div#close-btn a:after {
        content: 'BACK';
        font-size: 9px;
        position: absolute;
        width: 75px;
        text-align: center;
        bottom: 7px;
        color: #ffffff; }
    nav#general-top-navigation div#close-btn:focus {
      outline: 0; }
  nav#general-top-navigation label#menu-label {
    display: block;
    width: 75px;
    height: 75px;
    background: url(../images/icons/humburger.png) center center no-repeat;
    background-size: 22px 16px;
    float: right;
    position: relative;
    cursor: pointer; }
    nav#general-top-navigation label#menu-label:after {
      content: 'MENU';
      font-size: 9px;
      position: absolute;
      width: 75px;
      text-align: center;
      bottom: 7px;
      color: #ffffff; }

div#toggle-to-top {
  width: 60px;
  height: 30px;
  background: url(../images/icons/toggle_to_top.png) no-repeat center center;
  background-color: rgba(255, 255, 255, 0);
  background-size: 33px 17px;
  position: fixed;
  bottom: 2%;
  left: 50vw;
  z-index: 0;
  margin-left: -30px;
  cursor: pointer;
  opacity: 0;
  -webkit-transition: 0.6s background-color linear;
  transition: 0.6s background-color linear; }
  div#toggle-to-top:hover {
    opacity: 0.7;
    -webkit-transition: background-color 6s;
    transition: background-color 6s; }
  div#toggle-to-top.fadeIn {
    opacity: 1;
    -webkit-transition: 0.5s linear opacity, background-color 0.6s;
    transition: 0.5s linear opacity, background-color 0.6s;
    z-index: 1000; }
    div#toggle-to-top.fadeIn:hover {
      -webkit-animation: bound 1.2s infinite ease-in-out;
      animation: bound 1.2s infinite ease-in-out;
      -moz-animation: bound 1.2s infinite ease-in-out; }
  div#toggle-to-top.fadeOut {
    opacity: 0;
    -webkit-transition: opacity  0.5s linear;
    transition: opacity 0.5s linear;
    z-index: 1000; }

#thumbnail-slider div.indicator-container {
  position: relative;
  width: 20px;
  height: 20px;
  margin-left: -10px;
  transform-origin: 1px 0%;
  -webkit-transform-origin: 1px 0%; }
  #thumbnail-slider div.indicator-container > div {
    width: 2px;
    height: 10px;
    position: absolute;
    transform-origin: 1px 0;
    -webkit-transform-origin: 1px 0;
    border-radius: 20px;
    margin-left: 9px;
    margin-top: 10px; }
    #thumbnail-slider div.indicator-container > div:after {
      content: '';
      position: relative;
      display: block;
      width: 2px;
      height: 5px;
      top: 5px;
      background-color: #000000;
      border-radius: 2px; }
    #thumbnail-slider div.indicator-container > div:nth-child(1) {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(1):after {
        -webkit-animation: brighten 0.9s linear infinite -840ms;
        -moz-animation: brighten 0.9s linear infinite -840ms;
        animation: brighten 0.9s linear infinite -840ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(2) {
      transform: rotate(24deg);
      -webkit-transform: rotate(24deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(2):after {
        -webkit-animation: brighten 0.9s linear infinite -780ms;
        -moz-animation: brighten 0.9s linear infinite -780ms;
        animation: brighten 0.9s linear infinite -780ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(3) {
      transform: rotate(48deg);
      -webkit-transform: rotate(48deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(3):after {
        -webkit-animation: brighten 0.9s linear infinite -720ms;
        -moz-animation: brighten 0.9s linear infinite -720ms;
        animation: brighten 0.9s linear infinite -720ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(4) {
      transform: rotate(72deg);
      -webkit-transform: rotate(72deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(4):after {
        -webkit-animation: brighten 0.9s linear infinite -660ms;
        -moz-animation: brighten 0.9s linear infinite -660ms;
        animation: brighten 0.9s linear infinite -660ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(5) {
      transform: rotate(96deg);
      -webkit-transform: rotate(96deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(5):after {
        -webkit-animation: brighten 0.9s linear infinite -600ms;
        -moz-animation: brighten 0.9s linear infinite -600ms;
        animation: brighten 0.9s linear infinite -600ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(6) {
      transform: rotate(120deg);
      -webkit-transform: rotate(120deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(6):after {
        -webkit-animation: brighten 0.9s linear infinite -540ms;
        -moz-animation: brighten 0.9s linear infinite -540ms;
        animation: brighten 0.9s linear infinite -540ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(7) {
      transform: rotate(144deg);
      -webkit-transform: rotate(144deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(7):after {
        -webkit-animation: brighten 0.9s linear infinite -480ms;
        -moz-animation: brighten 0.9s linear infinite -480ms;
        animation: brighten 0.9s linear infinite -480ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(8) {
      transform: rotate(168deg);
      -webkit-transform: rotate(168deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(8):after {
        -webkit-animation: brighten 0.9s linear infinite -420ms;
        -moz-animation: brighten 0.9s linear infinite -420ms;
        animation: brighten 0.9s linear infinite -420ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(9) {
      transform: rotate(192deg);
      -webkit-transform: rotate(192deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(9):after {
        -webkit-animation: brighten 0.9s linear infinite -360ms;
        -moz-animation: brighten 0.9s linear infinite -360ms;
        animation: brighten 0.9s linear infinite -360ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(10) {
      transform: rotate(216deg);
      -webkit-transform: rotate(216deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(10):after {
        -webkit-animation: brighten 0.9s linear infinite -300ms;
        -moz-animation: brighten 0.9s linear infinite -300ms;
        animation: brighten 0.9s linear infinite -300ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(11) {
      transform: rotate(240deg);
      -webkit-transform: rotate(240deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(11):after {
        -webkit-animation: brighten 0.9s linear infinite -240ms;
        -moz-animation: brighten 0.9s linear infinite -240ms;
        animation: brighten 0.9s linear infinite -240ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(12) {
      transform: rotate(264deg);
      -webkit-transform: rotate(264deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(12):after {
        -webkit-animation: brighten 0.9s linear infinite -180ms;
        -moz-animation: brighten 0.9s linear infinite -180ms;
        animation: brighten 0.9s linear infinite -180ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(13) {
      transform: rotate(288deg);
      -webkit-transform: rotate(288deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(13):after {
        -webkit-animation: brighten 0.9s linear infinite -120ms;
        -moz-animation: brighten 0.9s linear infinite -120ms;
        animation: brighten 0.9s linear infinite -120ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(14) {
      transform: rotate(312deg);
      -webkit-transform: rotate(312deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(14):after {
        -webkit-animation: brighten 0.9s linear infinite -60ms;
        -moz-animation: brighten 0.9s linear infinite -60ms;
        animation: brighten 0.9s linear infinite -60ms; }
    #thumbnail-slider div.indicator-container > div:nth-child(15) {
      transform: rotate(336deg);
      -webkit-transform: rotate(336deg);
      backgorund-color: #ffffff; }
      #thumbnail-slider div.indicator-container > div:nth-child(15):after {
        -webkit-animation: brighten 0.9s linear infinite 0ms;
        -moz-animation: brighten 0.9s linear infinite 0ms;
        animation: brighten 0.9s linear infinite 0ms; }

div.indicator-container {
  position: fixed;
  top: 50%;
  transfrom: translateY(-50%);
  -webkit-transform: translateY(-50%);
  z-index: 1000;
  left: 50%;
  width: 32px;
  height: 32px;
  margin-left: -16px;
  transform-origin: 1px 0%;
  -webkit-transform-origin: 1px 0%;
  -webkit-animation: fadeIn 2s ease-in;
  animation: fadeIn 2s ease-in; }
  div.indicator-container > div {
    width: 2px;
    height: 16px;
    position: absolute;
    transform-origin: 1px 0;
    -webkit-transform-origin: 1px 0;
    border-radius: 20px;
    margin-left: 15px;
    margin-top: 16px; }
    div.indicator-container > div:after {
      content: '';
      position: relative;
      display: block;
      width: 2px;
      height: 9px;
      top: 7px;
      background-color: #000000;
      border-radius: 2px; }
    div.indicator-container > div:nth-child(1) {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(1):after {
        -webkit-animation: brighten 0.9s linear infinite -840ms;
        -moz-animation: brighten 0.9s linear infinite -840ms;
        animation: brighten 0.9s linear infinite -840ms; }
    div.indicator-container > div:nth-child(2) {
      transform: rotate(24deg);
      -webkit-transform: rotate(24deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(2):after {
        -webkit-animation: brighten 0.9s linear infinite -780ms;
        -moz-animation: brighten 0.9s linear infinite -780ms;
        animation: brighten 0.9s linear infinite -780ms; }
    div.indicator-container > div:nth-child(3) {
      transform: rotate(48deg);
      -webkit-transform: rotate(48deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(3):after {
        -webkit-animation: brighten 0.9s linear infinite -720ms;
        -moz-animation: brighten 0.9s linear infinite -720ms;
        animation: brighten 0.9s linear infinite -720ms; }
    div.indicator-container > div:nth-child(4) {
      transform: rotate(72deg);
      -webkit-transform: rotate(72deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(4):after {
        -webkit-animation: brighten 0.9s linear infinite -660ms;
        -moz-animation: brighten 0.9s linear infinite -660ms;
        animation: brighten 0.9s linear infinite -660ms; }
    div.indicator-container > div:nth-child(5) {
      transform: rotate(96deg);
      -webkit-transform: rotate(96deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(5):after {
        -webkit-animation: brighten 0.9s linear infinite -600ms;
        -moz-animation: brighten 0.9s linear infinite -600ms;
        animation: brighten 0.9s linear infinite -600ms; }
    div.indicator-container > div:nth-child(6) {
      transform: rotate(120deg);
      -webkit-transform: rotate(120deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(6):after {
        -webkit-animation: brighten 0.9s linear infinite -540ms;
        -moz-animation: brighten 0.9s linear infinite -540ms;
        animation: brighten 0.9s linear infinite -540ms; }
    div.indicator-container > div:nth-child(7) {
      transform: rotate(144deg);
      -webkit-transform: rotate(144deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(7):after {
        -webkit-animation: brighten 0.9s linear infinite -480ms;
        -moz-animation: brighten 0.9s linear infinite -480ms;
        animation: brighten 0.9s linear infinite -480ms; }
    div.indicator-container > div:nth-child(8) {
      transform: rotate(168deg);
      -webkit-transform: rotate(168deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(8):after {
        -webkit-animation: brighten 0.9s linear infinite -420ms;
        -moz-animation: brighten 0.9s linear infinite -420ms;
        animation: brighten 0.9s linear infinite -420ms; }
    div.indicator-container > div:nth-child(9) {
      transform: rotate(192deg);
      -webkit-transform: rotate(192deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(9):after {
        -webkit-animation: brighten 0.9s linear infinite -360ms;
        -moz-animation: brighten 0.9s linear infinite -360ms;
        animation: brighten 0.9s linear infinite -360ms; }
    div.indicator-container > div:nth-child(10) {
      transform: rotate(216deg);
      -webkit-transform: rotate(216deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(10):after {
        -webkit-animation: brighten 0.9s linear infinite -300ms;
        -moz-animation: brighten 0.9s linear infinite -300ms;
        animation: brighten 0.9s linear infinite -300ms; }
    div.indicator-container > div:nth-child(11) {
      transform: rotate(240deg);
      -webkit-transform: rotate(240deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(11):after {
        -webkit-animation: brighten 0.9s linear infinite -240ms;
        -moz-animation: brighten 0.9s linear infinite -240ms;
        animation: brighten 0.9s linear infinite -240ms; }
    div.indicator-container > div:nth-child(12) {
      transform: rotate(264deg);
      -webkit-transform: rotate(264deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(12):after {
        -webkit-animation: brighten 0.9s linear infinite -180ms;
        -moz-animation: brighten 0.9s linear infinite -180ms;
        animation: brighten 0.9s linear infinite -180ms; }
    div.indicator-container > div:nth-child(13) {
      transform: rotate(288deg);
      -webkit-transform: rotate(288deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(13):after {
        -webkit-animation: brighten 0.9s linear infinite -120ms;
        -moz-animation: brighten 0.9s linear infinite -120ms;
        animation: brighten 0.9s linear infinite -120ms; }
    div.indicator-container > div:nth-child(14) {
      transform: rotate(312deg);
      -webkit-transform: rotate(312deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(14):after {
        -webkit-animation: brighten 0.9s linear infinite -60ms;
        -moz-animation: brighten 0.9s linear infinite -60ms;
        animation: brighten 0.9s linear infinite -60ms; }
    div.indicator-container > div:nth-child(15) {
      transform: rotate(336deg);
      -webkit-transform: rotate(336deg);
      backgorund-color: #ffffff; }
      div.indicator-container > div:nth-child(15):after {
        -webkit-animation: brighten 0.9s linear infinite 0ms;
        -moz-animation: brighten 0.9s linear infinite 0ms;
        animation: brighten 0.9s linear infinite 0ms; }

svg.bounding-animation {
  -webkit-animation: bound 1.2s infinite ease-in-out;
  animation: bound 1.2s infinite ease-in-out;
  -moz-animation: bound 1.2s infinite ease-in-out; }

@-webkit-keyframes bound {
  0% {
    -webkit-transform: translateY(0px); }
  12.5% {
    -webkit-transform: translateY(2px); }
  25% {
    -webkit-transform: translateY(0px); }
  37.5% {
    -webkit-transform: translateY(4px); }
  50% {
    -webkit-transform: translateY(0px); }
  100% {
    -webkit-transform: translateY(0px); } }
@-moz-keyframes bound {
  0% {
    transform: translateY(0px); }
  12.5% {
    transform: translateY(2px); }
  25% {
    transform: translateY(0px); }
  37.5% {
    transform: translateY(4px); }
  50% {
    transform: translateY(0px); }
  100% {
    transform: translateY(0px); } }
@keyframes bound {
  0% {
    transform: translateY(0px); }
  12.5% {
    transform: translateY(2px); }
  25% {
    transform: translateY(0px); }
  37.5% {
    transform: translateY(4px); }
  50% {
    transform: translateY(0px); }
  100% {
    transform: translateY(0px); } }
@-webkit-keyframes brighten {
  0% {
    background-color: #f0f0f0; }
  100% {
    background-color: #000000; } }
@-moz-keyframes brighten {
  0% {
    background-color: #f0f0f0; }
  100% {
    background-color: #000000; } }
@-ms-keyframes brighten {
  0% {
    background-color: #f0f0f0; }
  100% {
    background-color: #000000; } }
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*
// key frame animation coping with main browsers
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-moz-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-ms-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
} */
input#toggle-menu {
  display: none; }

/* drawer */
section#drawer {
  width: 296px;
  height: 100vh;
  overflow: auto;
  overflow-x: hidden;
  position: fixed;
  left: 100%;
  top: 0;
  color: #ffffff;
  font-size: 1.4rem;
  padding-left: 40px;
  padding-right: 40px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #000000; }
  section#drawer::-webkit-scrollbar {
    width: 10px; }
  section#drawer::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(95, 95, 95, 0.8);
    -webkit-box-shadow: inset -1px -1px 0px 3px black; }
  section#drawer > section:not(:first-child) {
    margin-top: 50px; }
  section#drawer > section > h2 {
    font-size: 1.8rem;
    margin-bottom: 30px; }
  section#drawer > section#feature-inventory img {
    width: 100%;
    border-radius: 3px;
    -webkit-border-radius: 3px; }
  section#drawer > section#feature-inventory h3 {
    font-size: 1.5rem;
    text-align: center;
    margin-top: 10px; }
  section#drawer > section#new-arrival dl {
    opacity: 0; }
    section#drawer > section#new-arrival dl dt {
      width: 60px;
      height: 60px;
      margin-right: 20px;
      margin-bottom: 20px;
      float: left;
      overflow: hidden;
      -webkit-border-radius: 2px;
      border-radius: 2px; }
      section#drawer > section#new-arrival dl dt img {
        width: 60px;
        height: auto; }
    section#drawer > section#new-arrival dl dd:nth-of-type(2n+1) {
      font-size: 1.2rem;
      color: #576f6a;
      margin-top: 5px;
      margin-bottom: 10px; }
    section#drawer > section#new-arrival dl dd:nth-of-type(2n) {
      font-size: 1.4rem; }
      section#drawer > section#new-arrival dl dd:nth-of-type(2n):after {
        content: '';
        display: block;
        clear: left; }
  section#drawer > section#advertisement {
    margin-bottom: 30px; }
    section#drawer > section#advertisement a > img {
      width: 100%; }
  section#drawer > section#tags div {
    font-family: Lato-Regular;
    font-size: 1.2rem;
    background-color: #181818;
    height: 25px;
    line-height: 25px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    padding: 0 7px;
    display: inline-block;
    margin-bottom: 5px;
    margin-right: 2px; }
  section#drawer > section#about p {
    font-family: Lato-Regular;
    font-size: 1.4rem;
    margin-bottom: 30px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
  section#drawer > section#search {
    margin-bottom: 30px; }
    section#drawer > section#search input[type=text] {
      margin-right: 40px;
      color: #c1c0c0;
      background-color: #2b2b2b;
      width: calc(100% - 30px);
      border: 0px solid;
      height: 40px;
      line-height: 40px;
      font-family: 16px;
      -webkit-border-radius: 3px;
      border-radius: 3px;
      padding: 0 15px;
      background: url(../images/icons/icon_search.png) no-repeat right 15px top 12px #2b2b2b;
      background-size: 16px 16px; }
      section#drawer > section#search input[type=text]:focus {
        outline: none; }
  section#drawer > section#global-nav nav ul {
    margin-top: 0;
    margin-bottom: 45px;
    list-style: none; }
    section#drawer > section#global-nav nav ul > li.about-us {
      width: 100%;
      margin-left: -40px;
      padding: 0 40px;
      height: 54px;
      overflow: hidden;
      -webkit-transition: height 0.3s ease-out;
      transition: height 0.3s ease-out; }
      section#drawer > section#global-nav nav ul > li.about-us > span {
        display: block;
        height: 54px;
        line-height: 54px; }
        section#drawer > section#global-nav nav ul > li.about-us > span.no-anchor {
          width: 296px;
          padding: 0 40px;
          margin-left: -40px;
          cursor: pointer;
          background-color: #000000;
          -webkit-transition: background-color .3s ease-out;
          transition: background-color .3s ease-out;
              /*
              &:before {
                content: 'ホーム';
                position: absolute;
                display: block;
                width: 100%;
                margin-left: -40px;
                padding: 0 40px;
                height: 100%;
                background-color: #111111;
                color: #ffffff;
                opacity: 0;
                font-family: 'Noto Sans Japanese';
                font-size: 1.3rem;

              }*/ }
          section#drawer > section#global-nav nav ul > li.about-us > span.no-anchor:after {
            content: '<';
            font-size: 18px;
            position: relative;
            float: right;
            right: 4px;
            top: -3px;
            z-index: 200; }
          section#drawer > section#global-nav nav ul > li.about-us > span.no-anchor:hover {
            background-color: #202020;
            -webkit-transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
            transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
            /*&:before {
              opacity: 1;
              -webkit-transition: opacity .3s cubic-bezier(.24,.91,.62,.87);
              transition: opacity .3s cubic-bezier(.24,.91,.62,.87);
            }*/ }
        section#drawer > section#global-nav nav ul > li.about-us > span > a {
          color: #ffffff;
          text-decoration: none;
          width: 100%;
          display: block;
          margin-left: -40px;
          padding: 0 40px;
          -webkit-transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
          transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87); }
          section#drawer > section#global-nav nav ul > li.about-us > span > a:hover {
            background-color: #202020;
            -webkit-transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
            transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87); }
          section#drawer > section#global-nav nav ul > li.about-us > span > a:after {
            content: '>';
            font-size: 18px;
            position: relative;
            float: right;
            right: -6px;
            top: -3px; }
      section#drawer > section#global-nav nav ul > li.about-us > ul {
        width: 100%;
        height: 54px;
        margin-left: -40px;
        padding: 0 40px;
        margin-bottom: 0; }
        section#drawer > section#global-nav nav ul > li.about-us > ul > li.no-anchor {
          padding-left: 80px; }
          section#drawer > section#global-nav nav ul > li.about-us > ul > li.no-anchor:after {
            content: '<';
            font-size: 18px;
            position: relative;
            float: right;
            right: 44px;
            top: -3px; }
        section#drawer > section#global-nav nav ul > li.about-us > ul > li > a {
          padding-left: 80px;
          margin-left: -40px; }
          section#drawer > section#global-nav nav ul > li.about-us > ul > li > a:after {
            content: '>';
            font-size: 18px;
            position: relative;
            float: right;
            right: 34px;
            top: -3px; }
    section#drawer > section#global-nav nav ul > li:not(.about-us) {
      height: 54px;
      line-height: 54px;
      margin-bottom: 0px;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      position: relative;
      /*
                &:nth-child(1) {
                  > a {
                    &:before {
                      content: 'ホーム';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: 'ホーム';
                    }
                  }
                }
                &:nth-child(2) {
                  > a {
                    &:before {
                      content: 'ニュース';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: 'ニュース';
                    }
                  }
      
                }
                &:nth-child(3) {
                  > a {
                    &:before {
                      content: '車両在庫情報';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: '車両在庫情報';
                    }
                  }
                }
                &:nth-child(4) {
                  > a {
                    &:before {
                      content: '販売済車両';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: '販売済車両';
                    }
                  }
                }
                &:nth-child(5) {
                  > a {
                    &:before {
                      content: '買取・委託販売';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: '買取・委託販売';
                    }
                  }
                }
                &:nth-child(6) {
                  > a {
                    &:before {
                      content: 'ショールーム';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: 'ショールーム';
                    }
                  }
                }
                &:nth-child(7) {
                  > a {
                    &:before {
                      content: '採用情報';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: '採用情報';
                    }
                  }
      
                }
                &:nth-child(8) {
                  span> a {
                    &:before {
                      content: '会社情報';
                    }
                  }
                  span.no-anchor {
                    &:before {
                      content: '会社情報';
                    }
                  }
                }
                &:nth-of-type(9) {
                  > a {
                    &:before {
                      content: 'プライバシーポリシー';
                    }
                  }
                  &.no-anchor {
                    &:before {
                      content: 'プライバシーポリシー';
                    }
                  }
      
                }
      */ }
      section#drawer > section#global-nav nav ul > li:not(.about-us) > a {
            /*&:before {
              content: 'ホーム';
              position: absolute;
              display: block;
              width: 100%;
              margin-left: -40px;
              padding: 0 40px;
              height: 100%;
              background-color: #111111;
              color: #ffffff;
              opacity: 0;
              font-family: 'Noto Sans Japanese';
              font-size: 1.3rem;

            }*/ }
      section#drawer > section#global-nav nav ul > li:not(.about-us) > span > a {
            /*&:before {
              content: 'ホーム';
              position: absolute;
              display: block;
              width: 100%;
              margin-left: -40px;
              padding: 0 40px;
              height: 100%;
              background-color: #111111;
              color: #ffffff;
              opacity: 0;

            }*/ }
        section#drawer > section#global-nav nav ul > li:not(.about-us) > span > a:hover {
          background-color: #202020;
          -webkit-transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
          transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
          /*&:before {
            opacity: 1;
            -webkit-transition: opacity .3s cubic-bezier(.24,.91,.62,.87);
            transition: opacity .3s cubic-bezier(.24,.91,.62,.87);
          */ }
      section#drawer > section#global-nav nav ul > li:not(.about-us).no-anchor {
        width: 296px;
        padding: 0 40px;
        margin-left: -40px;
        cursor: pointer;
        background-color: #000000;
        color: #ffffff;
        -webkit-transition: background-color .3s ease-out;
        transition: background-color .3s ease-out;
            /*&:before {
              content: 'ホーム';
              position: absolute;
              display: block;
              width: 100%;
              margin-left: -40px;
              padding: 0 40px;
              height: 100%;
              background-color: #111111;
              color: #ffffff;
              opacity: 0;
              -webkit-transition: opacity .3s cubic-bezier(.24,.91,.62,.87);
              transition: opacity .3s cubic-bezier(.24,.91,.62,.87);

            }*/ }
        section#drawer > section#global-nav nav ul > li:not(.about-us).no-anchor:after {
          content: '<';
          font-size: 18px;
          position: relative;
          float: right;
          right: 4px;
          top: -3px;
          color: #ffffff; }
        section#drawer > section#global-nav nav ul > li:not(.about-us).no-anchor:hover {
          background-color: #202020;
          -webkit-transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
          transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87); }
      section#drawer > section#global-nav nav ul > li:not(.about-us) > a {
        display: block;
        width: 100%;
        color: #ffffff;
        text-decoration: none;
        height: 54px;
        line-height: 54px;
        padding: 0 40px;
        margin-left: -40px;
        background-color: #000000;
        -webkit-transition: background-color .3s ease-out;
        transition: background-color .3s ease-out; }
        section#drawer > section#global-nav nav ul > li:not(.about-us) > a:hover {
          background-color: #202020;
          -webkit-transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
          transition: background-color 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87); }
          section#drawer > section#global-nav nav ul > li:not(.about-us) > a:hover:before {
            opacity: 1;
            -webkit-transition: opacity 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87);
            transition: opacity 0.3s cubic-bezier(0.24, 0.91, 0.62, 0.87); }
        section#drawer > section#global-nav nav ul > li:not(.about-us) > a:after {
          content: '>';
          font-size: 18px;
          position: relative;
          float: right;
          right: -6px;
          top: -3px;
          z-index: 200; }
  section#drawer > section#global-nav > address ul {
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
    margin-bottom: 24px;
    font-style: normal;
    font-size: 1.4rem; }
    section#drawer > section#global-nav > address ul > li {
      margin-bottom: 10px;
      list-style: none; }

div#main-content-mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0);
  z-index: 1000;
  cursor: pointer; }

input#toggle-menu:checked ~ div#main-content-mask {
  transform: translateX(-376px);
  -webkit-transform: translateX(-376px);
  transition: 0.3s all cubic-bezier(0.1, 0.58, 0.65, 0.99);
  -webkit-transition: 0.3s all cubic-bezier(0.1, 0.58, 0.65, 0.99);
  display: block; }

input#toggle-menu ~ div#main-content-mask {
  transform: translateX(0px);
  -webkit-transform: translateX(0px);
  -webkit-transition: 0.3s ease-out all;
  transition: 0.3s ease-out all;
  display: none; }

ul.sns-area > li {
  display: block;
  float: left;
  width: 35px;
  /*&:nth-child(4) {
    width: 9px;
    > a > img {
      width: 9px;
      margin-top: 1px;
    }
  }*/ }
  ul.sns-area > li:nth-child(1) {
    margin-right: 2px;
    width: 33px; }
    ul.sns-area > li:nth-child(1) > a {
      padding: 0 5px; }
    ul.sns-area > li:nth-child(1) > a > img {
      width: 8px; }
  ul.sns-area > li:nth-child(2) {
    margin-right: 2px; }
    ul.sns-area > li:nth-child(2) > a > img {
      width: 17px;
      margin-top: 2px; }
  ul.sns-area > li:nth-child(3) {
    margin-right: 1px; }
    ul.sns-area > li:nth-child(3) > a > img {
      width: 15px; }
  ul.sns-area > li:nth-child(4) {
    margin-right: 1px;
    width: 17px; }
    ul.sns-area > li:nth-child(4) > a > img {
      width: 15px;
      margin-top: 1px; }
ul.sns-area:after {
  content: '';
  display: block;
  clear: left; }

/*
  common footer style
*/
footer {
  -webkit-font-smoothing: antialiased;
  overflow: hidden; }
  footer > section#footer-info {
    margin-top: 6vw;
    margin-left: 6vw;
    position: absolute;
    width: 50vw;
    height: 50vw;
    top: 0;
    left: 50vw; }
    footer > section#footer-info h1 {
      display: none !important;
      width: 108px;
      height: 24px;
      margin-top: 18px;
      margin-bottom: 5.2085vw; }
      footer > section#footer-info h1 > img {
        width: 108px;
        height: 24px; }
    footer > section#footer-info address > ul:nth-child(1) {
      -webkit-font-smoothing: auto;
      font-size: 1.4rem;
      float: left; }
    footer > section#footer-info address > ul.address-list {
      font-size: 1.4rem;
      line-height: 1.8rem;
      font-family: "Noto Sans";
      margin-left: 17.7083vw;
      margin-top: 3px;
      margin-bottom: 20px; }
      footer > section#footer-info address > ul.address-list > li:nth-child(1) {
        width: 20vw; }
    footer > section#footer-info address > ul > li {
      color: #ffffff;
      font-style: normal;
      list-style: none;
      margin-bottom: 6px; }
    footer > section#footer-info ul.sns-area {
      margin-top: 2.0834vw;
      margin-bottom: 3.1251vw;
      position: relative;
      top: -220px; }
    footer > section#footer-info > nav {
      font-size: 1.0rem;
      font-family: "Noto Sans";
      text-decoration: none; }
      footer > section#footer-info > nav > ul > li {
        margin-bottom: 10px; }
        footer > section#footer-info > nav > ul > li a {
          text-decoration: none;
          color: #ffffff; }
  footer > section#footer-map {
    float: left;
    position: relative;
    width: 50vw;
    height: 50vw; }
    footer > section#footer-map div#map-canvas {
      height: 100%; }
  footer small {
    color: #ffffff;
    -webkit-font-smoothing: auto;
    font-size: 1.3rem;
    position: absolute;
    bottom: 45px;
    right: 40px;
    margin-top: 5.2083vw; }

@media only screen and (min-width: 320px) and (max-width: 999px) {
  article > div#other-sections > section#secondary-content, article > div#other-sections > section#article-content {
    float: none !important;
    width: 80vw !important;
    margin: 0 10vw; }
  article > div#other-sections > section#secondary-content {
    margin: 60px 10vw !important; }

  input#toggle-menu:checked ~ header,
  input#toggle-menu:checked ~ footer,
  input#toggle-menu:checked ~ article,
  input#toggle-menu:checked ~ nav#top-navigation,
  input#toggle-menu:checked ~ nav#general-top-navigation,
  input#toggle-menu:checked ~ #main-content,
  input#toggle-menu:checked ~ div#main-content-mask,
  input#toggle-menu:checked ~ #drawer,
  input#toggle-menu:checked ~ #main-visual {
    transform: translateX(-256px) !important;
    -webkit-transform: translateX(-256px) !important;
    transition: 0.3s transform cubic-bezier(0.1, 0.58, 0.65, 0.99);
    -webkit-transition: 0.3s -webkit-transform cubic-bezier(0.1, 0.58, 0.65, 0.99); }

  input#toggle-menu ~ header,
  input#toggle-menu ~ footer,
  input#toggle-menu ~ article,
  input#toggle-menu ~ nav#top-navigation,
  input#toggle-menu ~ nav#general-top-navigation,
  input#toggle-menu ~ #main-content,
  input#toggle-menu ~ div#main-content-mask,
  input#toggle-menu ~ #drawer,
  input#toggle-menu ~ #main-visual {
    transform: translateX(0px);
    -webkit-transform: translateX(0px);
    -webkit-transition: 0.3s ease-out -webkit-transform;
    transition: 0.3s ease-out transform; }

  section#drawer {
    width: 196px;
    padding-left: 30px;
    padding-right: 30px; }

  section#drawer > section#global-nav nav ul > li.no-anchor:after {
    content: '<';
    font-size: 18px;
    position: relative;
    float: right;
    right: 104px !important;
    top: -3px; }

  section#drawer > section#global-nav nav ul > li.about-us > span.no-anchor {
    width: 196px; }

  section#drawer > section#global-nav nav ul > li:nth-child(5) {
    font-size: 1.0rem; }

  nav#top-navigation {
    width: 54px !important;
    height: 54px !important; }
    nav#top-navigation > label#menu-label {
      width: 54px !important;
      height: 54px !important; }
      nav#top-navigation > label#menu-label:after {
        display: none !important; }

  nav#general-top-navigation {
    position: fixed;
    top: 0;
    right: 0;
    display: block;
    background-color: #000000;
    width: 108px !important;
    height: 54px !important; }
    nav#general-top-navigation button#close-btn {
      width: 54px !important;
      height: 54px !important; }
    nav#general-top-navigation div#close-btn {
      display: block;
      float: left;
      width: 54px !important;
      height: 54px !important;
      border: 0px;
      background: url(../images/icons/back_arrow.png) center center no-repeat;
      background-size: 13px 21px;
      cursor: pointer; }
      nav#general-top-navigation div#close-btn > a:after {
        display: none !important; }
      nav#general-top-navigation div#close-btn:focus {
        outline: 0; }
      nav#general-top-navigation div#close-btn > a {
        display: block;
        width: 100%;
        height: 100%; }
    nav#general-top-navigation label#menu-label {
      display: block;
      width: 54px !important;
      height: 54px !important;
      background: url(../images/icons/humburger.png) center center no-repeat;
      background-size: 22px 16px;
      float: right;
      position: relative;
      cursor: pointer; }
      nav#general-top-navigation label#menu-label:after {
        display: none !important; }

  header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    width: 100%; }
    header h1 {
      -webkit-margin-before: 0em;
      -webkit-margin-after: 0em;
      padding-top: 18px !important;
      padding-left: 15px !important;
      height: 27px; }
      header h1 span {
        height: 18px !important;
        top: 18px !important;
        left: 15px !important; }
        header h1 span:nth-child(1), header h1 span:nth-child(2) {
          background-size: 81px 18px !important; }
        header h1 span:nth-child(2) {
          height: 0px !important; }
      header h1 img {
        width: 81px !important;
        height: 18px !important; }
    header nav {
      position: fixed;
      top: 0;
      right: 0;
      display: block;
      background-color: #000000;
      width: 108px !important;
      height: 54px !important; }
      header nav button#close-btn {
        width: 54px !important;
        height: 54px !important; }
      header nav button#close-btn:after {
        display: none !important; }
      header nav div#close-btn {
        display: block;
        float: left;
        width: 54px !important;
        height: 54px !important;
        border: 0px;
        background: url(../images/icons/back_arrow.png) center center no-repeat;
        background-size: 13px 21px;
        cursor: pointer; }
        header nav div#close-btn:focus {
          outline: 0; }
        header nav div#close-btn > a {
          display: block;
          width: 100%;
          height: 100%; }
          header nav div#close-btn > a:after {
            display: none !important; }
      header nav label#menu-label {
        display: block;
        width: 54px !important;
        height: 54px !important;
        background: url(../images/icons/humburger.png) center center no-repeat;
        background-size: 22px 16px;
        float: right;
        position: relative;
        cursor: pointer; }
        header nav label#menu-label:after {
          display: none !important; }

  section#main-visual {
    height: 50vh !important; }

  footer {
    height: auto !important; }
    footer > small {
      position: relative;
      bottom: 0;
      margin: 20px 0;
      width: 100vw;
      text-align: center;
      display: block;
      right: 0; }
    footer > section#footer-info {
      width: 260px;
      height: auto !important;
      padding: 0 30px;
      margin: 0 auto;
      position: relative;
      left: 0;
      margin-bottom: 60px;
      margin-top: 60px; }
      footer > section#footer-info > h1 {
        height: 15px !important;
        margin-bottom: 22px; }
        footer > section#footer-info > h1 > img {
          width: 68px !important;
          height: 15px !important; }
      footer > section#footer-info > address > ul {
        margin: 20px 0;
        clear: left; }
        footer > section#footer-info > address > ul.address-list {
          margin-left: 0; }
          footer > section#footer-info > address > ul.address-list > li:nth-child(1) {
            width: 100%; }
      footer > section#footer-info > ul.sns-area {
        margin-top: 33px;
        top: 0; }
    footer > section#footer-map {
      clear: both;
      width: 100vw !important;
      height: 100vw;
      float: none; } }

/*# sourceMappingURL=common.css.map */
