@charset 'utf-8';
@import url("./style.css");

/* ============================================================================= */
/* indexCont                                                                      */
/* ============================================================================= */
#top_main{
width:100%;
height:600px;
position:relative;
}

@media only screen and  (max-width: 800px) {
#top_main{
height:320px;
}
}

@media only screen and  (max-width: 400px) {
#top_main{
height:235px;
}
}

#indexCont {
margin:0 auto 0;
height:600px;
}

@media only screen and  (max-width: 800px) {
#indexCont {
height:320px;
}
}

@media only screen and  (max-width: 400px) {
#indexCont {
height:235px;
}
}

#bannerList {
position:relative;
z-index:100;
}

@media only screen and  (max-width: 800px) {
#bannerList {
display:none;
}
}

#top_box {
    height:600px;
	width:925px;
	margin:0 auto 0;
	display: block;
	position:relative;
}

@media only screen and  (max-width: 800px) {
#top_box {
	width:100%;
	height:320px;
}
}

@media only screen and  (max-width: 400px) {
#top_box {
	width:100%;
	height:235px;
}
}

#top_main_bottom{
width:100%;
height:202px;
margin-top:-202px;
position:relative;
background: url(../images/common/bg_cont.png) repeat-x bottom center;
}


@media only screen and  (max-width: 568px) {
#top_main_bottom{
width:100%;
height:85px;
margin-top:-85px;
position:relative;
background: url(../images/common/bg_conts.png) repeat-x bottom center;
}
}

/* =topBanner
--------------------------------------------------------- */
#indexCont #topBanner {
width:925px;
height:600px;
padding-top:0px;
margin:0 auto 0;
}


@media only screen and  (max-width: 800px) {
#indexCont #topBanner {
width:100%;
height:320px;
}
}

@media only screen and  (max-width: 568px) {
#indexCont #topBanner {
height:252px;
}
}

#indexCont #topBanner a:hover { opacity: 0.7; }

#indexCont #topBanner .slogan {
position:absolute;
bottom:0px;
left:50%;
margin-left:-280px;
height:376px;
width:606px;
text-decoration:none;
display: block;
text-indent:-9999px;
background: url(../images/top/slogan.png) no-repeat;
}

@media only screen and  (max-width: 800px) {
#indexCont #topBanner .slogan {
bottom:40px;
left:5%;
height:250px;
width:461px;
margin-left:0;
background: url(../images/top/slogans.png) no-repeat;
}
}

@media only screen and  (max-width: 568px) {
#indexCont #topBanner .slogan {
display:none;
}
}

.girl{
	display:none;
}

@media only screen and  (max-width: 568px) {
.girl{
	width: auto;
	max-width:560px;
	height:100%;
	position: absolute;
    top: 30px;
	left:2.5%;
	display:block;
}

.girl img{
	width: 100%;
	height:auto;
	max-width:560px;
}
}

@media only screen and  (max-width: 400px) {
.girl{
    top: 20px;
}
}

#indexCont #topBanner .fishing {
position:absolute;
top:50px;
left:110px;
width:152px;
height:152px;
}
#indexCont #topBanner .glass {
position:absolute;
top:120px;
left:280px;
width:152px;
height:152px;
}
#indexCont #topBanner .leisure {
position:absolute;
top:230px;
left:20px;
width:242px;
height:242px;
}
#indexCont #topBanner .bbq {
position:absolute;
top:20px;
left:455px;
width:222px;
height:222px;
}
#indexCont #topBanner .saisei {
position:absolute;
top:80px;
left:700px;
width:152px;
height:152px;
}
#indexCont #topBanner .school {
position:absolute;
top:290px;
left:750px;
width:168px;
height:168px;
}

/* parallax
--------------------------------------------------------- */
#parallaxShine01 {
position: absolute;
width:54px;
height:54px;
}
#parallaxShine02 {
position: absolute;
width:42px;
height:42px;
}
#parallaxShine03 {
position: absolute;
width:36px;
height:36px;
}
#parallaxShine04 {
position: absolute;
width:20px;
height:20px;
}


/* top_info
--------------------------------------------------*/
.top_info{
    font-size:14px;
	padding-left:20px;
	margin: 10px 0 0 0;
	line-height:1.6;
	letter-spacing:0em;
}


@media only screen and  (max-width: 800px) {
.top_info{
    font-size:13px;
	padding-left:2%;
	padding-right:2%;
}
}

/* tour_list
--------------------------------------------------*/
.tour_list {
    width: 750px;
	margin: 0 0 0 0;
}

.tour_list h3{
	width: 95.5%;
	margin:5px auto 15px;
	font-size:16px;
	padding:8px 1% 5px 3.5%;
	border-top:3px solid #6E3609;
	border-bottom:1px solid #6E3609;
	color:#6E3609;
}

@media only screen and  (max-width: 800px) {
	.tour_list {
    width: 100%;
	margin: 0 0 0 0;
	float:none;
}
}

.tour_list a:hover div.menu_list { opacity: 0.5; }

.menu_list {
	cursor: pointer;
	width:355px;
	float:left;
	margin:0 2px 25px 13px;
}

.menu_list div.imgArea {
	height: 300px;
	margin-bottom: 1px;
	position: relative;
}

.menu_list div.imgArea img{
	width:353px;
	height: 298px;
	border: 1px solid #eee;
}
.menu_list div.imgArea .slim{display:block;}
.menu_list div.imgArea .wide{display:none;}

.menu_list .txtArea {
	border: 1px solid #eee;
	padding-bottom: 7px;
	overflow: hidden;
	font-size:13px;
	letter-spacing:0em;
	line-height:1.4;
	background:#FFF;
}

.menu_list .txtArea p { margin: 2px 10px 5px 12px; }

@media only screen and  (max-width: 1200px) {


.menu_list div.imgArea {
	height: auto;
	margin-bottom: 1px;
	position: relative;
}

.menu_list div.imgArea img{
	width:99%;
	height: 99%;
	border: 1px solid #eee;
}
.menu_list div.imgArea .slim{display:block;}
.menu_list div.imgArea .wide{display:none;}
}

@media only screen and  (max-width: 800px) {
.menu_list {
	cursor: pointer;
	width:47%;
	float:left;
	margin:10px 1.5% 15px 1.5%;
}
.menu_list div.imgArea .slim{display:block;}
.menu_list div.imgArea .wide{display:none;}
}

@media only screen and  (max-width: 400px) {
.menu_list {
	cursor: pointer;
	width:98%;
	float:left;
	margin:10px 1% 15px 1%;
}
.menu_list div.imgArea .slim{display:none;}
.menu_list div.imgArea .wide{display:block;}
}

.menu_list h4 {
	font-weight: bold;
	font-size: 18px;
	padding: 7px 10px 0px 20px;
	color:#157AB4;
}


@media only screen and  (max-width: 800px) {
.menu_list h4 {
	font-size: 16px;
	padding: 7px 10px 0px 10px;
}
}

.menu_list .syousai_bt{
	font-size:11px;
	color:#FFF;
	letter-spacing:0.1em;
	text-align: center;
	background-color:#169EB7;
	padding:2px 5px 2px 5px;
	margin-top:5px!important;
	-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;
}
