/* Scss Document */
@keyframes anime1 {
  0% {
    margin-top: -20px;
    opacity: 0; }
  100% {
    margin-top: 0;
    opacity: 1; } }
* {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 100%;
  list-style-type: none;
  color: #4c4948; }

a {
  color: #4c4948; }
  a:hover {
    text-decoration: none; }
  a img {
    width: 100%;
    height: auto; }

.br-sp {
  display: none; }
  @media (max-width: 640px) {
    .br-sp {
      display: block; } }

.btm5p {
  margin-bottom: 5%; }

.btm10p {
  margin-bottom: 10%; }

.center {
  display: block;
  text-align: center; }

.box1000 {
  max-width: 1000px;
  margin: 0 auto; }
  @media (max-width: 1000px) {
    .box1000 {
      padding: 0 15px; } }

.show-sp {
  display: none; }
  @media (max-width: 640px) {
    .show-sp {
      display: block; } }

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

.ggmap {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  border-radius: 10px; }
  .ggmap iframe,
  .ggmap object,
  .ggmap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.f-larger {
  font-size: 120%; }

.scale {
  display: block;
  width: 100%;
  overflow: hidden; }
  .scale img {
    transition: all linear 0.3s; }
  .scale:hover img {
    transform: scale(1.05, 1.05); }

.w100 {
  width: 100%;
  height: auto; }

.btn a {
  display: block;
  background: #7eb2d6;
  font-weight: bold;
  color: #FFF;
  padding: 18px 25px;
  font-size: 1.2em;
  border-radius: 10px;
  text-decoration: none;
  transition: all linear 0.3s; }
  .btn a:hover {
    opacity: 0.7; }

#header {
  border-top: #76bc21 10px solid; }
  #header .box1000 {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;
    padding: 15px 0; }
    #header .box1000 h1 {
      width: 261px; }
    #header .box1000 .right {
      width: calc(100% - 261px);
      display: flex;
      justify-content: flex-end;
      align-items: center; }
      #header .box1000 .right .btn {
        margin-right: 15px; }
  @media (max-width: 1000px) {
    #header .box1000 {
      padding: 15px; } }
  @media (max-width: 640px) {
    #header {
      border-top: #76bc21 5px solid; }
      #header .box1000 {
        padding: 10px; }
        #header .box1000 h1 {
          width: 170px; }
        #header .box1000 .right {
          width: calc(100% - 170px);
          display: flex;
          justify-content: flex-end;
          align-items: center; }
          #header .box1000 .right .btn {
            margin-right: 0; }
            #header .box1000 .right .btn a {
              padding: 10px 20px; } }
          @media (max-width: 640px) and (max-width: 420px) {
            #header .box1000 .right .btn a {
              font-size: 0.9em;
              padding: 6px 12px;
              border-radius: 5px; } }
  @media (max-width: 640px) {
          #header .box1000 .right .qr {
            display: none; } }
  @media (max-width: 420px) {
    #header .box1000 {
      padding: 5px 10px; } }

