/**********************************　
　サイト全体
************************************/

* {
  box-sizing: border-box;}

body {
  margin: 0;}



  /**********************************　
   headerメニュー<pc>
  ************************************/

header {
  height: 60px;
  width: 100%;
  padding: 0px 15px;
  background-color:#ffffff; opacity: 0.8;
  position: fixed;
  top: 0;
  z-index: 10;
  display: flex;}

.logo img {
  width:230px; margin-top:5px; margin-left: -10px;}

nav {
  margin: 0 0 0 auto;}

.pc ul {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;}

.pc a {
  font-size: 20px;
  color: #998675;
  text-decoration: none;
  display: block;
  line-height: 60px;
  padding: 0 20px;
  font-family: 'Lora', serif;}

.sm {
  display: none;}

/**********************************　
footerメニュー<footer>
************************************/
footer{
  margin-bottom:-32px;}

.footer-nav ul {
  border-top: solid 1px  #998675;
  border-bottom: solid 1px  #998675;
  display: flex;
  justify-content: center;
  list-style: none;
  padding-top:5px;
  padding-bottom:5px;
  margin: 0}

.footer-nav a {
  font-size: 30px;
  color: #998675;
  text-decoration: none;
  display: inline;
  line-height: 60px;
  padding: 0 50px;
  font-family: 'Lora', serif;}

  .footer-text{
   padding-top: 25px;
   padding-bottom: 10px;
   background-color: #dddcdb;}

  .footer-text img{
    margin-top:10px;}

  .footer-copyright p{
    border-top: solid 1px  #998675;
    border-bottom: solid 1px  #998675;
    background-color:#ffffff; opacity: 0.8;
    padding: 15px 0px;
    margin-top: -35px;
    font-size:30px;
    color: #998675;
    font-family: 'Lora', serif;}

/**********************************　
ハンバーガーメニュー<sm>
************************************/

@media (max-width: 900px) {
  .pc {
    display: none;}

    header {
      height: 58px;}

    .logo img {margin-left: -60px;
      width:200px;}

  #hamburger {
    background-color: transparent;
    position: relative;
    cursor: pointer;
    margin: 0 0 0 auto;
    height: 60px;
    width: 60px;
  }

  .icon span {
    position: absolute;
    left: 15px;
    width: 30px;
    height: 4px;
    background-color: #998675;
    border-radius: 8px;
    transition: ease 0.75s;}

  .icon span:nth-of-type(1) {
    top: 16px;
  }
  .icon span:nth-of-type(2) {
    top: 28px;
  }
  .icon span:nth-of-type(3) {
    bottom: 16px;
  }

  .close span:nth-of-type(1) {
    transform: rotate(45deg);
    top: 28px;
  }

  .close span:nth-of-type(2) {
    opacity: 0;
  }

  .close span:nth-of-type(3) {
      transform: rotate(-45deg);
      top: 28px;
  }

  .sm{
      background-image:url(header/nav-sm.png);
      background-size:cover;
      top: 57px;
      left: 0px;
      position: absolute;
      z-index: 10;
      width: 100%;

  }

  .sm ul {margin-top: -1px; margin-bottom:-1px; padding-top:20px; padding-bottom:20px;
     background: rgba(255, 255, 255, 0.45);
    text-align: center; margin-left: -2.5em;
    list-style: none;
  }


  a {font-size: 30px;
  color: #998675;
  text-decoration: none;
  display: inline;
  line-height: 60px;
  padding: 0 50px;
  font-family: 'Lora', serif;
  list-style:none;}

  .footer-nav ul{
     flex-wrap: wrap; margin-left: -5px;
    background-color: white;
    padding-top: 25px; padding-bottom:25px;}

  .footer-nav ul a{
    display:inline;
    font-size: 23px; padding: 3px 30px;
    border: solid 1px #998675;
    margin-right: 35px;}

  .footer-text img{
    margin-top: -10px;
    width: 200px;}


  .footer-copyright p{
    font-size: 12px;}


}
