body {
  font-family: YuMincho, /* Mac用 */ "Yu Mincho", /* Windows用 */ serif;
  background-image: url(../img/bg.jpg);
  background-repeat: repeat-y;
  margin-bottom: 75px;
  letter-spacing: 0.05em;
}
/* main{
  background-image: url(img/bg.jpg);
  background-repeat: repeat-y;
  margin-bottom: 75px;
} */
.header_container {
  padding: 40px 6% 50px;
  margin: auto;
  position: relative;
  display: flex;
  align-items: center;
  height: 50px;
}
.tel {
  display: flex;
  align-items: flex-start;
  font-size: 18px;
  color: #fff;
}
.tel img {
  width: 20px;
  margin-right: 10px;
}
.tel span {
  margin: 0px 15px;
}
.top-img {
  width: 200px;
  position: absolute;
  left: 49%;
}
.top {
  background-image: url(../img/top/main-visual.jpg);
}
.top-message {
  position: absolute;
  right: 17%;
  writing-mode: tb-rl;
  color: #fff;
  letter-spacing: 3px;
  font-weight: bolder;
}
.row1 {
  font-size: 18px;
  letter-spacing: 8px;
}
.s,
.section-message p,
.room_menu a,
.room_txt p,
.room_txt table th,
.room_txt table td,
.room_txt table,
.room_menu a,
.tool_list p,
.party_txt,
.hole_txt2,
.chk_out,
.chk_in {
  font-size: 16px;
}
.tawara {
  font-size: 18px;
}
.s {
  letter-spacing: 2px;
}
.row2 {
  top: 15px;
  position: relative;
  right: 35px;
}
.row3 {
  top: 30px;
  position: relative;
  right: 76px;
}
.row4 {
  top: 15px;
  position: relative;
  right: 124px;
}
.row5 {
  top: 30px;
  position: relative;
  right: 172px;
}
.second-top {
  background-image: url(../img/top/lead.jpg);
}
.second-top p {
  font-weight: 600;
}
.main_container {
  padding: 140px 6% 0px;
  margin: auto;
}
.second-top p {
  text-align: center;
  font-size: 20px;
  line-height: 36px;
  color: #fff;
}
.b {
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
}
section img {
  width: 100%;
}
.section-message {
  padding-top: 60px;
}
.stripe {
  margin-left: 100px;
  width: 1px;
  height: 43px;
  background-color: #000;
  margin: auto;
}
.sec_title {
  text-align: center;
  padding: 120px 0px 0px 0px;
}
.sec_title h1 {
  margin: auto;
  padding-top: 20px;
  writing-mode: tb-rl;
  letter-spacing: 10px;
  font-weight: 600;
}
.section-message h2 {
  font-size: 26px;
  line-height: 47px;
  margin-bottom: 40px;
  letter-spacing: 2px;
  font-weight: 600;
}
.section-message p {
  line-height: 30px;
  letter-spacing: 1px;
}
.section_box {
  display: flex;
  max-width: 900px;
  margin: auto;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 80px;
}
.button {
  display: block;
  position: relative;
  border: 1px solid rgb(190, 190, 190);
  padding: 16px 60px 14px 20px;
  display: flex;
  text-decoration: none;
}
.button span {
  content: " ";
  width: 7px;
  height: 7px;
  border: 0px;
  border-top: solid 1px #000;
  border-right: solid 1px #000;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  right: 20px;
  margin-top: 3px;
}
.img_box {
  display: flex;
}
.img_box img {
  width: 25%;
}
.onsen,
.stay {
  position: relative;
  overflow: hidden;
}
.accent-box {
  position: absolute;
  right: -150px;
  top: 200px;
  width: 550px;
  margin-left: auto;
}
.reserved {
  text-align: center;
  margin-top: 165px;
  margin-bottom: 120px;
}
footer {
  border-top: 1px solid #cbcbcb;
  padding: 0px 6%;
  margin: auto;
}
.footer_container {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}
.footer_container > nav {
  width: 60%;
}
.navigation {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
  gap: 20px 60px;
}
.copy {
  font-size: 12px;
  line-height: 1.5em;
}
.accent_sec {
  width: 1300px;
  margin: 0 auto 100px;
}
.onsen_sec {
  overflow-x: hidden;
}
.section_con {
  margin-top: -200px;
}
.top_img {
  background-repeat: no-repeat;
  background-size: cover;
  height: 65vh;
  width: 100%;
}

