:root {
  --main-wh: #fff;
  --main-bk: #3e3a39;
  --main-color: #82969d;
  --sub-color: #eeecee;
  --sub-color2: #cdcace;
  --brdr-color: #3e3a39;
  --st-easing: cubic-bezier(0, 0.315, 0.155, 0.995);
}

html,
body {
  background-color: var(--main-wh);
  font-weight: 400;
  font-size: 62.5%;
  line-height: 2;
  letter-spacing: 0.1rem;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "palt";
  color: var(--main-bk);
  font-family: '游明朝', 'Yu Mincho', '游明朝体', 'YuMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'ＭＳ Ｐ明朝', 'MS PMincho', serif;
}

.gothick {
  font-family: 'Helvetica', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.gothick.bold {
  font-weight: 700;
}

.gothick.bold .normal {
  font-weight: 400;
}

/*html {
  visibility: hidden;
}

html.wf-active,
html.loading-delay {
  visibility: visible;
}*/

body.hidden {
  overflow: hidden;
}

::selection {
  background: var(--main-bk);
  color: #fff;
}

/*共通css*/
p {
  font-size: 1.4rem;
  color: var(--main-bk);
}

.page p {
  margin-bottom: 1.5em;
}

br.pc-hide {
  display: none;
}

br.sp-only {
  display: none;
}

/*画像　共通　設定*/
img {
  width: 100%;
  margin-bottom: 20px;
  display: block;
}

.thum {
  background: no-repeat center center / cover;
}

/*END 画像　共通　設定*/

/*セクション　基本　設定*/
.section {
  width: calc(100% - 80px);
  max-width: 800px;
  margin: 0 auto 80px;
  padding-top: 30px;
}

.inner-container {
  max-width: 800px;
  margin: 0 auto;
}

content {
  width: 100%;
}

/*EMD セクション　基本　設定*/

/*リンク　基本　設定*/
a {
  font-size: 1.4rem;
  color: var(--main-color);
  text-decoration: none;
  transition: color .3s;
  cursor: pointer;
  transition: .5s var(--st-easing);
}

a:hover {
  opacity: 0.5;
  text-decoration: none;
}

/*ボタン　基本　設定*/
.btn-wrapper {
  text-align: center;
}

.btn {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--main-color);
  margin: 10px 0 0;
  padding: 0;
  position: relative;
  display: inline-block;
  text-indent: 0.2rem;
}

.btn.max {
  font-size: 2.6rem;
  line-height: 1;
  font-weight: bold;
}

.btn:after {
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--main-color);
  transform: scale(1, 1);
  transform-origin: left top;
  transition: transform .4s var(--st-easing);
}

.btn.rv {
  color: var(--main-wh);
}

.btn.rv:after {
  background-color: var(--main-wh);
}


.comingsoon .btn:after {
  display: none;
}

.box:hover,
.btn:hover {
  opacity: 1;
}

.btn:hover:after {
  transform-origin: right top;
  transform: scale(0, 1);
}

.btn-sq {
  width: 100%;
  max-width: 300px;
  font-weight: 400;
  color: var(--main-bk);
  border: 1px solid var(--main-bk);
  padding: 10px 0;
  display: inline-block;
  text-align: center;
  margin-top: 30px;
}

.btn-sq.rv {
  color: var(--main-wh);
  border: 1px solid rgba(255, 255, 255, 0.75);
}

.btn-bl {
  width: 100%;
  max-width: 300px;
  font-weight: 600;
  font-size: 1.3rem;
  letter-spacing: 0.1rem;
  color: var(--main-wh);
  padding: 10px 0;
  display: inline-block;
  text-align: center;
  margin-top: 30px;
  background-color: var(--main-color);
}

.btn-bl.rv {
  background-color: var(--main-wh);
  color: var(--main-color);
}

.btn-sq:hover,
.btn-bl:hover {
  opacity: 0.8;
}

.btn-bl:hover {
  color: var(--main-wh);
}

.btn-bl.rv:hover {
  color: var(--main-color);
}

/*END ボタン　基本　設定*/
/*END リンク　基本　設定*/

/*見出し　基本設定*/
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.5;
  font-weight: 400;
  color: var(--main-bk);
  letter-spacing: 0.2rem;
}

h1 {
  font-size: 5.4rem;
  margin-bottom: 30px;
}

h2 {
  font-size: 3.2rem;
  letter-spacing: 0.5rem;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 40px;
}

h2 span {
  font-size: 0.5em;
  display: block;
}

h3 {
  font-size: 2.8rem;
  margin-bottom: 20px;
}

h4 {
  font-size: 2.4rem;
  letter-spacing: 0.1rem;
  margin-bottom: 20px;
}

h4 span {
  font-size: 0.9em;
}

h5 {
  font-size: 1.8rem;
  margin-bottom: 15px;
}

h6 {
  font-size: 1.6rem;
  margin-bottom: 10px;
}

/*END 見出し　基本設定*/

/*dl 基本設定*/
dl {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

dl dt {
  font-size: 1.3rem;
  width: 120px;
  margin-right: 20px;
}

dl dd {
  font-size: 1.3rem;
  width: calc(100% - 140px);
}

/*END dl 基本設定*/

/*li 基本設定*/
ol,
ul {
  list-style-position: inside;
  text-indent: -2.5em;
}

ol li,
ul li {
  font-size: 1.4rem;
  margin-left: 1.5em;
}

#ypro_wrapper .ypro_wrp_tab_button {
  text-indent: 0;
}

/*END li 基本設定*/

/*table 基本設定*/
table {
  border: 1px solid rgb(180, 180, 180);
}

table th,
table td {
  border: solid 1px rgb(180, 180, 180);
  vertical-align: middle;
  font-size: 1.2rem;
  padding: 5px 10px;
}

/*END table 基本設定*/

/*FLEXBOX 関連*/
.flexbox {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
}

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

/*2列レイアウト*/
.col2 .box,
.col2 .half-container {
  width: calc(50% - 30px);
  margin-right: 60px;
}

.col2 .box {
  margin-bottom: 60px;
}

.col2 .box:nth-of-type(2n),
.col2 .half-container:nth-of-type(2n) {
  margin-right: 0;
}

/*END 2列レイアウト*/

/*3列レイアウト*/
.col3 .box {
  width: calc((100% / 3) - 60px);
  margin-right: 90px;
  margin-bottom: 20px;
}

.col3 .box:nth-of-type(3n) {
  margin-right: 0;
}

/*END 3列レイアウト*/

/*4列レイアウト*/
.col4 {
  width: 100%;
  margin-bottom: 30px;
}

.col4 .box {
  width: calc(25% - 30px);
  margin-right: 40px;
  margin-bottom: 30px;
}

.col4 .box:nth-of-type(4n) {
  margin-right: 0;
}

.col4 .box img {
  width: 100%;
  height: calc(25vw - 55px);
  max-height: 205px;
  object-fit: cover;
  margin-bottom: 10px;
}

/*END 4列レイアウト*/

.col4 .box p {
  font-size: 1.2rem;
}

.col4 .box p.min {
  font-size: 1rem;
}

/*3:7のコンテンツ*/
.left-container {
  width: 300px;
  margin-right: 50px;
}

.right-container {
  width: calc(100% - 350px);
}

.right-container .info-container {
  margin-bottom: 60px;
}

.right-container .info-container .btn {
  font-size: 1.6rem;
}

/*END 3:7のコンテンツ*/
/*END FLEXBOX 関連*/

