@charset "UTF-8";
.pc {
  display: block; }

.sp {
  display: none; }

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  color: #333333;
  font-family: "Noto Sans JP";
  text-align: justify;
  list-style-type: none;
  text-decoration: none; }

body {
  position: relative; }

.menu-btn {
  display: none; }

.nav-menu ul {
  display: none; }

#spBottomNavi {
  display: none; }

#topBtn {
  display: none;
  position: fixed;
  bottom: 50px;
  right: 50px;
  width: 45px;
  text-align: center;
  cursor: pointer;
  font-size: 12px;
  font-weight: bold;
  z-index: 2000;
  transition: position 0.3s ease; }
  #topBtn img {
    width: 45px;
    height: 45px;
    display: block;
    z-index: 2000; }
  #topBtn > div {
    color: #a28462;
    text-align: center; }

header {
  position: relative;
  padding: 100px 0 150px 0; }
  header .headerLogo {
    position: absolute;
    top: 30px;
    left: 100px;
    transition: 0.3s all; }
    header .headerLogo:hover {
      top: 20px; }
    header .headerLogo img {
      width: 150px; }
  header .nav {
    position: absolute;
    top: 130px;
    right: 100px; }
    header .nav ul {
      display: flex;
      justify-content: space-between;
      width: 760px; }
      header .nav ul li a {
        position: relative;
        display: inline-block;
        text-decoration: none;
        color: #333;
        font-size: 18px;
        font-family: "hina-mincho", sans-serif;
        font-weight: 400;
        font-style: normal;
        transition: 0.3s all; }
        header .nav ul li a:hover {
          color: #a28462; }
      header .nav ul li a::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -5px;
        width: 0;
        height: 1px;
        background-color: #a28462;
        transition: all 0.3s ease-out;
        transform: translateX(-50%); }
      header .nav ul li a:hover::after {
        width: 100%; }
  header .contact {
    position: absolute;
    top: 0;
    right: 100px; }
    header .contact a {
      background-color: #a28462;
      font-size: 18px;
      padding: 10px 20px 12px 20px;
      display: block;
      color: white;
      font-family: "hina-mincho", sans-serif;
      font-weight: 400;
      font-style: normal;
      border-bottom-right-radius: 5px;
      border-bottom-left-radius: 5px;
      transition: 0.3s all;
      text-decoration: none; }
      header .contact a img {
        height: 20px;
        margin-right: 10px;
        position: relative;
        top: 2px; }
      header .contact a:hover {
        background-color: #6D6D6D; }
  header .nameLeft {
    width: 16px;
    position: fixed;
    left: 50px;
    top: calc(100vh/2 - 50px);
    z-index: 1000; }
  header .logoEnglish {
    width: 455px;
    position: absolute;
    top: 850px;
    right: 50px; }

#contact {
  padding: 100px 0;
  position: relative; }
  #contact .line {
    position: absolute;
    left: 0;
    top: 331px;
    border-top-right-radius: 300px;
    border-bottom-right-radius: 300px;
    width: calc(50% + 550px);
    height: 400px;
    padding: 100px 0 100px 150px;
    border: solid thin #a28462;
    border-left: none;
    z-index: 0; }
  #contact h2 {
    text-align: center;
    color: #a28462;
    font-size: 40px;
    font-family: "hina-mincho", sans-serif;
    font-weight: 400;
    font-style: normal; }
    #contact h2 span {
      font-size: 40px;
      color: #a28462;
      font-family: "hina-mincho", sans-serif;
      font-weight: 400;
      font-style: normal; }
  #contact .titleEn {
    font-family: "hina-mincho", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    text-align: center;
    color: #a28462; }
  #contact .part01 {
    display: table;
    margin: 150px auto 0 auto; }
    #contact .part01 > div {
      display: inline-block;
      vertical-align: bottom; }
      #contact .part01 > div p {
        width: 580px;
        font-size: 18px;
        line-height: 1.8; }
      #contact .part01 > div .consultation {
        width: 580px;
        padding: 15px 0;
        text-align: center;
        color: white;
        background-color: #a28462;
        box-shadow: 0 0 0 5px #a28462;
        border: solid thin white;
        border-radius: 5px;
        display: block;
        font-size: 22px;
        margin: 50px auto 0 auto;
        transition: 0.3s all;
        position: relative;
        left: 0; }
        #contact .part01 > div .consultation:hover {
          left: -10px; }
        #contact .part01 > div .consultation span {
          background: white;
          width: 50px;
          text-align: center;
          display: inline-block;
          margin-left: 15px;
          color: #a28462;
          font-size: 18px;
          padding-bottom: 2px;
          line-height: 30px;
          position: relative;
          top: -2px; }
      #contact .part01 > div .document {
        width: 590px;
        padding: 4px 4px;
        text-align: center;
        color: #a28462;
        border: solid thin #a28462;
        border-radius: 5px;
        display: inline-block;
        letter-spacing: 1em;
        font-size: 22px;
        margin: 30px auto 0 auto;
        transition: 0.3s all;
        position: relative;
        left: 0; }
        #contact .part01 > div .document:hover {
          left: -10px; }
        #contact .part01 > div .document > span {
          padding: 15px 0;
          border: solid thin #a28462;
          border-radius: 3px;
          display: block;
          width: 100%;
          text-align: center;
          color: #a28462; }
          #contact .part01 > div .document > span span {
            background: #a28462;
            width: 50px;
            text-align: center;
            display: inline-block;
            margin-left: 15px;
            color: white;
            letter-spacing: 0em;
            font-size: 18px;
            padding-bottom: 2px;
            line-height: 30px;
            position: relative;
            top: -2px; }
      #contact .part01 > div img {
        width: 320px;
        margin-left: 20px;
        z-index: 3;
        position: relative; }
  #contact .part02 {
    color: white;
    background-color: #f4ece4;
    box-shadow: 0 0 0 5px #f4ece4;
    border: solid thin white;
    border-radius: 5px;
    padding: 20px;
    width: 920px;
    margin: 70px auto 0 auto; }
    #contact .part02 > img {
      width: 400px;
      display: inline-block;
      vertical-align: top; }
    #contact .part02 dl {
      width: 440px;
      display: inline-block;
      vertical-align: top;
      margin-left: 25px; }
      #contact .part02 dl dt {
        color: white;
        font-size: 31px;
        font-family: "hina-mincho", sans-serif;
        font-weight: 400;
        font-style: normal;
        color: #a28462; }
      #contact .part02 dl dd {
        font-size: 18px;
        width: 100%;
        line-height: 1.8;
        margin: 20px 0; }
      #contact .part02 dl a {
        width: 100%;
        padding: 15px 0;
        text-align: center;
        background: white;
        display: block;
        border-radius: 5px;
        color: #a28462;
        font-size: 22px;
        letter-spacing: 0.5em;
        transition: 0.3s all; }
        #contact .part02 dl a:hover {
          background-color: #CCB499; }
        #contact .part02 dl a img {
          height: 28px;
          position: relative;
          top: -2px;
          margin-right: 15px;
          display: inline-block;
          vertical-align: middle; }

