@charset "utf-8";
/*
* ★★CSS for SP
* @date 2023.6
*/


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

#widewrapper{ width:100%; position:relative; overflow:hidden;}
#contentsArea { width:100%;color:#333; z-index: 1;word-wrap:break-word;background:url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/bg.png) no-repeat left bottom #fff; margin: 0 auto; position: relative;font-family: 'Noto Sans JP', sans-serif;}
#contentsArea::before{ display: block; content: ""; position: absolute; z-index: -1; width:230px; height: 322px; top:30%; right:0; background: url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/bg_icon.png) no-repeat center center; background-size: 100%;}

/* -- Kv -- */
#keyVisual{ margin:0; line-height: 0; position: relative;}
#keyVisual h1{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; position: absolute; top: 1%; left: 0; z-index: 9; text-align: center;}
#keyVisual h1 img{ max-width:80% !important;}
#keyVisual .jdsSlides{ width: 100%; overflow: hidden; margin: 0;}
#keyVisual .jdsSlides li{ width: 100%;}
#keyVisual .jdsSlides li img { width: 100%;}
#keyVisual .rslides_tabs{ display: none; justify-content: center; margin:0; width: 100%;position: static;}
#keyVisual .rslides_tabs li{ width: 25%; margin:0;position: static;}
#keyVisual .rslides_tabs li a{position: static; display: block; width: auto; height: 8px; text-indent: -9999px; padding: 0; line-height: 0; background: #ccc; border: none; border-right:1px solid #fff;}
#keyVisual .rslides_tabs li a:hover,#keyVisual .rslides_tabs li.rslides_here a{ background: #00146E;}
p.notice { font-size: 12px; line-height: 150%; padding: 16px;}

/* -- Gotop -- */
.jdsShowFix{bottom:0;position:fixed;right:10px;z-index:9; display:block; cursor:pointer;}
.jdsShowFix a{ display:block;}
.jdsShowFix a:hover{opacity:0.7;filter:alpha(opacity=70);}


