@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700&display=swap");
/* CSS Document */
* {
  margin: 0;
  padding: 0;
  outline: none;
  /*-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-appearance: none;
*/
}

html {
  font-size: 62.5%;
}

body {
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN','メイリオ',Meiryo,'ＭＳ Ｐゴシック', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  background: #6c6e70;
  color: #444;
  text-align: center;
  scrolling: yes;
  position: relative;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}

body.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}

a {
  color: #444;
  text-decoration: none;
  overflow: hidden;
  outline: none;
  cursor: pointer;
}

a[href^="tel"] {
  color: inherit;
  text-decoration: none;
}

@media screen and (min-width: 990px) {
  a[href^="tel"] {
    pointer-events: none;
  }
}

a:hover {
  text-decoration: none;
  color: #444;
}

p {
  font-size: 1.4rem;
}

img {
  border: none;
  vertical-align: top;
}

table {
  border-collapse: collapse;
}

ul {
  list-style-type: none;
}

button, input, select {
  border: none;
  cursor: pointer;
}

select {
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}

select::-ms-expand {
  display: none;
}

select,
button,
input[type="submit"] {
  -webkit-appearance: none;
}

h1, h2, h3 {
  font-weight: normal;
}

h4, h5, h6, strong {
  font-weight: 500;
}

/* FOR SLICK.JS */
.slick-list {
  _zoom: 1;
  overflow: hidden;
}

.chatBtn {
  margin-bottom: 10px;
}

.chatBtn a {
  display: block;
  border: 2px solid #638fa2;
  background: #f7f8f9;
  border-radius: 7px;
  line-height: 35px;
  height: 35px;
  text-align: center;
  font-weight: bold;
}

.chatBtn a::before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  background: url("../img/common/icon_chat.png?ver0.2") no-repeat center/100% auto;
  width: 30px;
  height: 30px;
  margin: 0 6px 5px 0;
}

div[style="position: fixed; width: 0px; height: 0px; bottom: 0px; right: 0px; z-index: 2147483647; overflow: visible;"] {
  display: none;
}

@media screen and (max-width: 989px) {
  div[style="position: fixed; width: 0px; height: 0px; bottom: 0px; right: 0px; z-index: 2147483647; overflow: visible;"] {
    z-index: 100 !important;
  }
}

/* ::::::::::::::::::::::::::::::::: COMMON ::::::::::::::::::::::::::::::::: */
.wrap {
  overflow: hidden;
  width: 100%;
  min-width: 980px;
  padding-top: 160px;
}

/*COMMON*/
h1 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-size: 3.8rem;
  line-height: 1.6;
  font-weight: 900;
  color: #222;
  margin: 0 0 35px;
}

h1 span.ja {
  font-weight: 500;
  font-size: 1.7rem;
}

h3 {
  font-size: 2.1rem;
  margin: 0 0 35px;
  font-weight: 500;
  color: #222;
}

h3.en {
  font-size: 2.6rem;
  font-weight: 900;
}

h3.withBar {
  font-size: 2.0rem;
  color: #FFF;
  padding: 10px 20px;
  background: #7e8082;
  text-align: left;
}

h3.withTab {
  margin: 0 0 20px;
}

h4 {
  font-size: 1.8rem;
  margin: 0 0 30px;
}

h2 a,
h3 a,
h4 a {
  color: inherit;
  transition: all .6s;
}

h2 a:hover,
h3 a:hover,
h4 a:hover {
  opacity: .7;
}

.max {
  width: 100%;
}

.breadcrumbs {
  padding: 7px 20px 13px;
  text-align: left;
  background: #6c6e70;
}

.breadcrumbs li {
  display: inline;
  color: #EEE;
  font-size: 1.1rem;
  line-height: 1.4;
  vertical-align: middle;
  padding: 0 10px 0 20px;
  /*background: url(../img/common/bread_page.svg) no-repeat center left;*/
  background-size: 12px 12px;
}

.breadcrumbs li:first-child {
  /*background: url(../img/common/bread_home.svg) no-repeat center left;*/
  background-size: 12px 12px;
}

.breadcrumbs li a {
  color: #EEE;
  text-decoration: underline;
}

.breadcrumbs li a:hover {
  color: #CCC;
}

.pageNaviList {
  padding: 10px 20px 13px;
  background: #515457;
}

.pageNaviList li {
  display: inline-block;
  font-size: 1.35rem;
  padding: 0 13px;
}

.pageNaviList li a {
  color: #FFF;
}

.sldBlock {
  width: 100%;
}

.sldBlock ul {
  width: 100%;
  background: #6c6e70;
  _zoom: 1;
  overflow: hidden;
}

.sldBlock ul li {
  float: left;
  width: 25%;
  opacity: 0.3;
  cursor: pointer;
}

.sldBlock ul li.on {
  opacity: 1;
}

.tagList {
  text-align: left;
  margin: 0 0 30px;
}

.tagList li {
  display: inline-block;
  font-size: 1.2rem;
  line-height: 20px;
  padding: 0 8px;
  background: #f4f2f0;
  margin: 0 5px 3px 0;
}

.subColorLinkBlock {
  background: #a7cac7;
  text-align: left;
  position: relative;
}

.subColorLinkBlock a {
  display: block;
  color: #FFF;
}

.subColorLinkBlock .title {
  padding: 110px 0 15px 9%;
  font-size: 2.7rem;
  font-weight: 500;
}

.subColorLinkBlock .sub {
  padding: 0 0 110px 9%;
}

.subColorLinkBlock .more {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 260px;
  height: 100%;
  right: 0;
  top: 0;
  background: #8ab8b4;
  border-right: 20px solid #466e48;
  font-size: 1.5rem;
  font-weight: 500;
  transition: width 0.3s ease;
}

.subColorLinkBlock .more span {
  border-bottom: 2px solid #FFF;
  padding: 3px 2px 2px;
}

.subColorLinkBlock a:hover .more {
  width: 310px;
}

.subColorLinkBlock.green {
  background: #a7cac7;
}

.subColorLinkBlock.green .more {
  background: #8ab8b4;
  border-color: #466e48;
}

.subColorLinkBlock.yellow {
  background: #dfc895;
}

.subColorLinkBlock.yellow .more {
  background: #d4b572;
  border-color: #ab7d33;
}

.subColorLinkBlock.red {
  background: #dbadab;
}

.subColorLinkBlock.red .more {
  background: #cf928f;
  border-color: #851d37;
}

.subColorLinkBlock.purple {
  background: #aca1b5;
}

.subColorLinkBlock.purple .more {
  background: #91829d;
  border-color: #65577b;
}

.subColorLinkBlock.blue {
  background: #96aeba;
}

.subColorLinkBlock.blue .more {
  background: #7393a3;
  border-color: #293e5c;
}

.subColorLinkBlock.brown {
  background: #b6a9a2;
}

.subColorLinkBlock.brown .more {
  background: #9d8d83;
  border-color: #665852;
}

.contactLinkBlock {
  padding: 60px 0 80px;
  position: relative;
  background: #8ab8b4;
  border-left: 20px solid #a7cac7;
  border-right: 20px solid #466e48;
}

.contactLinkBlock p {
  color: #FFF;
}

.contactLinkBlock .title {
  font-size: 2.7rem;
  font-weight: 500;
  padding: 0 0 45px;
}

.contactLinkBlock .inner {
  border: 2px solid rgba(255, 255, 255, 0.9);
  width: 700px;
  margin: 0 auto;
  padding: 40px 0 35px;
  border-radius: 3px;
}

.contactLinkBlock .inner .tel {
  margin: 0 0 20px;
}

.contactLinkBlock .inner .tel .num {
  padding: 0 0 0 65px;
  background: url(../img/common/mark_tel_white.svg) no-repeat 0px 5px;
  background-size: 45px 45px;
  line-height: 50px;
  font-size: 4.0rem;
  font-weight: 500;
  pointer-events: none;
}

.contactLinkBlock .inner .tel span.sub {
  font-size: 1.5rem;
  padding: 0 0 0 10px;
}

.contactLinkBlock .inner .time {
  margin: -5px 0 20px;
  font-size: 1.3rem;
}

.contactLinkBlock .inner .linkList li {
  display: inline-block;
  padding: 0 7px;
  font-size: 1.3rem;
  font-weight: 500;
}

