/******************************************************************
Theme Name: hotel_bsc
Author: yadoken
Author URI: https://www.yadoken.net/
Version: 1.7
License: WTFPL

******************************************************************/

#kondate_ttl, .kondate_wrap {
    max-width: 800px;
    margin: auto;
}
section.mainwrap.inner_sp.sogei {
    text-align: center!important;
}
@media print, screen and (min-width: 768px) {
 .top_gallery {
  padding: 0px 0 0px;
 }
}
.home .accordion{
	padding-bottom:100px;
}

@media print, screen and (max-width: 960px) {
	.sp-wrap {
		width: -moz-fit-content;
		width: fit-content;
		margin-left: auto;
		margin-right: auto;
		max-width: 365px;
		margin-top: 20px;
		margin-bottom: 20px;
		        width: 100%;
	}
	.sp-wrap {
		display: flex;
        justify-content: center;
	}
	.sp-wrap__cts{
			width: calc(50% - 5px);
}
	    .sp-wrap .sp-wrap__cts:nth-child(2) .sns_link li .cls-1 {
        fill: #7f8a73;
    }
	header .sp-wrap .tel_icon a {
		font-size: 15px;
		color: #31371b;
		background: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2225%22%20height%3D%2225%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2331371b%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_2%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%3E%3Cg%20id%3D%22header%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C0a12%2C12%2C0%2C0%2C0%2C0%2C24h0a4.43%2C4.43%2C0%2C0%2C0%2C3-1.06%2C3.28%2C3.28%2C0%2C0%2C0%2C.85-3.74%2C3.78%2C3.78%2C0%2C0%2C0%2C.53-.35%2C1.25%2C1.25%2C0%2C0%2C0%2C.36-1.49%2C12.48%2C12.48%2C0%2C0%2C0-2.16-2.23%2C1.08%2C1.08%2C0%2C0%2C0-1.32.44c-.3.45-.54.31-.54.31a10%2C10%2C0%2C0%2C1-2.07-3.12A9.94%2C9.94%2C0%2C0%2C1%2C9.49%2C9.22s0-.27.58-.24a1.1%2C1.1%2C0%2C0%2C0%2C1.15-.79%2C12.83%2C12.83%2C0%2C0%2C0-.47-3.07c-.25-.68-1.18-.69-1.41-.62A3.58%2C3.58%2C0%2C0%2C0%2C6.58%2C7.61a12.53%2C12.53%2C0%2C0%2C0%2C1.36%2C6.53%2C12.49%2C12.49%2C0%2C0%2C0%2C4.37%2C5%2C3.11%2C3.11%2C0%2C0%2C0%2C2.32.5%2C1.89%2C1.89%2C0%2C0%2C1%2C.17.8%2C1.93%2C1.93%2C0%2C0%2C1-.65%2C1.45%2C3.08%2C3.08%2C0%2C0%2C1-2.12.7h0a10.67%2C10.67%2C0%2C1%2C1%2C7.72-3.33.69.69%2C0%2C0%2C0%2C0%2C1%2C.68.68%2C0%2C0%2C0%2C1%2C0%2C12.23%2C12.23%2C0%2C0%2C0%2C1.87-2.58A12%2C12%2C0%2C0%2C0%2C12%2C0Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E)
			left center no-repeat;
		        background-size: 20px;
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 25px;
	}
}

/* 施設別アイコン */
.faq-area .icon-wrap {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.faq-area .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  height: 32px;
  font-size: 11px;
  color: #fff;
  border-radius: 4px;
  margin: 8px 0;
}

.top_plan ul li a{pointer-events:none;}

