@charset "UTF-8";
/*
 *top.css
 *
 * updated --- 2012/02/01
 */


/* mainimg
--------------------------------------------- */
#mainimg {
	position:relative;
	width:1000px;
	margin: 15px auto;
}

/* image
--------------------------------------------- */
#photoimg {
	text-align:center;
	width:950px;
	height:350px;
	
}

ul#slide li {
	margin:0;
	padding:0;
	position:absolute;
	top:0;
	left:25px;
	z-index:1;
}

#fin {
	position:absolute;
	top:258px;
	left:-53px;
	z-index:2;
}

#snorkel {
	position:absolute;
	top:150px;
	right:-25px;
	z-index:2;
}

#kayak {
	position:absolute;
	top:76px;
	right:-50px;
	z-index:2;
}

/* contents
-------------------------------------------------*/
body#top #contents {
	background:none;
	margin:0;
	padding:0;
}

/* detail
--------------------------------------------- */
.detail {
	width:490px;
}

.detail .inner {
	background:url(../common/img/clear_bg.png) repeat;
	margin:5px 0 0 0;
	padding:15px 20px;
}

.detail .inner .more {
	text-align:right;
	font-size:90%;
}

.detail .inner .more_snorkering {
	background:url(../common/img/arrow01.png) no-repeat left center;
	padding-left:15px;
}

.detail .inner .more_kayak {
	background:url(../common/img/arrow02.png) no-repeat left center;
	padding-left:15px;
}

/* info
--------------------------------------------- */

.info {
	overflow-y:scroll;
	height:202px;
}

.info .date {
	background:url(../common/img/arrow02.png) no-repeat left center;
	padding-left:15px;
}

/* introduction
--------------------------------------------- */
#introduction {
	width:560px;
	_width:580px;
	background:url(../common/img/clear_bg.png) repeat;
	margin-top:20px;
	padding:15px 10px;
	font-size:95%;
}

#introduction div {
	width:300px;
	margin-right:10px;
}

#introduction h3 {
	font-weight:bold;
	color:#006699;
	margin:10px 0 10px;
	font-size:110%;
}

/* movie
--------------------------------------------- */
#movie {
	width:400px;
	margin-top:20px;
}

/* news
--------------------------------------------- */
#news {
	width:350px;
	background:url(../common/img/clear_bg.png) repeat;
	margin-top:20px;
	padding:15px 25px;
	font-size:95%;
}

#news_title {
	position:relative;
}

#news_title p {
	position:absolute;
	right:10px;
	top:0;
	font-size:90%;
}

#news_title p a {
	background:url(../common/img/arrow03.png) no-repeat left center;
	padding-left:15px;
}

#news h3 {
	margin:2px 0 10px;
}

#news p.comment {
	margin:0 10px;
	font-size:90%;
	width:330px;
}

#news dl {
	margin:5px 10px 10px;
	width:330px;
}

#news dl#feed {
	height:325px;
	margin-bottom:0;
}

#news dl dt {
	float:left;
	width:8.5em;
	padding:2px 0;
}

#news dl dd {
	margin-left:8.5em;
	padding:2px 0;
}

/* attention
--------------------------------------------- */
.attention2020 {
    border:2px solid #F00;
    background: #FFF;
    width:1000px;
    color: #F00;
    font-weight: bold;
    margin: 1em auto 2em;
}

.attention2020 h4 {
    font-size: 120%;
    padding: 5px 10px;
    background: #F00;
    color: #FFF;
    text-align: center;
}

.attention2020 > div {
    padding: 5px 10px;
}