.u-fv {
  height: 400px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 100px;
}
.u-fv-title {
  line-height: 1.2;
  text-align: center;
  color: #6a4817;
  text-shadow: 2px 2px 0 #fff, -2px -2px 0 #fff, -2px 2px 0 #fff,
    2px -2px 0 #fff, 0px 2px 0 #fff, 0 -2px 0 #fff, -2px 0 0 #fff, 2px 0 0 #000;
}
.u-fv-title::before {
  content: attr(data-en);
  display: block;
  font-family: "Oswald", sans-serif;
  font-size: 3rem;
  text-transform: uppercase;
}

.u-main {
  background: #fff6e8;
}
.u-section-inner {
  width: 95%;
  max-width: 1150px;
  margin: 0 auto;
}
/*pethotel*/
.pethotel-fv {
  background: url("../img/top-business01.jpg") no-repeat center / cover;
}
.pethotel-top {
  text-align: center;
}
.pethotel-top-main {
  font-weight: bold;
  font-size: 2rem;
}
.daycare-top .pethotel-top-main {
  font-size: 1.75rem;
}

.pethotel-top-sub {
  margin: 1rem auto 0;
  font-size: 1.2rem;
  width: 95%;
}

.pethotel-support-top {
  display: flex;
  background-color: #fff;
  justify-content: center;
  padding: 1rem;
  box-shadow: 6px 4px 22px rgba(0, 0, 0, 0.07);
}
.pethotel-support-top-img {
  width: 40%;
  padding: 1rem;
}
.pethotel-support-top-img img {
  display: block;
  width: 100%;
}
.pethotel-support-top-textwrap {
  width: 60%;
  padding: 1rem;
}
.u-section-title {
  display: flex;
  align-items: center;
  color: #6a4817;
}
.u-section-title img {
  display: block;
  width: 50px;
  margin-right: 0.5rem;
}
.pethotel-support-top-textwrap h3 {
  margin-top: 2rem;
  font-size: 1.5rem;
}
.pethotel-support-top-textwrap p {
  margin-top: 1rem;
}
.pethotel-support-lists ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.pethotel-support-lists li {
  width: calc((100% - 3rem) / 3);
  margin: 1rem 0;
  background-color: #fff;
  padding: 1.5rem;
  box-shadow: 6px 4px 22px rgba(0, 0, 0, 0.07);
}
.pethotel-support-lists-img img {
  display: block;
  width: 100%;
  aspect-ratio: 1.75/1;
  object-fit: cover;
}
.pethotel-support-lists li h3 {
  margin-top: 1rem;
}
.pethotel-support-lists li p {
  font-size: 0.9rem;
  margin-top: 0.5rem;
}

/*roomtype*/
.roomtype {
  background-color: #fff;
}
.roomtype-top-text {
  font-size: 1.3rem;
  margin-top: 1rem;
}
.roomtype-contents {
  margin-top: 3rem;
}
.roomtype-contents ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.roomtype-contents li {
  width: calc((100% - 2rem) / 2);
  padding: 2rem;
  box-shadow: 6px 4px 22px rgba(0, 0, 0, 0.07);
}
.roomtype-contents h3 {
  font-size: 1.3rem;
}
.roomtype-img {
  margin-top: 1rem;
}
.roomtype-img img {
  width: 100%;
  display: block;
  aspect-ratio: 1.75/1;
  object-fit: cover;
}

/*u-price*/
table {
  border-collapse: collapse;
  width: 100%;
  font-size: 1.3rem;
}
.u-price {
  margin-top: 3rem;
}
.u-price-title {
  text-align: center;
  font-size: 2rem;
}
.u-price-contents {
  margin-top: 3rem;
}

th {
  padding: 1rem;
  text-align: center;
}
td {
  padding: 1rem;
  text-align: center;
}
td.table_center {
  text-align: center;
}
td.text-left {
  text-align-last: left;
}
.bold_hr {
  border-bottom: solid 2px #1c2954;
}

