@charset "UTF-8";
@import url("ress.css");
@import url("../fontawesome-free-5.13.0-web/css/all.css");
@import url("./fonts/fonts.css");
@media screen and (min-width: 769px) {
  .pc-none {
    display: none !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-none {
    display: none !important;
  }
}

.font-bold {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
}

a {
  color: #4d4d4d;
  text-decoration: none;
}

*:focus, a {
  outline: none !important;
}

html {
  overflow-y: scroll;
  font-size: 20px;
  line-height: 1.4rem;
}

@media screen and (max-width: 1180px) {
  html {
    font-size: 19px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 2vw;
    line-height: 3vw;
  }
}

body, input, select, option, textarea {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  color: #4d4d4d;
}

h1 {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

h2 {
  color: #282828;
}

header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  width: 100%;
  padding-top: 52.1%;
  background-image: url("../../images/top_img.jpg");
  background-size: 100%;
}

@media screen and (max-width: 768px) {
  header {
    padding-top: 90%;
    background-position: center;
    background-size: cover;
  }
}

.main-nav {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
}

@media screen and (min-width: 769px) {
  .main-nav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: flex-between;
        -ms-flex-pack: flex-between;
            justify-content: flex-between;
    margin: 0 auto;
    width: 100%;
    max-width: 1000px;
  }
  .main-nav ul li {
    line-height: 3.4rem;
    width: 16.0%;
    display: inline-block;
    text-align: center;
  }
}

@media screen and (max-width: 768px) {
  .main-nav {
    height: 12vw;
  }
  .main-nav .header-icon {
    position: absolute;
    top: 1vw;
    left: 1vw;
    width: 10vw;
    height: 10vw;
  }
  .main-nav .header-icon img {
    width: 100%;
  }
  .main-nav .header-menu {
    position: absolute;
    top: 1vw;
    right: 1vw;
    width: 10vw;
    height: 10vw;
  }
  .main-nav .header-menu img {
    width: 100%;
  }
  .main-nav .close-nav {
    position: absolute;
    top: 1vw;
    right: 1vw;
    width: 10vw;
    height: 10vw;
    line-height: 10vw;
    background-color: #ad81b2;
    color: #fff;
    text-align: center;
  }
  .main-nav ul {
    margin: 0;
    padding: 0;
    position: fixed;
    top: 12vw;
    left: 0;
    width: 100vw;
    height: 100%;
    z-index: 200;
    background-color: rgba(255, 255, 255, 0.8);
    font-size: 3.0rem;
    line-height: 6.0rem;
    color: #ad81b2;
  }
  .main-nav ul li {
    border-bottom: solid 1px;
    color: #ad81b2;
    padding: 0 1rem;
    clear: both;
  }
  .main-nav ul a {
    color: #ad81b2;
    text-decoration: none;
  }
}

.title-mam {
  position: absolute;
  bottom: 2vw;
  right: 2vw;
}

.title-mam img {
  width: 200px;
}

@media screen and (max-width: 768px) {
  .title-mam {
    position: absolute;
    bottom: 10px;
    right: 10px;
  }
  .title-mam img {
    width: 100px;
  }
}

.title-box-wapper {
  position: absolute;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  left: 0;
}

.title-box-wapper .title-box {
  background-color: rgba(255, 255, 255, 0.9);
}

.title-box-wapper .title-box .info {
  color: #ad81b2;
}

.title-box-wapper .title-box .info a {
  color: #ad81b2;
}

.title-box-wapper .title-box .info ul {
  list-style: none;
}

.btn {
  color: #ffffff !important;
  background-color: #ad81b2;
}

.btn a {
  background-color: #ad81b2;
}

@media screen and (min-width: 769px) {
  .title-box-wapper {
    height: calc(100% - 3.4rem);
    top: 3.4rem;
  }
  .title-box-wapper .title-box {
    width: 1000px;
    max-width: 80%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .title-box-wapper .title-box .title-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    margin: 40px;
  }
  .title-box-wapper .title-box .title-items .title-item-logo {
    width: 36%;
  }
  .title-box-wapper .title-box .title-items .title-item-logo img {
    width: 100%;
  }
  .title-box-wapper .title-box .title-items .title-item-title {
    width: calc(64% - 20px);
    margin-left: 40px;
    text-align: center;
    position: relative;
    white-space: nowrap;
  }
  .title-box-wapper .title-box .title-items .title-item-title .title p {
    margin-bottom: 0.6em;
  }
}

