@charset "utf-8";
/* CSS Document */
:root {
  --font-mincho: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  --content-color-navy: #025b7d;
  --content-color-blue: #0894cb;
  --default-color-red: #DF0D00;
}
html {
  scroll-behavior: smooth;
}
.breadcrumb {
  max-width: 100%;
}
.contents {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #2C2A29;
  -webkit-text-size-adjust: none; /*ipad safari対策*/
  & a {
    text-decoration: none;
    color: inherit;
    &:hover {
      opacity: 0.8;
      transition: all 0.6s ease;
    }
  }
  & .inner {
    width: 1104px;
    max-width: 96%;
    margin: 0 auto;
  }
  & img {
    max-width: 100%;
    vertical-align: bottom;
  }
}
.nopc {
  display: none;
}

/****SP用の改行を非表示****/
.sp-only {
	display: none;
}

/*------------------------------------------------
	メインビジュアル
--------------------------------------------------*/
#mainvisual {
	width: 100%;
	height: auto;
	margin: 0 auto;
	text-align: center;
	& img {
		width: 100%;
		max-width: 100%;
		height: auto;
		vertical-align: bottom;
	}
}


/*------------------------------------------------
	導入 (#lead)
--------------------------------------------------*/
#lead {
  width: 100%;
  background-color: #fbf9ef;
  padding-top: 80px;
  padding-bottom: 0px;
}

#lead .inner {
  width: 1104px;
  max-width: 92%;
  margin: 0 auto;
}

#lead img {
  width: 100%;
  height: auto;
  display: block;
}

/* --- 上部 2カラムフレキシブルレイアウト --- */
#lead .lead-top-container {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  margin-bottom: 0px;
}

/* ① 左カラム内に配置したタイトル */
#lead .lead-left-container .title {
  text-align: center;
  border-bottom: 1px solid #707070;
  padding-bottom: 20px;
  margin-bottom: 24px;
}

#lead .lead-left-container .title h2 {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 45px;
  color: #2C2A29;
}

#lead .lead-left-container .title .sub {
  font-size: 24px;
  font-weight: 500;
  margin-top: 10px;
  color: #2C2A29;
}

#lead .lead-left-container .text {
  font-size: 16px;
  line-height: 1.85;
  text-align: justify;
  letter-spacing: 0.02em;
  color: #2C2A29;
  margin-bottom: 24px;
}

/* ② 写真コンテナ */
#lead .lead-image-container {
  width: 100%;
}

/* ③ 右側マップコンテナ */
#lead .lead-right-container {
  width: 100%;
}


/* --- ④ 下部エリアマップコンテナ --- */
#lead .area-map-container {
  width: 100%;
  aspect-ratio: 1104 / 360;
  background: url("/kaigai/asia/vietnam/nhatrang/charter/dep-chugoku/images/map-pc-chu.png") no-repeat center / contain;
  /* 点線が終わる位置（約25.5%付近）からテキストエリアが始まるよう調整 */
  padding: 2% 2% 2% 25.5%;
  box-sizing: border-box;
  margin-bottom: 40px;
  display: flex;
  align-items: center;
}

#lead .area-list {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#lead .area-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#lead .area-list dt {
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  padding: 3px 14px;
  display: inline-block;
}

#lead .area-list dt.tag-city { background-color: #42bd65; }
#lead .area-list dt.tag-vinpearl { background-color: #42a4bd; }
#lead .area-list dt.tag-camranh { background-color: #b58b30; }

#lead .area-list dd {
  width: 100%;
  background-color: #fff;
  font-size: 16px;
  line-height: 1.45;
  padding: 8px 12px;
  margin-top: 0;
  box-sizing: border-box;
  color: #2C2A29;
}




/* --- 特集リンクコンテナ --- */
#lead .feature-container {
  text-align: center;
}

#lead .feature-container h3 {
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #2C2A29;
}

#lead .feature-container h3::before { content: "＼"; }
#lead .feature-container h3::after { content: "／"; }


/*------------------------------------------------
	特集リンクエリア (.feature-link)
--------------------------------------------------*/
.feature-link {
  width: 100%;
  text-align: center;
  margin-top: 56px;
}

.feature-link h3 {
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 8px;
}

.feature-link h3::before {
  content: "＼";
}

.feature-link h3::after {
  content: "／";
}

.feature-link a {
  display: block;
}

