@charset "utf-8";
/*
* ★★CSS for PC
*
* @date 2016.05.20
* @author   zhaoly
*/

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

------------------------------------------ */
#widewrapper{width:100%;}

.TopBox{background:url(https://travel.rakuten.co.jp/kaigai/special/family/beach/images/top_bg.jpg) no-repeat; background-size:cover; height:500px; position:relative;}
.TopBox:before{display:block; content:""; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/top_line.png) repeat-x; width:100%; height:15px; position:absolute; bottom:0; left:0; z-index:1;}


#maintit{width:950px; margin:0 auto; position:relative;}
#maintit h1{ display:block; position:absolute; left:-65px; top:30px;}
#maintit p{ display:block; position:absolute; right:-220px; top:100px;}


/* -----  -----*/
.pc{display:block;}
.sp{display:none;}

#contents.column1{width:100%; padding:0; background:#fff;}
#contentsArea #contents{background:none;}
#mainContents{width:910px; margin:0 auto;}
#contents .pagetop{width:910px;}


.prBox{display:block; text-align:center; line-height:160%; color:#1d8dd1; font-weight:bold; font-size:110%; letter-spacing:1px; margin:30px 0; position:relative;}
.prBox:before{display:block; content:""; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/pr-text01.gif) no-repeat; width:54px; height:52px; position:absolute; left:0; top:-10px;}
.prBox:after{display:block; content:""; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/pr-text02.gif) no-repeat; width:30px; height:35px; position:absolute; right:0; bottom:0;}


.spBox{display:block; margin-bottom:50px;}
.spBox li{ float:left; width:442px; margin-left:20px; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/spot_bg02.gif) no-repeat; height:170px; padding-top:45px;}
.spBox .first{ margin-left:0; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/spot_bg01.gif) no-repeat;}
.spBox li h2{display:none;}
.spBox li p{font-size:80%; line-height:160%; width:240px; padding:15px 0 0 20px; float:left;}
.spBox li span{float:left;}



.pageBtn ul.btn5 li{width:170px; margin-left:17px; margin-bottom:40px;}
.pageBtn ul.btn5 .first{margin-left:0;}
#contentsArea .pageBtn a:link{background:none; border:none; color:none; text-shadow:none;}
#contentsArea .pageBtn a span{display:none;}
#contentsArea .pageBtn .c1{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav1.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c1:hover{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav1_o.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c2{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav2.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c2:hover{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav2_o.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c3{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav3.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c3:hover{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav3_o.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c4{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav4.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c4:hover{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav4_o.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c5{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav5.gif) no-repeat !important; width:170px; height:80px;}
#contentsArea .pageBtn .c5:hover{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/nav5_o.gif) no-repeat !important; width:170px; height:80px;}



.titAll span{display:block; float:left; width:225px; margin-bottom:10px;}
.titAll p{float:left; padding:50px 0 0 60px; font-size:95%; line-height:160%; width:65%;}
.t01{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/title01_line.gif) no-repeat right top 17px;}
.t02{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/title02_line.gif) no-repeat right top 17px;}
.t03{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/title03_line.gif) no-repeat right top 17px;}
.t04{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/title04_line.gif) no-repeat right top 17px;}
.t05{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/title05_line.gif) no-repeat right top 17px;}
.t06{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/title06_line.gif) no-repeat right top 17px;}



