/* CSS Document */

/********************************************************************/
/*								LAYOUT								*/
/********************************************************************/
/******************** HEADER ********************/
.header_logo {
	width:500px;
	height:30px;
	margin:0px;
	float:left;
	display:inline;
}

.header_menu {
	height:30px;
	margin:0px;
	float:right;
}

/******************** CONTENTS ********************/
/* line1 */
.top_pic {
	width:990px;
	height:480px;
	background-color:#F0F0F0;		/* 仮 */
	margin:0px auto;
}

/* line2 & line3 */
.topi_box {
	width:240px;
	height:400px;
	margin:0px;
	float:left;
}

.topi_box2 {
	width:490px;
	height:400px;
	margin:0px;
	float:left;
}

.topi_box3 {
	width:490px;
	height:400px;
	margin:0px;
	float:right;
}

.topi_space {
	width:10px;
	height:400px;
	margin:0px;
	float:left;
}

.topi_line {
	width:1px;
	height:400px;
	background-color:#DDDDDD;
	margin:0px auto;
}

.line_line {
	width:990px;
	height:1px;
	background-color:#DDDDDD;
	margin-bottom:20px;
}

.topi_tmb2 {
	width:60px;
	height:60px;
	background-color:#555555;		/* 仮 */
	float:right;
	margin-right:10px;
}

/* topi box */
.topi_tmb220 {
	width:220px;
	height:130px;
	background-color:#555555;		/* 仮 */
	margin:0px auto;
}

.topi_tmb60 {
	width:60px;
	height:60px;
	background-color:#555555;		/* 仮 */
	float:right;
	margin-right:10px;
}

.topi_tmb80 {
	width:250px;
	height:100px;
	float:right;
	margin-right:10px;
}

.topi_tmb80 ul {
	margin:0px;
	padding:0px;
}

.topi_tmb80 li {
	width:80px;
	height:100px;
	background-color:#555555;		/* 仮 */
	float:left;
	margin-right:5px;
	list-style:none;
}

.topi_tmb80 li:last-child {
	margin:0px;
}

.sch_line {
	width:220px;
	height:1px;
	background-color:#DDDDDD;
	margin:10px auto;
}

/* topi box2 */
.topi_tmb470 {
	width:470px;
	height:130px;
	background-color:#555555;
	margin:0px auto;
}

/* topi btn(470px) */
.topi_btn {
	width:470px;
	height:30px;
	margin:0px auto;
}

.topi_btn ul {
	margin:0px;
	padding:0px;
}

.topi_btn li {
	width:470px;
	height:30px;
	list-style:none;
}

.topi_btn li a {
	width:470px;
	height:30px;
	background-color:#A8002F;
	text-align:center;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
	text-decoration:none;
	line-height:30px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border:1px solid #000000;
	display:block;
}

.topi_btn li a:hover {
	background-color:#FFFFFF;
	color:#A8002F;
	border:1px solid #A8002F;
}

/* tmb plural */
.topi_tmb60s_box {
	height:60px;
	margin: 0px 0px 10px 20px;
}

.topi_tmb60s {
	width:60px;
	height:60px;
	margin-right:5px;
	float:left;
	display:inline;
}


/******************** FOOTER ********************/
.link_box {
	width:240px;
	height:250px;
	margin:0px;
	float:left;
}

.link_box2 {
	width:240px;
	height:250px;
	background-color:#A8002F;
	text-align:right;
	margin:0px;
	float:left;
}

.link_space {
	width:10px;
	height:250px;
	margin:0px;
	float:left;
}

.link_line {
	width:1px;
	height:210px;
	background-color:#222222;
	margin:20px auto;
}


/********************************************************************/
/*                         SLIDER (INDEX)                           */
/********************************************************************/

#slider {
	width:990px;
	height:480px;
	margin:0;
	/*margin-bottom:20px;*/
}

#slider a:link    {color:#555555;text-decoration:none;}
#slider a:visited {color:#555555;text-decoration:none;}
#slider a:active  {color:#333333;text-decoration:none;}
#slider a:hover   {color:#333333;text-decoration:none;}


#slide-container {
	position: relative;
	width: 988px;
	height: 478px;
	background-color: #fff;
	border: 1px solid #ccc;
	overflow: hidden;
}
.item {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.item a {
	display: block;
	width: 988px;
	height: 478px;
}
.item .background img {
	max-width: 988px; /* to avoid max-width: 100% of Twitter Bootstrap */
}
.foreground {
	position: absolute;
}
.foreground .element {
	position: relative;
	left: 80px;
	width: 480px;
	color: #555;
	/*text-shadow: 1px 1px 2px #000000;*/
}
.foreground .element.icon {
	top: 350px;
	left: 10px;
	width: 114px;
	height: 114px;
	background: transparent url(../images/material/mark114.png) no-repeat;
	background-position: 0 0;
}
.foreground .element.icon0 {
	top: 350px;
	left: 10px;
	width: 114px;
	height: 114px;
	background-position: 0 0;
}
.background {
	position: absolute;
	overflow: hidden;
}
.background .overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0%;
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, transparent), color-stop(80%, rgba(255,255,255,0.8)));
	background: -webkit-linear-gradient(top, transparent 0%, rgba(255,255,255,0.8) 80%);
	background: -moz-linear-gradient(top, transparent 0%, rgba(255,255,255,0.8) 80%);
	background: -o-linear-gradient(top, transparent 0%, rgba(255,255,255,0.8) 80%);
	background: -ms-linear-gradient(top, transparent 0%, rgba(255,255,255,0.8) 80%);
	background: linear-gradient(top, transparent 0%, rgba(255,255,255,0.8) 80%);
}
.foreground .element.title {
	top: 220px;
	font-size: 48px;
	font-weight:bold;	
	text-transform: uppercase;
}
.foreground .element.subtitle {
	top: 240px;
	font-weight:bold;	
	font-size: 17px;
}
.ui-loader {
	display: none;
}

#pager-area {
	position: relative;
	width: 988px;
	margin-top: 20px;
}
#slide-pagination .prev {
	position: absolute;
	left: 0;
}
#slide-pagination .next {
	position: absolute;
	right: 0;
}
#slide-indicator {
	text-align: center;
}
#slide-indicator li {
	display: inline;
	margin-left: 20px;
}
#slide-indicator li:first-child {
	margin-left: 0;
}
#slide-indicator li a.active {
	font-weight: bold;
}


/********************************************************************/
/*								CLEAR								*/
/********************************************************************/
.clear {
	clear:both;
}