.sp { display: none !important; } .svg{ width: 100px; height: 100px; margin: 20px; display:inline-block;} #widewrapper{width: 100%; position: relative; clear: both; font-family:'游明朝', 'Yu Mincho' , 'Noto Serif JP', serif;} #contentsArea{ padding-bottom: 60px; overflow: hidden; position: relative;} div#grpLocationArea.newHD{ float: none !important; width: 100%; margin: 0; padding: 10px 0 10px 15px; background: #fff;} .footerBg{ background: #fff; width: 100%;} a:hover { opacity: 0.8; text-decoration: none !important; } a,.htls{-webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out;} /*kv*/ .kv { position: relative; overflow: hidden; height: 690px;} .kv h1{ position: absolute; left: 0; top: 88px; z-index: 9; line-height: 1.5; color: #fff; font-weight: normal; width: 100%;} .kv h1 span{display: table; font-size: 40px; text-align: center; border-bottom: 1px solid #fff; padding-bottom: 24px; margin: 36px 0 24px 7%;} .kv h1 small{ font-size: 18px; margin-left: 7%; display: block;} .kv h1 img{ margin-left: 7%; width: 360px;} .kv .jdsSlides2{ width: 100%; overflow: hidden;} .kv .jdsSlides2 li{ width: 100%; height: 580px;} .kv .jdsSlides2 li:nth-child(1){ background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/kvBg1.jpg) center center no-repeat; background-size: cover;} .kv .jdsSlides2 li:nth-child(2){ background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/kvBg2.jpg) center center no-repeat; background-size: cover;} .kv .jdsSlides2 li:nth-child(3){ background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/kvBg3.jpg) center center no-repeat; background-size: cover;} .kv .jdsSlides2 li a{ display: block; color: #fff; width: 100%; height: 512px;} .kv .jdsSlides2 li span{ display: block; position: absolute; left: 20px; bottom: 20px;} .kv .jdsSlides2 li p{ position: absolute; right: 10px; bottom: 30px; border-radius: 50px; border:1px solid #fff; padding: 8px 32px 8px 24px;} .kv .rslides_tabs{ position: absolute; left: 0; bottom: 20px; width: 100%; display: flex; justify-content: center; z-index: 9;} .kv .rslides_tabs li{ width: 100px; height: 5px; margin: 0 5px; background:rgba(255,255,255,0.3); border-radius: 10px; text-indent: -9999px; cursor: pointer;} .kv .rslides_tabs li.rslides_here{ background: #fff;} .kv .rslides_tabs li a{display: block;} .kv .logo{ width: 100%; background: #0B0C1B; overflow: hidden; text-align: center;overflow:hidden;} .kv .logo a{position: relative; display: block; width: 100px; margin: 10px auto; padding: 12px 16px 16px; z-index:1;overflow:hidden;text-align:center;text-decoration:none;} .kv .logo img{ width: 100%;} .kv .logo .top{position:absolute;top:0;left:0;z-index:-1;width:100%;height:2px;background:#fff;transition:transform .1s;transition-delay:0s;transform:scale(0);transform-origin:left top} .kv .logo .right{top:0;width:2px;height:100%;transition:transform .1s;transition-delay:50ms;transform:scale(0);transform-origin:right top} .kv .logo .bottom,.kv .logo .right{position:absolute;right:0;z-index:-1;display:block;background:#fff;content:""} .kv .logo .bottom{bottom:0;width:100%;height:2px;transition:transform .1s;transition-delay:.1s;transform:scale(0);transform-origin:right bottom} .kv .logo .left{position:absolute;top:0;left:0;z-index:-1;display:block;width:2px;height:100%;background:#fff;content:"";transition:transform .1s;transition-delay:.15s;transform:scale(0);transform-origin:left bottom} .kv .logo a:after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;content:""} .kv .logo a:hover .top{content:""} .kv .logo a:hover .right,.kv .logo a:hover .top{transform:scale(1);transform-origin:left top} .kv .logo a:hover .bottom{transform:scale(1);transform-origin:right bottom} .kv .logo a:hover .left{transform:scale(1);transform-origin:left bottom} .tpr{ margin-top: 24px; text-align: center; font-size: 16px; line-height: 1.8;} .ttl{ font-size: 36px; position: relative; color: #B2994E; display: table; margin: 0 auto;} .ttl::before{ content: ""; display: block; width: 64px; height: 1px; background: #B2994E; position: absolute; left: -88px; top: 50%;} .ttl::after{ content: ""; display: block; width: 64px; height: 1px; background: #B2994E; position: absolute; right: -88px; top: 50%;} .ss-container{ margin: 80px 0 40px; border-radius: 0 !important; background: none; color: #C9C4B8;} .ss-container.navy{ background: rgba(252, 249, 243, 0.06) ; padding: 80px 0;} .bnr2{ text-align: center; margin: 64px auto 0;} .htls{ width: calc(25% - 16px); margin: 0 8px; border:1px solid #C9C4B8; background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/cmn_bg.jpg); box-sizing: border-box;} .htls a{ display: block; color: #333 !important;} .htls .photo{ background-position: center; background-size: cover; width: 100%; height: 170px;} .htls .photo img{ width: 100%;} .htls .photo a{ display: block; width: 100%; height: 170px;} #selection .photo{ height: 170px;} .htls .name{ font-size: 22px; margin: 20px 16px 0; text-align: center; padding-bottom: 24px; position: relative;} .htls .name::after{ display: block; content: ""; width: 50px; border-bottom: 1px solid #C9C4B8; position: absolute; left: 50%; margin-left: -25px; bottom: 0;} .htls .name span{ display: block; margin-top: 8px; font-size: 12px;} .htls .txt{ margin:24px 16px 0; font-size: 14px; line-height: 1.6;} .htls .price{ margin: 24px 24px 0; text-align: right; font-size: 14px;} .htls .price b{ font-size: 22px;} .htls .btn{ margin: 24px; position: relative;} .htls .btn a{ margin-top: 8px; display: block; border: 1px solid #000; color: #000; font-size: 14px; letter-spacing: -0.1em; text-align: center; padding: 8px 6px; background: #FCF9F3 url(https://img.travel.rakuten.co.jp/platinum/2022/images/arrow.png) 98% center no-repeat; background-size: 15px; } .htls .btn a:hover{ opacity: .5;} .htls .guid{ margin: 0 16px 24px;/* font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif; */} .htls .guid .tit{ border-bottom: 1px solid #dcdcdc; height: 12px; margin-bottom: 12px;} .htls .guid .tit span{ display: block; width: 100px; background: #000; font-size: 12px; color: #FCF9F3; text-align: center; padding: 4px 0; } .htls .guid .pr a{ font-size: 13px; color: #000 !important; line-height: 1.4;} .htls .guid .pr a:hover{ text-decoration: underline !important;} .seleBox{ margin: 0 auto; display: flex; justify-content:flex-start; flex-wrap: wrap;} .seleBox .htls{ border: none; background: #FCF9F3; color: #333; margin: 40px 8px 0;} .seleBox .htls .name{ padding-bottom: 0;} .seleBox .htls .name::after{ content: normal;} .seleBox .htls .txt{ margin-bottom: 24px;} #prem .seleBox{ max-width: 1280px; width: 100%; justify-content: center;} #guid .seleBox .htls .txt{ margin: 16px 16px 24px;} #guid .seleBox .htls .txt small{ display: block; text-align: right; margin-top: 24px;} .jdsTab{ max-width: 1280px; width: 100%; margin: 40px auto 0;} .jdsTabNav{ display: flex; justify-content: center;} .jdsTabNav li{ padding: 12px 14px; background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/cmn_bg.jpg); text-align: center; font-size: 16px; border: 1px solid #C9C4B8; margin: 2px 2px 0; cursor: pointer;} .jdsTabNav li.long{ width: 140px;} .jdsTabNav li.active{ background: #C9C4B8; color: #333; position: relative;} .jdsTabNav li.active::after{ content: "";width: 0; height: 0; border-style: solid; border-width: 8px 6px 0 6px; border-color: #c9c4b8 transparent transparent transparent; position: absolute; left: 50%; margin-left: -4px; bottom: -9px;} .jdsTabMain .ttls{ font-size: 22px; display: table; color: #C9C4B8; margin: 64px auto 0; text-align: center; padding-bottom: 8px; position: relative;} .jdsTabMain .ttls::after{ display: block; content: ""; width: 80%; border-bottom: 1px solid #C9C4B8; position: absolute; left: 50%; margin-left: -40%; bottom: 0;} .swiper-container{ max-width: 1280px; width: 100%; margin: 40px auto 0;} .swiper-container .swiper-wrapper{ flex-wrap: nowrap; padding-bottom: 24px; } .swiper-container .swiper-wrapper .htls{ margin: 0; transform: translate(1px , 0); height: auto;} .swiper-scrollbar{ background: rgba(255,255,255,0.2);} .swiper-scrollbar-drag{ background: #B2994E;} #pickup{ margin-top: 0;} #pickup .swiper-container{ overflow: visible; margin: 80px auto 0;} #pickup .hideBox{ overflow: hidden; max-width: 1280px; width: 100%; margin: 0 auto; padding:0 0 50px;} #pickup .swiper-slide-active{ transform:scale(1.1) !important; z-index: 99;} #pickup .wn{ font-size: 12px; margin: 24px auto 0; line-height: 1.4;} .vdBox{ width: 950px; margin: 40px auto 0; border: 1px solid #C9C4B8; background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/cmn_bg.jpg); display: flex; justify-content: space-between; align-items: center;} .vdBox .mv{ width: 400px; height: 100%; background: #000;} .vdBox .mv video{ width: 100%;} .bc-player-BkgcEiWAZ7_default{ height: 230px;} .vdBox .rtBox{ width: calc(100% - 448px); margin: 0 24px; padding-top: 16px;} .vdBox .rtBox .txt{ font-size: 14px; line-height: 1.6;} .vdBox .rtBox .txt b{ display: block; font-size: 22px; margin-bottom: 8px;} .vdBox .rtBox .btn{ display: flex; justify-content: flex-end; margin: 24px 0;} .vdBox .rtBox .btn a{ display: block; color: #333; font-weight: bold; padding: 8px 56px 8px 24px; background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/arrow2.png) 90% center no-repeat #C9C4B8; border-radius: 50px;} .gotop { position: fixed; bottom: 10px; right: 10px; z-index: 99;} /* JS 画面遷移 */ /*========= ローディング画面のためのCSS ===============*/ #splash { overflow: hidden; position: absolute; width: 100%; height: 100%; background: #333; z-index: 9999999; text-align:center; color:#fff; } #splash-logo { position: absolute; top: 50vh; left: 50%; transform: translate(-50%, -50%); font-size: 25px; width: 1em; height: 1em; border-radius: 50%; position: relative; text-indent: -9999em; -webkit-animation: load5 1.1s infinite ease; animation: load5 1.1s infinite ease; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } @-webkit-keyframes load5 { 0%, 100% { box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7); } 12.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5); } 25% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 37.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 50% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 62.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 75% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 87.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff; } } @keyframes load5 { 0%, 100% { box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7); } 12.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5); } 25% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 37.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 50% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 62.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 75% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); } 87.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff; } } /*========= 画面遷移のためのCSS ===============*/ #widewrapper{ overflow: hidden; } /*画面遷移アニメーション*/ .splashbg{ display: none; } /*bodyにappearクラスがついたら出現*/ body.appear .splashbg{ display: block; content: ""; position:absolute; z-index: 999; width: 100%; height: 100%; top: 0; left: 0; transform: scaleY(0); background-color: #333;/*伸びる背景色の設定*/ animation-name:PageAnime; animation-duration:1.2s; animation-timing-function:ease-in-out; animation-fill-mode:forwards; } @keyframes PageAnime{ 0% { transform-origin:bottom; transform:scaleY(0); } 50% { transform-origin:bottom; transform:scaleY(1); } 50.001% { transform-origin:top; } 100% { transform-origin:top; transform:scaleY(0); } } /*画面遷移の後現れるコンテンツ設定*/ #container{ opacity: 1;/*はじめは透過0に*/ position:absolute; width: 100%; height: 100%; background: #fff; z-index: 99; } /*bodyにappearクラスがついたら出現*/ body.appear #container{ animation-name:PageAnimeAppear; animation-duration:1s; animation-delay: 0.8s; animation-fill-mode:forwards; } @keyframes PageAnimeAppear{ 0% { opacity: 1; } 100% { opacity: 0; } } /* / JS 画面遷移 */ /* / JS 背景変化 */ #particles-js{ opacity: 1; transition: all 0.3s ease-in-out; } #particles-js.active{ opacity: 0; } /* / JS 背景変化 */ /* slideshow */ .bgAnima { background: url(https://img.travel.rakuten.co.jp/platinum/2022/images/LUXURY_SELECTION.png) repeat-x; height: 100px; margin-bottom: 60px; text-align: center; animation: bgAnima 20s linear infinite normal; -ms-animation: bgAnima 20s linear infinite; } @keyframes bgAnima { from { background-position: 0 0; } to { background-position: -1300px 0; } } @-ms-keyframes bgAnima { from { background-position: 0 0; } to { background-position: -1300px 0; } } #sns{ background: none !important; padding: 64px 0 0 !important;} /* prem */ #prem .mainTtl{ font-size: 36px; position: relative; color: #B2994E; display: table; margin: 0 auto; padding: 0;} #prem .mainTtl::before{ content: ""; display: block; width: 64px; height: 1px; background: #B2994E; position: absolute; left: -88px; top: 50%;} #prem .mainTtl::after{ content: ""; display: block; width: 64px; height: 1px; background: #B2994E; position: absolute; right: -88px; top: 50%;} #prem .lxs{ max-width: 1280px; width: 100%; margin: 0 auto; display: flex; justify-content: center; flex-wrap: wrap;} #prem .lxs li{width: calc(25% - 16px); box-sizing: border-box;background: #FCF9F3; color: #333; margin: 40px 8px 0;} #prem .lxs li a{ display: block;} #prem .lxs li .lxImg img{ width: 100%;} #prem .lxs li .lxMain{ margin: 24px 16px; font-size: 14px; line-height: 1.6;} #prem .lxs li h4{font-size: 22px; margin:0 16px 16px; text-align: center; font-weight: normal;} .htls .price span{display: block; text-align: left; font-size: 13px; padding: 5px 0; line-height: 130%;} /* 202206 */ #prmCp{ background: #06101A; margin:0; padding:80px 0; overflow: hidden;} .prmcp{display: flex; justify-content: center; background: url(https://img.travel.rakuten.co.jp/platinum/202206/images/prmcpbg.png) center 18px no-repeat #FCF9F3; padding: 18px 42px 36px; width: 864px; height: 265px; margin: 0 auto;} .prmcp .lf{width: 50%; text-align: center; padding-top: 32px;} .prmcp .rt{ width: 50%;} #prmCp .wn{ width: 946px; margin: 16px auto 0; font-size: 12px; color: #C9C4B8;} /* Searchbox */ #Searchbox{ max-width: 1280px;min-width: 1120px; margin: 80px auto 0; padding:0 0 50px;} #search-box{ background: #FCF9F3; border: none; border-radius: 10px;} #search-box.verB #search-box-body{ padding: 50px 32px 24px;} #search-box.verB.test .dhAll{ background: #fff; box-shadow: none;} #search-box p.searchSubmit a{ text-indent: 0; line-height: 50px; height: 50px;} #search-box p.searchSubmit a:hover{ color: #fff !important;} /* 202303 */ #contentsArea #sns{ padding-top: 10px !important;} /* 202305 */ .mapPopUp { width: 350px; left: calc(50% - 175px); } .popUpplan>p#popUpplan{ font-weight: 500; font-family: '游明朝', 'Yu Mincho', 'Noto Serif JP', serif; padding: 32px;} .popUpplan>p#popUpplan dl dt{ text-align: center; font-size: 16px; } .popUpplan>p#popUpplan dl dd{ margin-top: 8px;} .popUpplan>p#popUpplan dl dd a{ display: block; color: #fff; font-size: 16px; padding: 4px 0; text-align: center; letter-spacing: 2px;} .popUpplan>p#popUpplan dl dd a.ana{ background: #1B0E80 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAydpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAxIDc5LjE0NjI4OTk3NzcsIDIwMjMvMDYvMjUtMjM6NTc6MTQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyNS4xIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBNUEzQTA5RjBDMTkxMUVGQjQ5MUJFNzhCQjYwN0Y4MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBNUEzQTBBMDBDMTkxMUVGQjQ5MUJFNzhCQjYwN0Y4MCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkE1QTNBMDlEMEMxOTExRUZCNDkxQkU3OEJCNjA3RjgwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkE1QTNBMDlFMEMxOTExRUZCNDkxQkU3OEJCNjA3RjgwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ZW/E9AAAAJNJREFUeNqs1c0JgDAMBeC2OEBH6Ci6gRupm+gkruIICp4EqSn0JP1J0jx4hEL56KVEe+8VJu9zOxg9dK3dNQqfEzrFFtMR0QG6x/MigYYcGJiKomAOWoW5aBFuQbNwK5qEJdA/fBklHyuFuvjKDTobaZD691FgK5oEW9AsyEWLIAetglQUBYZowjqxMEbMOvkEGAB5EjONgZjXuAAAAABJRU5ErkJggg==) 95% center no-repeat;} .popUpplan>p#popUpplan dl dd a.jal{ background: #CC0001 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAydpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAxIDc5LjE0NjI4OTk3NzcsIDIwMjMvMDYvMjUtMjM6NTc6MTQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyNS4xIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBNUEzQTA5RjBDMTkxMUVGQjQ5MUJFNzhCQjYwN0Y4MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBNUEzQTBBMDBDMTkxMUVGQjQ5MUJFNzhCQjYwN0Y4MCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkE1QTNBMDlEMEMxOTExRUZCNDkxQkU3OEJCNjA3RjgwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkE1QTNBMDlFMEMxOTExRUZCNDkxQkU3OEJCNjA3RjgwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ZW/E9AAAAJNJREFUeNqs1c0JgDAMBeC2OEBH6Ci6gRupm+gkruIICp4EqSn0JP1J0jx4hEL56KVEe+8VJu9zOxg9dK3dNQqfEzrFFtMR0QG6x/MigYYcGJiKomAOWoW5aBFuQbNwK5qEJdA/fBklHyuFuvjKDTobaZD691FgK5oEW9AsyEWLIAetglQUBYZowjqxMEbMOvkEGAB5EjONgZjXuAAAAABJRU5ErkJggg==) 95% center no-repeat;} .popUpplan>p#popUpplan dl dd a.jr{ background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAUCAYAAABiS3YzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAydpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAxIDc5LjE0NjI4OTk3NzcsIDIwMjMvMDYvMjUtMjM6NTc6MTQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyNS4xIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBNUEzQTA5RjBDMTkxMUVGQjQ5MUJFNzhCQjYwN0Y4MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBNUEzQTBBMDBDMTkxMUVGQjQ5MUJFNzhCQjYwN0Y4MCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkE1QTNBMDlEMEMxOTExRUZCNDkxQkU3OEJCNjA3RjgwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkE1QTNBMDlFMEMxOTExRUZCNDkxQkU3OEJCNjA3RjgwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ZW/E9AAAAJNJREFUeNqs1c0JgDAMBeC2OEBH6Ci6gRupm+gkruIICp4EqSn0JP1J0jx4hEL56KVEe+8VJu9zOxg9dK3dNQqfEzrFFtMR0QG6x/MigYYcGJiKomAOWoW5aBFuQbNwK5qEJdA/fBklHyuFuvjKDTobaZD691FgK5oEW9AsyEWLIAetglQUBYZowjqxMEbMOvkEGAB5EjONgZjXuAAAAABJRU5ErkJggg==) 95% center no-repeat;} .seleBox .htls .details{ z-index: 10; position: absolute; left: -16px; top: calc(100% + 16px); width: 100%; background: #FFF; padding: 32px 16px 24px; box-shadow: 0 0 5px #ccc; font-weight: 500; font-family: '游明朝', 'Yu Mincho', 'Noto Serif JP', serif;} .seleBox .htls .back { width: 100%; height: 100%; background: rgba(0, 0, 0, 0); position: fixed; top: 0; left: 0; z-index: 9; } .seleBox .htls .details span{ display: block; position: absolute; cursor: pointer; right: 0; top: 0; width: 30px; height: 30px; text-indent: -9999999px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAApCAMAAACfvvDEAAAAkFBMVEUAAAD///////////////////////////////////////////////////////////////////////////////8AAAAKCgoQEBASEhIbGxskJCQqKioyMjI2NjY4ODhSUlJXV1dYWFhpaWlwcHCLi4uTk5Ofn5+qqqq7u7u9vb3g4ODl5eXy8vL5+fn8/Pz///8ms/lDAAAAFXRSTlMA9u3n28y1saicknFrXlhRNyQbEQe52N26AAABYElEQVR42pWVZcICIRQAsZe149ndBXP/232JYMv8MoZ+oa7o1NNCFoBsIa131DMaOk9IXjcees0E2K8mffmhP1ntgaR5L1YynNcjCRmtz2Qqt6KG7UBuGWxBq5B2ETOXRywMxXZw5BLHkTxmdKTUCZY+DeQZg5PfQBk7lOcMLeU/sZVlJq+YkW2pH4rs5DU7Sr8vg+nJP5tZONXafeoZfl4rYX0RYSKOCWzc5zWJUp0cAy9inTq1eHVArqNq7C+3bNGY6Z9o0NjLa+ypqZSlX9D8qBMnGr+VJakqMBaHE/wQx5iCytCVQLVozqszGjsRT5eMAgmZGIpA0c3oAGd69Ug1rXKcyDtTlmilg2PGzxmxz+dnn16f/dF9jv/vc3p1n/6Nwpfxqn+j8N3n1ol3736gFhFLn8ZnRMxH5FFEbkbke0QNeV2XTpQ617Vu8azWldoR9TOiJkfV+fje8b4ffQGku4zNkRKhNAAAAABJRU5ErkJggg==) no-repeat; background-size: 30px 30px; } .seleBox .htls .details dt{ text-align: center; font-size: 14px; padding-bottom: 8px;} .seleBox .htls .details a{ position: relative;background: #fff; margin: 8px 8px 0;} .seleBox .htls .details a::after{ content: ""; position: absolute; right: 15px; top: 50%; margin-top: -5px; width: 8px; height: 8px; transform: rotate(45deg);} .seleBox .htls .details a.ana{ border: 1px solid #1B0E80; color: #1B0E80 !important;} .seleBox .htls .details a.ana::after{ border: solid #1B0E80; border-width: 1px 1px 0 0;} .seleBox .htls .details a.jal{ border: 1px solid #CC0001; color: #CC0001 !important;} .seleBox .htls .details a.jal::after{ border: solid #CC0001; border-width: 1px 1px 0 0;} .seleBox .htls .details a.jr{ border: 1px solid #000; color: #000 !important;} .seleBox .htls .details a.jr::after{ border: solid #000; border-width: 1px 1px 0 0;} header{ width: 100% !important; background: #fff !important;}