@charset "UTF-8";
/* jyunrei.CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&display=swap');

.contents {
  font-family: 'Noto Serif JP', serif;
  color: #000;
}

/*================================================
背景グラデーション
================================================*/
.Grad__shikoku {
  background: rgb(219,240,179);
  background: linear-gradient(135deg, rgba(219,240,179,1) 0%, rgba(219,240,179,1) 50%, rgba(235,250,114,1) 100%);
}

.Grad__saigoku {
  background: rgb(229,245,255);
  background: linear-gradient(135deg, rgba(229,245,255,1) 0%, rgba(229,245,255,1) 50%, rgba(194,250,231,1) 100%);
}

.Grad__bando {
  background: rgb(255,232,208);
  background: linear-gradient(135deg, rgba(255,232,208,1) 0%, rgba(255,232,208,1) 50%, rgba(255,203,203,1) 100%);
}

/*================================================
タイトル
================================================*/
.Keyvisual {
  position: relative;
  background: rgb(54,175,109);
  background: linear-gradient(135deg, rgba(54,175,109,1) 0%, rgba(54,175,109,1) 50%, rgba(182,230,139,1) 100%);
  width: 100%;
  min-width: 1300px;
  height: 960px;
  margin-bottom: 100px;
  }

.Keyvisual::before{
  content:"";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 150px 0 0 calc(100vw - 15px);
  border-color: transparent  transparent  transparent #fff;
  transform: scale(-1, 1);
}