.table_menu {
  background-color: #cdc9cb;
  border-right: solid 3px #fff;
}

tr {
  border-bottom: solid 1px #1c2954;
}
.table-op {
  margin: 5rem auto 1rem;
  text-align: center;
  font-size: 1.5rem;
  background-color: #6a4817;
  color: #fff;
  padding: 0.5rem;
}
.tyui-wrap {
  margin-top: 3rem;
}
/*pethotel-flow*/
.pethotel-flow {
  background: #fff;
}
.tac {
  text-align: center;
}
.flow-contents {
  display: flex;
  justify-content: space-between;
  margin-top: 3rem;
}
.flow-item {
  width: calc((100% - 12rem) / 3);
  margin: 0 2rem;
}
.flow-item::before {
  content: attr(data-num);
  text-transform: uppercase;
  font-family: "Oswald", sans-serif;
  font-weight: 700;
  font-size: 2rem;
  text-align: center;
  display: block;
}
.flow-img {
  display: block;
  width: 60%;
  background-color: #6a4817;
  border-radius: 50%;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.5rem auto 0;
}

.flow-img img {
  width: 50%;
}
.flow-item h3 {
  margin-top: 1rem;
  font-size: 1.3rem;
}

.flow-item p {
  font-size: 0.9rem;
  margin-top: 0.5rem;
}

/*faq*/
.faq-contents {
  margin-top: 3rem;
}
.qa-6 {
  margin-bottom: 5px;
  border-bottom: 2px solid #d6dde3;
}

.qa-6 summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 1em 2em 1em 3em;
  color: #333333;
  font-weight: 600;
  cursor: pointer;
}

.qa-6 summary::before,
.qa-6 p::before {
  position: absolute;
  left: 1em;
  font-weight: 600;
  font-size: 1.3em;
}

.qa-6 summary::before {
  color: #6a4817;
  content: "Q";
}

.qa-6 summary::after {
  transform: translateY(-25%) rotate(45deg);
  width: 7px;
  height: 7px;
  margin-left: 10px;
  border-bottom: 3px solid #333333b3;
  border-right: 3px solid #333333b3;
  content: "";
  transition: transform 0.5s;
}

.qa-6[open] summary::after {
  transform: rotate(225deg);
}

.qa-6 p {
  position: relative;
  transform: translateY(-10px);
  opacity: 0;
  margin: 0;
  padding: 0.3em 3em 1.5em;
  color: #333;
  transition: transform 0.5s, opacity 0.5s;
}

.qa-6[open] p {
  transform: none;
  opacity: 1;
}

.qa-6 p::before {
  color: #ff8d8d;
  line-height: 1.2;
  content: "A";
}

/*note*/
.note {
  background-color: #f7f7f7;
  padding-top: 4rem;
}

.note-title {
  font-size: 1.2rem;
}
.note-text-top {
  margin-top: 2rem;
}
.note ul {
  margin-top: 1rem;
}
.note ul li {
  list-style: initial;
  list-style-position: inside;
  font-size: 0.9rem;
}

/*daycare-fv*/
.daycare-fv {
  background: url("../img/dogcare.jpg") no-repeat top / cover;
}

