/* 景点推荐 */
.jdtj-part {
    margin: 50px auto;
    width: 100%;
    position: relative;
    box-sizing: border-box;
}
.jdtj-part .jdtj-wrap {
    margin: 0 auto;
    width: 1200px;
    position: relative;
    box-sizing: border-box;
}
.jdtj-part .jdtj-wrap .jdtj-title {
    padding-bottom: 50px;
    line-height: 44px;
    color: #333;
    font-size: 34px;
    font-weight: 500;
    text-align: center;
}
.jdtj-part .jdtj-wrap .jdtj-one-box {
    margin-bottom: 30px;
    width: 100%;
    position: relative;
    box-sizing: border-box;
}
.jdtj-one-box .jdtj-one-list {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
}
.jdtj-one-box .jdtj-one-list .jdtj-one-item {
    width: 585px;
    height: 390px;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
}

.jdtj-one-item .jdtj-one-item-img {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
}
.jdtj-one-item .jdtj-one-item-img img {
    display: block;
    width: 100%;
}
.jdtj-one-item .jdtj-one-item-name {
    padding: 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #fff;
    font-size: 24px;
    text-align: left;
    white-space: pre-line;
}
.jdtj-one-item .jdtj-one-item-name .title {
    position: absolute;
    font-size: 24px;
    text-align: left;
    bottom: 30px;
    width: 100%;
    margin: 0;
    -webkit-transition: bottom .4s cubic-bezier(.025,.025,.17,1);
    transition: bottom .4s cubic-bezier(.025,.025,.17,1);
    -webkit-transition-delay: 40ms;
    transition-delay: 40ms;
}
.jdtj-one-item .jdtj-one-item-name .desc {
    position: absolute;
    bottom: 30px;
    margin: 0;
    opacity: 0;
    font-size: 18px;
}
.jdtj-one-item:hover .jdtj-one-item-name {
    background-color: rgba(0,0,0,.4);
}
.jdtj-one-item:hover .jdtj-one-item-name .title {
    bottom: 120px;
    -webkit-transition: all .4s cubic-bezier(.025,.025,.17,1);
    transition: all .4s cubic-bezier(.025,.025,.17,1);
}
.jdtj-one-item:hover .jdtj-one-item-name .desc {
    opacity: 1;
    -webkit-transition: bottom .4s cubic-bezier(.02,.045,.22,.975), opacity .4s cubic-bezier(.02,.045,.22,.975);
    transition: bottom .4s cubic-bezier(.02,.045,.22,.975), opacity .4s cubic-bezier(.02,.045,.22,.975);
    -webkit-transition-delay: 80ms;
    transition-delay: 80ms;
}
/* 一行三个 */
.jdtj-part .jdtj-wrap .jdtj-two-box {
    margin: 30px auto;
    width: 100%;
    position: relative;
    box-sizing: border-box;
}
.jdtj-two-box .jdtj-two-list {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
}
.jdtj-two-box .jdtj-two-list .jdtj-two-item {
    width: 385px;
    height: 234px;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
}

.jdtj-two-item .jdtj-two-item-img {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
}
.jdtj-two-item .jdtj-two-item-img img {
    display: block;
    width: 100%;
}
.jdtj-two-item .jdtj-two-item-name {
    padding: 10px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    text-align: center;
}
.jdtj-two-item:hover .jdtj-two-item-name {
    background-color: rgba(0,0,0,.4);
}

@media screen and (max-width: 960px) {
    /* 景点推荐 */
    .jdtj-part { margin: 10px auto 0; }
    .jdtj-part .jdtj-wrap { padding: 1%; width: 100%; }
    .jdtj-part .jdtj-wrap .jdtj-title { padding-bottom: 30px; font-size: 28px; }
    .jdtj-one-box .jdtj-one-list { display: unset; }
    .jdtj-one-box .jdtj-one-list .jdtj-one-item { margin-bottom: 20px; width: 100%; height: 100%; }
    .jdtj-two-box .jdtj-two-list { display: unset; }
    .jdtj-two-box .jdtj-two-list .jdtj-two-item { margin-bottom: 20px; width: 100%; height: 100%; }
}