.chBox{display:block; margin-bottom:40px;}
.chBox ul{display:block; margin-bottom:40px;}
.chBox ul li{ float:left; width:287px; margin-left:20px; border:1px solid #ffb2cc; border-top:none;}
.chBox ul .first{margin-left:0;}
.chBox ul li h2{background:#ffb2cc; font-size:100%; color:#fff; letter-spacing:2px; text-align:center; padding:5px 0 4px; position:relative;}
.chBox ul li h2 b{font-size:150%;}
.chBox ul li h2 span{display:block; position:absolute; left:10px; top:-15px;}
.chBox ul li p{padding:15px 15px 20px; font-size:80%; line-height:140%; height:205px;}
.chBox ul li p span{display:block; font-weight:bold; font-size:125%; letter-spacing:1px; line-height:160%; margin-bottom:8px;}
.chBox ul li .photo{ display:block; height:205px;}
.chBox div{margin-bottom:40px;}
.chBox div h2{height:35px;}
.chBox div h2 span{display:none;}
.chBox div dl{display:block; border:1px solid #ffb2cc; border-top:none; height:175px;}
.chBox div dl dd{float:left; width:620px; font-size:80%; line-height:180%; padding:30px 0 0 30px;}
#contentsArea .chBox div dl dd a{color:#0183ec;}
#contentsArea .chBox div dl dd a:hover{color:#0183ec;}
.chBox div dl dt{float:left; padding:15px 0 0 10px;}
#contentsArea .chBox .btn{ display:block; width:600px; margin:0 auto; margin-bottom:8px;}
#contentsArea .chBox .btn:hover{opacity:0.7;}

.blue ul li{border:1px solid #a9d6f1;}
.blue ul li h2{background:#a9d6f1;}
.blue div dl{border:1px solid #a9d6f1;}
.blue div dl dd{padding:20px 0 0 30px;}



.fam_tit{margin-bottom:20px;}
.column1 .hotels{margin-bottom:10px;}
.column1 .htlBox2{width:444px; margin-right:18px;}
#contentsArea .htlBox{border-color:#e9c966;}
#contentsArea .htlBox .area{background:#e9c966; padding:10px 20px;}
.htlBox h1{margin:20px 20px 10px;}
.htlBox .photo{padding:0 20px 10px;}
.htlBox2 .photo .thumPhotos li{width:49%;}
.htlBox .rate .hide, .htlBox .rank .hide {margin-top: -3px;}
.htlBox .rate .hide:after, .htlBox .rank .hide:after {
content: ' ';
display: block;
height: 2px;
}
.htlBox .rank{border: 1px solid #ded6bf; margin:0 20px 10px;}
.htlBox .rank em.ranking40{background-position: 2px -1546px;}
.htlBox .rank em.ranking50{background-position: 3px -1495px;}
.htlBox .rank span{display:inline-block;}
.htlBox .plan{margin:0 20px;}
#contentsArea .htlBox .plan li a{background-color:#fcfbea; border-color:#ded6bf; position:relative; margin-bottom: 15px;}
#contentsArea .htlBox .plan li a .icon{display:block; position:absolute; top:15px; left:10px;}
#contentsArea .htlBox2 .plan li a .planName{ color:#664416; padding:10px 0 0 90px;}
.htlBox .plan li a .price{padding-left:90px; text-align:center;}
.htlBox .plan li a .price small{text-align:center;}
.htlBox .plan li a .price span{color:#bc0303; font-weight:bold;}
.htlBox .plan li a .price span em{font-size:195%;}
.htlBox.htlBox2 ul.plan li a ul.btn { margin:10px 0 10px 20px;}
.htlBox.htlBox2 ul.plan li a ul.btn li{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/family_bg.gif) repeat; position:relative; font-size:95%; padding: 10px 0; text-align: center; color: #fff; border-radius: 5px;}
.htlBox.htlBox2 ul.plan li a ul.btn li:before{display:block; content:""; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/family_btn_icon.png) no-repeat; width:4px; height:7px; position:absolute; top:16px; right:15px;}

/*--------DPPLAN*/
.htlBox .dpplan{margin:0 20px;}
#contentsArea .htlBox .dpplan li a{ border: 1px solid #479f1b; background-color:#fff; position:relative;}
#contentsArea .htlBox .dpplan li a .icon{display:block; position:absolute; top:-11px; left:3px;}

#contentsArea .htlBox2 .dpplan li a .planName{ font-size:90%;  color:#fff; font-weight: bold; text-align: center; padding:6px 0; display:block; background:#479f1b;}
.htlBox .dpplan li a .price{ padding:10px; text-align:center; font-size: 82%; line-height: 1.3;}
.htlBox .dpplan li a .price small{ background: #f3f3f3; padding:8px; margin: 5px;  display:block; text-align:center;}
.htlBox .dpplan li a .price span{color:#bc0303; font-weight:bold;}
.htlBox .dpplan li a .price span em{font-size:245%; font-style: normal;}



.htlBox2 .btn{margin:10px 0 20px 20px;}
.column1 .htlBox2 .btn li{ width:auto; float: none; margin: 0 42px 0px 20px;}
#contentsArea .htlBox .btn li a{ padding:13px 0 !important;background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/family_bg.gif) repeat; position:relative; font-size:95%;}
#contentsArea .htlBox .btn li a:hover{background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/family_bg.gif) repeat; opacity:0.7;}
#contentsArea .htlBox .btn li a:before{display:block; content:""; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/family_btn_icon.png) no-repeat; width:4px; height:7px; position:absolute; top:16px; right:15px;}
.fam-btn{display:block; width:600px; margin:0 auto; margin-bottom:30px;}
.fam-btn:hover{opacity:0.7;}
.fam-text{display:block; font-size:80%; margin-bottom:20px;}
.mb8{margin-bottom:8px;}
.mb40{margin-bottom:40px;}


.safeBox{border:1px solid #b1da80; padding:20px; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/safe_ph7.gif) no-repeat right 20px bottom 20px; margin-bottom:10px;}
.safeBox dl dt{display:block; background:url(https://img.travel.rakuten.co.jp/kaigai/special/family/beach/images/safe_bg.gif) no-repeat; height:35px; padding:10px 0 0 15px; color:#fff; font-size:105%; font-weight:bold; letter-spacing:1px;}
.safeBox dl dd{display:block; padding:10px; font-size:78%; line-height:180%; margin-bottom:12px;}
#contentsArea .safeBox dl dd a{color:#0183ec;}
#contentsArea .safeBox dl dd a:hover{color:#0183ec;}
.safeBox dl .left30{float:left; width:30%;}
.safeBox dl .left70{float:left; width:70%;}
.safeBox dl .left18{float:left; width:18%;}
.safeBox dl .left82{float:left; width:82%;}
.safeBox dl .right30{float:right; width:30%;}
.t-right{text-align:right;}
.pt20{padding-top:20px;}



.column1 #search-box{width:908px; border:1px solid #ffb2b2; margin-bottom:10px;}
.column1 #search-box .searchCategory{width:840px;}
.column1 #search-box #overseas-search-box{ padding:20px;}
#search-box h1{height:0; display:none;}



.otherBox{border:1px solid #e7c79b; padding:20px; margin-bottom:10px;}
.otherBox .bnr{ display:block; width:700px; margin:0 auto; text-align:center; margin-bottom:30px; margin-top:20px;}
.otherBox .bnr:hover{ opacity:0.7;}
.otherBox h2{text-align:center; margin-bottom:20px;}
.otherBox ul{ display:block; width:850px; margin:0 auto; margin-bottom:20px;}
.otherBox ul li{float:left; width:270px; margin-left:20px;}
.otherBox ul .first{margin-left:0;}
.otherBox ul li a{display:block; background:#fdf8ea; border:1px solid #e1d1c0; padding:15px;}
.otherBox ul li a:hover{opacity:0.7;}
.otherBox ul li a p{padding:10px; font-size:80%; line-height:160%;}
.otherBox ul li a p span{display:block; font-size:120%; font-weight:bold; margin-bottom:5px; text-align:center;}


.noicon { padding-left: 10px !important;}
.bnrbox{ width: 100%; text-align: center; margin: 10px auto;}
.bnrbox a:hover{
filter:alpha(opacity=70); 
-moz-opacity:0.7; 
opacity:0.7;}