/* -------------------------------

index専用スタイル

 ------------------------------ */

/* ヘッダー
-------------------------------------------------------- */
#headerArea {
	background:url(/tyo/special/resort/common/images/bg_sky_01.gif) repeat top center;
	text-align: center;
	padding: 20px 0;
}
/* ページ概要エリア
-------------------------------------------------------- */
#aboutArea {
	padding: 15px 0 70px;
	text-align: center;
	background: url(/tyo/special/resort/images/bg_about.png) repeat-x bottom center;
}
/*スライド*/
#loopslider {
	margin: 0 auto;
	width: 100%;
	height: 168px;
	text-align: left;
	position: relative;
	overflow: hidden;
}
#loopslider ul {
	height: 168px;
	float: left;
	display: inline;
	overflow: hidden;
}
#loopslider ul li {
	width: 250px;
	height: 168px;
	float: left;
	display: inline;
	overflow: hidden;
	position: relative;
}
#loopslider ul li a {
	display: block;
}
#loopslider ul li a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}
#loopslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}
#loopslider ul {
	display: inline-block;
	overflow: hidden;
}
/* エリアから見つける
-------------------------------------------------------- */
#areaSearchArea {
	background: url(/tyo/special/resort/images/bg_areaSearch.png) repeat top center;
	padding: 80px 0;
}
#areaSearchArea .inner {
	width: 960px;
	margin: 0 auto;
}
#areaSearchArea h4 {
	margin-bottom: 20px;
}
#areaSearchArea .areaBox {
	margin: 0 0 70px 70px;
}
#areaSearchArea .areaBox:first-child {
	margin-top: 20px;
}
#areaSearchArea .areaBox .img {
	width: 430px;
	height: 290px;
	float: left;
}
#areaSearchArea .areaBox.img_L .img {
	margin-right: 30px;
}
#areaSearchArea .areaBox.img_R .img {
	margin-left: 30px;
}
#areaSearchArea .areaBox .img img {
	position: relative;
	z-index: 2;
	margin-top: 10px;
}
#areaSearchArea .areaBox .img:before {
	content: "";
	display: block;
	width: 420px;
	height: 280px;
	background-color: rgba(88,73,51,0.3);
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
}
#areaSearchArea .areaBox .txt {
	float: left;
	width: 360px;
	font-size: 13px;
}
#areaSearchArea .areaBox h5 {
	margin-bottom: 30px;
}
#areaSearchArea .areaBox .seasonTxt {
	background: url(/tyo/special/resort/images/line_01.png) no-repeat top center;
	padding-top: 24px;
	margin-top: 20px;
}
#areaSearchArea .areaBox .btn {
	text-align: center;
	margin-top: 20px;
}
/* リゾートマップ
-------------------------------------------------------- */
#mapArea {
	overflow:hidden;
	background: url(/tyo/special/resort/common/images/bg_sky_02.png) center top repeat-x,
	url(/tyo/special/resort/common/images/bg_sky_01.gif) center top repeat;
}
#mapArea .wrapper {
	width:960px;
	margin:0 auto;
	padding-top:30px;
	position:relative;
}
#mapArea .wrapper .stamp {
	position:absolute;
	top: 10px;
	left: 0px;
}
#mapArea h3 {
	text-align:center;
	padding-bottom:30px;
}
#mapArea .btn {
	width:61px;
	height:41px;
	cursor:pointer;
	background:url(/tyo/special/resort/common/images/btn_open.png) no-repeat top left;
	position:absolute;
	top:40px;
	right:15px;
}
#mapArea .btn.active{
	background:url(/tyo/special/resort/common/images/btn_close.png) no-repeat top left;
}
#mapArea .btn a {
	display:none;
}
#mapArea .acdn-content {
	/*display:none;*/
	width:960px;
	background: url(/tyo/special/resort/common/images/bg_shadow_01.png) bottom left no-repeat;
	padding-bottom: 50px;
	margin:0 auto;
}
#mapArea .acdn-content .inner {
	height:450px;
	background:#ffffff;
	position:relative;
	box-shadow:0px 0px 6px 3px rgba(167, 167, 167, 0.11);
	-moz-box-shadow:0px 0px 6px 3px rgba(167, 167, 167, 0.11);
	-webkit-box-shadow:0px 0px 6px 3px rgba(167, 167, 167, 0.11);
}
#mapArea  .acdn-content .inner #map_canvas {
	height:450px;
}
#mapArea  .acdn-content .inner #map_canvas .gm-style-iw {
	text-align: center;
	padding-bottom:5px;
}
#mapArea  .acdn-content .inner #map_canvas .popBox .title {
	font-weight: bold;
	padding: 0 0 5px;
}