@media screen and (min-width: 769px) and (max-width: 1180px) {
  .title-box-wapper .title-box .title-items .title-item-title .title p {
    font-size: 1.2vw;
    line-height: 1.2vw;
  }
}

@media screen and (min-width: 769px) {
  .title-box-wapper .title-box .title-items .title-item-title .title h1 {
    font-size: 1.8rem;
  }
}

@media screen and (min-width: 769px) and (max-width: 1180px) {
  .title-box-wapper .title-box .title-items .title-item-title .title h1 {
    font-size: 2.8vw;
    line-height: 2.8vw;
  }
}

@media screen and (min-width: 769px) {
  .title-box-wapper .title-box .title-items .title-item-title .info {
    position: absolute;
    bottom: 0;
    width: 100%;
  }
  .title-box-wapper .title-box .title-items .title-item-title .info p {
    font-size: 1.1rem;
  }
  .title-box-wapper .title-box .title-items .title-item-title .info p a {
    display: inline-block;
    margin-left: 1rem;
  }
  .title-box-wapper .title-box .title-items .title-item-title .info .btn {
    margin: 0.5rem auto 0;
    display: block;
    width: 15em;
    font-size: 1.2rem;
    line-height: 3.0rem;
    border-radius: 1.5rem;
  }
}

@media screen and (min-width: 769px) and (max-width: 864px) {
  .title-box-wapper .title-box .title-items .title-item-title .info .btn {
    font-size: .9rem;
    line-height: 2.6rem;
    border-radius: 1.3rem;
  }
}

@media screen and (max-width: 768px) {
  .title-box-wapper {
    top: 10vw;
    left: 0;
    height: calc(100% - 10.0vw);
  }
  .title-box-wapper .title-box {
    position: relative;
    width: 70%;
    height: 80%;
    padding: 4%;
  }
  .title-box-wapper .title-box .title-item-logo {
    width: 30%;
    margin: 0 auto;
  }
  .title-box-wapper .title-box .title-item-logo img {
    width: 100%;
  }
  .title-box-wapper .title-box .title {
    margin-top: 1rem;
    text-align: center;
  }
  .title-box-wapper .title-box .title p {
    font-size: 1.0rem;
    margin-bottom: 0.6rem;
  }
  .title-box-wapper .title-box .title h1 {
    font-size: 1.9rem;
  }
  .title-box-wapper .title-box .info {
    margin: 1.2rem auto;
    width: 18rem;
    text-align: center;
  }
  .title-box-wapper .title-box .info p {
    margin-bottom: 1em;
    font-size: 1.5rem;
    margin-bottom: 0.6rem;
    line-height: 2.4rem;
  }
  .title-box-wapper .title-box .info p a {
    display: block;
  }
  .title-box-wapper .title-box .info .btn {
    margin: 0.6rem auto 0;
    display: block;
    font-size: 1.3rem;
    line-height: 3.8rem;
    border-radius: 1.9rem;
    text-align: center;
  }
}

main {
  width: 100%;
}

article {
  width: 100%;
}

article .container-title {
  width: 100%;
  height: 100%;
  padding: 5rem 0 3rem 0;
  background-color: #fff;
}

article h2 {
  text-align: center;
  font-size: 1.6rem;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  article h2 {
    text-align: center;
    font-size: 3rem;
  }
}

article h2::before {
  content: "access";
  color: #d15090;
  font-size: 1.4rem;
  line-height: 2rem;
  display: block;
}

@media screen and (max-width: 768px) {
  article h2::before {
    font-size: 2rem;
    line-height: 4rem;
  }
}

article .container {
  display: block;
  width: 1000px;
  max-width: 100%;
  margin: 0 auto;
  padding-bottom: 2rem;
}

@media screen and (max-width: 768px) {
  article .container {
    max-width: 94%;
  }
}

article .container p, article .container ul, article .container dl {
  font-size: 0.7rem;
  line-height: 1.2rem;
}

@media screen and (max-width: 768px) {
  article .container p, article .container ul, article .container dl {
    font-size: 1.4rem;
    line-height: 2rem;
  }
}

article .container .contents {
  width: 100%;
}

@media screen and (min-width: 1000px) {
  article .container .contents {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}

article .contents-wrapper {
  width: 100%;
}

article .contents-wrapper .photos,
article .contents-wrapper .contents {
  margin: 2rem auto;
  position: relative;
}

article .contents-wrapper .photos .content,
article .contents-wrapper .contents .content {
  width: 100%;
}

article .contents-wrapper .contents:last-child {
  margin-bottom: 0;
}

article#about {
  margin-top: 2rem;
  border-bottom: solid 6px #e6e6e6;
  text-align: center;
}