#mainvisual {
  display: block;
  padding: 2% 0;
  margin-bottom: 20px;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bdc3ca+35,bdc3ca+100&0+35,1+100 */
  background: -moz-radial-gradient(center, ellipse cover, rgba(189, 195, 202, 0) 35%, #bdc3ca 100%);
  /* FF3.6-15 */
  background: -webkit-radial-gradient(center, ellipse cover, rgba(189, 195, 202, 0) 35%, #bdc3ca 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: radial-gradient(ellipse at center, rgba(189, 195, 202, 0) 35%, #bdc3ca 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bdc3ca', endColorstr='#bdc3ca',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */ }
  #mainvisual .wrap {
    max-width: 1000px;
    margin: 0 auto;
    display: block;
    background: url("../../images/mainimg01.png") no-repeat;
    background-size: 62%;
    background-position: right top 0;
    padding-bottom: 11em; }
    #mainvisual .wrap h2 {
      display: block;
      background: url("../../images/mainimg04.png") no-repeat;
      text-align: center;
      font-size: 1.3em;
      font-weight: normal;
      background-size: 100%;
      padding: 15px;
      max-width: 470px;
      margin: 2% 0 10px 0; }
    #mainvisual .wrap .txt01, #mainvisual .wrap .txt02 {
      margin-bottom: 5px;
      max-width: 470px;
      margin-bottom: 7px; }
      #mainvisual .wrap .txt01 img, #mainvisual .wrap .txt02 img {
        width: 100%;
        height: auto; }
    @media (max-width: 1000px) {
      #mainvisual .wrap {
        padding: 0 10px;
        background-size: 64vw;
        padding-bottom: 0;
        height: 55vw; } }
    @media (max-width: 860px) {
      #mainvisual .wrap h2 {
        max-width: 55vw;
        padding: 2%;
        font-size: 2.5vw;
        margin-bottom: 7px; }
      #mainvisual .wrap .txt01, #mainvisual .wrap .txt02 {
        width: 100%;
        max-width: 55vw; } }
    @media (max-width: 640px) {
      #mainvisual .wrap {
        background: url("../../images/mainimg01_sp.png") no-repeat;
        background-position: center bottom;
        background-size: 100%;
        height: auto;
        padding-bottom: 30vw; }
        #mainvisual .wrap h2 {
          max-width: 70vw;
          padding: 2%;
          font-size: 2.5vw;
          margin-bottom: 7px; }
        #mainvisual .wrap .txt01, #mainvisual .wrap .txt02 {
          width: 100%;
          max-width: 70vw; } }
    @media (max-width: 420px) {
      #mainvisual .wrap {
        padding-bottom: 37vw; }
        #mainvisual .wrap h2 {
          max-width: 100%;
          padding: 2%;
          font-size: 3vw;
          margin: 15px 20px 5px 20px; }
        #mainvisual .wrap .txt01, #mainvisual .wrap .txt02 {
          max-width: calc(100% - 40px);
          margin: 0 20px 5px 20px; } }

#henka01 {
  display: block;
  background: url("../../images/bg01.png"); }
  #henka01 .ttl {
    display: block;
    background: url("../../images/arrow_green.png") no-repeat;
    background-position: center bottom;
    padding-bottom: 22px; }
    #henka01 .ttl .wrap {
      display: block;
      background: #76bc21; }
      #henka01 .ttl .wrap .box {
        display: flex;
        align-items: center;
        padding: 10px;
        max-width: 1020px;
        margin: 0 auto; }
        #henka01 .ttl .wrap .box .icn {
          width: 136px; }
        #henka01 .ttl .wrap .box h3 {
          width: calc(100% - 136px);
          padding-left: 20px; }
          #henka01 .ttl .wrap .box h3 img {
            width: 100%;
            height: auto; }
        @media (max-width: 1000px) {
          #henka01 .ttl .wrap .box .icn {
            width: 15%; }
            #henka01 .ttl .wrap .box .icn img {
              width: 100%;
              height: auto; }
          #henka01 .ttl .wrap .box h3 {
            width: 85%; } }
        @media (max-width: 640px) {
          #henka01 .ttl .wrap .box {
            flex-wrap: wrap; }
            #henka01 .ttl .wrap .box .icn {
              width: 100%;
              text-align: center;
              margin-bottom: 10px; }
              #henka01 .ttl .wrap .box .icn img {
                max-width: 100px; }
            #henka01 .ttl .wrap .box h3 {
              width: 100%;
              padding: 0; }
              #henka01 .ttl .wrap .box h3 img {
                margin: 0 auto;
                max-width: 414px; } }
  #henka01 .box1000 {
    padding: 4% 2%; }

