.branch_page{
    margin: 2rem 0px 10rem;
}
.branch_page h1{
	text-transform: uppercase;
	text-align: center;
    font-weight: 600;
    font-size: 2.2rem;
    margin-bottom: 0.5rem;
}
.branch_page .contents{
	margin-bottom: 1rem;
}
.branch_page .box{
	margin-bottom: 2rem;
}
.branch_page .box .item{
    background: white;
    filter: drop-shadow(0px 0px 4px rgba(0 0 0 /20%));
    margin: 1rem 0;
    border-radius: 5px;
    overflow: hidden;
}
.branch_page .box .item .box_img{
    background-position: center;
    background-size: cover;
    height: 160px;
}
.branch_page .box .item .info{
    padding-right: 15px;
    margin: 1rem 0;
}
.branch_page .box .item .info .name{
    font-size: 1.2rem;
    font-weight: 500;
    color: #811815;
    margin-bottom: 0.5rem;
}
.branch_page .box .item .info i{
    margin-right: 5px;
    color: #ccc;
}
.branch_page .box .item .info .hotline a{
    font-size: 1.2rem;
    font-weight: 500;
    color: #F00;
}
.branch_page .box .item .info .view_more{
    float: right;
    margin-top: 0.5rem;
    color: #0057B5;
}
/*======================== for resposive screen ========================*/
/* Medium devices (tablets, 768px and up)*/
@media screen and (max-width: 768px) {
    .branch_page .box .item .box_img {
        height: 220px;
    }
    .branch_page .box .item .info {
        padding: 0px 15px 20px;
    }
}
/* Small devices (landscape phones, 667px and up)*/
@media screen and (max-width: 668px) {
    .branch_page h1 {
        font-size: 1.6rem;
    }
}
