﻿@charset "UTF-8";



/*************resetcss***************/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h4,h5,h6,pre,form,fieldset,input,textarea,html,span,object,iframe,p,blockquote, a,abbr,acronym, address,big, cite, code, del, dfn, em, font, ins, kbd, q, img,s, samp,small,strike, strong, sub, sup, tt, var,label, legend, table, caption, tbody, tfoot,thead, tr, th, td { 
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-weight:inherit;
	font-style:inherit;
	font-size:100%;
	font-family:inherit;
	vertical-align:baseline;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

fieldset,img,a img { 
	border:0;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}

ol,ul,li {
	list-style:none;
}

caption,th {
	text-align:left;

}
h1,h2,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

caption, th, td{
	text-align:left;
	font-weight:normal;
}

input, textarea, select, button{
	font-size:100%;
	font-family:inherit;
}
select{
	margin:inherit;
}

/* Fixes incorrect placement of numbers in ol's in IE6/7 */

ol{margin-left:2em;}

/* == clearfix == */

.clr:after{
	content: " ";
	display:block;
	font-size: 0.1em;
	height:0;
	line-height: 0; 
	clear:both;
	visibility:hidden;
}

.clr{display:inline-block;}
* html .clearfix{height:1%;}

.clr{display:block;}

.fl{
	float: left;
}

.fr{
	float: right;
}

a{
	color: #666;
	text-decoration: none;
}

a:hover{
	color:#3366cc;;
	text-decoration: none;
}



/***********************************/



/***********body********/


html,body{
	text-align	: center;
	margin		: 0 auto;
	font-size	: 12px;
	color		: #333;
	line-height: 1.5em;
}


img{
	border		: none;
}


a:hover{
	text-decoration : none;
}

h1{
	font-size	: 12px;
	font-weight	: normal;
	color:#c0c0c0;
}

h1 a,
h1 a:hover{
	color		: #fff;
	text-decoration:none;

}

.top_h1{
	text-align	: right;

}

.border{
	margin: 0 0 0 10px;
}

/* main */
#main{
	width		: 760px;
	margin		: 5px auto 10px  auto;
	padding		: 0;
	text-align	: left;
}

#maincontent{
	clear: both;
	background	: url("img/bg_main.gif") repeat-y;

}



/* header */
#header{
	padding		: 0 5px;
	height		: 62px;
	background	: url("img/bg_top.gif") no-repeat;
	background-position	: top;
}


.sub_menu{
	text-align	: right;
	margin: 15px 0 0 100px;
	/*border: 1px solid #00f;*/
	color: #fff;
}


.sub_menu a{
	color		: #fff;
	letter-spacing	: 0.1em;

}

.sub_menu a:hover{
	text-decoration	: underline;
	color		: #fff;
}


.header_logo{
	padding: 5px 0 0 10px;
	width: 340px;
	float: left;
}


.header_inner{
	float: right;
	margin: 10px 10px 0 0;
	width: 300px;
	/*border: 1px solid #ccc;*/
}



.maininner{
	background	: url("img/bg_main02.gif") repeat-y;
}


/* menu2 */
#menu2{
	width		: 750px;
	height		: 47px;
	margin		: 0 0 0 6px;
	padding		: 0;
	background	: url("http://www.southern-reef.com/img/menu.gif") no-repeat top center;
}

#menu2 a:link,
#menu2 a:visited,
#menu2 a:active {
	text-decoration	: none;
}

#menu2 ul{
	width		: 750px;
	height		: 42px;
	margin		: 0; 
	position	: absolute;
	list-style	: none;
}

#menu2 li{
	position	: absolute;
	height		: 42px;
	margin		: 0;
}

#menu2 li a{
	display		: block;
	height		: 42px;

}

#menu2 li.home2{
	left		: 1px;
	width		: 94px;
	height		: 42px;
}

#menu2 li.home2 a:hover{
	left		: 1px;
	width		: 94px;
	height		: 42px;
	border-bottom:5px solid #ff0000;
}

#menu2 li.shop2{
	left		: 96px;
	width		: 95px;
	height		: 42px;
}

#menu2 li.shop2 a:hover{
	left		: 96px;
	width		: 95px;
	height		: 42px;
	border-bottom:5px solid #ffcc33;	
}

#menu2 li.schnorchel2{
	left		: 192px;
	width		: 107px;
	height		: 42px;
}