/*------------------------------------------------
	導入

#lead {
  width: 100%;
  background-color: #fbf9ef;
  padding: 120px 0;
  & .inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  & .title {
    width: 100%;
    text-align: center;
    border-bottom: solid 1px #222;
    padding-bottom: 24px;
    margin-bottom: 32px;
    & h2 {
      font-size: 40px;
      font-weight: 700;
		& span {
			display: block;
			font-weight: 500;
			font-size: 26px;
			margin-bottom: 5px;
		}
    }
  }
  & .text {
    width: calc(100% - 560px);
    line-height: 1.8;
    text-align: justify;
    letter-spacing: 0.03em;
    padding-right: 48px;
  }
  & .map {
    width: 560px;
    height: 355px;
    background: url("../images/map-pc.png");
    padding: 16px 16px 0 220px;
    & dt {
      color: #fff;
      font-size: 16px;
      font-weight: 700;
      padding: 0 8px 1px;
      &:nth-child(1) {
        background-color: #42bd65;
      }
      &:nth-child(3) {
        background-color: #42a4bd;
      }
      &:nth-child(5) {
        background-color: #b58b30;
      }
    }
    & dd {
      background-color: #fff;
      font-size: 14px;
      line-height: 1.3;
      padding: 4px 8px;
      text-align: justify;
      margin-bottom: 8px;
    }
  }
  & .ph {
    width: 100%;
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    & li {
      width: 24%;
      & img {
        border-radius: 8px;
      }
    }
  }
  & .movie {
    width: 100%;
    margin-top: 56px;
    text-align: center;
    display: flex;
    justify-content: center;
    gap: 0 38px;
    & h3 {
      font-size: 18px;
      font-weight: 700;
      text-align: left;
      margin-bottom: 8px;
      &::before {
        content: "▶";
        margin-right: 4px;
        font-size: 16px;
      }
    }

--------------------------------------------------*/
/*------------------------------------------------
    & iframe {
      /*width: 534px;
      width: 530px;
      height: 298px;
      border: none;
    }
  }
  & .feature-link {
    width: 100%;
    text-align: center;
    margin-top: 56px;
    & h3 {
      font-size: 26px;
      font-weight: 700;
      margin-bottom: 8px;
		&::before {
			content: "＼";
		}
		&:after {
			content: "／";
		}
    }
    & a {
      display: block;
    }
  }
}
--------------------------------------------------*/
/*------------------------------------------------
	ポイント
--------------------------------------------------*/
#point {
  width: 100%;
  background-color: #ace5ff;
  background-image: url("../images/point-bg.png"), url("../images/point-bg.png");
  background-repeat: no-repeat, no-repeat;
  background-position: left -100px top -100px, right -100px bottom -100px;
  padding: 120px 0;
  & .title {
    text-align: center;
    color: var(--content-color-navy);
    margin-bottom: 56px;
    & .sub {
      font-size: 22px;
      font-weight: 700;
      padding-bottom: 24px;
      background: url("../images/point-fukidashi.png") no-repeat bottom center / 180px;
    }
    & h2 {
      font-size: 36px;
      font-weight: 700;
    }
  }
  & .point-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 16px;
    & > li {
      background-color: #fff;
      position: relative;
      padding: 16px 20px 24px 65px;
      &:nth-child(1) {
        width: 100%;
      }
      &:nth-child(2) {
        width: 100%;
      }
      &:nth-child(3) {
        width: 47%;
      }
      &:nth-child(4) {
        width: 51%;
      }
      & .no {
        position: absolute;
        left: 24px;
        top: 16px;
        font-size: 50px;
        line-height: 1.0;
        color: var(--content-color-navy);
        font-family: "Arial Black", sans-serif;
        font-weight: bold;
      }
      & h3 {
        font-size: 24px;
        line-height: 1.3;
        font-weight: 700;
        color: #e73562;
        & .f-small {
          font-size: 18px;
        }
        & .f-black {
          color: #2C2A29;
        }
        & mark {
          background: linear-gradient(transparent 70%, #fff35e 0%);
          color: inherit;
        }
      }
      & .schedule {
        display: flex;
        justify-content: space-between;
        margin-top: 8px;
        & dl {
          width: 49%;
          display: flex;
          text-align: center;
          border: solid 1px #ddd;
          & dt {
			width: 40%;
			font-weight: 700;
			background-color: #efefef;
			font-size: 14px;
			letter-spacing: 0em;
			  display: flex;
			  justify-content: center;
			  align-items: center;
          }
          & dd {
			font-size: 14px;
			width: 40%;
			padding: 4px 0;
          }
        }
      }
		/*時間が違う時用*/
      /*& .schedule {
		  width: 100%;
		  margin-top: 8px;
		  border: solid 1px #ddd;
		  font-size: 14px;
		  line-height: 1.8;
		  border-collapse: collapse;
		  & th {
			  background-color: #efefef;
			   border: solid 1px #ddd;
		  }
		  & td {
			  text-align: center;
			  border: solid 1px #ddd;
		  }
		  & .dep {
			  background-color: #fffae4;
		  }
      }*/
      & .text {
        font-size: 16px;
        margin-top: 4px;
      }
      & .info {
		  font-size: 14px;
		  border-top: solid 1px #ccc;
		  margin-top: 5px;
		  padding-top: 5px;
		  display: flex;
		  flex-wrap: wrap;
		  justify-content: space-between;
		  & dt {
			  width: 13%;
			  font-weight: 600;
		  }
		  & dd {
			  width: 86%;
		  }
      }
    }
  }
}
/*2つから選べる観光プラン付き*/
#tour {
  & .point-list {
    width: 100%;
    border: solid 5px #fff;
    margin: 0 0 40px;
    & > li {
      background-color: #fff;
      padding: 15px 0px;
      & .plan-list {
        width: 100%;
        display: flex;
        & li {
          width: 50%;
          display: flex;
          flex-wrap: wrap;
          justify-content: space-between;
          align-self: flex-start;
          &:nth-child(1) {
            border-right: dashed 1px #999;
            padding-right: 24px;
            background: url("../images/point5-illust-1.png") no-repeat top left/ 95%;
          }
          &:nth-child(2) {
            padding-left: 24px;
            background: url("../images/point5-illust-2.png") no-repeat top right/ 95%;
          }
          & .fuki {
            width: 100%;
            text-align: center;
            position: relative;
            & span {
              display: inline-block;
              font-size: 16px;
              font-weight: 500;
              color: #fff;
              padding: 4px 16px;
              .plan1 & {
                background-color: #2892db;
                /*background-color: #0073C4;*/
              }
              .plan2 & {
                background-color: #00c09d;
                /*background-color: #00815F;*/
              }
            }
          }
          & h4 {
            width: 100%;
            text-align: center;
            font-size: 24px;
            font-weight: 700;
            margin: 8px 0 40px;
            .plan1 & mark {
              background: linear-gradient(transparent 70%, #e1f0fb 0%);
              /*background: linear-gradient(transparent 70%, #d0e8fa 0%);*/
              color: #2892db;
              /*color: #0073C4;*/
            }
            .plan2 & mark {
              background: linear-gradient(transparent 70%, #def7f2 0%);
              /*background: linear-gradient(transparent 70%, #ccf1e9 0%);*/
              color: #00c09d;
              /*color: #00815F;*/
            }
          }
          & dl {
            width: 50%;
            & dt {
              line-height: 1.3;
              font-weight: 700;
              margin-bottom: 4px;
            }
            & dd {
              margin-bottom: 10px;
            }
          }
          & .ph {
            width: 48%;
            & img {
              margin-bottom: 16px;
            }
          }
        }
      }
    }
  }
}

/*ツアーポイント*/
#tour {
  .tour-point {
	  width: 100%;
	  display: flex;
	  justify-content: center;
	  margin: 0 auto 40px;
	  gap: 2%;
	  li {
		  width: 49%;
		  background-color: #fff;
		  border: solid 3px #dfdfdf;
		  padding: 8px;
		  display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
		  p {
			  font-size: 20px;
			  font-weight: 700;
			  .pink {
				  color: #e73562;
			  }
			  .small {
				  font-size: 0.7em;
			  }
		  }
	  }
  }
}