.top_div {
  width: fit-content;
  margin: auto;
}
.top_head_img {
  margin-top: 40px;
  width: 200px;
}
.top_img div h1 {
  writing-mode: vertical-rl;
  margin: auto;
  text-align: center;
  letter-spacing: 3px;
  margin-top: 80px;
  color: #fff;
  font-size: 20px;
}
.footer_ttl {
  display: block;
  font-size: 20px;
  margin-bottom: 20px;
}
.footer_add {
  font-size: 16px;
  margin-bottom: 10px;
}
.footer_tel {
  font-size: 16px;
}
.onsen_sec,
.stay_sec {
  overflow-x: hidden;
}
.reserved_ttl {
  font-size: 24px;
  margin-bottom: 35px;
  font-weight: 600;
}
.reserved_txt {
  font-size: 18px;
  line-height: 40px;
  margin-bottom: 35px;
}
.reserved_tel {
  font-size: 40px;
  margin-bottom: 5px;
}
.reserved_time {
  font-size: 16px;
  margin-bottom: 20px;
}
.reserved_fax {
  font-size: 20px;
}
.nav_mobile {
  display: none;
}

/* spa.html */

.spa_top {
  background-image: url(../img/main-spa.jpg);
}
.acc_left {
  float: left;
  position: absolute;
  top: 61vh;
  left: -100px;
  z-index: 2000;
}
.acc_right {
  float: right;
  position: relative;
  right: -100px;
  z-index: 2000;
}
.page_top {
  overflow-x: hidden;
}
.page_top p {
  padding-top: 210px;
  text-align: center;
  font-size: 20px;
  line-height: 35px;
  letter-spacing: 8px;
  font-weight: 600;
}
.fee {
  display: flex;
  margin: 100px 10% 0px;
}
.fee img {
  width: 600px;
}
.fee table {
  margin-bottom: 20px;
  margin-top: 90px;
}
.fee table th {
  border: 1px solid #707070;
  padding: 10px 35px;
}
.fee table td {
  border: 1px solid #707070;
  padding: 10px 35px 10px 110px;
}
.fee p {
  line-height: 30px;
}
.fee_table {
  margin-right: 80px;
}
.spa_img {
  width: 100%;
}
/* bedrock.html */
.bedrock_top {
  background-image: url(../img/main-bedrock.jpg);
}
.rock_sec,
.restaurant_sec,
.hole_sec {
  margin-bottom: 60px;
}
.rock_sec h1,
.restaurant_sec h1,
.hole_sec h1 {
  writing-mode: tb-rl;
  margin: auto;
  padding-top: 20px;
  writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 10px;
  font-weight: 600;
}
.effect {
  display: flex;
  margin: auto;
  justify-content: center;
}
.effect p {
  border: 1px solid #707070;
  padding: 10px 25px;
  margin-right: 35px;
  font-weight: 600;
}
.bedrock section {
  margin-bottom: 110px;
}
.rock_fee {
  text-align: center;
  font-size: 26px;
  margin-bottom: 5px;
}
.rock_fee_biko {
  text-align: center;
  font-size: 14px;
}
.rock_count {
  display: flex;
  justify-content: center;
}
.rock_count img {
  width: 40%;
}
.count_title {
  font-size: 26px;
  margin-bottom: 40px;
  font-weight: 600;
}
.count_txt {
  font-size: 15px;
  line-height: 30px;
}
/* room.html */
.room_top {
  background-image: url(../img/main-room.jpg);
}
.room_time {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 80px 0px;
}
.chk {
  padding: 25px 15px;
  border: 1px solid #ddd;
  text-align: center;
}
.chk_time {
  font-size: 20px;
}
.room_time .span1 {
  border-top: solid 1px #707070;
  border-right: solid 1px #707070;
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
  margin-left: 30px;
}
.room_time .span2 {
  border-top: solid 1px #707070;
  border-right: solid 1px #707070;
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
  margin-right: 30px;
}
.room_table {
  margin: 0 auto;
  margin-bottom: 80px;
  width: 80%;
  max-width: 800px;
}
.room_table .room_table-block {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 20px 40px;
  line-height: 1.5em;
}
.room_table .room_table-block:nth-child(odd) {
  background-color: #f1eee6;
}
.room_table dt {
  width: 200px;
  font-weight: 600;
}
.room_table dd {
  flex: 1;
}