.faq-area .icon-shodai { background: #9f9460; }
.faq-area .icon-nidaime { background: #7f8a73; }

/* タコタマ */
.takotama-title {
  font-size: 30px;
  line-height: 1.4;
  margin-bottom: 16px;
  text-align: left;
}

@media screen and (max-width: 1068px) {
  .takotama-title {
    font-size: 24px;
  }
}

.takotama-wrap {
  display: flex;
  flex-direction: row-reverse; 
  align-items: center;
  gap: 40px;
}

.takotama-text {
  flex: 1;
  text-align: left;
}

.takotama-text p {
  line-height: 1.8;
  margin-bottom: 24px;
}

.takotama-text .link_btn {
  text-align: left;
}

.takotama-image {
  flex: 1;
  text-align: right;
}

.takotama-image img {
  display: block;
  max-width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .takotama-wrap {
    flex-direction: column-reverse; 
  }

  .takotama-image {
    text-align: center;
  }

  .takotama-text,
  .takotama-title,
  .takotama-text .link_btn {
    text-align: left;
  }
}

/* TOP画像 */
.top-what-is-it .image-row {
  display: flex;
}

.top-what-is-it .image-item {
  flex: 1;
}

.top-what-is-it .image-item img {
  width: 100%;
  height: auto;
  display: block;
}

@media screen and (max-width: 767px) {
  .top-what-is-it .image-row {
    flex-wrap: wrap;
    gap: 8px;                
    box-sizing: border-box;
  }

  .top-what-is-it .image-item {
    flex: 0 0 calc(50% - 4px);
  }
}

/* フリーテキスト */
.responsive-text {
  text-align: center;   
}

/* シェフ出張サービス */
#party-bbq-plans {
  --main-color: #9f9460; 

  max-width: 1600px;
  margin: 0 auto;
  padding: 0 16px;
}

#party-bbq-plans.beige {
  --main-color: #9f9460;
}

#party-bbq-plans.green {
  --main-color: #7f8a73;
}

#party-bbq-plans .plan-container {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
}

#party-bbq-plans .plan-container .plan-box {
  width: calc(50% - 12px);
  padding: 18px;
  box-sizing: border-box;
  text-align: left;
}

#party-bbq-plans .plan-box img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 10px;
}

#party-bbq-plans .plan-box h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 700;
  color: var(--main-color);
  margin: 12px 0;
}

#party-bbq-plans .plan-box h3 span {
  background: var(--main-color);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  line-height: 1;
  white-space: nowrap;
  border: 1px solid var(--main-color);
}

@media screen and (max-width: 430px) {
  #party-bbq-plans .plan-container {
    flex-direction: column;
  }

  #party-bbq-plans .plan-container .plan-box {
    width: 100%;
  }
}

/* 利用手順 */
.reserve-flow {

  --flow-main: #9f9460;
  --flow-text: #222;
  --flow-border: #ddd;

  max-width: 720px;
  margin: 40px auto;
  text-align: center;
}

.reserve-flow .flow-item {
  display: flex;
  align-items: flex-start; 
  margin: 22px auto;
  width: 100%;
  max-width: 620px;
}

.reserve-flow .num {
  font-size: 26px;
  font-weight: 600;
  min-width: 50px;
  text-align: right;
  margin-right: 30px;
  color: var(--flow-main);
  line-height: 1.4;
  margin-top: -7px;
}

.reserve-flow .content {
  max-width: 520px;
  text-align: left;
  color: var(--flow-text);
}

.reserve-flow .flow-title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4; 
  margin: 0 0 4px 0;
  color: var(--flow-main);
}

.reserve-flow .content {
  line-height: 1.8;
}

.reserve-flow .note {
  font-size: 14px;
  color: #666;
}

.reserve-flow .rule-area {
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid var(--flow-border);
}

.reserve-flow .rule-area p {
  margin-bottom: 14px;
  font-weight: 500;
}

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

  .reserve-flow .flow-item {
    align-items: flex-start; 
  }

  .reserve-flow .num {
    text-align: left;
    margin-right: 8px;
  }

  .reserve-flow .inner_sp {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

.reserve-flow.default {
  --flow-main: #9f9460;
  --flow-border: #ddd;
}

.reserve-flow.green {
  --flow-main: #7f8a73;
  --flow-border: rgba(127, 138, 115, 0.4);
}

#party-bbq-plans.chef-service-steps .plan-box img {
  width: 100px;
  height: 100px;
  object-fit: contain;
  margin: 0 auto 30px;
  display: block;
}

/* オプション */
.option-soft {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px 48px;
}

.option-row {
  display: flex;
  justify-content: space-between; 
  align-items: center;            
  padding: 16px 0;
  border-bottom: 1px solid #eee;
}

.option-content {
  flex: 1;
}

.option-content .title {
  display: block;
  font-weight: 600;
}

.option-content .note {
  display: block;
  color: #777;
  line-height: 1.6;
}

.price {
  white-space: nowrap;
  background: #f7f7f7;
  font-size: 14px;
  padding: 6px 10px;
}

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

  .option-row {
    display: block;
  }

  .price {
    margin-top: 10px;
  }

}