#henka02 {
  margin-bottom: 6%; }
  #henka02 .ttl {
    display: block;
    background: url("../../images/arrow_orange.png") no-repeat;
    background-position: center bottom;
    padding-bottom: 22px; }
    #henka02 .ttl .wrap {
      display: block;
      background: #f29419; }
      #henka02 .ttl .wrap .box {
        display: flex;
        align-items: center;
        padding: 10px;
        max-width: 1020px;
        margin: 0 auto; }
        #henka02 .ttl .wrap .box .icn {
          width: 136px; }
        #henka02 .ttl .wrap .box h3 {
          width: calc(100% - 136px);
          padding-left: 20px;
          font-size: 2.2em;
          line-height: 1.3;
          font-weight: bold;
          color: #FFF; }
        @media (max-width: 1000px) {
          #henka02 .ttl .wrap .box .icn {
            width: 15%; }
            #henka02 .ttl .wrap .box .icn img {
              width: 100%;
              height: auto; }
          #henka02 .ttl .wrap .box h3 {
            width: 85%;
            font-size: 3.3vw; } }
        @media (max-width: 640px) {
          #henka02 .ttl .wrap .box {
            flex-wrap: wrap; }
            #henka02 .ttl .wrap .box .icn {
              width: 100%;
              text-align: center;
              margin-bottom: 10px; }
              #henka02 .ttl .wrap .box .icn img {
                max-width: 100px; }
            #henka02 .ttl .wrap .box h3 {
              width: 100%;
              padding: 0;
              text-align: center;
              font-size: 1.5em; } }
  #henka02 .wrap01 {
    max-width: 1020px;
    margin: 5% auto 0 auto;
    padding: 0 10px;
    display: flex; }
    #henka02 .wrap01 .photo {
      width: 25%;
      padding-right: 5%; }
      #henka02 .wrap01 .photo .a1 b {
        display: block;
        font-size: 90%;
        color: #f29419;
        font-weight: 400; }
      #henka02 .wrap01 .photo .a1 em {
        display: block;
        font-size: 1.3em;
        font-style: normal; }
      #henka02 .wrap01 .photo .a1 p {
        display: block;
        font-size: 70%; }
      #henka02 .wrap01 .photo .a2 img {
        width: 100%;
        height: auto;
        margin: 10px 0; }
      #henka02 .wrap01 .photo .a3 p {
        display: block;
        font-size: 70%; }
        #henka02 .wrap01 .photo .a3 p.border {
          border-bottom: #4c4948 1px solid;
          padding-bottom: 10px;
          margin-bottom: 10px; }
    #henka02 .wrap01 .text {
      width: 75%; }
      #henka02 .wrap01 .text .t01 {
        margin-bottom: 2%; }
        #henka02 .wrap01 .text .t01 ul {
          display: flex;
          align-items: center; }
          #henka02 .wrap01 .text .t01 ul li.before {
            background: url("../../images/before.png") no-repeat;
            background-size: 60px;
            background-position: top left;
            padding: 40px 0 20px 0;
            line-height: 1.3;
            font-weight: 600; }
          #henka02 .wrap01 .text .t01 ul li:nth-of-type(2) {
            width: 120px;
            text-align: center; }
            #henka02 .wrap01 .text .t01 ul li:nth-of-type(2) img {
              width: 80px;
              height: auto; }
          #henka02 .wrap01 .text .t01 ul li.after {
            background: url("../../images/after.png") no-repeat;
            background-size: 150px;
            background-position: top left;
            padding: 50px 10px 25px 0;
            line-height: 1.3;
            font-size: 1.2em;
            font-weight: 600;
            color: #FFF;
            text-shadow: 0 0 3px #76bc21, 0 0 3px #76bc21, 0 0 3px #76bc21, 0 0 3px #76bc21, 0 0 3px #76bc21, 0 0 3px #76bc21, 0 0 3px #76bc21, 0 0 3px #76bc21; }
      #henka02 .wrap01 .text b {
        display: block;
        font-weight: normal;
        margin-bottom: 3%; }
      #henka02 .wrap01 .text .comment {
        display: block;
        background: url("../../images/bg02.png") no-repeat;
        background-size: 100%;
        background-position: bottom;
        padding-bottom: 8%; }
        #henka02 .wrap01 .text .comment p {
          display: block;
          background: #fff5d7;
          border-top-left-radius: 20px;
          border-top-right-radius: 20px;
          padding: 3% 3% 0 3%;
          line-height: 1.8; }
          #henka02 .wrap01 .text .comment p em {
            background: url("../../images/underline.png") repeat-x;
            background-position: bottom;
            font-style: normal;
            font-weight: bold; }
    @media (max-width: 860px) {
      #henka02 .wrap01 {
        flex-wrap: wrap;
        padding: 0 15px; }
        #henka02 .wrap01 .photo {
          width: 100%;
          padding-right: 0;
          margin-bottom: 2%;
          display: flex;
          flex-wrap: wrap;
          align-items: flex-start; }
          #henka02 .wrap01 .photo .a1 {
            width: 100%; }
            #henka02 .wrap01 .photo .a1 b br {
              display: none; }
          #henka02 .wrap01 .photo .a2 {
            width: 200px; }
          #henka02 .wrap01 .photo .a3 {
            width: calc(100% - 200px);
            padding: 10px 10px 0 20px; }
        #henka02 .wrap01 .text {
          width: 100%; } }
    @media (max-width: 640px) {
      #henka02 .wrap01 .text .t01 ul li:nth-child(1) {
        width: 13em;
        padding-bottom: 10px; }
      #henka02 .wrap01 .text .t01 ul li:nth-of-type(2) {
        width: 90px;
        text-align: center; }
        #henka02 .wrap01 .text .t01 ul li:nth-of-type(2) img {
          width: 60px;
          height: auto; }
      #henka02 .wrap01 .text .t01 ul li:nth-child(3) {
        padding-left: 20px;
        padding-right: 0;
        padding-bottom: 10px; }
      #henka02 .wrap01 .text b {
        margin-bottom: 6%; } }

