@charset "utf-8";
/*
* ★★CSS for PC
*/

/* ------------------------------------------

------------------------------------------ */

.sp{display: none !important;}

#widewrapperW{position: relative;}
#widewrapper{width: 100%;}
#keyVisual{width: 100%; margin: 0px;}
#keyVisual img{width: 100%;}

#contents.column1{width: 100%; padding: 104px 0 100px 0; background-color: #EEF1F3; margin-top: -64px;}
#contentsArea a:hover{text-decoration: none !important;}

.box{width: 1320px; border: 1px solid #ccc; border-radius: 10px; background-color: #fff; box-sizing: border-box; margin: 0 auto 40px; padding: 40px; }
#navi-box { height: 120px;}
#navi-box{position: relative; z-index: 2; margin: 32px auto 0; padding-bottom: 40px;}
#navi-ul{display: flex; justify-content: center;}
#navi-ul li {margin: 0 10px;}
#navi-ul li div{border-bottom: 4px solid #ccc; text-align: center; padding: 0 20px 8px; width: 110px; font-size: 14px; font-weight: bold;}
#navi-ul li div.more-ul { border: none; z-index: 5;}
#navi-ul li div:hover{border-bottom: 4px solid #9ac0da; cursor: pointer;}
#navi-ul li a{display: block; text-decoration: none !important;}
.more-area{position: relative; display: block;}
.more-area:after{position: absolute; z-index: 3; content: ""; width: 16px; height: 16px; background: url(../images/down.png) no-repeat; top: -1px; right: 5px; display: block;}

.more-ul li{margin: 0 !important;}
.more-ul a{display: block; font-size: 13px; font-weight: bold; text-align: center; padding: 8px 0; width: 100%;}
.more-ul a:hover{background-color: #9ac0da; color: #fff !important;}
.more-area ul { display: block; position: absolute; z-index: 9; top: 23px; border-top-width: 4px !important; border: 1px solid #9ac0da; width: 150px; box-sizing: border-box; background-color: #fff; left: 0;}

#navi-ul li div.more_area_back { width: 100%; height: 100%; display: block; content: ""; position: fixed; top: 0; left: 0; z-index: -1; padding: 0; margin: 0; border: 0;}
#navi-ul li div.more_area_back:hover { cursor: initial; border: none;}

/* coupon */
#COUPON .cpnholder{padding: 0px; margin: 0 auto 40px; background-color: #fff;}

.ttl-box{width: 402px; margin: 0 auto 40px auto; padding-bottom: 10px; border-bottom: 4px solid #ccc; font-size: 24px; font-weight: bold; text-align: center;}
.sub-ttl-box{width: 100%; margin: 24px 0 0 0; padding: 12px 0; text-align: center; font-size: 20px; font-weight: bold; color: #fff; background-color: #9AC0DA;}
.pagebox{width: 100%; margin: 24px 0 0 0; overflow: hidden; padding: 40px; box-sizing: border-box; background-color: #F6F6F6; border-radius: 10px;}
.pagebox a{display: block;}
.pagebox a:hover{opacity: 0.8;}
.pagebox img{display: block; float: left; margin-right: 2%; width: 36%;}
.pagebox p{display: block; float: right; width: 62%; font-size: 15px; line-height: 150%;}
.pagebox p span{display: block; font-size: 120%; font-weight: bold; margin-bottom: 10px;}

/* search */
#search-box-show{display: block; position: fixed; bottom: 0px; z-index: 99; width: 100%;}
#search-box-show img{display: block; margin: 0 auto;}
#searchSee{display: none;}
#cboxOverlay{opacity: 0.5 !important;}
#cboxLoadedContent{background: #fff !important;}
#search-box{padding: 0px; margin: 25px auto 0; border: none;}
#cboxOverlay, #cboxWrapper, #colorbox{z-index: 9990 !important;}
#ui-datepicker-div{z-index: 9999 !important;}

#gotop{position: fixed; z-index: 9999; right: 50px; bottom: 50px;}


.rt-header .rt-nav-link li.rt-nav-active a {
  background: #ccc!important;
}

.rt-footer{
  z-index: 9;
}

p.subTtl_waterblue{
	font-weight:bold;
	text-align:center;
}

.cpnholder .btmarea .overtime span {
    margin-right: 5px;
    padding-left: 22px;
}
.cpnholder li.jss { float: left;}

.pagebox { position: relative;}
.mytrip_s { position: absolute; padding: 4px 12px; font-size: 14px; color: #fff; background: #66B821; top: 0; left: 0; border-radius: 0 0 10px 0;}
span.area_s { position: absolute; padding: 4px 12px; font-size: 14px; color: #fff; background: #1896a4; top: 0; left: 0; border-radius: 0 0 10px 0;}
span.plan_s { position: absolute; padding: 4px 12px; font-size: 14px; color: #fff; background: #f76ae1; top: 0; left: 0; border-radius: 0 0 10px 0;}
span.service_s { position: absolute; padding: 4px 12px; font-size: 14px; color: #fff; background: #57adff; top: 0; left: 0; border-radius: 0 0 10px 0;}
span.point_s { position: absolute; padding: 4px 12px; font-size: 14px; color: #fff; background: #f6c500; top: 0; left: 0; border-radius: 0 0 10px 0;}
.pagebox a { display: block; height: 100%; position: relative;}
.btn_link { background: #777; color: #fff; font-size: 15px; padding: 12px 45px; position: absolute; right: 0; bottom: 0;}
.sub-ttl-box { display: none;}


p.date { font-weight: bold; text-align: center; margin-bottom: 16px;}
#COUPON { margin-top: 40px;}

.cpnholder.jssBox.allList { max-width:1200px !important; width: 100% !important; background: none !important; display: flex; justify-content: center;}
.cpnholder.jssBox.allList li.jss { width: 411px !important; padding: 0 !important; margin: 0 !important;}
a.kakunin.jss_couponPopUp { color: #1D54A7 !important;}

#COUPON.cs { position: relative;margin-top: 32px;}
#COUPON.cs::before{ display:flex; justify-content: center; align-items: center; position: absolute; top: -8px; width: 100%; z-index: 9999; height:100%; text-align: center; content: "COMING SOON..."; font-size:48px; color: #fff; background: #333; opacity: 0.65;}

ul.svs li:first-child { width: 60%;}
ul.svs li:nth-child(2){ width: 40%;}
.cpnholder .ov.guam .couponimg p:after { width: 50px; height: 71px; top: -50px; background: url(../images/logo_guam.png) no-repeat !important; background-size:50px 71px;}