/*検索バー*/
.search-bar {
  width: calc(100% - 80px);
  max-width: 960px;
  margin: 30px auto 0;
  text-align: left;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.search-bar h4 {
  font-size: 1.8rem;
  font-weight: 600;
  letter-spacing: 0.6rem;
  position: relative;
  /*padding-bottom: 15px;*/
  background-color: #fff;
  margin: 0 45px 30px 0;
  padding: 10px 40px 8px;
}

/*.search-bar h4:after {
  content: "";
  width: 30px;
  height: 2px;
  background-color: rgb(170,170,170);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
}*/

.search-bar .container {
  width: 960px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 5px;
}

.info-circle {
  width: 180px;
  height: 180px;
  position: absolute;
  left: 50px;
  bottom: 140px;
  background-color: var(--main-color);
  text-align: center;
  z-index: 200;
  text-align: center;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
}

.info-circle p {
  font-size: 1.8rem;
  line-height: 1.5;
  color: #fff;
  margin-bottom: 0.2em;
}

.bestlate {
  display: inline-block;
  padding: 15px 40px;
  margin-right: 40px;
  background-color: #fff;
  font-size: 1.6rem;
  letter-spacing: 0.4rem;
  line-height: 1.5;
  font-weight: 600;
  text-align: center;
}

.search-bar h5 {
  font-size: 2.1rem;
  display: inline-block;
  padding: 0 0 5px;
  margin-bottom: 20px;
  font-weight: 700;
}

.obj_search {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  /*margin: 0 0 10px;
  padding: 0 0 10px;*/
}

.volume {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin: 0 20px 0 0;
  padding-right: 20px;
  border-right: 1px solid rgb(150, 150, 150);
}

.obj_search h3 {
  font-size: 1.5rem;
  text-align: left;
  margin: 0 0 5px;
}

.volume_info {
  display: flex;
  align-items: flex-end;
}

.volume_info p {
  font-size: 1.5rem;
  margin: 0 5px;
}

.obj_search select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  background-color: transparent;
  font-size: 1.5rem;
  padding: 5px 20px 5px 10px;
  color: var(--main-bk);
}

.obj_search select:focus {
  outline: none;
}

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

.select_wrapper {
  position: relative;
}

.select_wrapper::after {
  display: block;
  content: "";
  width: 5px;
  height: 5px;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 3px;
  transform: rotate(45deg);
  margin: auto 0;
}

.obj_search input[type="submit"] {
  font-family: '游明朝', 'Yu Mincho', '游明朝体', 'YuMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'ＭＳ Ｐ明朝', 'MS PMincho', serif;
  width: 100px;
  height: 30px;
  margin: 0 0 15px 20px;
  padding: 2px 0 2px 1px;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.2rem;
  transition: .2s ease-in-out;
  cursor: pointer;
  border: 1px solid rgb(100, 100, 100);
  background-color: transparent;
}

.obj_search input[type="submit"]:hover {
  color: var(--main-wh);
  background-color: var(--main-bk);
}

/*END 検索バー*/


/*ヒーローイメージ*/
.hero-image {
  width: 100%;
  height: 100vh;
  position: relative;
  background: no-repeat center center / cover;
  align-items: center;
  justify-content: center;
  margin-bottom: 70px;
}

.hero-image h1 {
  font-size: 7rem;
  line-height: 1;
  color: #fff;
  text-align: center;
  display: inline-block;
  letter-spacing: 0.5rem;
}

.hero-image h1 span {
  font-size: 0.4em;
  letter-spacing: 0.25rem;
  display: block;
}

/*END ヒーローイメージ*/

/*各ページ　タイトル　セクション*/
.title-wrapper {
  margin: 0 auto 40px;
}

.title-wrapper p {
  font-size: 1.6rem;
}

.news .title-wrapper p {
  font-size: 1.4rem;
}

.news .title-wrapper h1 {
  font-size: 2.4rem;
  font-weight: 600;
  margin-bottom: 5px;
}

.page.facility .title-wrapper {
  width: 100%;
  height: 98%;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 200;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.page.facility .title-wrapper h1,
.page.facility .title-wrapper h5 {
  color: var(--main-wh);
}

.page.facility .title-wrapper h1 {
  writing-mode: vertical-rl;
  font-feature-settings: normal;
  display: inline-block;
  font-weight: 700;
  font-size: 3.6rem;
}

.page.facility .title-wrapper .logotype {
  width: 75px;
  margin: 0 auto;
  transform: translateX(4%);
}

.title-wrapper .flexbox {
  align-items: flex-end;
}

.title-wrapper .flexbox p {
  font-size: 1.2rem;
  line-height: 1.5;
  margin-left: 15px;
  margin-bottom: 15px;
}

/*END 各ページ　タイトル　セクション*/

/*背景赤*/
.bg-red {
  background-color: var(--main-color);
  padding: 50px 0 60px;
  margin-bottom: 80px;
}

.bg-red .section:last-child {
  margin-bottom: 0;
}

.bg-red h1,
.bg-red h2,
.bg-red h3,
.bg-red h4,
.bg-red h5,
.bg-red h6,
.bg-red p,
.bg-red span,
.bg-red dl {
  color: var(--main-wh);
}

/*END 背景赤*/

/*INTERVIEW 記事ページ, プログラム　FV*/
.fv-wrapper {
  position: relative;
  margin-top: 80px;
  padding: 0;
  margin-bottom: 100px;
}

.fv-wrapper .section {
  max-width: 1060px;
  position: relative;
  left: 0;
  z-index: 100;
  padding-top: 100px;
}

.program .fv-wrapper {
  margin-top: 0;
}

.program .fv-wrapper .section {
  max-width: 900px;
}

.fv-wrapper .title-wrapper {
  margin: 0;
  padding: 0 20px 5px 0;
  display: inline-block;
}

.program .title-wrapper {
  margin-bottom: 0;
}

.fv-wrapper .info-container {
  width: 55%;
  padding: 30px 40px;
  background-color: var(--main-color);
}

.fv-wrapper .info-container h3,
.fv-wrapper .info-container p {
  color: var(--main-wh);
}

.fv-wrapper .info-container h3 {
  margin-bottom: 20px;
}

.fv-wrapper .info-container p:nth-last-of-type(1) {
  margin-bottom: 0;
}

.fv-wrapper .main-cover {
  width: 48%;
  min-width: 480px;
  height: calc(48vw * 0.66666);
  min-height: 350px;
  max-height: 480px;
  background: no-repeat center center / cover;
  position: absolute;
  top: 0;
  right: 0;
}

.program .fv-wrapper .main-cover {
  background-position: 28% center;
  background-size: 140%;
}

.single.interview .title-wrapper .num-company {
  display: flex;
  justify-content: flex-start;
  padding-top: 20px;
  margin-bottom: 15px;
}

.single.interview .title-wrapper .num-company .num {
  font-size: 7rem;
  line-height: 0;
  display: inline-block;
  margin-right: 10px;
}

.single.interview .title-wrapper .num-company h5 {
  font-size: 1.4rem;
  border-bottom: 1px solid var(--main-color);
}

.single.interview .title-wrapper h1 {
  display: inline-block;
  font-size: 3.6rem;
  letter-spacing: 0.4rem;
  margin-bottom: 18px;
}

.single.interview .title-wrapper .name {
  font-size: 2.8rem;
  letter-spacing: 0.4rem;
  position: relative;
  padding-left: 2.5em;
  margin-left: .25em;
}

.single.interview .title-wrapper .name span {
  display: inline-block;
  font-size: 0.7em;
}

.single.interview .title-wrapper .name:after {
  content: '';
  width: 2em;
  height: 1px;
  background-color: var(--main-color);
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto 0;
  position: absolute;
}

/*END INTERVIEW 記事ページ, プログラム　FV*/

/*記事ページ　本文*/
.main-container {
  margin: 0 auto 60px;
}

.single .main-container h3 {
  margin-bottom: 20px;
}

.single .main-container h4 {
  font-weight: 600;
  margin-top: 80px
}

.single .main-container video {
  width: 100%;
  margin-bottom: 15px;
}

.main-container p {
  margin-bottom: 1.25em;
}

.main-container h3:nth-of-type(n+2) {
  margin-top: 80px;
}

/*END 記事ページ　本文*/

/*記事ページ　プロフィールセクション*/
.single .profile-container {
  width: calc(100% - 80px);
  border-top: 1px solid var(--main-color);
  border-bottom: 1px solid var(--main-color);
  padding: 40px;
}

.single .profile-container .left-container {
  width: calc(100% - 450px);
}

.single .profile-container .right-container {
  width: 400px;
}

.single .profile-container .flexbox:nth-of-type(2) {
  margin-top: 30px;
}

/*END 記事ページ　プロフィールセクション*/

/*swiper関連*/
.room-list .swiper-container {
  margin-left: calc((100% - 800px) / 2);
}

.room-list .swiper-slide {
  aspect-ratio: 3/2;
  max-width: 800px;
  margin: 0 50px 0 0;
}

@media screen and (max-width: 880px) {
  .room-list .swiper-container {
    margin-left: 40px;
  }

  .room-list .swiper-slide {
    width: calc(100% - 175px);
    margin-right: 30px;
  }
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  top: 0;
  right: 35px;
  bottom: 0;
  z-index: 200;
  margin: auto 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  border-radius: 0;
  background-color: transparent;
  border: 1px solid var(--main-wh);
  border-radius: 50%;
  opacity: .7;
  margin: 10px 0;
}

.swiper-pagination-clickable .swiper-pagination-bullet.swiper-pagination-bullet-active {
  border-radius: 0;
  background-color: var(--main-wh);
  opacity: 1.0;
  border-radius: 50%;
}

/*END swiper関連*/

/*ページネーション*/
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 90px auto 120px;
}

