/* topview */
.topview {
	width:100%;
	margin:0px auto;
	height:500px;
	text-align:center;
	background-repeat:no-repeat;
	background-position:center top;
}
.topview div{
	margin:0px auto;
	width:402px;
	height:500px;
	background:url(../img/bg.gif);
}
.topview span{
	display:block;
	height:500px;
	background:url(../img/obi.png);
}
.topview h1{
	padding-top:100px;
	font-size:26px;
	color:#fff;
}
.topview div img{
	padding-top:100px;
}

/* mtitle */
.mtitle{
	margin:25px auto 15px auto;
	font-size:22px;
	text-align:center;
}
.mtitle img{
	padding-right:10px;
	vertical-align:middle;
}



/* weblog */
.weblog ul{
	margin:0px auto;
	max-width:1200px;
}

.weblog li{
	margin:10px;
	width:200px;
}
.weblog li a{
	font-size:16px;
}
.weblog li a:hover > span{
	margin-top:-10px;
}
.weblog span{
	display:block;
	height:133px;
	transition-duration:0.2s;
	background-size:100%;
	background-repeat:no-repeat;
	background-position:center;
}

.weblog:after{
	content:"";
	display:block;
	clear:both;
}

/* history */
.history{
	margin:50px auto;
}

.history span{
	display:block;
	height:200px;
	background:url(../img/history.jpg) top no-repeat;
}
.history span h1{
	padding-top:80px;
	font-size:35px;
	color:#fff;
	text-align:center;
}
.history div{
	margin:20px auto;
	max-width:1100px;
}
.history p{
	margin:0px 15px;
}
.history div img{
	padding:0px 30px 0px 10px;
	float:left;
}


/* big */
.big ul{
	margin:60px auto;
	max-width:1100px;
}
.big li{
	margin:5px;
	float:left;
	width:350px;
	height:350px;
	background-repeat:no-repeat;
}

.big span{
	margin-top:42%;
	text-align:center;
	padding-top:10px;
	display:block;
	height:45px;
	font-size:22px;
	color:#fff;
	background:url(../img/skel.png);
	transition-duration:0.2s;
}
.big span img{
	padding-right:10px;
	vertical-align:middle;
}
.big1{background-image:url(../img/big1bg.jpg);}
.big2{background-image:url(../img/big2bg.jpg);}
.big3{background-image:url(../img/big3bg.jpg);}

.big span:hover{
	font-size:25px;
}



/* company */
.company{
	margin:50px auto;
}

.companybg{
	height:250px;
	background:url(../img/company.jpg) center no-repeat;
}
.companybg span{
	display:block;
	margin:auto;
	width:12em;
	text-align:left;
	color:#fff;
	font-size:18px;
}
.companybg span h1{
	padding-top:80px;
	padding-bottom:5px;
	margin-bottom:5px;
	font-size:40px;
	border-bottom:solid 2px #fff;
}
.companybg h1 img{
	padding-right:10px;
	vertical-align:middle;
}


/*news*/
.news div{
	margin:20px auto;
	max-width:1200px;
	border-top:solid 2px #17343C;
	padding:10px 15px;
}


@media only screen and (max-width: 768px) {

.history div img{
	display:block;
	margin:auto;
	float:none;
}

/* big */
.big li{
	margin:0px;
	width:33%;
}
.big span{
	margin-top:60%;
}



}

@media only screen and (max-width: 480px) {

/* topview */
.topview div{
	width:100%;
	background-image:none;
}
.topview span{
	background-image:none;
}

/* weblog */
.weblog li:nth-of-type(4){display:none;}
.weblog li:nth-of-type(5){display:none;}


/* big */
.big li{
	margin:0px;
	float:none;
	width:100%;
	background-size:100%;
}
.big span{
	margin-top:35%;
}
.companybg{
	background-position:-1150px;
}


}