/*------------------------------------------------
	アイコン付き見出し設定
--------------------------------------------------*/

#tour .point-list .plan-list dt.icon-dt {
  display: flex; 
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

#tour .point-list .plan-list dt.icon-dt .dt-icon {
  width: 48px;
  height: auto;
  flex-shrink: 0;
}

#tour .point-list .plan-list dt.icon-dt span {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}


/*------------------------------------------------
	出発日タブ
--------------------------------------------------*/
#dep-tab {
	width: 100%;
	margin-bottom: 54px;
	display: flex;
	justify-content: space-between;
	border-bottom: solid 3px #0563bb;
	
	& li {
		width: 49%;
		background-color: #dbdbdb;
		text-align: center;
		font-size: 26px;
		line-height: 1.3;
		font-weight: 700;
		padding: 8px 0;
		text-align: center;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		display: block;
		cursor: pointer;
		& .sub {
			font-size: 0.7em;
			display: block;
		}
		& .f-small {
			font-size: 0.7em;
		}
		&.select {
			margin-top: -8px;
			background-color: #0563bb;
			color: #ffe614;
			cursor: default;
		}
		&:not(.select):hover {
			background-color: #0563bb;
			color: #ffe614;
		}
	}
}

/*------------------------------------------------
	ツアー
--------------------------------------------------*/
#tour,#fair {
  width: 100%;
  background-color: #f8f8f8;
  padding: 64px 0 8px;
	& .disnon {
		display: none;
	}
  & h2 {
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 56px;
    &::before {
      content: "";
      display: block;
      height: 50px;
      background: url("../images/icon-tour.svg") no-repeat top center /contain;
    }
  }
  & .cate-title {
	  margin-top: 60px;
	  margin-bottom: 56px;
    text-align: center;
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    background-color: #025b7d;
    padding: 8px 0;
    position: relative;
	  & .sub {
		  font-size: 0.7em;
		  line-height: 1.3;
		  font-weight: 500;
		  display: block;
	  }
    &::after {
      content: "";
      border: 20px solid transparent;
      border-top: 20px solid #025b7d;
      margin-left: -20px;
      top: 100%;
      left: 50%;
      position: absolute;
    }
  }
  & h3 {
    text-align: center;
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 24px;
    /*&::before {
            content: "＼";
            margin-right: 10px;
            font-weight: 700;
            font-size: 1.3em;
        }
        &::after {
            content: "／";
            margin-left: 10px;
            font-weight: 700;
            font-size: 1.3em;
        }*/
    & span {
      background: linear-gradient(transparent 70%, #fff35e 0%);
      padding: 0 8px;
    }
  }
  & .more-btn {
    width: 700px;
    margin: 56px auto 96px;
    & a {
      display: block;
      margin: 0 auto;
      letter-spacing: 0.05em;
      color: #fff;
      text-align: center;
      line-height: 36px;
      border-radius: 30px;
      background-color: #ec9e00;
      padding: 8px 0;
      position: relative;
      box-shadow: 3px 3px 0px 0 rgba(0, 0, 0, .25);
      &::after {
        content: "";
        background: url(/cmn/icon/icon_arrow_right_white.svg) no-repeat center center / cover;
        width: 10px;
        height: 30px;
        position: absolute;
        top: 0;
        right: 3%;
        bottom: 0;
        margin: auto;
      }
    }
  }
  .note {
    font-size: 12px;
    margin-top: 32px;
  }
}
#fair {
	background-color: #fffad9;
	padding: 64px 0 96px;
    & .logo {
        width: 350px;
        margin: 0 auto 20px;
        & a {
            display: block;
        }
    }
	& .logo_bnr {
		text-align: center;
		margin-bottom: 20px;
		& a {
            display: block;
        }
	}
    & .schedule {
        width: 600px;
        margin: 0 auto 20px;
        text-align: center;
        background-color: #fff;
        border: solid 1px #222;
        font-size: 17px;
        font-weight: bold;
        padding: 5px 20px;
        border-radius: 6px;
        & span {
            font-size: 0.8em;
        }
    }
    & .note {
        font-size: 13px;
        margin-top: 20px;
    }
    & .more-btn {
        margin: 30px auto 0;
    }
}

/*------------------------------------------------
	商品カセット調整
--------------------------------------------------*/
.product__list--point:empty {
  display: none;
}
.product__list--minmax .minmax-new:not(:empty) + .minmax-old, .product__list--dep .js-split-departure:not(:empty) + span, .product__list--type .js-split-airport:not(:empty) + span {
  display: none;
}
.product__list--dep .js-split-departure::after, .product__list--dep span[id*="dep_"]::after {
  content: "出発"
}
.product__list--type.port-type::after {
  content: "発着"
}
.product__list--type.port-type.hotel::after {
  content: ""
}
.product__list--type.port-type.train::after {
  content: "発"
}
.product__list--dep .js-split-departure:empty::after, .product__list--dep span[id*="dep_"]:empty::after {
  display: none;
}
.product__list--price {
  text-align: right;
}
.product__wrapper:has(.is-size-half) {
  flex-wrap: nowrap;
  --yohaku-yoko: 10px;
  gap: 15px var(--yohaku-yoko);
}
.product__contents.is-size-half {
  max-width: 547px;
  width: 100%;
}
.is-pc .media .tour_img, .is-pc .product__list--image {
  height: 179px;
}
	
