@charset "utf-8";
@import url("parts/headerImage.css");
@import url("parts/footerSimple.css");

.headerImage .headerFix{
  height: 0;
}
.headerImage nav .wrap{
  display: block;
  height: 100%;
  padding: 10px;
}
.headerImage nav .inner{
  height: 100%;
  padding: 0;
}
.headerImage nav .navCts{
  height: 100%;
  padding: 64px 6%;
  border-style: solid;
  border-width: 1px;
  font-size: 1.6rem;
}
.headerImage nav .inner a::before{
  display: inline-block;
  width: 5px;
  height: 10px;
  border-radius: 50%;
  -webkit-transform: rotate(-30deg);
  transform: rotate(-30deg);
  margin-right: 15px;
}
.headerImage nav .inner a{
  display: block;
  height: 40px;
  line-height: 30px;
  margin: 0;
  font-size: 1.6rem;
}

@media screen and (min-width: 768px){
  .headerImage nav{
    position: fixed;
    top: 20px;
    bottom: auto;
    right: -260px;
    left: auto;
    display: inline-block;
    width: 260px;
    z-index: 460;
    height: auto;
    min-height: 20px;
    opacity: .5;
    -webkit-transition-property: right, opacity;
    transition-property: right, opacity;
    -webkit-transition-duration: 1s, .5s;
            transition-duration: 1s, .5s;
  }
  .headerImage nav.fixed{
    right: 0;
    -webkit-transition-property: right, opacity;
    transition-property: right, opacity;
    -webkit-transition-duration: 1s, .5s;
            transition-duration: 1s, .5s;
  }
  .headerImage nav:hover{
    opacity: 1;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: .3s;
            transition-duration: .3s;
  }
  .headerImage .navBtn{
    display: none;
  }
  .headerImage nav .wrap{
    height: auto;
  }
  .headerImage nav .inner li a::before{
    position: static;
    width: 5px;
    height: 10px;
    margin-right: 10px;
  }
  .headerImage nav .inner li a:hover::before{
    width: 5px;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .3s;
            transition-duration: .3s;
  }
  .headerImage nav .inner a span{
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: .02rem;
  }
  .headerImage nav .navCts{
    padding: 15px;
  }
}