footer > div:first-of-type {
  background-color: #a28462;
  padding: 70px 0 50px 0;
  position: relative; }
  footer > div:first-of-type .footerLogo {
    width: 300px;
    margin: 0 auto 30px auto;
    display: block; }
  footer > div:first-of-type p {
    color: white;
    line-height: 2;
    text-align: center;
    font-size: 16px;
    position: relative; }
  footer > div:first-of-type > div {
    display: flex;
    justify-content: space-between;
    margin: 30px auto 0 auto;
    width: 200px; }
    footer > div:first-of-type > div a {
      position: relative;
      top: 0;
      transition: 0.3s all; }
      footer > div:first-of-type > div a:hover {
        top: -10px; }
      footer > div:first-of-type > div a img {
        height: 40px; }
  footer > div:first-of-type .privacyPolicy {
    font-size: 12px;
    position: absolute;
    bottom: 65x;
    right: 50px;
    color: white;
    text-decoration: underline;
    text-underline-offset: 3px;
    z-index: 2000; }
    footer > div:first-of-type .privacyPolicy:hover {
      opacity: 0.5; }
footer .copyright {
  background-color: white;
  padding: 30px 0; }
  footer .copyright p {
    text-align: center;
    font-size: 16px;
    color: #a28462; }

@media (max-width: 600px) {
  .menu-btn {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1001;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.3s ease;
    display: block; }

  .menu-btn img {
    width: 60px;
    height: 60px; }

  .menu-btn.hidden {
    opacity: 0;
    pointer-events: none; }

  .nav-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100vh;
    z-index: 1000;
    transition: right 0.4s ease;
    background-color: white;
    justify-content: center;
    align-items: center; }

  /*.nav-menu ul {
    list-style: none;
    padding: 0;
    text-align: center;
  	margin: 0;
  	display: block;
  }
  
  .nav-menu li {
    margin: 20px 0;
  }
  
  .nav-menu a {
    color: black;
    text-decoration: none;
    font-size: 18px;
  }*/
  /*.menu-btn {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1001;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.3s ease;
  	display: block;
  	
  }
  
  .menu-btn img {
    width: 60px;
    height: 60px;
  }
  
  .menu-btn.hidden {
    opacity: 0;
    pointer-events: none;
  }
  
  */
  .nav-menu div {
    margin-top: 50px; }
    .nav-menu div i {
      display: block; }
    .nav-menu div .youtubeLogo {
      width: 100px;
      display: block;
      margin: 20px auto 0 auto; }
    .nav-menu div .tel {
      padding: 10px;
      background: #009EB5;
      font-size: 25px;
      line-height: 1;
      border-radius: 5px;
      color: white;
      margin: 20px auto;
      display: table;
      text-decoration: none; }

  .nav-menu ul:first-of-type {
    background: white;
    margin: 0 auto;
    padding: 120px 0 0 0;
    width: 100%;
    display: block; }
    .nav-menu ul:first-of-type li {
      list-style-type: none;
      padding: 0;
      width: 100%;
      border-bottom: 1px solid #fff;
      background: white; }
      .nav-menu ul:first-of-type li:last-child {
        padding-bottom: 0;
        border-bottom: none; }
      .nav-menu ul:first-of-type li:hover {
        background: #ddd; }
      .nav-menu ul:first-of-type li a {
        display: block;
        color: #000;
        padding: 1em 0;
        text-decoration: none;
        text-align: center;
        font-family: "hina-mincho", sans-serif;
        font-weight: 400;
        font-style: normal; }
  .nav-menu ul:last-of-type {
    display: flex;
    justify-content: space-between;
    width: 200px;
    margin: 50px auto 0 auto; }
    .nav-menu ul:last-of-type li a {
      width: 40px; }
      .nav-menu ul:last-of-type li a img {
        width: 40px;
        height: auto; }

  .nav-menu ul li .tel {
    font-size: 20px; }

  .nav-menu ul li a img {
    width: 40px; }

  /* メニュー表示時のクラス */
  .nav-menu.open {
    right: 0; }

  #topBtn {
    display: none;
    position: fixed;
    right: 20px;
    width: 45px;
    text-align: center;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
    z-index: 800;
    transition: position 0.3s ease; }
    #topBtn img {
      width: 45px;
      height: 45px;
      display: block;
      z-index: 2000; }
    #topBtn > div {
      color: #a28462;
      text-align: center; }

  header {
    display: none; }

  #contact {
    padding: 70px 0; }
    #contact .line {
      display: none; }
    #contact h2 {
      text-align: center;
      color: #a28462;
      font-size: 40px;
      font-family: "hina-mincho", sans-serif;
      font-weight: 400;
      font-style: normal; }
      #contact h2 span {
        font-size: 40px;
        color: #a28462;
        font-family: "hina-mincho", sans-serif;
        font-weight: 400;
        font-style: normal; }
    #contact .titleEn {
      font-family: "hina-mincho", sans-serif;
      font-weight: 400;
      font-style: normal;
      font-size: 16px;
      text-align: center;
      color: #a28462; }
    #contact .part01 {
      display: block;
      margin: 50px auto 0 auto;
      position: relative; }
      #contact .part01 > div {
        display: block;
        width: 85%;
        margin: 0 auto; }
        #contact .part01 > div p {
          width: 100%;
          font-size: 16px;
          line-height: 1.8;
          margin-bottom: 130px; }
        #contact .part01 > div .consultation {
          width: 100%;
          padding: 10px 0;
          text-align: center;
          color: white;
          background-color: #a28462;
          box-shadow: 0 0 0 5px #a28462;
          border: solid thin white;
          border-radius: 5px;
          display: block;
          font-size: 18px;
          margin: 50px auto 0 auto;
          transition: 0.3s all;
          position: relative;
          left: 0;
          z-index: 1; }
          #contact .part01 > div .consultation span {
            background: white;
            width: 50px;
            text-align: center;
            display: inline-block;
            margin-left: 15px;
            color: #a28462;
            font-size: 18px;
            padding-bottom: 2px;
            line-height: 30px;
            position: relative;
            top: 0px; }
        #contact .part01 > div .document {
          width: 100%;
          padding: 4px 4px;
          text-align: center;
          color: #a28462;
          border: solid thin #a28462;
          border-radius: 5px;
          display: inline-block;
          letter-spacing: 1em;
          font-size: 18px;
          margin: 30px auto 0 auto;
          transition: 0.3s all;
          position: relative;
          left: 0;
          z-index: 1;
          background-color: white; }
          #contact .part01 > div .document:hover {
            left: -10px; }
          #contact .part01 > div .document > span {
            padding: 15px 0;
            border: solid thin #a28462;
            border-radius: 3px;
            display: block;
            width: 100%;
            text-align: center;
            color: #a28462; }
            #contact .part01 > div .document > span span {
              background: #a28462;
              width: 50px;
              text-align: center;
              display: inline-block;
              margin-left: 15px;
              color: white;
              letter-spacing: 0em;
              font-size: 18px;
              padding-bottom: 2px;
              line-height: 30px;
              position: relative;
              top: 0px; }
        #contact .part01 > div img {
          width: 250px;
          margin-left: 0px;
          position: absolute;
          bottom: 0;
          right: 10px;
          z-index: 0; }
    #contact .part02 {
      color: white;
      background-color: #f4ece4;
      box-shadow: 0 0 0 5px #f4ece4;
      border: solid thin white;
      border-radius: 5px;
      padding: 20px;
      width: 90%;
      margin: 70px auto 0 auto; }
      #contact .part02 > img {
        width: 100%;
        display: block; }
      #contact .part02 dl {
        width: 100%;
        display: block;
        margin-left: 0px; }
        #contact .part02 dl dt {
          color: white;
          font-size: 25px;
          font-family: "hina-mincho", sans-serif;
          font-weight: 400;
          font-style: normal;
          color: #a28462;
          margin-top: 30px; }
        #contact .part02 dl dd {
          font-size: 16px;
          width: 100%;
          line-height: 1.8;
          margin: 20px 0; }
        #contact .part02 dl a {
          width: 100%;
          padding: 15px 0;
          text-align: center;
          background: white;
          display: block;
          border-radius: 5px;
          color: #a28462;
          font-size: 22px;
          letter-spacing: 0.5em;
          transition: 0.3s all; }
          #contact .part02 dl a:hover {
            background-color: #CCB499; }
          #contact .part02 dl a img {
            height: 28px;
            position: relative;
            top: -2px;
            margin-right: 15px;
            display: inline-block;
            vertical-align: middle; }

  footer > div:first-of-type {
    background-color: #a28462;
    padding: 70px 0 50px 0; }
    footer > div:first-of-type .footerLogo {
      width: 250px;
      margin: 0 auto 30px auto;
      display: block; }
    footer > div:first-of-type p {
      color: white;
      line-height: 2;
      text-align: center;
      font-size: 14px; }
    footer > div:first-of-type a {
      color: white; }
    footer > div:first-of-type > div {
      display: flex;
      justify-content: space-between;
      margin: 30px auto 0 auto;
      width: 200px; }
      footer > div:first-of-type > div a {
        position: relative;
        top: 0;
        transition: 0.3s all; }
        footer > div:first-of-type > div a img {
          height: 40px; }
  footer .privacyPolicy {
    display: none; }
  footer .copyright {
    background-color: white;
    padding: 30px 0 90px 0; }
    footer .copyright p {
      text-align: center;
      font-size: 14px;
      color: #a28462; }

  #spBottomNavi {
    z-index: 10;
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #a28462;
    height: auto;
    border-top: none;
    display: block; }
    #spBottomNavi ul {
      width: 100%;
      font-size: 0;
      border-top: none; }
    #spBottomNavi li {
      width: 33%;
      display: inline-block;
      vertical-align: top;
      color: white;
      border-left: solid 2px white;
      height: 60px; }
    #spBottomNavi li:last-of-type {
      border-right: none; }
    #spBottomNavi li:first-of-type {
      border-left: none; }
    #spBottomNavi a {
      padding: 20px 0 0 0;
      height: 60px;
      display: block;
      font-size: 16px;
      cursor: pointer;
      text-align: center;
      color: white; }
      #spBottomNavi a .spTopBtn {
        width: 25px;
        margin-right: 5px;
        display: inline-block;
        vertical-align: middle;
        margin-top: -7px; }
      #spBottomNavi a .spTelBtn {
        width: 25px;
        margin-right: 5px;
        display: inline-block;
        vertical-align: middle;
        margin-top: -5px; }
      #spBottomNavi a .spMailBtn {
        width: 25px;
        margin-right: 7px;
        display: inline-block;
        vertical-align: middle;
        margin-top: -4px; }
    #spBottomNavi a:hover {
      opacity: 0.3; } }