.room_img {
  display: flex;
  width: 100%;
}
.room_img1,
.room_img2 {
  width: 50%;
}
.room_menu_box {
  overflow-x: hidden;
}
.room_con {
  position: relative;
}
.room_menu {
  height: 300px;
}
.room_menu_txt {
  position: relative;
  top: 225px;
  z-index: 1200;
  display: flex;
  justify-content: center;
  margin-right: -400px;
  width: 60%;
  flex-wrap: wrap;
  line-height: 40px;
  margin: auto;
}
.room_menu a {
  display: flex;
  margin: 0px 30px;
  text-decoration: none;
  color: #000;
  align-items: center;
}
.room_menu a span {
  font-size: 8px;
  margin-left: 5px;
}
.room_menu .other_room {
  position: relative;
  top: 250px;
}
.room_box,
.party_box {
  display: flex;
  justify-content: center;
  align-items: center;
}
.room_txt h1 {
  font-size: 26px;
  margin-bottom: 40px;
  width: 400px;
  font-weight: 600;
}
.room_txt p {
  line-height: 32px;
  width: 400px;
  margin-bottom: 20px;
}
.room_txt table th {
  text-align: center;
  width: 150px;
}
.room_txt table td {
  width: 350px;
}
.room_txt table th,
.room_txt table td {
  border: 1px solid #707070;
  vertical-align: middle;
  padding: 10px 10px;
  line-height: 20px;
}
.room_sec {
  width: 90%;
  margin: auto;
  margin-bottom: 160px;
}
.room_box img,
.party_box img {
  width: 600px;
  margin-left: 30px;
}
.party_txt_h1 {
  margin-bottom: 10px;
  font-weight: bold;
}
.party_txt_p {
  margin-bottom: 20px;
}
.acc_left_room {
  float: left;
  position: absolute;
  top: 400px;
  left: -100px;
  z-index: 2000;
}
/* .restaurant_html */
.restaurant_top {
  background-image: url(../img/main-restaurant.jpg);
  height: 65vh;
}
.page_top .page_top_sub {
  padding-top: 0px;
  font-size: 15px;
  color: #474747;
}
.restaurant_txt {
  margin: auto;
  width: 50%;
  margin-bottom: 120px;
}
.food_fee {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 60px;
  gap: 10px 50px;
}
.food_fee table {
  width: 42%;
}
.food_fee table th,
.food_fee table td,
.party_txt table th,
.party_txt table td {
  border: 1px solid #ddd;
  padding: 10px 20px;
  max-width: 80px;
}
.food_fee table td {
  text-align: right;
}
.party_txt table {
  margin-bottom: 40px;
}
.party_txt {
  width: 500px;
}
/* hole.html */
.hole_img {
  display: flex;
  justify-content: center;
  width: 100%;
}
.tool_list {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
.hole_sec_box,
.access_main {
  max-width: 600px;
  margin: auto;
}
.hole_top {
  background-image: url(../img/common/main-hole.jpg);
}
.acc_left_hole {
  position: absolute;
  float: left;
  top: 51vh;
  left: -100px;
  z-index: 2000;
}
.hole_txt1 {
  font-size: 26px;
  margin-bottom: 40px;
  line-height: 40px;
  font-weight: 600;
}
.hole_txt2 {
  line-height: 30px;
  margin-bottom: 80px;
}
section .hole_img img {
  width: 25%;
}
.hole_main section {
  margin-bottom: 120px;
}
.tool_list p {
  border: 1px solid rgb(168, 168, 168);
  height: 40px;
  padding: 10px 20px;
  margin-right: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
}
.tool2 p {
  padding: 10px;
  font-size: 13px;
}
/* access.html */
.access_top {
  background-image: url(../img/main-access.jpg);
  background-position: 50% 50%;
  margin-bottom: 115px;
}
.access_main p {
  line-height: 30px;
  margin-bottom: 35px;
}
.access_reserve {
  margin-top: 105px;
}

/* ハンバーガーメニュー トップ画面*/
.ham_top {
  position: absolute;
  width: 40px;
  height: 40px;
  cursor: pointer;
  right: 5%;
}
.ham_line {
  position: absolute;
  left: 10px;
  width: 30px;
  height: 1px;
  background-color: #fff;
}
.ham_line1 {
  top: 15px;
}
.ham_line2 {
  bottom: 15px;
}
.nav_box {
  display: flex;
}
.nav_box img {
  width: 15px;
}
#side_nav_top {
  background-color: #ffffff;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 2000;
  width: 40%;
  height: 100vh;
  padding: 40px;
  opacity: 0.9;
}
#side_nav_top img {
  margin-bottom: 45px;
}
.nav_box img {
  margin-right: 5px;
}
.nav_box span {
  margin: 0px 15px;
}
#side_nav_top ul li {
  margin-bottom: 20px;
}
#side_nav_top ul li a {
  text-decoration: none;
  color: #000;
  display: block;
  text-align: center;
}
.head_link {
  text-decoration: none;
}
.side_box {
  display: flex;
}
#ham_top.active {
  position: absolute;
  right: 5%;
  top: 70px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  z-index: 2000;
}
#ham_top.active .ham_line {
  position: absolute;
  left: 10px;
  width: 30px;
  height: 1px;
  background-color: rgb(0, 0, 0);
}
#ham_top.active .ham_line1 {
  top: 17px;
  transform: rotate(30deg);
}
#ham_top.active .ham_line2 {
  bottom: 22px;
  transform: rotate(-30deg);
}
/*========= ナビゲーションのためのCSS ===============*/

