@charset "utf-8";
.iBox{
	clear: none;
	float: left;
	display: inline-block;
	width: calc(100%/1 - 10px);
	padding: 0;
	margin: 5px;
	overflow: hidden;
	text-align: center;
	position:relative;
	border:0;	
}
.iBox-type-move .iBox-hover .iBox-info .tt {
	width: 90%;
	position: absolute;
	font-size: 160%;
	color: #FFF;
	bottom: 40%;
	font-weight: bold;
	text-align: left;
	line-height: 0px;
	margin-left:5%;
}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle {bottom:0.5%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Btitle {bottom:60%;}
.iBox-type-move .iBox-hover .iBox-info .i-Stitle {bottom:0%;font-size: 120%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Stitle {bottom:0%;}


@media only screen and (min-width: 480px) {
.iBox{
	clear: none;
	float: left;
	display: inline-block;
	width: calc(100%/1 - 10px);
	padding: 0;
	margin: 5px;
	overflow: hidden;
	text-align: center;
	position:relative;
	border:0;	
}
.iBox-type-move .iBox-hover .iBox-info .tt {
	width: 90%;
	position: absolute;
	font-size: 180%;
	color: #FFF;
	bottom: 40%;
	font-weight: bold;
	text-align: left;
	line-height: 0px;
	margin-left:5%;
}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle {bottom:0.5%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Btitle {bottom:60%;}
.iBox-type-move .iBox-hover .iBox-info .i-Stitle {bottom:0%;font-size: 120%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Stitle {bottom:0%;}


}
@media only screen and (min-width: 768px) {
.iBox{
	clear: none;
	float: left;
	display: inline-block;
	width: calc(100%/2 - 10px);
	padding: 0;
	margin: 5px;
	overflow: hidden;
	text-align: center;
	position: relative;
	border:0;
}
.iBox-type-move .iBox-hover .iBox-info .tt {
	width: 90%;
	position: absolute;
	font-size: 180%;
	color: #FFF;
	bottom: 40%;
	font-weight: bold;
	text-align: left;
	line-height: 0px;
	margin-left:5%;
}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle {bottom:0.5%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Btitle {bottom:50%;}
.iBox-type-move .iBox-hover .iBox-info .i-Stitle {bottom:0%;font-size: 120%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Stitle {bottom:0%;}
}
@media only screen and (min-width: 1024px) {
.iBox{
	clear: none;
	float: left;
	display: inline-block;
	width: calc(100%/2 - 10px);
	padding: 0;
	margin: 5px;
	overflow: hidden;
	text-align: center;
	position: relative;
	border:0;
}

.iBox-type-move .iBox-hover .iBox-info .tt {
	width: 90%;
	position: absolute;
	font-size: 180%;
	color: #FFF;
	bottom: 40%;
	font-weight: bold;
	text-align: left;
	line-height: 0px;
	margin-left:5%;
}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle {bottom:0.5%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Btitle {bottom:45%;}
.iBox-type-move .iBox-hover .iBox-info .i-Stitle {bottom:0%;font-size: 120%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Stitle {bottom:0%;}

}

@media only screen and (min-width: 1280px) {
.iBox{
	clear: none;
	float: left;
	display: inline-block;
	width: calc(100%/2 - 20px);
	padding: 0;
	margin: 10px;
	overflow: hidden;
	text-align: center;
	position: relative;
	border:0;
}

.iBox-type-move .iBox-hover .iBox-info .tt {
	width: 90%;
	position: absolute;
	font-size: 200%;
	color: #FFF;
	bottom: 40%;
	font-weight: bold;
	text-align: left;
	line-height: 0px;
	margin-left:5%;
}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle {bottom:0.5%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Btitle {bottom:40%;}
.iBox-type-move .iBox-hover .iBox-info .i-Stitle {bottom:0%;font-size: 130%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Stitle {bottom:0%;}

}
@media only screen and (min-width: 1680px) {
.iBox{
	clear: none;
	float: left;
	display: inline-block;
	width: calc(100%/3 - 40px);
	padding: 0px;
	margin: 20px;
	overflow: hidden;
	text-align: center;
	position: relative;
	border:0;
}

.iBox-type-move .iBox-hover .iBox-info .tt {
	width: 90%;
	position: absolute;
	font-size: 200%;
	color: #FFF;
	bottom: 40%;
	font-weight: bold;
	text-align: left;
	line-height: 0px;
	margin-left:5%;
}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle {bottom:0.5%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Btitle {bottom:60%;}
.iBox-type-move .iBox-hover .iBox-info .i-Stitle {bottom:0%;font-size: 130%;}
.iBox-type-move .iBox-hover:hover .iBox-info .i-Stitle {bottom:0%;}

}

.iBox-type-move{}
.iBox-hover,.iBox-hover .mask,.iBox-type-move .iBox-info {clear: none;float: left;width: 100%;height:100%}		
.iBox-hover,.iBox-hover .mask,.iBox-img {position:absolute;top:0;left:0;}

.iBox-type-move .iBox-hover {
	transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	opacity:1;
	cursor:pointer;
	z-index:2;
}

.iBox-type-move .iBox-info {z-index:1;color:#ffffff;position:relative;overflow:hidden;}
.iBox-type-move .iBox-hover .iBox-info .i-Btitle{
	width: 100%;
	position: absolute;
	background-color: rgba(0,0,0,0.4);
	font-size: 110%;
	color: #FFF;
	transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	padding: 2px 0 5px 0;
	line-height: 35px;
	opacity:1;
	font-weight: bold;		
			}
.iBox-type-move .iBox-hover .iBox-info:hover .i-Btitle{
	width: 100%;
	position: absolute;
	background-color: rgba(0,0,0,0);
	font-size: 130%;
	color: #FFF;
	transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	padding: 2px 0 5px 0;
	line-height: 35px;
	opacity:1;
	font-weight: bold;	
			}			

.iBox-type-move .iBox-hover .iBox-info .i-Stitle{
	width: cale(100% - 10px);
	position: absolute;
	background-color: rgba(0,0,0,0);    
	color: #FFF;
	font-family: 'Righteous', cursive;
	font-weight: normal;
	letter-spacing: 1px;
	transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	padding: 5px;
	line-height: 25px;
	opacity: 0;
			}
.iBox-type-move .iBox-hover .iBox-info:hover .i-Stitle{
    width: cale(100% - 10px);
    position: absolute;
    background-color: rgba(30,71,142,0.50);
    color: #FFF;
    transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    padding: 5px;
    line-height: 25px;
    opacity: 1;
			}

.iBox-type-move .iBox-hover .mask {
	z-index: 0;
	opacity: 0;
	transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	background-color: #000;
	}
.iBox-type-move .iBox-hover:hover .mask {
	z-index: 0;
	opacity: 0.6;
	transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	background-color: #000;
	}	
.P67BoxB {/*比例正方型*/
	position: relative;
	clear: none;
	float: left;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
	overflow: hidden;
    background-repeat: no-repeat;
	background-position:center center;
	background-size:cover;
	*height : 1%;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;	
}