@import url(reset.css);
body {
  font-size: 14px;
  line-height: 1.6;
  background: #f9faf5;
  color: #011824;
  overflow-x: hidden;
  font-family: "le-havre-rounded", "new-zen", sans-serif; }
  @media screen and (min-width: 780px) {
    body {
      font-size: 15px; } }

nav {
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 999; }
  @media screen and (min-width: 780px) {
    nav {
      top: 0;
      bottom: auto; } }

main {
  max-width: 1180px;
  margin: 0 auto; }
  main section {
    padding: 15px 10px 30px; }
    @media screen and (min-width: 480px) {
      main section {
        padding: 25px 15px 40px; } }
    @media screen and (min-width: 780px) {
      main section {
        padding: 35px 15px 60px; } }
    main section h2 {
      position: relative;
      z-index: 10;
      font-family: heisei-maru-gothic-std, sans-serif; }
      main section h2::before {
        content: "";
        position: absolute;
        z-index: -1;
        bottom: -0.6em;
        right: -100%;
        left: -97%;
        margin: auto;
        display: block;
        width: 120%;
        height: 1.5em;
        background: transparent no-repeat center / contain;
        opacity: 0.8; }

address {
  font-style: normal; }

h2 {
  font-size: 1.4em;
  text-align: center;
  margin: 1em auto; }

h3 {
  font-size: 1.25em;
  text-align: center;
  margin: 1em auto; }

a {
  text-decoration: none; }
  a:hover, a:focus {
    text-decoration: underline;
    transition: text-decoration 0.3s ease-out; }

a[href^="tel"]:hover, a[href^="tel"]:focus {
  text-decoration: none;
  opacity: 0.8; }
a[href^="tel"]::before {
  content: "";
  display: inline-block;
  width: 0.75em;
  height: 0.9em;
  background: transparent url(../img/tel-black.svg) no-repeat center/contain;
  transform: translateY(0.02em);
  margin: 0 0.1em 0 0; }

a[target="_blank"]::after {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  background: transparent url(../img/link-blue02.svg) no-repeat center/contain;
  transform: translateY(0.11em);
  margin: 0 0 0 0.3em; }

@media screen and (min-width: 780px) {
  .PCoff {
    display: none !important; } }

.PCon {
  display: none; }
  @media screen and (min-width: 780px) {
    .PCon {
      display: block; } }