article#about h2::before {
  content: "about";
}

@media screen and (max-width: 768px) {
  article#about {
    text-align: left;
  }
}

article#about .contents .content {
  margin: 0 auto 2rem auto;
  text-align: center;
}

article#about .contents .content img {
  width: 100%;
  max-width: 400px;
}

@media screen and (min-width: 1000px) {
  article#about .contents .content {
    width: 50%;
  }
  article#about .contents .content img {
    width: calc(100% - 1rem);
    max-width: 500px;
  }
}

article#about .contents .fb-container {
  margin: 0 auto;
  width: 100%;
  max-width: 400px;
  overflow: hidden;
}

article#about p {
  padding-bottom: 3rem;
}

article#about p.first-info {
  color: #ad81b2;
  font-size: 1.0rem;
}

@media screen and (max-width: 768px) {
  article#about p.first-info {
    font-size: 1.7rem;
    line-height: 2.4rem;
  }
}

article#service {
  background-color: #f1eee4;
}

article#service h2::before {
  content: "service";
}

article#service .contents-wrapper .contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  border-top: solid 0.5rem #fff;
  border-bottom: solid 0.5rem #fff;
  padding: 0.5rem 0;
}

@media screen and (max-width: 768px) {
  article#service .contents-wrapper .contents {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    max-width: 100%;
  }
}

article#service .contents-wrapper .contents .content {
  margin: 0;
  background-color: #fff;
  padding: 1rem 1rem 0 1rem;
}

@media screen and (min-width: 769px) {
  article#service .contents-wrapper .contents .content h3 {
    font-size: 1.2rem;
    margin-bottom: 0.3rem;
  }
}

@media screen and (max-width: 768px) {
  article#service .contents-wrapper .contents .content h3 {
    font-size: 2.4rem;
    line-height: 4rem;
  }
}

article#service .contents-wrapper .contents .content ul.info {
  list-style: none;
  margin: 0;
}

article#service .contents-wrapper .contents .content ul.info li {
  margin: 0.5rem 0;
  padding-left: 0.9rem;
  border-left: #d15090 0.2rem solid;
  white-space: nowrap;
}

article#service .contents-wrapper .contents .content ul.info li span:first-child {
  display: inline-block;
  width: 34%;
}

@media screen and (min-width: 769px) {
  article#service .contents-wrapper .contents .content ul.info {
    line-height: 0.7rem;
  }
}

@media screen and (max-width: 768px) {
  article#service .contents-wrapper .contents .content ul.info li {
    margin: 1.4rem 0;
  }
}

article#service .contents-wrapper .contents .content ul.link {
  list-style: none;
}

article#service .contents-wrapper .contents .content ul.link li {
  line-height: 1rem;
  margin: 0.6rem 0;
  padding-left: 1.2rem;
  background: url(../../images/icon_link.jpg) no-repeat;
  background-size: auto 100%;
}

@media screen and (max-width: 768px) {
  article#service .contents-wrapper .contents .content ul.link li {
    margin: 2rem 0;
  }
}

article#service .contents-wrapper .contents .content ul.link li a {
  color: #d15090;
}

article#service .contents-wrapper .contents .content .btn {
  font-size: 0.7rem;
  line-height: 1.8rem;
  width: 9rem;
  text-align: center;
  border-radius: 0.4rem;
  margin: 0.6rem 0;
}

@media screen and (max-width: 768px) {
  article#service .contents-wrapper .contents .content .btn {
    width: 50%;
    font-size: 1.4rem;
    line-height: 4.2rem;
    border-radius: 1.5rem;
    margin: 1rem 0 2rem 0;
  }
}

article#service .contents-wrapper .contents .content .btn a {
  color: #fff;
}

article#service .contents-wrapper .contents .image {
  padding: 0;
}

article#service .contents-wrapper .contents .image img {
  width: 100%;
}

@media screen and (min-width: 769px) {
  article#service .contents-wrapper .contents:nth-child(2) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
}

article#service .contents-wrapper .photos {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  article#service .contents-wrapper .photos {
    max-width: 100%;
  }
}

article#service .contents-wrapper .photos .image {
  padding: 0;
}

article#service .contents-wrapper .photos .image img {
  width: 100%;
}

article#menu {
  background-color: #e7f3f3;
}

article#menu h2::before {
  content: "menu";
}

article#menu .contents {
  display: block;
  width: 100%;
}

@media only screen and (max-width: 1000px) {
  article#menu .contents {
    padding: 0 1rem;
  }
}