/*------------------------------------------------
	スタッフ紹介
--------------------------------------------------*/
#staff {
	width: 100%;
	background-color: #e5f3ff;
	padding: 64px 0;
	h2 {
		text-align: center;
		font-size: 32px;
		font-weight: 700;
		color: #025b7d;
		margin-bottom: 56px;
		&::before {
		  content: "";
		  display: block;
		  height: 50px;
		  background: url("../images/icon-staff.svg") no-repeat top center / contain;
		}
	}
	.staff-list {
		display: flex;
		flex-wrap: wrap;
		gap: 16px;
		li {
			width: calc((100% - 32px) / 3);
			background-color: #fff;
			padding: 16px 16px 70px 16px;
			position: relative;
			.staff-info {
				width: 100%;
				display: grid;
				grid-template-columns: 30% 1fr;
				grid-template-rows: auto auto;
				gap: 10px;
				.faceicon {
					img {
						width: 100%;
					}
				}
				.name {
					padding-top: 15px;
					text-align: center;
					dt {
						font-size: 14px;
						font-weight: 500;
					}
					dd {
						font-size: 26px;
						font-weight: 700;
						color: #025b7d;
					}
				}
				.intro {
					font-size: 15px;
					grid-column: 1 / 3;
				}
			}
			.btn {
				position: absolute;
				right: 0;
				left: 0;
				bottom: 16px;
				width: 60%;
				margin: 0 auto;
				font-size: 14px;
				text-align: center;
				display: none;
				a {
					display: block;
					background-color: #025b7d;
					color: #fff;
					padding: 8px 0 10px;
					border-radius: 20px;
					position: relative;
					&::after {
						content: "";
						background: url(/cmn/icon/icon_arrow_right_white.svg) no-repeat center center / cover;
						width: 10px;
						height: 20px;
						position: absolute;
						top: 0;
						right: 10px;
						bottom: 0;
						margin: auto;
					}
				}
				&.type1:has([href^="https://customer-reception"]) {
					display: block;
				}
				&.type2:has([href^="https://docs.google.com/"]) {
					display: block;
				}
			}
		}
	}
}
	
	
/*------------------------------------------------
	検索ボックス
--------------------------------------------------*/
#searchArea {
  background: url("../images/search-bg.jpg") no-repeat bottom center / cover;
  padding: 60px 0;
}

/*------------------------------------------------
	おすすめ特集(中四国仕様)
--------------------------------------------------*/
.tokusyuWrap {
 margin-top:80px;
}

.tokusyuWrap .title-section-category {
 text-align:center;
 font-size:40px;
 font-weight: bold;
}

.tokusyu, .reco-banner__list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.reco-banner__list {
  padding: min((39vw / 7.5), 30px);
  gap: min((38vw / 7.5), 40px);

}
.reco-banner__item {
  width: min((296vw / 7.5), 192px);
}
.tokusyu li a, .reco-banner__link {
  display: block;
  box-shadow: 0px 0px 0px 1px #000;
  transition: opacity .4s;
}
.tokusyu li a:hover, .reco-banner__link:hover {
  box-shadow: 0px 0px 0px 2px #000;
  opacity: 0.6;
}
.tokusyu li img, .reco-banner__image {
  width: 100%;
}

/*------------------------------------------------
	円バナー/スタッフバナー
--------------------------------------------------*/
#fix-bnr {
  /*display: none;*/
  position: fixed;
  right: 14px;
  top: 250px;
  z-index: 100;
  & a {
    display: block;
    & img {
      /*width: 200px;
      filter: drop-shadow(2px 5px 0 rgba(0, 0, 0, 0.3));*/
    }
  }
  & .close {
    position: absolute;
    right: -5px;
    top: -5px;
    & a {
      width: 24px;
      height: 24px;
      background-color: #D0D0CB;
      border-radius: 50%;
      text-align: center;
      font-size: 16px;
      font-weight: bold;
      line-height: 24px;
      color: #404040;
      text-decoration: none;
    }
  }
}
/*------------------------------------------------
        LINEお友達登録ボタン
--------------------------------------------------*/
.line-wrap-detail {
        padding: 20px 0; /*ページによって調整*/
}
.line-inner {
        width: 992px;
        margin: 0 auto;
        text-align: center;
        letter-spacing: 0.1vw;
        line-height: 1.5;
}
.line-wrap-detail .line-inner {
        background: #fff;
        border: solid 1px #d3d3d3;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        letter-spacing: 1px;
}
.line-inner .head {
        width: 100%;
        text-align: center;
        background-color: #15c618;
        padding: 6px;
        color: #fff;
        font-size: 20px;
        line-height: 1.5;
        font-weight: bold;
}
.line-inner .textarea {
        width: 75%;
        text-align: left;
        padding: 30px 0 30px 30px;
}
.line-inner .btnarea {
        width: 23%;
        padding: 10px 20px 10px 0;
}
.line-inner .text1 {
        font-size: 17px;
        line-height: 1.4;
}
.line-inner .text1 span {
        display: inline-block;
        font-weight: bold;
        color: #fb0b0b;
        background-color: #ffe1e1;
        padding: 0 2px;
}
.line-inner .text2 {
        font-size: 21px;
        font-weight: bold;
        margin-bottom: -2px;
        background: linear-gradient(transparent 60%, #fff231 0%);
        display: inline-block;
        line-height: 1.7em;
        padding: 0 4px;
}
.line-button a {
        display: block;
        color: #fff;
        font-size: 15px;
        text-align: center;
        font-weight: bold;
        border-radius: 8vw;
        box-shadow: 0px 3px 0px 0 rgba(0, 0, 0, .14);
        background: url(/kansai/images/icon/icon-linekansai.png) no-repeat;
        background-size: 50px;
        background-position: 12px;
        background-color: #15c618;
        padding: 10px 10px 6px 70px;
        position: relative;
        text-decoration: none;
}
.line-button a:hover {
        opacity: .8;
        transition: all 0.6s ease;        
}
.line-button a span.small {
        width: 88%;
        display: block;
        font-size: 14px;
        font-weight: normal;
}
.line-button a span.strong {
        display: block;
}
.line-button a span.strong::after {
        font-family: "FontAwesome", "Font Awesome 5 Free";
        font-weight: 700;
        content: "\f138";
        font-size: 15px;
        margin-left: 6px;
        padding-right: 14px;
}
.line-button a span.line-friend {
        font-size: 1.3;
        color: #fff231;
        padding: 0 2px;
}
.line-qr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
}
.line-qr span:nth-child(1) {
        width: 50%;
        font-size: 14px;
        font-weight: bold;
        line-height: 1.3;
}
.line-qr img {
        width: 50%;
}
.line-qr span:nth-child(3) {
        width: 100%;
        font-size: 13px;
}
.line-qr a {
        text-decoration: underline;
}


