.bottom {
    position: fixed; /* 鍥哄畾瀹氫綅锛岃瀵艰埅鏍忓浐瀹氬湪椤甸潰搴曢儴 */
    z-index: 10; /* 璁剧疆鍙犲眰椤哄簭锛岀‘淇濆鑸爮鏄剧ず鍦ㄦ渶鍓� */
    background-color: rgba(255, 255, 255, 1); /* 鍗婇€忔槑鑳屾櫙鑹� */
    width: 750px; /* 璁剧疆瀹藉害 */
    height: 85px; /* 璁剧疆楂樺害 */
    bottom: 0px; /* 璺濈椤甸潰搴曢儴50px */
    left: 50%; /* 姘村钩灞呬腑 */
    transform: translateX(-50%); /* 閫氳繃X杞村亸绉伙紝浣垮叾鐪熸灞呬腑 */
    transition: width 0.8s, height 0.8s; /* 杩囨浮鏁堟灉 */
}

/* 瀵艰埅鍥剧墖瀹瑰櫒 all-image 鏍峰紡 */
.all-image {
    width: 95%; /* 璁剧疆瀹藉害 */
    height: 80%; /* 璁剧疆楂樺害 */
    text-align: center; /* 鍥剧墖灞呬腑鏄剧ず */
    transition: text-align 0.3s; /* 娣诲姞杩囨浮鏁堟灉 */
}

/* 瀵艰埅鍥剧墖 nav-image 鏍峰紡 */
.nav-image {
    display: inline-block; /* 璁╁浘鐗囧彲浠ヤ竴琛屾樉绀� */
    margin-left: 10px; /* 宸︿晶澶栬竟璺� */
    margin-top: 10px; /* 椤堕儴澶栬竟璺� */
}