#menu2 li.schnorchel2 a:hover{
	left		: 192px;
	width		: 107px;
	height		: 42px;
	border-bottom:5px solid #ccff33;
}

#menu2 li.taiken2{
	left		: 300px;
	width		: 123px;
	height		: 42px;
}

#menu2 li.taiken2 a:hover{
	left		: 300px;
	width		: 123px;
	height		: 42px;
	border-bottom:5px solid #33ff33;
}

#menu2 li.licence2{
	left		: 424px;
	width		: 120px;
	height		: 42px;
}

#menu2 li.licence2 a:hover{
	left		: 424px;
	width		: 120px;
	height		: 42px;
	border-bottom:5px solid #33ccff;
}

#menu2 li.fundiving2{
	left		: 544px;
	width		: 121px;
	height		: 42px;
}

#menu2 li.fundiving2 a:hover{
	left		: 544px;
	width		: 121px;
	height		: 42px;
	border-bottom:5px solid #3366ff;
}

#menu2 li.qa2{
	left		: 666px;
	width		: 82px;
	height		: 42px;
}

#menu2 li.qa2 a:hover{
	left		: 666px;
	width		: 82px;
	height		: 42px;
	border-bottom:5px solid #cc33ff;
}


.topinfo{
	width: 750px;
	
	padding: 15px 0 15px 14px;
	clear: both;
	/*border-bottom: 5px solid #b7b7b7;*/
}


.topinfo_fr{
	/*border: 1px solid #00f;*/
	/*margin: 0 0 0 10px;*/
}


.topinfo_fl{
	/*border: 1px solid #f00;*/
	margin: 0 10px 0 0;
}


.mailbox{
	margin: 10px 0 5px 10px;	
}


.mail{
	width		: 187px;
	height		: 17px;
	padding		: 0 0 0 23px;
	font-size	: 12px;
	background	: url("img/mail.gif") no-repeat left;
}

.border_top{
	margin: 0 0 0 7px;
}


.shop_information{
	background	: url("img/southern-reef_12.jpg") no-repeat;
	width		: 252px;
	height		: 80px;
	margin: 5px 0 0 0;
	/*border: 1px solid #00f;*/
}


.shop_information p{
	line-height: 1.5em;
	letter-spacing: 0.1em;
	padding: 7px 5px 0 5px;
	font-size: 10px;
}


/***************leftcol*****************/


.leftcol{
	/*border-right: 1px dotted #999;*/
	width: 200px;
	padding: 0 5px;

}

.bar_fl{
	margin: 15px 0 10px 5px;
}


.banner01_fl{
	padding: 0 0 10px 5px;
}

.banner02_fl{
	padding: 0px 0 10px 8px;
}

.banner03_fl{
	padding: 0 0 0 5px;
}


.bannerinfo{
	font-size: 10px;
	line-height: 1.5em;
	padding: 0 0 10px 5px;

}


.leftcol ul.sub1{
	width		: 195px;
	margin		: 3px 0 0 5px;
	list-style	: none;
}

.leftcol ul.sub1 li{
	border-bottom: #333 1px dashed;
	padding		: 0 5px;

}

.leftcol ul.sub1 li a,
.leftcol ul.sub1 li a:hover{
	width		: 195px;
	list-style	: none;
	padding		: 2px 5px;

}



/***************rightcol*****************/


.rightcol{
	width: 520px;
	/*border-left: 1px dotted #999;*/
	padding: 0 0 0 10px;
}


.shopinfo{
	width: 510px;
	border: 1px solid #ff0;
	background-color: #ffc;
	padding: 10px 5px;
}


h2.shopinfo_title{
	font-weight: bold;
	font-size: 14px;
}



.link_box{
	clear: both;
}


.link01info{
	font-weight: bold;
	margin: 0 0 10px 0;
}

.link01{
	background	: url("img/southern-reef_252.jpg") no-repeat top;
	height: 35px;
	width: 520px;
}


.link01 h3{
	font-size: 14px;
	font-weight: bold;
	padding: 10px 0 0 20px;
}



.linkinfo{
	margin: 10px 0 0 0;
}

p.link_icon{
	margin: 10px 25px 4px 0;
}




/***************目的で探す*****************/

.mokuteki{
	width: 520px;
	height: 265px;
	background	: url("img/southern-reef_182.jpg") no-repeat top;
	margin: 10px 5px 0 0;
}