/*-----------------------------------------
検索BOX
-----------------------------------------*/
/*検索ボタンリセット*/
#searchArea {
  & select {color: #333;}
  & .rn-searchMod__inputField, .rn-searchMod__select, .rn-searchMod__toggle {
    font-size: 14px !important;
  }
  & .rn-searchMod__buttonSearchWrap a {
    font-size: 15px !important;
    padding: 14.6px 15px 16px 80px!important;  
  }
  & .rn-searchMod__formDomLink {
    font-size: 12px !important;
  }
  &.rn-searchMod__label::before {
    font-size: 10px !important;
  }
}

/*---------------------------------------------
ios用調整
----------------------------------------------*/
.product-list.card-style > li .product-list__item .item-photo__wrapper .item-txt__port {
  margin-top: -1px;
}
.product-list__item {
  -webkit-text-size-adjust: none;
}
/*----------------------------------------------
	終了
------------------------------------------------*/
#close {
  padding: 100px 0;
  background-color: #fbf9ef;
  text-align: center;
  font-size: 18px;
  line-height: 1.8;
}

/*----------------------------------------------
SEO
------------------------------------------------*/
#seo {
	width: 100%;
	background-color: #f8f8f8;
	padding: 40px 0;
	.inner {
		background-color: #fff;
		border: solid 1px #222;
		border-radius: 8px;
		padding: 16px;
	}
	h2 {
		text-align: center;
		font-weight: 700;
		font-size: 18px;
	}
	p {
		text-align: center;
	}
}
/*----------------------------------------------
	新仕様改修
------------------------------------------------*/
/*パンくず*/
.ui-static-breadcrumb-list {
	margin: 0;
}
/*ページトップ*/
.goTop {
	& a {
		display: flex;
        cursor: pointer;
        align-items: center;
        justify-content: center;
		border-radius: 50%;
        background-color: rgba(105, 113, 128, .5);
        width: 48px;
        height: 48px;
		& img {
			width: 24px;
			height: 24px;
		}
	}
}

/*----------------------------------------------
  検索ボタン文字色修正（PC用）
------------------------------------------------*/
.contents {
  & .rn-searchMod__buttonSearch,
  & .rn-searchMod__buttonSearch * {
    color: #fff !important;
  }
}

/*----------------------------------------------
  中部 ニャチャンの楽しみ方
------------------------------------------------*/
.ui-static-section-wrapper {
  padding-top: 80px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 0px;
}

#lead .plan {
  background-color: #ffffff !important;
	background-image: url("../images/point-bg-2.png"), url("../images/point-bg-2.png");
  background-repeat: no-repeat, no-repeat;
  background-position: left -100px top -100px, right -100px bottom -100px;
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  padding: 20px 0 !important;
  margin-top: 50px !important;
  margin-bottom: 0px !important;
}

/* タイトル・吹き出し部分 */
#lead .plan .title {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 20px !important;
}

#lead .plan .title .sub {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 291px !important;            /* 吹き出し画像の横幅に固定 */
  box-sizing: border-box !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #025b7d !important;
  padding-bottom: 24px !important;    /* 吹き出しの尻尾ぶんの下余白 */
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  background: url("../images/point-fukidashi-2.png") no-repeat bottom center / 100% auto !important; /* 画像全体をフィット */
}

#lead .plan .title h2 {
  display: block !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  color: #025b7d !important;
  line-height: 1.3 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* カード内部の見出し・画像・強調テキスト */
#lead .plan h3 {
  display: block;
  background: #025b7d;
  color: #fff;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 700;
  padding: 2px 0;
  margin-bottom: 8px;
}

#lead .plan img {
  max-width: 100%;
  height: auto;
}

#lead .plan .red_b {
  font-size: 1.125rem;
  font-weight: bold;
  color: #ff6600;
  display: inline-block;
  margin-bottom: 4px;
}


/*================================================
  タブ切り替え ＆ タブ内コンテンツ補正 CSS（追加分）
==================================================*/

/* ----------------------------------------------
   1. タブコンポーネント（表示制御・基本配置）
------------------------------------------------- */
.ui-static-tab-container {
  width: 1104px;
  max-width: 96%;
  margin: 0 auto 60px;
}

/* 非アクティブなタブコンテンツを非表示 */
.ui-static-tab-content-item {
  display: none;
}

/* アクティブなタブコンテンツのみ表示 */
.ui-static-tab-content-item.is-active {
  display: block;
}


/* ----------------------------------------------
   2. 2つから選べる観光プラン付き (.kanko-plan)
      ※#tourの外（タブ内）へ移動したためのデザイン復元
------------------------------------------------- */

/* 外枠 */
.kanko-plan .point-list {
  width: 100%;
  border: solid 5px #fff;
  margin: 0 0 0px;
  box-sizing: border-box;
  list-style: none;
  padding: 0;
}

.kanko-plan .point-list > li {
  background-color: #fff;
  padding: 24px 32px;
}

/* 左右2カラムレイアウト（アクティブプラン / 大満喫観光プラン） */
.kanko-plan .plan-list {
  width: 100%;
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
}

.kanko-plan .plan-list > li {
  width: 50%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-self: flex-start;
  box-sizing: border-box;
}

/* 左プラン（アクティブプラン） */
.kanko-plan .plan-list > li:nth-child(1) {
  border-right: dashed 1px #999;
  padding-right: 24px;
  background: url("../images/point5-illust-1.png") no-repeat top left / 95%;
}

/* 右プラン（大満喫観光プラン） */
.kanko-plan .plan-list > li:nth-child(2) {
  padding-left: 24px;
  background: url("../images/point5-illust-2.png") no-repeat top right / 95%;
}