/* レイアウト */
form {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  background-color: #fff;
  padding: 2rem;
}
.form-row {
  display: flex;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f2f4f5;
}
.form-row:last-child {
  border-bottom: none;
}
.form-label {
  display: flex;
  align-items: center;
  width: 250px;
}
.form-label label {
  font-weight: bold;
}
.form-label span {
  margin-left: 10px;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background-color: #9a0c0c;
}
.form-row p {
  width: calc(100% - 250px);
}
.form-row .form-label p {
  width: 100%;
}
/* フォームパーツのデザイン */
input,
textarea {
  background-color: #f2f4f5;
  border: none;
  border-radius: 3px;
  padding: 15px 20px;
  font-size: 16px;
  color: #333;
  flex-grow: 1;
  width: 100%;
}
input::placeholder,
textarea::placeholder {
  color: #999;
  font-size: 14px;
}
select {
  background-color: #f2f4f5;
  border: none;
  border-radius: 3px;
  padding: 15px 20px;
  font-size: 16px;
  color: #333;
  width: 100%;
}
input.submit {
  cursor: pointer;
  margin: 3rem auto 0;
  padding: 15px 5rem;
  font-size: 1.1rem;
  border: none;
  width: fit-content;
  border-radius: 3px;
  color: #fff;
  font-weight: bold;
  background-color: #6a4817;
}
.submit-btn p{
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/*daycare*/
.daycare-support .pethotel-support-lists {
  margin-top: 3rem;
}
.daycare-support .pethotel-support-lists li {
  width: calc((100% - 2rem) / 2);
}
.u-section-title.center {
  justify-content: center;
}
.daycare-support .pethotel-support-lists p {
  font-size: 1.1rem;
  font-weight: bold;
  margin-top: 1rem;
}
.daycare-support p.daycare-support-bottom {
  text-align: center;
  font-size: 1.2rem;
}
.belongings-contents {
  width: 100%;
  margin: 0 auto;
  max-width: 1000px;
}
.belongings-item {
  margin-top: 3rem;
}
.belongings-item h3 {
  display: flex;
  align-items: center;
  padding-left: 1rem;
  background-color: #fff;
}

.belongings-item h3 img {
  width: 50px;
  margin-right: 0.5rem;
}
.belongings-item-text {
  margin-top: 1rem;
}
.belongings-item-text p {
  margin-top: 1rem;
  font-weight: bold;
  font-size: 1.1rem;
}
.belongings-item-text span {
  padding-left: 1rem;
  display: block;
}
.belongings-bottom {
  margin-top: 2rem;
  font-weight: bold;
}

/*==================================================
ギャラリーのためのcss
===================================*/
.u-gallery-lists {
  columns: 4; /*段組みの数*/
  padding: 0 15px; /*ギャラリー左右に余白をつける*/
  margin: 0;
}

.u-gallery-lists li {
  margin-bottom: 20px; /*各画像下に余白をつける*/
  list-style: none;
}

/*ギャラリー内のイメージは横幅100%にする*/
.u-gallery-lists img {
  width: 100%;
  height: auto;
  vertical-align: bottom; /*画像の下にできる余白を削除*/
}

/*　横幅900px以下の段組み設定　*/
@media only screen and (max-width: 900px) {
  .u-gallery-lists {
    columns: 3;
  }
}

@media only screen and (max-width: 768px) {
  .u-gallery-lists {
    columns: 2;
  }
}

.table-scroll-01 {
  overflow-x: auto;
  width: 100%;
}
.table-scroll-02 {
  overflow-x: auto;
  width: 100%;
}
.table-scroll-01 .hotelprice {
  min-width: 600px; /* ← これが重要 */
}
.table-scroll-02 .hotelprice {
  min-width: 500px; /* ← これが重要 */
}

@media screen and (max-width: 600px) {
  .table-scroll-01 {
    -webkit-overflow-scrolling: touch;
  }
}

@media screen and (max-width: 500px) {
  .table-scroll-02 {
    -webkit-overflow-scrolling: touch;
  }
}

/*reservation*/
.reservation-top {
  text-align: center;
  font-weight: bold;
  font-size: 1.2rem;
}
.reservation-line {
  margin-top: 2rem;
  text-align: center;
}

.reservation-line img {
  width: 90%;
  max-width: 300px;
  margin: 0 auto;
}

.reservation-bottom {
  width: fit-content;
  margin: 2rem auto 0;
  padding: 0 1rem;
}
.reservation-bottom p + p {
  margin-top: 1rem;
}
