@charset "utf-8";
/* CSS Document */

/*==============================
  Reset
  ==============================*/
body,div,p,strong,em,form,input,select,option,textarea,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,address,table,th,td {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
}
img {border: none;}
ul li,ol li {list-style-type: none;}

/*==============================
  Body
  ==============================*/
body {
	font-family:'メイリオ',Meiryo,Osaka, 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック',sans-serif;
	background-image:url(../images/common/bg_img.png);
	background-position:top center;
	background-color:#2e4b71;
	overflow-x: hidden;
	color:#333;
}
/*Firefox,Safari,Opera,Chrome,IE8*/
html>/**/body {
	font-size: 12px;
}
/*IE7*/
*:first-child+html body {
	font-size:81.2%;
}
/*IE4-6*/
* html body {
	font-size:81.2%;
}

a {	color:#333;}

li img { vertical-align: bottom;}

.page_top{
	clear: both;
	text-align:right;
	padding: 15px 0 0 0;
}
#line_link{
	width:850px;
	margin: 0 auto;
	padding: 10px 0;
}

.alpha a:hover img {
	opacity: 0.85;
	filter: alpha(opacity=85);
}

/*------------------------------
  clearfix
  ------------------------------*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/*Hides from IE-Mac*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/*End hide from IE-Mac*/

/*==============================
  margin
  ==============================*/
.mg10 {
	margin: 0 0 10px 0;
}
.mg20 {
	margin: 0 0 20px 0;
}

/*==============================
  shadow
  ==============================*/
#shadow{
	z-index: 5;
	position:relative;
	width: 1280px;
	margin: 0 auto;
}
.shadow_header{
	position:absolute;
	top: 0;
}

/*==============================
  header
  ==============================*/
#header {
	width: 100%;
	height : 60px;
	margin: 0;
	padding: 0;
	top: 0;
	background:url(../images/common/bg_img2.gif);
	background-position:center top;
}
#heaer_menu{
	z-index: 10;
	position:relative;
	width: 1020px;
	height: 60px;
	margin: 0 auto;
}
#heaer_menu h1{
	width: 192px;
	height: 60px;
	float: left;
}
#heaer_menu span{
	width: 154px;
	height: 60px;
	float: right;
}
#heaer_menu ul{
	width:585px;
	margin-left: 30px;
	padding-top: 20px;
	float: left;
	padding-right: 1px;
	background-image:url(../images/common/menu_hr.gif);
	background-position: right bottom;
	background-repeat: no-repeat;
}
#heaer_menu li{
	float: left;
	height: 20px;
	background-image: url(../images/common/menu_hr.gif);
	background-position:left;
	background-repeat:no-repeat;
	padding-left: 1px;
}


/*==============================
  footer
  ==============================*/
#footer{
	width: 100%;
	height: 60px;
	clear: both;
	background:url(../images/common/bg_img2.gif);
	background-position:center top;
}
#footer_menu{
	width: 960px;
	margin: 0 auto;
}
#footer_menu ul{
	width: 201px;
	float: left;
	padding-top: 20px;
	padding-right: 1px;
	background-image:url(../images/common/menu_hr.gif);
	background-position: right bottom;
	background-repeat: no-repeat;
}
#footer_menu li{
	float: left;
	height: 20px;
	background-image: url(../images/common/menu_hr.gif);
	background-position:left;
	background-repeat:no-repeat;
	padding-left: 1px;
}
#footer_menu span{
	float: right;
}



/*==============================
  main
  ==============================*/
#main{
	color:#333;
	width: 960px;
	padding: 0 0 20px 0;
	clear: both;
	margin: 0 auto 45px auto;
	background-color: rgba(255,255,255,0.2);
}
#contents_wrap{
	width: 900px;
	padding: 0 5px;
	margin: 0 auto;
	background-image:url(../images/common/contents_bg2.png);
	filter:alpha(opacity=100);
    -moz-opacity:1;
    -khtml-opacity: 1;
    opacity:1;
	background-position:center;
}

#contents_left{
	width: 220px;
	float: left;
	padding-left: 30px;
}

#contents_right{
	width: 600px;
	float: right;
	padding-right: 30px;
	padding-bottom: 20px;
}

#contents_right h2{
	width: 600px;
	padding-bottom:5px;
	margin-bottom: 10px;
	background-image:url(../images/common/title_hr.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}

#contents_footer{
	clear: both;
	background-image:url(../images/common/contents_footer_bg.gif);
	width: 900px;
	margin: 0 auto;
	padding: 18px 0;
}
#contents_footer ul{
	width: 800px;
	margin: 0 auto;
}
#contents_footer li{
	width: 380px;
	float: left;
}
.contents_footer_left{ margin-right: 40px;}
.bt{
	float:right;
	padding-top: 12px;
}
.hr1{
	width:194px;
	margin-left: 215px;
	padding-bottom: 10px;
}


/*==============================
  mainvisual
  ==============================*/
#mainvisual{
	width: 900px;
	height: 352px;
	margin: 0 auto;
	background-color:#CCC;
	position: relative;
	z-index: 4;
}
#mainvisual div {
	width: 900px;
	height: 352px;
	overflow: hidden;
	position: relative;
}
#mainvisual div div {
	top: 0;
	left: 0;
	position: absolute;
}
#mainvisual ul {
	bottom: 10px;
	right: 5px;
	width: 220px;
	position: absolute;
	z-index: 100;
}
#mainvisual ul li {
	width: 60px;
	border: #FFF 2px solid;
	float: left;
	margin-left: 5px;
	display: inline;
}
#mainvisual .active {
	filter:alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
	border: #000 2px solid;
}


/*==============================
  submenu
  ==============================*/
#sub_menu{
	width: 220px;
	margin-bottom: 10px;
}
#sub_menu li{
	width: 220px;
	height: 45px;
	margin-bottom: 5px;
}
.banner1{ margin-bottom: 10px;}
.banner2{ margin-bottom: 5px;}