@charset "utf-8";
/* CSS Document */
/*共通*/
#areaContent h2{
	color: #333;
	text-align: left;
	padding: 10px 0px 10px 8px;
	border-top: solid 2px #f90;
	border-bottom: solid 2px #f90;
	font-size:1.2em;
	background: -webkit-repeating-linear-gradient(-45deg, #fff5df, #fff5df 4px,#ffe4b1 3px, #ffe4b1 8px)!important;
	background: repeating-linear-gradient(-45deg, #fff5df, #fff5df 4px,#ffe4b1 3px, #ffe4b1 8px)!important;
}
.mainImg{
	position: relative;
    height: 130px;
    overflow: hidden;
}
.mainImg h1{
	position: absolute;
    width: 100%;
    /*background: rgba(86, 85, 85, 0.8);*/
    color: #fff;
    font-size: 2.5em;
    font-family: "Noto Sans Japanese";
    top: 30%;
    letter-spacing: 5px;
    text-shadow: #666 2px 0px, #666 -2px 0px, #666 0px -2px, #666 0px 2px, #666 2px 2px, #666 -2px 2px, #666 2px -2px, #666 -2px -2px, #666 1px 2px, #666 -1px 2px, #666 1px -2px, #666 -1px -2px, #666 2px 1px, #666 -2px 1px, #666 2px -1px, #666 -2px -1px;
    text-align: center;
    z-index: 2;
}
.mainImg img{
	position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
}
/*ページナビ*/
#pageNavi{
	margin:8px 0;
}
#pageNavi ul li {
    float: left;
    width:24.5%;
    padding:5px 0;
    text-align: center;
    border-right:1px solid #999;
}
#pageNavi ul li:last-child {
	border-right:none;
	}
#pageNavi ul li a{
	text-decoration: underline;
}
/*検索*/
#searchBox{
	width:96%;
	margin:8px auto 10px;
}
#searchBox h2{
	background:#666!important;
	border-top:none;
	border-bottom:none;
	color:#fff;
	text-align: center;
	padding:5px 0;
	font-size:1em;
}
#searchBox .searchInner{
	border:1px solid #666;
	padding:8px;
}
#searchBox .searchCont div {
    margin-bottom: 5px;
}
#searchBox .searchCont p{
	font-size:0.9em;
	float:left;
	margin-right:5px;
	width:22%;
}
#searchBox .searchCont select{
	margin-top:0px;
	margin-bottom:5px;
	height:30px;
}
#searchBox .searchCont input[type="text"]{
	box-shadow:none;
	margin:0;
	width:70%;
}
#searchBox .searchCategory select{
	max-width: 220px;
}
#searchBox .searchBtn{
	width:60%;
	margin:5px auto 0;
}
#searchBox .searchBtn button{
	background:#f90;
	border:none;
	color:#fff;
	font-weight:bold;
	border-radius:8px;
	font-size:1.3em;
	padding: 6px 0px;
    width: 100%;
}

