﻿@charset "utf-8";  
/*------------------------------------------------------------ 
    TOP css
------------------------------------------------------------*/  

/* slide */

.wideslider {
	width: 100%;
	height: 550px;
	padding-bottom:32px;
	text-align: left;
	position: relative;
	overflow: hidden;
	background:#634D8A;
}

.wideslider:before{
	display:block;
	content:"";
	width:50px;
	height:50px;
	position:absolute;
	left:50%;
	top:50%;
	margin:-31px 0 0 -31px;
	border: 6px solid rgba(150, 150, 150, 0.6);
	border-top: 6px solid rgba(255, 255, 255, 1);
	border-radius:50%;
	-webkit-animation: fancybox-rotate .8s infinite linear;
	animation: fancybox-rotate .8s infinite linear;
	background: transparent;
}

@-webkit-keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }

@keyframes fancybox-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }

.wideslider ul,
.wideslider ul li {
	float: left;
	display: inline;
	overflow: hidden;
}

.wideslider_base{
	top: 0;
	position: absolute;
}

.wideslider_wrap{
	top: 0;
	position: absolute;
	overflow: hidden;
}

.wideslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.wideslider ul{
	display: inline-block;
	overflow: hidden;
}

.slider_prev,
.slider_next{
	top: 0;
	overflow: hidden;
	position: absolute;
	z-index: 50;
	background:#fff;
}

.slideBtn{ display:none;}

.pagination{
	bottom:0px;
	left: 0;
	width: 100%;
	height: 12px;
	text-align: center;
	position: absolute;
	z-index: 200;
	background:#634D8A;
}

.pagination a{
	display:inline-block;
	vertical-align:top;
	width:12px;
	height:12px;
	margin:0 12px;
	background:#3A2D51;
	border-radius:50%;
}