#themeSearchArea {
	padding: 50px 0;
	background: url(/tyo/special/resort/common/images/bg_wall_01.gif) repeat top center;
}
#themeSearchArea .inner {
	width: 960px;
	margin: 0 auto;
}
/* 目的から見つける
-------------------------------------------------------- */
#themeSelectNav {
	background: url(/tyo/special/resort/images/line_themeSearch_02.png) repeat-y top center;
	padding: 20px 40px;
	margin-bottom: 60px;
}
#themeSelectNav:before {
	content: url(/tyo/special/resort/images/line_themeSearch_01.png);
	position: absolute;
	top: 0;
	left: 0;
}
#themeSelectNav:after {
	content: url(/tyo/special/resort/images/line_themeSearch_03.png) !important;
	position: absolute;
	bottom: -30px;
	left: 0;
}
#themeSelectNav h4 {
	text-align: center;
}
#themeSelectNav .selectList {
	padding:30px 0 10px;
}
#themeSelectNav .selectList li {
	position: relative;
	display: inline-block;
	margin: 0 20px 20px 0;
	padding: 0;
}
#themeSelectNav .selectList input {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	width: 100%;
	height: 100%;
}
#themeSelectNav .selectList.theme input[type="checkbox"] + label {
	display: block;
	background: url(/tyo/special/resort/images/ico_nocheck.gif) no-repeat left center;
	padding: 7px 0 0 36px;
}
#themeSelectNav .selectList.theme input[type="checkbox"]:checked + label {
	background: url(/tyo/special/resort/images/ico_check.gif) no-repeat left center;
}
#themeSelectNav .selectList.days input[type="checkbox"] + label {
	display: block;
	background: url(/tyo/special/resort/images/ico_nocheck02.gif) no-repeat left center;
	padding: 7px 0 0 36px;
}
#themeSelectNav .selectList.days input[type="checkbox"]:checked + label {
	background: url(/tyo/special/resort/images/ico_check02.gif) no-repeat left center;
}

#themeSelectNav .theme {
	background: url(/tyo/special/resort/images/line_02.png) no-repeat center bottom;
}
#themeSelectNav .days {
	text-align: center;
}
#themeSelectNav .days .ttl {
	font-weight: bold;
	font-size: 20px;
	display: block;
	margin: 0 0 10px;
}
#themeSelectNav .btn {
	text-align: center;
}

#themeResultArea .resultList li {
	width: 180px;
	float: left;
	margin: 0 0 10px 10px;
}
#themeResultArea .resultList li .areaImg {
	display: block;
	width: 180px;
	height: 100px;
	border-radius: 5px;
	overflow: hidden;
	position: relative;
}
#themeResultArea .resultList li .areaImg:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 180px;
	height: 100px;
	z-index: 2;
}
#themeResultArea .resultList li:hover .areaImg:before {
	background-color: #000;
	opacity: 0.8;
	filter: alpha(opacity=80);
}
#themeResultArea .resultList li:hover .areaImg:after {
	display: block;
	width: 170px;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 3;
	text-align: center;
	color: #fff;
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "ＭＳ 明朝", serif;
	font-size: 20px;
	white-space: pre ;
}
#themeResultArea .resultList li .areaImg img {
	position: relative;
	top: -13px;
}
#themeResultArea .resultList li a {
	display: block;
}
#themeResultArea .resultList li a .areaTxt {
	display: block;
	margin-top: 5px;
	font-size: 95%;
}
#themeResultArea .resultList li a .areaTxt em {
	font-size: 90%;
	color: #666666;
}

#themeResultArea [class*="hidden-"] {
	display:none;
}

/*エリアごとhover時色分け*/
/*ヨーロッパ*/
#themeResultArea .resultList li.eur:hover .areaImg:before {
	background-color: #006634;
}
#themeResultArea .resultList li.eur:hover .areaImg:after {
	content: "ヨーロッパ";
}
/*中近東・アフリカ*/
#themeResultArea .resultList li.afr:hover .areaImg:before {
	background-color: #964f00;
}
#themeResultArea .resultList li.afr:hover .areaImg:after {
	content: "中近東・アフリカ";
}
/*アジア*/
#themeResultArea .resultList li.asi:hover .areaImg:before {
	background-color: #56156c;
}
#themeResultArea .resultList li.asi:hover .areaImg:after {
	content: "アジア";
}
/*ハワイ・ミクロネシア*/
#themeResultArea .resultList li.hgs:hover .areaImg:before {
	background-color: #bb4459;
}
#themeResultArea .resultList li.hgs:hover .areaImg:after {
	content: "ハワイ・\Aミクロネシア";
}
/*南太平洋・オセアニア*/
#themeResultArea .resultList li.ose:hover .areaImg:before {
	background-color: #03004c;
}
#themeResultArea .resultList li.ose:hover .areaImg:after {
	content: "南太平洋・\Aオセアニア";
}
/*北米*/
#themeResultArea .resultList li.usa:hover .areaImg:before {
	background-color: #7d0000;
}
#themeResultArea .resultList li.usa:hover .areaImg:after {
	content: "北米";
}
/*中南米・カリブ海*/
#themeResultArea .resultList li.sam:hover .areaImg:before {
	background-color: #005384;
}
#themeResultArea .resultList li.sam:hover .areaImg:after {
	content: "中南米・カリブ海";
}
/*南太平洋*/
#themeResultArea .resultList li.isl:hover .areaImg:before {
	background-color: #bb4459;
}
#themeResultArea .resultList li.isl:hover .areaImg:after {
	content: "南太平洋";
}

/*#themeResultArea .resultList li.インド洋:hover:before {
	background-color: #667e1f;
}
#themeResultArea .resultList li.eur:hover .areaImg:after {
	content: "ヨーロッパ";
}*/
