/*
 * CSS for PC
/* ------------------------------------------

------------------------------------------ */
.sp {
  display: none !important;
}

#keyVisual {
  width: 100%;
  margin-bottom: 0;
}

#keyVisual h1 {
  text-indent: 0px;
}

#keyVisual h1 img {
  display: block;
  width: 100%;
}

#widewrapper {
  width: 100%;
  position: relative;
  clear: both;
  overflow: hidden;
}

#widewrapper a:hover {text-decoration: none !important;}

/*Edge*/
@supports (-ms-accelerator: true) {
  html {
    overflow: hidden;
    height: 100%;
  }
  body {
    overflow: auto;
    height: 100%;
  }
}

/*Ie 10/11*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  html {
    overflow: hidden;
    height: 100%;
  }
  body {
    overflow: auto;
    height: 100%;
  }
}

#canvas {
  position: absolute;
  width: 100%;
}

#contents.column1 {
  background: none;
  padding: 0;
  width: 100%;
}

#contentsArea {
  background-image: url(https://img.travel.rakuten.co.jp/package/special/selection/images/bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

.w1000 {
  width: 1000px;
  margin: 0 auto;
  z-index: 2;
  position: relative;
}

.w1280{
  width: 1280px;
  margin: 0 auto;
  z-index: 2;
  position: relative;}

.intro {
  font-family: 'Noto Serif JP', serif;
  padding: 60px 0;
  line-height: 180%;
  font-size: 18px;
  color: #2D1A10;
}

.intro p:first-child {
  padding-bottom: 15px;
}

.intro p:nth-child(2) {
  width: 720px;
  margin: 0 auto;
}

.intro p:last-child {
  padding-top: 15px;
}

.jdsTabNav {
  display: flex;
  justify-content: space-between;
  padding: 40px 0;
}

.jdsTabNav li {
  width: 15%;
  border: 1px solid #4A3118;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  padding: 10px 0;
  cursor: pointer;
}

.jdsTabNav li:hover {
  opacity: 0.8;
}

.jdsTabNav .here {
  background-color: #4A3118;
  color: #fff;
}

.hotelwrap {
  display: block;
  flex-wrap: wrap;
}

.hotelwrap .hotelbox {
  /* width:310px;  */
  box-sizing: border-box;
  width: calc((100% - 60px) / 3);
  border: 1px solid #C3C3C3;
  background: #fff;
  border-radius: 5px;
  margin-right: 30px;
  margin-bottom: 20px;
}

.hotelwrap .hotelbox:nth-child(3n) {
  margin-right: 0;
}

.hotelwrap .hotelbox .area {
  font-size: 13px;
  font-weight: bold;
}

.hotelwrap .hotelbox .dpicon {
  display: flex;
}

.hotelwrap .hotelbox .dpicon li {
  padding: 5px;
  width: 46%;
  margin: 2% 4% 2% 0;
  font-size: 13px;
  color: #fff;
  text-align: center;
  border-radius: 5px;
}

.hotelwrap .hotelbox .dpicon li:last-child {
  margin-right: 0;
}

.hotelwrap .hotelbox .dpicon .ana {
  background: #223F9A;
}

.hotelwrap .hotelbox .dpicon .jal {
  background: #CC0000;
}

.hotelwrap .hotelbox .name {
  text-align: left;
  color: #333;
  font-weight: bold;
  font-size: 14px; line-height: 1.4;
  min-height: 20px;
}

.hotelwrap .hotelbox .hotelimg {
    width: 100%;
    max-width: 100%;
    height: 186px;
}

.hotelwrap .hotelbox {
    display: block;float: left;
}

.hotelwrap .hotelbox a.safe {
  display: block;
  color: #395723 !important;
  border: 1px solid #395723;
  margin: 10px auto;
  border-radius: 5px;
  font-size: 10px;
  padding: 5px;
  width: 190px;
  text-align: center;
}

.hotelwrap .hotelbox a.safe:hover {
  text-decoration: none !important;
  background: #395723;
  color: #fff !important;
}

.hotelwrap .hotelbox a.info {
  display: block;
  background: #B79871;
  color: #fff !important;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  padding: 10px;
  width: 80%;
  margin: 10px auto;
  border-radius: 20px;
}

.hotelwrap .hotelbox a.info:hover {
  text-decoration: none !important;
}

.hotelwrap .hotelbox .plan {
  font-size: 12px;
  font-weight: normal;
  line-height: 150%;
  min-height: 40px;
}
.jdsTabMain.hotelwrap.tab3 p.htlArea{ min-height: 30px;}
.jdsTabMain.hotelwrap.tab5 .hotelbox .name{ min-height: 40px;}

.hotelwrap .hotelbox .btn2 {
  display: flex;
  justify-content: space-between;
  padding-top: 20px;
}

.hotelwrap .hotelbox .btn2 li {
  width: 48%;
  text-align: center;
}

.hotelwrap .hotelbox .btn2 li a {
  display: block;
  font-size: 15px;
  font-weight: bold;
  border-radius: 5px;
  padding: 10px 0;
}

