@charset "utf-8";

/*
 * CSS for PC
 * @date     2025.12
 */
#widewrapper{ width: 100%; margin: 0; padding: 0; overflow: hidden; position: relative;}
.sp { display: none !important;}
#widewrapper a:hover { text-decoration: none !important; opacity: 0.85;}

#keyVisual { width: 100%; margin: 0; padding: 0; overflow: hidden; background: url(../images/keyvisual_bg.jpg) center center no-repeat; background-size:cover;}
#keyVisual h1 { display: block; width: 100%; margin: 0; padding: 0; text-indent: 0; height: 480px; text-align: center;}
#keyVisual img{ max-width: 1221px; margin-top: 40px;}

nav    { width: 100%; background: #fff; z-index: 9; height: 74px;}
nav ul { width:600px; margin:0 auto; display: flex; justify-content: center;}
nav ul li { width: 30%; align-items: center; margin: 4px 0;}
nav ul li a { width: 100%; display: flex; justify-content: center; flex-wrap: wrap; text-align: center; font-size: 18px; font-weight: bold; color: #00808E !important; padding: 6px 0;}
nav ul li a span { display:block; width: 100%;}
nav ul li a span.icon { height: 30px; margin-bottom: 4px;}
/* nav ul li:nth-child() a span.icon { height: 20px; margin:5px 0 9px;} */
nav ul li a span.icon img { width: 36px;}
nav ul li a:hover ,nav ul li.here a{ border-bottom: 2px solid #00808E;}


.cpnbox { width:100%; margin: 0 auto; padding:40px 0;position: relative;}
h2.title {text-align: center; margin: 0 auto; display: block; overflow: hidden;}
.imgfr { display: block; position: fixed; top: 60%; left: 50%; margin-left: -950px;}
.imgfl { display: block; position: fixed; top: 40%; right: 50%; margin-right: -950px;}
.imgtl { display: block; position: absolute; top: -100px;  right: 50%; margin-right: 200px;}

#COUPON { background: #FFF1CE;}
.coupon__box { width: 1040px;}

#CAMPAIGN { background: #E2F5F8;}
ul.campaign { width: auto; display: flex; flex-wrap: wrap; justify-content: center; margin-top: 40px;}
ul.campaign li {width: calc(25% - 16px); max-width: 300px; margin: 0 8px;}
ul.campaign li img { width: 100%;}

#SEARCH { background: #FFE2E5;}
#search-box.verB {max-width: 958px !important; padding: 40px; border: 2px solid #EA5A68; border-radius: 8px;}
#search-box #oh-search-form .number ul li.adult span.pc { font-size: 14px !important;  color: #fafafa;}
#search-box #oap-search-form .structure.air { display: block;}
#search-box #oap-search-form .structure dt.airClass, #search-box  #oap-search-form  .structure dt.airPlane
{ width:95% !important;}
#search-box #oa-search-form .number ul li.adult { width:50% }
#search-box #oa-search-form  .structure50.ovNin { width:calc(100% - 56px) !important ;  margin-left: 20px !important; padding-left: 36px !important;}
#search-box.verB.test #searchForeignSwitchArea2 .location .structure50.domInput {  margin-left: 0;}
#search-box.verB.test #searchForeignSwitchArea2 .location .structure50.domInput dt {  margin-right: 16px;}
#search-box.verB.test #searchForeignSwitchArea2 .structure50 dd.number ul { margin-left: 24px;}
#search-box.verB.test #searchForeignSwitchArea2 .grey50r.airCom .structure50 { margin: -12px 0 0;}
#search-box.verB.test #searchForeignSwitchArea2 .grey50r.airCom .structure50 dt , #search-box.verB.test #searchForeignSwitchArea2 .grey50r.airCom .structure50 dd { width: 100%; height: 24px;}
#search-box.verB.test #searchForeignSwitchArea2 .grey50r.airCom {padding-left: 48px !important; width: calc(50% - 56px) !important;}
#oap-search-form .grey.InpuDateBox dl.air { display: block; width: 45% !important; margin:-16px 0 0 5% !important;}
#oap-search-form .grey.InpuDateBox dl.air dt , #oap-search-form .grey.InpuDateBox dl.air dd { width: 100%; height: 24px; padding: 0 !important; margin: 0 !important;}


#sRight {
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 999;
}

#sRight .jss_switchMenu {
    position: relative
}

#sRight .jss_switchMenu dl {
    position: absolute;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    right: 0;
    bottom: 10px;
    width: 96px
}
.ss-right dd li a:hover {
    opacity: .8;
    opacity: .7
}

