@charset "utf-8";
/*------------ branch ------------*/
.branch-list .item .name{
    color: #3D3432;
    font-weight: 600;
    letter-spacing: 2px;
    font-family: 'Noto Serif TC', serif;
    transition: all .3s ease;
}
.branch-list .box:hover .name{
    color: #231815;
}
.branch-list .description{
    color: #616161;
}
/*type1*/
.branch-list.type1 .item .name{
    font-size: 18px;
    border-color: #ddd;
}
.branch-list.type1 .three-box {
    border: 1px solid #ddd;
    border-width: 1px 0;
}
.branch-list.type1 .item +.item {
    border-top: 1px solid rgba(35, 24, 21, 0.2);
}
.branch-list.type1 .three-box .col+.col:before {
    background: rgba(35, 24, 21, 0.2);
}
.branch-list.type1 .tit {
    color: #3D3532;
    font-weight: normal;
}
/*/type1*/
/*type2*/
.branch-list.type2 .item .name{
    border-color: #ddd;
}
.branch-list.type2 .item {
    border: 1px solid rgba(35, 24, 21, 0.2);
    border-width: 1px 0;
}
.branch-list.type2 .three-box {
    border: 1px solid #ddd;
    border-width: 1px 0;
}
.branch-list.type2 .three-box .col+.col:before {
    background: rgba(35, 24, 21, 0.2);
}
.branch-list.type2 .tit {
    color: #3D3532;
    font-weight: normal;
}
.branch-list .pic .mask {
    letter-spacing: 5px;
    font-family: 'Noto Serif TC', serif;
    background: rgba(35, 24, 21, 0.75);
}
.branch-list.type2 .map_box:before {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/*/type2*/
/*type3*/
.branch-list.type3{
    margin: 0 -5px 0px;
}
.branch-list.type3  .item{
    padding: 0 5px;
}
.branch-list.type3 .item .box{
    background: #EAE6E5;
    border: 0;
    padding: 0;
}
.branch-list.type3 .item .pic {
    transition: all .3s ease;
}
.branch-list.type3 .item .text-box{
    padding: 10px 15px 0;
}
.branch-list.type3 .item .name {
    border-bottom: 1px solid #ccc;
}
.branch-list.type3 .txt_box{
    position: relative;
    padding: 10px 0 10px 80px;
    border-bottom: 1px solid #E7E7E7;
}
.branch-list.type3 .tit{
    font-size: 14px;
    padding-left: 0;
    width: 75px;
    background: #EAE6E5;
}
.branch-list.type3 .txt{
    font-size: 14px;
}
.branch-list.type3 .btn_area{
    margin: 0 -15px;
}
.branch-list.type3 .txt_box{
    border-bottom: none;
}
.branch-list.type3 .map_box{
    background: #231815;
    width: 100%;
    line-height: 40px;
    color: #fff;
    padding: 0 12px;
    border-radius: 0;
    height: 40px;
    margin: 20px auto 0;
    font-family: 'EB Garamond', serif;
    transition: all .3s ease;
    font-weight: 500;
}
.branch-list.type3 .map_box:hover{
    opacity: 0.7;
}
.branch-list.type3 .map_box:before{
    font-family: 'icon-font' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f055";
    font-size: 20px;
    width: 20px;
    height: 20px;
    line-height: 16px;
    border: 1px solid transparent;
    padding: 0px 3px 0px 0;
    vertical-align: middle;
    display: inline-block;
}
.branch-list.type3 .map_box:hover{
    opacity: 0.8;
}
.branch-list .map_box{
    background: #231815; 
    color: #fff;
    transition: all .3s ease;
}
.branch-list .map_box:hover{
    opacity: 0.7;
}
/*/type3*/
/*------------ rwd ------------*/
@media screen and (max-width: 1000px) {
    .branch-list.type1 .item,
    .branch-list.type2 .item {
        padding: 20px 0;
        margin-bottom: 20px;
    }
    .branch-list.type1 .item .name,
    .branch-list.type2 .item .name {
        font-size: 16px;
    }
    .branch-list .tit{
        font-size: 15px;
    }
}
@media screen and (max-width: 600px) {
    .branch-list.type1 .three-box,
    .branch-list.type2 .three-box {
        border: 0;
    }
    .branch-list.type1 .txt_box,
    .branch-list.type2 .txt_box {
        border-bottom: 1px solid #ddd;
    }
    .branch-list.type1 .txt_box.time,
    .branch-list.type2 .txt_box.time {
        border: 0;
    }
    .branch-list.type1 .txt_box, 
    .branch-list.type2 .txt_box {
        padding: 10px 0 10px 80px;
    }
    .branch-list.type1 .btn_area {
        left: 110px;
    }
}
@media screen and (max-width: 520px){
    .branch-list{
        margin: 0;
    }
    .branch-list .item{
        padding: 0;
    }
}
