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

#wrapper {
	background: #FFFFFF;
}
#content {
	width: 1000px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	float: none;
}

/*
-------------------------------------------------------*/
#text_top {
	clear: both;
	background: url(../img/text_back_pc.png) no-repeat;
	color: #FFFFFF;
	width: 640px;
	height: 160px;
	padding: 40px 310px 0 50px;
	font-size: 14px;
	line-height: 21px;
	font-weight: bold;
}

#photo_top {
	background: url(../img/photo_back.png) left top no-repeat;
	width: 1000px;
	height: 450px;
	margin: -10px 0 10px 0;
	overflow: hidden;
	position: relative;
}


#photo_top ul li a {
  display:block;
  width:150px;
  height:50px;
}
#photo_top .navi {
  float:left;
}
#photo_top .navi-image {
  float:left;
}
#photo_top .navi-image a:hover img {
	opacity: 1.0;
	-moz-opacity: 1.0; /* Firefox */
	filter: alpha(opacity=100); /* IE6/7 */
	-ms-filter: "alpha(opacity=100)"; /* IE8 */
}

#photo_top-text ul li a {
  display:block;
  width:150px;
  height:50px;
  color:#333;
  line-height:50px;
  text-align:center;
}
#photo_top-text .navi {
  float:left;
}
#photo_top-text .navi-image {
  float:left;
}
#photo_top-text a {
  background:#eee;
}
#photo_top-text a.active {
  background:#333;
  color:#fff;
}
#photo_top .navi-image a {
	display: block;
}
#photo_top .navi-image a {
	position: absolute;
	top: 0;
	left:0;
	z-index: 8;
}
#photo_top .navi-image a.active {
	z-index: 10;
}
#photo_top .navi-image a.last-active {
	z-index:9;
}

#photo_top .navi-image {
	width: 600px;
	height: 400px;
	position: relative;
	left: 200px;
	top: 25px;
	overflow: hidden;
}

#photo_top .navi img {
	opacity: 0.5;
	-moz-opacity: 0.5; /* Firefox */
	filter: alpha(opacity=50); /* IE6/7 */
	-ms-filter: "alpha(opacity=50)"; /* IE8 */
}

#photo_top li#btn1 {
	position: absolute;
	left: 40px;
	top: 50px;
}
#photo_top li#btn2 {
	position: absolute;
	left: 40px;
	top: 140px;
}
#photo_top li#btn3 {
	position: absolute;
	left: 40px;
	top: 230px;
}
#photo_top li#btn4 {
	position: absolute;
	left: 40px;
	top: 320px;
}
#photo_top li#btn5 {
	position: absolute;
	right: 40px;
	top: 50px
}
#photo_top li#btn6 {
	position: absolute;
	right: 40px;
	top: 140px;
}
#photo_top li#btn7 {
	position: absolute;
	right: 40px;
	top: 230px;
}
#photo_top li#btn8 {
	position: absolute;
	right: 40px;
	top: 320px;
}

#photo_top .navi li {
	background: #FFFFFF;
	width: 120px;
	height: 80px;
	display: block;
	float: none;
}
#photo_top .navi li a {
	width: 120px;
	height: 80px;
	display: block;
	float: none;
}


/*sphone
-------------------------------------------------------*/
@media screen and (min-width: 0px) and (max-width: 739px) {


#content {
	width: 300px;
}
/*
-------------------------------------------------------*/
#text_top {
	background-image: url(../img/text_back_sp.png);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 320px 280px;
	width: 320px;
	height: 280px;
	margin-left: -10px;
	padding: 0px;
}
#text_top h2 img {
	width: 280px;
	height: auto;
	padding-top: 30px;
	padding-left: 20px;
}
#text_top p {
	padding-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
}
#photo_top {
	background: none;
	width: 320px;
	height: 213px;
	margin: 0px;
	margin-bottom: 20px;
	left: -10px;
	overflow: hidden;
}
#photo_top .navi-image {
	width: 320px;
	height: 213px;
	left: 0px;
	top: 0px;
	overflow: visible;
}
#photo_top .navi-image img {
	width: 320px;
	height: auto;
	position: relative;
}
#photo_top .navi {
	display: none;
}

}