.hotelwrap .hotelbox .btn2 li a:hover {
  text-decoration: none !important;
  color: #fff !important;
}

.hotelwrap .hotelbox .btn2 li .ana {
  color: #fff !important;
  border: 2px solid #1C0F81; background: #1C0F81;
}

.hotelwrap .hotelbox .btn2 li .jal {
  color: #fff !important;
  border: 2px solid #CC0000; background: #CC0000;
}


#hotelplan {
  margin-bottom: 80px;
}

#awardlink {
  margin-bottom: 80px;
}

#awardlink ul {
  display: flex;
  padding: 40px 0 0;
  justify-content: space-around;
  width: 70%;
  margin: 0 auto;
}


.navi {
  position: fixed;
  bottom: 10px;
  right: 20px;
  z-index: 999;
}

.kanbanIn h2.ttl {
  padding-bottom: 40px;
}

.pgNav { font-family: 'Noto Serif JP', serif; padding: 40px 24px 0;}
.pgNav ul {gap: 12px; display: flex; justify-content: center; align-items: center;width: 100%;}
#contentsArea .pgNav ul li a { display: flex; justify-content: center; align-items: center; background: #4A3118; color: #fff; border-radius: 40px; position: relative; padding: 0 24px;}
#contentsArea .pgNav ul li a span {white-space: nowrap;padding: 17px 32px 17px 48px;font-size: clamp(18px, 1.5vw, 20px);}
#contentsArea .pgNav ul li a:hover { color: #fff; text-decoration: none;}
#contentsArea .pgNav ul li a:after {  
  content: '';  
  display: block; position: absolute;
  width: 12px;  
  height: 12px;  
  border-right: 2px solid #fff;  
  border-top: 2px solid #fff;  
  -webkit-transform: rotate(135deg); 
  transform: rotate(135deg) translate(-50%, 50%); right:24px; top:50%;  } 
.nav1sn span { background: url(https://img.travel.rakuten.co.jp/package/special/selection/images/nav01.svg) left center no-repeat;}
.nav2sn span { background: url(https://img.travel.rakuten.co.jp/package/special/selection/images/nav02.svg) left center no-repeat;}
.nav3sn span { background: url(https://img.travel.rakuten.co.jp/package/special/selection/images/nav03.svg) left center no-repeat;}

.htlLk { position: relative; display: block;}
.htlInfo { position: absolute; color: #fff; background: rgba(0,0,0,0.6); border-radius: 4px; font-size: 12px; padding: 4px 8px; right: 12px; bottom: 12px;  }
#contentsArea .hotelbox a:hover { text-decoration: none;}
.htlArea { font-size: 12px; color: #777777; margin: 10px 0 8px 0;}
.htlPl { padding: 0 12px; display: block;}
#contentsArea .hotelbox .btn2 { padding:16px 12px}
.ttl { text-align: center; margin: auto;}

.selUl { display: flex; justify-content: space-between; margin: 40px auto 80px auto;}
.detailholder table tr:first-child td { background-color: #395723!important;}
#COUPONbox.ss-container { padding: 0!important;}
.cpnholder.jssBox.allList { width: auto;}
#COUPONbox div.greyBox , #COUPONbox .cpnholder { background: #fff!important;padding-top: 10px; padding-bottom: 30px;}
.cpnholder .char {border-bottom: 1px solid #ccc;}
#COUPONbox .cpnholder.jssBox.allList li.jss { width: 298px;}
#COUPONbox .cpnholder > li { padding: 0; margin-left: 20px; margin-right: 10px; margin-bottom: 0px;}
#cpnBk { margin-bottom: 80px;}
#COUPONbox { margin-top: 40px;}
#COUPONbox.ss-container { background: none; }
.pgH3 { font-size: 28px; color: #3A281D; text-align: center; font-family: 'Noto Serif JP', serif; margin: auto auto 30px auto;}
.cpnTx { font-size:14px ; color: #3A281D; font-family: 'Noto Serif JP', serif; margin: 12px 0 40px 0;}


.column1 #search-box p.searchSubmit a{ height: 54px; text-indent: 0;}
#search-box p.searchSubmit a:hover{color: #fff;}
#search-box.verB.test #dap-search-form .ninzuDP dl.structure.new dd{width: 55%;}
.cpnholder .jss .couponimg a p:after {top: -52px;}
.cpnholder .btmarea .overtime{padding-bottom: 7px;}


.cpLinkwindow{ top:-26px; left:360px;}

ul.svs li.lft{width:60%;}
ul.svs li.rgt{width:40%;}
.tableholder { max-width: 990px!important}

.column1 #search-box .structure dt.date, #search-box.verB.test .ninzuDP .structure dt,#search-box.verB.test #dap-search-form .ninzuDP dl.structure.new dd{padding-top: 0;}


.couponOneClick .coupon__condition{position: relative;}

a:hover, a:active {
  color: #333;
}
.htlPl {
  cursor: pointer;
}
.coupon__amount__condition{
  width: 50% !important;
  line-height: 20px;
  margin-top: 5px;
}