.contactLinkBlock .inner .linkList li.mail a {
  display: inline-block;
  line-height: 30px;
  padding: 0 25px 0 35px;
  border-radius: 15px;
  color: #8ab8b4;
  background: #FFF url(../img/common/vector_sub_green.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

.contactLinkBlock .inner .linkList li.term a {
  display: inline-block;
  border: 2px solid #FFF;
  line-height: 26px;
  padding: 0 30px 0 40px;
  border-radius: 15px;
  color: #FFF;
  text-decoration: none;
  background: url(../img/common/vector_sub_white.svg) no-repeat 25px 9.5px;
  background-size: 6px 7px;
}

.contactLinkBlock.green {
  background: #8ab8b4;
  border-left: 20px solid #8ab8b4;
  border-right: 20px solid #466e48;
}

.contactLinkBlock.green .inner .linkList li.mail a {
  color: #8ab8b4;
  background: #FFF url(../img/common/vector_sub_green.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

.contactLinkBlock.yellow {
  background: #d4b572;
  border-left: 20px solid #d4b572;
  border-right: 20px solid #ab7d33;
}

.contactLinkBlock.yellow .inner .linkList li.mail a {
  color: #d4b572;
  background: #FFF url(../img/common/vector_sub_yellow.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

.contactLinkBlock.red {
  background: #cf928f;
  border-left: 20px solid #cf928f;
  border-right: 20px solid #851d37;
}

.contactLinkBlock.red .inner .linkList li.mail a {
  color: #cf928f;
  background: #FFF url(../img/common/vector_sub_red.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

.contactLinkBlock.purple {
  background: #91829d;
  border-left: 20px solid #91829d;
  border-right: 20px solid #65577b;
}

.contactLinkBlock.purple .inner .linkList li.mail a {
  color: #91829d;
  background: #FFF url(../img/common/vector_sub_purple.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

.contactLinkBlock.blue {
  background: #7393a3;
  border-left: 20px solid #7393a3;
  border-right: 20px solid #293e5c;
}

.contactLinkBlock.blue .inner .linkList li.mail a {
  color: #7393a3;
  background: #FFF url(../img/common/vector_sub_blue.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

.contactLinkBlock.brown {
  background: #9d8d83;
  border-left: 20px solid #9d8d83;
  border-right: 20px solid #665852;
}

.contactLinkBlock.brown .inner .linkList li.mail a {
  color: #9d8d83;
  background: #FFF url(../img/common/vector_sub_brown.svg) no-repeat 25px 11.5px;
  background-size: 6px 7px;
}

a.outerLinkBlack {
  padding-right: 25px;
  background: url(../img/common/linkmark_gray.svg) no-repeat right center;
  background-size: 19px 15px;
}

a.outerLinkWhite {
  padding-right: 25px;
  background: url(../img/common/linkmark_white.svg) no-repeat right center;
  background-size: 19px 15px;
}

.hoverAlpha {
  transition: opacity 0.2s ease;
}

.hoverAlpha:hover {
  opacity: 0.8;
}

a[class="pdf"] {
  background: url(../img/common/icon_pdf.png) no-repeat left center/16px auto;
  padding-left: 20px;
  text-decoration: underline;
  color: #638fa2;
}

a[class="pdf"]:hover {
  text-decoration: none;
}

.btnSS,
.btnS,
.btnM,
.btnL {
  width: 100%;
}

.btnSS a,
.btnS a,
.btnM a,
.btnL a {
  width: 100%;
  display: block;
  line-height: 40px;
  font-size: 1.45rem;
  padding: 0;
  background: #638fa2;
  color: #FFF !important;
  font-weight: 500;
  text-align: center;
  text-decoration: none !important;
}

.btnSS.gray a,
.btnS.gray a,
.btnM.gray a,
.btnL.gray a {
  background: #a8aaab;
}

.btnSS.brown a,
.btnS.brown a,
.btnM.brown a,
.btnL.brown a {
  background: #665852;
}

.btnSS {
  max-width: 125px;
}

.btnS {
  max-width: 180px;
}

.btnM {
  max-width: 260px;
}

.btnL {
  max-width: 260px;
}

.btnL a {
  font-size: 1.8rem;
  line-height: 60px;
}

.external a {
  box-sizing: border-box;
}

.external a::after {
  content: '';
  display: inline-block;
  vertical-align: middle;
  background: url(../img/common/linkmark_white.svg) no-repeat 0 -1px/19px auto;
  width: 19px;
  height: 15px;
  margin-left: 10px;
}

.btnWrap {
  display: flex;
  margin: 30px 0;
}

.btnWrap:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 989px) {
  .btnWrap {
    display: block;
  }
}

.btnWrap li {
  background: none;
  padding: 0;
}

@media screen and (max-width: 989px) {
  .btnWrap li {
    max-width: none;
  }
}

.btnWrap li + li {
  margin-left: 20px;
}

@media screen and (max-width: 989px) {
  .btnWrap li + li {
    margin: 10px 0 0;
  }
}

.btnWrap.center {
  justify-content: center;
}

@media screen and (max-width: 989px) {
  .btnWrap.half {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}

@media screen and (max-width: 989px) {
  .btnWrap.half li {
    width: calc(50% - 5px);
    margin-top: 10px;
  }
  .btnWrap.half li a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
}

@media screen and (max-width: 989px) {
  .btnWrap.half li + li {
    margin: 10px 0 0;
  }
}

@media screen and (max-width: 989px) {
  .btnWrap.half > li:nth-child(-n+2) {
    margin-top: 0;
  }
}

.iconLink a {
  display: inline-block;
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat left center/7px auto;*/
  padding-left: 15px;
  color: #638fa2;
  text-decoration: underline;
}

.iconLink a:hover {
  text-decoration: none;
}

/* HEADER */
.mainHeader {
  height: 160px;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1010;
  background: #FFF;
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.06);
}

.mainHeader .siteTitle {
  width: 230px;
  height: 125px;
  float: left;
  padding: 20px 0 0 30px;
}

.mainHeader .siteTitle img.logo2 {
  display: none;
}

.mainHeader .mainMenu {
  padding: 90px 0 0 0;
  width: calc(100% - 300px);
  max-width: 1300px;
  height: 60px;
  float: right;
  display: table;
  table-layout: fixed;
}

@media screen and (max-width: 1300px) {
  .mainHeader .mainMenu {
    table-layout: auto;
  }
}

.mainHeader .mainMenu li {
  display: table-cell;
  font-size: 1.4rem;
  line-height: 1.4;
  vertical-align: middle;
  position: relative;
}

.mainHeader .mainMenu li::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 40px;
  left: 0;
  top: 10px;
  border-left: 1px solid #ebebeb;
}

.mainHeader .mainMenu li a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 0 10px;
}

.mainHeader .mainMenu li.active a {
  color: #638fa2;
}

.mainHeader .subMenu {
  position: absolute;
  width: calc(100% - 610px);
  text-align: right;
  left: 300px;
  top: 10px;
}

.mainHeader .subMenu li {
  display: inline-block;
  font-size: 1.15rem;
  vertical-align: top;
  padding: 0 0 0 12px;
  margin: 0 0 0 10px;
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat left center;*/
  background-size: 6px 6px;
}

.mainHeader .subMenu li a {
  color: #777;
}

.mainHeader .subMenu li a:hover {
  text-decoration: underline;
}

.mainHeader .btnList {
  width: 280px;
  height: 60px;
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
}

.mainHeader .btnList li {
  display: flex;
}

.mainHeader .btnList li.b1 {
  width: 70px;
}

.mainHeader .btnList li.b1 a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 60px;
  background: #dce4e8;
  line-height: 1.4;
  color: #638fa2;
  font-size: 1.15rem;
}

.mainHeader .btnList li.b2 {
  position: relative;
  width: 70px;
}

.mainHeader .btnList li.b2 button,
.mainHeader .btnList li.b3 button {
  width: 100%;
  color: #FFF;
  position: relative;
}

.mainHeader .btnList li.b2 button {
  background: #96aeba;
  line-height: 1.4;
  font-size: 1.2rem;
  padding: 0 0 5px;
}

.mainHeader .btnList li.b2 .langList {
  display: none;
  position: absolute;
  top: 60px;
  left: 0;
  background: #96aeba;
  width: 100px;
  font-size: 1.3rem;
}

.mainHeader .btnList li.b2 .langList li {
  border-top: 1px solid #dce4e8;
}

.mainHeader .btnList li.b2 .langList a {
  display: block;
  width: 100%;
  padding: 8px 12px;
  color: #fff;
  text-align: left;
  transition: all .3s;
}

.mainHeader .btnList li.b2 .langList a:hover {
  background: rgba(255, 255, 255, 0.3);
}

.mainHeader .btnList li.b3 {
  width: 140px;
}

.mainHeader .btnList li.b3 button {
  background: #638fa2;
  line-height: 1.4;
  font-size: 1.5rem;
  padding: 0 0 3px;
}

.mainHeader .btnList li.b2 button::after,
.mainHeader .btnList li.b3 button::after {
  background: url(../img/common/vector_white_down.svg) no-repeat center center;
  background-size: 6px 6px;
  position: absolute;
  width: 6px;
  height: 6px;
  bottom: 5px;
  left: 0;
  right: 0;
  margin: 0 auto;
  content: "";
}

.mainHeader .btnList li.b4 {
  width: 50%;
}

.mainHeader .btnList li.b4 button {
  background: #24272a;
  color: #FFF;
  font-size: 0.9rem;
  width: 100%;
  height: 60px;
  padding: 27px 0 0;
  position: relative;
  box-sizing: border-box;
  font-weight: 500;
}

.mainHeader .btnList li.b4 button span.c {
  display: none;
}

.mainHeader .btnList li.b4 button::before,
.mainHeader .btnList li.b4 button::after {
  content: "";
  width: 20px;
  border-top: 2px solid rgba(255, 255, 255, 0.9);
  left: 0;
  top: 16px;
  right: 0;
  margin: auto;
  position: absolute;
  transition: all 0.3s ease;
}

.mainHeader .btnList li.b4 button::after {
  top: 26px;
}

.mainHeader .btnList li.b4 .close::before {
  transform: rotate(45deg);
  top: 20px;
}

.mainHeader .btnList li.b4 .close::after {
  transform: rotate(-45deg);
  top: 20px;
}

.mainHeader .btnList li.b4 .close span.o {
  display: none;
}

.mainHeader .btnList li.b4 .close span.c {
  display: inherit;
}

.mainHeader .btnList li.b4 .close span.m {
  position: absolute;
  display: block;
  height: 5px;
  width: 100%;
  right: 0;
  bottom: -5px;
  background: url(../img/common/mark_sp_menu_on.svg) no-repeat center center;
  background-size: 8px 5px;
  z-index: 1001;
}

.mainHeader .description {
  display: block;
  position: absolute;
  width: calc(100% - 610px);
  text-align: right;
  left: 300px;
  top: 35px;
  font-size: 1.15rem;
  font-weight: normal;
  color: #777;
}

.mainHeader.scroll {
  width: 100%;
  position: fixed;
  height: 60px;
}

.mainHeader.scroll .siteTitle {
  width: 340px;
  height: 28px;
  padding: 16px 0 0 30px;
}

.mainHeader.scroll .siteTitle img.logo1 {
  display: none;
}

.mainHeader.scroll .siteTitle img.logo2 {
  display: inherit;
}

.mainHeader.scroll .btnList {
  width: 140px;
}

.mainHeader.scroll .btnList li.b1,
.mainHeader.scroll .btnList li.b2,
.mainHeader.scroll .subMenu,
.mainHeader.scroll .description {
  display: none;
}

.mainHeader.scroll .mainMenu {
  padding: 0 13% 0 0;
  margin: 0;
  /*display: block;*/
  text-align: right;
  width: 680px;
  table-layout: auto;
}

.mainHeader.scroll .mainMenu li {
  /*display: inline-block; line-height: 60px;*/
}

.mainHeader.scroll .mainMenu li::after {
  display: none;
}

@media screen and (max-width: 1240px) {
  .mainHeader.scroll .btnList {
    width: 38%;
  }
  .mainHeader.scroll .btnList li.b3 {
    width: 50%;
  }
  .mainHeader.scroll .btnList li.b4 {
    display: block !important;
  }
  .mainHeader.scroll .mainMenu {
    display: none;
  }
}

/* MAIN VISUAL */
.mainVisualWrap {
  position: relative;
  overflow: hidden;
}

.mainVisualWrap h1 {
  position: absolute;
  width: 90%;
  height: 100%;
  left: 5%;
  top: 0;
  color: #FFF;
  margin: 0;
}

.mainVisualWrap + .breadcrumbs {
  position: absolute;
  left: 0;
  top: 160px;
  background: none;
  z-index: 2;
}

/* SECTION */
.section {
  padding: 60px 0 60px;
  position: relative;
}

.section.bgLightest {
  background: #f4f2f0;
}

.section.bgLighter {
  background: #eeebe8;
}

.section.bgDark {
  background: #515457;
  padding: 30px 0 0;
}

.section .inner960 {
  width: 960px;
  margin: 0 auto;
}

.section .inner960 > div:last-child {
  margin-bottom: 20px;
}

.section h1 {
  font-size: 3.5rem;
}

.section h2.lead {
  font-size: 2.7rem;
  font-weight: 500;
  color: #222;
  margin: 0 0 35px;
}

.section .lead {
  margin: 0 0 40px;
}

.section table {
  width: 100%;
}

.section table th,
.section table td {
  border: 1px solid #DDD;
  padding: 10px 15px;
  text-align: left;
  vertical-align: middle;
}

.section table th {
  background: #faf9f8;
  font-weight: 500;
}

.section .table01 {
  width: 100%;
}

.section .table01 th {
  background: #faf9f8;
  width: 25%;
  font-weight: 500;
}

.section .table01 th,
.section .table01 td {
  border: 1px solid #DDD;
  padding: 10px 15px;
  vertical-align: middle;
  text-align: left;
  font-size: 1.4rem;
}

.section.bgDark .pageNaviList {
  display: flex;
  justify-content: space-between;
  padding: 0 15px 30px;
  margin: 0 auto;
  max-width: 1500px;
}

.section.bgDark .pageNaviList li {
  width: 25%;
  flex-grow: 1;
  padding: 0 15px;
}

.section.bgDark .pageNaviList li a {
  color: #FFF;
  text-align: left;
  display: block;
  position: relative;
  height: 100%;
  background: #6c6e70;
}

.section.bgDark .pageNaviList li .title {
  font-size: 2.1rem;
  font-weight: 500;
  padding: 25px 40px 15px;
  position: relative;
}

.section.bgDark .pageNaviList li .title::after {
  position: absolute;
  width: 6px;
  height: 7px;
  content: "";
  background: url(../img/common/vector_sub_white.svg) no-repeat center center;
  background-size: 6px 7px;
  opacity: 0.7;
  left: 20px;
  top: 40px;
}

.section.bgDark .pageNaviList li .caption {
  font-size: 1.3rem;
  padding: 0 40px 35px;
}

.section.bgDark .pageNaviList.small li .title {
  font-size: 1.5rem;
  padding: 20px 40px;
}

.section.bgDark .pageNaviList.small li .title::after {
  top: 30px;
}

.section .boxList {
  display: flex;
  justify-content: space-between;
  width: 980px;
  margin: 0 -10px 50px;
}

.section .boxList li {
  margin: 0 10px;
  text-align: left;
  background: #FFF;
}

.section .boxList li .title {
  font-size: 1.8rem;
  font-weight: 500;
  padding: 20px 20px 15px;
  position: relative;
  color: #222;
}

.section .boxList li .caption {
  font-size: 1.3rem;
  padding: 0 20px 35px;
}

.section .boxList li a {
  display: block;
}

.section .boxList li a .title {
  text-indent: 15px;
}

.section .boxList li a .title::after {
  position: absolute;
  width: 6px;
  height: 6px;
  content: "";
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat center center;*/
  background-size: 6px 6px;
  left: 20px;
  top: 32px;
}

.section .boxList.small li .title {
  font-size: 1.5rem;
  font-weight: 500;
  padding: 15px 20px 15px;
}

.section .boxList.small li a .title::after {
  top: 25px;
}

.section .anchorList {
  background: #faf9f8;
  border: 1px solid #ddd;
  padding: 20px 30px 15px;
  margin: 0 0 50px;
  text-align: left;
  font-size: 1.4rem;
}

.section .anchorList li {
  display: inline-block;
  margin: 0 20px 5px 0;
}

.section .anchorList li a {
  color: #444;
  padding: 0 0 0 15px;
  text-decoration: underline;
  background: url(../img/common/vector_yellow_down.svg) no-repeat left center;
  background-size: 6px 6px;
}

.section .anchorList li a:hover {
  color: #638fa2;
}

.section .tabListL {
  width: 990px;
  display: flex;
  justify-content: space-between;
  margin: 0 -15px 50px;
}

.section .tabListL li {
  margin: 0 15px;
  width: 100%;
  font-weight: 500;
}

.section .tabListL li a,
.section .tabListL li span {
  line-height: 40px;
  font-size: 1.45rem;
  color: #FFF;
  background: #a8aaab;
  display: flex;
  justify-content: center;
  align-items: center;
}

.section .tabListL li span {
  background: #638fa2;
  position: relative;
}

.section .tabListL li span::after {
  content: "";
  background: #638fa2;
  width: 8px;
  height: 8px;
  left: 0;
  bottom: -3px;
  right: 0;
  transform: rotate(45deg);
  margin: 0 auto;
  position: absolute;
}

.section .tabListS {
  margin: 0 0 50px;
}

.section .tabListS li {
  display: inline-block;
  font-size: 1.4rem;
}

.section .tabListS li a,
.section .tabListS li span {
  padding: 0 10px 0 0;
  margin: 0 10px 0 0;
  position: relative;
}

.section .tabListS li span,
.section .tabListS li.active a {
  color: #638fa2;
  font-weight: 500;
  text-decoration: none;
}

.section .tabListS li a::after,
.section .tabListS li span::after {
  border-right: 1px solid #a0a0a0;
  content: "";
  position: absolute;
  height: 10px;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

.section .tabListS li a {
  text-decoration: underline;
}

.section .tabListS li a:hover {
  color: #638fa2;
}

.section .tabListS li:last-child a,
.section .tabListS li:last-child span {
  padding: 0;
  margin: 0;
}

.section .tabListS li:last-child a::after,
.section .tabListS li:last-child span::after {
  display: none;
}

.planTopBlock {
  width: 100%;
  margin: 0 auto 50px;
  background: #FFF;
  _zoom: 1;
  overflow: hidden;
}

.planTopBlock .sldBlock {
  float: left;
  width: 420px;
}

.planTopBlock .titleBlock {
  width: 460px;
  float: right;
  padding: 35px 40px 40px 0;
  text-align: left;
}

.planTopBlock .titleBlock h1 {
  font-weight: 500;
  font-size: 2.5rem;
  line-height: 1.7;
  margin: 0 0 10px;
  display: block;
}

.priceBlock {
  padding: 15px 20px;
  background: #faf9f8;
  border: 1px solid #ddd;
}

.priceBlock table {
  width: 100%;
  font-size: 1.4rem;
}

.priceBlock table th,
.priceBlock table td {
  text-align: left;
  vertical-align: top;
  border: none;
  padding: 0;
}

.priceBlock table th {
  width: 70px;
}

.planMainBlock {
  width: auto;
  padding: 40px 40px 30px;
  margin: 0 auto 50px;
  background: #FFF;
  text-align: left;
}

.borderBlock {
  padding: 40px 40px 30px;
  border: 1px solid #bbb;
  margin: 0 auto 50px;
  width: auto;
  text-align: left;
}

.freeArea img {
  max-width: 100%;
  overflow: hidden;
}

.freeArea p,
.freeArea ul.iconList,
.freeArea ol,
.freeArea table,
.freeArea blockquote,
.bgGray,
.freeArea hr {
  font-size: 1.4rem;
  margin: 0 0 40px;
}

.freeArea a {
  color: #638fa2;
  text-decoration: underline;
}

.freeArea a:hover {
  color: #D00;
}

.freeArea .imgBlock {
  _zoom: 1;
  overflow: hidden;
}

.freeArea .imgBlock.center .img {
  text-align: center;
}

.freeArea .imgBlock.left .img {
  float: left;
  padding-right: 40px;
}

.freeArea .imgBlock.right .img {
  float: right;
  padding-left: 40px;
}

ul.iconList li {
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat 0px 8px;*/
  background-size: 6px 6px;
  padding: 0 0 0 15px;
  text-align: left;
}

ul.iconList li a {
  color: #638fa2;
  text-decoration: underline;
}

ul.iconList li a:hover {
  text-decoration: none;
}

.freeArea .imgList {
  display: flex;
}

.freeArea .imgList + .imgList {
  margin-top: 30px;
}

.freeArea .imgList li {
  background: none;
  padding: 0;
  width: 280px;
}

.freeArea .imgList li + li {
  margin-left: 20px;
}

.freeArea .imgList li .img {
  text-align: center;
  margin: 0 0 10px;
}

.freeArea .imgList li .caption {
  text-align: center;
  margin: 0;
  font-size: 1.3rem;
}

.freeArea ol {
  padding: 0 0 0 15px;
}

.freeArea hr {
  border: none;
  border-top: 1px solid #e6e6e6;
  margin: 40px 0;
}

.freeArea blockquote,
.bgGray {
  background: #faf9f8;
  border: 1px solid #DDD;
  padding: 15px 20px;
}

.roomTopBlock {
  width: 100%;
  margin: 0 auto 50px;
  background: #FFF;
}

.roomTopBlock .sldBlock {
  _zoom: 1;
  overflow: hidden;
}

.roomTopBlock .sldBlock .img {
  width: 750px;
  height: 500px;
  float: left;
}

.roomTopBlock .sldBlock ul {
  width: 210px;
  float: right;
}

.roomTopBlock .sldBlock ul li {
  float: none;
  width: 100%;
  height: 125px;
  overflow: hidden;
}

.roomTopBlock .titleBlock {
  text-align: left;
  padding: 40px 40px 50px;
  _zoom: 1;
  overflow: hidden;
}

.roomTopBlock .titleBlock .title {
  font-size: 2.1rem;
  font-weight: 500;
  margin: 0 0 30px;
  color: #222;
}

.roomTopBlock .titleBlock .imgBlock {
  float: right;
  width: 420px;
  padding: 0 0 0 40px;
}

.pickupBlock {
  width: 1100px;
  margin: 0 -70px 35px;
  position: relative;
}

.pickupBlock .mainList {
  _zoom: 1;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  width: 990px;
  padding: 0 55px;
}

.pickupBlock .mainList li {
  float: left;
  width: 300px;
  height: 365px;
  margin: 0 15px;
  background: #FFF;
  position: relative;
}

.pickupBlock .mainList li a {
  display: block;
}

.pickupBlock .mainList li .title {
  padding: 18px 20px 0;
  overflow: hidden;
  font-size: 1.4rem;
  line-height: 22px;
  height: 66px;
  text-indent: 15px;
  text-align: left;
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat 20px 26px;*/
  background-size: 6px 6px;
}

.pickupBlock .mainList li .title::after {
  content: "MORE";
  color: #888;
  border: 1px solid #ddd;
  padding: 0 8px;
  line-height: 16px;
  margin: 0 0 0 5px;
  font-size: 1.1rem;
  font-weight: 500;
}

.pickupBlock .mainList li.noMore .title::after {
  content: none;
}

.pickupBlock .mainList li .info {
  color: #999;
  font-size: 1.2rem;
  height: 36px;
  overflow: hidden;
  line-height: 18px;
  border-top: 1px solid #ddd;
  padding: 13px 0 0;
  margin: 10px 20px 0;
  text-align: left;
}

.pickupBlock .mainList li a .info {
  border-top: 1px solid #ddd;
}

.pickupBlock .slick-dots {
  clear: both;
  padding: 25px 0 0;
}

.pickupBlock .slick-dots li {
  float: none;
  width: 5px;
  height: 5px;
  margin: 0 6px;
  background: none;
  border: 1px solid #aea799;
  transform: rotate(45deg);
  display: inline-block;
  text-indent: -999px;
  overflow: hidden;
  cursor: pointer;
}

.pickupBlock .slick-dots li.slick-active {
  background: #aea799;
}

.pickupBlock .slick-prev,
.pickupBlock .slick-next {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 145px;
  text-indent: -999px;
  overflow: hidden;
}

.pickupBlock .slick-prev {
  background: url(../img/common/vector_pickup_left.svg) no-repeat center center;
  background-size: 30px 30px;
  left: 0px;
}

.pickupBlock .slick-next {
  background: url(../img/common/vector_pickup_right.svg) no-repeat center center;
  background-size: 30px 30px;
  right: 0px;
}

.sideMoreLink {
  width: 140px;
  position: absolute;
  right: 10px;
  top: 10px;
}

.sideMoreLink a {
  width: 100%;
  line-height: 30px;
  background: #FFF;
  border-radius: 15px;
  font-size: 1.3rem;
  display: block;
}

.topicsBlock .sideMoreLink,
.informationBlock .sideMoreLink {
  right: -60px;
}

.topicsBlock {
  width: 100%;
  margin: 0 auto 30px;
  position: relative;
}

.topicsBlock .topicsList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
}

.topicsBlock .topicsList li {
  width: 470px;
  background: #FFF;
  margin: 0 0 20px;
  text-align: left;
}

.topicsBlock .topicsList li a {
  display: flex;
  align-items: stretch;
  width: 100%;
  min-height: 120px;
  height: 100%;
  position: relative;
}

.topicsBlock .topicsList li .img {
  flex-basis: 120px;
}

.topicsBlock .topicsList li div {
  padding: 15px 20px;
  flex-basis: 310px;
  display: flex;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
}

.topicsBlock .topicsList li div p {
  font-size: 1.4rem;
  flex-basis: 100%;
}

.topicsBlock .topicsList li div .date {
  color: #638fa2;
  font-weight: 500;
  margin: 0 0 5px;
}

.topicsBlock .topicsList li div .date span {
  padding: 0 10px 0 0;
  margin: 0 10px 0 0;
  position: relative;
}

.topicsBlock .topicsList li div .date span::after {
  border-right: 1px solid #638fa2;
  content: "";
  position: absolute;
  height: 10px;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

.informationBlock {
  width: 100%;
  margin: 0 auto 50px;
  position: relative;
}

.informationBlock .informationList li {
  display: block;
  margin: 0 0 1px;
}

.informationBlock .informationList li a {
  display: block;
  padding: 25px 40px;
  background: #FFF;
  text-align: left;
}

.informationBlock .informationList li a .date {
  color: #638fa2;
  font-weight: 500;
  margin: 0 0 5px;
}

.informationBlock .informationList li a .date span {
  padding: 0 10px 0 0;
  margin: 0 10px 0 0;
  position: relative;
}

.informationBlock .informationList li a .date span::after {
  border-right: 1px solid #638fa2;
  content: "";
  position: absolute;
  height: 10px;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

.withImageBox {
  margin: 0 auto 50px;
  background: #FFF;
  _zoom: 1;
  overflow: hidden;
  text-align: left;
}

.withImageBox .inner {
  padding: 40px 40px 50px;
}

.withImageBox .inner h3 {
  margin: 0 0 30px;
}

.withImageBox.center .img {
  font-size: 0;
  letter-spacing: 0;
}

.withImageBox.center .img img {
  display: inline-block;
  width: 50%;
}

.withImageBox.left .img {
  width: 350px;
  float: left;
  margin-right: 40px;
}

.withImageBox.right .img {
  width: 350px;
  float: right;
  margin-left: 40px;
}

/* FOOTER */
.mainFooter .bnBlock {
  padding: 25px 0;
  background: #f4f2f0;
}

.mainFooter .bnBlock ul {
  width: 1040px;
  position: relative;
  margin: 0 auto;
}

.mainFooter .bnBlock ul li {
  float: left;
  width: 240px;
  padding: 0 10px;
}

.mainFooter .bnBlock .slick-prev,
.mainFooter .bnBlock .slick-next {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 20px;
  text-indent: -999px;
  overflow: hidden;
}

.mainFooter .bnBlock .slick-prev {
  background: url(../img/common/vector_pickup_left.svg) no-repeat center center;
  background-size: 30px 30px;
  left: -55px;
}

.mainFooter .bnBlock .slick-next {
  background: url(../img/common/vector_pickup_right.svg) no-repeat center center;
  background-size: 30px 30px;
  right: -55px;
}

.mainFooter .bookingBlock {
  background: #515457;
  position: relative;
  margin: 0;
  min-height: auto;
}

.mainFooter .bookingBlock .footerLogo {
  width: 200px;
  height: 105px;
  position: absolute;
  left: 35px;
  top: 30px;
}

.mainFooter .bookingBlock .right {
  padding: 55px 0 70px 320px;
  margin: 0 auto;
  width: 720px;
  text-align: left;
}

.mainFooter .bookingBlock .right .title {
  font-size: 1.4rem;
  color: #FFF;
  padding: 0 0 10px;
}

.mainFooter .bookingBlock .right ul {
  display: table;
  width: 100%;
  table-layout: fixed;
}

.mainFooter .bookingBlock .right ul li {
  display: table-cell;
  padding: 0 10px 0 0;
}

.mainFooter .bookingBlock .right ul li button {
  color: #FFF;
  background: #6c6e70;
  width: 100%;
  display: block;
  font-size: 1.45rem;
  line-height: 40px;
}

.mainFooter .sitemapBlock {
  padding: 80px 30px 0;
  background: #24272a;
  text-align: left;
}

.mainFooter .sitemapBlock a {
  color: #DDD;
}

.mainFooter .sitemapBlock a:hover {
  text-decoration: underline;
}

.mainFooter .sitemapBlock .inner {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 0 0 45px 30px;
}

.mainFooter .sitemapBlock .inner ul {
  margin: 0 0 30px;
}

.mainFooter .sitemapBlock .inner ul li {
  font-size: 1.4rem;
  padding: 0 0 3px;
}

.mainFooter .sitemapBlock .inner ul li.title {
  font-size: 1.6rem;
  font-weight: 500;
  padding: 0 0 15px;
}

.mainFooter .sitemapBlock .inner ul li.title.zero {
  padding: 0;
}

.mainFooter .sitemapBlock .inner ul li.title a {
  color: #FFF;
}

.mainFooter .sitemapBlock .inner ul li.single {
  font-weight: 500;
}

.mainFooter .sitemapBlock .inner ul li.sub {
  padding: 0 0 3px 20px;
  position: relative;
}

.mainFooter .sitemapBlock .inner ul li.sub::before {
  content: "";
  position: absolute;
  width: 10px;
  border-top: 1px solid #CCC;
  left: 0;
  top: 10px;
}

.mainFooter .sitemapBlock .section1,
.mainFooter .sitemapBlock .section2,
.mainFooter .sitemapBlock .section3,
.mainFooter .sitemapBlock .section4 {
  min-width: 240px;
  max-width: 300px;
  width: 20%;
}

.mainFooter .snsBlock {
  padding: 21px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.mainFooter .snsBlock ul {
  text-align: right;
}

.mainFooter .snsBlock ul li {
  display: inline-block;
  padding: 0 0 0 20px;
}

.mainFooter .infoBlock {
  background: #638fa2;
  padding: 50px 0 50px 8%;
  text-align: left;
  _zoom: 1;
  overflow: hidden;
  position: relative;
}

.mainFooter .infoBlock p {
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.4rem;
}

.mainFooter .infoBlock .title {
  padding: 0 0 15px;
  font-size: 1.8rem;
  font-weight: 500;
}

.mainFooter .infoBlock .tel {
  font-size: 1.5rem;
  font-weight: 500;
}

.mainFooter .infoBlock .tel span {
  font-size: 2.4rem;
}

.mainFooter .infoBlock .tel span a {
  color: inherit;
}

.mainFooter .infoBlock .btnTop {
  width: 120px;
  position: absolute;
  right: 40px;
  bottom: 45px;
  text-align: center;
  font-size: 1.1rem;
}

.mainFooter .infoBlock .btnTop a {
  position: relative;
  padding: 60px 0 0;
  color: #FFF;
  transition: opacity 0.3s ease;
}

.mainFooter .infoBlock .btnTop a::after {
  content: "";
  height: 50px;
  width: 1px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  margin: 0 auto;
  border-left: 1px solid rgba(255, 255, 255, 0.8);
  transition: height 0.4s ease;
}

.mainFooter .infoBlock .btnTop a:hover {
  opacity: 0.7;
}

.mainFooter .infoBlock .btnTop a:hover::after {
  height: 20px;
}

.mainFooter .infoBlock .left {
  float: left;
  width: 430px;
}

.mainFooter .infoBlock .right {
  float: left;
  width: 250px;
  padding: 10px 0 0 0;
}

.mainFooter .bottomBar {
  padding: 20px 30px;
  _zoom: 1;
  overflow: hidden;
}

.mainFooter .bottomBar ul {
  float: left;
  font-size: 1.3rem;
}

.mainFooter .bottomBar ul li {
  display: inline-block;
  padding: 0 10px 0 0;
  margin: 2px 10px 2px 0;
  border-right: 1px solid #CCC;
  line-height: 1;
}

.mainFooter .bottomBar ul li:last-child {
  border: none;
  padding-right: 0;
  margin-right: 0;
}

.mainFooter .bottomBar ul li a {
  color: #CCC;
  text-decoration: underline;
}

.mainFooter .bottomBar ul li a:hover {
  color: #AAA;
}

.mainFooter .bottomBar ul li a[href$=".pdf"] {
  background: none;
  padding-left: 0;
}

.mainFooter .bottomBar .copyright {
  float: right;
  text-align: right;
  color: #777;
  font-size: 1.1rem;
}

/* MODAL */
.modal {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 2000;
  background: #f4f2f0;
  background: rgba(244, 242, 240, 0.95);
  overflow: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  display: none;
}

.modal .base {
  position: relative;
  width: 930px;
  margin: 80px auto;
  transition: transform 0.5s ease;
  transform: translateY(20px);
}

.modal .base.on {
  transform: translateY(0px);
}

.modal .base .modalTabList {
  width: 640px;
  height: 40px;
  display: table;
  table-layout: fixed;
  position: relative;
  z-index: 10;
}

.modal .base .modalTabList li {
  display: table-cell;
  height: 40px;
  vertical-align: middle;
  background: #7d7f81;
  color: #FFF;
  cursor: pointer;
  font-size: 1.4rem;
  border-right: 1px solid #515457;
  transition: opacity 0.2s ease;
}

.modal .base .modalTabList li:first-child {
  border-radius: 3px 0 0 0;
}

.modal .base .modalTabList li:last-child {
  border: none;
  border-radius: 0 3px 0 0;
}

.modal .base .modalTabList li:hover {
  opacity: 0.8;
}

.modal .base .modalTabList li.active {
  background: #FFF;
  color: #444;
}

.modal .base .modalTabList li:hover.active {
  opacity: 1;
}

.modal .modalMainBlock {
  width: 900px;
  padding: 40px 0 35px;
  background: #FFF;
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
  position: relative;
}

.modal .modalMainBlock .closeModalBtn {
  width: 55px;
  height: 55px;
  position: absolute;
  right: -15px;
  top: -30px;
  background: none;
}

.modal .modalMainBlock .seg {
  padding: 0 45px 0;
  text-align: left;
  display: none;
}

.modal .modalMainBlock .seg.on {
  display: block;
}

.modal .modalMainBlock .seg .title {
  font-weight: 500;
  font-size: 2.2rem;
  color: #222;
  margin: 0 0 25px;
}

.modal .modalMainBlock .seg .title span {
  color: #638fa2;
  font-size: 1.5rem;
  padding: 0 0 0 10px;
}

.modal .modalMainBlock .seg .calenderBlock {
  border: 1px solid #e6e6e6;
  height: 300px;
  margin: 0 0 25px;
  position: relative;
}

.modal .inputBlock form {
  display: block;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  /* justify-content: space-between; */
  /* width: 420px; */
  padding: 0;
  position: relative;
}

.modal .inputBlock form > *{
  margin-right: 12px;
}
.modal .inputBlock form > *:last-child{
   margin-right: 0;
}

.modal .inputBlock form .inputBlock__title{
  text-align: left;
  color: #666;
  font-size: 11px;
  margin-bottom: 4px;
}

.modal .inputBlock form input,
.modal .inputBlock form button,
.modal .inputBlock form select,
.modal .inputBlock form span {
  font-size: 1.4rem;
  height: 40px;
  line-height: 40px;
  color: #444;
  display: block;
  background: #EEE;
  border-radius: 0;
  border: none;
  /* margin: 0 0 20px; */
}

.modal .inputBlock input:placeholder-shown {
  color: #444;
}

.modal .inputBlock input::-webkit-input-placeholder {
  color: #444;
}

.modal .inputBlock input:-moz-placeholder {
  color: #444;
}

.modal .inputBlock input:-ms-input-placeholder {
  color: #444;
}

.modal .inputBlock form input {
  width: 150px;
  padding: 0 10px;
}

.modal .inputBlock form select {
  width: 70px;
  padding: 0 10px;
  background: #EEE url(../img/common/mark_select_gray.svg) no-repeat right 8px top 17px;
  background-size: 7px 6px;
}

.modal .inputBlock form input[type="submit"] {
  width: 200px;
  display: block;
  /* margin: 0 0 10px; */
  line-height: 40px;
  font-size: 1.45rem;
  background: #638fa2;
  color: #FFF;
  text-align: center;
}

.modal .inputBlock form span {
  font-size: 1.3rem;
  background: none;
  position: relative;
}

.modal .inputBlock form img.calender {
  display: block;
  position: absolute;
  width: 25px;
  height: 26px;
  left: 135px;
  top: 7px;
  cursor: pointer;
}

.modal .inputBlock .bottomList {
  text-align: left;
  color: #888;
  margin: 0 0 30px;
}

.modal .inputBlock .bottomList li {
  display: inline-block;
  padding: 0 15px 0 0;
  font-size: 1.1rem;
}

.modal .inputBlock .bottomList li a {
  color: #888;
  padding: 0 0 0 12px;
  text-decoration: underline;
  background: url(../img/common/vector_sub_gray.svg) no-repeat left center;
  background-size: 6px 7px;
}

.modal .inputBlock .bottomList li a:hover {
  color: #AAA;
}

.modal .restaurantBlock {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0 0 35px;
}

.modal .restaurantBlock .inner {
  display: table-cell;
  border-right: 1px solid #e6e6e6;
  padding: 5px 0 0 25px;
}

.modal .restaurantBlock .inner .title {
  font-size: 1.5rem;
  color: #444;
  padding-left: 5px;
  margin: 0 0 10px;
}

.modal .restaurantBlock .inner .btnList {
  text-align: left;
  margin: 0 0 15px;
}

.modal .restaurantBlock .inner .block:last-child .btnList {
  margin: 0 0 5px;
}

.modal .restaurantBlock .inner .btnList li {
  display: inline-block;
  margin: 0 8px 0 0;
}

.modal .restaurantBlock .inner .btnList li a {
  font-size: 1.2rem;
  color: #FFF;
  line-height: 22px;
  border-radius: 11px;
  background: #a8aaab;
  display: block;
  width: 100px;
  text-align: center;
}

.modal .restaurantBlock .inner .btnList li.booking a {
  background: #638fa2;
}

.modal .restaurantBlock .left {
  padding-left: 0;
}

.modal .restaurantBlock .right {
  border: none;
}

.modal .telBlock {
  margin: 0 0 40px;
}

.modal .telBlock .tel {
  float: left;
  color: #638fa2;
  font-size: 4.0rem;
  line-height: 45px;
  font-weight: 500;
  margin: -10px 20px 0;
  padding: 25px 0 25px 65px;
  background: url(../img/common/mark_tel_blue.svg) no-repeat left center;
  background-size: 45px 45px;
}

.modal .telBlock .tel a {
  color: inherit;
}

.modal .telBlock .tel .sub {
  font-size: 1.5rem;
  line-height: 1;
}

.modal .telBlock .mailBtn a {
  color: #638fa2;
  font-size: 1.3rem;
  text-decoration: underline;
  padding: 27px 0 0 10px;
  background: url(../img/common/vector_sub_blue.svg) no-repeat left 35px;
  background-size: 6px 7px;
  display: block;
  width: 80px;
}

.modal .telBlock .chatBtn {
  clear: both;
}

.modal .telBlock .chatBtn a {
  width: 250px;
}

.modal .telBlock .time {
  margin: -10px 0 20px;
}

.modal .modalMainBlock .seg .bottom {
  border-top: 1px solid #e6e6e6;
  _zoom: 1;
  overflow: hidden;
  padding: 30px 0 0;
}

.modal .modalMainBlock .seg .bottom p {
  font-size: 1.4rem;
}

.modal .modalMainBlock .seg .bottom .left {
  float: left;
  width: 385px;
}

.modal .modalMainBlock .seg .bottom .right {
  float: left;
  position: relative;
  margin-bottom: 10px;
}

.modal .modalMainBlock .seg .bottom .right span {
  display: block;
}

.modal .modalMainBlock .seg .bottom .right span.title {
  font-size: 1.3rem;
  margin-bottom: 0;
}

.modal .modalMainBlock .seg .bottom .right span.tel {
  color: #638fa2;
  font-weight: 500;
  font-size: 2.4rem;
}

.modal .modalMainBlock .seg .bottom .right span.tel font {
  font-size: 1.5rem;
}

.modal .modalMainBlock .seg .bottom .right a:last-child {
  color: #638fa2;
  font-size: 1.3rem;
  text-decoration: underline;
  padding: 0 0 0 10px;
  background: url(../img/common/vector_sub_blue.svg) no-repeat left center;
  background-size: 6px 7px;
  display: block;
  position: absolute;
  left: 220px;
  bottom: 5px;
  width: 170px;
}

.modal .modalMainBlock .seg .bottom .right a:last-child:hover {
  color: #D00;
}

.modal .modalMainBlock .seg .bottom .right span.tel a {
  background: none;
  text-decoration: none;
  padding: 0;
  color: #638fa2;
  font-weight: 500;
  font-size: 2.4rem;
  display: inline;
  position: inherit;
}

.modal .modalMainBlock .seg .bottom .chatBtn {
  clear: both;
  margin: 20px 0 0;
  text-align: right;
}

.modal .modalMainBlock .seg .bottom .chatBtn a {
  display: inline-block;
  width: 250px;
}

/* FOR SMALL PC OR TABLET DEVICE */
@media screen and (max-width: 1255px) {
  /* FOOTER */
  .mainFooter .bnBlock ul {
    width: 780px;
    position: relative;
    margin: 0 auto;
  }
  .mainFooter .bottomBar ul {
    float: none;
    margin-bottom: 15px;
    padding: 0 5%;
  }
  .mainFooter .bottomBar .copyright {
    float: none;
    text-align: center;
  }
}

@media screen and (max-width: 1180px) {
  /* HEADER */
  .mainHeader .siteTitle {
    padding-left: 25px;
  }
  .mainHeader .mainMenu {
    width: calc(100% - 290px);
  }
  .mainHeader .subMenu {
    width: calc(100% - 560px);
  }
  .mainHeader .btnList {
    width: 240px;
  }
  .mainHeader .btnList li.b3 {
    width: 120px;
  }
  .mainHeader .description {
    width: calc(100% - 560px);
  }
  /* SECTION */
  .pickupBlock {
    width: 990px;
    margin-left: -15px;
    margin-right: -15px;
  }
  .pickupBlock .mainList {
    padding: 0;
  }
  .pickupBlock .slick-prev,
  .pickupBlock .slick-next {
    top: auto;
    bottom: 0;
  }
  .pickupBlock .slick-prev {
    left: 15px;
  }
  .pickupBlock .slick-next {
    right: 15px;
  }
  .sideMoreLink {
    right: 15px;
  }
  .topicsBlock .sideMoreLink,
  .informationBlock .sideMoreLink {
    right: 0px;
  }
}

@media screen and (max-width: 1100px) {
  /* HEADER */
  .mainHeader .description {
    display: none;
  }
}

/* ::::::::::::::::::::::::::::::::: PC ::::::::::::::::::::::::::::::::: */
@media screen and (min-width: 990px) {
  .sp {
    display: none !important;
  }
}

/* ::::::::::::::::::::::::::::::::: SP ::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 989px) {
  .pc {
    display: none !important;
  }
  /* ::::::::::::::::::::::::::::::::: COMMON ::::::::::::::::::::::::::::::::: */
  .wrap {
    min-width: 100%;
    padding-top: 60px;
  }
  /*COMMON*/
  h1 {
    font-size: 2.8rem;
    line-height: 1.3;
    margin: 0 0 30px;
  }
  h1 span.ja {
    font-size: 1.6rem;
    padding: 4px 0 0;
  }
  h3 {
    font-size: 1.8rem;
    margin: 0 0 30px;
  }
  h3.en {
    font-size: 2.2rem;
    font-weight: 900;
  }
  h3.withBar {
    font-size: 1.7rem;
    padding: 8px 5%;
    margin-bottom: 15px;
  }
  h3.withTab {
    margin: 0 0 30px;
  }
  h4 {
    font-size: 1.6rem;
    margin: 0 0 25px;
  }
  .breadcrumbs {
    padding: 7px 4% 12px;
    font-size: 1.05rem;
  }
  .pageNaviList {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
  }
  .pageNaviList li {
    font-size: 1.3rem;
    width: 50%;
    border-right: 1px solid #46494c;
    border-bottom: 1px solid #46494c;
    box-sizing: border-box;
    padding: 0;
  }
  .pageNaviList li:nth-child(even) {
    border-right: none;
  }
  .pageNaviList li a {
    display: block;
    padding: 10px 0;
  }
  .section .pageNaviList li a {
    padding: 0;
  }
  .pageNaviList.oddList li:first-child {
    border-right: none;
    width: 100%;
  }
  .pageNaviList.oddList li:nth-child(even) {
    border-right: none;
  }
  .pageNaviList.oddList li:nth-child(odd) {
    border-left: 1px solid #46494c;
  }
  .subColorLinkBlock {
    text-align: center;
  }
  .subColorLinkBlock .title {
    padding: 50px 5% 20px;
    font-size: 2.2rem;
  }
  .subColorLinkBlock .sub {
    padding: 0 5% 45px;
  }
  .subColorLinkBlock .more {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding: 30px 0;
    right: auto;
    top: auto;
    border: none;
    border-bottom: 20px solid #466e48;
    font-size: 1.5rem;
  }
  .subColorLinkBlock a:hover .more {
    width: 100%;
  }
  .subColorLinkBlock.green .more {
    border-color: #466e48;
  }
  .subColorLinkBlock.yellow .more {
    border-color: #ab7d33;
  }
  .subColorLinkBlock.red .more {
    border-color: #851d37;
  }
  .subColorLinkBlock.purple .more {
    border-color: #65577b;
  }
  .subColorLinkBlock.blue .more {
    border-color: #293e5c;
  }
  .subColorLinkBlock.brown .more {
    border-color: #665852;
  }
  .contactLinkBlock {
    padding: 0;
    position: relative;
    border: none;
    border-bottom: 20px solid #466e48;
  }
  .contactLinkBlock .title {
    font-size: 2.2rem;
    padding: 40px 5% 25px;
  }
  .contactLinkBlock .inner {
    width: 80%;
    max-width: 500px;
    margin: 0 auto 30px;
    padding: 30px 5% 20px;
    border-radius: 3px;
  }
  .contactLinkBlock .inner .tel .num {
    padding: 0 0 0 45px;
    background: url(../img/common/mark_tel_white.svg) no-repeat 0px 5px;
    background-size: 30px 30px;
    line-height: 40px;
    font-size: 2.8rem;
    pointer-events: all;
  }
  .contactLinkBlock .inner .tel span.sub {
    font-size: 1.5rem;
    padding: 0;
    display: block;
  }
  .contactLinkBlock .inner .linkList li {
    display: block;
    padding: 0 0 10px;
  }
  .contactLinkBlock.green {
    border: none;
    border-bottom: 20px solid #466e48;
  }
  .contactLinkBlock.yellow {
    border: none;
    border-bottom: 20px solid #ab7d33;
  }
  .contactLinkBlock.red {
    border: none;
    border-bottom: 20px solid #851d37;
  }
  .contactLinkBlock.purple {
    border: none;
    border-bottom: 20px solid #65577b;
  }
  .contactLinkBlock.blue {
    border: none;
    border-bottom: 20px solid #293e5c;
  }
  .contactLinkBlock.brown {
    border: none;
    border-bottom: 20px solid #665852;
  }
  .hoverAlpha:hover {
    opacity: 1;
  }
  /* HEADER */
  .mainHeader {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    height: 60px;
  }
  .mainHeader.scroll .siteTitle,
  .mainHeader .siteTitle {
    width: 140px;
    height: 60px;
    float: left;
    padding: 0 0 0 4px;
    margin: auto;
  }
  .mainHeader.scroll .btnList,
  .mainHeader .btnList {
    width: 38%;
    height: 60px;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
  }
  .mainHeader .btnList li.b3 {
    width: 50%;
  }
  .mainHeader .btnList li.b3 button {
    font-size: 1.3rem;
    font-weight: 500;
  }
  /* MAIN VISUAL */
  .mainVisualWrap h1 {
    height: 95%;
    top: 5%;
    width: 96%;
    left: 2%;
  }
  .mainVisualWrap + .breadcrumbs {
    top: 60px;
  }
  /* SECTION */
  .section {
    padding: 40px 0 40px;
    position: relative;
  }
  .section.bgDark {
    padding: 30px 0 10px;
  }
  .section .inner960 {
    width: 90%;
    margin: 0 auto;
  }
  .section h1 {
    font-size: 2.6rem;
  }
  .section h2.lead {
    font-size: 2.0rem;
    margin: 0 0 30px;
  }
  .section .lead {
    margin: 0 0 35px;
  }
  .section .table01 {
    border-top: 1px solid #DDD;
  }
  .section .table01 th,
  .section .table01 td {
    display: block;
    width: auto;
    border-top: none;
    padding: 10px 15px;
  }
  .section .btnM {
    max-width: 100%;
  }
  .section .btnL {
    max-width: 100%;
  }
  .section .btnSS a,
  .section .btnS a,
  .section .btnM a,
  .section .btnL a {
    box-sizing: border-box;
    min-height: 40px;
    padding: 8px 0;
    line-height: 1.6;
  }
  .section .btnL a {
    min-height: 60px;
    padding: 13px 0;
    line-height: 1.8;
  }
  .section.bgDark .pageNaviList {
    display: block;
    padding: 0 5%;
  }
  .section.bgDark .pageNaviList li {
    padding: 0 0 20px;
    width: 100%;
    border: none;
  }
  .section.bgDark .pageNaviList li .title {
    font-size: 1.7rem;
    padding: 25px 5% 15px;
    text-indent: 15px;
  }
  .section.bgDark .pageNaviList li .title::after {
    opacity: 0.7;
    left: 5%;
    top: 35px;
  }
  .section.bgDark .pageNaviList li .caption {
    padding: 0 5% 25px;
  }
  .section.bgDark .pageNaviList.small li .title {
    font-size: 1.5rem;
    padding: 20px 5%;
  }
  .section.bgDark .pageNaviList.small li .title::after {
    top: 30px;
  }
  .section .boxList {
    display: block;
    width: 100%;
    margin: 0 0 10px;
  }
  .section .boxList li {
    margin: 0 0 30px;
  }
  .section .boxList li .title {
    font-size: 1.7rem;
    padding: 20px 5% 15px;
  }
  .section .boxList li .caption {
    padding: 0 5% 30px;
  }
  .section .boxList li a .title::after {
    left: 5%;
  }
  .section .boxList.small li .title {
    padding: 20px 5% 15px;
  }
  .section .anchorList {
    padding: 15px 5%;
    margin: 0 0 40px;
  }
  .section .anchorList li {
    margin: 0 0 5px;
  }
  .section .anchorList li:not(:last-child) {
    margin-right: 10px;
  }
  .section .anchorList.wide li {
    display: block;
  }
  .section .tabListL {
    width: 102%;
    margin: 0 -1% 40px;
  }
  .section .tabListL li {
    margin: 0 2%;
    padding: 0;
  }
  .section .tabListL li a,
  .section .tabListL li span {
    line-height: 1.5;
    font-size: 1.4rem;
    padding: 5px 10px;
    height: 100%;
  }
  .section .tabListL li:first-child {
    margin-left: 0;
  }
  .section .tabListL li:last-child {
    margin-right: 0;
  }
  .section .tabListS {
    margin: 0 0 35px;
    padding-top: 5px;
  }
  .planTopBlock {
    width: 100%;
    margin: 0 auto 40px;
  }
  .planTopBlock .sldBlock {
    float: none;
    width: 100%;
  }
  .planTopBlock .titleBlock {
    width: 90%;
    float: none;
    padding: 30px 5% 35px;
    text-align: left;
  }
  .planTopBlock .titleBlock h1 {
    font-size: 2rem;
    line-height: 1.5;
    margin: 0 0 10px;
    width: 100%;
    display: block;
  }
  .priceBlock {
    padding: 15px 5%;
  }
  .planMainBlock {
    width: auto;
    padding: 30px 5% 20px;
    margin: 0 auto 40px;
  }
  .borderBlock {
    padding: 30px 5% 20px;
    margin: 0 auto 40px;
  }
  .freeArea img {
    max-width: 100%;
    overflow: hidden;
  }
  .freeArea p,
  .freeArea ul.iconList,
  .freeArea ol,
  .freeArea table,
  .freeArea blockquote,
  .bgGray
.freeArea hr {
    margin: 0 0 30px;
  }
  .freeArea hr {
    margin: 30px 0;
  }
  .freeArea .imgBlock.left .img {
    max-width: 45%;
    padding-right: 5%;
  }
  .freeArea .imgBlock.right .img {
    max-width: 45%;
    padding-left: 5%;
  }
  .freeArea .imgList {
    display: block;
    margin: 0 auto 10px;
  }
  .freeArea .imgList li {
    width: 100%;
  }
  .freeArea .imgList li + li {
    margin-left: 0;
  }
  .freeArea .imgList li .caption {
    margin: 0 0 20px;
  }
  blockquote, .bgGray {
    padding: 15px 5%;
  }
  .roomTopBlock {
    margin: 0 auto 40px;
  }
  .roomTopBlock .sldBlock .img {
    width: 100%;
    height: auto;
    float: none;
  }
  .roomTopBlock .sldBlock ul {
    width: 100%;
    float: none;
  }
  .roomTopBlock .sldBlock ul li {
    width: 25%;
    height: auto;
    float: left;
  }
  .roomTopBlock .titleBlock {
    padding: 35px 5% 45px;
    _zoom: 1;
  }
  .roomTopBlock .titleBlock .title {
    font-size: 2.1rem;
    font-weight: 500;
    margin: 0 0 25px;
  }
  .roomTopBlock .titleBlock .imgBlock {
    float: none;
    width: 100%;
    padding: 35px 0 0 0;
  }
  .pickupBlock {
    width: 100%;
    margin: 0 auto 25px;
  }
  .pickupBlock .mainList {
    width: 100%;
    padding: 0;
  }
  .pickupBlock .mainList li {
    width: 100%;
    height: auto;
    margin: 0;
  }
  .pickupBlock .mainList li img {
    width: 100%;
    height: auto;
  }
  .pickupBlock .mainList li .title {
    padding: 18px 0 0;
    margin: 0 5% 13px;
    overflow: hidden;
    background-position: 0px 26px;
  }
  .pickupBlock .mainList li .info {
    position: relative;
    width: 90%;
    left: auto;
    bottom: auto;
    margin: 0 auto 17px;
  }
  .pickupBlock .slick-dots {
    padding: 25px 70px 5px;
  }
  .pickupBlock .slick-dots li {
    float: none;
    width: 5px;
    height: 5px;
    margin: 0 6px;
    background: none;
    border: 1px solid #aea799;
    transform: rotate(45deg);
    display: inline-block;
    text-indent: -999px;
    overflow: hidden;
    cursor: pointer;
  }
  .pickupBlock .slick-dots li.slick-active {
    background: #aea799;
  }
  .sideMoreLink {
    position: relative;
    right: auto;
    top: auto;
    margin: -5px auto 30px;
  }
  .topicsBlock .sideMoreLink,
  .informationBlock .sideMoreLink {
    right: auto;
  }
  .topicsBlock {
    width: 100%;
    margin: 0 auto 40px;
  }
  .topicsBlock .topicsList {
    display: block;
  }
  .topicsBlock .topicsList li {
    width: 100%;
    margin: 0 0 1px;
  }
  .topicsBlock .topicsList li a {
    display: block;
    min-height: 100px;
  }
  .topicsBlock .topicsList li .img {
    flex-basis: 100px;
  }
  .topicsBlock .topicsList li div {
    padding: 15px 5%;
    flex-basis: 250px;
  }
  .topicsBlock .topicsList li div .date {
    font-size: 1.2rem;
    margin: 0 0 1px;
  }
  .informationBlock {
    width: 100%;
    margin: 0 auto 40px;
  }
  .informationBlock .informationList li {
    display: block;
    margin: 0 0 1px;
  }
  .informationBlock .informationList li a {
    padding: 15px 5%;
  }
  .withImageBox {
    margin: 0 auto 40px;
  }
  .withImageBox .inner {
    padding: 30px 5% 40px;
  }
  .withImageBox .inner h3 {
    margin: 0 0 20px;
  }
  .withImageBox.center .img img {
    display: block;
    width: 100%;
  }
  .withImageBox.left .img {
    width: 100%;
    float: none;
    margin-right: 0;
  }
  .withImageBox.right .img {
    width: 100%;
    float: none;
    margin-left: 0;
  }
  /* FOOTER */
  .mainFooter .bnBlock ul {
    width: 100%;
    max-width: 480px;
    padding: 0 5%;
    /*display: flex; flex-direction: column; flex-wrap: wrap;*/
  }
  .mainFooter .bnBlock ul li {
    padding: 0;
    margin: 0 auto;
    width: 50%;
  }
  .mainFooter .bnBlock ul li img {
    width: 95%;
    margin: 0 auto;
    height: auto;
  }
  .mainFooter .bnBlock .slick-prev,
  .mainFooter .bnBlock .slick-next {
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
  }
  .mainFooter .bnBlock .slick-prev {
    left: -5px;
    transform: scale(0.9);
  }
  .mainFooter .bnBlock .slick-next {
    right: -5px;
    transform: scale(0.9);
  }
  .mainFooter .bookingBlock {
    padding: 0 0 30px;
  }
  .mainFooter .bookingBlock .footerLogo {
    position: relative;
    left: auto;
    top: auto;
    padding: 25px 0 30px 5%;
  }
  .mainFooter .bookingBlock .right {
    padding: 0;
    max-width: 600px;
    width: 80%;
  }
  .mainFooter .bookingBlock .right ul {
    display: block;
  }
  .mainFooter .bookingBlock .right ul li {
    display: block;
    padding: 0 0 10px 0;
  }
  .mainFooter .sitemapBlock {
    padding: 40px 5% 0;
  }
  .mainFooter .sitemapBlock .inner {
    display: block;
    padding: 0 0 25px 0;
  }
  .mainFooter .sitemapBlock .inner ul {
    margin: 0 0 10px;
    padding: 10px 5% 15px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }
  .mainFooter .sitemapBlock .inner ul li.title {
    padding: 0 0 5px;
  }
  .mainFooter .sitemapBlock .inner ul li.title.zero {
    padding: 0 0 5px;
  }
  .mainFooter .sitemapBlock .section1,
  .mainFooter .sitemapBlock .section2,
  .mainFooter .sitemapBlock .section3,
  .mainFooter .sitemapBlock .section4 {
    min-width: auto;
    max-width: 1000px;
    width: 100%;
  }
  .mainFooter .sitemapBlock .section1 ul:first-child {
    padding-bottom: 25px;
  }
  .mainFooter .sitemapBlock .section3 ul:last-child {
    border: none;
    margin: 0;
    padding-top: 20px;
  }
  .mainFooter .sitemapBlock .section4 ul {
    border: none;
    margin: 0;
  }
  .mainFooter .snsBlock ul {
    text-align: center;
    margin: 0 -6px;
  }
  .mainFooter .snsBlock ul li {
    padding: 0 6px;
  }
  .mainFooter .infoBlock {
    display: block;
    padding: 40px 0 30px;
    text-align: center;
  }
  .mainFooter .infoBlock .title {
    padding: 0 0 15px;
    font-size: 1.7rem;
  }
  .mainFooter .infoBlock .tel {
    padding: 0 0 20px;
  }
  .mainFooter .infoBlock .btnTop {
    position: relative;
    right: auto;
    bottom: auto;
    margin: 0 auto;
    padding: 60px 0 0;
  }
  .mainFooter .infoBlock .btnTop a:hover {
    opacity: 1;
  }
  .mainFooter .infoBlock .btnTop a:hover::after {
    height: 50px;
  }
  .mainFooter .infoBlock .left {
    float: none;
    width: 90%;
    padding: 0 5%;
  }
  .mainFooter .infoBlock .right {
    float: none;
    width: 90%;
    padding: 10px 5% 0;
  }
  .mainFooter .bottomBar {
    padding: 20px 5%;
  }
  .mainFooter .bottomBar ul {
    float: none;
  }
  .mainFooter .bottomBar .copyright {
    float: none;
    text-align: center;
  }
  /* MODAL */
  .modal .base {
    width: 90%;
    margin: 50px auto;
  }
  .modal .base .modalTabList {
    width: 75%;
  }
  .modal .base .modalTabList li {
    height: 50px;
    font-size: 1.2rem;
    line-height: 1.4;
    padding: 0 5px;
  }
  .modal .base .modalTabList li:hover {
    opacity: 1;
  }
  .modal .modalMainBlock {
    width: 100%;
    padding: 25px 0 25px;
  }
  .modal .modalMainBlock .closeModalBtn {
    width: 45px;
    height: 45px;
    right: -10px;
    top: -20px;
  }
  .modal .modalMainBlock .closeModalBtn img {
    width: 45px;
    height: 45px;
  }
  .modal .modalMainBlock .seg {
    padding: 0 5% 0;
  }
  .modal .modalMainBlock .seg .title {
    margin: 0 0 20px;
  }
  .modal .modalMainBlock .seg .title span {
    font-size: 1.3rem;
    padding: 0;
    text-indent: -5px;
    display: block;
  }
  .modal .inputBlock .bottomList {
    margin: 0 0 25px;
    padding: 20px 0 0;
  }
  .modal .inputBlock .bottomList li {
    display: block;
    padding: 0;
    font-size: 1.1rem;
  }
  .modal .inputBlock .bottomList li a:hover {
    color: #888;
  }
  .modal .restaurantBlock {
    display: block;
    margin: 0 0 25px;
  }
  .modal .restaurantBlock .inner {
    display: block;
    border: none;
    padding: 0;
  }
  .modal .restaurantBlock .inner .title {
    padding-left: 0;
    margin: 0 0 10px;
  }
  .modal .restaurantBlock .inner .btnList {
    margin: 0 0 10px;
  }
  .modal .restaurantBlock .inner .block:last-child .btnList {
    margin: 0 0 10px;
  }
  .modal .telBlock {
    margin: 0 0 25px;
  }
  .modal .telBlock p {
    font-size: 1.3rem;
  }
  .modal .telBlock .tel {
    font-size: 2.8rem;
    line-height: 30px;
    margin: -5px 0 0;
    padding: 20px 0 20px 40px;
    background: url(../img/common/mark_tel_blue.svg) no-repeat left center;
    background-size: 30px 30px;
    white-space: nowrap;
  }
  .modal .telBlock .mailBtn a {
    padding: 0 0 0 10px;
    background-position: left center;
    margin-bottom: 15px;
  }
  .modal .telBlock .chatBtn {
    width: 100%;
    text-align: center;
  }
  .modal .telBlock .chatBtn a {
    display: inline-block;
  }
  .modal .btnM {
    max-width: 100%;
  }
  .modal .modalMainBlock .seg .bottom {
    padding: 20px 0 0;
  }
  .modal .modalMainBlock .seg .bottom p {
    font-size: 1.3rem;
  }
  .modal .modalMainBlock .seg .bottom .left {
    float: none;
    width: 100%;
  }
  .modal .modalMainBlock .seg .bottom .right {
    float: none;
    width: 100%;
    padding-top: 5px;
  }
  .modal .modalMainBlock .seg .bottom .right a:last-child {
    position: relative;
    left: auto;
    bottom: auto;
    width: auto;
  }
  .modal .modalMainBlock .seg .bottom .right a:last-child:hover {
    color: #638fa2;
  }
  .modal .modalMainBlock .seg .bottom .right span.title {
    padding: 0 0 5px;
  }
  .modal .modalMainBlock .seg .bottom .chatBtn {
    text-align: center;
  }
}

@media screen and (max-width: 500px) {
  .mainHeader.scroll .btnList,
  .mainHeader .btnList {
    width: 140px;
  }
  .mainHeader .btnList li.b3 {
    width: 80px;
  }
  .mainHeader .btnList li.b4 {
    width: 60px;
  }
}

/* ::::::::::::::::::::::::::::::::: SP MENU ::::::::::::::::::::::::::::::::: */
.spMenuWrap {
  display: none;
}

@media screen and (max-width: 1240px) {
  .spMenuWrap {
    display: block;
    overflow: hidden;
  }
  .spMenuWrap .base {
    position: fixed;
    display: block;
    left: 100%;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: rgba(50, 50, 50, 0.5);
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
  }
  .spMenuWrap .base.active {
    left: 0;
  }
  .spMenuWrap .base .inner {
    position: relative;
    width: 90%;
    min-height: calc(100% - 60px);
    margin: 60px 0 0 10%;
    background: #FFF;
    text-align: left;
    opacity: 0;
    left: 20%;
    transition: all 0.5s ease;
  }
  .spMenuWrap .base.active .inner {
    opacity: 1;
    left: 0;
  }
  .spMenuWrap .infoBlock {
    padding: 30px 10%;
  }
  .spMenuWrap .infoBlock .name {
    color: #638fa2;
    font-size: 1.7rem;
    font-weight: 700;
    margin: 0 0 5px;
  }
  .spMenuWrap .infoBlock .tel {
    color: #638fa2;
    font-size: 2.4rem;
    font-weight: 500;
    margin: 0 0 5px;
  }
  .spMenuWrap .infoBlock .tel a {
    color: #638fa2;
  }
  .spMenuWrap .infoBlock .tel span {
    font-size: 1.5rem;
  }
  .spMenuWrap .infoBlock .access {
    color: #777;
    font-size: 1.15rem;
    margin: 0 0 10px;
  }
  .spMenuWrap .infoBlock .address {
    font-size: 1.2rem;
    margin: 0 0 20px;
  }
  .spMenuWrap .infoBlock .btnMap {
    padding: 0;
  }
  .spMenuWrap .infoBlock .btnMap a {
    color: #638fa2;
    font-size: 1.2rem;
    line-height: 25px;
    border: 1px solid #638fa2;
    display: block;
    text-align: center;
  }
  .spMenuWrap .infoBlock .btnMap a span {
    /*background: url(../img/common/mark_sp_map.svg) no-repeat right center;*/
    background-size: 10px 10px;
    padding: 0 20px 0 0;
  }
  .spMenuWrap .menuBlock {
    border-top: 1px solid #e5e5e5;
  }
  .spMenuWrap .menuBlock ul {
    list-style: none;
  }
  .spMenuWrap .menuBlock .secondList {
    border-bottom: 1px solid #e5e5e5;
  }
  .spMenuWrap .menuBlock .secondList li > p > span,
  .spMenuWrap .menuBlock .secondList li > p > a {
    display: block;
    padding: 15px 10%;
  }
  .spMenuWrap .menuBlock .secondList p {
    font-size: 1.4rem;
  }
  .spMenuWrap .menuBlock .secondList .secondTitle span {
    display: block;
    background: url(../img/common/mark_sp_menu_close.svg) no-repeat right 10% center;
    background-size: 13px 13px;
    cursor: pointer;
  }
  .spMenuWrap .menuBlock .secondList .secondTitle a {
    display: block;
  }
  .spMenuWrap .menuBlock .secondList .secondTitle.close span {
    background: url(../img/common/mark_sp_menu_open.svg) no-repeat right 10% center;
    background-size: 13px 13px;
  }
  .spMenuWrap .menuBlock .secondList ul {
    font-size: 1.3rem;
  }
  .spMenuWrap .menuBlock .secondList .thirdList {
    display: none;
    padding: 0 10% 15px;
  }
  .spMenuWrap .menuBlock .secondList .fourthList {
    font-size: 1.2rem;
    padding: 15px 0 0 15px;
  }
  .spMenuWrap .menuBlock .secondList .show {
    display: block;
  }
  .spMenuWrap .menuBlock .secondList ul li {
    padding: 0 0 10px;
  }
  .spMenuWrap .menuBlock .secondList ul li a {
    display: block;
    padding: 0 0 0 15px;
    position: relative;
  }
  .spMenuWrap .menuBlock .secondList ul li a::before {
    content: "";
    position: absolute;
    width: 8px;
    border-top: 1px solid #AAA;
    left: 0;
    top: 10px;
  }
  .spMenuWrap .subBlock {
    padding: 20px 10% 60px;
  }
  .spMenuWrap .subBlock .subMenu {
    margin: 0 0 20px;
  }
  .spMenuWrap .subBlock .subMenu li {
    display: inline-block;
    font-size: 1.15rem;
    vertical-align: top;
    padding: 0 0 0 12px;
    margin: 0 10px 0 0;
    /*background: url(../img/common/vector_yellow_right.svg) no-repeat left center;*/
    background-size: 6px 6px;
  }
  .spMenuWrap .subBlock .subMenu li a {
    color: #777;
  }
  .spMenuWrap .subBlock .subMenu li a:hover {
    text-decoration: underline;
  }
  .spMenuWrap .subBlock .btnLang {
    line-height: 30px;
    background: #96aeba;
    color: #FFF;
    display: block;
    width: 100%;
    font-size: 1.2rem;
  }
  .spMenuWrap .subBlock .btnLang span {
    background: url(../img/common/mark_sp_lang.svg) no-repeat right center;
    background-size: 8px 4px;
    padding: 0 15px 0 0;
  }
  .spMenuWrap .subBlock .langList {
    display: none;
    background: #96aeba;
    font-size: 1.3rem;
  }
  .spMenuWrap .subBlock .langList li {
    border-top: 1px solid #dce4e8;
  }
  .spMenuWrap .subBlock .langList a {
    display: block;
    width: 100%;
    padding: 8px 12px;
    color: #fff;
    text-align: left;
    transition: all .3s;
  }
  .spMenuWrap .subBlock .langList a:hover {
    background: rgba(255, 255, 255, 0.3);
  }
  .spMenuWrap .subBlock .branBtn {
    margin: 10px 0 20px;
  }
  .spMenuWrap .subBlock .branBtn a {
    line-height: 30px;
    color: #638fa2;
    background: #dce4e8;
    font-size: 1.15rem;
    display: block;
    text-align: center;
  }
  .spMenuWrap .subBlock .snsList {
    text-align: left;
  }
  .spMenuWrap .subBlock .snsList li {
    display: inline-block;
    padding: 0 10px 10px 0;
  }
  /*.spMenuWrap .shadow{position: fixed; height: 5px; width: 100%; left: 0; top: 60px; background: linear-gradient(180deg, rgba(0,0,0,0.07), rgba(0,0,0,0));;}
    .spMenuWrap .shadow span{position: absolute; height: 5px; width: 19%; right: 0; top: 0; background: url(../img/common/mark_sp_menu_on.svg) no-repeat center center; background-size: 8px 5px;}*/
  .spMenuWrap .tapArea {
    position: absolute;
    height: 100%;
    width: 10%;
    left: 0;
    top: 0;
  }
}

/* ::::::::::::::::::::::::::::::::: スクロール用テーブル ::::::::::::::::::::::::::::::::: */
div.scroll_div {
  overflow: auto;
}

/* ::::::::::::::::::::::::::::::::: プラン一覧 ::::::::::::::::::::::::::::::::: */
.planList_section {
  padding-bottom: 0;
}

.planList_section .tabListS {
  margin-bottom: 0;
  padding-bottom: 50px;
}

@media screen and (max-width: 989px) {
  .planList_section .tabListS {
    display: none;
  }
}

.planList_section .catList {
  background: #faf9f8;
  border: 1px solid #ddd;
  padding: 15px 30px 15px;
  margin: 0 0 50px;
  text-align: left;
  font-size: 1.4rem;
}

@media screen and (max-width: 989px) {
  .planList_section .catList {
    display: none;
  }
}

.planList_section .catList li {
  display: inline-block;
  margin: 0 20px 5px 0;
}

.planList_section .catList li a {
  color: #444;
  margin: 0;
  padding: 0 0 0 15px;
  text-decoration: underline;
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat left center;*/
  background-size: 6px 6px;
}

.planList_section .catList li a:hover {
  color: #638fa2;
}

.planList_section .catList li a::after {
  content: none;
}

.planList_section .catList li:last-child a {
  padding: 0 0 0 15px;
}

.planList_section .catList li.active a {
  color: #638fa2;
  font-weight: 700;
  text-decoration: none;
}

.planList_section .searchBlock {
  border: solid 1px #ddd;
  background: #faf9f8;
  padding: 16px 10px;
  margin-bottom: 40px;
  font-size: 0;
}

.planList_section .searchBlock p {
  display: inline-block;
  margin-right: 10px;
  font-size: 1.5rem;
}

@media screen and (max-width: 989px) {
  .planList_section .searchBlock p {
    display: block;
  }
}

.planList_section .searchBlock p span {
  color: #638fa2;
  font-weight: 700;
}

.planList_section .categorySelect {
  background: #515457 url(../img/common/mark_select_white.svg) no-repeat right 15px center/8px auto;
  border-radius: 0;
  width: 100%;
  height: 50px;
  line-height: 50px;
  margin-bottom: 40px;
  padding: 0 17px;
  text-align: left;
  color: #fff;
  font-size: 14px;
}

.planList_section .more_btn {
  margin: 50px auto 0;
}

@media screen and (min-width: 990px) {
  .planList_section .more_btn {
    max-width: none;
    width: 360px;
  }
}

@media screen and (max-width: 989px) {
  .planList_section .more_btn {
    margin: 40px auto 0;
  }
}

.planList_section .more_btn a {
  width: 100%;
}

.planList_section .inner960 > div:last-child {
  margin-bottom: 0;
}

.planContentsList {
  margin-bottom: 30px;
}

.planContentsList > li {
  background: #fff;
  padding: 36px 40px 41px;
  margin-bottom: 40px;
  text-align: left;
}

@media screen and (max-width: 989px) {
  .planContentsList > li {
    padding: 16px 5% 30px;
    margin-bottom: 30px;
  }
}

.planContentsList > li:last-child {
  margin-bottom: 0;
}

.planContentsList > li.recommendation {
  border: solid #d4b572 5px;
}

@media screen and (max-width: 989px) {
  .planContentsList > li.recommendation {
    border-width: 2px;
  }
  .planContentsList > li.recommendation .inner {
    margin-right: -2px;
    margin-left: -2px;
  }
  .planContentsList > li.recommendation .priceBlock {
    margin-right: -2px;
    margin-left: -2px;
  }
  .planContentsList > li.recommendation .btn {
    margin-right: -2px;
    margin-left: -2px;
  }
}

.planContentsList > li.recommendation .icon {
  font-size: 1.3rem;
  background: #d4b572;
  display: inline-block;
  height: 24px;
  line-height: 24px;
  padding: 0 20px;
  border-radius: 12px;
  color: #fff;
  margin-bottom: 8px;
}

.planContentsList .inner::after {
  content: "";
  display: block;
  clear: both;
}

.planContentsList .inner .img {
  float: left;
  width: 300px;
  margin: 0 40px 30px 0;
}

@media screen and (max-width: 989px) {
  .planContentsList .inner .img {
    float: none;
    width: auto;
    margin: 0 0 12px 0;
  }
}

.planContentsList .inner .img img {
  max-width: 100%;
}

.planContentsList .inner .textArea {
  overflow: hidden;
}

.planContentsList .planTitle {
  font-size: 2.1rem;
  line-height: 1.666;
  margin-bottom: 15px;
  font-weight: 500;
  color: #222;
}

@media screen and (max-width: 989px) {
  .planContentsList .planTitle {
    margin-bottom: 10px;
    font-size: 1.6rem;
    line-height: 1.5625;
  }
}

.planContentsList .tagList {
  margin-bottom: 20px;
}

@media screen and (max-width: 989px) {
  .planContentsList .tagList {
    margin-bottom: 10px;
  }
}

.planContentsList .desc {
  margin-bottom: 25px;
  font-size: 1.3rem;
  line-height: 1.692;
}

.planContentsList .priceBlock {
  margin-bottom: 30px;
}

@media screen and (max-width: 989px) {
  .planContentsList .priceBlock {
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 989px) {
  .planContentsList .btnWrap {
    max-width: 350px;
    margin: 0 auto;
  }
  .planContentsList .btnWrap li:nth-child(odd):last-child {
    max-width: none;
    width: 100%;
  }
  .planContentsList .btnWrap li a {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 1.45rem;
  }
  .planContentsList .btnWrap span {
    font-size: 1.3rem;
  }
}

/*ページャー*/
.pager ol {
  padding: 20px 0 0 !important;
  font-size: 0;
  text-align: center;
}

.pager ol li {
  display: inline-block;
}

.pager ol li:not(:last-child) {
  margin-right: 20px;
}

@media screen and (max-width: 989px) {
  .pager ol li {
    font-size: 15px;
  }
  .pager ol {
    padding: 0 !important;
  }
}

.pager ol li a {
  display: block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-decoration: none;
  font-size: 15px;
  color: #fff;
  background: #a8aaab;
}

.pager ol li :hover {
  color: #fff;
}

.pager ol li.current a {
  background: #638fa2;
}

/*sns*/
.sns_box_wrap {
  padding: 25px 40px;
  border: 1px solid #bbb;
  margin: 0 auto;
  width: auto;
  text-align: left;
}

.sns_box_wrap .sns_box {
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.sns_box_wrap .sns_box a {
  display: block;
  width: 30px;
  height: 30px;
  margin: 0 10px;
  text-align: center;
}

.sns_box_wrap .sns_box a img {
  width: 25px;
  height: auto;
  vertical-align: middle;
}

@media screen and (max-width: 989px) {
  .sns_box_wrap .sns_box {
    width: 100%;
  }
  .sns_box_wrap .sns_box a {
    margin: 0 8px;
  }
}

/* ::::::::::::::::::::::::::::::::: プラン詳細 ::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 989px) {
  .planDetail .planTopBlock {
    margin-bottom: 30px;
  }
}

.planDetail .planTopBlock.recommendation {
  border-right: solid #dfc896 5px;
  box-sizing: border-box;
  position: relative;
  overflow: visible;
  margin-top: 20px;
}

@media screen and (max-width: 989px) {
  .planDetail .planTopBlock.recommendation {
    border-right: none;
    border-bottom: solid #dfc896 5px;
    margin-top: 0;
  }
}

.planDetail .planTopBlock.recommendation::after {
  content: '';
  display: block;
  clear: both;
}

.planDetail .planTopBlock.recommendation .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #d4b572;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  position: absolute;
  top: -25px;
  right: -25px;
  z-index: 1;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.461;
  text-align: center;
}

@media screen and (max-width: 989px) {
  .planDetail .planTopBlock.recommendation .icon {
    position: static;
    display: inline-block;
    width: auto;
    height: 24px;
    line-height: 24px;
    padding: 0 21px;
    border-radius: 12px;
    margin-bottom: 10px;
  }
}

.planDetail .btnWrap {
  margin-bottom: 0;
}

@media screen and (min-width: 990px) {
  .planDetail .btnWrap {
    justify-content: center;
  }
}

@media screen and (max-width: 989px) {
  .planDetail .btnWrap {
    display: block;
    margin: 0 15px;
  }
}

.planDetail .btnWrap li {
  background: none;
  margin: 0 10px;
}

@media screen and (max-width: 989px) {
  .planDetail .btnWrap li {
    max-width: none;
    margin: 10px 0;
    padding: 0;
  }
}

.planDetail .btnWrap .btnL {
  max-width: 360px;
}

.planArticle {
  margin-top: 60px;
  padding-bottom: 50px;
  /* ::::::::::::::::::::::::::::::::: newStyle_stayplan ::::::::::::::::::::::::::::::::: */
}

@media screen and (max-width: 989px) {
  .planArticle {
    margin-top: 30px;
    padding-bottom: 30px;
  }
}

.planArticle h3:not([class]) + h3:not([class]) {
  margin-top: -1.6em;
}

@media screen and (max-width: 989px) {
  .planArticle .planDetailTable th,
  .planArticle .planDetailTable td {
    display: block;
  }
}

@media screen and (max-width: 989px) {
  .planArticle .planDetailTable td {
    border-top: none;
  }
}

@media screen and (min-width: 990px) {
  .planArticle .planDetailTable th {
    width: 15%;
  }
}

@media screen and (max-width: 989px) {
  .planArticle .planDetailTable tr:not(:last-child) td {
    border-bottom: none;
  }
}

.planArticle .menuTable th,
.planArticle .menuTable td {
  border: none;
  background: none;
  padding: 4px 8px;
}

@media screen and (min-width: 990px) {
  .planArticle .menuTable th {
    width: 10%;
  }
}

.planArticle .imgList {
  margin-bottom: 30px;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList {
    display: block;
  }
  .planArticle .imgList li {
    width: 100%;
  }
  .planArticle .imgList li img {
    width: 100%;
  }
  .planArticle .imgList li + li {
    margin-top: 15px;
  }
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.col2 {
    margin-bottom: 20px;
  }
  .planArticle .imgList.col2 + h4 {
    margin-bottom: 15px;
  }
}

.planArticle .imgList.col2 li {
  width: 50%;
  margin: 0;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.col2 li {
    width: 100%;
  }
}

.planArticle .imgList.col2 li .img {
  width: 100%;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.col2 li .img {
    margin: 0;
  }
}

.planArticle .imgList.col2 li .img img {
  width: 100%;
}

.planArticle ul {
  font-size: 1.4rem;
}

.planArticle .planBlock {
  margin-bottom: 20px;
}

@media screen and (max-width: 989px) {
  .planArticle .planBlock {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 989px) {
  .planArticle .planBlock .img {
    float: none !important;
    max-width: 100% !important;
    text-align: center;
    padding-right: 0 !important;
    padding-left: 0 !important;
    margin-bottom: 25px;
  }
}

@media screen and (min-width: 990px) {
  .planArticle .planBlock:last-child .img {
    margin-bottom: 0;
  }
}

.planArticle .planBlock .textArea {
  overflow: hidden;
}

.planArticle .planBlock .textArea h4 {
  margin-bottom: 20px;
  font-size: 2rem;
}

@media screen and (max-width: 989px) {
  .planArticle .planBlock .textArea h4 {
    margin-bottom: 15px;
  }
}

.planArticle .planBlock .textArea p {
  margin-bottom: 30px;
}

.planArticle .planBlock .textArea .btnWrap {
  justify-content: flex-start;
}

.planArticle .planBlock .textArea .btnWrap li:first-child {
  margin-left: 0;
}

.planArticle .btnWrap {
  justify-content: center;
  margin-bottom: 50px;
}

@media screen and (max-width: 989px) {
  .planArticle .btnWrap {
    display: block;
    margin: 0 0 20px;
  }
  .planArticle .btnWrap p.btnL {
    margin: 10px 0;
  }
}

.planArticle .btnWrap:last-child {
  margin-bottom: 0;
}

.planArticle .btnWrap .btnSS a,
.planArticle .btnWrap .btnS a,
.planArticle .btnWrap .btnM a,
.planArticle .btnWrap .btnL a {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 40px;
  padding: 10px 10px;
  line-height: 1.5;
}

.planArticle .btnWrap .btnL {
  margin: 0 10px;
}

@media screen and (max-width: 989px) {
  .planArticle .btnWrap .btnL {
    margin: 10px 0;
  }
}

.planArticle .btnWrap .btnL a {
  min-height: 60px;
}

.planArticle .boxOption {
  display: flex;
  flex-direction: row-reverse;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption {
    display: block;
  }
}

.planArticle .boxOption .img {
  width: 300px;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption .img {
    width: 100%;
  }
}

.planArticle .boxOption .inner {
  width: calc(100% - 300px);
  padding: 15px 30px 15px 15px;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption .inner {
    width: auto;
    padding: 15px 0 0;
  }
}

.planArticle .boxOption .inner h4 {
  margin-bottom: 20px;
}

.planArticle .boxOption p {
  margin-bottom: 0;
}

.planArticle .boxOption:not(.bgGray) .img {
  width: 420px;
  margin: 0 0 40px;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption:not(.bgGray) .img {
    width: 100%;
    margin: 0 0 20px;
  }
}

.planArticle .boxOption:not(.bgGray) .inner {
  width: calc(100% - 300px);
  padding: 15px 30px 15px 15px;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption:not(.bgGray) .inner {
    width: 100%;
    padding: 0 0 30px;
  }
  .planArticle .boxOption:not(.bgGray) .inner h3 {
    margin-bottom: 15px;
  }
}

.planArticle .boxOption.reverse {
  flex-direction: row;
}

.planArticle .boxOption.reverse .inner {
  padding: 0 15px 0 30px;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption.reverse .inner {
    padding: 0 0 30px;
  }
}

.planArticle .boxOption.harf {
  justify-content: space-between;
}

.planArticle .boxOption.harf .img,
.planArticle .boxOption.harf .inner {
  width: calc(50% - 20px);
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption.harf .img,
  .planArticle .boxOption.harf .inner {
    width: 100%;
  }
}

.planArticle .boxOption.harf .inner {
  padding: 0;
}

.planArticle .boxOption.harf .img span.imgCaption {
  display: block;
  width: 100%;
  margin: 10px 0;
  font-size: 1.3rem;
  text-align: center;
}

.planArticle .boxOption.harf p {
  margin: 0 0 40px;
}

@media screen and (max-width: 989px) {
  .planArticle .boxOption.harf p {
    margin: 0 0 30px;
  }
}

.planArticle h2.center {
  text-align: center;
  margin: 40px 0 40px;
  font-size: 2.7rem;
}

@media screen and (max-width: 989px) {
  .planArticle h2.center {
    margin: 30px 0 30px;
    font-size: 2.0rem;
  }
}

.planArticle h2.center:first-child {
  margin-top: 0;
}

.planArticle .imgList.kindList li .img {
  margin: 0 0 20px;
}

.planArticle .imgList.kindList li h4 {
  margin: 0 0 20px;
  padding: 0 0 0 20px;
  /*background: url(../img/common/vector_yellow_right.svg) no-repeat 0 50%;*/
  background-size: 6px 6px;
}

.planArticle .imgList.kindList li .caption {
  text-align: left;
}

.planArticle .bgWhite {
  background: #fff;
  border: 1px solid #DDD;
  padding: 15px 20px;
  font-size: 1.4rem;
  margin: 0 0 40px;
}

@media screen and (max-width: 989px) {
  .planArticle .bgWhite {
    padding: 15px 5%;
  }
}

.planArticle p.img.mb30 {
  margin-bottom: 30px;
}

.planArticle .imgList.captionList li .img {
  position: relative;
  margin: 0 0 20px;
  min-height: 273px;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.captionList li .img {
    min-height: inherit;
  }
}

.planArticle .imgList.captionList li .img span.imgCaption {
  display: block;
  width: 100%;
  margin: 10px 0;
  font-size: 1.3rem;
  min-height: 22px;
  text-align: center;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.captionList li .img span.imgCaption {
    min-height: inherit;
  }
}

.planArticle .imgList.captionList li {
  width: 410px;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.captionList li {
    width: 100%;
  }
}

.planArticle .imgList.captionList li + li {
  margin-left: 60px;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.captionList li + li {
    margin: 15px 0 0;
  }
}

.planArticle .imgList.captionList li h4 {
  margin: 0 0 20px;
  min-height: 30px;
}

@media screen and (max-width: 989px) {
  .planArticle .imgList.captionList li h4 {
    min-height: inherit;
  }
}

.planArticle .imgList.captionList li .caption {
  text-align: left;
}

.planArticle .widhMidashi {
  position: relative;
  font-size: 2.0rem;
  color: #444444;
  text-align: left;
  font-weight: 500;
}

@media screen and (max-width: 989px) {
  .planArticle .widhMidashi {
    font-size: 1.8rem;
  }
}

.planArticle .widhMidashi01 {
  border-bottom: 3px solid #a8aaab;
}

.planArticle .widhMidashi02 {
  border-left: 5px solid #a8aaab;
  padding: 0 0 0 10px;
}

.planArticle .widhMidashi03 {
  padding: 0 0 0 50px;
}

.planArticle .widhMidashi03::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 30px;
  height: 3px;
  background: #a8aaab;
  margin: auto;
}

.planArticle .widhMidashi01.blue {
  border-bottom: 3px solid #638fa2;
}

.planArticle .widhMidashi02.blue {
  border-left: 5px solid #638fa2;
}

.planArticle .widhMidashi03.blue::before {
  background: #638fa2;
}

.planArticle .widhMidashi01.brown {
  border-bottom: 3px solid #665852;
}

.planArticle .widhMidashi02.brown {
  border-left: 5px solid #665852;
}

.planArticle .widhMidashi03.brown::before {
  background: #665852;
}

.planArticle .widhMidashi04 {
  border: 1px solid #444;
  padding: 7px 10px;
}

@media screen and (max-width: 989px) {
  .planArticle .widhMidashi04 {
    padding: 3px 10px;
  }
}

.planArticle .imgSlideBlock .mainList {
  _zoom: 1;
  overflow: hidden;
  position: relative;
  margin: 0 auto 30px;
  width: 100%;
  box-sizing: border-box;
}

.planArticle .imgSlideBlock .mainList li {
  float: left;
  width: 540px;
  height: auto;
  margin: 0 20px;
  background: #FFF;
  position: relative;
}

.planArticle .imgSlideBlock .mainList li .img {
  margin: 0;
}

.planArticle .imgSlideBlock .mainList li .img span.imgCaption {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 7px 20px;
  box-sizing: border-box;
  background: rgba(35, 24, 21, 0.7);
  color: #fff;
  font-size: 1.3rem;
}

@media screen and (max-width: 989px) {
  .planArticle .imgSlideBlock .mainList li .img span.imgCaption {
    padding: 4px 20px;
  }
}

.planArticle .imgSlideBlock .slick-dots {
  clear: both;
  padding: 30px 0 0;
  text-align: center;
}

.planArticle .imgSlideBlock .slick-dots li {
  float: none;
  width: 5px;
  height: 5px;
  margin: 0 6px;
  background: none;
  border: 1px solid #aea799;
  transform: rotate(45deg);
  display: inline-block;
  text-indent: -999px;
  overflow: hidden;
  cursor: pointer;
  z-index: 1;
}

.planArticle .imgSlideBlock .slick-dots li.slick-active {
  background: #aea799;
}

.planArticle .imgSlideBlock .slick-prev,
.planArticle .imgSlideBlock .slick-next {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 190px;
  margin: auto;
  text-indent: -999px;
  overflow: hidden;
  z-index: 1;
}

.planArticle .imgSlideBlock .slick-prev {
  background: url(../img/common/vector_pickup_left.svg) no-repeat center center;
  background-size: 30px 30px;
  left: 105px;
}

.planArticle .imgSlideBlock .slick-next {
  background: url(../img/common/vector_pickup_right.svg) no-repeat center center;
  background-size: 30px 30px;
  right: 105px;
}

@media screen and (max-width: 1180px) {
  .planArticle .imgSlideBlock .mainList {
    padding: 0;
  }
  .planArticle .imgSlideBlock .slick-prev,
  .planArticle .imgSlideBlock .slick-next {
    top: auto;
    bottom: 0;
  }
  .planArticle .imgSlideBlock .slick-prev {
    left: 0;
  }
  .planArticle .imgSlideBlock .slick-next {
    right: 0;
  }
}

@media screen and (max-width: 989px) {
  .planArticle .imgSlideBlock {
    width: 100%;
    margin: 0 auto 25px;
  }
  .planArticle .imgSlideBlock .mainList {
    width: 100%;
    padding: 0;
  }
  .planArticle .imgSlideBlock .mainList li {
    width: 100%;
    height: auto;
    margin: 0;
  }
  .planArticle .imgSlideBlock .mainList li img {
    width: 100%;
    height: auto;
  }
  .planArticle .imgSlideBlock .mainList li .title {
    padding: 18px 0 0;
    margin: 0 5% 13px;
    overflow: hidden;
    background-position: 0px 26px;
  }
  .planArticle .imgSlideBlock .mainList li .info {
    position: relative;
    width: 90%;
    left: auto;
    bottom: auto;
    margin: 0 auto 17px;
  }
  .planArticle .imgSlideBlock .slick-dots {
    padding: 25px 70px 5px;
  }
  .planArticle .imgSlideBlock .slick-dots li {
    float: none;
    width: 5px;
    height: 5px;
    margin: 0 6px;
    background: none;
    border: 1px solid #aea799;
    transform: rotate(45deg);
    display: inline-block;
    text-indent: -999px;
    overflow: hidden;
    cursor: pointer;
  }
  .planArticle .imgSlideBlock .slick-dots li.slick-active {
    background: #aea799;
  }
}

.planArticle > *:last-child {
  margin-bottom: 0;
}

/* ::::::::::::::::::::::::::::::::: bookingGadget ::::::::::::::::::::::::::::::::: */
.bookingBlock {
  background: rgba(36, 39, 42, 0.9);
}

.bookingBlock .inner {
  width: 960px;
  margin: 0 auto;
  _zoom: 1;
  overflow: hidden;
}

.bookingGadget .reserveForm {
  display: block;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  /* flex-wrap: wrap; */
  /* justify-content: space-between; */
  width: 100%;
  /* padding: 15px 0 0; */
  position: relative;
}
.bookingGadget .inputBlock.stay .reserveForm {
  padding: 10px 0 0;
}
.bookingGadget .inputBlock.restaurant .reserveForm {
  padding: 20px 0 0;
}

.bookingGadget .reserveForm > *{
  margin-right: 12px;
}
.bookingGadget .reserveForm > *:last-child{
  margin-right: 0;
}

.bookingGadget .reserveForm .reserveForm__title{
  text-align: left;
  color: #ccc;
  font-size: 11px;
  margin-bottom: 4px;
}

.bookingGadget .reserveForm input,
.bookingGadget .reserveForm button,
.bookingGadget .reserveForm select,
.bookingGadget .reserveForm span {
  font-size: 1.4rem;
  height: 40px;
  line-height: 40px;
  color: #FFF;
  display: block;
  background-color: #505254;
  border-radius: 0;
  border: none;
}

.bookingGadget input:placeholder-shown {
  color: #FFF;
}

.bookingGadget input::-webkit-input-placeholder {
  color: #FFF;
}

.bookingGadget input:-moz-placeholder {
  color: #FFF;
}

.bookingGadget input:-ms-input-placeholder {
  color: #FFF;
}

.bookingGadget .reserveForm input {
  width: 150px;
  padding: 0 10px;
}

.bookingGadget .reserveForm input.r {
  width: 100px;
}

.bookingGadget .reserveForm .rBtn a,
.bookingGadget .reserveForm input[type="submit"] {
  width: 200px;
  display: block;
  line-height: 40px;
  font-size: 1.45rem;
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN','メイリオ',Meiryo,'ＭＳ Ｐゴシック', sans-serif;
  font-weight: normal;
  background: #638fa2;
  color: #FFF;
  text-align: center;
}

.bookingGadget .reserveForm .rBtn {
  width: 200px;
}

.bookingGadget .reserveForm select {
  width: 70px;
  padding: 0 10px;
  background: #505254 url(../img/common/mark_select_white.svg) no-repeat right 8px top 17px;
  background-size: 7px 6px;
}

.bookingGadget .reserveForm select.r {
  width: 550px;
}

.bookingGadget .reserveForm select option {
  text-align: left;
}

.bookingGadget .reserveForm button {
  font-size: 1.45rem;
  background: #638fa2;
  width: 200px;
}

.bookingGadget .reserveForm button.r {
  width: 150px;
}

.bookingGadget .reserveForm span {
  font-size: 1.3rem;
  background: none;
  position: relative;
}

.bookingGadget .reserveForm img.calender {
  display: block;
  position: absolute;
  width: 25px;
  height: 26px;
  right: 10px;
  top: 7px;
  cursor: pointer;
}

/*.bookingGadget .reserveForm img.calender.r{right: 10px;}*/
.bookingGadget ul.bottomList {
  text-align: right;
  color: #CCC;
  padding: 3px 0 0;
}

.bookingGadget ul.bottomList li {
  display: inline-block;
  padding: 0 0 0 15px;
  font-size: 1.1rem;
}

.bookingGadget ul.bottomList li a {
  color: #CCC;
  padding: 0 0 0 12px;
  text-decoration: underline;
  background: url(../img/common/vector_white_right_50.svg) no-repeat left center;
  background-size: 6px 7px;
}

.bookingGadget ul.bottomList li a:hover {
  color: #AAA;
}

@media screen and (max-width: 989px) {
  .bookingBlock {
    padding: 0 0 20px;
    background: #24272a;
  }
  .bookingBlock .inner {
    width: 90%;
  }
  .bookingGadget .right {
    width: 100%;
    float: none;
  }
  .bookingGadget .reserveForm {
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
  }
  .bookingGadget .reserveForm input,
  .bookingGadget .reserveForm select {
    margin: 0 15px 20px 0;
  }
  .bookingGadget .reserveForm select.r {
    width: 100%;
    margin-right: 0;
  }
  .bookingGadget .reserveForm .rBtn,
  .bookingGadget .reserveForm input[type="submit"] {
    width: 100%;
    margin: 0 0 10px;
  }
  .bookingGadget .reserveForm .rBtn a {
    width: 100%;
  }
  .bookingGadget .reserveForm img.calender {
    right: 30px;
  }
  .bookingGadget ul.bottomList {
    text-align: left;
    padding: 3px 0 0;
  }
  .bookingGadget ul.bottomList li {
    display: block;
    padding: 2px 0 2px;
  }
  .bookingGadget p.btnM {
    max-width: 100%;
    margin: 0 0 15px;
  }
}

/* ::::::::::::::::::::::::::::::::: datepicker ::::::::::::::::::::::::::::::::: */
.modalCalendar .modalMainBlock {
  box-sizing: border-box;
  padding: 40px 45px;
}

.modalCalendar h2 {
  background: url(../img/common/mark_calender_gray.svg) no-repeat left center/22px auto;
  padding-left: 35px;
  margin-bottom: 30px;
  text-align: left;
  font-weight: 700;
  font-size: 2.2rem;
  line-height: 1;
}

.datepickerText {
  background: url(../img/common/mark_calender_white.svg) no-repeat right 10px center/25px auto;
}

.ui-datepicker {
  position: relative;
  box-sizing: border-box;
  border-color: #eeebe8;
  border-radius: 0;
  width: 100% !important;
  padding: 30px 45px;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

.ui-datepicker-multi-3 .ui-datepicker-group {
  width: 32%;
}

.ui-datepicker-multi-3 .ui-datepicker-group + .ui-datepicker-group {
  margin-left: 2%;
}

.ui-datepicker .ui-datepicker-header {
  position: static;
  background: none;
  border: none;
  color: #346a86;
  font-size: 1.5rem;
  font-weight: 900;
}

.ui-datepicker-month i {
  margin-right: 3px;
  font-style: normal;
  font-size: 2.3rem;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  top: 0;
  bottom: 0;
  border-radius: 50%;
  border: 2px solid #bbb;
  background: #fff;
  height: 40px;
  width: 40px;
  margin: auto;
  opacity: 1;
  cursor: pointer;
}

.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled {
  opacity: .35;
}

.ui-widget-header .ui-icon {
  background: none;
  width: 10px;
  height: 10px;
  border-top: 2px solid #bbb;
  border-right: 2px solid #bbb;
}

.ui-datepicker .ui-datepicker-prev {
  left: -22px;
}

.ui-datepicker .ui-datepicker-next {
  right: -22px;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  top: 0;
  bottom: 0;
  left: 0;
  right: 5px;
  margin: auto;
  transform: rotate(45deg);
}

.ui-datepicker .ui-datepicker-prev span {
  left: 5px;
  right: 0;
  transform: rotate(-135deg);
}

.ui-datepicker-calendar {
  width: 100% !important;
  margin: 0 !important;
  table-layout: fixed;
}

.ui-datepicker-calendar thead {
  border-bottom: 1px solid #767676;
}

.ui-datepicker-calendar thead th {
  font-size: 1.3rem;
  font-weight: normal;
}

.ui-datepicker-calendar tbody tr:first-child td {
  padding-top: 12px;
}

.ui-datepicker-calendar .ui-state-default {
  overflow: visible;
  border: none;
  background: none;
  padding: 3px;
  text-align: center;
  font-size: 1.4rem;
  color: #767676;
}

.ui-datepicker-calendar .ui-datepicker-week-end:first-child .ui-state-default,
.ui-datepicker-calendar .holiday .ui-state-default {
  color: #ba3c3d;
}

.ui-datepicker-calendar .ui-datepicker-week-end:last-child .ui-state-default {
  color: #00335b;
}

.ui-datepicker-calendar .ui-state-active,
.ui-datepicker-calendar .current span {
  position: relative;
  z-index: 0;
  color: #fff !important;
}

.ui-datepicker-calendar .ui-state-active::before,
.ui-datepicker-calendar .current span::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  margin: auto;
  width: 2em;
  height: 2em;
  background: #638fa2;
  border-radius: 50%;
}

#datepicker01 {
  margin-bottom: 25px;
}

#datepicker01 .ui-datepicker {
  padding: 25px 40px;
}

#datepicker01 .ui-state-default {
  padding: 2px;
}

/* ::::::::::::::::::::::::::::::::: colorbox ::::::::::::::::::::::::::::::::: */
.imgBlock {
  position: relative;
}

.mapBtn {
  position: absolute;
  top: -10px;
  right: 0;
}

@media screen and (max-width: 989px) {
  .mapBtn {
    top: 0;
  }
}

.mapBtn .btn_360,
.mapBtn .btn_zoom {
  border-radius: 50%;
  width: 55px;
  height: 55px;
  color: #fff;
}

.mapBtn .btn_360 a,
.mapBtn .btn_zoom a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 1.1rem;
  line-height: .8;
  text-decoration: none;
}

.mapBtn .btn_360 a span,
.mapBtn .btn_zoom a span {
  font-size: 1.7rem;
  padding-left: 5px;
}

.mapBtn .btn_360 {
  background: #d4b572;
}

.mapBtn .btn_zoom {
  margin-top: -5px;
  background: #6c6e70;
}

.mapBtn .btn_zoom a {
  background: url(../img/banquet/icon_search.svg) no-repeat center 10px/18px auto;
  padding-top: 10px;
}

#cboxOverlay {
  background: rgba(244, 242, 240, 0.95) !important;
  overflow: visible !important;
}

