@charset "utf-8";

@import url(reset.css); 

body{
	-webkit-text-size-adjust: 100%;
	background: url(../../img/bg.jpg) repeat 0 0;
}

/*  LAYOUT
-------------------------------------------------------------------- */
#main_visual{
	background-color:#000;
	height:600px;
}
a:hover{ 
	opacity: 0.8;
}

/*  HEADER
-------------------------------------------------------------------- */

#head{
	height: 574px;
	background: url(../../img/bg_header.gif) repeat-x 0 0;
}
#head_body{
	position:relative;
	margin:0 auto;
	width:1154px;
	height: 574px;
	background: url(../../img/ph_header.jpg) no-repeat 0 0;
}
#head_body h1 a{
	position:absolute;
	width: 304px;
	height: 443px;
	background: url(../../img/title.png) no-repeat 0 0;
	text-indent:-1000em;
	top:0;
	left:422px;
	z-index:10px;
}
#head_body h2{
	position:absolute;
	width: 304px;
	height: 131px;
	background: url(../../img/subtitle.png) no-repeat 0 0;
	text-indent:-1000em;
	top:444px;
	left:425px;

}
.onair{
	position: absolute;
	left: 10px;
	top: 25px;
}
.tfm{
	position: absolute;
	right: 10px;
	top: 40px;
}
.niigata{
	position: absolute;
	right: 160px;
	top: 40px;
}
.jfnlist{
	position: absolute;
	width:180px;
	height:32px;
	top: 520px;
	left: 487px;
	text-indent:-1000em;	
}
.jfnlist a{
	width:180px;
	height:32px;
	display: block;
	background: url(../../img/timetable.png) no-repeat 0 0;
	opacity: 1.0;
}
.jfnlist a:hover{
	width:180px;
	height:32px;
	background-position:0 -32px;
	opacity: 1.0;
}
.mc{
	position: absolute;
	left: 0;
	top: 85px;
}
.mc li{
	display:inline-block;
	vertical-align:bottom;
	margin-right:10px;
}
.mc li.p01{
	position: absolute;
	left: 5px;
}
.mc li.p02{
	position: absolute;
	left: 185px;
	top: 105px;
}
.mc li.p03{
	position: absolute;
	left: 330px;
}
.mc li.p04{
	position: absolute;
	left: 480px;
	top: 105px;
}
.mc li.p05{
	position: absolute;
	left: 630px;

}
#sub{
	margin:0 auto;
	width:1040px;
	height:430px;
	position:relative;
}
#sub_fr{
	margin:0 auto;
	width:1000px;
	height:120px;
	position:relative;
}
.pre{
	position: absolute;
	right: 0;
	top: 100px;
}
.flip-container {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
}
	/* flip the pane when hovered */
.flip-container:hover .flipper, .flip-container.hover .flipper {
		-webkit-transform: rotateY(360deg);
		-moz-transform: rotateY(360deg);
		-o-transform: rotateY(360deg);
		transform: rotateY(360deg);

	}

.flip-container, .front, .back {
	width: 233px;
	height: 276px;
}
.flip-container a{
	width: 233px;
	height: 276px;
	display:block;
}
/* flip speed goes here */
.flipper {

	cursor:pointer;
	-webkit-transition: 1.5s;
	-webkit-transform-style: preserve-3d;

	-moz-transition: 1.5s;
	-moz-transform-style: preserve-3d;

	-o-transition: 1.5s;
	-o-transform-style: preserve-3d;

	transition: 1.5s;
	transform-style: preserve-3d;

	position: relative;
}

/* hide back of pane during swap */
.front, .back {
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
}

/* front pane, placed above back */
.front {
	z-index: 2;
	background: url(../../img/btn_omote.png) no-repeat 0 0;
}

/* back, initially hidden pane */
.back {
	width: 233px;
	height: 276px;
	background: url(../../img/btn_ura.png) no-repeat 0 0;
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);

}
#lead{
	margin:0 auto 30px auto;
	width:840px;
	height:107px;
	background: url(../../img/lead.png) no-repeat 0 bottom;
	text-indent:-1000em;
}

/*  ELEMENT
-------------------------------------------------------------------- */

.wrapper{
	margin:0 auto 50px auto;
	width:950px;
	position:relative;
}
#element h2{
	position:absolute;
	right:0;
	top:0;
	width:141px;
	height:497px;
	background: url(../../img/ttl_01.png) no-repeat 0 0;
	text-indent:-1000em;
}
.wrapper p{
	width:750px;
	font-size:13px;	
}
#element02 h2{
	position:absolute;
	left:0;
	top:0;
	width:141px;
	height:593px;
	background: url(../../img/ttl_02.png) no-repeat 0 0;
	text-indent:-1000em;
}
#element02 .itembox{
	margin-left:200px;
}
#element03 h2{
	position:absolute;
	right:0;
	top:0;
	width:143px;
	height:510px;
	background: url(../../img/ttl_03.png) no-repeat 0 0;
	text-indent:-1000em;
}
.itembox img{
	margin-bottom:10px;	
}
.bnArea{

}
.bnArea ul{
	text-align:center;	
}
.bnArea ul li{
	margin:0 2px;
	display:inline-block;
}

/*  TIMETABLE
-------------------------------------------------------------------- */
#timetable{
	margin:0 auto;
	font-size:14px;
	margin-bottom:50px;
    padding: 0 5px;
    background: url(../../img/bg_time.png) no-repeat left 0;
}
#timetable h3{
	width:190px;
	height:39px;
	margin:0 auto 20px auto;
    background: url(../../img/ttl_time.png) no-repeat 0 center;
	text-indent:-1000em;
}
.list38_01, .list38_02{
	display:inline-block;
    width: 460px;
	vertical-align:top;
	text-align:center;
}
#timetable dl {
	/*border-bottom: dotted 1px #999;*/
	margin-right: 20px;
	padding-bottom: 0.2em;
	text-align:left;
}
#timetable dt {
    clear: left;
    float: left;
    padding-top: 0.6em;
	padding-left: 10px;
    width: 195px;
}
#timetable dd {
    padding-top: 0.6em;
    padding-left: 10px;
}

/*  FOOTER
-------------------------------------------------------------------- */

#footer {
	background: url(../../img/bg_footer.gif) repeat-x 0 0;
}
#footer address {
	width:398px;
	padding-bottom:20px;
	margin:0 auto;
}

/* PAGETOP
-------------------------------------------------------------------- */

.go-top{
	position: fixed;
	bottom: 1.5em;
	right: 1.5em;
	background:url(../../img/top.png) no-repeat 0 top;
	display: none;
	width:70px;
	height:70px;
}
.go-top:hover{
	background:url(../../img/top_ov.png) no-repeat 0 top;
}