/* 吹き出しラベル */
.kanko-plan .plan-list .fuki {
  width: 100%;
  text-align: center;
  position: relative;
}

.kanko-plan .plan-list .fuki span {
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  padding: 4px 16px;
}

.kanko-plan .plan-list .plan1 .fuki span {
  background-color: #2892db;
}

.kanko-plan .plan-list .plan2 .fuki span {
  background-color: #00c09d;
}

/* タイトルとアンダーラインマーカー */
.kanko-plan .plan-list h4 {
  width: 100%;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  margin: 8px 0 40px;
}

.kanko-plan .plan-list .plan1 h4 mark {
  background: linear-gradient(transparent 70%, #e1f0fb 0%);
  color: #2892db;
}

.kanko-plan .plan-list .plan2 h4 mark {
  background: linear-gradient(transparent 70%, #def7f2 0%);
  color: #00c09d;
}

/* 説明テキストエリア（左）と 画像エリア（右） */
.kanko-plan .plan-list dl {
  width: 50%;
  margin: 0;
}

.kanko-plan .plan-list dl dd {
  margin-left: 0;
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.5;
  color: #2C2A29;
}

.kanko-plan .plan-list .ph {
  width: 48%;
  margin: 0;
}

.kanko-plan .plan-list .ph img {
  margin-bottom: 16px;
  max-width: 100%;
  height: auto;
  display: block;
}

/* アイコン付き見出し設定 (.icon-dt) */
.kanko-plan .plan-list dt.icon-dt {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.kanko-plan .plan-list dt.icon-dt .dt-icon {
  width: 48px;
  height: auto;
  flex-shrink: 0;
}

.kanko-plan .plan-list dt.icon-dt span {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

/*----------------------------------------------
  タブボタンデザインカスタマイズ（直角・cate-title風スタイル）
------------------------------------------------*/

.ui-static-tab-container {
	margin-top: 60px;
}


/* タブボタンリストのレイアウト（隙間なく横並び） */
.ui-static-tab-button-list {
  display: flex !important;
  width: 100% !important;
  margin-bottom: 0 !important;
}

/* タブボタン基本スタイル（直角・未選択状態） */
.ui-static-tab-button {
  position: relative !important;
  flex: 1 !important;
  border-radius: 0 !important; /* 角丸を排除して直角に */
  border: none !important;
  background-color: #e5f1f6 !important; /* 非アクティブ時の背景色 */
  color: #025b7d !important; /* 非アクティブ時の文字色 */
  padding: 12px 16px !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: background-color 0.3s, color 0.3s !important;
  box-sizing: border-box !important;
  outline: none !important;
}

/* サブタイトル（「どっちを選んでも〜」等）※設定はそのまま維持 */
.ui-static-tab-button .sub {
  display: block !important;
  font-size: 16px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  margin-bottom: 4px !important;
}

/* メインタイトル（「こだわりニャチャン！」等）※設定はそのまま維持 */
.ui-static-tab-button .main {
  display: block !important;
  font-size: 24px !important; /* cate-titleと同じ24px */
  font-weight: 700 !important; /* cate-titleと同じ太字 */
  line-height: 1.2 !important;
}

/* --------------------------------------------------
   追加箇所: Sub要素内のパーツ別設定
-------------------------------------------------- */

/* 説明文テキスト部分 */
.ui-static-tab-button .sub-text {
  display: block !important;
  font-size: 16px !important;   /* 親の .sub と同じサイズを維持 */
}
/* ホバー時の表示 */
.ui-static-tab-button:hover {
  background-color: #cce3ed !important;
}

/* アクティブ（選択中）タブのスタイル（cate-titleと同一デザイン） */
.ui-static-tab-button.is-active {
  background-color: #025b7d !important; /* cate-titleの背景色 */
  color: #ffffff !important; /* cate-titleの文字色 */
}

.ui-static-tab-button.is-active .sub {
  color: #ffffff !important;
}

.ui-static-tab-button.is-active .main {
  color: #ffffff !important;
}

/* 「〈安心の添乗員同行〉」部分 */
.ui-static-tab-button .sub-badge {
  display: inline-block !important;
  font-size: 18px !important;
  font-weight: bold !important;
  padding: 2px 15px !important;
  border-radius: 3px !important;
  margin-bottom: 10px !important;

  /* 非アクティブ時のスタイル */
  background-color: #00c09d !important; /* sub-textの文字色（背景色） */
  color: #ffffff !important;            /* 文字色：白 */
}

/* アクティブ（選択中）時の sub-badge のスタイルを追加 */
.ui-static-tab-button.is-active .sub-badge {
  background-color: #ffffff !important; /* 背景色：白 */
  color: #00c09d !important;            /* 文字色：sub-textの文字の色 */
}

/* ----------------------------------------------
   回転した四角（下部矢印ポインター）の色指定
------------------------------------------------- */

/* 非選択時の矢印を非表示 */
.ui-static-tab-button::before,
.ui-static-tab-button::after {
  background-color: transparent !important;
  border-color: transparent !important;
}

/* 選択中（is-active）の矢印を背景と同じネイビー（#025b7d）に変更 */
.ui-static-tab-button.is-active::before,
.ui-static-tab-button.is-active::after {
  background-color: #025b7d !important;
  border-color: #025b7d !important;
}

/*------------------------------------------------
	動画エリア (.movie)
--------------------------------------------------*/
#lead .plan .movie {
  width: 100%;
  margin-top: 56px;
	margin-bottom: 60px;
  text-align: center;
  display: flex;
  justify-content: center;
  gap: 0 38px;
}

#lead .plan .movie h3 {
  font-size: 18px;
  font-weight: 700;
  text-align: left;
  margin-bottom: 8px;
}

#lead .plan .movie h3::before {
  content: "▶";
  margin-right: 4px;
  font-size: 16px;
}

#lead .plan .movie iframe {
  width: 530px;
  height: 298px;
  border: none;
  max-width: 100%;
}

