/* generated by: jsdo.it - http://jsdo.it/alicex/45Jv */
/* Copyright alicex - http://jsdo.it/alicex */
/* Licensed under MIT License - http://www.opensource.org/licenses/mit-license.php */

@import url(http://fonts.googleapis.com/css?family=Roboto:500);

/*---default---*/
/*
body {
	margin:0;
	padding:0;
	font:13px "ＭＳ Ｐゴシック",arial,helvetica,clean,sans-serif;
	line-height:1.6;
	color:#666;
}
ul,li {margin:0;padding:0;list-style:none;}
.section {
    margin-bottom:10px;
    padding-bottom:10px;
    width:400px;
    border-bottom:dotted 1px #CCC;
}

img{
  border: none;
}
h1{
  font-size: 34px;
  font-family: Roboto;
  margin: 20px auto;
  text-align: center;
}
*/


/*---contents---*/
#sliderImg {
	position:relative;
	margin:0;
	width:762px;
	height:464px;
  /* border-radius: 4px; */
  background: #eee;
  background: url(../img/gif-load.gif) no-repeat center center;
}
#sliderImg #slider li {
	position:absolute;
	top:0px;
	left:0px;
	z-index:0;
  background: #fff;/*bug fix*/
}

#sliderImg #thumbnail {
	position:absolute;
	bottom:10px;
  left: 0px;
	z-index:100;
  overflow: hidden;
}
#sliderImg #thumbnail li {
	float:left;
	cursor:pointer;
  width: 183px;
  height: 57px;
  margin-right: 10px;
}
#sliderImg #thumbnail li.thumb01 {background:url(../img/btn_slider01_active.gif) no-repeat;}
#sliderImg #thumbnail li.thumb02 {background:url(../img/btn_slider02_active.gif) no-repeat;}
#sliderImg #thumbnail li.thumb03 {background:url(../img/btn_slider03_active.gif) no-repeat;}
#sliderImg #thumbnail li.thumb04 {background:url(../img/btn_slider04_active.gif) no-repeat; margin-right: 0px;}


#sliderImg #thumbnail li.on{
}


#sliderImg #thumbnail li a{
  position: relative;
  z-index: 1000;
  width: 120px;
  height: 60px;
  display: block;
}





/*
@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-moz-transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-o-transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
*/


/*
.fadeLeftOpt {
	-webkit-animation-duration: 1s;
	   -moz-animation-duration: 1s;
	     -o-animation-duration: 1s;
	        animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	   -moz-animation-fill-mode: both;
	     -o-animation-fill-mode: both;
	        animation-fill-mode: both;

	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
*/




/*
@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
	}
	
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInDown {
	0% {
		opacity: 0;
		-moz-transform: translateY(-20px);
	}
	
	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInDown {
	0% {
		opacity: 0;
		-o-transform: translateY(-20px);
	}
	
	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-20px);
	}
	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
*/

/*
.fadeDownOpt{
	-webkit-animation-duration: 1s;
	   -moz-animation-duration: 1s;
	     -o-animation-duration: 1s;
	        animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	   -moz-animation-fill-mode: both;
	     -o-animation-fill-mode: both;
	        animation-fill-mode: both;


	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
}
*/