@charset "UTF-8";
.pc{display:none !important;}
.ss-contents{padding-bottom:0;background:#fff;position: relative;}
.ss-center{background:none; font-family:'Noto Sans JP', sans-serif;;}
.ss-container{border-bottom:0;margin-bottom:24px;overflow:hidden;padding:16px;}
#topBnr { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);}
#topBnr h1 img{width:100%;}
.Ttl1{font-size:24px;margin:0 8px 24px;text-align:center;}

.pagetop{width: 40px; margin: 0 6px 6px 0;}
.pagetop a{border-radius: 100rem; width: 40px; height: 40px; background: #FF008C;}
.pagetop a:after{margin-top: -4px;}


.contents { margin: 0 auto; padding: 32px 16px 60px; }
.contents h3 { font-size: 16px; }
.pinkBg { background: #FFF2F9; }
.ttlIcon { font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 700; font-size: 18px; color: #FF008C; text-align: center; margin-bottom: 20px; }
.ttlIcon::before { content: ""; display: block; width: 28px; height: 28px; background: url(../images/icon_s.png) no-repeat 0 0/auto 28px; margin: 0 auto 8px; }
.noticeIcon::before { background-position: -35px 0; }
.pointList { display: flex; align-items: center; justify-content: center; flex-direction: column; row-gap: 12px; }
.pointList li img { width: 100%; }
.campBoxLink { width: fit-content; margin: 0 auto; }
.campBoxLink a { display: block; border-radius: 4px; border: 1px solid #CCC; text-align: center; font-size: 14px; padding: 8px; color: #333; }
.campBoxLink a::after { content: url(https://img.travel.rakuten.co.jp/camp/mobile/202207/images/iconOpen.png); display: inline-block; margin-left: 8px; }
.campaignList { display: flex; justify-content: center; flex-direction: column; row-gap: 12px; margin: 24px auto 12px; position: relative; padding-bottom: 25px; }
.campaignList li { box-sizing: border-box; background: #F5F5F5; border-radius: 4px; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 24px; position: relative; row-gap: 16px; }
.campaignList li .campItem { color: #333; line-height: 1.5; padding: 0px 0 0px 56px; width: 100%; box-sizing: border-box; max-width: 400px;}
.campaignList li .campItem h3 { font-size: 16px; color: #333; }
.campaignList li .campItem b { font-size: 14px; margin: 8px 0 8px; font-weight: 600; display: block; }
.campaignList li .campItem a { color: #1D54A7; text-decoration: underline; cursor: pointer; }
.campaignList li .campItem small { display: block; line-height: 1.5; font-size: 12px; }
.campaignList li:first-of-type::before { content: ""; width: 48px; height: 48px; background: url(../images/plus.svg) no-repeat 0 0/auto 48px; position: absolute; right: 50%; bottom: -30px; transform: translateX(50%); z-index: 1; }
.campaignList::before { display: none; }
.campaignList::after { content: ""; width: 36px; height: 10px; background: url(../images/Polygon.svg) no-repeat 0 0/36px 10px; position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); }
.pinkFont { color: #FF008C; }
.greenFont { color: #00B900 !important; }
.greenFont span { color: #333; }
.withIcon { padding-left: 56px; position: relative; }
.withIcon::before { content: ""; position: absolute; display: block; top: 0px; left: 0; width: 48px; height: 48px; background: url(../images/icon_l.png) no-repeat 0 0/auto 48px; }
.qrCodeIcon::before { background-position: -96px 0; }
.hotelIcon::before { background-position: -48px 0; }
.pointIconL::before { background-position: -144px 0; }
.pointSection { border-radius: 4px; background: #FFFBDE; position: relative; padding: 24px 16px; margin-bottom: 32px; }
.pointSection section { padding-left: 56px; width: fit-content; margin: 0 auto; min-height: 80px; display: flex; justify-content: center; flex-direction: column; }
.pointSection section small { font-size: 12px; margin-top: 8px; }
.pointSection .withIcon::before { top: 50%; transform: translateY(-50%); }
.bnrBox h3 { margin-bottom: 12px; text-align: center; }
.bnrBox a { display: block; width: fit-content; margin: 0 auto; }
.bnrBox img { width: 100%; }
.detailholder table { background-color: #fff; border: 1px solid #b4b4b4; font-size: 13px; line-height: 1.4; position: relative; padding-bottom: 10px; }
.detailholder table tr:first-child { color: #fff; }
.detailholder table tr:last-child { border-bottom: 10px solid #fff; }
.detailholder table tr:first-child td { text-align: center !important; background-color: #333 !important; }
.detailholder table td { display: block; padding: 5px; }
.detailholder table tr td:first-child { background-color: #e1e1e1; font-weight: 700; }
.popUpplanCP, .popUpShops { width: 100%; position: fixed; left: 0; top: 0; padding: 0; height: 100%; z-index: 99999999; background: #fff; font-family: 'Noto Sans JP', sans-serif; }
.popUpplanCP h2, .popUpShops h2 { display: block; color: #fff; font-size: 16px; font-weight: normal; text-align: center; padding: 10px 0; background-color: #333; position: relative; }
.popUpplanCP h2 em, .popUpShops h2 em { position: absolute; cursor: pointer; width: 34px; height: 34px; top: 5px; right: 5px; font-size: 0; text-indent: -999999px; background: url(https://img.travel.rakuten.co.jp/special/sales/template/new_template/images/close.svg) no-repeat top left; background-size: 32px 32px; }
#cpDetail, #shopDetail { max-height: calc(100% - 48px); }
#cpDetail, .detealCPBOX, #shopDetail { overflow: auto; }
.popUpShops h2 { font-weight: 700; font-size: 18px; background: #FF008C; color: #fff; text-align: center; padding: 12px 0; }
#shopDetail { height: auto; background: #fff; }
#shopDetail .detailholder { padding: 24px 16px; }
#shopDetail a { display: block; font-size: 15px; color: #000; font-weight: 500; margin: 0 auto 16px; text-decoration: underline;}
#shopDetail a:hover { opacity: 0.8; }