#henka03 .ttl {
  display: block;
  background: url("../../images/arrow_blue.png") no-repeat;
  background-position: center bottom;
  padding-bottom: 22px;
  margin-bottom: 6%; }
  #henka03 .ttl .wrap {
    display: block;
    background: #7eb2d6;
    padding: 20px 10px; }
    #henka03 .ttl .wrap h3 {
      display: block;
      text-align: center;
      color: #FFF;
      font-size: 2.2em;
      font-weight: bold;
      margin-bottom: 15px;
      line-height: 1.5; }
      #henka03 .ttl .wrap h3 span {
        display: block;
        color: #FFF;
        font-size: 60%; }
      @media (max-width: 640px) {
        #henka03 .ttl .wrap h3 {
          font-size: 5vw; } }
      @media (max-width: 420px) {
        #henka03 .ttl .wrap h3 {
          font-size: 6vw; } }
    #henka03 .ttl .wrap ul {
      display: flex;
      max-width: 850px;
      margin: 0 auto;
      align-items: center;
      padding: 0 15px; }
      #henka03 .ttl .wrap ul li {
        border: #FFF 1px solid;
        text-align: center;
        color: #FFF;
        padding: 10px;
        border-radius: 30px;
        font-size: 0.9em;
        line-height: 1.2; }
        #henka03 .ttl .wrap ul li br {
          display: none; }
        #henka03 .ttl .wrap ul li:nth-of-type(1) {
          width: calc(53% - 0.5em );
          margin-right: 0.5em; }
        #henka03 .ttl .wrap ul li:nth-of-type(2) {
          width: 2em;
          font-size: 1.2em;
          border: none; }
        #henka03 .ttl .wrap ul li:nth-of-type(3) {
          width: calc(47% - 0.5em );
          margin-left: 0.5em; }
      @media (max-width: 820px) {
        #henka03 .ttl .wrap ul {
          flex-wrap: wrap;
          justify-content: center;
          padding: 0 10px; }
          #henka03 .ttl .wrap ul li:nth-of-type(1) {
            width: 100%;
            max-width: 30em;
            margin: 0 0 10px 0; }
          #henka03 .ttl .wrap ul li:nth-of-type(2) {
            display: none; }
          #henka03 .ttl .wrap ul li:nth-of-type(3) {
            width: 100%;
            margin-left: 0;
            max-width: 30em; } }
      @media (max-width: 640px) {
        #henka03 .ttl .wrap ul li br {
          display: block; } }
      @media (max-width: 420px) {
        #henka03 .ttl .wrap ul li {
          padding: 7px 10px;
          font-size: 80%; } }