.pagination .next-link {
  display: inline-block;
  width: 24px;
  margin-right: 30px;
  padding: 5px;
  position: relative;
  border: none;
}

.pagination .next-link:after {
  content: '';
  width: 24px;
  height: 8px;
  background: no-repeat left center / 24px 8px url(assets/img/svg/brdr-arrow-main-color.svg);
  transform: scale(-1, 1);
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto 0;
}

.pagination .prev-link {
  display: inline-block;
  width: 24px;
  margin-left: 30px;
  padding: 5px;
  position: relative;
  border: none;
}

.pagination .prev-link:after {
  content: '';
  width: 24px;
  height: 8px;
  background: no-repeat right center / 24px 8px url(assets/img/svg/brdr-arrow-main-color.svg);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto 0;
}

.pagination .next-link.hide,
.pagination .prev-link.hide {
  opacity: 0;
  pointer-events: none;
}

.pagination a,
.pagination span {
  display: inline-block;
  font-size: 1.2rem;
  text-indent: 0.2em;
  padding: 2px 2px;
  margin: 0 8px;
  border: none;
  color: var(--main-bk);
}

.pagination span.current {
  font-weight: normal;
  border-bottom: 1px solid var(--main-bk);
}

.single.news .pagination {
  justify-content: space-between;
}

.single.news .pagination .next-link,
.single.news .pagination .prev-link {
  font-size: 1.2rem;
  width: 130px;
  padding: 5px 40px;
  /*white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;*/
}

.single.news .pagination .next-link {
  padding-right: 0;
}

.single.news .pagination .prev-link {
  padding-left: 0;
  text-align: right;
}

.single.news .pagination .next-link:after,
.single.news .pagination .prev-link:after {
  bottom: 3px;
}

.single.news .pagination .back-btn {
  display: inline-block;
  font-size: 1.2rem;
  width: 100px;
  text-align: center;
}

/*END ページネーション*/

/*外部リンク　共通スタイル*/
.target-link {
  text-align: center;
  background-color: var(--main-color);
  padding: 40px 0 50px;
}

.target-link .info-container {
  padding: 0 40px;
}


.target-link h4,
.target-link h6,
.target-link p {
  color: var(--main-wh);
}

.target-link h4 {
  margin-bottom: 10px;
}

.target-link .btn-bl {
  margin-top: 20px;
}

/*END 外部リンク　共通スタイル*/

/*ヘッダー　共通　設定*/
header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

header .logo {
  width: 75px;
  position: absolute;
  top: 30px;
  left: 30px;
}

header .logo.hide {
  opacity: 0;
}

header .logo img {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  transition: .3s var(--st-easing);
}

header .logo img.hide {
  opacity: 0;
}

header .g-menu {
  width: calc(100% - 200px);
  display: flex;
  justify-content: flex-end;
  position: absolute;
  top: 50px;
  right: 110px;
  transition: .3s var(--st-easing);
  pointer-events: auto;
}

header .g-menu.hide {
  opacity: 0;
  pointer-events: none;
}

header .g-menu a {
  margin-left: 20px;
}

header .g-menu a p {
  font-size: 1.3rem;
  color: var(--main-bk);
  transition: .3s var(--st-easing);
}

header.hero-front .g-menu a p {
  color: var(--main-wh);
}

header .g-menu.bk a p {
  color: var(--main-bk);
}

header .menu-btn {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 40px;
  right: 30px;
  cursor: pointer;
}

header .menu-btn span {
  width: 40px;
  height: 1px;
  background-color: var(--main-wh);
  position: absolute;
  right: 5px;
  transition: .3s var(--st-easing);
  z-index: 600;
}

header .menu-btn p {
  position: absolute;
  left: 5px;
  bottom: 0;
  color: var(--main-wh);
  margin-bottom: 0;
  transition: .3s var(--st-easing);
}

header .menu-btn.bk span {
  background-color: var(--main-bk);
}

header .menu-btn span:nth-of-type(1) {
  top: 5px;
}

header .menu-btn span:nth-of-type(2) {
  width: 30px;
  bottom: 33px;
}

header .menu-btn.bk p {
  color: var(--main-bk);
}

header .menu-btn.active span {
  background-color: var(--main-wh);
}

header .menu-btn.active span:nth-of-type(1) {
  top: 9px;
  transform: rotate(-20deg);
}

header .menu-btn.active span:nth-of-type(2) {
  width: 40px;
  bottom: 40px;
  transform: rotate(20deg);
}

header .menu-btn.active p {
  opacity: 0;
  color: var(--main-wh);
}

.booking-btn {
  width: 210px;
  height: auto;
  position: fixed;
  left: 30px;
  bottom: 30px;
  background-color: var(--main-wh);
  border: 1px solid rgb(230, 230, 230);
  z-index: 1000;
  font-size: 1.2rem;
  color: var(--main-bk);
  cursor: pointer;
  transition: .3s var(--st-easing);
}

.booking-btn .booking-btn-wrapper {
  width: calc(100% - 40px);
  height: 100%;
  padding: 10px 20px 7px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  background-color: var(--main-wh);
  position: relative;
  transition: .3s var(--st-easing);
  z-index: 200;
}

.booking-btn span {
  width: 100%;
  border-bottom: 1px solid rgb(230, 230, 230);
  padding-top: 5px;
  padding-bottom: 10px;
  margin-bottom: 5px;
  text-align: center;
  line-height: 1;
  font-size: 1.2rem;
  letter-spacing: 0.2rem;
  position: relative;
  z-index: 100;
}

.booking-btn img {
  width: 17px;
  height: 17px;
  margin: 0 10px 0 0;
  mix-blend-mode: difference;
  position: relative;
  z-index: 100;
}

.booking-btn p {
  position: relative;
  z-index: 100;
  font-size: 1.5rem;
}

.booking-btn:hover {
  opacity: 1;
  border: 1px solid var(--main-bk);
  /* padding-top: 100px; */
}

.booking-btn:hover .booking-btn-wrapper {
  background-color: var(--main-bk);
}

.booking-btn:hover p,
.booking-btn:hover span {
  color: var(--main-wh);
}

.booking-btn .list {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--main-bk);
  pointer-events: none;
  opacity: 0;
  z-index: 100;
}

.booking-btn:hover .list {
  opacity: 1;
  transition: .3s var(--st-easing);
  background-color: rgb(100, 100, 100);
  pointer-events: auto;
}

.booking-btn .list a {
  display: block;
  width: 100%;
  height: 50px;
  color: #fff;
  letter-spacing: 0.6rem;
  text-align: center;
  font-size: 1.3rem;
  text-indent: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .3s var(--st-easing);
  position: relative;
}

.booking-btn .list a:nth-of-type(n + 2):after {
  content: '';
  width: calc(100% - 20px);
  height: 1px;
  border-top: 1px solid var(--main-wh);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  opacity: 0.15;
}

.booking-btn .list a:hover {
  background-color: var(--main-bk);
  opacity: 1;
}

.booking-btn .list:hover a:after {
  opacity: 0;
}

/*END ヘッダー　共通　設定*/

/*メニュー*/
.menu-wrapper {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 900;
  background-color: var(--main-color);
  overflow-y: scroll;
  opacity: 0;
  pointer-events: none;
  transition: .3s var(--st-easing);
  display: flex;
  justify-content: center;
  align-items: center;
}

.menu-wrapper.active {
  opacity: 1;
  pointer-events: auto;
}

.menu-wrapper .logo {
  width: 75px;
  position: absolute;
  top: 30px;
  left: 30px;
}

.menu-wrapper .menu-list {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin: 20vh auto;
  padding: 0;
}

.menu-wrapper .menu-list .box {
  width: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 0 150px 0 0;
}

.menu-wrapper .menu-list .box:nth-of-type(3) {
  margin-right: 50px;
}

.menu-wrapper .menu-list a {
  display: inline-block;
  color: var(--main-wh);
  font-size: 2.4rem;
  margin: 0 0 50px;
}