/* Search */
#contentsArea #search-box img.tl {display: block; margin-bottom:20px;}
#contentsArea #search-box { margin:0 10px 40px; padding:0; border: 0 !important; background: none; overflow: hidden;}
#contentsArea #search-box #search-box-body{display: block !important;border-radius: 8px ; background: #00146E; overflow: hidden;}
#contentsArea #search-box #overseas-search-box{ padding: 0;}
#contentsArea #search-box .searchCategory{ width: auto; margin:0; padding: 0; border: none; background: none; display: flex; justify-content: flex-end;border-bottom: 1px dashed #fff;}
#contentsArea #search-box .searchCategory li{ border: none; width: 100%; margin:0; background: none; padding: 8px; text-align: center; color: #fff; font-size: 20px; font-weight: bold;}
#contentsArea #search-box .searchCategory li span {font-weight: normal; font-size: 18px; }
#contentsArea #search-box .searchCategory li input{ display: none;}
#contentsArea #search-box .searchSwitchArea{ padding-top:16px; background: #00146E; overflow: hidden; display: flex; justify-content: center; align-items: self-start; flex-wrap: wrap;}
#contentsArea #search-box .iconSearch{ color: #fff; font-size: 14px; margin:5px 10px; background: url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/iconSearch.png) left bottom no-repeat; padding:20px 0 0 80px; width: 100%;}
#contentsArea #search-box .structure3{ margin:0 10px; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
#contentsArea #search-box .structure3 dt{ color: #fff; font-size: 16px; width: 20%; font-weight: normal; padding: 10px 0 0; float: none;}
#contentsArea #search-box .structure3 dt .note{ display: block; font-size: 12px;}
#contentsArea #search-box .structure3 dd{ width: 80%; float: none; font-size: 100%; padding: 0; margin: 0; line-height: 1; display: flex; justify-content: flex-start;}
#contentsArea #search-box .structure3 dd.number ul{ display: flex; justify-content: flex-start; width: 100%;}
#contentsArea #search-box .structure3 .selectArea{ width: 100%;}
#contentsArea #search-box .structure3 .selectArea li{ margin-bottom: 0;}
#contentsArea #search-box .inputDate{ background: url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/iconCalendar.png) 95% center no-repeat #fff; border: none; height: 40px; padding: 0 3px 0 10px; font-size: 14px; width: 48%; margin-right: 2%; box-sizing: border-box;}
#contentsArea #search-box select{ appearance:none; -webkit-appearance:none; -moz-appearance:none; background: url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/iconArrowDR.png) 95% center no-repeat #fff; border: none; border-radius: 5px; height: 40px; padding: 0 3px 0 10px; font-size: 14px; color: #000000; width: 48%; margin-right: 2%; box-sizing: border-box; margin-bottom: 10px;}
#contentsArea #search-box select.selectWidth{ width: 98%;}
#contentsArea #search-box .number ul li.adult{ width: 48%; margin-right:2%;}
#contentsArea #search-box .number ul li.child{ width: 48%; margin-right:2%; color: #fff; font-size: 16px; display: flex; align-items: center; margin-top: 0}
#contentsArea #search-box .number ul li.child a{text-align: left; line-height: 40px; display: inline-block; margin:0 0 10px; width:100%; font-size: 14px; height: 40px; background: url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/iconArrowDR.png) 95% center no-repeat #fff; padding: 0 10px; border: none; border-radius: 5px;-moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: none; -moz-box-shadow:none;-webkit-box-shadow:none; }
#contentsArea #search-box .number ul li.child a:before{ content: "子供";}
#contentsArea #search-box p.searchSubmit{ margin: 10px auto 16px; width:100%; border-radius: 5px;}
#contentsArea #search-box p.searchSubmit a{ margin: 0 8px; text-indent: 0; line-height: 1; height: auto; border: none; border-radius: 5px; background: #D7402E; color: #fff !important; font-weight: bold; font-size: 18px; padding: 12px 0 10px;}
#contentsArea #search-box p.searchSubmit a:hover{ text-decoration: none !important;}
#contentsArea #search-box select#adultNum { width: 100% !important;}



section { margin:0 auto 40px; position: relative; overflow: hidden;}
section.inform h2 { text-align: center; margin-bottom: 40px;}
section.inform h2 img { max-width: 483px;  width: 100%;}
section.inform img.tl { display: block; max-width: 305px; width: 100%; margin:0 auto 20px;}
section.inform p.text { text-align: center; font-size: 14px; line-height: 150%; margin:0 16px 40px;}
section.inform img.icon1 { display:none; width: 160px; position: absolute; top: 20px; left: -200px;}
section.inform img.icon2 { display:none; width: 159px; position: absolute; top: 0px; right: -200px;}
section.inform ul.flight { width: 100%; overflow: hidden;clear: both;}
section.inform ul.flight li { width:100%; text-align: center; margin:0 auto 40px;max-width: 450px;}
section.inform ul.flight li p.photo { text-align: center;}
section.inform ul.flight li img { width:100%; }
section.inform ul.flight li p.tip { font-size: 12px; text-align: center; padding:0 16px 16px; margin-top: -16px;}
section.inform ul.flight li span{ display: block; text-align: right;font-size: 12px;}
section.inform ul.flight li p { width: 90%; margin: 0 auto; font-size: 14px; text-align: left;line-height: 150%; padding: 0 0 16px;}