.ss-right {
    color: #fff;
    z-index: 16;
    right: 0;
}

.ss-right dd ul {
    border: 1px solid #00808E;
    border-radius: 5px 5px 5px 5px;
    overflow: hidden
}

.ss-right dd li {
    position: relative;
    border-bottom: 1px solid #00808E;
    font-size: 75%;
    font-weight: 700;
    text-align: center;
    line-height: 2;
}

.ss-right dd li:last-child {
    border-bottom: none
}

.ss-right dd li a {
    padding: 25px 5px 2px;
    color: #00808E !important;
    display: block;
    background: #fff;
    text-decoration: none;
    position: relative;
}

.trigger {
    width: 50px;
    height: 50px;
    cursor: pointer;
    margin: 10px auto;
    display: none;
    background: url(https://img.travel.rakuten.co.jp/special/sales/images/new/menu_open.png) center center/50px auto no-repeat
}
.pagetop {
  width: 96px;
  margin: 0 auto
}

.pagetop a {
  background-color: #00808E;
  border-radius: 5px 5px 0 0;
  display: block;
  line-height: 0;
  font-size: 0;
  height: 50px;
  position: relative
}

.pagetop a:after {
  display: block;
  position: absolute;
  top: 50%;
  right: 50%;
  width: 10px;
  height: 10px;
  margin-top: -2px;
  margin-right: -7px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  content: ""
}

.ttlicon_w:after {
  width: 32px;
  height: 32px;
  left: 50%;
  margin-left: -16px;
  top: 3px;
  display: block;
  content: "";
  position: absolute ;
}

.ttlicon_w.coupon-icon:after {
  background: url(../images/icon_coupon.svg) no-repeat; background-size: 32px;
}
.ttlicon_w.couponlimit-icon:after {
  background: url(../images/icon_couponlimit.svg) no-repeat; background-size: 30px; margin-left: -10px; top: 6px;
}
.ttlicon_w.search-icon:after {
  background: url(../images/icon_search.svg) no-repeat; background-size: 32px;
}
.ttlicon_w.campaign-icon:after {
  background: url(../images/icon_campaign.svg) no-repeat; background-size: 32px;
}

.moreCoupon {
    display: flex;
    justify-content: center;
    position: relative;
    margin: 0;
    padding: 0 20px;
}

.moreCoupon:before {
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    bottom: -40px;
    height: 140px;
    background: linear-gradient(to bottom, rgba(255, 241, 206, 0) 0, rgba(255, 241, 206, 1) 50%);
    z-index: 0;
}

.moreCoupon.disable:before {
    display: none;
}

.moreCoupon .moreCouponBtn {
    width: 800px;
    height: auto;
    background: #FFF;
    padding: 16px 0;
    color: #009700;
    font-weight: bold;
    border-radius: 4px;
    border: 1px solid #009700;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    margin-bottom: 16px;
}

.moreCoupon .moreCouponBtn:hover {
    opacity: .8;
}

.moreCoupon .moreCouponBtn::before {
    content: ""!important;
    position: static;
    transform: translateX(-5px);
    width: 32px;
    height: 32px;
    background: url(https://img.travel.rakuten.co.jp/special/sales/202601/images/btnIconCoupon.svg) no-repeat;
}

.moreCoupon .moreCouponBtn::after {
    content: "";
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-65%) rotate(135deg);
    width: 13px;
    height: 13px;
    border: 1px solid #009700;
    border-bottom: none;
    border-left: none;
    display: block;
}

.moreCoupon .moreCouponBtn.active::after {
    transform: translateY(-25%) rotate(-45deg);
}

.coupon__box {max-height:360px;}
.coupon__box.show-all {
    max-height: none;
    overflow: visible;
  }