.menu-wrapper .menu-list .box a:nth-last-of-type(1) {
  margin-bottom: 0;
}

.menu-wrapper .menu-list a p {
  font-size: 2.4rem;
  line-height: 1.5;
  color: var(--main-wh);
  position: relative;
}

.menu-wrapper .menu-list a:hover {
  opacity: 1;
}

.menu-wrapper .menu-list a p:after {
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--main-wh);
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .4s var(--st-easing);
}

.menu-wrapper .menu-list a:hover p:after {
  transform-origin: left top;
  transform: scale(1, 1);
}

.menu-wrapper .menu-list a span {
  display: block;
  font-size: 1.3rem;
  line-height: 1.5;
}

/*END メニュー*/
/*END 共通css*/

/*個別css*/
/*frotnt-page*/
.top {
  width: 100%;
  height: 100vh;
  position: relative;
  top: 0;
  left: 0;
}

.top .logo {
  width: 9vw;
  position: absolute;
  top: 30px;
  left: 40px;
  z-index: 200;
  pointer-events: auto;
}

.top:after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  z-index: 150;
}

.page.facility .top:after {
  background-color: rgba(0, 0, 0, 0.3);
}

.swiper-container {
  height: 100%;
}

.swiper-container .swiper-slide {
  background: no-repeat center center / cover;
}

/*トップスライダー*/
.hero.top:after {
  display: none;
}

.hero.top .swiper-container .swiper-slide {
  overflow: hidden;
}

.hero.top .swiper-container .swiper-slide .image-container {
  width: 100%;
  height: 100%;
  background: no-repeat center center / cover;
  position: absolute;
  top: 0;
  left: 0;
}

/*.hero.top .swiper-container .swiper-slide.image1 .image-container {
  background-image: url(assets/img/top/slide/1.jpg);
}

.hero.top .swiper-container .swiper-slide.image2 .image-container {
  background-image: url(assets/img/top/slide/2.jpg);
}

.hero.top .swiper-container .swiper-slide.image3 .image-container {
  background-image: url(assets/img/top/slide/3.jpg);
}

.hero.top .swiper-container .swiper-slide.image4 .image-container {
  background-image: url(assets/img/top/slide/4.jpg);
}

.hero.top .swiper-container .swiper-slide.image5 .image-container {
  background-image: url(assets/img/top/slide/5.jpg);
}*/

@keyframes zoomUp {
  0% {
    transform: scale(1.05);
  }

  100% {
    transform: scale(1);
  }
}

.hero.top .swiper-container .swiper-slide.swiper-slide-active .image-container,
.hero.top .swiper-container .swiper-slide-duplicate-active .image-container,
.hero.top .swiper-container .swiper-slide-prev .image-container {
  animation: zoomUp 12s linear 0s 1 normal both;
  will-change: transform;
}

/*トップ動画埋め込み*/
.movie-modal {
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  overflow: hidden;
  position: absolute;
  /* fixed の場合。absolute でも同じ */
  right: 0;
  top: 0;
  z-index: 100;
}

.movie-modal iframe,
.movie-modal video {
  box-sizing: border-box;
  height: 56.25vw;
  /* 16:9 の高さなので 56.25% (= 9 ÷ 16) */
  left: 50%;
  min-height: 100%;
  min-width: 100%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 177.77777778vh;
  /* 16:9 の幅なので 177.77% (= 16 ÷ 9) */
}

.sns-flow {
  position: absolute;
  right: 40px;
  bottom: 40px;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.sns-flow a {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 0 15px;
}


.menu-wrapper .sns-flow {
  margin-top: 55px;
}

.menu-wrapper .sns-flow a {
  margin: 0 15px 0 0;
}

.sns-flow a img {
  margin: 0;
}

.menu-wrapper .sns-flow {
  position: static;
}

.infobar {
  position: absolute;
  left: 34px;
  bottom: 30px;
  position: absolute;
  z-index: 100;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}

.infobar h5,
.infobar p {
  display: inline-block;
  background-color: #fff;
  padding: 5px;
  line-height: 1;
}

.infobar h5 {
  margin-bottom: 12px;
}

.infobar p {
  font-size: 1.3rem;
}

.green-bk {
  background-color: #cbd3d6;
  padding: 50px 0 80px;
}

.green-bk .btn-wrapper {
  width: calc(100% - 40px);
  margin: 0 auto 40px;
}

.green-bk .btn-wrapper .btn-sq {
  width: calc(100% - 60px);
  padding: 15px 30px 10px;
  background-color: #fff;
  border: none;
  margin-top: 0;
}

.green-bk .btn-wrapper .btn-sq p {
  margin-top: 5px;
  padding-top: 5px;
  width: 100%;
  border-top: 1px solid rgba(0, 0, 0, 0.4);
  margin-bottom: 0;
}

.ryokoshien_intro {
  width: calc(100% - 80px);
  max-width: 960px;
  margin: 50px auto 60px;
  padding-top: 0px;
}

.ryokoshien_intro .pc_hide {
  display: none;
}

.ryokoshien_intro .sp_hide {
  display: block;
}

.news-intro {
  max-width: 520px;
  margin-bottom: 80px;
  margin-top: 40px;
}

.news-intro h3 {
  margin-bottom: 30px;
}

.concept-intro {
  padding: 60px 0 0px;
  margin-bottom: 120px;
}

.concept-intro h2,
.concept-intro p,
.concept-intro h3 {
  text-align: center;
  margin-bottom: 35px;
}

.concept-intro p {
  font-size: 1.6rem;
}

.concept-intro h2 {
  font-size: 4.7rem;
}

.concept-intro img {
  max-width: 100px;
  margin: 50px auto 0;
}

.news-intro .news-list a {
  border: none;
}

.about-intro {
  text-align: center;
  padding: 50px 0;
  background-color: var(--main-color);
}

.about-intro .section {
  margin: 0 auto;
}

.about-intro h2,
.about-intro p {
  color: var(--main-wh);
  margin-bottom: 30px;
}

/*front-page 各PROGRAM*/
.building-intro {
  align-items: stretch;
  margin-bottom: 80px;
}

.building-container {
  /* width: calc(100% / 3); */
  width: 100%;
  display: inline-block;
  position: relative;
}

.building-container .section {
  padding: 120px 0;
  width: calc(100% - 160px);
  max-width: 1100px;
  text-align: center;
  position: relative;
  z-index: 200;
  margin-bottom: 0;
}

.building-container h5 {
  margin-bottom: 30px;
}

.building-container h2,
.building-container h5 {
  color: var(--main-wh);
}

.building-container h2 {
  writing-mode: vertical-rl;
  font-feature-settings: normal;
  font-weight: 600;
  font-size: 2.8rem;
  letter-spacing: 0.5rem;
  margin: 0 auto 20px;
  display: block;
}

.building-container h5 {
  margin-bottom: 10px;
}

.building-container .section {
  position: relative;
  z-index: 100;
}

.building-container:after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
}

.building-container .section .logotype {
  width: 65px;
  margin: 0 auto 20px;
  transform: translateX(4%);
}

.building-container .image-cover {
  width: 100%;
  height: 100%;
  background: no-repeat center center / cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
}

.building-container.shinkan .image-cover {
  background-image: url(assets/img/top/shinkan-cover.jpg?var=220513);
}

.building-container.honkan .image-cover {
  background-image: url(assets/img/top/honkan-cover.jpg?var=220513);
}

.building-container.bekkan .image-cover {
  background-image: url(assets/img/top/bekkan-cover.jpg?var=221202);
}

/*END front-page 各BUILDING*/

.room-intro {
  width: 100%;
  margin: 40px 0 0;
}

.room-intro .section {
  padding-top: 0;
  width: calc(100% - 160px);
  max-width: 800px;
  display: flex;
  flex-wrap: wrap;
  padding-top: 80px;
}

.room-intro .section .info-container {
  width: 50%;
}

.room-link-list {
  margin: 80px 0 60px;
}

.room-link-list a {
  font-size: 2.1rem;
  display: block;
  margin-bottom: 20px;
}

.room-intro .image-cover {
  width: 50%;
  aspect-ratio: 1/1;
  background: no-repeat center center / cover url(assets/img/top/room-main.jpg);
}

.map-intro {
  margin-bottom: 120px;
}

.map-intro .g-map {
  width: calc(100vw - 80px);
  max-width: 800px;
  height: calc(72vw - 80px);
  max-height: 576px;
  position: relative;
  overflow: hidden;
}

