/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/

* { margin: 0; padding: 0; }
/*html, body { height: 100%; background: #eee; }
body {
	font: normal 75%/170% "�l�r�o �S�V�b�N", "Osaka�|����"," Arial","Helvetica","sans-serif";
	color: #333333;
	margin: 0;
	padding: 0;
}*/
#index-wrap { width: 1002px; padding: 0 0 0 80px; margin: 0 auto; overflow: hidden; height: 100%; }

.info-col { float: left; width: 185px; height: auto; padding: 0 0 0 0; }
.info-col h2 { text-align: center; font-weight: normal; padding: 4px 0; font-size: 110%; }

.image { height: 200px; text-indent: -9999px; display: block; border-right: 1px solid white; }
.image_end {border-right: none; }


.sato { background: url(../images/04.jpg) center center no-repeat; }
.youki { background: url(../images/03.jpg) center center no-repeat; }
.tokki { background: url(../images/02.jpg) center center no-repeat; }
.glass { background: url(../images/01.jpg) center center no-repeat; }

.info-col dl { padding: 0; margin: 0; }
.info-col dt { padding: 5px; background: #1B4399; color: white; border-top: 1px solid white; border-bottom: 1px solid white; border-right: 1px solid white; }
.info-col dt.end { border-right: none; }
.info-col dd { position: absolute; left: -9999px; top: -9999px; width: 100%; background: #FFF; color: #333333; /*border-right: 1px solid white;*/ }
.info-col dd.end { border-right: none; }
.info-col dd ul { padding: 12px; display: block;}

.info-col dt:nth-of-type(1) { background: #1B4399; }
.info-col dd:nth-of-type(1) { background: #FFF; }

.info-col dt:nth-of-type(2) { background: #ff7d3e; }
.info-col dd:nth-of-type(2) { background: #ff7d3e; }

.info-col dt:nth-of-type(3) { background: #ffb03b; }
.info-col dd:nth-of-type(3) { background: #ffb03b; }

.info-col dt:nth-of-type(4) { background: #c2a25c; }
.info-col dd:nth-of-type(4) { background: #c2a25c; }

.info-col dt:nth-of-type(5) { background: #4c443c; }
.info-col dd:nth-of-type(5) { background: #4c443c; }

.info-col dt:nth-of-type(6) { background: #656b60; }
.info-col dd:nth-of-type(6) { background: #656b60; }

.curCol { -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); z-index: 1; position: relative; }

#t01 .info-col {
  border: 1px solid #FF9900;
}

#back01 {
  width: 100%;
  height: 350px;
  background: url(../img/back02.png) no-repeat center top;
  position: relative; top: 0px;
  z-index: 100;
}

#back01-02 {
  width: 100%;
  height: 350px;
  background: url(../img/back01-02.png) no-repeat center top;
  position: relative; top: 0px;
  z-index: 100;
}

#back01-03 {
  width: 100%;
  height: 360px;
  background: url(../img/back01-03.png) no-repeat center bottom;
  position: relative; top: 0px;
  z-index: 100;
}

#back02 {
  background: url(../img/03_b.png) repeat-x;
  position: relative; top: 0px;
}
#back03 {
  background: url(../img/back03.jpg) repeat-x top center #C9CFE9;
  position: relative; top: -10px;
}