@charset "UTF-8";

/**
 *
 * @authors liping (you@example.org)
 * @date    2020-08-20 10:24:28
 * @version $Id$
 */

 /* cases */
 .case_container {
    padding: .5rem 0;
 }
 .case_type {
     padding: 0 1rem;
 }
 .case_type ul {
     display: flex;
     display: -webkit-flex;
     justify-content: space-between;
     align-items: center;
 }
 .case_type ul li {
     text-align: center;
     font-size: 0.666667rem;
     color: #999;
     padding-bottom: 0.111111rem;
 }
 .case_type ul li.active {
     color: #333;
     border-bottom: 4px solid #da251e;
 }
 .page_tab ul {
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
    padding-top: .5rem;
}
.page_tab ul li {
    text-align: center;
    font-size: 0.622222rem;
    padding: 0.111111rem 0;
    flex: 1;
    color: #666;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
}
.page_tab ul li.active {
    color: #da251e;
}
.page_tab ul li:nth-child(2) {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.page_tab ul li i {
    width: 0.555556rem;
    height: 0.444444rem;
    display: inline-block;
    margin: 3px 0 0 5px;
    background: url(../images/icon_select.png) no-repeat 0 0;
    background-size: 100%;
}
.page_tab ul li.active i {
    background: url(../images/icon_select_active.png) no-repeat 0 0;
    background-size: 100%;
}
.page_show {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 5.1rem;
    bottom: 0;
    z-index: 999;
    background: #fff;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 720px;
    margin: 0 auto;
}
.page_show > ul {
    padding: .8rem .5rem;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: left;
    flex-wrap: wrap;
}
.page_show > ul > li {
    width: 30.3%;
    padding: 0.222222rem 0;
    background: #f7f7f7;
    text-align: center;
    font-size: 0.622222rem;
    text-align: center;
    color: #666;
    border-radius: 0.222222rem;
    margin-bottom: 0.444444rem;
    margin-right: 4%;
}
.page_show > ul > li:nth-child(3n) {
    margin-right: 0;
}
.page_show > ul > li.active {
    background: #da251e;
    color: #fff;
}
.page_show > ul > li.active a {
    color: #fff;
}

.case_main {
    padding: .5rem;
}
.case_main ul li {
    margin-bottom: 0.888889rem;
}
.item {
    box-shadow: 0 0 0.222222rem #eae8e8;
    border-radius: 0.2rem;
    overflow: hidden;
}
.item .item_case_pic {
    max-height: 10.6rem;
    min-height: 6rem;
    overflow: hidden;
    background-color: #f5f2f2;
}
.item .item_case_pic a,.item .item_case_pic img {
    display: block;
    width: 100%;
}
.item_desc {
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: space-between;
    padding: .6rem .4rem;
}
.item_designer {
    display: flex;
    display: -webkit-flex;
    align-items: center;
    width: 6.2rem;
}
.item_designer .designer_pic {
    width: 2.222222rem;
    height: 2.222222rem;
    overflow: hidden;
    border-radius: 50%;
    background-color: #f5f2f2;
}
.item_designer .designer_pic img {
    width: 100%;
}
.item_designer .designer_info {
    padding-left: 3px;
}
.item_designer p {
    font-size: 0.577778rem;
    color: #333;
}
.item_designer p.designer_name {
    font-size: 0.622222rem;
}
.item_case {
    font-size: 0.577778rem;
    color: #333;
    text-align: right;
}
.item_case p:nth-child(2) {
    font-size: 0.553333rem;
    color: #666;
}
.item_designer p img {
    width: 0.555555rem;
    display: inline-block;
    padding-left: 2px;
    position: relative;
    top: 1px;
}
.item_marketing {
    padding: .6rem .4rem;
}
.item_marketing h4 {
    font-size: 0.622222rem;
    color: #333;
}
.item_marketing p {
    font-size: 0.533333rem;
    color: #666;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
}
.item_marketing p em.status0 {
    color: #da251e;
}

    /* search_container */
.search_container {
    padding: 1rem .5rem;
}
.search_container .form-item-keyword {
    display: flex;
    display: -webkit-flex;
    align-items: center;
    border-radius: 0.222222rem;
}
.search_container .form-item-keyword .search_type {
    font-size: 0.577778rem;
    background: #da251e;
    color: #fff;
    text-align: center;
    position: relative;
    height: 100%;
    line-height: 1.47rem;
    padding: 0 .5rem;
    border-radius: 0.222222rem 0 0 0.222222rem;
}
.search_container .form-item-keyword .search_type_selected {
    display: flex;
    display: -webkit-flex;
    align-items: center;
}
.search_container .form-item-keyword .search_type_selected img {
    width: 0.577778rem;
    padding-left: 3px;
}
.search_container .form-item-keyword .search_type ul {
    display: none;
    position: absolute;
    top: 2.037778rem;
    left: 0;
    background: rgba(0, 0, 0, .7);
    padding: 0 .5rem;
    border-radius: .3rem;
}
.search_container .form-item-keyword .search_type ul::before {
    content: "";
    width: 0px;
    height: 0px;
    border-width: 8px 8px;
    border-color: transparent  transparent #646464;
    border-style: solid;
    display: inline-block;
    position: absolute;
    top: -16px;
    left: 1rem;
}
.search_container .form-item-keyword .search_type ul li {
    color: #fff;
    font-size: 0.577778rem;
    padding: 0.111111rem 0;
}
.search_container .form-item-keyword input {
    flex: 1;
    background-color: #f7f7f7;
    font-size: 0.577778rem;
    color: #999;
    padding: 0.333333rem 0 0.333333rem 0.444444rem;
    box-sizing: border-box;
    border: none;
    border-radius: 0 0.222222rem 0.222222rem 0;
}
.search_container .form-item {
    margin-bottom: .5rem;
}
.search_container button {
    width: 100%;
    background: #e50013;
    color: #fff;
    font-size: 0.622222rem;
    border: none;
    padding: 0.333rem 0;
    box-sizing: border-box;
    border-radius: 0.222222rem;
}
.search_main {
    margin-top: 1rem;
    border-top: 1px solid #e0dede;
}
.search_main .search_total {
    font-size: 0.622222rem;
    color: #666;
    display: none;
    margin: 0.5rem 0;
}
.search_main .search_total span {
    color: #e50013;
}
.search_main .search_tag {
    color: #999;
    text-align: center;
    font-size: 0.622222rem;
    padding-top: .5rem;
}
.serach_hot ul {
    padding: 1rem 0;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: left;
    flex-wrap: wrap;
}
.serach_hot ul li {
    width: 30.3%;
    padding: 0.222222rem 0;
    background: #f7f7f7;
    text-align: center;
    font-size: 0.577778rem;
    text-align: center;
    color: #666;
    border-radius: 0.222222rem;
    margin-bottom: 0.444444rem;
    margin-right: 4%;
}
.serach_hot ul li:nth-child(3n) {
    margin-right: 0;
}
.search_item ul li {
    margin-bottom: 0.888889rem;
}
.footer_info {
    display: none;
}
.dropload-down {
    height: 48px;
    color: #e2e0e0;
}

.dropload-refresh {
    height: 4rem !important;
    line-height: 4rem !important;
}
.dropload-refresh, .dropload-update, .dropload-load, .dropload-noData {
    height: 50px;
    text-align: center;
    line-height: 50px;
}
.dropload-load .loading {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 6px;
    -webkit-animation: rotate 0.75s linear infinite;
    animation: rotate 0.75s linear infinite;
    vertical-align: middle;
    border: 2px solid #666;
    border-bottom-color: transparent;
    border-radius: 100%;
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* designer */
.designer_container #location {
    margin-top: .8rem;
}
.designer_container .page_show {
    top: 3.5rem;
}
.location {
    position: relative;
}
.city_list {
}
.city_list dl {
    color: #333;
    font-size: 0.622222rem;
}
.city_list dl dt {
    background-color: #ececec;
    padding: .2rem .5rem;
}
.city_list dl dd {
    padding: .2rem .5rem;
}
.city_list dl dd.active {
    color: #da251e;
}
.city_nav {
    position: fixed;
    right: 0;
    top: 50%;
    width: 50px;
    text-align: center;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}
.city_nav ul {
    display: block;
}
.city_nav ul li {
    font-size: 0.622222rem;
    padding: 1px 0;
    transition: all ease .3s 0s;
    -moz-transition: all ease .3s 0s;
    -webkit-transition: all ease .3s 0s;
    font-size: 12px;
    line-height: 14px;
}
.city_nav ul li.active {
    transform: scale(3);
    color: #e74c3c
}
.designer_main {
    padding: 1rem .5rem;
}
.designer_main ul li {
    margin-bottom: 0.888889rem;
}
.designer_item {
    box-shadow: 0 0 0.222222rem #eae8e8;
    border-radius: 0.2rem;
    overflow: hidden;
    padding: .5rem;
    position: relative;
}
.designer_item a {
    display: flex;
    display: -webkit-flex;
    align-items: center;
}
.designer_item .designer_avatar {
    width: 3.5rem;
    height: 3.5rem;
    overflow: hidden;
    background-color: #f5f2f2;
    border-radius: 50%;
    margin-right: 0.666667rem;
}
.designer_item .designer_avatar img {
    width: 100%;
}
.designer_item .designer_info {
    width: 9rem;
}
.designer_item .designer_base {
    display: flex;
    display: -webkit-flex;
    align-items: flex-end;
    color: #333;
    margin-bottom: 0.3rem;
}
.designer_item .designer_base h4 {
    font-size: 0.622222rem;
}
.designer_item .designer_base span {
    font-size: 0.577778rem;
    padding: 0 0.111111rem 0 0.222222rem;
}
.designer_item .designer_base img {
    width: 0.555555rem;
    height: 0.555555rem;
    position: relative;
    top: -4px;
    left: 1px;
}
.designer_item .designer_des  {
    display: flex;
    display: -webkit-flex;
    align-items: flex-start;
}
.designer_item .designer_des p {
    font-size: 0.533333rem;
    line-height: 0.7rem;
    color: #666;
}
.designer_item .designer_des p:nth-child(1) {
    /*width: 3.2rem;*/
}
.designer_item .designer_des p:nth-child(2) {
    flex: 1;
}
.designer_item .designer_button p {
    padding: 0.1rem 0.4rem;
    font-size: 0.533333rem;
    position: absolute;
    right: .5rem;
    border-radius: 0.2rem;
}
.designer_item .designer_button p:nth-child(1) {
    background-color: #da251e;
    color: #fff;
    top: .5rem;
}
.designer_item .designer_button p:nth-child(2) {
    background-color: #fff;
    color: #da251e;
    border: 1px solid #da251e;
    bottom: .5rem;
}
.designer_item .icon_week {
    width: 2rem;
    position: absolute;
    top: 0;
    left: 0;
}

/*project*/
.project_tabbar {
    padding: .5rem 1rem;
}
.project_tabbar ul {
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
}
.project_tabbar ul li {
    flex: 1;
    text-align: center;
    font-size: 0.677778rem;
    color: #999;
}
.project_tabbar ul li a {
    padding: .1rem 0;
}
.project_tabbar ul li.active a {
    color: #333;
    border-bottom: 2px solid #da251e;
}
.project_main {
    padding: .6rem .5rem;
}
.project_main ul li a {
    display: flex;
    display: -webkit-flex;
    align-items: center;
    box-shadow: 0 0 0.222222rem #eae8e8;
    border-radius: 0.2rem;
    padding: .5rem;
    overflow: hidden;
    margin-bottom: 0.888889rem;
}
.project_main ul li .project_pic {
    width: 7rem;
    height: 3.58rem;
    border-radius: 0.2rem;
    overflow: hidden;
    background: #f5f2f2;
}
.project_main ul li .project_pic img {
    width: 100%;
}
.project_main ul li .project_con {
    flex: 1;
    font-size: 0.622222rem;
    color: #666;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
}

/* story_news */
.project {
    padding: .5rem .5rem 1rem;
}
.project ul li {
    margin-bottom: 0.666667rem;
    padding: .5rem;
    box-shadow: 0 0 0.222222rem #eae8e8;
    border-radius: 0.2rem;
    overflow: hidden;
}
.project ul li a {
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
}
.project ul li .project_pic {
    width: 4.266667rem;
    height: 3.5rem;
    margin-right: .5rem;
    border-radius: .2rem;
    overflow: hidden;
    background-color: #f5f2f2;

}
.project ul li .project_pic img {
    width: 100%;
}
.project ul li .project_info {
    flex: 1;
    width: 9.233333rem;
}
.project ul li .project_info h2 {
    font-size: 0.577778rem;
    margin-bottom: 0.333333rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.project ul li .project_info p {
    font-size: 0.533333rem;
    line-height: 0.666667rem;
    text-align: justify;
    /* text-align-last: justify; */
}

/*video*/
.video ul li {
    padding: 0;
}

/*sitelive*/
.sitelive_container .page_show {
    top: 3.2rem;
}
.sitelive_container .item_case {
    text-align: left;
}