.map-intro .g-map iframe {
  filter: grayscale(100);
  position: relative;
  z-index: 50;
  height: 100%;
  /* transform: translateY(-70px); */
}

.map-intro .g-map:after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: var(--main-color);
  mix-blend-mode: overlay;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  pointer-events: none;
}

.map-intro .btn-wrapper .btn-bl {
  width: calc((100% / 3) - 20px);
  max-width: 100%;
  margin-right: 30px;
}

.map-intro .btn-wrapper .btn-bl:last-child {
  margin-right: 0;
}

.map-intro .btn-wrapper .btn-bl.nolink {
  background-color: rgb(200, 200, 200);
  pointer-events: none;
}

.access-info {
  margin: 60px 0 0;
  padding: 0 30px;
  border-left: 1px solid var(--main-color);
}

.access-info h5,
.access-info p {
  color: var(--main-color);
}

.bnr-link-list .col2 h5 {
  color: var(--main-color);
  font-size: 1.3rem;
}

/*END front-page*/

.page,
.single {
  display: block;
  padding-top: 160px;
}

/*NEWS 一覧 共通のベース*/
.news-list a {
  font-size: 1.3rem;
  font-weight: 400;
  display: block;
  width: 100%;
  margin: 0 0 20px;
  color: var(--main-color);
  border-bottom: transparent;
}

.news-list a .cat-time {
  font-size: 1.2rem;
  letter-spacing: 0.1rem;
  display: block;
  line-height: 1;
}

.news-list a p {
  font-size: 1.5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 5px;
}

/*END NEWS 一覧 共通のベース*/

/*記事ページcss*/
/* NEWS 一覧ページ*/
.page.news .section .cat-list {
  margin: 60px 0 100px;
  text-indent: 0;
}

.page.news .section .cat-list li {
  display: inline-block;
  margin: 0;
}

.page.news .section .cat-list a {
  display: inline-block;
  line-height: 1.5;
  margin-right: 30px;
  padding-bottom: 2px;
  text-indent: 0.2em;
  color: var(--main-bk);
}

.page.news .section .cat-list .current-cat a {
  border-bottom: 1px solid var(--main-bk);
}

.page.news .section .news-list .box {
  margin-bottom: 120px;
}

.page.news .section .news-list .box:last-child {
  margin-bottom: 0;
}

/*END NEWS 一覧ページ*/

/*page facility*/
.page .top {
  margin-bottom: 50px;
}

.page.facility,
.page.plan {
  padding-top: 0;
}

.page.facility .hotel-concept p {
  text-align: center;
}

.page.facility .plan-list-wrapper .col3 .box {
  width: calc((100% / 3) - 30px);
  margin-right: 45px;
  position: relative;
}

.page.facility .plan-list-wrapper .col3 .box:after {
  content: "";
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  background-color: rgba(0, 0, 0, 0);
  border-radius: 2px;
  position: absolute;
  top: -10px;
  left: -10px;
  z-index: 100;
  transition: .3s var(--st-easing);
}

.page.facility .plan-list-wrapper .col3 .box:hover:after {
  background-color: rgba(0, 0, 0, 0.1);
}

.page.facility .plan-list-wrapper .col3 .box:nth-of-type(3n) {
  margin-right: 0;
}

.page.facility .plan-list-wrapper .col3 .box h6 {
  font-weight: 600;
  position: relative;
  z-index: 300;
}

.page.facility .plan-list-wrapper .col3 .box p {
  font-size: 1.3rem;
  line-height: 1.6;
  position: relative;
  z-index: 300;
}

.page.facility .plan-list-wrapper .col3 .box img {
  aspect-ratio: 3/2;
  object-fit: cover;
  object-position: center center;
  position: relative;
  z-index: 300;
}

.page.facility .room-wrapper h2 {
  margin-bottom: 40px;
}

.page.facility .room-list {
  overflow-x: hidden;
}

.page.facility .room-list .info-container h3 {
  display: inline-block;
}

.page.facility .room-list .info-container h3 span {
  display: block;
}

.page.facility .room-list .info-container .spec-list {
  border-top: 1px solid var(--main-bk);
  padding-top: 50px;
}

.page.facility .room-list .info-container .spec-list dl.box {
  border-bottom: 1px solid var(--main-bk);
  padding-bottom: 10px;
  margin-bottom: 20px;
}

.page.facility .room-list .info-container .spec-list dl dt {
  font-family: 'Helvetica', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  font-weight: 700;
  font-size: 1.6rem;
}

.page.facility .room-list .info-container .spec-list dl dd {
  font-family: 'Helvetica', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  margin-top: 2px;
}

.other-hotel-list .col2 .box {
  aspect-ratio: 4/2.5;
  background: no-repeat center center / cover;
  background-color: var(--main-bk);
}

.other-hotel-list .col2 .box.nolink {
  pointer-events: none;
}

.other-hotel-list .col2 .box h5 {
  writing-mode: vertical-rl;
  font-feature-settings: normal;
  text-align: left;
  color: var(--main-wh);
  margin: 23px 0 15px 12px;
}

.other-hotel-list .col2 .box p {
  color: var(--main-wh);
  margin-left: 10px;
}

/*END page facility*/

/*page plan*/
.page.plan .top:after {
  display: none;
}

.page.plan .top .swiper-slide:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 200;
  background-color: rgba(0, 0, 0, 0.3);
}

.page.plan .top .swiper-slide img {
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  object-fit: cover;
}

.page.plan .top .swiper-slide .inner {
  width: calc(100% - 160px);
  max-width: 960px;
  height: 98%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 300;
}

.page.plan .top .swiper-slide .inner h1 {
  font-size: 3.6rem;
  padding-bottom: 25px;
  position: relative;
  color: var(--main-wh);
}

.page.plan .top .swiper-slide .inner h1:after {
  content: '';
  width: 70px;
  height: 1px;
  background-color: var(--main-wh);
  position: absolute;
  left: 0;
  bottom: 0;
}

.page.plan .top .swiper-slide .inner h2 {
  font-size: 2.4rem;
  font-weight: 400;
  color: var(--main-wh);
}

.page.plan .top .swiper-slide .inner .btn {
  margin-bottom: 0;
  color: var(--main-wh);
}

.page.plan .top .swiper-slide .inner .btn:after {
  background-color: var(--main-wh);
}

.page.plan .select-tab.hotel {
  border-bottom: 1px solid var(--main-bk);
}

