@charset "UTF-8";
/*変数設定用*/
* {
  padding: 0px;
  margin: 0px;
  box-sizing: border-box; }

img {
  max-width: 100%;
  height: auto;
  width: auto;
  margin: 0;
  padding: 0;
  vertical-align: bottom;
  image-rendering: auto; }

li {
  list-style: none; }

a {
  color: #000;
  text-decoration: none;
  transition: all 0.3s ease; }
  a:hover {
    opacity: 0.7; }

i {
  font-style: normal; }

html {
  font-size: 62.5%; }

body {
  font-size: 1.6rem;
  font-size: 62.5%;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  background-color: #f9f9f9;
  letter-spacing: 0.05em;
  /*ゴシック*/ }
  body.open {
    height: 100vh;
    overflow: hidden; }

.all-wrap {
  overflow-x: hidden; }

header {
  width: 100%;
  height: auto;
  background-color: transparent;
  position: fixed;
  z-index: 100; }
  header .header-wrap {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 767px) {
      header .header-wrap {
        background-color: #fff;
        position: relative;
        z-index: 100;
        height: 55px; } }
    header .header-wrap .logo-wrap {
      max-width: 190px;
      width: 100%;
      padding: 35px 0 0 44px; }
      @media screen and (max-width: 767px) {
        header .header-wrap .logo-wrap {
          max-width: 150px;
          padding: 10px 0 0 10px; } }
    header .header-wrap .header-nav .header-list {
      display: flex; }
      header .header-wrap .header-nav .header-list .btn {
        display: block;
        padding: 55px 0 24px;
        width: 144px;
        color: #fff;
        font-size: 1.3rem;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0.1em;
        position: relative;
        transition: all 0.3s ease; }
        header .header-wrap .header-nav .header-list .btn.paper {
          background-color: #65bc8d;
          border-radius: 0 0 0 10px; }
          header .header-wrap .header-nav .header-list .btn.paper::before {
            content: "";
            display: inline-block;
            vertical-align: middle;
            background-image: url(../img/icon_paper.png);
            background-size: contain;
            background-repeat: no-repeat;
            width: 24px;
            height: 28px;
            position: absolute;
            top: 22px;
            left: 50%;
            transform: translateX(-50%); }
        header .header-wrap .header-nav .header-list .btn.mail {
          background-color: #589dc3; }
          header .header-wrap .header-nav .header-list .btn.mail::before {
            content: "";
            display: inline-block;
            vertical-align: middle;
            background-image: url(../img/icon_mail.png);
            background-size: contain;
            background-repeat: no-repeat;
            width: 23px;
            height: 29px;
            position: absolute;
            top: 28px;
            left: 50%;
            transform: translateX(-50%); }
    header .header-wrap .hamburger-btn {
      position: relative;
      width: 20px;
      height: 10px;
      top: 24px;
      right: 15px;
      cursor: pointer; }
      header .header-wrap .hamburger-btn span {
        display: inline-block;
        width: 20px;
        height: 2px;
        background-color: #000;
        position: absolute;
        transition: all 0.3s ease; }
        header .header-wrap .hamburger-btn span:nth-of-type(1) {
          top: 0;
          opacity: 1; }
        header .header-wrap .hamburger-btn span:nth-of-type(2) {
          top: 10px;
          opacity: 1; }
      header .header-wrap .hamburger-btn.open span {
        display: inline-block;
        width: 20px;
        height: 2px;
        background-color: #000;
        position: absolute; }
        header .header-wrap .hamburger-btn.open span:nth-of-type(1) {
          top: 7.5px;
          opacity: 1; }
        header .header-wrap .hamburger-btn.open span:nth-of-type(2) {
          opacity: 0; }
  header .sp-header-nav {
    background-color: #fff;
    position: absolute;
    z-index: 10;
    top: -150vh;
    transition: all 0.5s;
    overflow: auto;
    height: 100vh; }
    header .sp-header-nav.open {
      top: 55px; }
    header .sp-header-nav .nav-inner {
      padding-left: 5%;
      padding-right: 5%; }
    header .sp-header-nav .sp-header-list {
      padding: 25px 0 45px; }
      header .sp-header-nav .sp-header-list li {
        border-bottom: 1px solid #ccc; }
      header .sp-header-nav .sp-header-list a {
        font-size: 1.4rem;
        padding: 17px 0;
        display: block;
        color: #666;
        position: relative; }
        header .sp-header-nav .sp-header-list a::after {
          content: '';
          width: 10px;
          height: 10px;
          border: 0;
          border-bottom: solid 2px #999;
          border-right: solid 2px #999;
          position: absolute;
          right: 10px;
          top: 50%;
          transform: rotate(45deg) translateY(-50%); }
    header .sp-header-nav .bg-yellow {
      background-color: #fff68c;
      padding: 45px 0 200px;
      position: relative; }
      header .sp-header-nav .bg-yellow .cotact-catch {
        text-align: center;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: -20px;
        width: 100%; }
        header .sp-header-nav .bg-yellow .cotact-catch span {
          display: inline-block;
          color: #fff;
          font-size: 1.4rem;
          font-weight: bold;
          background-color: #ff9c00;
          padding: 10px 30px;
          position: relative;
          border-radius: 10px; }
          header .sp-header-nav .bg-yellow .cotact-catch span::before {
            content: "";
            display: block;
            width: 0;
            height: 0;
            position: absolute;
            border-top: 15px solid #ff9c00;
            border-right: 15px solid transparent;
            border-left: 15px solid transparent;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            bottom: -14px;
            z-index: 2; }
      header .sp-header-nav .bg-yellow .contact-ttl {
        font-size: 2.15rem;
        font-weight: bold;
        text-align: center;
        color: #000; }
      header .sp-header-nav .bg-yellow .tel {
        text-align: center; }
        header .sp-header-nav .bg-yellow .tel a {
          font-family: 'Zen Maru Gothic', sans-serif;
          font-size: 2.58rem;
          color: #ff9c00;
          letter-spacing: 0.1em;
          font-weight: bold; }
      header .sp-header-nav .bg-yellow .btn-flex {
        width: 100%;
        margin: 20px auto 0;
        display: flex;
        z-index: 2;
        flex-wrap: wrap;
        row-gap: 15px;
        margin: 10px auto 0;
        justify-content: center;
        z-index: 2;
        position: relative; }
        header .sp-header-nav .bg-yellow .btn-flex .btn-wrap {
          text-align: center; }
          header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn {
            display: inline-block;
            text-align: center;
            width: 315px;
            padding: 20px 0;
            color: #fff;
            font-size: 1.7rem;
            position: relative;
            border-radius: 43px;
            font-weight: bold; }
            header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn::before {
              content: "";
              display: block;
              background-size: contain;
              background-repeat: no-repeat;
              position: absolute;
              left: 30px;
              top: 50%;
              transform: translateY(-50%); }
            header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn.paper {
              background-color: #65bc8d;
              box-shadow: 0px 4px 0px 0px #348b5c; }
              header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn.paper::before {
                background-image: url(../img/icon_paper.png);
                width: 22px;
                height: 25px; }
            header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn.mail {
              background-color: #589dc3;
              box-shadow: 0px 4px 0px 0px #2d6c8e; }
              header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn.mail::before {
                background-image: url(../img/icon_mail.png);
                width: 25px;
                height: 20px; }
            header .sp-header-nav .bg-yellow .btn-flex .btn-wrap .btn::after {
              content: "";
              display: block;
              width: 9px;
              height: 9px;
              position: absolute;
              border-top: 3px solid #fff;
              border-right: 3px solid #fff;
              transform: rotate(45deg) translateY(-50%);
              right: 40px;
              top: 50%;
              right: 50px; }

footer {
  width: 100%; }
  footer .inner {
    max-width: 1200px; }
  footer .footer-flex {
    display: flex;
    column-gap: 133px;
    margin: 55px 0 0; }
    @media screen and (max-width: 767px) {
      footer .footer-flex {
        display: block;
        margin: 27px 0 0; } }
  footer .logo-wrap {
    width: 120px;
    margin: 10px 0 0; }
    @media screen and (max-width: 767px) {
      footer .logo-wrap {
        margin: 0 auto; } }
  @media screen and (max-width: 767px) {
    footer .des-wrap {
      margin: 20px 0 0; } }
  footer .des-wrap .des {
    font-size: 1.4rem;
    line-height: 1.7;
    font-weight: bold; }
    @media screen and (max-width: 767px) {
      footer .des-wrap .des {
        font-size: 1.2rem; } }
  footer .des-wrap .info-flex {
    display: flex;
    column-gap: 28px; }
  footer .des-wrap .info-wrap {
    display: flex;
    column-gap: 14px; }
    footer .des-wrap .info-wrap .ttl {
      font-size: 1.4rem;
      line-height: 1.7;
      font-weight: bold; }
      @media screen and (max-width: 767px) {
        footer .des-wrap .info-wrap .ttl {
          font-size: 1.2rem; } }
    footer .des-wrap .info-wrap .num {
      font-size: 1.4rem;
      line-height: 1.7;
      font-weight: bold; }
      @media screen and (max-width: 767px) {
        footer .des-wrap .info-wrap .num {
          font-size: 1.2rem; } }
  footer .cr-wrap {
    background-color: #000;
    margin: 60px 0 0; }
    @media screen and (max-width: 767px) {
      footer .cr-wrap {
        margin: 30px 0 0; } }
    footer .cr-wrap .copyright {
      display: block;
      text-align: center;
      color: #fff;
      padding: 17px 0;
      font-size: 1.2rem;
      letter-spacing: 0.1em; }
      @media screen and (max-width: 767px) {
        footer .cr-wrap .copyright {
          padding: 14px 0; } }

@media screen and (min-width: 768px) {
  .vpc {
    display: block; } }
@media screen and (max-width: 767px) {
  .vpc {
    display: none; } }

@media screen and (min-width: 768px) {
  .vsp {
    display: none; } }
@media screen and (max-width: 767px) {
  .vsp {
    display: block; } }

.inner {
  max-width: 1430px;
  margin: 0 auto;
  padding: 0 120px; }
  @media only screen and (min-width: 767px) and (max-width: 1200px) {
    .inner {
      padding: 0 60px; } }
  @media only screen and (min-width: 767px) and (max-width: 1000px) {
    .inner {
      padding: 0 30px; } }
  @media screen and (max-width: 767px) {
    .inner {
      padding-left: 5%;
      padding-right: 5%; } }

/* ページTOP */
#page_top {
  max-width: 180px;
  width: 100%;
  position: fixed;
  bottom: -300px;
  right: 15px;
  z-index: 90; }
  @media screen and (max-width: 767px) {
    #page_top {
      max-width: 100px; } }
  #page_top.on {
    bottom: 0; }
  #page_top a {
    display: inline-block;
    text-align: center; }
    #page_top a .txt {
      font-size: 1.6rem;
      color: #333;
      font-weight: bolder;
      margin: 0 0 10px -25px;
      position: relative; }
      #page_top a .txt::before, #page_top a .txt::after {
        content: "";
        position: absolute;
        bottom: -3px;
        width: 1px;
        height: 20px;
        background-color: #333; }
      #page_top a .txt::before {
        left: -10px;
        transform: rotate(-30deg); }
      #page_top a .txt::after {
        right: -10px;
        transform: rotate(30deg); }
    #page_top a:hover {
      opacity: 1 !important; }
      #page_top a:hover .txt {
        animation: ueiku 1.0s infinite; }

@keyframes ueiku {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(1.2); }
  100% {
    transform: scale(1); } }

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