@media only screen and (max-width: 768px) {
  article#menu .contents {
    padding: 0;
  }
}

article#menu .contents h3 {
  width: 100%;
  background-color: #9acacc;
  color: #fff;
  font-size: 1rem;
  line-height: 2.5rem;
  margin-top: 0.5rem;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  article#menu .contents h3 {
    font-size: 2rem;
    line-height: 2em;
    margin: 1.5em 0;
  }
}

article#menu .contents ul {
  list-style: none;
}

article#menu .contents .content {
  overflow: hidden;
}

article#menu .contents .menu-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: calc(100% + 1rem);
}

article#menu .contents .menu-items .menu-item {
  width: calc(25% - 1rem);
  margin-right: 1rem;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  article#menu .contents .menu-items .menu-item {
    width: calc(50% - 1rem);
  }
}

article#menu .contents .menu-items .menu-item .menu-name {
  color: #9acacc;
  font-size: 1rem;
  line-height: 3rem;
  margin-top: 0.5rem;
}

@media only screen and (max-width: 768px) {
  article#menu .contents .menu-items .menu-item .menu-name {
    font-size: 2.0rem;
    line-height: 4rem;
  }
}

article#menu .contents .menu-items .menu-item .menu-image {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  margin: 0 auto;
  background-color: #fff;
  border-radius: 50%;
}

article#menu .contents .menu-items .menu-item .menu-info {
  margin-top: 0.5rem;
}

article#menu .contents .menu-items .menu-item:nth-child(1) .menu-image {
  background: url(../../images/menu_01.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(2) .menu-image {
  background: url(../../images/menu_02.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(3) .menu-image {
  background: url(../../images/menu_03.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(4) .menu-image {
  background: url(../../images/menu_04.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(5) .menu-image {
  background: url(../../images/menu_05.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(6) .menu-image {
  background: url(../../images/menu_06.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(7) .menu-image {
  background: url(../../images/menu_07.jpg) center;
  background-size: cover;
}

article#menu .contents .menu-items .menu-item:nth-child(8) .menu-image {
  background-color: #9acacc;
}

article#menu .contents .menu-items .menu-item:nth-child(8) .menu-image a {
  padding-top: 25%;
  display: block;
  color: #fff;
}

article#menu .contents .menu-items .menu-item:nth-child(8) .menu-image a img {
  display: block;
  margin: 0 auto 1rem auto;
  width: 20%;
}

article#menu .contents .menu-th-images {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 2rem;
}

article#menu .contents .menu-th-images .menu-th-image {
  margin-right: 0.1rem;
}

article#menu .contents .menu-th-images .menu-th-image img {
  width: 100%;
}

article#menu .contents .menu-th-images .menu-th-image:last-child {
  margin-right: 0rem;
}

article#menu .modal-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 1000;
}

article#menu .modal-wrapper > div {
  width: 60%;
  background-color: #F7F3EB;
  position: absolute;
  top: 10vw;
  left: 20%;
  padding: 1rem 1rem 1rem;
}

@media screen and (max-width: 768px) {
  article#menu .modal-wrapper > div {
    width: 80%;
    left: 10%;
  }
}

article#menu .modal-wrapper h3 {
  background-color: #666666;
  text-align: left;
  padding-left: 1rem;
}

@media screen and (max-width: 768px) {
  article#menu .modal-wrapper h3 {
    margin: 1.5rem 0;
  }
}

article#menu .modal-wrapper .menu-list {
  color: #000;
  margin: 1rem 0;
}

article#menu .modal-wrapper .menu-list li {
  padding: 0.4rem 0;
  border-bottom: solid 1px #DDDAD7;
}

article#menu .modal-wrapper .btn {
  line-height: 1.8rem;
  width: 9rem;
  text-align: center;
  border-radius: 0.4rem;
  margin: auto;
}

@media screen and (max-width: 768px) {
  article#menu .modal-wrapper .btn {
    width: 50%;
    font-size: 1.4rem;
    line-height: 4.2rem;
    border-radius: 1.5rem;
    margin: auto;
  }
}

article#menu .modal-wrapper .btn a {
  color: #fff;
  display: block;
  height: 100%;
}

article#menu [v-cloak] {
  display: none;
}

article#calendar {
  background-color: #efe3ee;
}

article#calendar h2::before {
  content: "calendar";
}

article#calendar .contents {
  display: block;
  background-color: #fff;
  width: 100%;
  border-radius: 2rem;
  padding: 1rem;
}

@media only screen and (max-width: 1000px) {
  article#calendar .contents {
    width: calc(100% - 2rem);
  }
}

