@charset "utf-8";
.ss-contents{font-family: 'Noto Sans JP', sans-serif; color: #333;}
.mainTtl{ padding: 0; font-weight: 900;color: #4d4d4d;}
.mainTtl b{ font-size: 56px;}


#topBnrBox{text-align: center; background: none;}
#topBnrBox { text-align: center; background: url(https://img.travel.rakuten.co.jp/card/campaign/202301/images/topbg.png) repeat-x bottom center;}
#topBnrBox h1 {
  width: 791px;
  margin: 0 auto;
  padding: 24px 0;
  position: relative;
}
#topBnrBox h1 em {
  position: absolute;
  left: -6.5em;
  top: 28px;
  background: #00B900;
  color: #fff;
  padding: 5px 10px 8px;
  letter-spacing: 2px;
  font-weight: bold;
  border-radius: 5px;
  font-style: normal;
  font-size: 20px;
}

.tpr{ padding: 16px; background: #E9E9E9; display: flex; justify-content: center; }
.tpr li{ font-size: 12px; margin: 0 20px;}

.entryBox{ width: 950px; margin: 0 auto;}
.entryBox .txts{ font-size: 12px; text-align: center;}
.entryBox .txts a{ text-decoration: underline; color: #333;}
.entryBox .txts a:hover{ text-decoration: none ;}
.entryBox .pr{font-size: 13px; line-height: 160%; text-align: center;}

.entryBox .edate{ font-size: 16px; line-height: 1.8; width: 700px; margin: 0 auto; letter-spacing: 1px;text-align: center;}
.entryBox .edate span{ font-size: 13px; padding: 8px 12px;  border-radius: 3px; line-height: 1; margin-bottom: 12px; background-color: #eaeaea; display: inline-block; margin-right: 10px;}
.entryBox .ppup .btnp{ display: block; font-size: 13px; text-align: center; margin: 32px auto 0; position: relative; color: #333;}
.entryBox .ppup .btnp::after{ content: url(https://img.travel.rakuten.co.jp/camp/rakutencard/202205/images/iconOpen.png); margin-left: 4px;}
.btnMb{ margin: 24px auto 0; text-align: center;}
.btnMb a{ display: block; margin: 0 auto; font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif; position: relative; width: 430px; font-size: 34px; color: #fff; background: #00CA00; border-radius: 10rem; padding: 1.5rem 0; }
.btnMb a:hover{opacity: .7; transition: .2s ease-out,box-shadow .1s ease-out,-webkit-box-shadow .1s ease-out;}
.btnMb a::after{ content: "";transform: rotate(45deg);display: block; position: absolute; top: 50%; right: 0.7em; width: 0.5em; height: 0.5em; margin-top: -0.25em; border-top: 2px solid #fff; border-right: 2px solid #fff;}


#STEPBOX{ background: #EEFEE1; margin-top: 30px; overflow: hidden; padding: 60px 0;}
#STEPBOX ul{display: flex; justify-content: center;}
#STEPBOX ul li{ width: 356px; border-radius: 20px; background: #fff; box-sizing: border-box; padding-bottom: 32px; margin: 0 15px; position: relative;}
#STEPBOX ul li::after{ content: ""; display: block; position: absolute; right: -24px; top: 50%; margin-top: -18px; border-style: solid; border-width: 18px 0 18px 30px; border-color: transparent transparent transparent #29C72A;}
#STEPBOX ul li .name em{font-style: italic;font-size: 32px;font-weight: 900;}
p.tips{font-size: 13px; margin: 0 16px; text-align: center; line-height: 140%;}
#otoku p.tips{text-align: left;}
#STEPBOX ul li:last-child::after{ content: normal;}
#STEPBOX ul li .name{ text-align: center; font-weight: bold; color: #29C72A; font-size: 24px; margin-top: 32px; padding-bottom: 12px; position: relative;}
#STEPBOX ul li .photo{ text-align: center; min-height: 136px; display: flex; align-items: center; justify-content: center;}
#STEPBOX ul li .txt{ font-size: 20px; line-height: 1.6; margin: 0 16px; font-weight: 700; text-align: center; min-height: 80px;}
#STEPBOX ul li .txt span{ color: #D7402E; font-size: 26px;}
#STEPBOX ul li .txt span b{ font-size: 40px;}
#STEPBOX ul li .txt small{ font-size: 13px; font-weight: normal; display: block; }

#Members .mainTtl{ text-align: center; line-height: 1.3;}
#Members .photo{ margin: 32px auto 0; text-align: center;}
#Members .txt{ margin: 16px auto 0; text-align: center;}
#Members dl{ margin: 16px auto 0;}
#Members dl dt{ font-size: 13px; text-align: center; position: relative; cursor: pointer; text-decoration: underline;}
#Members dl dt::after{ content: " ▼"; font-size: 12px;} 
#Members dl dt.active-submenu::after{ content: " ▲";}
#Members dl dd{ margin: 32px auto 0;}
#Members ul{display: flex; justify-content: center;}
#Members ul li{ width: 300px; height: 100%; border: 1px solid #8F8E8E; border-radius: 20px; background: #fff; box-sizing: border-box; margin: 0 15px; position: relative;}
#Members ul li::after{ content: ""; display: block; position: absolute; right: -24px; top: 165px; margin-top: -18px; border-style: solid; border-width: 18px 0 18px 30px; border-color: transparent transparent transparent #00b900;}
#Members ul li:last-child::after{ content: normal;}
#Members ul li .name{ text-align: center; font-weight: bold; color: #00B900; font-size: 26px; margin-top: 32px; padding-bottom: 12px; position: relative;}
#Members ul li .txt{ font-size: 22px; line-height: 1.6; margin: 16px; text-align: center; min-height: 70px;}
#Members ul li .txt span{ color: #D7402E; font-size: 30px;}
#Members ul li .txt span b{ font-size: 40px;}
#Members ul li .txt small{ font-size: 16px; font-weight: normal; display: block; display: table; position: relative; margin-left: 10px;}
#Members ul li .txt small::before{ content: url(https://img.travel.rakuten.co.jp/camp/rakutencard/202205/images/TimeOutline.png); vertical-align: -2px; margin-right: 3px;}
#Members ul li .pst{ font-size: 14px; line-height: 1.6; font-weight: 700; background: #E5F3F1 url(https://img.travel.rakuten.co.jp/camp/rakutencard/202205/images/box.png) 10px 30px no-repeat; padding: 16px 16px 24px 100px; overflow: hidden; border-radius: 0 0 20px 20px; min-height: 160px;}
#Members ul li .pst span{ display: block; font-size: 16px; color: #BF0000;}
#Members ul li .pst span b{ font-size: 30px;}
#Members ul li .pst small{ font-weight: normal; font-size: 12px;}
#Members .btnMb{ margin: 20px 0;}

.QandA{margin-top: 30px; overflow: hidden; padding: 60px 0;}
.QandA dl{ width: 950px; margin: 0 auto 12px;}


.wn{ width: 950px; margin: 24px auto 60px; font-size: 14px; line-height: 1.6;}

.banner-container.column_3{ margin: 0 auto;  width: 972px; border-radius: 10px; }
.banner-container.column_3 .column-list{ width: 300px; margin: 24px 12px 0; padding: 0; border: none; box-shadow: none;}
.banner-container.column_3 .column-list a{ padding: 0;}

.detailholder table tr#mno td:first-child{background-color: #bf0000 !important;}

.container{max-width: 980px; margin: 32px auto 0; border: 1px solid #ccc; border-radius: 5px; font-size: 14px; line-height: 160%; color: #4d4d4d;}
.container h2{ padding: 16px 24px;}
.container h2 span{color: #D7402E;}
.container h2:hover{background: #f5f5f5; cursor: pointer;}
.container div{ padding: 16px 24px; border-top: 1px solid #ccc;}
.container dl dt{width: 3%; float: left;}
.container dl dd{width: 97%; float: left;}

a.camp_link{display: block; width: 172px; margin: 0 auto; font-size: 13px; color: #333; text-decoration: underline;}
a.camp_link:hover{color: #333; text-decoration: none;}
#campA{margin-top: 50px;}
#campB{margin-top: 50px;}
.campBox{ width: 950px; margin: 0 auto; font-size: 14px; line-height: 160%;}
.campBox div{padding: 30px; border: 1px solid #ccc; }
.campBox h3{font-size: 18px; margin-bottom: 20px;}
.campBox dl dt{font-weight: bold; color: #00CA00; font-size: 15px; margin-bottom: 5px;}
.campBox dl dd{margin-bottom: 15px;}

.container h2.jdsCoponSwitch1 {
    cursor: pointer;
    background: #fff url(https://img.travel.rakuten.co.jp/special/sales/template/test/images/arrow_QA1.png) 97% center no-repeat;
}
.container h2.jdsCoponSwitch1:hover {
    cursor: pointer;
    background: #f5f5f5 url(https://img.travel.rakuten.co.jp/special/sales/template/test/images/arrow_QA1.png) 97% center no-repeat;
}
.container h2.active-submenu{cursor: pointer;
    background: #fff url(https://img.travel.rakuten.co.jp/camp/rakutencard/202205/images/arrow_QA2.png) 97% center no-repeat;
}
.container h2.active-submenu:hover{cursor: pointer;
    background: #f5f5f5 url(https://img.travel.rakuten.co.jp/camp/rakutencard/202205/images/arrow_QA2.png) 97% center no-repeat;
}



.ss-container#search{width: 1120px;margin: 0 auto;padding: 64px 0;}

#otoku ul{width: 1120px; margin: 0 auto;display: flex;justify-content: center;}
#otoku ul li{border: 4px solid #EEFEE1; width: 260px; text-align: center; position: relative; padding: 25px 0; margin: 0 8px; border-radius: 20px;}
#otoku ul li p.otoku{font-weight: bold; font-size: 20px; min-height: 80px;}
#otoku ul li p.otoku b{color: #EC0606;font-size: 40px;font-weight: 900;}
#otoku ul li p.icon{display: flex; align-items: center; justify-content: center; min-height: 130px;}
#otoku ul li:after{display: block;content: "";position: absolute;background: url(https://img.travel.rakuten.co.jp/card/campaign/202301/images/plus.png) no-repeat;width: 36px; height: 36px;top: 44%;right: -30px;z-index: 20;}
#otoku ul li:last-child:after,#otoku ul.control li:nth-child(3):after{background: none;}
#otoku ul li:last-child:after{display: none;}
#otoku ul li:nth-child(3):after,#otoku ul.control li:nth-child(2):after{background: url(https://img.travel.rakuten.co.jp/card/campaign/202301/images/arrow.png);}

#example{background: #EEFEE1;padding: 64px 0;}
#example p.sub{font-size: 16px;text-align: center;}
#example p.img{ background-color: #fff; width: 1120px; border-radius: 12px; margin: 20px auto; text-align: center; padding: 32px 0;}
#card ul{display: flex; width: 1120px; margin: 20px auto 0; justify-content: space-between;}
#card ul li{text-align: center; width: 49%;}
#card ul li a.btn{display: inline-block; color: #fff;border-radius: 64px;background-color: #29C72A;margin: 16px auto;padding: 20px 90px;text-align: center;}
#card ul li a.btn:hover{opacity: 0.8;}
#card ul li a span:after{display: block;content: "";position: absolute;border-right: 1px solid #fff; border-bottom: 1px solid #fff;width: 10px;height: 10px;transform: rotate(-45deg);right: -10px;top: 35%;}
#card ul li a span{position: relative;}
#card ul li p{font-size: 13px; margin-top: 16px;}
#card ul li a img{width: 100%;}

#card div{width: 640px; margin: 20px auto 40px; text-align: center;}
#card div a.btn{display: inline-block; color: #fff; border-radius: 64px;background-color: #29C72A; margin: 16px auto; padding: 20px 90px; text-align: center;}
#card div a.btn:hover{opacity: 0.8;}
#card div a span:after{display: block; content: ""; position: absolute; border-right: 1px solid #fff; border-bottom: 1px solid #fff;width: 10px;height: 10px;transform: rotate(-45deg);right: -10px;top: 35%;}
#card div a span{position: relative;}
#card div p{font-size: 13px; margin-top: 16px;}

#card .mainTtl{font-size: 32px;}


#payment{background: #EEFEE1;padding: 64px 0;}
#payment div{width: 1120px;border-radius: 12px;background-color: #fff;padding: 40px 0;margin: 20px auto;}
#payment div p{text-align: center;font-size: 16px;line-height: 180%;}
#payment div p span{display: block;font-size: 13px;}
#payment div p img{padding: 40px 0;}

a.border.btn{display: block;border: 1px solid #4D4D4D; border-radius: 4px;width: 548px;margin: 20px auto;padding: 20px 0;text-align: center;color: #4d4d4d !important;font-size: 16px;}
a.border.btn span{position: relative;}
a.border.btn span:after{display: block;content: "";position: absolute;border-right: 1px solid #4d4d4d; border-bottom: 1px solid #4d4d4d;width: 10px;height: 10px;transform: rotate(-45deg);right: -10px;top: 35%;}
a:hover{opacity: 0.8 !important;}
#topBnrBox.topBnrBox2 h1{padding: 56px 0;}
p.msg{border: 1px solid #C72020;border-radius: 4px; color: #C72020;font-size: 12px;width: 1122px;margin: 10px auto;text-align: center;padding: 10px 0;position: relative;}
p.msg::before{content: url(https://img.travel.rakuten.co.jp/card/campaign/202301/images/Rex.png);margin-right: 1px;}


#t_btn{ margin: 32px auto; display: block; border-radius: 10rem; padding-top: 0.75rem; padding: 0.8rem 3.2rem; font-size: 36px; color: #fff; background-color: rgb(191, 0, 0); border-color: rgb(191, 0, 0);max-width: 37.5rem; cursor: pointer;}


.detailholder table tr td.tit{font-size: 20px; letter-spacing: 1px;}
.QandA .Switch:after{ font-weight: normal;}
.QandA .Switch.active:after { content: "ー"; font-size: 24px; top: 25%; right: 18px; font-weight: normal;}

.top_bnr{display: block; width: 950px; margin: 0 auto; margin-bottom: 15px;}

.entryBox .edate em{font-size: 14px; font-style: normal; letter-spacing: 0;}


.ttl { margin-bottom: 25px; display: flex; justify-content: center; align-items: center;font-size: 30px; line-height: 1.4; color: #4d4d4d;}
.ttl span { font-size: 24px; display: block; text-align: center;}
.ttl span em { font-style: normal; font-size: 36px; display: block; font-weight: 900;}

.cardUse{ width: 100%; background: #FECED5; padding: 50px 0 60px; }
.cardUse .ttl img { width: 80px;}
.cardUse > div { width: 950px; margin: 0 auto; background: #fff; overflow: hidden; padding: 40px 0 30px; text-align: center;}
.cardUse > div h4{font-size: 24px; margin-bottom: 16px;}
.cardUse > div h4 span{font-size: 30px; color: #EB5757;}
.cardUse > div p{ font-size: 14px; line-height: 160%; margin-bottom: 10px;}
.cardUse > div p span{ color: #EB5757; font-weight: bold; }
.cardUse > div em{display: block; background: url(https://img.travel.rakuten.co.jp/card/201810/coupon1000/images/bunkatsu_03_pc.png) no-repeat; width: 446px; height: 162px; padding-top: 15px; margin: 0 auto 10px; font-style: normal; font-size: 14px; line-height: 150%;}
.cardUse > div a{font-size: 14px; color: #1873B5; font-weight: bold; text-decoration: none; font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
}
.cardUse > div a:hover{ color: #1873B5;  text-decoration: underline; }

.campBox { margin: 24px auto 0; width: 280px;}
.campBox .kakunin span {
    margin: 0 4px;
    background: #eaeaea;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 12px;
    color: #333;
    text-decoration: none !important;
}
.campBox .entryLink {
    margin: 0 4px;
    background: #eaeaea;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 12px;
    color: #333;
    text-decoration: none !important;
}
.campBox .entryLink::after {
    position: absolute;
    content: url(https://img.travel.rakuten.co.jp/camp/mobile/202207/images/iconOpen.png);
    margin-left: 20px;
}


@media screen and (min-width: 800px) and (max-width: 1450px){
     .ss-contents { min-width: auto;}
     #topBnrBox{min-width: auto;}
     #topBnrBox{text-align: center; background: none;}
     #topBnrBox { text-align: center; background: url(https://img.travel.rakuten.co.jp/card/campaign/202301/images/topbg.png) repeat-x bottom center;}
     #topBnrBox h1 {
        width: 791px;
        margin: 0 auto;
        padding: 24px 0;
        position: relative;
    }
     #topBnrBox h1 em {
        position: absolute;
        left: -6em;
        top: 28px;
        background: #00B900;
        color: #fff;
        padding: 5px 10px 8px;
        letter-spacing: 2px;
        font-weight: bold;
        border-radius: 5px;
        font-style: normal;
        font-size: 18px;
    }
    .ss-container#search{ width: 100%;}
    #otoku.ss-container{padding: 30px 0;}
    #otoku ul{ width: 100%;}
    #otoku ul li{width: 25%;}
    #card ul{ width: 100%;}
    #pointcpn_footer ul{  width: 90% !important;}
    #pointcpn_footer ul li img{width: 100%;}
    .campBox { margin: 24px auto 0; width: 280px;}
    .campBox .kakunin span {
        margin: 0 4px;
        background: #eaeaea;
        border-radius: 4px;
        padding: 8px 12px;
        font-size: 12px;
        color: #333;
        text-decoration: none !important;
    }
    .campBox .entryLink {
        margin: 0 4px;
        background: #eaeaea;
        border-radius: 4px;
        padding: 8px 12px;
        font-size: 12px;
        color: #333;
        text-decoration: none !important;
    }
    .campBox .entryLink::after {
        position: absolute;
        content: url(https://img.travel.rakuten.co.jp/camp/mobile/202207/images/iconOpen.png);
        margin-left: 20px;
    }
    .popUpplanCP {
        z-index: 99999999;
        width: 950px;
        left: calc(50% - 500px);
        position: fixed;
        top: 12%;
    }
    .tableholder {
        position: relative;
        width: 950px;
        margin: 0 auto;
        overflow: auto;
        left: 50%;
        margin-left: -480px;
        z-index: 10;
        overflow: hidden;
    }
}