/*おすすめツアー・カテゴリ*/
#recommend li {
    background: url(../img/special/arrow.png) right no-repeat;
    -webkit-background-size: 18px 69px !important;
    -moz-background-size: 39px 69px !important;
    -o-background-size: 39px 69px !important;
    border-bottom: 1px solid #dbdbdb;
}
#recommend li:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}
#recommend li a{
	display: block;
    padding:5px;
    text-decoration: none !important;
}
#recommend li .photobox,#recommend li .spImg{
	float:left;
	width:30%;
	margin-right:8px;
}
#recommend li .photobox img,#recommend li .spImg img{
	width:100%;
	height:80px;
}
#recommend li .recommendText{
	float:left;
	width:63%;
}
#recommend li .recommendText h3{
	background:none;
	border-bottom:none;
	padding:0;
	margin-top:0;
	color:#333;
	margin-bottom:3px;
	font-size:1.1em;
}
#recommend li .recommendText p{
	line-height:1.4em;
}
.recomendList li{
	padding-right:10px;
}
.recomendList h3 {
    font-size: 1.1em;
    float:left;
}
.recomendList p {
    line-height: 1.4em;
    float: left;
    width: 67%;
}
#recommend .recomendList .spImg span {
    position: absolute;
    background: #666;
    color: #fff;
    padding: 0 5px;
    border-bottom-right-radius: 3px;
}
#area02 li {
    background: url(../img/special/arrow.png) right no-repeat;
    -webkit-background-size: 18px 69px !important;
    -moz-background-size: 39px 69px !important;
    -o-background-size: 39px 69px !important;
    border-bottom: 1px solid #dbdbdb;
}
#area02 li a{
	display: block;
    padding:5px;
    text-decoration: none !important;
}
#area02 li .photobox{
	float:left;
	width:30%;
	margin-right:8px;
}
#area02 li .photobox img{
	width:100%;
	height:80px;
}
#area02 li p{
	float:left;
	width:63%;
}
#area02 li .mainText{
	background:none;
	border-bottom:none;
	padding:0;
	margin-top:0;
	color:#333;
	margin-bottom:3px;
	font-size:1.1em;
	display:block;
	font-weight:bold;
}
#area02 li .subText{
	line-height:1.4em;
	display:block;
}
/*ランキング＆口コミ*/
.rankingList a{color:#333333;background:#FFFFFF; padding:3px;display:block;line-height: 1.4em;}
.rankingList a:hover{background:#CCC;}
#ranking .rankingList li.rankingCont{position:relative; box-sizing: border-box;border-bottom:1px solid #dbdbdb;}
.rankingList li.rankingCont:before{display:block;position:absolute;top:3px;left:0;}
.rankingList li.no1:before{content:url(http://www.tabione.com/img/top/iconRank01.png);}
.rankingList li.no2:before{content:url(http://www.tabione.com/img/top/iconRank02.png);}
.rankingList li.no3:before{content:url(http://www.tabione.com/img/top/iconRank03.png);}
.rankingList li.no4:before{content:url(http://www.tabione.com/img/top/iconRank04.png);}
.rankingList li.no5:before{content:url(http://www.tabione.com/img/top/iconRank05.png);}
.rankingList li p.rankImg,#comments .commentImg{float:left;width:35%;margin-right:5px;}
.rankingList li p.rankImg img,#comments .commentImg img{width:100%;height:85px;}
.rankingCont ul.rankingData li{float:left;font-size:0.9em;margin-right:5px;color:#999999;border-bottom:none!important;}
.rankingList ul.rankingData li i,#comments .commentData i{margin-right:3px;}
.rankingList .rankPrice{text-align:right;font-weight:bold;color:#F00;}
.rankingList ul li a strong,.rankingList ul li a br{display:none;}
#comments .commentData {
    margin-top: 3px;
    color:#999;
}
#comments li{
	border-bottom:1px solid #dbdbdb;
	font-size:1em;
}
/*エリア*/
#area ul{
	padding:5px 0;
}
#area ul li{
	position:relative;
	float:left;
	width:48%;
	margin-left:5px;
	margin-bottom:5px;
}
#area ul li img{
	width:100%;
	height:135px;
}
#area ul li h3{
	position:absolute;
	bottom:0;
	width:100%;
	box-sizing: border-box;
	padding:8px 0;
	background:rgba(253,253,253,0.8);
	border-bottom:none;
	text-align: center;
	color:#333;
}
.bnrArea2 a{
	display:inline;
}
.bn_list{
	padding: 8px 0;
	overflow: hidden;
}
.bn_list li.slick-slide{
	border-radius: 3px;
    background: #FFF;
    box-shadow: 0 1px 1px #999999;
    display: inline-block;
	vertical-align: top;
	margin: 0 5px 10px;
}
.bn_list li:hover{
	opacity: 0.8;
}
.bn_list a{
	text-decoration: none;
	color:#000!important;
}
.bn_list img{
	position: absolute;
  	top: 50%;
  	left: 50%;
  	-webkit-transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
  	width: 100%;
  	height: auto;
  	min-height: 136px;
  	border-radius: 3px 3px 0 0;
}

.bn_list p{
	margin-top:3px;
	line-height: 1.4em;
	padding:5px;
}

.bn_list .spImg{
	width:100%;
	height:130px;
	position: relative;
	overflow: hidden;
	border-radius: 3px 3px 0 0;
}
.bn_list .spImg span{
	position:absolute;
	left:0;
	top:0;
	background:#666;
	color:#fff;
	padding:0px 8px;
	border-radius:3px 0 0 0;
	z-index: 1;
	font-size:0.9em;
}
.bn_list h3{
	position:absolute;
	background:rgba(253,253,253,0.8);
	text-align: center;
	width:100%;
	bottom:0;
	padding:3px 0;
	color:#333;
	text-shadow:
	white 2px 0px,  white -2px 0px,
    white 0px -2px, white 0px 2px,
    white 2px 2px , white -2px 2px,
    white 2px -2px, white -2px -2px,
    white 1px 2px,  white -1px 2px,
    white 1px -2px, white -1px -2px,
    white 2px 1px,  white -2px 1px,
    white 2px -1px, white -2px -1px;
}
.bn_list.slick-dotted.slick-slider{
	margin-bottom:15px;
}
.bn_list .slick-dots{
	bottom:-5px;
}
.bn_list .slick-next{
	right:5px;
}
.bn_list .slick-prev{
	left:5px;
}
.bn_list .slick-prev:before,.bn_list .slick-next:before{
	font-size: 25px;
	color: #999;
}
.cont_new .bn_list.area_col2{
	display: flex;
    flex-wrap: wrap;
}
.cont_new .bn_list.area_col2 li {
    flex: 0 0 45.8%;
    margin: 0 0 8px 8px;
    border: 1px solid #999;
}
#sightseeing a{
	display:table;
	padding: 8px;
}
#sightseeing a .sightImg,#sightseeing a p{
	display:table-cell;
	vertical-align: middle;
}
#sightseeing .sightImg{
	width:35%;
}
#sightseeing .sightImg img{
	width:100%;
}
#sightseeing p{
	padding-left: 10px;
    font-size: 1.1em;
    text-decoration: underline;
}

#newShop li{
	padding:8px;
	position:relative;
	border-bottom: 1px dotted #666;
}
#newShop .recImg{
	width:80%;
	margin:8px auto;
	position: relative;
	height: 160px;
    overflow: hidden;
}
#newShop li img{
	position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
    border-radius: 3px 3px 0 0;
}
.recTit {
    margin-bottom: 8px;
}
.recTit .recArea {
    background: #666;
    color: #fff;
    text-align: center;
    float:left;
    padding:2px 8px;
    margin-right:12px;
}
.recTit h3 {
    font-size: 1.2em;
}
#newShop .recPrice{
	position:absolute;
	left:8px;
	bottom:15px;
}
#newShop .recPrice span{
	font-size:1.2em;
	font-weight:bold;
	margin-left:8px;
	color:#c00;
}
#newShop .recText p{
	font-size:0.9em;
	line-height: 1.5em;
}
#newShop .reserveBtn{
	margin-top: 8px;
    float:right;
    width:50%;
}
#newShop .reserveBtn a {
    background: #f90;
    text-align: center;
    padding: 8px 20px;
    color: #fff!important;
    text-decoration: none;
    font-weight: bold;
}