.bList{overflow:hidden}
.bList >div{float:left;width:calc(100% / 3);text-align:left;margin-bottom:50px;}
.bList .mofd{display:inline-block;position:relative;width: 95%;}
.bList .photo{background-repeat:no-repeat;background-position:50%;background-size: cover;margin-right: 0;background-color:#000;transition:all linear .2s;}
.bList .photo a{display:block}
.bList .photo img{width:100%}
.bList h3{background:#fff;padding:25px 30px;position:absolute;bottom:-22px;right:0;max-width: 100%;word-break: break-all;}
.bList h3 a{color:#383838;font-size:20px;font-family:'Noto Serif TC',serif}
#album-info{
	position: relative;
}
#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: flex;flex-wrap: wrap;}
#bookBox .wall .album_box{
    width: calc(33.3% - 20px);
    margin: 10px;
}
#bookBox .wall .album_box a{
    display: block;
    background-size: cover;
    background-position: 50% 28%;
}
#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;background-size: cover;}
#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: 100%;}
#bookBox .wall-column .album_box img { width: 100%; }

@media screen and (max-width: 1440px){
	.bList >div{
    width: calc(100% / 2);
}
}
@media screen and (max-width: 1280px) {
	#bookBox .wall-column { width: 50%; }
}


@media screen and (min-width: 1025px) {
.bList .photo:hover{background-size:auto 110%}
}

@media screen and (max-width: 1280px) {
.bList >div{width:calc(100% / 2);}
}
@media screen and (max-width: 640px) {
	.bList .photo{    margin-right: 0;}
	.bList >div{margin-bottom: 0;width: 100%;margin-bottom: 20px;}
	.bList h3{    bottom: 0;
    padding: 15px 20px;max-width: calc(60% - 40px);}
	.bList h3 a{font-size: 18px;}
	#bookBox .wall-column { width: 100%; }
}
@media screen and (max-width: 480px) {
	
	.bList h3{
    padding: 10px 15px;
    max-width: calc(95% - 25px);
}
	.bList h3 a{
    font-size: 16px;
}
}