@charset "UTF-8";

body {
	font-family: 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック',MS PGothic,sans-serif;
	font-size: 10px;
	background-color: #FFFFFF;
}
.contentWrap {
	width: 950px;
	margin: 0 auto;
}

/* ▼ spot_common ▼
------------------------------------------------------------*/
.mainVisualWrapSpot {
    margin-top: 10px;
    position: relative;
    float: left;
    width: 250px;
    z-index: 100;
}
.spotBtnHorizontalRound {
	margin-left:50px;
	text-align: right;
	font-size: 12px;
}
.spotBtnHorizontalRound > a {
	text-decoration: none;
}
.spotBtnHorizontalRound > a > span {
	padding: 2px 12px;
	border: 1px #089BD1 solid;
	border-radius: 12px;
	background-color: #089BD1;
	color: #FFFFFF;
	font-weight: bold;
}
.spotBtnHorizontalRound > a > span:hover {
	border: 1px #28BBF1 solid;
	background-color: #28BBF1;
}
.spotBtnHorizontalSquare {
	margin-top: 20px;
	text-align: right;
}
.spotBtnHorizontalSquare > a:hover {
	opacity: 0.8;
}
.spotBtnHorizontalSquare > a {
	text-decoration: none;
}
.spotBtnHorizontalSquare > a > span {
	display: block;
	width: 196px;
	margin-left: auto;
	border: 1px #12A1C5 solid;
	border-radius: 3px;
}
.spotBtnHorizontalSquare > a > span > span {
	display: block;
	padding: 7px 0;
	background: #089BD1;
	background: -webkit-gradient(linear, left top, left bottom, from(#3AB4E6), to(#1E97C8));
	background: -moz-gradient(top, #3AB4E6, #1E97C8);
	background: -ms-gradient(top, #3AB4E6, #1E97C8);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#3AB4E6', endColorstr='#1E97C8', GradientType=0)";
	border: 1px #57BFE9 solid;
	border-radius: 3px;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
}
.spotBtnHorizontalSquare > a > span :hover {
	opacity: 0.8;
}
/* ▼ breadcrumb & sosial ▼
------------------------------------------------------------*/
.socialArea {
	float: right;
	margin-top: 5px;
}
.socialArea > li {
	display: block;
	float: left;
	height: 20px;
}
.btnSocialTwitter {
	width: 80px;
}
.btnSocialFacebook {
	width: 100px;
}
.btnSocialGplus {
	width: 75px;
}
.btnSocialHatena {
	width: 55px;
}
.breadcrumbWrap {
	width: 950px;
	margin: 10px auto 0;
}
.pageBack {
	float: left;
	padding: 0 10px 2px 14px;
	background: url("/SYS/cmn/images/front_002/icn_arrow_gray_left.png") no-repeat left 4px;
	font-size: 10px;
}
.breadcrumbList {
	float: left;
}
.breadcrumbList > li {
	float: left;
	font-size: 10px;
}
.breadcrumbList > li ~ li {
	padding-left: 13px;
	background: url("/SYS/cmn/images/front_002/icon_links_small.png") no-repeat 5px 6px;
}
/* ▼ keyVisual ▼
------------------------------------------------------------*/
.pickUpContent {
	margin-top: 10px;
}
.mainTitle {
	position: relative;
	padding-left: 14px;
	border-left: 6px #E73820 solid;
	font-weight: bold;
	font-size: 20px;
	line-height: 1.2;
}
.mainTitle:before {
	display: block;
	position: absolute;
	height: 24px;
	top: 0;
	left: 2px;
	border-left: 2px #E73820 solid;
	content: '';
}
.pickUpContentWrap{
	margin-top: 13px;
}
.mainVisualWrap:hover {
	opacity: 0.8;
}
.mainVisualWrap {
	position: relative;
	float: left;
	width: 474px;
	z-index: 100;
}
.mainVisualTextWrap {
	width: 448px;
	padding: 8px 13px;
}
.mainVisualTextTitle {
	font-weight: bold;
	font-size: 18px;
	color: #010101;
	line-height: 1.2;
}
.mainVisualTextInner {
	font-size: 16px;
	color: #010101;
	line-height: 1.1;
}
.pickUpContentInnerTextWrap {
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: rgba( 255, 255, 255, 0.63);
	filter: progid:DXImageTransform.Microsoft.gradient(gradienttype=0,startcolorstr=#88FFFFFF,endcolorstr=#88FFFFFF);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(gradienttype=0,startcolorstr=#88FFFFFF,endcolorstr=#88FFFFFF)";
	z-index: 100;
}
.subVisualWrap {
	float: left;
	width: 476px;
}
.subVisualWrap > li {
	position: relative;
	float: left;
	margin-left: 2px;
}
.subVisualWrap > li + li + li {
	margin-top: 2px;
}
.subVisualWrap > li:hover {
	opacity: 0.8;
}
.subVisualText {
	width: 228px;
	padding: 5px 4px;
	font-size: 10px;
	color: #000000;
	line-height: 1.2;
	word-break: break-word;
}

/* ▼ spotSearchContent ▼
------------------------------------------------------------*/
.spotSearchWrap {
	margin-top: 10px;
}
.spotSearchTitle {
	padding-left: 7px;
	border-left: 5px #E73820 solid;
	font-weight: bold;
	font-size: 16px;
	line-height: 1.2;
}
.spotSearchList{
	margin: 10px 0 0 -10px;
	font-size: 0;
}
.spotSearchList > li {
	display: inline-block;
	margin-left: 10px;
	padding: 0 3px 3px;
	width: 464px;
	border-radius: 3px;
	background-color: #EFEFED;
	vertical-align: top;
}
.spotSearchList > li + li {
	margin-top: 10px;
}
.spotSearchList > li + li + li {
	margin-top: 10px;
}
.spotSearchList > li.categorylist {
	width: 944px;
}
.spotSearchList > li.arealist {
	margin-top: 10px;
}
.spotSearchTitleTxt {
	position: relative;
	margin: 10px 0 0;
	padding-left: 9px;
	font-size: 14px;
	font-weight: bold;
	color: #35363F;
}
.spotSearchTitleTxt:before {
	display: block;
	position: absolute;
	height: 18px;
	top: 0;
	left: -2px;
	border-left: 5px solid #E73820;
	content: '';
}
.spotSearchBody {
	margin-top: 10px;
	background-color: #FFFFFF;
	border: 1px #E4E4DF solid;
	border-radius: 3px;
}
.spotSearchBody + .spotSearchTitleTxt {
	margin-top: 10px;
}
.narrowAreaBody {
	padding: 8px 11px;
}
.narrowAreaBody > li + li {
	margin-top: 8px;
}
.prefectureList > dt {
	float: left;
	width: 3em;
	font-weight: bold;
	font-size: 14px;
}
.prefectureList > dd {
	float: left;
	width: 3em;
	margin-left: 12px;
	font-size: 14px;
}
.narrowSpotContent {
	padding-top: 1px;
	padding-bottom: 3px;
	text-align: left;
}
.narrowSpotContent > li {
	display: inline-block;
	width: 70px;
	margin-top: 8px;
	margin-left: 2px;
	vertical-align: top;
}
.narrowSpotContent > li:hover {
	opacity: 0.8;
}
.narrowSpotName {
	text-align: center;
	margin-top: 4px;
	font-size: 11px;
	color: #1470CC;
}
.narrowRankingContent {
	padding: 13px 10px 10px;
}
.narrowRankingContent > li {
	position: relative;
	height: 144px;
}
.narrowRankingContent > li:after {
	content: "";
	display: block;
	height: 0;
	clear: both;
}
.narrowRankingContent > li + li {
	margin-top: 10px;
	padding-top: 15px;
	border-top: 1px #DFDFDF solid;
}
.narrowRankingContent > li > a {
	display: block;
}
.narrowRankingInfo {
	position: relative;
	float: left;
	width: 255px;
	padding-left: 48px;
	background-position: left top;
	background-repeat: no-repeat;
}
.narrowRankingInfo > dt {
	margin-top: 6px;
	font-weight: bold;
	font-size: 16px;
}
.narrowRankingInfo > dt + dd {
	margin-top: 8px;
}
.narrowRankingInfo > dd {
	font-size: 12px;
}
.narrowRankingInfo + .spotBtnHorizontalRound {
	position: absolute;
	left: 115px;
	bottom: 5px;
}
.spotBtnTop {
	padding: 0 24px !important;
	font-size: 11px !important;
}
.narrowRankingFirst {
	background-image: url("../images/icn_award_01.png");
}
.narrowRankingSecond {
	background-image: url("../images/icn_award_02.png");
}
.narrowRankingThird {
	background-image: url("../images/icn_award_03.png");
}
.narrowRankingImage {
	float: left;
}
.narrowRecommendList {
	padding: 7px 5px 1px;
	height: 280px;
}
.narrowRecommendList > li {
	display: inline-block;
	width: 211px;
	margin-left: 6px;
	vertical-align: top;
}
.narrowRecommendList > li ~ li ~ li {
	margin-top: 4px;
}
.narrowRecommendArea > dt {
	position: relative;
	padding-left: 8px;
	font-weight: bold;
	font-size: 12px;
	line-height: 1.2;
}
.narrowRecommendArea > dd {
	margin-top: 4px;
}
.narrowRecommendArea > dt:before {
	display: block;
	position: absolute;
	height: 1.2em;
	top: 0;
	left: 0;
	border-left: 4px #BEB1B1 solid;
	content: '';
}
.narrowRecommendContent {
	padding-left: 11px;
}
.narrowRecommendContent > li {
	position: relative;
	margin-top: 2px;
	font-size: 11px;
	background: url("../images/icn_chevron_blue.png") no-repeat left 2px;
}
.narrowRecommendContent > li > a {
	display: block;
	padding-left: 8px;
	word-break: break-word;
}
.narrowSpotContentWrap {
	display: inline-block;
	margin-top: 10px;
	padding: 0 3px 3px;
	width: 714px;
	border-radius: 3px;
	background-color: #EFEFED;
	vertical-align: top;
}
.narrowSpotContentWrap > .narrowSpotContent > li {
	margin-left: 22px;
}
/* ▼ footer ▼
------------------------------------------------------------*/

#footer {
	width: 950px;
	margin: 20px auto 0;
	background: rgb(255, 255, 255);
}

.footerLink {
	float: right;
}

.footerLink > li {
	display: inline;
	padding: 0 5px;
}

.footerLink > li + li {
	border-left: 1px solid rgb(204, 204, 204);
}

.scrollWrap {
	display: block;
	position: fixed;
	min-width: 85px;
	height: 85px;
	right: 20px;
	cursor: pointer;
	z-index: 300;
}
