@charset "UTF-8";
/* CSS for PC @date */
/* ------------------------------------------

------------------------------------------ */
.pc { display: none }
a{-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;-ms-transition:all .3s ease-out}
a:active{text-decoration:none!important;opacity:.7}

#contents.column1 { color: #333; background: none; padding: 0; }
/* -- Top -- */

#keyVisual h1{text-indent: inherit; text-align: center; }
#keyVisual h1 img{ width: 100%;}
#keyVisual .mob{text-align: center; margin-top: 10px;}
#keyVisual .mob img{ width: 100%; max-width: 320px; margin: 0;}
#keyVisual .termBox { margin: 0 auto; font-size: 14px; line-height: 1.5; padding: 12px 12px;}
#keyVisual .termBox p { margin-top: 8px;}
#keyVisual .termBox p em{font-style: normal; font-size: 90%; line-height: 180%; display: inline-block; padding-top: 10px;}
#keyVisual .termBox span { border-radius: 3px; border: 1px solid #333; text-align: center; font-size: 12px; padding: 4px 6px; margin-right: 8px;}



.greenBg{ background: #F5FFF5; overflow: hidden;}
.wBox { margin:32px 8px; background: #fff; padding: 24px 0;}
.mBox { margin:10px 8px 16px; background: #fff; padding: 24px 0;}


.pg_h2{ font-size: 18px; margin: 32px 8px 0; text-align: center;}
.pg_h2 + .wBox{ margin-top: 24px;}
.pg_h3 { font-size: 18px; margin: 0 8px 24px; text-align: center;}
.pg_h3.big { font-size: 24px; letter-spacing: 2px;}
.pg_h3 span{ display: block; margin: 0 auto 8px; color: #AC8456;}


.hvJMgY{ margin: 0;}
.campBox{ margin: 16px auto 0; width: 280px;}
.campBox a,.pLink a{ text-decoration: underline !important;}
.campBox a:hover,.pLink a:hover{ text-decoration: none !important;}
#contentsArea .campBox .jds_detialPopUp{
    margin: 0 4px;
    background: #eaeaea;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 12px;
    color: #333;
    text-decoration: none !important;
}
#contentsArea .entryLink{
    margin: 0 4px;
    background: #eaeaea;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 12px;
    color: #333;
    text-decoration: none !important;
}
#contentsArea .entryLink:after {
    position: absolute;
    content: url(https://img.travel.rakuten.co.jp/camp/mobile/202207/images/iconOpen.png);
    margin-left: 20px;
  }
.campAt_con{ font-size: 14px; line-height: 160%;  margin-bottom: 15px;}
.campAt_con dt{ font-weight: bold; color: #AC8456; font-size: 16px; margin-bottom: 5px;}
.campAt_con dd { margin-bottom: 10px; }
.campAt_con dd b{ display: block;}
.campAt_con dt.pink{ font-weight: bold; color: #FF008C;}


#PgBnr { padding: 24px 0 10px 0;}
.bnrBoxUl { display: flex; justify-content: center; flex-wrap: wrap;}
.bnrBoxUl li { margin: 8px 4px 0; width: 45%;}
.bnrBoxUl li img { width: 100%;}
.bnrBoxUl li a:hover { opacity: 0.8;}
.btnSH{ width: 90%; max-width: 320px; margin: 32px auto 0;}
.btnSH a{ box-sizing: border-box; display: block; color: #AC8456 !important; font-size: 18px; font-weight: bold; text-align: center; border: 1px solid #AC8456; border-radius: 50px; padding: 14px 0; position: relative;}
.btnSH a::after{content: ""; display: block; position: absolute; top: 50%; right: 20px; width: 0.5em; height: 0.5em; margin-top: -0.15em; border-top: 2px solid #AC8456; border-right: 2px solid #AC8456; transform: rotate(-45deg); }
.pLink a{ display: table; margin: 24px auto 0; background: url(https://img.travel.rakuten.co.jp/camp/service_debut/202202/images/window2.png) right top no-repeat; padding-right: 24px; padding: 2px 24px 0 0;}

.img_sp { text-align: center; margin: 0 32px 20px;}
.img_sp img { width: 75%; margin: 0 auto;}
.img_sp.mob3{margin: 0 0 20px; text-align: center;}
.img_sp.mob3 img{width: 80%; margin: 0 auto;}
.ph_h4 { font-size: 16px; margin: 0 10px 10px; text-align: center;}
.p2Exp { margin: 24px 16px 0; font-size: 12px; line-height: 1.7;}


#FAQ .jdsCoponSwitch{display: block; background-color: #f5f5f5; border-radius: 5px; font-size: 16px; margin-top: 20px; padding:16px 40px 16px 24px; position: relative;}
#FAQ .jdsCoponSwitch:hover{cursor: pointer;}
#FAQ .jdsCoponSwitch::after{display: block; position: absolute; z-index: 9; content: url(https://img.travel.rakuten.co.jp/camp/service_debut/202202/images/Plus.png); right: 16px; top: 50%; margin-top: -12px;}
#FAQ .jdsCoponSwitch.active-submenu::after{content: url(https://img.travel.rakuten.co.jp/camp/service_debut/202202/images/Minus.png);}
#FAQ dd {display: block; border: 1px solid #ccc; padding: 16px 24px; margin-top: 16px; font-size: 14px; line-height: 180%; position: relative;}
#FAQ dd a{color: #006497 !important;}

.black{width:100%; height:100%; background:rgba(0,0,0,.5); position:fixed; top:0; left:0; z-index:99999998}
.popUpplan{width:90%; left:5%; position:absolute; top:10%; background:#fff; z-index:99999999; border-radius:12px}
.popUpplan p{height:65vh; padding:10px; color:#000; font-size:15px; line-height:35px; overflow:scroll}
.popUpplan span{display:block; position:absolute; cursor:pointer; right:-10px; top:-10px; width:30px; height:30px; text-indent:-9999999px; background:url(https://img.travel.rakuten.co.jp/special/goto/202007-3/images/close_icon.png) no-repeat;background-size:30px 30px}
.popUpplan h2{background: #AC8456; color:#fff; text-align: center; font-size: 18px; padding: 10px 0 8px; margin-bottom: 20px; line-height: 140%;}
.popUpplan h2.pink { background: #FF008C; }

#Searchbox{ margin: 48px auto 0;}
#search-box{border: none;}
#Searchbox .newtab{ display: flex; justify-content: center; border-bottom: 3px solid #D8AD7A; }
#Searchbox .newtab li{ width: 22%; background: #fff; box-sizing: border-box; padding: 12px 0; font-size: 14px; font-weight: bold; color: #999; border: solid #aaa; border-width: 1px 1px 0; border-radius: 3px 3px 0 0; margin: 0 2px; text-align: center; cursor: pointer;}
#Searchbox .newtab li.active{ border-color: #D8AD7A; border-width: 1px 1px 0; color: #AE722C; }
#Searchbox .newtab li span{font-size: 12px; }
#Searchbox .pg_h3{ margin: 16px 0;}
#Searchbox #searchSwitchArea1{ margin-bottom: 32px;}
#search-box .structure dd{ margin-bottom: 0;}
#search-box #dr-search-form{ background: none !important;}
#search-box.verB.test #dap-search-form .sibori{display: none !important;}
#searchForeignSwitchArea1 .InpuDateBox.white{display: none !important;}
#search-box .searchNavi li{ width: 23% !important;}


.ptsetBox{ margin-top: 40px;}
.ptsetBox img{width: 100%;}


/*fivepoint*/
.fivepoint p { font-size: 24px; font-weight: 700; text-align: center; margin-top: 40px;}
.fivepoint img:first-child {
    display: block;
    margin: 0 auto;
  }
  
  .fivepoint img:last-child {
    display: block;
    margin: 0 auto;
    margin-top: 17px;
    margin-bottom: 10px;
  }
  .container {
    margin: 0 auto;
    width: 92%;
    padding: 20px 10px;
    border: 1px solid #DDDDDD;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    border-radius: 5px;
  }
  
  .stepf {
    flex: 1;
  }
  
  .stepf p {
    margin: 0;
    padding-left: 10px;
  }
  
  .iconf {
    flex: 0;
  }
  .step1{
    font-size: 16px;
    font-style: italic;
  }
  .centered-image {
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
  }
.greent{ display: block; margin: 10px auto 8px;}
.greenf{ display: block; margin: 10px auto 8px;}
.greenc{ display: block; margin: 10px auto 8px;}

/*contract*/

.contract {
    display: block;
    margin: 0 auto;
    position: relative;
    width: 92%;
    padding: 20px 0 10px;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    margin-top: 7px;
    overflow:auto;
  }
  .text {
    position: absolute;
    top: 18px;
    left: 20px;
    font-size: 16px;
    margin-bottom: 20px;
  }
  .stepc{
    font-style: italic;
  }
  .text p {
    margin: 0;
  }
  .signimage img {
    
    margin-top: 75px;
    margin-bottom: 20px;
    padding-left: 20px; 
  }

/*travltime*/

.travltime {
    display: block;
    margin: 0 auto;
    width: 92%;
    padding: 20px 0;
    border: 1px solid #DDDDDD;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    
  }
  .right {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
    font-size: 16px;
  }
  
  .iconr {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 14px;
    margin-top: 10px;
  }
  
  .step3 {
    font-style: italic;
  }

/*timeline*/
.timeline {
    margin: 0 auto;
    width: 92%;
    padding: 10px 0;
    border: 1px solid #DDDDDD;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
  }
  .step4 {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center; 
    padding: 20px;
    font-size: 16px;
  }
  .step4 p{font-weight: bold;}
  .step4 span{ display: inline-block; font-style: italic; margin-right: 1px;}
  .red{
    color: #bf0000 ;
  }
  #nub4{
    color: #000000;
  }
  .iconline {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 26px;
    margin-top: 10px;
  }
  .timeline p span{
    color: #bf0000;
  }
  .italic{
    font-style: italic;
  }
  .fivepointuse{
    background-color: white;
  }
  /*subscribers*/
  .subscribers{
    width:100%;
    height:700px;
    background-color:#FFF2F9 ;
    margin: 0 auto;
    margin-top: 42px;
  }
  .subscribers p span{
    color:#00B900;
    font-size: 20px;
  }
  .subscribers p{
    font-size:21px;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 20px;
    font-weight: bold;
  }
  .bgwhite1{
    height: 575px;
    width: 343px;
    background-color: white;
    border-radius: 10px;
    margin: 0 auto;
    margin-top:-8px;
    margin-bottom: 17px;
  }
  .bgwhite1 p{
    font-size:16px;
   padding-top: 17px;
  }
  .pic1 {
    display: flex;
    align-items: center;
    justify-content: center;
}
  .pic1 img{
    display: block;
    margin: 0 auto;
    margin-top: -9px;
  }
  #highlight p {
   font-size: 18px;
   text-align: center;
}
.imgnine{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -11px;
}
.my-button {
    display: inline-block;
    height: 53px;
    width: 272px;
    background-color: #BF0000;
    color: #ffffff;
    text-align: center;
    line-height: 53px;
    border-radius: 40px;
    text-decoration: none;
    display: block;
    margin: 0 auto;
    margin-top: 16px;
    font-size: 18px;
}
body .my-button {
    color:white !important;
}
/*Mobileconnects*/
.Mobileconnects{
    width: 100%;
    height: 649px;
    background-color:#FFF2F9;
}
.Mobileconnects p{
    text-align: center;
    color: #AC8456;
    font-size: 22px;
}
.Mobileconnects p span{
font-size: 16px;
    color: #000000;
}
.Mobileconnects .bla {
    color: black;
    font-size: 22px;
  }
  .whitetwo{
    height: 571px;
    width: 343px;
    background-color: white;
    border-radius: 10px;
    margin: 0 auto;
    margin-top:19px;
    margin-bottom: 17px;
  }

  .whitetwo p{
    font-size:16px;
   padding-top: 17px;
   color: #000000;
  }
  .whitetwo p span{
    font-size:12px;
   color: #6F706E;
  }
  .mapimg{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}
#imp p {
    margin-top: -24px;
    font-size: -8px;
    text-align: center;
 }
 .my-button2 {
    display: inline-block;
    height: 53px;
    width: 272px;
    background-color: #BF0000;
    color: #ffffff;
    text-align: center;
    line-height: 53px;
    border-radius: 40px;
    text-decoration: none;
    display: block;
    margin: 0 auto;
    margin-top: 27px;
    font-size: 18px;
}
body .my-button2 {
    color:white !important;
}

.custom-text {
    margin: 0 auto;
    margin-top: 16px;
    font-size: 12px;
    color: #767676;
    width: 327px;
    height: 96px;

  }
  .custom-text a { 
    text-decoration: none;
  }

  .bnrBox{
    display: none;
  }
  #impontantp{
    display: none;
  }
  #pcsize{
    display: none;
  }
  .forpc{
    display: none;
  }
  .pcmap{
    display:none !important;
  }

  .container {
    display: flex;
}
/*containerbox*/

.bgwbpc{
  display: none;
}

.bgwb p{ 
 margin-right: 14px;
  font-size: 16px;
text-align: center;
  align-items: center;
  justify-content: center;
  line-height: 19px;

}
.fir{
width:195px;
height: 49.42px;
color:white;
background-color: #AC8456;
display: flex;
align-items: center;
justify-content: center;
}
.fir img{
  margin-right:16px;
}
.bgwb .fir>p
{color:white;text-align:center;}
.sec{
  width:195px;
  height: 49.42px;
  color:#333333;
  background-color: #D9D9D9;
  display: flex;
  align-items: center;
  justify-content: center;
  }
  .sec img{
    margin-right:16px;
  }
  .bgwb {
    display: flex;
    justify-content: center;
    margin-top: 10px;
    margin-bottom: 20px;

  }
  

#contentsArea a.apBtn{display: block; width: 86%; margin: 30px auto 0; text-align: center; background: #bf0000; border-radius: 50px; font-size: 20px; color: #fff; font-weight: bold; letter-spacing: 1px; padding: 15px 0 10px;}
.apPr{display: block;  margin: 10px; font-size: 13px; text-align: center;}


.signimage.cpnB img {width: 90%; margin: 15% 5% 5%; padding: 0;}

.moble h3 {
    text-align: center;
    font-size: 18px;
    margin: 32px 10px 0;
}

#contentsArea .moble a {
    display: block;
    margin: 0 10px;
}

#contentsArea .moble a img {
    width: 100%;
}

.saitamaBnr{padding: 0 5% 10px;}
.saitamaBnr h3{margin-bottom: 8px;}
.saitamaBnr img{width: 100%;}

.kvText{text-align: center; letter-spacing: 1px; color: #bf0000; padding: 10px 15px;}

.step2{font-style: italic;}
#mobBox{padding-top: 24px;}