﻿.page-header{margin:0; padding:0; border-bottom: none;}

.header-nav-wapper { background-color: #33373d; width: 100%; }
.header-nav-wapper .logo-wapper .logo { display: block; }
.header-nav-wapper .nav-menus li { float: left }
.header-nav-wapper .nav-menus li a { display: block; width: 100%; font-size: 16px; font-weight: 500; color: #ffffff; line-height: 64px; height: 64px; padding: 0 20px; }
.header-nav-wapper .search-wapper { padding-top: 17px; margin-right: 20px; }
.header-nav-wapper .search-wapper .search-input { border: none; border-radius: 6px 0 0 6px; line-height: 30px; height: 30px; padding: 0 8px; }
.header-nav-wapper .search-wapper .search-btn { padding: 0 10px; background-color: #f15656; color: #fff; height: 30px; line-height: 30px; border-radius: 0 6px 6px 0; }
.header-nav-wapper .search-wapper .search-btn i{ font-size:14px;}
.header-nav-wapper .btns-wapper { display: inline-block; padding-top: 17px; }
.header-nav-wapper .btns-wapper .btn { color: #fff; display: inline-block; border-radius: 6px; line-height: 30px; height: 30px; padding: 0 15px; }
.header-nav-wapper .btns-wapper .btn i{font-size:14px;}
.header-nav-wapper .btns-wapper .btn-login { margin-right: 17px; }
.header-nav-wapper .btns-wapper .btn-upload { background-color: #f15656; }
.header-nav-wapper.nav-line-wapper .nav-line { background: #f15656; }

.page-footer { background-color: #33373d;padding:20px 0px;}
.page-footer a{color:#f0f0f0;}

.content-banner-wapper .banner { width: 100%; height: 460px; }
.content-main-wapper .home-panel { margin-top:40px;}
.content-main-wapper .home-panel .panel-title{padding:8px 0 6px;}
.content-main-wapper .home-panel .panel-title .caption { font-size: 24px; display:table;  margin:0 auto; font-weight: 600; }
.content-main-wapper .home-panel .panel-content{padding:15px 0 10px; margin-top:10px;}

.pano-list li { width: 285px; float: left; margin-right: 20px; margin-bottom: 20px;  }
.pano-list li:nth-child(4n) { margin-right: 0; }
.pano-list li a {display:inline-block; width:285px; color: #515a6e; }
.pano-list li a .cover-img { position: relative; width: 285px; height: 285px; overflow:hidden;}
.pano-list li a .cover-img>img { width: 285px; height: 285px; display:block; transition:.5s ease;}
.pano-list li a .cover-img .qr-code { position: absolute; display: flex; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,.5); z-index: 10; opacity: 0; transition: .6s ease; }
.pano-list li a .cover-img .qr-code > img { height: 176px; width: 176px; margin: auto; }
.pano-list li:hover { box-shadow: 0 0 20px rgba(0,0,0,.35); }
.pano-list li a:hover .cover-img > img { transform:scale(1.2); }
.pano-list li:hover a .cover-img .qr-code { opacity: 1; }
.pano-list li a .pano-info{padding:10px;}
.pano-list li a .pano-info .title {font-weight: bold;text-overflow: ellipsis;width: 260px; overflow: hidden;white-space: nowrap;}
.pano-list li a .pano-info .other { font-size: 12px; margin-top: 8px; color: #7f7f7f ;}

/*精选*/
.bx-wrapper{margin:0 auto 40px !important;}
.bx-wrapper .bx-viewport { box-shadow: none !important; border: none !important; left: 0 !important; }
@media (min-width: 1280px){
    .bx-wrapper .bx-prev { left: -40px !important; }
    .bx-wrapper .bx-next { right: -40px !important; }
}
@media (max-width: 1280px) {
    .bx-wrapper .bx-prev { left: 10px !important; }
    .bx-wrapper .bx-next { right: 10px !important; }
}
.pano-list.featured-pano-list li:nth-child(4n) { margin-right: 15px; }
.pano-list.featured-pano-list li:hover {box-shadow:none; }

/*全景推荐*/
.recommend-panel{margin-bottom:80px;}
.recommend-tab { margin-bottom: 40px; }
.recommend-tab ul { display: table; margin: 0 auto; }
.recommend-tab ul li { float: left; margin-right: 30px; }
.recommend-tab ul li.active{background:#f0f0f0;}
.recommend-tab ul li a { font-size: 16px; font-weight: 600; display:block; padding: 10px 25px; color: #515a6e; border: 1px solid #ddd; }
.recommend-tab-content { margin-top: 20px; width: 100%; position: relative; overflow: hidden; height:860px; }
.recommend-tab-content .content-recommend-list { position: absolute; width: 1200px; height:860px;}
.content-recommend-item{width:1200px; float:left;}

.recommend-tab-content .more-pano { margin-top: 40px; }
.recommend-tab-content .more-pano-btn { position:relative; border: 1px solid #ddd; display: block; color: #515a6e; width:260px; padding: 10px; font-size: 16px; font-weight: bold; text-align: center; margin: 0 auto; }
.recommend-tab-content .more-pano-btn i{position:absolute; top:7px; font-size:20px; right:70px; transition:1s ease;}
.recommend-tab-content .more-pano-btn:hover i { right:50px; }

/*视频推荐*/
.videorecommend-panel { margin-bottom: 30px;}
.videorecommend-tab {margin-bottom: 30px;}
.videorecommend-tab ul {display: table;margin: 0 auto;}
.videorecommend-tab ul li {float: left;margin-right: 30px;}
.videorecommend-tab ul li.active {background: #f0f0f0;}
.videorecommend-tab ul li a {font-size: 16px;font-weight: 600;display: block;padding: 10px 25px;color: #515a6e;border: 1px solid #ddd;}
.videorecommend-tab-content {margin-top: 20px;width: 100%;position: relative;overflow: hidden;height: 860px;}
.videorecommend-tab-content .videocontent-recommend-list {position: absolute;width: 1200px;height: 860px;}
.videocontent-recommend-item {width: 1200px;float: left;}
.videorecommend-tab-content .more-pano {margin-top: 40px;}
.videorecommend-tab-content .more-pano-btn {position: relative;border: 1px solid #ddd;display: block;color: #515a6e;width: 260px;padding: 10px;font-size: 16px;font-weight: bold;text-align: center;margin: 0 auto;}
.videorecommend-tab-content .more-pano-btn i {position: absolute;top: 7px;font-size: 20px;right: 70px;transition: 1s ease;}
.videorecommend-tab-content .more-pano-btn:hover i {right: 50px;}

/*列表页条件筛选*/
.search-tags-wapper { padding:15px 20px; margin-top:20px; background: #f0f0f0 ;}
.search-tags-wapper ul{margin:15px 0;}
.search-tags-wapper ul li { margin-right: 30px; float: left; }
.search-tags-wapper ul li a { color: #515a6e; padding:2px 10px; border-radius:4px;}
.search-tags-wapper ul li span{font-weight:bold;}
.search-tags-wapper ul li.active a{color:#fff; background:#f15656;}

/*列表页全景列表*/
.pano-list-wapper { margin-top: 20px; }

/*分页*/
.pagination-wapper { display: inline-block; width: 100%; padding: 20px 10px 10px; margin-top: 20px; border-top: 1px solid #ddd; line-height: 28px; background: #fff; }
.toolbar { float: left }
.page { float: right }
.pagination { display: inline-block; padding-left: 0; border-radius: 4px; margin:10px auto 30px; display:table; }
.pagination > li { display: inline; }
.pagination > li > a,
.pagination > li > span { position: relative; float: left; padding: 6px 12px; line-height: 1.42857143; text-decoration: none; color: #f46160; background-color: #fff; border: 1px solid #ddd; margin-left: -1px; }
.pagination > li:first-child > a,
.pagination > li:first-child > span { margin-left: 0; border-bottom-left-radius: 4px; border-top-left-radius: 4px; }
.pagination > li:last-child > a,
.pagination > li:last-child > span { border-bottom-right-radius: 4px; border-top-right-radius: 4px; }
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus { z-index: 2; color: #f46160; background-color: #eeeeee; border-color: #ddd; }
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus { z-index: 3; color: #fff; background-color: #f46160; border-color: #f46160; cursor: default; }
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus { color: #777777; background-color: #fff; border-color: #ddd; cursor: not-allowed; }
.pager { padding-left: 0; margin: 20px 0; list-style: none; text-align: center; }
.pager li { display: inline; }
.pager li > a,
.pager li > span { display: inline-block; padding: 5px 14px; background-color: #fff; border: 1px solid #ddd; border-radius: 15px; }
.pager li > a:hover,
.pager li > a:focus { text-decoration: none; background-color: #eeeeee; }
.pager .next > a,
.pager .next > span { float: right; }
.pager .previous > a,
.pager .previous > span { float: left; }
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span { color: #777777; background-color: #fff; cursor: not-allowed; }

.about-us{text-align:center; color:#ffffff;}

/*全景预览*/
/*点赞*/
.tour-praise { font-size: 16px; width: 80px; color:#fff;  text-align: center; padding-top: 100px; position: relative; }
.tour-praise span { font-size: 25px; text-shadow: 0 0 5px #fff; color: #f00; font-weight: normal; position: absolute; top: 100px; right: 10%; opacity: 0; }
.tour-praise.active span { -webkit-animation: flutter 1.2s ease-in-out; animation: flutter 1.2s 1 ease-in-out; }
/*评论*/

.comment-wapper .content{letter-spacing:2px;margin-left:0; padding:0px 15px; font-size:12px; height:30px; line-height:30px;  color:#fff; border-radius:3px; background:rgba(0,0,0,.55);}

@keyframes flutter {
    0% { opacity: 0; }
    100% { opacity: 1; top: 3px; font-size:40px; right: 30%; }
}