@charset "utf-8";
@import url("base.css");
/* 贵州信息港黄页频道2022-9-28 */

/*黄页结合项*/
.hy-fieldand{ height: auto; padding:5px 12px 15px 12px; border:1px solid #e1e1e1; overflow: hidden; margin-top: 15px; margin-bottom: 10px; }
.hy-fieldand .jh-box{ font-size: 12px; color: #333; padding-top: 10px;}
.hy-fieldand .jh-box b{ color: #000; font-size: 14px; }
.hy-fieldand .jh-box a{ padding: 4px 8px; border-radius: 3px; line-height: 32px; word-wrap: break-word; }
.hy-fieldand .jh-box a:hover{ background: #0364c4; color: #fff; }
.hy-fieldand .fieldandcss{color: #666; background:#f4f4f4;}
.hy-fieldand .changefieldandcss{ background:#0364c4; color:#fff;}


/*右侧内容热榜，以后可删除*/
.hot_news { border-radius: 2px; border: 1px solid #e1e1e1; margin-top: 20px; padding: 5px 20px 0; overflow: hidden; margin-bottom: 30px; }
.hot_news li { position: relative; margin: 24px 0; overflow: hidden; counter-increment: number; }
.hot_news li i { width: 120px; height: 70px; display: inline-block; overflow: hidden; float: left; margin-right: 12px; border-radius: 2px; }
.hot_news li i img { width: 100%; min-height: 100%; transition: .5s; float: left; }
.hot_news li em { position: absolute; top: 0; left: 0; height: 17px; width: 21px; color: #ccc; font-size: 12px; font-style: normal; text-align: center; background: rgba(0,0,0,.5); border-radius: 2px 0 0; z-index: 1; }
.hot_news li em::before{content: counter(number);}
.hot_news li:nth-child(1) em, .hot_news li:nth-child(2) em, .hot_news li:nth-child(3) em { color: #fff; }
.hot_news li:nth-child(1) em { background: #f95456 }
.hot_news li:nth-child(2) em { background: #f6a625; }
.hot_news li:nth-child(3) em { background: #4385f4 }
.hot_news li h2 { font-size: 14px; color: #333; font-weight: normal; line-height: 20px; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; }
.hot_news li span { font-size: 12px; color: #b3b2b2; position: absolute; display: block; left: 135px; bottom: 0; }
.hot_news li:hover img { transform: scale(1.1); }
.hot_news li:hover h2 { color: #16499d; }


/*列表右侧广告*/
.ad {
    border-radius: 2px;
    border: 1px solid #e1e1e1;
    overflow: hidden;
}
.ad img{ width: 100%;}

/*黄页内页图片*/
.hy-pic-wrap {
            max-width: 860px;
            margin: 10px auto;
	padding-top: 15px;
            position: relative;
            overflow: hidden;
        }
        
        .carousel-track {
            display: flex;
            transition: transform 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
        }
        
        .slide-group {
            display: flex;
            min-width: 100%;
            gap: 20px;
            padding: 0px;
        }
        
        .carousel-item {
            flex: 0 0 calc(50% - 10px);
            position: relative;
            cursor: pointer;
            transition: transform 0.3s;
        }
        
        .carousel-item:hover {
            transform: scale(1.03);
        }
        
        .thumbnail {
            width: 100%;
            height:auto;
            object-fit: cover;
            box-shadow: 0 3px 10px rgba(0,0,0,0.1);
            transition: all 0.3s;
			border-radius: 2px;
        }
        
        .lightbox {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.9);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 1000;
            opacity: 0;
            transition: opacity 0.3s;
        }
        
        .lightbox.active {
            display: flex;
            opacity: 1;
        }
        
        .lightbox-content {
            position: relative;
            max-width: 90%;
            max-height: 90%;
        }
        
        .lightbox-img {
            max-width: 100%;
            max-height: 90vh;
            border-radius: 3px;
            box-shadow: 0 5px 30px rgba(0,0,0,0.3);
            transition: opacity 0.5s ease;
        }
        
        .lightbox-img.loading {
            opacity: 0;
        }
        
        .lightbox-control {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background: rgba(255,255,255,0.1);
            color: white;
            border: none;
            padding: 20px;
            cursor: pointer;
            z-index: 10;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s;
        }
        
        .lightbox-control:hover {
            background: rgba(255,255,255,0.3);
        }
        
        .lightbox-prev {
            left: 20px;
        }
        
        .lightbox-next {
            right: 20px;
        }
        
        .lightbox-close {
            position: absolute;
            top: 20px;
            right: 20px;
            background: rgba(255,255,255,0.2);
            color: white;
            border: none;
            padding: 10px;
            cursor: pointer;
            z-index: 10;
            border-radius: 50%;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s;
        }
        
        .lightbox-close:hover {
            background: rgba(255,255,255,0.3);
        }
        
        .carousel-control {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background-color: rgba(255,255,255,0.2);
            color: #333;
            border: none;
            padding: 15px;
            cursor: pointer;
            z-index: 3;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        
        .carousel-control:hover {
            background-color: #fff;
            transform: translateY(-50%) scale(1.1);
        }
        
        .carousel-control.prev {
            left: 20px;
        }
        
        .carousel-control.next {
            right: 20px;
        }
        
        .pagination {
            display: flex;
            justify-content: center;
            margin-top: 10px;
			margin-bottom: 20px;
            gap: 10px;
        }
        
        .pagination-dot {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background-color: #ddd;
            cursor: pointer;
            transition: all 0.3s;
        }
        
        .pagination-dot.active {
            background-color: #4a6bff;
            transform: scale(1.2);
        }
        /* 新增触摸反馈样式 */
        .lightbox-img.active {
            transition: transform 0.3s ease;
        }
        
        @media (max-width: 768px) {
            .carousel-item {
                flex: 0 0 100%;
            }
            
            .thumbnail {
                max-height: 400px;
            }
            
            .carousel-control {
                width: 25px;
                height: 25px;
                padding: 10px;
            }
        }

/*黄页电话地址内容等*/
.hy-view-box{ height: auto; overflow:}
.hy-view-title{ height: 35px; overflow: hidden;}
.hy-view-title h4{ width: 120px; height: 35px; line-height: 35px; text-align: center; font-size: 16px; background: #f67c15; color: #FFFFFF; margin: 0; padding: 0px;}
.hy-view-info{ height: auto; overflow: hidden; padding: 10px 20px; border: 1px solid #D7D7D7;}
.hy-view-info ul,li{ list-style: none; margin: 0; padding: 0;}
.hy-view-info li{ height: auto; line-height: 2em; font-size: 14px; overflow: hidden;}
.hy-view-info .col-md-4{ padding-right:0px;}
.hy-view-info li p{ padding: 0px 5px 0px 13px; margin: 5px 0px; background: url("../images/hy_jt.gif") no-repeat 0px 9px;}
.hy-view-info li p span{ font-size: 12px; font-weight: bold; color:#F00004;}
.row li{ float: left;}
.row .col-md-6{ width: 56%;}
.row .col-md-3{ width: 22%;}

/*腾讯导航地图*/
.dh-map{ width: 100%; height: 300px; overflow: hidden; position: relative;}
/*黄页腾讯地图按钮*/
#tx-nav{ z-index: 2; position:absolute; bottom: 0px; right: 0px;}
    #ercode{ display: block; width: 83px; height: 83px; background: url("../images/nav_icon.png") no-repeat; cursor:pointer; background-size: cover;}
    
  .share_qrcode {
            position: absolute;
            padding: 10px;
            width: 260px;
            height: 280px;
            background-color: #fff;
            border: 1px solid #d8d8d8;
            z-index: 3;
            font-size: 12px;
            display: none;
            bottom:1px;/*上边距的高度*/
            box-shadow: 0px 1px 3px #b5b5b5;
        }

        .share_qrcode .code_head {
            font-size: 12px;
            font-weight: bold;
            text-align: center;
            line-height: 16px;
            height: 16px;
            position: relative;
            color: #000;
        }

        .share_qrcode .code_close {
            width: 20px;
            height: 20px;
            position: absolute;
            right: 0;
            top: 0;
            color: #999;
            text-decoration: none;
            font-size: 20px;
      cursor:pointer;
        }
        .code_main {
            /* width: 200px; */
            /* height: 200px; */
            padding: 12px 10px;
            margin: 0 auto;
        }

        #code table {
            margin: 0 auto;
        }

        .code_foot {
            font-size: 14px;
            color: #666;
            text-align: center;
        }
/*黄页转载部分专用*/
.hy-zz{ margin-top: 0px;}