@charset "utf-8";

/*
 * CSS for SmartPhone
 * @date     2019.01.14
 * @author   shenhui
 */


/* ------------------------------------------

------------------------------------------ */
#keyVisual{padding:20px 20px 10px;}
#contentsArea{ background-image: url(https://img.travel.rakuten.co.jp/award/2018/images/bg_all_sp.jpg); background-repeat: no-repeat; background-position: top center; background-attachment:fixed;}
#contentsArea.subP{ background-color:#fcfaee;}
#contents.column1{background: none;}
.pc{display: none;}
/* -----  -----*/

.titAll{margin: 0 auto 20px; border-bottom: 1px solid #926b02; padding-bottom: 10px; text-align: center;}
.titAll img{display: none;}
.titAll span{font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 140%; color: #926b02; font-weight: blod;}

.mapBox{margin-bottom: 30px;}
.mapBox ul{display: block; margin:0 auto; padding-left: 3%;}
.mapBox ul li{width:30%; float: left; margin: 0 1% 10px;}
#contentsArea .mapBox ul li a{display: inline-block; background: #127308; color: #fff; font-size: 80%; padding: 13px 0; width: 100%; text-align: center; position: relative; letter-spacing: 1px;}
#contentsArea .mapBox ul li a:hover{color: #fff; text-decoration: none; background: #0f9901;}
#contentsArea .mapBox ul li a:before{ display: block; content: ""; background:url(https://img.travel.rakuten.co.jp/award/2018/images/map_icon.png)no-repeat; width: 5px; height: 9px; position: absolute; top: 15px; right: 5px;}

.awardBox{margin-bottom: 30px;}
.awardBox ul li{ margin-bottom: 10px; text-align: center;}
@media screen and (min-width: 360px) {
  .awardBox ul li{ text-align: center; float: left; width: 47%; margin: 0 1.5% 10px;}
  .awardBox ul li img{width: 100%;}
}

.intrBox{background: #fff; padding:40px 30px 30px; margin: 0 10px 30px;}
.intrBox p{ font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; line-height: 180%; color: #000;}
.intrBox p span{ display: block; margin-bottom: 15px;}
#contentsArea .intrBox p a{color: #127308; text-decoration: underline;}

#search-box h2{position: relative; padding: 10px 0 10px 20px;}
#search-box h2.open:after {
    content: "+";
    border: 1px solid #cbc2a0;
    width: 12px;
    height: 14px;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -9px;
    right: 5px;
    line-height: 0.8;
    text-align: center;
    padding-right: 2px;
    padding-bottom: 2px;
    padding-left: 2px;
  }
  #search-box h2.close:after {
    content: "-";
    border: 1px solid #cbc2a0;
    width: 12px;
    height: 14px;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -9px;
    right: 5px;
    line-height: 0.8;
    text-align: center;
    padding-right: 2px;
    padding-bottom: 2px;
    padding-left: 2px;
  }


  .lastTALK{ font-size: 80%; line-height: 160%; color: #7b7b7b; margin:10px 10px 20px;}


/* ----- 下層ページ -----*/
.navBox{ padding:5px 0; z-index: 9999; width: 100%; position: fixed; bottom: 5%; right: 5px;}
#contentsArea .navBox .has-submenu{background: #127308; color:#fdfb44; font-size: 12px; padding: 10px 2px; width: 55px; text-align: center; text-decoration: none; position: absolute; bottom: 10px; right: 0; z-index: 9999;}
.navBox .has-submenu span{display: none;}
.navBox ul.jb{padding: 20px 10px 10px 15px; background: #127308; position: absolute; bottom: 10px; right: 0;}
.navBox ul.jb li{width:30%; float: left; margin: 0 1.5% 10px;}
#contentsArea .navBox ul.jb li a{display: inline-block; background: #fff; color: #127308; font-size: 90%; font-weight: bold; padding: 13px 0; width: 100%; text-align: center; position: relative; letter-spacing: 1px;}
#contentsArea .navBox ul.jb li em{display: inline-block; background: #fdfb44; color: #127308; font-size: 90%; font-weight: bold; text-decoration: underline; padding: 13px 0; width: 100%; text-align: center; position: relative; letter-spacing: 1px;}

.navFoot{display: none;}

.navSub{margin: 20px 0;}
.navSub ul{ margin: 0 10px;}
.navSub ul li{ margin-bottom: 5px}
.navSub ul li:last-child{margin-right: 0;}
#contentsArea .navSub ul li a{font-size: 80%; padding: 10px 0 8px; display: block; text-align: center; position: relative; letter-spacing: 1px;}
#contentsArea .navSub ul li a:before{ display: block; content: ""; position: absolute; width: 7px; height: 4px; top: 15px; right: 10px;}
#contentsArea .navSub ul li .btn1{background: #fffde2; border: 1px solid #aa800e; color: #aa800e;}
#contentsArea .navSub ul li .btn2{background: #f3f3f3; border: 1px solid #7b7b7b; color: #7b7b7b;}
#contentsArea .navSub ul li .btn3{background: #e9ffe7; border: 1px solid #2b8821; color: #2b8821;}
#contentsArea .navSub ul li .btn1:before{background: url(https://img.travel.rakuten.co.jp/award/2018/images/award_icon1.png) no-repeat;}
#contentsArea .navSub ul li .btn2:before{background: url(https://img.travel.rakuten.co.jp/award/2018/images/award_icon2.png) no-repeat;}
#contentsArea .navSub ul li .btn3:before{background: url(https://img.travel.rakuten.co.jp/award/2018/images/award_icon3.png) no-repeat;}

#PART02{margin-top: 50px;}
#PART03{margin-top: 50px;}

.htlBox .btn li {width: 100%; margin: 0 !important;}
.htlBox .btn li:nth-child(2n-1) a{ margin: 0 !important;}
#contentsArea .htlBox .btn li a {font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 120%; letter-spacing: 1px; font-weight: bold;
  padding: 10px 0;
  background: #c49e02;
  border-radius: 0;
  position: relative;
  margin: 0 10px 10px !important;
}
#contentsArea .htlBox .btn{margin-bottom: 10px;}

.htlBox .btn li a:before{display: block; content: ""; background: url(https://img.travel.rakuten.co.jp/award/2018/images/map_icon.png) no-repeat; width: 5px; height: 9px; position: absolute; top: 17px; right: 15px;}
.htlBox .btn li a span{ width: 150px; margin: 0 auto; display: block; padding-left: 20px; text-align: center; position: relative;}
.htlBox .btn li a span:before{display: block; content: ""; background: url(https://img.travel.rakuten.co.jp/award/2018/images/airplan.png) no-repeat; width: 17px; height: 18px; position: absolute; top: 2px; left: 8px;}
.htlBox .btn li .plan_s span:before{display: none;}
.htlBox .plan li{margin:0 0 15px;}
.htlBox .plan li a{border-radius: 0; padding: 15px; border-color: #b48404; position: relative;}
.htlBox .plan li a .planName{ margin-bottom: 5px; color: #b48404; text-align: center; font-size: 110%; letter-spacing: 1px; font-weight: bold; font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;} 
.htlBox .plan li a .text{font-size: 80%; line-height: 160%;}
.htlBox .plan li a:before{display: block; content: ""; background: url(https://img.travel.rakuten.co.jp/award/2018/images/ribbon1.png) no-repeat; width: 69px; height: 39px; position: absolute; top: -2px; left: -5px; border: none !important; transform:none !important;}
.htlBox .plan li a:after{display: block; content: ""; background: url(https://img.travel.rakuten.co.jp/award/2018/images/ribbon2.png) no-repeat; width: 69px; height: 39px; position: absolute; bottom: -4px; right: -7px;}
#contentsArea .htlBox .plan li a:hover{text-decoration: none; background: #fefdeb;}
.htlBox .basic{border-bottom: none; padding-bottom: 0;}
.htlBox .basic:before{display: none;}
.htlBox .photo{ margin: 10px 0 15px; width: 100%;}

.htlBox1 .subTit{margin:20px 0 0;}
.htlBox .area{ letter-spacing: 1px; background: none; color: #000; padding: 0; margin-top: 10px; text-align: center;}
.htlBox h2{ padding: 0 10px; text-align: center; font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 120%; letter-spacing: 1px;}
.column1 .htlBox .plan{ margin: 0 10px;}
.htlBox1 .plan li.sub dl dt{ float: right;}
.htlBox1 .plan li.sub dl dd{font-size: 70%; line-height: 160%; width: 62%;}
.htlBox1 .plan li.sub.point dl dd{font-size: 70%; line-height: 160%; width: 100%;}
.htlBox1 .plan li.sub dl dd span{display: block; border-bottom: 1px solid #b48404; padding-bottom: 8px; margin-bottom: 8px; color: #b48404; text-align: left; font-size: 160%; letter-spacing: 1px; font-weight: bold; font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.htlBox3{padding-top: 20px;}



/******** ▼0205 add▼ *******/

.goldBox .navBox .has-submenu, .goldBox .navBox ul.jb{background: #b48404 !important;}
.silverBox .navBox .has-submenu, .silverBox .navBox ul.jb{background: #999 !important;}
.jtop47Box .navBox .has-submenu, .jtop47Box .navBox ul.jb{background: #76B460 !important;}
.goldBox .navBox ul.jb li a{color: #7A5A04 !important;}
.silverBox .navBox ul.jb li a{color: #666 !important;}
.jtop47Box .navBox ul.jb li a{color: #325825;}
.goldBox .navSub ul li a:before, .silverBox .navSub ul li a:before, .jtop47Box .navSub ul li a:before {transform:rotate(270deg);}

.htlBox5{padding-top: 20px;}
.htlBox5 h2{word-wrap:break-word;}
.subttl{ text-align: center; color: #b48404; font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 150%; letter-spacing: 1px; margin: 30px auto 20px; }

.silverBox .subttl { color: #999;}
.silverBox .htlBox5 .btn li a {background: #999 !important;}
.jtop47Box .htlBox5 .btn li a {background: #76B460 !important;}
/******** ▲0205 add▲ *******/

/* surveyForm */
.surveyForm{ margin:20px 0 20px;}
.suvTlt { font-size: 16px; text-align: center; font-weight: bold; margin-bottom: 12px; line-height: 1.3;}
.suvSel {display: flex;justify-content: center;}
.happy { position: relative;}
.happy:before { width: 30px; height: 30px; position: absolute; content: ""; background: url(https://img.travel.rakuten.co.jp/award/2018/images/icon-good-pc.png) 0 0 no-repeat; background-size:cover; left: 33px; top: 8;}
.sad { position: relative;}
.sad:before { width: 30px; height: 30px; position: absolute; content: ""; background: url(https://img.travel.rakuten.co.jp/award/2018/images/icon-bad-pc.png) 0 0 no-repeat; background-size:cover; right: 33px; top: 8;}
.suvSel label { text-align: center; margin: 0 5px}

.suvSel input { display: none;}
.suvSel .survey-radio-btn  {
	position: relative;
width: 19px;
height: 19px;
border-radius: 50%;
border: 3px solid #999999;
display: block;
cursor: pointer;
margin: auto;}
.suvSel input:checked .survey-radio-btn {
    position: relative;
    width: 19px;
    height: 19px;
    border-radius: 50%;
	border: 3px solid #565656;
}
.suvSel strong {
width: 52px;
height: 14px;
line-height: 14px;
font-size: 13px;
text-align: center;
color: #333333;}

input:checked + .survey-radio-btn::after {
    content: '';
    display: block;
    position: absolute;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background-color: #565656;
    top: 3px;
    left: 3px;
}
.typTxt { font-size: 12px; padding: 3%; width: 87%; margin: 10px auto;}
.subBtn {width: 190px;
height: 30px;
line-height: 28px;
border-radius: 100px;
background-color: #565656;
border: none;
display: block;
margin: 0 auto;
font-size: 14px;
text-align: center;
color: #ffffff;
overflow: hidden;
outline: none;
cursor: pointer;
-webkit-appearance: none;}
.subBtn:hover { opacity: 0.8;}