.mokuteki_top{
	width: 520px;

}

.mokuteki h3{
	font-weight: bold;
	font-size: 14px;
	padding: 20px 0 0 265px;
}



.mokuteki_top01{
	width: 230px;
	margin: 3px 0 0 20px;

}

.mokuteki_photo01{
	padding: 0 ;
}


.top01_inner{
	width: 140px;
	padding: 0 0 0 5px;
}


.menu01{
	font-size: 12px;
	font-weight: bold;

}

.menu01 a{
	text-decoration: underline;
	
}

.mokuteki_info01{
	font-size: 10px;
	line-height: 1.2em;
}




.mokuteki_top02{
	width: 230px;
	margin: 3px 0 0 27px;
}

.top02_inner{
	width: 140px;
	padding: 0 0 0 5px;
}


.menu02{
	font-size: 12px;
	font-weight: bold;

}

.menu02 a{
	text-decoration: underline;
}

.mokuteki_info02{
	font-size: 10px;
	line-height: 1.2em;
}




.mokuteki_bottom{
	width: 520px;
}


.mokuteki_top03{
	width: 230px;
	margin: 31px 0 0 20px;

}

.mokuteki_top04{
	width: 230px;
	margin: 30px 0 0 27px;

}


.mokuteki_top05{
	width: 230px;
	margin: 10px 0 0 20px;
	/*border: 1px solid #00f;*/

}

.mokuteki_top06{
	width: 230px;
	margin: 10px 0 0 27px;
	/*border: 1px solid #f00;*/

}


.mokuteki_top07{
	width: 230px;
	/*margin: 10px 0 0 20px;
	_margin: 15px 0 0 10px;*/
	border: 1px solid #00f;

}

.mokuteki_top08{
	width: 230px;
	/*margin: 10px 0 0 27px;*/
	border: 1px solid #f00;

}


.next_info{
	margin: 20px 0 0 0;
}



.information{
	background	: url("img/southern-reef_362.jpg") no-repeat top;
	height: 35px;
	width: 520px;
	margin: 15px 5px 30px 0;
}

.information h3{
	font-size: 14px;
	font-weight: bold;
	padding: 10px 0 0 20px;
}

.information p{
	font-weight: bold;
	
}

.kuchikomi_info ul{
	margin		: 5px 10px;
}

.kuchikomi_info li{
	list-style-type	: none;
}

.kuchikomi_info li a{
	color: #3366cc;
	text-decoration: underline;
}


.kuchikomi_info a{
	color: #3366cc;
	text-decoration: underline;
}


.kuchikomi{
	background	: url("img/southern-reef_402.jpg") no-repeat top;
	height: 35px;
	width: 520px;
	margin: 15px 5px 30px 0;
	/*border: 1px solid #00f;*/
}

.kuchikomi h3{
	font-size: 14px;
	font-weight: bold;
	padding: 10px 0 0 20px;
}

.kuchikomi p{
	font-weight: bold;
	margin: 10px 0 0 0;
}



.photo{
	margin		: 10px 5px 15px 0;

}

.photoinner{
	background	: url("img/southern-reef_422.jpg") no-repeat top;
	height: 35px;
	width: 520px;
	margin: 15px 0 5px 0;
}

.photo h3{
	font-size: 14px;
	font-weight: bold;
	padding: 10px 0 0 20px;

}

.photo img{
	margin		: 0 5px;
}

.photo a{
	text-decoration	: none;
	margin		: 0 5px;
}

.kuchikomi_info{
	margin: 15px 0 0 0;
}





/* footer */

#footer{
	padding		: 5px 10px 20px 10px;
	margin		: 0;
	clear		: both;
	background	: url("img/bg_bottom.gif") no-repeat;
	background-position	: bottom;
	font-size	: 12px;
}
span.new {
    display: none;
    color: red;
    font-weight: bold;
	}



#footer p{
	margin		: 0px 5px;
	text-align	: left;
}

#footer strong a{
	text-decoration	: none;
	color		: #333;
}

#footer strong a:hover{
	text-decoration	: underline;
	color		: #333;
}

#footer hr{
	color		: #999;
	height		: 1px;
	margin		:3px 0 5px 0;
}

#flash{
	/*border: 1px solid #f00;*/
	margin: 0 10px 0 0;
	float: left;
}