@media only screen and (max-width: 768px) {
  article#calendar .contents {
    width: 100%;
  }
}

article#calendar .contents .btn {
  text-align: center;
  width: 20rem;
  line-height: 3em;
  border-radius: 1em;
  margin: 0 auto;
}

article#calendar .contents .btn a {
  color: #fff;
}

@media screen and (max-width: 768px) {
  article#calendar .contents .btn {
    font-size: 1.4rem;
    line-height: 4.2rem;
    border-radius: 1.5rem;
  }
}

article#calendar .cal_wrapper {
  max-width: 800px;
  /* 最大幅 */
  min-width: 300px;
  /* 最小幅 */
  margin: 2.0833% auto;
}

article#calendar .cal_wrapper .googlecal {
  position: relative;
  padding-bottom: 100%;
  /* 縦横比 */
  height: 0;
  overflow: hidden;
}

article#calendar .cal_wrapper .googlecal iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

@media only screen and (min-width: 769px) {
  article#calendar .cal_wrapper .googlecal {
    /* 画面幅が600px以上の場合の縦横比の指定 */
    padding-bottom: 75%;
  }
}

article#access {
  background-color: #dcf3d7;
}

article#access h2::before {
  content: "access";
}

article#access .contents {
  display: block;
  background-color: #fff;
  width: 100%;
  padding: 1rem;
}

@media only screen and (max-width: 1000px) {
  article#access .contents {
    width: calc(100% - 2rem);
  }
}

@media only screen and (max-width: 768px) {
  article#access .contents {
    width: 100%;
  }
}

article#access .contents dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 100%;
}

article#access .contents dl dt {
  background-color: #e8e8ea;
  color: #B57FB5;
  width: 30%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0.25rem 0;
  padding: 0.7rem;
}

article#access .contents dl dd {
  color: gray;
  width: calc(70% - 0.5rem);
  border: 2px solid #ccc;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0.25rem 0 0.25rem 0.5rem;
  padding: 0.7rem;
}

@media only screen and (max-width: 768px) {
  article#access .contents dl dd span {
    display: block;
  }
}

article#access .contents dl dd a {
  color: gray;
}

article#access .contents .access-images {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 0.3rem;
}

@media screen and (max-width: 768px) {
  article#access .contents .access-images {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

article#access .contents .access-images .access-image {
  margin-right: 0.8rem;
}

@media screen and (max-width: 768px) {
  article#access .contents .access-images .access-image {
    margin-top: 1rem;
    width: 100%;
  }
}

article#access .contents .access-images .access-image img {
  width: 100%;
}

article#access .contents .access-images .access-image:last-child {
  margin-right: 0rem;
}

article#access .contents .access-map {
  margin-top: 0.7rem;
  position: relative;
  padding-bottom: 36%;
  height: 0;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  article#access .contents .access-map {
    margin-top: 1rem;
    padding-bottom: 56%;
  }
}

article#access .contents .access-map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 768px) {
  article#access .contents dl {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
  }
  article#access .contents dl dt,
  article#access .contents dl dd {
    width: 100%;
  }
  article#access .contents dl dt {
    line-height: 3rem;
  }
  article#access .contents dl dd {
    margin: 0;
  }
}

footer {
  margin: 0 auto;
  width: 100%;
}

@media only screen and (max-width: 1000px) {
  footer {
    width: calc(100% - 2rem);
  }
}

@media only screen and (max-width: 768px) {
  footer {
    width: 100%;
  }
}

footer .button-area {
  margin: 0 auto;
  max-width: 1000px;
  margin-top: 2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media screen and (max-width: 768px) {
  footer .button-area {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-top: 0;
  }
}

footer .button-area .button {
  padding: 1rem;
}

@media screen and (max-width: 768px) {
  footer .button-area .button {
    margin-top: 2rem;
    padding: 0;
    width: 80%;
  }
}

footer .button-area .button img {
  width: 100%;
}

footer .info-area {
  margin: 2rem 0;
}

footer .info-area ul {
  text-align: center;
  padding: 0;
  margin: 0;
}

footer .info-area ul li {
  display: inline-block;
  font-size: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-left: 1px solid;
  border-right: 1px solid;
}

footer .info-area ul li + li {
  border-left: 0;
  border-right: 1px solid;
}

footer .info-area ul li a {
  text-decoration: none;
}

footer .info-area .copylight {
  text-align: center;
  padding-bottom: 0.7rem;
  margin: 0;
}
/*# sourceMappingURL=style.css.map */