/* --- 動画コンテナ --- */
#lead .movie-container {
  max-width: 530px;
  margin: 0 auto 56px;
}

#lead .movie-container h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #2C2A29;
}

#lead .movie-container h3::before {
  content: "▶";
  margin-right: 4px;
}

#lead .iframe-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

#lead .iframe-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/*----------------------------------------------
  動画エリア (.movie) の h3 スタイルリセット
------------------------------------------------*/
#lead .plan .movie h3,
.movie h3 {
  background: transparent !important;
  color: #2C2A29 !important;
  padding: 0 !important;
  display: block !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  text-align: left !important;
  margin-bottom: 8px !important;
}

#lead .plan .movie h3::before,
.movie h3::before {
  content: "▶" !important;
  margin-right: 4px !important;
  font-size: 16px !important;
  color: #2C2A29 !important;
}

/*----------------------------------------------
  取消料緩和施策
------------------------------------------------*/

.cancellation-policy .text {
  border-bottom: 1px solid #ccc;
  padding-bottom: 8px;
  margin-bottom: 8px;
}

.cancellation-policy .sub-text {
  font-size: 14px;
}

/*----------------------------------------------
  早割バナー
------------------------------------------------*/

.hayawari-bnr {
  width: 100%;
  max-width: 100%;
  text-align: center;
  margin-top: 0px;
  margin-bottom: 40px;
  box-sizing: border-box;
}

.hayawari-bnr .ui-static-section-wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.hayawari-bnr img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/*----------------------------------------------
  コタキのツアーポイント部分使用
------------------------------------------------*/

/****おすすめツアー****/


section.tour h2.ui-static-heading.ui-static-heading-size-enormous.ui-static-heading-center.ui-static-heading-with-icon.heading-tour {
	color:#333333;
	font-weight:bold !important;
	margin-top: 20px;
	margin-bottom: 10px;
}

.heading-tour-title{
	font-weight:bold;
}

.color-green {
	color:#2e7d32;
}

.ui-static-heading.ui-static-heading-size-enormous.ui-static-heading-center.heading-tour-title.color-green {
 font-size: 25px;
	}

/* --- セクション全体 --- */
.tour-section {
    background-color: #f5f4fd;
    padding: 40px 10px 40px 10px;
}

/****ツアー見出し部分****/
.point-heading-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-top: 0;
    margin-bottom: 10px;
}

/****タグ****/

.tour-tag.size-small.color-purple {
	display: block;
	width: fit-content;
	border: 1px solid #6f23f2;
	color:#6f23f2;
	background-color:#FFFFFF;
	font-size: 16px;
    font-weight: bold;
    padding: 2px 12px;
    border-radius: 50px;
	margin: 0 auto;
}

/****ツアー名見出し****/
h4.ui-static-heading.ui-static-heading-size-huge.ui-static-heading-left.ui-static-heading-with-subtitle-top {
	font-weight:bold;
	margin-top: 10px;
	margin-bottom: 20px;
	}

/****ツアーポイントリスト****/

/* 外側の枠 */
.point-list-wrapper {
  margin: 0 auto !important;
  width: 90%;
  padding: 0px 20px;
  background-color: #ffffff;
}

/* リスト全体 */
.point-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.point-item {
  display: flex;
  align-items: center;
  padding: 5px 5px 5px 5px;
  margin: 20px 5px 0px 5px;
  border-bottom: 2px solid #025b7d;
  border-bottom-weight:bold;
}

/* 画像コンテナ */
.point-icon {
  width: 100px;
  height: 60px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
　margin-right: 10px;
}

/* 画像 */
.point-icon img {
  width: 100%;
  height: auto;
  display: block;
}

/* テキスト */
.point-text {
  margin-botton: 0px;
  font-size: 16px;
  font-weight: bold;
  color: #333333;
  line-height: 1.5;
}

/*商品*/

.is-tour {
	padding:10px;
	margin-bottom: 60px;
}

.is-tour li {
	background-color:#fff;"
}
.ui-static-grid-lg-space-article-card {
        margin-top:20px;
    }

.card__imgTag {
          padding: 2px 8px;
          font-size: 12px;
          font-weight: bold;
          color: #fff;
          background-color: #697180;
        position: absolute;
          top: 0;
          right: 0;
          }

       &:empty {
            display: none;
}

  .ui-static-product-card[data-product-card-type=secondary] .ui-static-product-card-label {
        bottom:-22px;
	   max-width:100%;
	  text-align:left;
    }

 .ui-static-product-card[data-product-card-type=secondary] .ui-static-product-card-departure-arival-info {
        padding:0 14px;
    }

.product__list--point {
	background-color:#e90000;
	text-align:center;
	color:#fff;
	padding:3px;
	font-weight:bold;
	margin:10px 0 !important;
}

 .card__price--compact {
        display: block;
        font-size: 20px;
        color: #e90000;;
        font-weight: bold;
        word-break: auto-phrase;
      }

.card__calender,
      .product__list--notes {
        font-size: 12px;
        color: #697180;
      }


.ui-static-grid-item {
   height:100%;
	display:flex;
}

.ui-static-product-card .ui-static-product-card-inner {
    height:initial;
}

.card__imgTag {
	display:none;
}


@media (max-width: 480px) {
  .point-text {
    font-size: 14px;
  }
}

/* 商品カード下のボタン */

.ui-static-button.ui-static-button-secondary.ui-static-button-large.tour {
 margin: 0 auto;
 display: flex;
 justify-content: center;	
}

/* ２つめのツアー */

.tour-section02 {
    background-color: #f4ffef;
    padding: 40px 10px 40px 10px;
}

.point-item.color-green {
  display: flex;
  align-items: center;
  padding: 5px 5px 5px 5px;
  margin: 20px 5px 30px 5px;
  border-bottom: 2px dashed #50d528;
  border-bottom-weight:bold;
}

/* 画像コンテナ */
.point-icon.color-green {
  width: 35px;
  height: 35px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
　margin-right: 10px;
}

/* 画像 */
.point-icon.color-green img {
  width: 100%;
  height: auto;
  display: block;
}