#side_nav_top {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: 0;
  right: -120%;
  width: 100%;
  height: 100vh; /*ナビの高さ*/
  background: rgb(255, 255, 255);
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#side_nav_top.panelactive {
  right: 0;
  width: 40%;
}

/*リストのレイアウト設定*/

#side_nav_top li {
  list-style: none;
  text-align: center;
}

#side_nav_top li a {
  color: #333;
  text-decoration: none;
  padding: 10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
}

/* ハンバーガーメニュー 他ページ */
.ham {
  position: absolute;
  width: 40px;
  height: 40px;
  cursor: pointer;
  right: 5%;
  top: 40px;
}
.ham_line {
  position: absolute;
  left: 10px;
  width: 30px;
  height: 1px;
  background-color: #fff;
}
.ham_line1 {
  top: 15px;
}
.ham_line2 {
  bottom: 15px;
}
.nav_box img {
  width: 15px;
}
#side_nav {
  background-color: #ffffff;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 3000;
  width: 40%;
  height: 100vh;
  padding: 40px;
  opacity: 0.96;
}
#side_nav img {
  margin-bottom: 45px;
}
.nav_box img {
  margin-right: 5px;
}
.nav_box span {
  margin: 0px 15px;
}
#side_nav ul li {
  margin-bottom: 20px;
}
#side_nav ul li a {
  text-decoration: none;
  color: #000;
}
.head_link {
  text-decoration: none;
}
.side_box {
  display: flex;
}
#ham.active {
  position: fixed;
  right: 5%;
  top: 40px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  z-index: 4000;
}
#ham.active .ham_line {
  position: absolute;
  left: 10px;
  width: 30px;
  height: 1px;
  background-color: rgb(0, 0, 0);
}
#ham.active .ham_line1 {
  top: 17px;
  transform: rotate(30deg);
}
#ham.active .ham_line2 {
  bottom: 22px;
  transform: rotate(-30deg);
}
/*========= ナビゲーションのためのCSS ===============*/

#side_nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 3000;
  /*ナビのスタート位置と形状*/
  top: 0;
  right: -120%;
  width: 100%;
  height: 100vh; /*ナビの高さ*/
  background: rgb(255, 255, 255);
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#side_nav.panelactive {
  right: 0;
  width: 40%;
}

/*ナビゲーション*/
#side_nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/

#side_nav li {
  list-style: none;
  text-align: center;
}

#side_nav li a {
  color: #333;
  text-decoration: none;
  padding: 10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
}
#side_nav .side_box img {
  width: 200px;
}
.navigation li a {
  text-decoration: none;
  color: #363636;
}
.slide1,
.slide2 {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 100%;
  margin: 0;
}
.slide {
  position: relative;
  margin-left: 30px;
  height: 220px;
  width: 600px;
}

.tmpMessage {
  border: 1px solid rgb(16, 63, 82);
  background-color: #e6e8e95b;
  color: white;
  width:  369px;
  margin-left: 8px;
  margin-top: 20px;
  padding: 8px;
}

.strong {
  color: rgb(126, 5, 5);
  font-weight: bold;
}