section.plans { width: 100%; overflow: hidden;}
section.plans h2 { text-align: center; margin: 0 16px;}
section.plans h2 img { max-width: 483px; width: 100%;}
#DPplan {margin:40px 16px 0;}
.ss-hotelbox { margin-bottom: 16px;}
.ss-hotelbox .ss-hotel { width: calc( 23% - 2px); float: left; margin-bottom:16px; overflow: hidden; background: #fff;}
.ss-hotelbox .hotel-img a.htlInfo { display: block; position: relative; overflow: hidden;}
.ss-hotelbox .hotel-img a.htlInfo span { display: block; position: absolute; right: 10px; bottom: 8px; color: #fff; font-size: 12px; padding: 6px; border-radius: 4px; background: rgb(0, 0, 0,0.85)}
.ss-hotelbox .hotel-img img { width: 100%; float: left;}
.ss-hotelbox .area-name { font-size: 13px; padding: 8px 4px; background: #00146E; color: #fff; text-align: center;}
.ss-hotelbox .hotel-name {font-size: 16px; font-weight: bold; padding: 8px; line-height: 20px; height: 56px; overflow: hidden;}
.ss-hotelbox .icon { display: none; justify-content: flex-start; align-items: center; margin: 0 8px 16px 0;}
.ss-hotelbox .icon li { margin-left: 8px; display: inline-block; border: 1px solid #EB6100; color: #EB6100; text-align: center; padding: 4px; font-size: 11px; border-radius: 4px;}
.ss-hotelbox .icon li.air{ background: #EB6100; color: #fff;}
.ss-hotelbox .ss-button { display: block; margin: 0 10px 16px; overflow: hidden; background: #00A0DC; color: #fff !important; border-radius: 40px; text-align: center; font-weight: bold; padding: 14px 0;}
.ss-hotelbox .hotel-price {text-align:right;position:relative;clear:both; z-index: 99;}
.ss-hotelbox .hotel-price a { display: block;}
.ss-hotelbox .hotel-price a:hover { text-decoration: none !important;}
.ss-hotelbox .hotel-price a span.details {
    display: block;
    position: relative;
    background: url(https://img.travel.rakuten.co.jp/air/tigerair/202305/images/detail.png) 100% 30%/16px 16px no-repeat;
    padding:0 16px 16px 0;
    margin-right:4px;
    font-size: 21px;
    text-align: right;
    color: #bf0000;
    font-weight: bold;
}
.ss-hotelbox .hotel-price a span.details em { font-size: 14px;}
.ss-hotelbox .jss_popOverInfo { display: none;}
.ss-hotelbox .price-info { display: block;width: 80%; position: absolute; bottom: 48px; right: 0; font-size: 12px; font-weight: normal; text-align: left; color: #fff; line-height: 16px; background:#000; opacity: 0.85; padding: 8px; border-radius: 4px;}
.ss-hotelbox .price-info:before { display: block; position: absolute; content: ""; bottom: -8px; right: 8px; opacity: 0.85;
    width: 0;
    height: 0;
    border-top: 8px solid #000;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}
.ss-hotelbox .hotel-price a span.details em.duration { font-style: normal; display: block; padding: 5px 0; font-size: 14px !important;}
.ss-hotelbox .hotel-price a span.details img { display: block; position: absolute;top:-10px; left:1%; width: 20%;}
.ss-hotelbox a.link { display: block; padding-bottom: 16px; text-align: center; font-weight: normal; font-size: 13px;}
p.note { margin:32px 16px; font-size: 12px; color: #333; line-height:150%;font-weight: 300; background: url(https://img.travel.rakuten.co.jp/kaigai_package/ana/202306/images/starfish.png) no-repeat right 90%; background-size: 30%;}

.pagetop {
    width: 50px;
    position: fixed;
    right:0 !important;
    bottom: 0 !important;
    font-size: 0;
    z-index: 1;
}
.pagetop a {
background-color: #00146E;
border-radius: 5px 5px 0 0;
display: block;
line-height: 0;
font-size: 0;
height: 35px;
right: 8px;
position: relative;
margin-bottom: 0;
}

.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: "";

}
ul.icon li.air.NH { background-color: #0B318F; border-color:#0B318F !important; color: #fff !important;} 


.coupon_txt { padding: 0 10px;}
.coupon__title { margin: 30px 0 0;}
.coupon__box__holder { padding: 30px 30px 0;}
img.tl {display: block; margin:0 auto; width: 100%; max-width: 414px;}