.tour-tag.size-small.color-green {
	display: block;
	width: fit-content;
	border: 1px solid #2e7d32;
	color:#2e7d32;
	background-color:#FFFFFF;
	font-size: 16px;
    font-weight: bold;
    padding: 2px 12px;
    border-radius: 50px;
	margin: 0 auto;
}

/* 3つめのツアー(ファミリー) */

.tour-section03 {
    background-color: #fff5e5;
    padding: 40px 10px 40px 10px;
}

.point-item.color-brown {
  display: flex;
  align-items: center;
  padding: 5px 5px 5px 5px;
  margin: 20px 5px 30px 5px;
  border-bottom: 2px dashed #f14300;
  border-bottom-weight:bold;
}

/* 画像コンテナ */
.point-icon.color-brown {
  width: 35px;
  height: 35px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
　margin-right: 10px;
}

/* 画像 */
.point-icon.color-brown img {
  width: 100%;
  height: auto;
  display: block;
}

.tour-tag.size-small.color-brown {
	display: block;
	width: fit-content;
	border: 1px solid #f14300;
	color:#f14300;
	background-color:#FFFFFF;
	font-size: 16px;
    font-weight: bold;
    padding: 2px 12px;
    border-radius: 50px;
	margin: 0 auto;
}


  /* --------------------------------------------------
     海外航空券＋ホテル 追加CSS
     -------------------------------------------------- */

.airhtl-section01 .ui-static-product-card .ui-static-product-card-summary-content {
	padding: 0 16px !important;
	}
.airhtl-section01 .ui-static-product-card .ui-static-product-card-summary {
	gap: 1px !important;
	}

.product__list--item {
  height: 100%;
}
.product__contents,
.product__list--item > a {
  height: 100%;
  display: flex;
  flex-direction: column;
}
/* ==========================================
   タブ2（kanko-plan）
   ========================================== */

.ui-static-tab-content-item .tab-2 {
  box-sizing: border-box;
  font-family: "Hiragino Sans", "Meiryo", sans-serif;
  color: #333;
}

.ui-static-tab-content-item .tab-2 *,
.ui-static-tab-content-item .tab-2 *::before,
.ui-static-tab-content-item .tab-2 *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.ui-static-tab-content-item .tab-2 img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ------------------------------------------
   共通枠・パーツ設定
   ------------------------------------------ */
.ui-static-tab-content-item .tab-2 .plan-cards-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ui-static-tab-content-item .tab-2 .plan-card {
  border: 1.5px solid #2bb69d;
  background-color: #fff;
  padding: 20px;
}

.ui-static-tab-content-item .tab-2 .card-header {
  margin-bottom: 12px;
}

.ui-static-tab-content-item .tab-2 .plan-badge {
  display: inline-block;
  background-color: #00b094;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  padding: 4px 16px;
  border-radius: 0px;
  margin-bottom: 6px;
}

.ui-static-tab-content-item .tab-2 .plan-title {
  color: #00b094;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.3;
  background: linear-gradient(transparent 70%, #def7f2 0%);
  display: table;
  margin-bottom: 20px;
  margin-top: 8px;
}

.ui-static-tab-content-item .tab-2 .sub-title {
  color: #008fa0;
  font-size: 18px;
  font-weight: bold;
  margin-top: 4px;
  margin-bottom: 0px;
}

.ui-static-tab-content-item .tab-2 .desc-text {
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  word-break: break-all;
}

/* ------------------------------------------
   【1・2つ目の枠】画像3枚＋右側テキスト
   ------------------------------------------ */
@media (min-width: 768px) {
  .ui-static-tab-content-item .tab-2 .layout-type1,
  .ui-static-tab-content-item .tab-2 .layout-type2 {
    display: flex;
    gap: 15px;
    align-items: flex-start;
  }

  .ui-static-tab-content-item .tab-2 .layout-type1 .image-group,
  .ui-static-tab-content-item .tab-2 .layout-type2 .image-group {
    display: flex;
    gap: 8px;
    width: 62%;
    flex-shrink: 0;
  }

  .ui-static-tab-content-item .tab-2 .layout-type1 .text-group,
  .ui-static-tab-content-item .tab-2 .layout-type2 .text-group {
    flex: 1;
  }
}

.ui-static-tab-content-item .tab-2 .img-item {
  flex: 1;
}

.ui-static-tab-content-item .tab-2 .img-label {
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: #2C2A29;
  margin-bottom: 4px;
}

/* ------------------------------------------
   【3つ目の枠】2列＋縦点線仕切り
   ------------------------------------------ */
@media (min-width: 768px) {
  .ui-static-tab-content-item .tab-2 .layout-type3 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }

  .ui-static-tab-content-item .tab-2 .layout-type3 > .col-item:last-child {
    position: relative;
    padding-left: 24px;
  }

  .ui-static-tab-content-item .tab-2 .layout-type3 > .col-item:last-child::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    border-left: 1px dashed #bbb;
  }
}

.ui-static-tab-content-item .tab-2 .item-block {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 10px;
}

.ui-static-tab-content-item .tab-2 .item-image {
  width: 45%;
  flex-shrink: 0;
}

.ui-static-tab-content-item .tab-2 .item-content {
  flex: 1;
}

/* ------------------------------------------
   【4つ目の枠】日付ヘッダー＋2列
   ------------------------------------------ */
.ui-static-tab-content-item .tab-2 .card-header-center {
  text-align: center;
  margin-bottom: 15px;
}

.ui-static-tab-content-item .tab-2 .day-title {
  font-size: 22px;
  font-weight: bold;
  color: #00b094;
}

.ui-static-tab-content-item .tab-2 .plan-title-center {
  color: #00b094;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.3;
  background: linear-gradient(transparent 70%, #def7f2 0%);
  display: table;
  margin: 8px auto 20px;
  text-align: center;
}

@media (min-width: 768px) {
  .ui-static-tab-content-item .tab-2 .layout-type4 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
}

/* CSSによる「出発」の二重付与を解除 */
.product__list--dep .js-split-departure::after,
.product__list--dep span[id*="dep_"]::after {
    content: "" !important;
}