.page.plan .select-tab.hotel ul {
  list-style: none;
  text-indent: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

.page.plan .select-tab.hotel ul li {
  font-size: 1.4rem;
  margin: 0;
  padding: 10px 40px;
  border-radius: 2px 2px 0 0;
  cursor: pointer;
}

.page.plan .select-tab.hotel ul li.current {
  background-color: var(--main-bk);
  color: var(--main-wh);
}

.plan-list-container {
  position: relative;
}

.plan-list {
  display: none;
  position: relative;
  top: 0;
  left: 0;
  z-index: 100;
  opacity: 0;
  pointer-events: none;
  transition: .3s var(--st-easing);
}

.plan-list.current {
  display: block;
  opacity: 1;
  z-index: 200;
  pointer-events: auto;
}

.page.plan .plan-list .container {
  padding: 50px 0 30px;
}

.page.plan .plan-list .container h3 {
  font-weight: 600;
}

.page.plan .plan-list .container .btn {
  margin-bottom: 40px;
  color: var(--main-bk);
}

.page.plan .plan-list .container .btn:after {
  background-color: var(--main-bk);
}

.page.plan .plan-list .container:nth-of-type(2n) {
  background-color: var(--main-color);
}

.page.plan .plan-list .container:nth-of-type(2n) h3,
.page.plan .plan-list .container:nth-of-type(2n) p,
.page.plan .plan-list .container:nth-of-type(2n) .btn {
  color: var(--main-wh);
}

.page.plan .plan-list .container:nth-of-type(2n) .btn:after {
  background-color: var(--main-wh);
}

/*END page plan*/

/*page faq*/
.page.faq .faq-list-container {
  background-color: #eeeeef;
}

.page.faq .faq-list-container .faq-list {
  padding: 120px 0;
  margin-bottom: 0;
}

.page.faq .faq-list-container .box {
  margin-bottom: 60px;
}

.page.faq .faq-list-container .box:last-child {
  margin-bottom: 0;
}

.page.faq .faq-list-container .box h5 {
  font-weight: 600;
  margin-bottom: 5px;
}

/*END page faq*/


/*page MAP*/
.page.map .map-image {
  max-width: 960px;
}

.page.map .area-list {
  max-width: 760px;
}

.page.map .area-list .box {
  border-bottom: 1px solid var(--main-color);
  padding-bottom: 40px;
  margin-bottom: 80px;
}

.page.map .area-list .box:last-child {
  border-bottom: none;
}

.page.map .area-list .box h3 {
  font-weight: 600;
}

.page.map .area-list .box a {
  display: inline-block;
  margin-bottom: 2em;
}

/*END page MAP*/

/*page contact*/
.form-wrapper {
  padding: 40px 0;
}

.form-wrapper dl {
  margin-bottom: 40px;
}

.form-wrapper dl dt {
  width: 200px;
}

.form-wrapper dl dt h6 {
  margin-top: 5px;
  font-size: 1.4rem;
}

.form-wrapper dl dt h6 span {
  color: var(--main-color);
}

.form-wrapper dl dd {
  width: calc(100% - 220px);
}

input,
input.input-text,
textarea {
  width: calc(100% - 20px);
  font-size: 1.3rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid rgb(200, 200, 200);
  border-radius: 0;
  background-color: transparent;
  padding: 15px 10px;
  margin: 0;
}

/*_:lang(x)::-moz-placeholder, .contact-form .box.select p  {
  margin-top: 9px;
}

_:lang(x)+_:-webkit-full-screen-document, .contact-form .box.select p  {
  margin-top: 14px;
}*/

.form-wrapper .box.textarea .wpcf7-form-control-wrap {
  width: 100%;
}

input:focus {
  outline: 0;
}

textarea:focus {
  outline: 0;
}

input[type="radio"] {
  display: none;
}

.radio-btn .wpcf7-list-item {
  display: block;
  margin: 0 20px 10px 0;
}

.wpcf7-list-item-label {
  position: relative;
  padding-left: 25px;
  cursor: pointer;
}

.radio-btn .wpcf7-list-item-label:after {
  content: '';
  width: 15px;
  height: 15px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 2px;
  margin: auto 0;
  border: 1px solid rgb(200, 200, 200);
  border-radius: 50%;
}

.radio-btn .wpcf7-list-item-label:before {
  content: '';
  width: 5px;
  height: 5px;
  position: absolute;
  top: 0;
  left: 6px;
  bottom: 2px;
  margin: auto 0;
  background-color: rgb(130, 130, 130);
  border-radius: 50%;
  opacity: 0;
}

.radio-btn input[type=radio]:checked+.wpcf7-list-item-label:before {
  opacity: 1;
}

textarea {
  width: 100%;
  max-width: 100%;
  height: 150px;
  padding: 10px 20px;
  line-height: 2;
  box-sizing: border-box;
  border: 1px solid rgb(200, 200, 200);
  border-radius: 0;
  margin-bottom: 10px;
}

input[type="submit"] {
  width: auto;
  height: auto;
  letter-spacing: 0.2rem;
  font-size: 1.2rem;
  transition: color .3s;
  cursor: pointer;
  border: 1px solid var(--main-bk);
  border-radius: 0;
  padding: 12px 70px;
  display: inline-block;
  text-align: center;
  margin: 20px auto 0;
  background-color: var(--main-wh);
}

input[type="submit"]:hover {
  opacity: 1;
  background-color: rgb(240, 240, 240);
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output {
  width: calc(100% - 20px);
  text-align: center;
  margin-top: 40px;
}

.submit-wrapper {
  width: 100%;
  position: relative;
  text-align: center;
  border-top: 1px solid rgb(230, 230, 230);
  padding-top: 40px;
}

.wpcf7-spinner {
  position: absolute;
  top: 40px;
  right: 0;
}

.wpcf7-not-valid-tip {
  position: absolute;
  right: 0;
}

/*END page contact*/

/*FOOTER*/
footer {
  background-color: var(--main-color);
  padding: 120px 0 60px;
}

footer a,
footer p {
  color: var(--main-wh);
}

footer .btn.rv {
  margin-top: 25px;
}

footer .section {
  max-width: 1100px;
  padding: 0;
  margin-bottom: 0;
}

footer .section h5 {
  color: #fff;
  margin-bottom: 40px;
}

footer .section h6 {
  color: #fff;
  margin-bottom: 20px;
}

footer .section a {
  display: inline-block;
}

footer .section .col3 {
  margin-bottom: 40px;
}

footer .section .col3.add {
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

footer .section .link-list {
  margin-bottom: 100px;
}

footer .section .link-list a {
  display: block;
  font-size: 1.4rem;
  margin: 0;
}

footer .section .link-list .facility-list {

  margin-bottom: 10px;
}

footer .section .link-list .facility-list a {
  font-size: 1.2rem;
}

footer .section .sns-list {
  display: flex;
}

footer .section .sns-list h6 {
  margin: 0 15px 0 0;
}

footer .section .sns-list a {
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 0 15px;
}

footer .section .sns-list a img {
  margin: 0;
}

.copyright {
  width: 100%;
  text-align: right;
  font-size: 1.2rem;
}

.copyright p {
  font-size: 1.2rem;
  letter-spacing: 0.1rem;
  text-indent: 0.3rem;
}

#ypro_wrapper .box_calendar .ypro_tbl_cal tfoot .cal_mark li {
  margin-right: 1.5em;
}

/*END FOOTER*/

/* POLICY */
.page.policy h4 {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding-bottom: 5px;
}

.page.policy h5,
.page.policy h6 {
  font-weight: 800;
}

.page.policy .wp-block-separator {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 0;
}

/* POLICY */

/*footer*/
@media screen and (max-width: 1100px) {
  footer .section .col2 {
    flex-direction: column-reverse;
  }

  footer .section .col2 .left-container,
  footer .section .col2 .right-container {
    width: 100%;
    display: flex;
    justify-content: center;
  }

  footer .section .col2 .left-container {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  footer .section .col2 .col3 .box ul:nth-last-of-type(1) {
    margin-bottom: 0;
  }
}

/*END footer*/

@media screen and (max-width: 1000px) {

  /*INTERVIEW 記事ページ, プログラム　FV*/
  .fv-wrapper {
    margin-bottom: 40px;
  }

  .fv-wrapper .section {
    padding-top: 70px;
    margin-bottom: 40px;
  }

  .fv-wrapper .main-cover {
    width: calc(100% - 120px);
    height: 350px;
    min-height: initial;
    margin-left: 120px;
    position: static;
  }

  .single.interview .fv-wrapper .main-cover {
    height: calc((100vw - 120px) * 0.6);
  }

  .fv-wrapper .info-container {
    width: 70%;
    margin: 0 auto;
  }

  .program .fv-wrapper .main-cover {
    width: 100%;
    margin-top: 0;
    background-position: center center;
    background-size: cover;
    margin-left: 0;
    position: absolute;
  }

  .program .fv-wrapper .section {
    width: 100%;
    padding-top: 410px;
    margin-top: 35px;
    margin-bottom: 0;
  }

  /*END INTERVIEW 記事ページ, プログラム　FV*/
}

/*全ipad用CSS*/
@media screen and (max-width: 1024px) {

  /*front program*/
  .program-container .section {
    width: calc(100% - 80px);
    margin-bottom: 30px;
  }

  .program-container .section .info-container {
    width: calc(50% - 40px);
  }

  .program-container.lab .section .info-container {
    margin-left: calc(50% + 40px);
  }

  .program-container .section .info-container h2 {
    letter-spacing: 0.2rem;
  }

  /*.program-container .section .info-container h2 br {
    display: none;
  }*/
  /*END front program*/

  /*front page*/
  @media screen and (orientation: portrait) {
    br.pc-hide {
      display: block;
    }

    .top .fv-cover {
      background: no-repeat center center / 100% 100% url(assets/img/top/tab-illust/bg.png);
      position: relative;
    }

    .top .fv-cover span {
      display: block;
      width: 100%;
      height: 100%;
      background: no-repeat center center / contain;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 100;
    }

    .top .fv-cover span:nth-of-type(1) {
      background-image: url(assets/img/top/tab-illust/top.png);
      background-position: center top;
    }

    .top .fv-cover span:nth-of-type(2) {
      background-image: url(assets/img/top/tab-illust/center.png);
      background-position: center 45%;
    }

    .top .fv-cover span:nth-of-type(3) {
      background-image: url(assets/img/top/tab-illust/bottom.png);
      background-position: center bottom;
    }
  }

  /*END front page*/
}

/*END 全ipad用CSS*/

@media screen and (max-width: 1040px) {
  .bestlate {
    display: block;
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
    padding: 8px 30px;
  }

  .bestlate br {
    display: none;
  }

  .search-bar h4 {
    font-size: 1.5rem;
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    padding: 3px 0;
    text-align: center;
  }

  .obj_search {
    width: 100%;
    flex-wrap: wrap;
  }

  .obj_search input[type="submit"] {
    width: 200px;
    height: 40px;
    margin: 30px auto 10px;
  }
}

@media screen and (max-width: 1000px) {

  /*menu*/
  .menu-wrapper {
    align-items: flex-start;
  }

  .menu-wrapper .menu-list {
    width: calc(100% - 200px);
    flex-direction: column;
    margin: 170px auto 150px;
  }

  .menu-wrapper .menu-list .box {
    margin-right: 0;
    margin-bottom: 50px;
  }

  /*END menu*/
}

@media screen and (max-width: 960px) {
  header .g-menu {
    display: none;
    pointer-events: none;
  }
}

/*タブレット用CSS*/
@media screen and (max-width: 834px) {
  h2 {
    font-size: 3.2rem;
  }

  h3 {
    font-size: 2.6rem;
  }

  h4 {
    font-size: 2.1rem;
  }

  /*btn*/
  .btn-sq,
  .btn-bl {
    padding: 10px 0;
  }

  .page.lab .mission-vision-wrapper .btn-sq,
  .page.lab .mission-vision-wrapper .btn-bl {
    padding: 15px 0;
  }

  .page.lab .mission-vision-wrapper .btn-bl {
    padding: 30px 0;
  }

  /*END btn*/

  /*title-wrapper*/
  .title-wrapper {
    margin-bottom: 60px;
  }

  .page.facility .title-wrapper .logotype {
    transform: translateX(6%);
  }

  /*flexbox*/
  .col3 .box {
    width: calc(50% - 30px);
    margin-right: 60px;
    margin-bottom: 60px;
  }

  .col3 .box:nth-of-type(3n) {
    margin-right: 60px;
  }

  .col3 .box:nth-of-type(2n) {
    margin-right: 0;
  }

  /*END flexbox*/

  /*swiper*/
  .front .company-list .swiper-slide {
    width: 500px;
  }

  .front .company-list .swiper-slide img,
  .front .company-list .swiper-slide .info-container {
    width: 100%;
    margin-right: 0;
  }

  /*END swiper*/

  /*.building-container .section .logotype {
    transform: translateX(6%);
  }*/

  /*front-page */

  .building-container .section {
    padding: 60px 0;
    width: calc(100% - 100px);
  }

  .building-container .section h2 {
    font-size: 2.4rem;
    margin-bottom: 0;
  }

  /*ABOUT PAGE*/
  .about .concept-wrapper p br {
    display: none;
  }

  .about .support-wrapepr .box {
    width: calc(50% - 30px);
    margin-right: 60px;
  }

  .about .support-wrapepr .box:nth-of-type(3n) {
    margin-right: 60px;
  }

  .about .support-wrapepr .box:nth-of-type(2n) {
    margin-right: 0;
  }

  /*END ABOUT PAGE*/

  /*HUB PAGE*/
  .target-link p {
    text-align: left;
  }

  .target-link p br {
    display: none;
  }

  /*END HUB PAGE*/

  .relation-list.col3 .box {
    width: calc((100% / 3) - 60px);
    margin-right: 90px;
    margin-bottom: 20px;
  }

  .relation-list.col3 .box:nth-of-type(3n) {
    margin-right: 0;
  }

  /*company 共通*/
  .company-list .box .info-container h4 br {
    display: none;
  }

  /*END company 共通*/

  /*interview 共通*/
  .interview-list .box .info-container h4 {
    text-align: justify;
  }

  .interview-list .box .info-container .num-company h5 {
    font-size: 1.2rem;
    letter-spacing: 0.1rem;
    transform: translateY(2px);
  }

  /*END interview 共通*/

  /* 記事ページ*/
  .single .profile-container .left-container {
    width: calc(100% - 300px);
  }

  .single .profile-container .right-container {
    width: 250px;
  }

  .single .profile-container .left-container p {
    font-size: 1.3rem;
  }

  /* 記事ページ*/

  /*footer*/
  footer .section .col2 .col3 .box {
    margin-right: 30px;
  }

  /*END footer*/

  @supports not (aspect-ratio: 3/2) {
    .page.facility .plan-list-wrapper .col3 .box img {
      height: calc((((100vw - 80px) * 0.72) / 3) - 30px);
    }

    .room-list .swiper-slide {
      height: calc(72vw - 175px);
    }
  }
}

/*END タブレット用CSS*/

/*スマホ用CSS*/
@media screen and (max-width: 480px) {
  br.sp-only {
    display: block;
  }

  .bg-red {
    padding: 10px 0;
    margin-bottom: 20px;
  }

  .section {
    width: calc(100% - 60px);
    margin-bottom: 60px;
  }

  p {
    letter-spacing: 0.1rem;
  }

  h2 {
    font-size: 3rem;
    letter-spacing: 0.2rem;
  }

  h3,
  h4,
  h5,
  h6 {
    letter-spacing: 0.1rem;
  }

  h3 {
    font-size: 2.4rem;
  }

  .single h3 {
    font-size: 2.1rem;
  }

  .single h4,
  .interview-list .box .info-container h4,
  .company-list .box .info-container h4 {
    font-size: 1.9rem;
  }

  .single h5 {
    font-size: 1.7rem;
  }

  .products-list .box .info-container h5 {
    font-size: 1.6rem;
  }

  .single h6 {
    font-size: 1.4rem;
  }

  .btn-bl {
    max-width: 100%;
  }

  .booking-btn {
    width: 150px;
    left: 20px;
    /*right: 0;*/
    bottom: 28px;
    margin: 0 auto;
  }

  .booking-btn p {
    font-size: 1.2rem;
  }

  .info-circle {
    width: 140px;
    height: 76px;
    left: auto;
    right: 0;
    bottom: 28px;
    margin: 0 auto;
    border-radius: 0;

  }

  .info-circle p {
    font-size: 1.4rem;
    margin-bottom: 0;
  }

  /*title-wrapper*/
  .title-wrapper {
    margin-bottom: 30px;
  }

  .title-wrapper p {
    margin-bottom: 0;
  }

  .title-wrapper .flexbox {
    display: block;
  }

  .title-wrapper .flexbox p {
    margin-left: 0;
  }

  .single.products .title-wrapper h6 {
    margin-bottom: 20px;
  }

  .news .title-wrapper h1 {
    font-size: 2.1rem;
  }

  /*END title-wrapper*/

  /*flexbox*/
  .col2 .box,
  .col3 .box {
    width: 100%;
    margin-right: 0;
  }

  .col2 .box,
  .col3 .box {
    margin-bottom: 20px;
  }

  .col3 .box:nth-of-type(3n) {
    margin-right: 0;
  }

  /*END flexbox*/

  /*header*/
  header .menu-btn {
    right: 15px;
  }

  .top .sns-flow {
    bottom: auto;
    right: 90px;
    top: 45px;
  }

  /*END header*/

  /*menu*/
  .menu-wrapper .menu-list {
    width: calc(100% - 80px);
    margin-bottom: 250px;
  }

  .menu-wrapper .menu-list .box {
    margin-bottom: 20px;
  }

  .menu-wrapper .menu-list a {
    margin-bottom: 20px;
  }

  .menu-wrapper .menu-list a p {
    font-size: 2.1rem;
  }

  .menu-wrapper .sns-flow a {
    margin-bottom: 0;
  }

  /*END menu*/

  /*swiper*/
  .swiper-pagination {
    right: 20px;
  }

  /*END swiper*/

  .target-link .info-container {
    padding: 0 30px;
  }

  .target-link .info-container h4,
  .target-link .info-container h6,
  .target-link .info-container p {
    display: inline-block;
    width: 100%;
  }

  /*TOP*/
  .top {
    /*min-height: 720px;*/
    /*margin-bottom: 20px;*/
  }

  .top .fv-cover {
    background: no-repeat center center / 100% 100% url(assets/img/top/sp-illust/bg.png);
    position: relative;
  }

  .top .fv-cover span:nth-of-type(1) {
    background-image: url(assets/img/top/sp-illust/top.png);
    background-position: center top;
  }

  .top .fv-cover span:nth-of-type(2) {
    background-image: url(assets/img/top/sp-illust/center.png);
    background-position: center 50%;
  }

  .top .fv-cover span:nth-of-type(3) {
    background-image: url(assets/img/top/sp-illust/bottom.png);
  }

  .top .fv-cover.small span:nth-of-type(1) {
    background-image: url(assets/img/top/sp-illust-small/top.png);
    background-position: center top;
  }

  .top .fv-cover.small span:nth-of-type(2) {
    background-image: url(assets/img/top/sp-illust-small/center.png);
    background-position: center 40%;
  }

  .top .fv-cover.small span:nth-of-type(3) {
    background-image: url(assets/img/top/sp-illust-small/bottom.png);
  }

  .top .logo {
    width: 80px;
    left: 32px;
  }

  .top .catchcopy {
    height: 100%;
  }

  .top .catchcopy .logo {
    width: 110px;
    margin-bottom: 0;
  }

  .top .catchcopy h2 {
    font-size: 2.7rem;
    line-height: 1.25;
    margin-left: 5px;
  }

  .top .catchcopy p {
    font-size: 1.4rem;
    line-height: 1.5;
  }

  .ryokoshien_intro {
    width: calc(100% - 80px);
    margin: 0 auto;
  }

  .ryokoshien_intro .pc_hide {
    display: block;
  }

  .ryokoshien_intro .sp_hide {
    display: none;
  }

  .infobar {
    left: 20px;
    bottom: 40px;
  }

  .green-bk {
    margin-bottom: 30px;
  }

  .search-bar {
    width: calc(100% - 40px);
  }

  .search-bar .container {
    width: 100%;
  }

  .obj_search {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .volume {
    margin-bottom: 20px;
    margin-right: 10px;
    padding-right: 10px;
  }

  .volume:nth-of-type(2) {
    border: none;
    margin-right: 0;
    padding-right: 0;
  }

  .obj_search input[type="submit"] {
    height: auto;
    margin: 0 auto;
    border-top: 1px solid rgb(150, 150, 150);
    width: 100%;
    margin-top: 10px;
    padding: 20px 0;
    color: var(--main-bk);
  }

  .obj_search input[type="submit"]:hover {
    color: var(--main-bk);
    background-color: var(--main-wh);
  }

  .concept-intro {
    padding: 0;
    margin-bottom: 0;
  }

  .concept-intro h2 {
    font-size: 2.8rem;
    letter-spacing: 0rem;
  }

  .concept-intro p,
  .about-intro p {
    text-align: justify;
  }

  .concept-intro p br,
  .about-intro p br {
    display: none;
  }

  .about-intro {
    padding: 40px 0;
  }

  .building-container {
    width: 100%;
  }

  .building-container .section {
    padding: 60px 0;
    width: calc(100% - 160px);
  }

  .building-container .section h2 {
    font-size: 2.6rem;
  }

  .room-intro {
    margin: 20px 0 40px;
  }

  .room-intro .section {
    width: calc(100% - 80px);
    margin-bottom: 0;
    padding-top: 40px;
  }

  .room-intro .section .info-container {
    width: 100%;
  }

  .room-link-list {
    margin-top: 40px;
  }

  .room-intro .image-cover {
    width: 100%;
  }

  .map-intro .g-map {
    width: 100%;
    height: 72vw;
    margin-bottom: 20px;
  }

  .map-intro .btn-wrapper .btn-bl {
    width: 100%;
    margin: 0 0 20px;
  }

  .map-intro .btn-wrapper .btn-bl:last-child {
    margin-bottom: 0;
  }

  /*END TOP*/

  /*Nplan page*/
  .page.plan .top .swiper-slide .inner {
    width: calc(100% - 80px);
    padding-right: 20px;
  }

  .page.plan .top .swiper-slide .inner h1 {
    font-size: 2.8rem;
  }

  .page.plan .top .swiper-slide .inner h2 {
    font-size: 2.1rem;
  }

  .page.plan .select-tab.hotel ul li {
    font-size: 1.3rem;
    padding: 8px 25px;
  }

  .page.plan .plan-list .container {
    padding: 20px 0 10px;
  }

  /*END plan page*/

  /*facility page*/
  .page.facility .title-wrapper .logotype {
    width: 65px;
  }

  .page.facility .plan-list-wrapper .col3 .box {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }

  .page.facility .room-list .info-container .spec-list dl.box {
    margin-bottom: 10px;
  }

  .room-list .swiper-container {
    margin-left: 30px;
  }

  /*END facility page*/

  /*NEWS page*/
  .page.news .section .cat-list {
    margin: 30px 0 50px;
  }

  .page.news .section .title-wrapper .cat-list a {
    margin: 0 20px 20px 0;
  }

  .page.news .news-list {
    margin-top: 40px;
  }

  .page.news .section .news-list .box {
    margin-bottom: 60px;
  }

  .main-container {
    margin-bottom: 30px;
  }

  .pagination {
    margin-bottom: 80px;
  }

  .single.news .pagination .next-link,
  .single.news .pagination .prev-link,
  .single.news .pagination .back-btn {
    letter-spacing: 0;
  }

  /*END NEWS page*/

  /*記事ページ*/
  .single .main-container h3 br {
    display: none;
  }

  .single .main-container h3:nth-of-type(n+2),
  .single .main-container h4 {
    margin-top: 40px;
  }

  .single .profile-container {
    width: calc(100% - 40px);
    padding: 40px 20px;
  }

  .single .profile-container .flexbox {
    flex-direction: column-reverse;
  }

  .single.company .profile-container .flexbox:nth-of-type(2) {
    margin-top: 40px;
  }

  .single .profile-container .left-container,
  .single .profile-container .right-container {
    width: 100%;
    margin-right: 0;
  }

  .other-post-slide .swiper-slide,
  .single.interview .other-post-slide .swiper-slide {
    width: calc(100% - 100px);
    margin: 0 15px;
  }

  .other-post-slide .swiper-slide img {
    height: calc((100vw - 100px) * 0.6666);
  }

  .interview-list .box .info-container .num-company h5 {
    font-size: 1.1rem;
    letter-spacing: 0rem;
    transform: translateY(4px);
  }

  /*END 記事ページ*/

  /*page conatct*/
  .form-wrapper dl {
    margin-bottom: 20px;
  }

  .form-wrapper dl dt {
    width: 100%;
    margin: 0;
  }

  .form-wrapper dl dt h6 {
    font-size: 1.6rem;
  }

  .form-wrapper dl:nth-of-type(1) dt h6 {
    margin-bottom: 20px;
  }

  .form-wrapper dl dd {
    width: 100%;
    margin: 0;
  }

  input.input-text,
  textarea {
    font-size: 1.6rem;
  }

  /*END page conatct*/

  /*page FAQ*/
  .page.faq .faq-list-container .faq-list {
    padding: 60px 0 30px;
  }

  .page.faq .faq-list-container .box {
    margin-bottom: 30px;
  }

  /*END page FAQ*/

  /*page MAP*/
  .page.map .area-list .box {
    padding-bottom: 20px;
    margin-bottom: 40px;
  }

  /*END page MAP*/

  /*footer*/
  footer {
    padding: 40px 0 120px;
  }

  footer .btn.rv {
    margin-top: 15px;
    margin-bottom: 20px;
  }

  footer .section .col3 {
    margin-bottom: 0;
  }

  footer .section .col3.add {
    padding-bottom: 20px;
    margin-bottom: 40px;
  }

  footer .section .col3 .box {
    margin-bottom: 20px;
  }

  footer .section .link-list {
    margin-bottom: 50px;
  }

  footer .section .col3 .box.sns-list {
    margin-bottom: 40px;
  }

  footer .section .sns-list h6 {
    font-size: 1.2rem;
    margin-right: 5px;
  }

  footer .section .sns-list a {
    width: 20px;
    height: 20px;
  }

  .copyright {
    text-align: center;
  }

  .copyright p {
    font-size: 1rem;
  }

  /*END footer*/

  @supports not (aspect-ratio: 3/2) {
    .page.facility .plan-list-wrapper .col3 .box img {
      height: calc(72vw - 60px);
    }

    .room-list .swiper-slide {
      width: calc(100vw - 80px);
      height: calc(72vw - 80px);
    }
  }
}

/*END スマホ用CSS*/