@media (max-width: 768px) {
  .option-soft {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .option-row {
    flex-direction: row; 
    padding: 14px 0;
  }

  .option-content .title {
    font-size: 14px;
  }

  .option-content .note {
    font-size: 12px;
  }

  .price {
    font-size: 13px;
    padding: 5px 8px;
  }
}

.option-thumb {
  display: none;
}

@media (max-width: 768px) {
  .inner_sp .option-soft {
    padding-left: 14px;
    padding-right: 14px;
  }
}


/* Instagram投稿キャンペーン */
.insta-campaign {
   max-width: 800px;
  margin: 40px auto;
  padding: 20px 90px;
  background: #faf9f6;
  border-radius: 16px;
  position: relative;

  border: 4px solid; 
  border-image: linear-gradient(45deg, #c13584, #f77737) 1;
}

.insta-campaign .campaign-badge {
  position: absolute;
  background: linear-gradient(45deg, #c13584, #f77737);
  color: #fff;
  font-size: 12px;
  padding: 6px 14px;
  border-radius: 999px;
  font-weight: 600;
}

.insta-campaign .campaign-title {
  text-align: center;
  font-size: 22px;
  line-height: 1.4;
  margin-bottom: 20px;
}

.insta-campaign .campaign-title span {
  font-size: 26px;
  font-weight: 700;
}

.insta-campaign .campaign-price {
  text-align: center;
  background: #fff;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 24px;
  border: 1px solid #eee;
}

.insta-campaign .campaign-price strong {
  font-size: 20px;
  font-weight: 700; 
  background: linear-gradient(45deg, #c13584, #f77737);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

.insta-campaign .campaign-target,
.insta-campaign .campaign-howto {
  margin-bottom: 20px;
}

.insta-campaign .label {
  font-size: 13px;
  font-weight: 600;
  color: #777;
  margin-bottom: 6px;
}

.insta-campaign .campaign-howto ol {
  padding-left: 18px;
  margin: 0;
}

.insta-campaign .campaign-howto li {
  margin-bottom: 6px;
}

.insta-campaign .campaign-note {
  font-size: 14px;
  color: #666;
  text-align: center;
  margin-top: 16px;
}

.insta-campaign .insta-link {
  text-decoration: underline;      
  color: #c13584;                  
  font-weight: 600;
  transition: color 0.3s;
}

.insta-campaign .insta-link:hover {
  color: #f77737;                  
}

@media screen and (max-width: 768px) {
  .insta-campaign {
    padding: 20px 40px;
  }
}

@media (max-width: 480px) {
  .insta-campaign {
    padding: 20px 20px;
  }

  .insta-campaign .campaign-howto ol {
    padding-left: 0;
  }

  .insta-campaign .campaign-title {
    font-size: 20px;
  }

  .insta-campaign .campaign-title span {
    font-size: 24px;
  }
}


.amenities-scope .amenity {
  margin-bottom: 20px;
}
.amenities-scope .amenity-label {
  display: inline-block;
  padding: 4px 10px;
  margin-bottom: 6px;
  font-size: 14px;
  color: #444;
  background: #f2f2f2;
}

.amenities-scope .amenity p {
  margin: 0;
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}

.image-row {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  margin-top: 60px;
  width: 100%;
  overflow: hidden; 
}

.image-row img {
  width: clamp(140px, 16vw, 240px);
  height: auto;
  padding: 0 2px;
  flex-shrink: 1;   
}

/* テーブル */
.room-table.stylish {
  border-collapse: collapse;
  background: #ffffff;
  border: 1px solid transparent;
  margin-top: 40px;
}

.room-table.stylish th,
.room-table.stylish td {
  padding: 16px 20px;
}

.room-table.stylish th {
  font-weight: 500;
  letter-spacing: 0.12em;
  text-align: left;
}

.room-table.stylish td {
  font-weight: 600;
}

.room-table.stylish tr:not(:last-child) th,
.room-table.stylish tr:not(:last-child) td {
  border-bottom: 1px solid transparent;
}

@media (max-width: 768px) {
  .room-table.stylish th,
  .room-table.stylish td {
    padding: 14px 16px;
  }
}

.room-table.stylish.is-green {
  border-color: rgba(127, 138, 115, 0.35);
}

.room-table.stylish.is-green th {
  color: #7f8a73;
  background: rgba(127, 138, 115, 0.08);
}

.room-table.stylish.is-green td {
  color: #7f8a73;
}

.room-table.stylish.is-green tr:not(:last-child) th,
.room-table.stylish.is-green tr:not(:last-child) td {
  border-bottom-color: rgba(127, 138, 115, 0.25);
}

.room-table.stylish.is-beige {
  border-color: rgba(189, 178, 151, 0.4);
}

.room-table.stylish.is-beige th {
  color: #9f9460;
  background: rgba(189, 178, 151, 0.15);
}

.room-table.stylish.is-beige td {
  color: #9f9460;
}

.room-table.stylish.is-beige tr:not(:last-child) th,
.room-table.stylish.is-beige tr:not(:last-child) td {
  border-bottom-color: rgba(189, 178, 151, 0.3);
}

/* アイコン画像調整 */
img[src$="spot01-1.webp"],
img[src$="spot02-2.webp"],
img[src$="spot03-1.webp"] {
  width: 160px !important;
  height: auto;
}

/* 宿泊ゲスト特典 */
.bar-benefit-attention {
  margin-top: 28px;
  padding: 22px 24px;
  border-radius: 14px;
  background: linear-gradient(
    135deg,
    rgba(127,138,115,0.28),
    rgba(127,138,115,0.10)
  );
  border: 1px solid rgba(127,138,115,0.45);
}

.bar-benefit-attention .catch {
  margin: 0 0 12px;
  font-size: 16px;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #3f4a38;
}

.bar-benefit-attention .catch span {
  display: inline-block;
  margin-top: 4px;
  font-size: 19px;
  color: #7f8a73;
}

.bar-benefit-attention .benefits {
  margin: 0;
  font-size: 15px;
  line-height: 1.8;
  color: #222;
}

.bar-benefit-attention strong {
  font-weight: 700;
  color: #5f6a52;
}

/* こんな人におすすめ */
.recommend {
  margin: 24px 0;
}

.recommend-title {
  font-weight: 600;
  margin-bottom: 8px;
}

.recommend-list {
  display: flex;
  flex-direction: column; 
  gap: 6px;
  padding: 0;
  margin: 0;
}

.recommend-list li {
  list-style: none;
  white-space: nowrap; 
  font-size: 14px;
}

@media only screen and (max-width: 767.9px) {
  .top_plan .recommend-list li {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    align-self: flex-start;
  }
}

/* チェックマーク */
.recommend-list .check {
  margin-right: 6px;
  color: #9f9460;
}
@media print, screen and (min-width: 768px) {
  .top_plan ul.layout_03 li.no-mt {
    margin-top: 0 !important;
  }
}
.bold {
  font-weight: bold;
}

.houserule-btn-wrap {
  text-align: center;
  margin: 40px 0;
}

/* リンクボタン */
.houserule-btn {
  display: inline-block;
  background-color: #9f9460; 
  color: #fff;
  padding: 14px 36px;
  border-radius: 6px;
  font-size: 15px;
  text-decoration: none;
  letter-spacing: 0.05em;
  transition: opacity 0.2s ease;
}

.houserule-btn:hover {
  opacity: 0.85;
}

.amenities-title {
  color: #9f9460;
  font-size: 16px;
  font-weight: 600;
  margin-top: 20px;    
  margin-bottom: 16px;
}

.mail_ads {
  text-align: center;
  margin: 20px auto 14px;
}

.mail_ads a {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-size: 13px;
  font-weight: 600;
  color: #333;

  padding: 8px 14px;
  border: 1px solid #b5b1a0; 
  border-radius: 6px;

  letter-spacing: 0.04em;
}

.mail_ads a::before {
  content: "✉";
  font-size: 14px;
}
.ttl_access .gmap div{
	margin-top:35px;
}

@media screen and (max-width: 1440px) {
  .txt_imgarea .img_left01 > li .txt_area,
  .txt_imgarea .img_right01 > li .txt_area,
  .slidethumb_txt .img_left01 > li .txt_area,
  .slidethumb_txt .img_right01 > li .txt_area {
    margin-top: 3vw;
  }
}

@media screen and (max-width: 1366px) {
  .txt_imgarea .img_left01 > li .txt_area,
  .txt_imgarea .img_right01 > li .txt_area,
  .slidethumb_txt .img_left01 > li .txt_area,
  .slidethumb_txt .img_right01 > li .txt_area {
    margin-top: 1vw;
  }
}

@media screen and (max-width: 834px) {
  .ttl_access .access_inner .access_bg .access_route {
    margin-top: 60px;
  }
}

@media screen and (max-width: 834px) {
  .mainwrap {
    max-width: 90%;
  }
}