.Keyvisual__outer {
  background-image: url(../images/keyvisual__idx-pc.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
}

.Keyvisual__inner {
  position: relative;
  width: 1024px;
  height: 960px;
  margin: 0 auto;
}

.Keyvisual__inner h1 {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}

.Keyvisual__inner h1:before,
.Keyvisual__inner h1::after {
  content: "";
  position: absolute;
}

.Keyvisual__inner h1:before {
  top: 10px;
  right: -100px;
  background-image: url(../common/images/deco01-sml.png);
  width: 137px;
  height: 54px;
}

.Keyvisual__inner h1:after {
  left: -90px;
  bottom: 10px;
  background-image: url(../common/images/deco02-sml.png);
  width: 137px;
  height: 79px;
}

.Keyvisual__inner .Dept {
  position: absolute;
  top: 90px;
  left: calc(50% + 130px);
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background-color: #ebfa72;
  width: 130px;
  height: 130px;
  font-size: 21px;
  line-height: 1.2;
  text-align: center;
  z-index: 10;
}

.Keyvisual__inner .Seo {
  position: absolute;
  top: 80px;
  left: 0;
  z-index: 1;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    color: #FFFFFF;
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: 0.18em;
    height: 392px;
    text-shadow: 0 0 10px #000000;
    font-weight: 600;
}

.Keyvisual__inner .Photo {
  position: absolute;
  top: 320px;
  right: -145px;
  z-index: 1;
}

.Keyvisual__inner .Map {
  position: absolute;
  bottom: 150px;
  left: 0;
  z-index: 1;
}

/*================================================
アンカー・ボタン類
================================================*/
.Page__items {
  position: absolute;
  bottom: 10px;
  left: 0;
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.Page__link {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 25px 0 25px 15px;
  transition: opacity 0.5s;
}

.Page__link:hover {
  opacity: 0.3;
}

.Page__link::before,
.Page__link::after {
  content: '';
  position: absolute;
  background: #000;
}

.Page__link::before {
  top: 50%;
  transform: translateY(-50%);
  right: 9px;
  width: 40px;
  height: 1px;
}

.Page__link::after {
  top: calc(50% - 3px);
  transform: translateY(-50%) rotate(45deg);
  right: 7px;
  width: 10px;
  height: 1px;
}

.Page__item {
  width: calc((100% / 3) - 20px);
  font-size: 31px;
  font-weight: 600;
}

.Page__item small {
  display: block;
  font-size: 13px;
  font-weight: 400;
}

/*================================================
見出し
================================================*/
.Sec__ttl {
  position: relative;
  font-size: 34px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 50px;
}

.Sec__ttl::before {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  background-color: #000;
  width: 50px;
  height: 2px;
}

/*================================================
ツアー
================================================*/
.Sec-tour {
  margin-bottom: 100px;
}

.Sec-tour .Sec__ttl::after {
  content: "";
  position: absolute;
  top: -40px;
  right: 50px;
  background-image: url(../common/images/deco01-big.png);
  width: 289px;
  height: 172px;
  z-index: -1;
}

.Block__page-transition {
  border: solid 2px #F5F3F0;
  border-radius: 10px;
  background-color: #fff;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", "Osaka", sans-serif;
  margin-bottom: 20px;
  padding: 30px 50px;
}

.Select__items {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.Select__item {
}

.Select__link {
  position: relative;
  font-size: 16px;
  padding-left: 1em;
}

.Select__link:hover {
  color: #9A621A;
  text-decoration: underline;
}

.Select__link::before {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #9A621A;
  border-right: 2px solid #9A621A;
  transform: translateY(-50%) rotate(45deg);
}

.Block__recommended-tour {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", "Osaka", sans-serif;
}

.Recommended-tour {
  display: flex;
  flex-direction: column;
  border: solid 1px #D0D0D0;
  border-radius: 10px;
  background-color: #fff;
  width: calc((100% / 4) - 15px);
  margin: 0 20px 20px 0;
  overflow: hidden;
}

.tour__link {
  transition: opacity 0.5s;
}

.tour__link:hover {
  opacity: 0.5;
}

.Recommended-tour:nth-child(4n+4) {
  margin-right: 0;
}

.Tour__img {
  content-visibility: auto;
  contain-intrinsic-size: 150px;
  height: 175px;
}

.Tour__tags__wapper {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.Tour__tags {
  padding: 10px 10px 0;
}

.Tour__tags-inner {
  display: inline-block;
  border: solid 1px #73ba35;
  font-size: 12px;
  line-height: 1;
  font-family: inherit;
  color: #73ba35;
  padding: 5px;
}

.Tour__caption {
  font-size: 16px;
  font-weight: 600;
  padding: 10px 10px 0;
}

.Tour__price {
  margin-top: auto;
  padding: 10px;
}

.Tour__price-amount {
  font-size: 16px;
  font-weight: 600;
  color: #fd4013;
  text-align: right;
}

/*================================================
関連特集はこちら
================================================*/
.Sec-feature .Sec__ttl::after {
  content: "";
  position: absolute;
  top: -35px;
  left: 180px;
  background-image: url(../common/images/deco02-big.png);
  width: 289px;
  height: 172px;
  z-index: -1;
}

.Sec-feature {
  margin-bottom: 50px;
}

#SlideBanner {
	width: 974px;
}

.swiper-wrapper {
	margin-bottom: 25px;
}

.bannerCassette_content {
	width: 100%;
}

.bannerCassette_content p {
	font-size: 16px;
	line-height: 1.3;
}

.bannerCassette_content p.bannerImg {
	width: 219px;
	height: auto;
}

.bannerCassette_content img {
	width: 100%;
	height: auto;
	max-width:100%;
	max-height:100%; 
}

.swiper-banner-container {
	position: relative;
	width: 1024px;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
    display: none;
}

.swiper-button-prev,
.swiper-button-next {
    background-color: #fff;
    border-radius: 50%;
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.3));

    width: 40px;
    height: 40px;
    cursor: pointer;
    z-index: 10;

    transition: all 0.3s;

    background-image: none;
    top: calc(50% + 10px);
    transform: translateY(-50%);
}

.swiper-button-prev {
  left: 5px;
}

.swiper-button-next {
  right: 5px;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
    transition: all 0.3s;
    opacity: 0.5;
}

.swiper-button-prev::before,
.swiper-button-next::before {
    content: '';
    position: absolute;
    top: 50%;
    display: block;
    width: 12px;
    height: 12px;
    border-top: 3px solid rgba(18,138,120,1);
    border-right: 3px solid rgba(18,138,120,1);
}

.swiper-button-prev::after,
.swiper-button-next::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: 20px;
    height: 3px;
    background: rgba(18,138,120,1);
}
.swiper-button-prev::before {
  left: 15px;
  transform: translate(-50%, -50%) rotate(-135deg);
}

.swiper-button-next::before {
  left: 25px;
  transform: translate(-50%, -50%) rotate(45deg);
}

.swiper-button-prev::after {
  left: 10px;
}

.swiper-button-next::after {
  left: 10px;
}

.swiper-scrollbar-drag {
  background: #ccc;
}

.swiper-container-horizontal>.swiper-scrollbar {
  left: 0;
  width: 100%;
  background-color: #f5f5f5;
  height: 10px;
}

.hover {
  transition: opacity 0.5s;
}

.hover:hover {
  opacity: 0.5;
}