.pagination a.active,
.pagination a:hover{ background:#fff;}

/* contentsNavi */

.guideList{
	width:100%;
	padding:20px 0 30px;
	margin-top:-1px;
	margin-bottom:30px;
	background:#634D8A;
}

.guide{
	width:157px;
	padding:9px 9px 0;
	text-align:center;
	background:#fff;
	position:relative;
	box-shadow:rgba(153, 153, 153, 0.65) 0px 0px 3px 0px;
	-webkit-box-shadow:rgba(153, 153, 153, 0.65) 0px 0px 3px 0px;
	-moz-box-shadow:rgba(153, 153, 153, 0.65) 0px 0px 3px 0px;
	position:absolute;
	z-index:10;
	behavior:url("/common/js/PIE.htc");
}

.guide:last-child{ margin:0;}

.guideHd{
	display:block;
	font-size:134%;
	font-weight:bold;
	color:#666;
}

.guideHd_en{
	display:block;
	font-size:92%;
}
.g_farm .guideHd_en{ color:#FF99CC;}
.g_cafe .guideHd_en{ color:#FF9966;}
.g_lave .guideHd_en{ color:#846DAE;}
.g_access .guideHd_en{ color:#70CBE1;}
.g_shop .guideHd_en{ color:#865779;}


.glink{
	display:block;
	width:157px;
	height:74px;
	position:relative;
}
.glink:before{
	content:"";
	display:block;
	width:25px;
	height:25px;
	background:url(../img/guideBtn.png) no-repeat;
	position:absolute;
	bottom:0;
	left:66px;
}

.g_cafe:before{ background-position:-25px 0;}
.g_lave:before{ background-position:-50px 0;}
.g_access:before{ background-position:-75px 0;}
.g_shop:before{ background-position:-100px 0;}


.guideInner{
	width:970px;
	margin-right:auto;
	margin-left:auto;
	position:relative;
	height:240px;
}

#guide01{ left:0;}
#guide02{ left:198px;}
#guide03{ left:396px;}
#guide04{ left:594px;}
#guide05{ left:792px;}

.guideNavi{
	display:none;
	width:157px;
	padding:20px 0;
	background:#fff;
}

.guideNavi a{
	display:block;
	width:137px;
	height:17px;
	line-height:17px;
	text-align:left;
	padding:10px 0 10px 20px;
	border-bottom:1px solid #ccc;
	color:#333;
	font-size:109%;
	background:no-repeat 3px 10px;
}

#guide01 .guideNavi a{ background-image:url(../img/icon_farm.jpg);}
#guide02 .guideNavi a{ background-image:url(../img/icon_cafe.jpg);}
#guide03 .guideNavi a{ background-image:url(../img/icon_east.jpg);}
#guide04 .guideNavi a{ background-image:url(../img/icon_access.jpg);}

.guideNavi li:last-child a{ border:none;}


/*------------------------------------------------------------ 
    contents - left -
------------------------------------------------------------*/  

/* slide */

#slider_top,
.slider_top{
	width:635px;
	height:200px;
	overflow:hidden;
	position:relative;
}

#pagination_top,
.pagination_top{
	width:635px;
	padding:15px 0 20px;
	position:relative;
	text-align:center;
}

#pagination_top a,
.pagination_top a{
	display:inline-block;
	vertical-align:top;
	width:12px;
	height:12px;
	background:#ccc;
	margin:0 12px;
	border-radius:50%;
}

#pagination_top a.active,
.pagination_top a.active,
#pagination_top a:hover,
.pagination_top a:hover{ background:#634D8A;}



/* news */

.newsArea{
	width:633px;
	border:1px solid #EBE4DC;
	background:#fff;
	margin-bottom:30px;
}

.newsHd{
	width:563px;
	height:50px;
	padding:0 12px 0 58px;
	background:#634D8A url(../img/icon_newsttl.png) no-repeat 15px bottom;
}

.newsTtl{
	float:left;
	font-size:134%;
	color:#fff;
	font-weight:bold;
	line-height:50px;
}

.more{
	width:147px;
	height:30px;
	margin-top:20px;
	float:right;
}

.more a{
	display:block;
	width:100%;
	height:100%;
	text-indent:10px;
	line-height:30px;
	color:#634C8A;
	background:#fff url(../img/icon_more.png) no-repeat 130px;
	font-size:117%;
	font-weight:bold;
	position:relative;
	border-radius: 5px 5px 0 0;
	behavior:url("/common/js/PIE.htc");
}

.newsList{
	width:615px;
	padding:0 9px;
	overflow:hidden;
}

.newsList li{
	width:615px;
	padding:15px 0;
	overflow:hidden;
	margin-bottom:-1px;
	border-bottom:1px dotted #ccc;
}

.icon{
	width:70px;
	height:23px;
	float:left;
}

.news{
	width:530px;
	float:right;
}

.date{
	color:#666;
	line-height:23px;
}

.ttl{
	font-size:117%;
	font-weight:bold;
	color:#333;
}

/*------------------------------------------------------------ 
    contents - right -
------------------------------------------------------------*/  

/* 本日の天気 */

.weather{
	width:280px;
	padding:15px 10px 10px;
	background:#336633;
}

.weatherHd{
	font-size:134%;
	color:#fff;
}

.weatherHd_en{
	font-size:84%;
	color:#fff;
}

.todaysWeather{
	width:242px;
	overflow:hidden;
	margin:10px 19px 0;
	padding-bottom:15px;
	border-bottom:1px solid #fff;
}

.todaysWeather ul{ width:243px;}
.todaysWeather li{
	width:81px;
	float:left;
}

.temp{
	width:80px;
	height:48px;
	line-height:48px;
	text-align:center;
	font-size:175%;
	color:#fff;
	border-right:1px solid #fff;
}

.tempTtl{
	width:60px;
	height:20px;
	text-align:center;
	line-height:20px;
	margin:10px 11px 0 10px;
	background:#ADC2AD;
	color:#336633;
	border-radius:5px;
	position:relative;
	behavior:url("/common/js/PIE.htc");
}

.weatherBtn{
	width:196px;
	height:27px;
	margin:15px 23px 0;
}

.weatherBtn a{
	display:block;
	width:100%;
	height:100%;
	text-align:center;
	line-height:27px;
	color:#336633;
	font-size:117%;
	background:#fff;
	border-radius:5px;
	position:relative;
	behavior:url("/common/js/PIE.htc");
}

.tempMovie{
	line-height:45px;
	text-align:center;
	font-size:117%;
	color:#fff;
}

.expansion{
	width:90px;
	height:25px;
	float:left;
}

.expansion a{
	display:block;
	height:25px;
	line-height:25px;
	padding-left:32px;
	background:url(../img/icon_expansion.png) no-repeat left;
	font-size:117%;
	color:#fff;
}

.comment{
	float:right;
	line-height:15px;
	padding:5px 0;
	width:180px;
	text-align:right;
	color:#fff;
}

.comment2{
	line-height:15px;
	padding:5px 0;
	text-align:right;
	color:#fff;
	font-size:109%;
}

.cameraImg{
	width:280px;
	height:210px;
	background:#fff url(../common/img/loading.gif) no-repeat 50% 50%;
}

#camera2{ display:none;}

#tabMovie{
	width:100%;
	margin-bottom:15px;
	overflow:hidden;
	padding-top:5px;
}

#tabMovie li{
	width:138px;
	height:38px;
}

#tabMovie a{
	display:block;
	width:auto;
	padding:0 24px;
	height:30px;
	text-align:center;
	line-height:30px;
	background: #ADC2AD;
	color: #336633;
	border-radius:5px;
	font-size:117%;
	position:relative;
}

#tabMovie a.selected:before{
	display:block;
	content:"";
	width:0;
	height:0;
	border:5px solid transparent;
	border-top:8px solid  #fff;
	position:absolute;
	bottom:-12px;
	left:50%;
}

#tabMovie a:hover{ background-color:#fff;}
#tabMovie .selected{ background:#fff url(../img/icon-camera.png) no-repeat 7px 50%;}


/* サイドコンテンツ */

.sideCont{
	width:300px;
	margin-top:20px;
}

.photoHd{
	width:195px;
	height:50px;
	line-height:50px;
	padding:15px 0 0 105px;
	color:#fff;
	font-size:150%;
	font-weight:bold;
	background:url(../img/photoHd.png) no-repeat;
}

.lavesanHd{
	display:table-cell;
	width:94px;
	height:59px;
	padding:0 120px 9px 86px;
	text-align:center;
	vertical-align:middle;
	line-height:1.2;
	background:url(../img/lavesanHd.png) no-repeat;
	color:#fff;
	font-size:134%;
	font-weight:bold;
}

.blogHd{
	width:210px;
	height:50px;
	line-height:50px;
	padding:20px 0 0 90px;
	color:#fff;
	font-size:150%;
	font-weight:bold;
	background:url(../img/blogHd.png) no-repeat;
}

.sideInner{
	width:270px;
	padding:15px 14px 14px;
	background:#fff;
	overflow:hidden;
	border:1px solid #CCC5BE;
}

.sideImg{
	width:60px;
	height:60px;
	float:left;
}

.sideInfo{
	width:190px;
	float:right;
}

.txt{
	margin-top:5px;
	word-break:break-all;
}

.txt a{
	color:#634D8A;
	font-size:117%;
	font-weight:bold;
	line-height:1.2;
}

#fb_img{
	width:60px;
	float:left;
	line-height:60px;
}

#fb_img img:hover{ opacity:0.7;}

#fb-pageWrap{
	height:350px;
	background:#fff;
}

 /* 営業時間 */
#column{
	width:auto;
	text-align:center;
	border:7px solid #634D8A;
	margin-bottom:20px;
}

#columnHd{
	width:100%;
	padding-bottom:7px;
	text-align:center;
	color:#FFF6EE;
	font-size:134%;
	line-height:23px;
	background:#634D8A;
}

#columnDate{
	color:#634D8A;
	font-size:234%;
	font-family:Arial, Helvetica, sans-serif;
	padding:10px 10px 5px;
	line-height:1.2;
}

#columnTxt{
	color:#634D8A;
	font-size:109%;
	padding:0 10px 8px;
}