#colorbox iframe {
  width: 100%;
}

#colorbox,
#cboxWrapper {
  overflow: visible !important;
}

#cboxContent {
  background: #fff !important;
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
}

#cboxLoadedContent {
  border: 30px solid #fff !important;
}

@media screen and (max-width: 989px) {
  .view360 #cboxLoadedContent {
    box-sizing: border-box;
    border: 10px solid #fff !important;
    width: 100% !important;
    height: 100% !important;
  }
}

#cboxClose {
  top: -30px !important;
  right: -30px !important;
  background: url(../img/common/btn_modal_close.svg) no-repeat 0 0/100% 100% !important;
  width: 60px !important;
  height: 60px !important;
}

@media screen and (max-width: 989px) {
  #cboxClose {
    top: -10px !important;
    right: -10px !important;
    width: 40px !important;
    height: 40px !important;
  }
}

/* YouTube */
div.section.YouTube {
  padding: 0;
  background: #24272a;
}

div.section.YouTube p.inner a {
  position: relative;
  display: block;
}

div.section.YouTube p.inner a::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 5;
  background: linear-gradient(180deg, rgba(34, 34, 34, 0), rgba(34, 34, 34, 0.25) 50%, rgba(34, 34, 34, 0.35));
}

div.section.YouTube p.inner a span.img img {
  transition: all 0.8s ease;
}

div.section.YouTube p.inner a:hover span.img img {
  transform: scale(1.07);
  opacity: 0.8;
}

div.section.YouTube p.inner span.mark {
  position: absolute;
  width: 110px;
  padding: 100px 0 0;
  background: url(../img/top/mark_video.svg) no-repeat center top;
  background-size: 90px 90px;
  color: #FFF;
  z-index: 20;
  font-size: 1.3rem;
  left: 0;
  top: 50%;
  right: 0;
  margin: 0 auto;
  transform: translateY(-47%);
}

div#videoModal {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1500;
  background: #000;
  display: none;
}

div#videoModal button {
  width: 40px;
  height: 40px;
  position: fixed;
  right: 10px;
  top: 10px;
  z-index: 1501;
  background: none;
}

@media screen and (max-width: 989px) {
  /* YouTube */
  div.section.YouTube {
    padding: 0;
  }
  div#videoModal {
    height: calc(100% - 110px);
    padding: 55px 0;
  }
}

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