@charset "utf-8";

@import url("setting.css");  

/* ----------------------------------------
	header
---------------------------------------- */

#header_wrap {
	background: #ddddd9 url(../img/index/bg.gif) repeat-y center;
}

#header {
	padding: 30px 0;
	margin: auto;
	width: 840px;
}

#header img {
		float: left;
		margin-right: 20px;
		width: 100px;
}

h1 {
	font-size: 46px;
	line-height: 50px;
	color: #f07800;
	font-weight: bold;
}


/* ----------------------------------------
	contents
---------------------------------------- */

#contents_wrap {
	background: #f07800;
}

#contents {
	width: 1200px;
	margin: auto;
}
#contents ul {
	width: 840px;
	margin: auto;
}

#contents ul li {
	width: 360px;
	float: left;
	padding: 20px 0 20px 20px;
	background-position: 105px 25px;
	background-size: auto 60px;
	border-bottom: 1px solid #fff;
}

li:nth-of-type(1),
li:nth-of-type(3),
li:nth-of-type(5),
li:nth-of-type(7),
li:nth-of-type(9){
	margin-right: 40px;
}

#contents ul li img {
}
#contents ul li p {
	color: #fff;
	float: left;
	width: 240px;
	padding-top: 5px;
}

li:nth-of-type(1) {
	background: url(../img/index/1.png) no-repeat;
}
li:nth-of-type(2) {
	background: url(../img/index/2.png) no-repeat;
}
li:nth-of-type(3) {
	background: url(../img/index/3.png) no-repeat;
}
li:nth-of-type(4) {
	background: url(../img/index/4.png) no-repeat;
}
li:nth-of-type(5) {
	background: url(../img/index/5.png) no-repeat;
}
li:nth-of-type(6) {
	background: url(../img/index/6.png) no-repeat;
}
li:nth-of-type(7) {
	background: url(../img/index/7.png) no-repeat;
}
li:nth-of-type(8) {
	background: url(../img/index/8.png) no-repeat;
}
li:nth-of-type(9) {
	background: url(../img/index/9.png) no-repeat;
	border-bottom: none !important;
}
li:nth-of-type(10) {
	background: url(../img/index/10.png) no-repeat;
	border-bottom: none !important;
}

#contents ul li p {
	font-size: 21px;
	height: 59px;
	overflow: hidden;
}

#contents ul li p span {
	font-size: 21px;
}

.marquee:after {
	content:"";
	white-space:nowrap;
	/*padding-right:50px;*/
}

.marquee {
	margin:0;
	/*padding-left:240px;*/
	display:inline-block;
	white-space:nowrap;
	-webkit-animation-name:marquee;
	-webkit-animation-timing-function:linear;
	-webkit-animation-duration:10s;
	-webkit-animation-delay:2s;
	-webkit-animation-iteration-count:infinite;
	-moz-animation-name:marquee;
	-moz-animation-timing-function:linear;
	-moz-animation-duration:10s;
	-moz-animation-delay:2s;
	-moz-animation-iteration-count:infinite;
	-ms-animation-name:marquee;
	-ms-animation-timing-function:linear;
	-ms-animation-duration:10s;
	-ms-animation-delay:2s;
	-ms-animation-iteration-count:infinite;
	-o-animation-name:marquee;
	-o-animation-timing-function:linear;
	-o-animation-duration:10s;
	-o-animation-delay:2s;
	-o-animation-iteration-count:infinite;
	animation-name:marquee;
	animation-timing-function:linear;
	animation-duration:10s;
	animation-delay:2s;
	animation-iteration-count:infinite;
}

/* ----------------------------------------
	footer
---------------------------------------- */

#footer {
	padding: 30px 0;
}

#footer a {
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	padding: 17px 25px 17px 25px;
	width: 600px;
	background:#e50011 url(../img/index/arrow.png) no-repeat right 17px center;
	margin: auto;
	color: #fff;
	font-size: 21px;
	display: block;
	text-decoration: none;
}

/* ----------------------------------------
	animation
---------------------------------------- */

@-webkit-keyframes marquee {
	from   { -webkit-transform: translate(0%);}
	99%,to { -webkit-transform: translate(-100%);}
}
@-moz-keyframes marquee {
	from   { -moz-transform: translate(0%);}
	99%,to { -moz-transform: translate(-100%);}
}
@-ms-keyframes marquee {
	from   { -ms-transform: translate(0%);}
	99%,to { -ms-transform: translate(-100%);}
}
@-o-keyframes marquee {
	from   { -o-transform: translate(0%);}
	99%,to { -o-transform: translate(-100%);}
}
@keyframes marquee {
	from   { transform: translate(0%);}
	99%,to { transform: translate(-100%);}
}