#album{width:100%;}
#album li{float:left;width:calc(100% / 3)}
#album .photo{overflow:hidden}
#album .photo a{position:relative; display:block;}
#album .info{position:absolute;width:100%;height:100%;color:#fff}
#album .info h3{font-size:27px;line-height:110%;margin:50px;position:relative;z-index:1;text-shadow:0 0 3px #592543}
#album .info p{line-height:110%;margin:50px;position:absolute;right:0;bottom:0;font-size:18px;z-index:1;text-shadow:0 0 2px #592543}
#album .info span{vertical-align:super;display:inline-block;width:50px;height:1px;background:#fff;margin-right:30px}
#album .photo .pic{position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1;transition:linear all .6s;background-repeat: no-repeat;background-position: 50%;}
#album-info{
	display: flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-flex;
	flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}
#album-info::after {
	content: '';
	flex-grow: 999999999;
	-moz-flex-grow: 999999999;
	-ms-flex-grow: 999999999;
	-o-flex-grow: 999999999;
	-webkit-flex-grow: 999999999;
	min-width: 200px;
	height: 0;
}
/* bookBox */
#bookBox .wall { position: relative; overflow: hidden; display: block; }
#bookBox .wall-column { position: relative; float: left; width: 50%; display: block; box-sizing: border-box; }
#bookBox .wall-column .article { position: relative; margin: 15px; }
#bookBox .wall-column .album_box { box-shadow: 0 0 10px #c0c0c0; }
#bookBox .wall-column .article a { display: block; }
#bookBox .wall-column .article h3 { position: absolute; width: 100%; bottom: 0; left: 0; }
#bookBox .wall-column .article h3 a { margin: 10px; padding: 10px; background: rgba(255, 255, 255, .7); text-align: center; font-size: 18px; color: #444; }

/* album-info */
#bookBox .wall-column { width: calc(100% / 3); }
#bookBox .wall-column .album_box img { width: 100%; }



@media screen and (max-width: 1280px) {
	#bookBox .wall-column { width: 50%; }
}



@media screen and (min-width: 1025px) {
#album .info:hover:after{opacity:1}
#album .info:after{position:absolute;width:calc(100% - 30px);height:calc(100% - 30px);left:15px;top:15px;background:rgba(96,37,70,0.73);content:'';display:block;transition:linear all .3s;opacity:0}
#album .info:before{position:absolute;width:calc(100% - 30px);height:calc(100% - 30px);left:15px;top:15px;background:rgba(220,204,214,0.49);content:'';display:block;transition:linear all .6s;opacity:0}
#album .info:hover:before{opacity:1;width:100%;height:100%;left:0;top:0}
#album .photo:hover .pic{transform:scale(1.2)}

}
@media screen and (max-width: 1366px) {
#album li{width:calc(100% / 3);}
	

}
@media screen and (max-width: 1280px) {
#album li{width:calc(100% / 2);}
	

}
@media screen and (max-width: 1024px) {
#album .info h3{font-size:22px;margin:40px}
#album .info p{margin:40px;font-size:15px}
}
@media screen and (max-width: 640px) {
#album li .mofd{margin: 5px;}
#album li{float:left;width:50%}
#bookBox .wall-column { width: 100%; }

}
@media screen and (max-width: 480px) {
	
#album .info h3{font-size:20px;margin:20px}
#album .info p{margin:20px;font-size:12px}
	
}