.nav-bar {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  height: 60px;
  width: 100%;
  box-shadow: 0 0 15px 0 rgba(0, 44, 111, 0.2);
  margin-bottom: -80px;
  opacity: 0;
  transition: 0.2s; }
  @media screen and (min-width: 780px) {
    .nav-bar {
      background: #f9faf5;
      align-items: center;
      margin: -80px 0 0;
      opacity: 1;
      transition: 0.2s; } }
  .nav-bar .title {
    width: 250px;
    margin-left: 12px; }
    .nav-bar .title a {
      padding: 0 0 4px;
      display: block; }
  .nav-bar .tel-link, .nav-bar .menu-btn {
    background: rgba(249, 250, 245, 0.95);
    color: #095497; }
  .nav-bar .tel-link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1 0 auto;
    padding: 0 0 0 10px; }
    .nav-bar .tel-link a[href^="tel"] {
      font-size: 1.8em;
      line-height: 1.1; }
      .nav-bar .tel-link a[href^="tel"]::before {
        background-image: url("../img/tel-blue02.svg"); }
    .nav-bar .tel-link p {
      font-size: 10.5px; }
  .nav-bar .menu-btn {
    width: 70px;
    position: relative;
    font-family: heisei-maru-gothic-std, sans-serif; }
    .nav-bar .menu-btn::before, .nav-bar .menu-btn::after {
      content: "";
      position: absolute;
      display: block;
      height: 5px;
      width: 50px;
      margin: auto;
      right: 10px;
      left: 10px;
      background: #095497;
      transition: 0.1s; }
    .nav-bar .menu-btn::before {
      top: 10px; }
    .nav-bar .menu-btn::after {
      bottom: 10px; }
    .nav-bar .menu-btn p {
      font-size: 13px;
      font-weight: bold;
      letter-spacing: -0.05em;
      position: absolute;
      padding: 3px 0;
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center; }
    .nav-bar .menu-btn:hover::before, .nav-bar .menu-btn:hover::after {
      width: 25px;
      transition: 0.3s ease-out; }
    .nav-bar .menu-btn:hover::before {
      transform: rotate(-45deg);
      top: 20px;
      left: 0;
      right: 15px; }
    .nav-bar .menu-btn:hover::after {
      transform: rotate(45deg);
      bottom: 35px;
      right: 0;
      left: 15px; }
    .nav-bar .menu-btn:hover p {
      align-items: flex-end; }
  .nav-bar .menu {
    position: absolute;
    z-index: -1;
    bottom: -100vh;
    right: 0;
    display: inline-flex;
    flex-direction: column;
    background: #f9faf5;
    box-shadow: 0 0 15px 0 rgba(0, 44, 111, 0.2);
    transition: 0.3s; }
    @media screen and (min-width: 780px) {
      .nav-bar .menu {
        position: static;
        display: flex;
        flex-direction: row;
        z-index: 999;
        background: #f9faf5;
        box-shadow: none; } }
    .nav-bar .menu li > a {
      display: block;
      padding: 0.8em 3em;
      font-size: 1.1em;
      font-weight: bold;
      color: #002c6f; }
      @media screen and (min-width: 780px) {
        .nav-bar .menu li > a {
          padding: 0 1em;
          line-height: 60px; } }
      .nav-bar .menu li > a:hover, .nav-bar .menu li > a:focus {
        background: #002c6f;
        color: #f9faf5; }
    .nav-bar .menu > li {
      display: inline-block; }
      .nav-bar .menu > li::after {
        content: "";
        position: relative;
        bottom: 0;
        display: block;
        height: 1px;
        width: calc(100% - 2em);
        margin: auto;
        background: #095497; }
        @media screen and (min-width: 780px) {
          .nav-bar .menu > li::after {
            content: none; } }
      .nav-bar .menu > li:last-of-type::after {
        content: none; }
      .nav-bar .menu > li ul {
        padding: 0 0 0 1em; }
  @media screen and (min-width: 780px) {
    .nav-bar.open {
      margin-top: 0; } }
  .nav-bar.open .menu-btn::before, .nav-bar.open .menu-btn::after {
    width: 35px;
    transition: 0.45s ease-out; }
  .nav-bar.open .menu-btn::before {
    transform: rotate(-495deg);
    top: 19px; }
  .nav-bar.open .menu-btn::after {
    transform: rotate(495deg);
    bottom: 36px; }
  .nav-bar.open .menu-btn p {
    align-items: flex-end; }
  .nav-bar.open .menu-btn:hover::before, .nav-bar.open .menu-btn:hover::after {
    width: 25px; }
  .nav-bar.open .menu-btn:hover::before {
    right: 15px;
    top: 17px; }
  .nav-bar.open .menu-btn:hover::after {
    left: 15px;
    bottom: 38px; }
  .nav-bar.open .menu {
    bottom: 60px;
    transition: 0.6s; }
  .nav-bar.visible {
    margin: 0;
    opacity: 1;
    transition: 0.5s; }

.mv {
  width: 100vw;
  height: 109vw;
  max-width: 1180px;
  max-height: 700px;
  margin: auto;
  position: relative;
  z-index: 10;
  overflow: hidden; }
  @media screen and (min-width: 480px) {
    .mv {
      height: 88vw; } }
  @media screen and (min-width: 780px) {
    .mv {
      height: 96vh;
      overflow: visible; } }
  @media screen and (min-width: 1180px) {
    .mv::after {
      content: "";
      position: absolute;
      z-index: -1;
      top: 0;
      bottom: 0;
      right: calc(-100vw + 8%);
      display: block;
      height: 100%;
      width: 100vw;
      background: linear-gradient(#d7eef2 90%, #f9faf5); } }
  .mv h1 {
    position: absolute;
    width: 90%;
    max-width: 700px;
    margin: auto;
    bottom: 0;
    right: -100%;
    left: -100%;
    z-index: 999; }
  .mv .cat {
    position: relative;
    z-index: 999;
    width: 43.24%;
    height: auto;
    max-width: 300px;
    margin: 0 0 0 auto; }
    .mv .cat .body img, .mv .cat .tail img, .mv .cat .eyes img {
      width: 100%;
      height: auto; }
    .mv .cat .eyes {
      position: absolute;
      z-index: 10;
      width: 100%;
      height: auto; }
      .mv .cat .eyes.open {
        opacity: 1;
        animation: eyes 6s infinite; }
    .mv .cat .tail {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 80%;
      right: 0;
      transform-origin: 88% 4.5%;
      animation: cattail 5s ease-in-out alternate infinite; }
  .mv .clouds {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 998; }
    .mv .clouds .cloud01, .mv .clouds .cloud02, .mv .clouds .cloud03, .mv .clouds .cloud04, .mv .clouds .cloud05, .mv .clouds .cloud06, .mv .clouds .cloud07, .mv .clouds .cloud08, .mv .clouds .cloud09, .mv .clouds .cloud10 {
      position: absolute;
      z-index: 1;
      transition: 0.3s;
      margin: auto; }
      .mv .clouds .cloud01 img, .mv .clouds .cloud02 img, .mv .clouds .cloud03 img, .mv .clouds .cloud04 img, .mv .clouds .cloud05 img, .mv .clouds .cloud06 img, .mv .clouds .cloud07 img, .mv .clouds .cloud08 img, .mv .clouds .cloud09 img, .mv .clouds .cloud10 img {
        width: 100%;
        height: auto;
        filter: drop-shadow(0px -2px 10px rgba(14, 155, 202, 0.15)); }
    .mv .clouds .cloud01 {
      width: 39.78%;
      max-width: 310px;
      top: 0.8%;
      right: 66%;
      animation: cloud 12s -5s alternate infinite; }
      @media screen and (min-width: 480px) {
        .mv .clouds .cloud01 {
          top: -6.2%; } }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud01 {
          right: auto;
          left: -2%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud01 {
          top: -1%;
          left: 1%; } }
    .mv .clouds .cloud02 {
      width: 50.46%;
      max-width: 394px;
      top: 0.36%;
      right: 41.5%;
      z-index: 2;
      animation: cloud 12s -10s alternate infinite; }
      @media screen and (min-width: 480px) {
        .mv .clouds .cloud02 {
          top: -6.64%; } }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud02 {
          right: auto;
          left: 19%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud02 {
          top: -6%;
          left: 21%; } }
    .mv .clouds .cloud03 {
      width: 36.71%;
      max-width: 286px;
      top: 0.4%;
      right: 23%;
      animation: cloud 12s alternate infinite; }
      @media screen and (min-width: 480px) {
        .mv .clouds .cloud03 {
          top: -6.6%; } }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud03 {
          left: 48%; } }
    .mv .clouds .cloud04 {
      width: 68.77%;
      max-width: 536px;
      top: 0%;
      right: -2%;
      z-index: 3;
      animation: cloud 12s -3s alternate infinite; }
      @media screen and (min-width: 480px) {
        .mv .clouds .cloud04 {
          top: -7%; } }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud04 {
          left: 54%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud04 {
          top: -6%;
          left: auto; } }
    .mv .clouds .cloud05 {
      width: 38.56%;
      max-width: 301px;
      top: 23.1%;
      right: -3%;
      z-index: 4;
      animation: cloud 12s -11s alternate infinite; }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud05 {
          right: -6%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud05 {
          right: 1.5%; } }
    .mv .clouds .cloud06 {
      width: 33.94%;
      max-width: 265px;
      top: 39.4%;
      right: -2%;
      animation: cloud 12s -6s alternate infinite; }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud06 {
          right: -5%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud06 {
          top: 42%;
          right: -3%; } }
    .mv .clouds .cloud07 {
      width: 26.93%;
      max-width: 210px;
      top: 54%;
      right: 1.5%;
      z-index: 2;
      animation: cloud 12s -4s alternate infinite; }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud07 {
          right: -1.5%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud07 {
          top: 61%;
          right: 3%; } }
    .mv .clouds .cloud08 {
      width: 32.87%;
      max-width: 256px;
      top: 64.5%;
      right: -3.5%;
      z-index: 3;
      animation: cloud 12s -11s alternate infinite; }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud08 {
          right: -6.5%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud08 {
          top: 68%; } }
    .mv .clouds .cloud09 {
      width: 17.69%;
      max-width: 138px;
      top: 80.9%;
      right: 11%;
      z-index: 4;
      animation: cloud 12s -8s alternate infinite; }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud09 {
          right: 3%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud09 {
          right: 6.5%;
          top: 82%; } }
    .mv .clouds .cloud10 {
      width: 20%;
      max-width: 156px;
      top: 15.5%;
      right: 81%;
      z-index: 1;
      animation: cloud 12s alternate infinite; }
      @media screen and (min-width: 480px) {
        .mv .clouds .cloud10 {
          top: 8.5%; } }
      @media screen and (min-width: 780px) {
        .mv .clouds .cloud10 {
          right: auto;
          left: -5%; } }
      @media screen and (min-width: 1180px) {
        .mv .clouds .cloud10 {
          top: -4%;
          left: -10.5%; } }
  .mv .photos {
    position: absolute;
    bottom: 30px;
    left: -10%;
    width: 135%;
    height: auto;
    max-width: 1080px; }
    @media screen and (min-width: 480px) {
      .mv .photos {
        left: -5%;
        width: 125%; } }
    @media screen and (min-width: 780px) {
      .mv .photos {
        width: 100%;
        left: 0;
        bottom: 15px; } }
    .mv .photos::before {
      position: absolute;
      z-index: 99;
      bottom: -1px;
      left: -1px;
      width: 54px;
      height: 100%;
      background: linear-gradient(-90deg, rgba(249, 250, 245, 0), #f9faf5); }
      @media screen and (min-width: 780px) {
        .mv .photos::before {
          content: ""; } }
    .mv .photos::after {
      content: "";
      position: absolute;
      z-index: 99;
      bottom: -1px;
      left: 0;
      right: 0;
      width: 100%;
      height: 40px;
      background: linear-gradient(rgba(249, 250, 245, 0), #f9faf5); }
      @media screen and (min-width: 780px) {
        .mv .photos::after {
          height: 54px; } }

@keyframes cattail {
  0% {
    transform: rotate(40deg) skew(14deg, 14deg); }
  100% {
    transform: rotate(-5deg) skew(0deg); } }
@keyframes eyes {
  0% {
    opacity: 1; }
  90% {
    opacity: 1; }
  92% {
    opacity: 0; }
  94% {
    opacity: 1; }
  96% {
    opacity: 1; }
  98% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@keyframes cloud {
  0% {
    transform: scale(1); }
  5% {
    transform: scale(1); }
  95% {
    transform: scale(1.12); }
  100% {
    transform: scale(1.12); } }
.btn-block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: stretch;
  margin: 1.8em 0 2.5em;
  font-weight: bold; }
  .btn-block > a {
    line-height: 1.2; }

.border-btn {
  display: inline-block;
  position: relative;
  color: #002c6f;
  padding: 1em 2em;
  margin: 0 0 0 auto; }
  .border-btn::before, .border-btn::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1; }
  .border-btn::before {
    bottom: 0;
    right: 0;
    border-top: 1px solid #002c6f;
    border-right: 2px solid #002c6f; }
  .border-btn::after {
    top: 0;
    left: 0;
    border-bottom: 2px solid #002c6f;
    border-left: 1px solid #002c6f; }
  .border-btn .inner {
    display: block; }
    .border-btn .inner::before, .border-btn .inner::after {
      content: "";
      position: absolute;
      width: 0;
      height: 0;
      z-index: 5; }
    .border-btn .inner::before {
      top: 0;
      left: 0; }
    .border-btn .inner::after {
      bottom: 0;
      right: 0; }
    .border-btn .inner i:not([class]):last-of-type {
      display: inline-block;
      border-top: 2px solid #002c6f;
      border-right: 2px solid #002c6f;
      height: 0.5em;
      width: 0.5em;
      margin: 0 0 0 0.3em;
      transform: translate(0.2em, -0.1em) rotate(45deg);
      border-radius: 0 2px 0 0;
      transition: 0.05s; }
  .border-btn:hover::before, .border-btn:focus::before {
    animation: border-btn01 0.3s ease-out forwards; }
  .border-btn:hover::after, .border-btn:focus::after {
    animation: border-btn02 0.3s 0.3s ease-out forwards; }
  .border-btn:hover .inner::before, .border-btn:focus .inner::before {
    animation: border-btn03 0.3s 0.15s ease-out forwards; }
  .border-btn:hover .inner::after, .border-btn:focus .inner::after {
    animation: border-btn04 0.3s 0.45s ease-out forwards; }
  .border-btn:hover .inner i:not([class]):last-of-type, .border-btn:focus .inner i:not([class]):last-of-type {
    transition: 0.2s 0.1s ease-out;
    transform: translate(0.5em, -0.1em) rotate(45deg); }

@keyframes border-btn01 {
  0% {
    width: 100%;
    height: 100%;
    border-top: 1px solid #002c6f;
    border-right: 2px solid #002c6f; }
  59% {
    width: 0%;
    border-top: 1px solid #002c6f; }
  60% {
    height: 100%;
    border-top: none; }
  99% {
    height: 0%;
    border-right: 2px solid #002c6f; }
  100% {
    width: 0%;
    height: 0%;
    border-top: none;
    border-right: none; } }
@keyframes border-btn02 {
  0% {
    width: 100%;
    height: 100%;
    border-bottom: 2px solid #002c6f;
    border-left: 1px solid #002c6f; }
  59% {
    width: 0%;
    border-bottom: 2px solid #002c6f; }
  60% {
    height: 100%;
    border-bottom: none; }
  99% {
    height: 0%;
    border-left: 1px solid #002c6f; }
  100% {
    width: 0%;
    height: 0%;
    border-bottom: none;
    border-left: none; } }
@keyframes border-btn03 {
  0% {
    width: 0%;
    height: 0%;
    border-top: none;
    border-right: none; }
  1% {
    border-top: 1px solid #002c6f; }
  60% {
    width: 100%;
    border-right: none; }
  61% {
    height: 0%;
    border-right: 2px solid #002c6f; }
  100% {
    width: 100%;
    height: 100%;
    border-top: 1px solid #002c6f;
    border-right: 2px solid #002c6f; } }
@keyframes border-btn04 {
  0% {
    width: 0%;
    height: 0%;
    border-bottom: none;
    border-left: none; }
  1% {
    border-bottom: 2px solid #002c6f; }
  60% {
    width: 100%;
    border-left: none; }
  61% {
    height: 0%;
    border-left: 1px solid #002c6f; }
  100% {
    width: 100%;
    height: 100%;
    border-bottom: 2px solid #002c6f;
    border-left: 1px solid #002c6f; } }
.dl-list {
  display: flex;
  flex-wrap: wrap;
  line-height: 1.3;
  padding: 0 10px;
  width: 100%;
  max-width: 32em;
  line-height: 1.6; }
  .dl-list dt {
    width: 4.9em;
    padding: 0.65em 0.75em 0.65em 0;
    border-right: 1px solid #011824;
    text-align: right; }
  .dl-list dd {
    width: calc(100% - 5em);
    padding: 0.65em 0 0.65em 0.75em; }

/* #about */
#about {
  padding: 10px 0;
  overflow: hidden; }
  @media screen and (min-width: 480px) {
    #about {
      padding: 30px 0 10px; } }
  @media screen and (min-width: 780px) {
    #about {
      padding: 100px 0 30px; } }
  @media screen and (min-width: 1180px) {
    #about {
      padding: 100px 0 50px;
      overflow: visible; } }
  #about .btn-block {
    margin: 2.5em 10px 3em; }
    @media screen and (min-width: 1180px) {
      #about .btn-block {
        margin: 8em 10px 3em; } }

.about-block {
  margin: 1em auto; }
  .about-block figure {
    width: 50%;
    opacity: 0.8;
    max-width: 400px;
    margin: 0 0 0 -12vw; }
    @media screen and (min-width: 480px) {
      .about-block figure {
        margin: 0 0 0 -7.5vw; } }
    @media screen and (min-width: 780px) {
      .about-block figure {
        max-width: 590px;
        margin: 0 0 0 -5vw; } }
    .about-block figure svg {
      width: 100%; }
      @media screen and (min-width: 780px) {
        .about-block figure svg.sp {
          display: none; } }
      .about-block figure svg.pc {
        display: none; }
        @media screen and (min-width: 780px) {
          .about-block figure svg.pc {
            display: block; } }
      .about-block figure svg image {
        width: 100%;
        height: auto; }
  .about-block dl {
    margin: -19vw 10px 0;
    position: relative;
    z-index: 10; }
    @media screen and (min-width: 480px) {
      .about-block dl {
        margin: -33vw 10px 0 40%; } }
    @media screen and (min-width: 780px) {
      .about-block dl {
        margin: -20% 20px 9% 45%; } }
    @media screen and (min-width: 1180px) {
      .about-block dl {
        margin: -19.5% 40px 10% 46.5%; } }
    .about-block dl dt {
      padding: 0 0 1em;
      font-size: 1.35em;
      font-weight: bold; }
      @media screen and (min-width: 480px) {
        .about-block dl dt {
          padding: 0 0 0.5em;
          text-align: left; } }
      .about-block dl dt svg {
        font-family: heisei-maru-gothic-std, sans-serif;
        filter: drop-shadow(0 1px 1.5px #095497); }
        .about-block dl dt svg text {
          fill: #0e9bca;
          stroke: #f9faf5;
          stroke-linejoin: round;
          stroke-width: 6px;
          paint-order: stroke; }
    .about-block dl dd {
      margin-left: 1em;
      font-size: 0.95em;
      text-shadow: 0 0 2px #f9faf5;
      position: relative;
      z-index: 5; }
      @media screen and (min-width: 480px) {
        .about-block dl dd {
          padding: 0; } }
      .about-block dl dd::after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -100%;
        bottom: -100%;
        left: -100%;
        right: -100%;
        display: block;
        width: 98%;
        height: 90%;
        margin: auto;
        background: #f9faf5;
        box-shadow: 0 0 5px 8px #f9faf5;
        opacity: 0.65;
        border-radius: 1em; }
  .about-block:nth-of-type(2) {
    margin-bottom: 1.5em; }
    .about-block:nth-of-type(2) figure {
      margin: 0 -12vw 0 auto; }
      @media screen and (min-width: 480px) {
        .about-block:nth-of-type(2) figure {
          margin: 0 -7.5vw 0 auto; } }
      @media screen and (min-width: 780px) {
        .about-block:nth-of-type(2) figure {
          margin: 0 -5vw 0 auto; } }
      @media screen and (min-width: 1180px) {
        .about-block:nth-of-type(2) figure svg {
          transform: rotateY(180deg); } }
    @media screen and (min-width: 480px) {
      .about-block:nth-of-type(2) dl {
        margin: -33vw 40% 0 10px; } }
    @media screen and (min-width: 780px) {
      .about-block:nth-of-type(2) dl {
        margin: -20% 45% 9% 20px; } }
    @media screen and (min-width: 1180px) {
      .about-block:nth-of-type(2) dl {
        margin: -19.5% 46.5% 10% 40px; } }
    .about-block:nth-of-type(2) dl dt {
      text-align: left; }
      @media screen and (min-width: 480px) {
        .about-block:nth-of-type(2) dl dt {
          text-align: right; } }
    .about-block:nth-of-type(2) dl dd {
      margin: 0 1em 0 0; }
      @media screen and (min-width: 480px) {
        .about-block:nth-of-type(2) dl dd {
          padding: 0; } }

/* #detail */
#detail {
  background: #b0e6f2;
  position: relative;
  z-index: 1; }
  #detail h2::before {
    background-image: url("../img/title-detail.svg"); }
  @media screen and (min-width: 780px) {
    #detail::after {
      content: "";
      position: absolute;
      top: 0;
      right: -100vw;
      left: -100vw;
      display: block;
      width: 100vw;
      height: 100%;
      background: #b0e6f2;
      margin: auto;
      z-index: -1; } }
  #detail .dl-list {
    margin: 0 auto; }
    #detail .dl-list dt {
      border-right: 1px solid #095497; }

/* #days */
#days h2::before {
  background-image: url("../img/title-days.svg"); }

.days-block {
  margin: -10px 1% 0; }
  @media screen and (min-width: 480px) {
    .days-block {
      margin: 0;
      display: flex;
      justify-content: center;
      align-items: center; } }
  .days-block figure {
    text-align: center;
    margin: 30px auto;
    max-width: 350px; }
    @media screen and (min-width: 480px) {
      .days-block figure {
        flex: 1 1 auto;
        margin: 0 1%; } }

/* #access */
#access {
  background: #b9ede4;
  position: relative;
  z-index: 1;
  padding-bottom: 80px; }
  @media screen and (min-width: 780px) {
    #access::after {
      content: "";
      position: absolute;
      top: 0;
      right: -100vw;
      left: -100vw;
      display: block;
      width: 100vw;
      height: 100%;
      background: #b9ede4;
      margin: auto;
      z-index: -1; } }
  #access h2::before {
    background-image: url("../img/title-access.svg"); }
  #access .iframe {
    margin: 10px -10px; }
    @media screen and (min-width: 480px) {
      #access .iframe {
        margin: 15px -15px; } }
    #access .iframe + a {
      text-align: right;
      display: block;
      color: #095497; }
  #access .dl-list dt:not(:first-of-type), #access .dl-list dd:not(:first-of-type) {
    padding-top: 0; }

footer {
  background: #0e9bca;
  color: #f9faf5;
  padding: 50px 20px 80px; }
  @media screen and (min-width: 780px) {
    footer {
      padding: 40px 40px 20px; } }

.footer-wap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  max-width: 1180px; }
  @media screen and (min-width: 780px) {
    .footer-wap {
      align-items: flex-end; } }
  .footer-wap .menu {
    font-size: 0.95em;
    padding-left: 6px; }
    @media screen and (min-width: 480px) {
      .footer-wap .menu {
        padding-left: 10px; } }
    @media screen and (min-width: 780px) {
      .footer-wap .menu {
        padding: 0 0 0.5em 0;
        font-size: 0.86em;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 1fr;
        column-gap: 1em; } }
    @media screen and (min-width: 880px) {
      .footer-wap .menu {
        grid-template-columns: repeat(3, 1fr); } }
    .footer-wap .menu li {
      order: 6; }
      .footer-wap .menu li a {
        display: block;
        padding: 0.1em 0; }
    .footer-wap .menu > li a::before {
      content: "";
      display: inline-block;
      background: #f9faf5;
      height: 2px;
      width: 0.4em;
      margin: 0 0.3em 0.3em 0;
      border-radius: 2px;
      transition: 0.05s; }
    .footer-wap .menu > li > ul {
      padding-left: 1em; }
    @media screen and (min-width: 780px) {
      .footer-wap .menu li:nth-of-type(1) {
        order: 1; }
      .footer-wap .menu li:nth-of-type(2) {
        order: 3; }
      .footer-wap .menu li:nth-of-type(3) {
        order: 2; } }
    @media screen and (min-width: 880px) {
      .footer-wap .menu li:nth-of-type(2) {
        order: 4; }
      .footer-wap .menu li:nth-of-type(3) {
        order: 2; }
      .footer-wap .menu li:nth-of-type(4) {
        order: 5; }
      .footer-wap .menu li:nth-of-type(5) {
        order: 3; } }
  .footer-wap .title {
    flex: 0.35 0 110px;
    margin: 0 7% 0 auto;
    max-width: 200px; }
    @media screen and (min-width: 780px) {
      .footer-wap .title {
        flex: 0.45 0 110px;
        margin: 0 1.2em 0 auto;
        max-width: 170px; } }
    @media screen and (min-width: 1180px) {
      .footer-wap .title {
        max-width: 200px; } }
    .footer-wap .title img {
      width: 100%;
      height: auto; }
  .footer-wap .add {
    width: 100%;
    margin: 1em 0 0;
    line-height: 1.3; }
    @media screen and (min-width: 480px) {
      .footer-wap .add {
        display: flex;
        justify-content: flex-start;
        align-items: flex-end; } }
    @media screen and (min-width: 780px) {
      .footer-wap .add {
        display: block;
        width: auto;
        margin: 0 0 0.25em; } }
    @media screen and (min-width: 1180px) {
      .footer-wap .add {
        font-size: 1.12em; } }
    .footer-wap .add address a[href^="tel"] {
      font-size: 1.7em;
      display: inline-block; }
      @media screen and (min-width: 1180px) {
        .footer-wap .add address a[href^="tel"] {
          font-size: 2em; } }
      .footer-wap .add address a[href^="tel"]::before {
        background-image: url("../img/tel-white.svg"); }
    .footer-wap .add address p:last-of-type {
      font-size: 0.85em; }
    .footer-wap .add > p {
      font-size: 0.95em;
      margin-top: 1.1em; }
      @media screen and (min-width: 480px) {
        .footer-wap .add > p {
          margin: 0 -10px 0 2.1%;
          flex: 1 0 11em; } }
      @media screen and (min-width: 780px) {
        .footer-wap .add > p {
          margin: 0.6em 0 0 0; } }
  .footer-wap small {
    width: 100%;
    text-align: center;
    font-size: 0.8em;
    padding: 2em 0 0; }

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