a {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
.card-deck {
    width: 1170px;
    margin: 8px auto;
    justify-content: space-between;
}
.card {
    overflow: hidden;
    border-radius: 1rem;
    box-shadow: 2px 2px 3px #ddd;
}
.card-click {
    display: block;
    text-decoration: none;
    position: static;
}
.card .card-body {
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
    z-index: 999;
    text-decoration:none;
    position: relative;
    display:block;
    background-color: #f08c00;
}
    .card .card-body:hover {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }
.card-title {
    text-align: center;
    text-decoration: none;
    color: white;
    font-size: 24px;
    -webkit-font-smoothing:subpixel-antialiased;
}
.card-img-top {
    overflow: hidden;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
    cursor: pointer;
    z-index:99;
    position: relative;
    line-height: 0;
    display: block;
}
.card-img-top:hover {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
}
.card-img-top:hover + .card-body {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    transform: scale(1.2);
}
.list-unstyled .media {
    padding: 40px 0;
    border-bottom:1px solid #CCC;
}
    .list-unstyled .media:last-of-type {
        border-bottom: none;
    }
.list-unstyled .media .media-body {
    height: 100px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
    .list-unstyled .media .media-body h5 {
        font-weight: 550;
    }
    .list-unstyled .media .media-body p{
        font-size: 13px;
    }
.list-unstyled .media img{
    width: 100px;
    height: 100px;
    object-fit: contain;
    border-radius: 0.75rem;
}

.pcIntro .aboutul {
    width: 1170px;
    height: 400px;
    display: flex;
    margin: 5px auto;
    overflow: hidden;
}

.aboutul .aboutulItem {
    list-style: none;
    width: 234px!important;
    height: 100%!important;
    overflow: hidden!important;
}

    .aboutul .aboutulItem>div {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 999;
    }

        .aboutul .aboutulItem > div a img{
            max-width: none;
        }

    .aboutul .aboutulItem:nth-of-type(4) > div {
        justify-content: flex-start;
    }

    .aboutul .aboutulItem:last-of-type>div {
        justify-content: flex-start;
    }

    .aboutul .aboutulItem div .title {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 28px;
        font-weight: 550;
        z-index: 999;
        transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    .aboutul .aboutulItem:nth-of-type(2n+1) div .title {
        background-color: rgba(240,140,0,0.8);
        color: #FFF;
    }
    .aboutul .aboutulItem:nth-of-type(2n) div .title {
        background-color: rgba(255,255,255,0.9);
        color: #f09c00;
    }

    .aboutul .aboutulItem div .board {
        position: absolute;
        bottom: -140px;
        left: 0;
        width: 100%;
        height: 140px;
        background-color: rgba(130, 130, 130, 0.55);
        z-index: 99;
        transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
    }

        .aboutul .aboutulItem div .board .brief {
            display: block;
            position: relative;
            top: 80px;
            left: 50%;
            transform: translateX(-50%);
            width: 200px;
            padding-top: 10px;
            color: #fff;
            font-size: 18px;
            text-align: center;
            border-top: 2px solid #fff;
        }

    .aboutul .aboutulItem:hover .board {
        bottom: 0;
    }

    .aboutul .aboutulItem:hover .title {
        background-color: transparent!important;
        top: 315px;
        color: white!important;
    }



.proList {
    width: 1170px;
    margin: 5px auto;
}

.proListUl {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
}

.proType {
    list-style: none;
    width: 100%;
    height: 300px;
    margin-bottom: 10px;
    overflow: hidden;
    box-shadow: 0 0 14px 1px #ccc;
}

    .proType .itemBoard {
        width: 100%;
        height: 100%;
        color: #f08c00;
        display: flex;
        overflow: hidden;
        background-color: #fff;
    }

.itemBoard .description {
    position: relative;
    width: 890px;
    height: 100%;
    background-color: white;
}

    .itemBoard .description .typeName {
        position: absolute;
        top: 5%;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        text-align: center;
        font-size: 40px;
        font-weight: 550;
        letter-spacing: 2px;
        transition: 2.2s top cubic-bezier(0.075, 0.82, 0.165, 1), 1.6s opacity ease;
    }

    .itemBoard .description .brief {
        position: absolute;
        top: 250px;
        left: 50%;
        transform: translateX(-50%);
        font-size: 18px;
        color: #3e3a39;
        transition: 2.8s all cubic-bezier(0.075, 0.82, 0.165, 1);
    }

        .itemBoard .description .brief a {
            text-decoration: none;
            display: block;
            text-align: center;
            margin-top: 10px;
        }

.itemBoard img {
    max-width: 390px;
    transition: 0.8s all ease;
    object-fit: contain;
}

    .itemBoard img:hover {
        transform: scale(1.1);
    }