#henka03 .box {
  display: block;
  max-width: 1030px;
  margin: 0 auto;
  padding: 0 15px;
  margin-bottom: 6%;
  text-align: center; }
  @media (max-width: 640px) {
    #henka03 .box {
      margin-bottom: 10%; } }
  #henka03 .box h4 {
    display: block;
    font-weight: bold;
    color: #7eb2d6;
    font-size: 2em;
    margin-bottom: 4%; }
    @media (max-width: 640px) {
      #henka03 .box h4 {
        font-size: 6vw; } }
    @media (max-width: 420px) {
      #henka03 .box h4 {
        font-size: 7vw; } }
  #henka03 .box p {
    line-height: 1.8;
    margin-bottom: 4%; }
    @media (max-width: 640px) {
      #henka03 .box p {
        text-align: left; }
        #henka03 .box p br {
          display: none; } }
  #henka03 .box .image {
    display: block;
    margin-bottom: 4%; }
    #henka03 .box .image img {
      width: 100%;
      height: auto;
      max-width: 536px; }

.footer_btn01 {
  display: block;
  max-width: 1000px;
  margin: 0 auto 5% auto; }
  @media (max-width: 1000px) {
    .footer_btn01 {
      padding: 0 15px; } }
  .footer_btn01 ul {
    display: flex; }
    .footer_btn01 ul li {
      width: 48%; }
      .footer_btn01 ul li a {
        text-align: center;
        font-size: 1.7em;
        padding: 8% 2%; }
        @media (max-width: 640px) {
          .footer_btn01 ul li a {
            font-size: 1.3em; } }
        @media (max-width: 420px) {
          .footer_btn01 ul li a {
            font-size: 1.1em; } }
      .footer_btn01 ul li:nth-of-type(1) {
        margin-right: 2%; }
        .footer_btn01 ul li:nth-of-type(1) a {
          background: #a3b5dd; }
      .footer_btn01 ul li:nth-of-type(2) {
        margin-left: 2%; }
        .footer_btn01 ul li:nth-of-type(2) a {
          background: #ee8078; }

.footer_btn02 {
  display: block;
  background: rgba(118, 188, 33, 0.3);
  padding: 4% 10px;
  margin: 0 auto; }
  .footer_btn02 ul {
    display: flex;
    margin: 0 auto;
    max-width: calc(1000px + 2%); }
    .footer_btn02 ul li {
      width: 31.3%;
      margin: 0 1%;
      display: flex;
      align-items: stretch; }
      .footer_btn02 ul li a {
        text-align: center;
        font-size: 1.5em;
        line-height: 1.3;
        padding: 8% 2%;
        display: flex;
        width: 100%;
        justify-content: center;
        align-items: center; }
        @media (max-width: 768px) {
          .footer_btn02 ul li a {
            font-size: 1.2em; } }
        @media (max-width: 640px) {
          .footer_btn02 ul li a {
            font-size: 1.1em; } }
        @media (max-width: 420px) {
          .footer_btn02 ul li a {
            font-size: 0.9em; } }
      .footer_btn02 ul li:nth-of-type(1) a {
        background: #7dbdc0; }
      .footer_btn02 ul li:nth-of-type(2) a {
        background: #f29419; }
      .footer_btn02 ul li:nth-of-type(3) a {
        background: #fdd000; }

#footer {
  display: block;
  padding: 4%;
  border-bottom: #76bc21 10px solid; }
  @media (max-width: 640px) {
    #footer {
      border-bottom: #76bc21 5px solid; } }
  #footer #page-top {
    display: block;
    width: 60px;
    height: 60px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1; }
    #footer #page-top img {
      width: 100%;
      height: auto; }
    @media (max-width: 1000px) {
      #footer #page-top {
        width: 50px;
        height: 50px;
        bottom: 15px;
        right: 15px; } }
    @media (max-width: 640px) {
      #footer #page-top {
        width: 40px;
        height: 40px;
        bottom: 10px;
        right: 10px; } }
  #footer .logo {
    display: block;
    text-align: center;
    padding: 0 10px; }
    @media (max-width: 640px) {
      #footer .logo img {
        width: 200px;
        height: auto; } }
