@charset 'utf-8';
/**************************************** Base 寮€濮� ****************************************/
.cll {
color: #e70012;
}
/*header 寮€濮�*/
.header .logo {
line-height: 117px;
}
.header .head-top {
height: 117px;
}
.header .head-top .head-con {
padding-top: 37px;
}
.header .head-top .head-con .t1 {
line-height: 46px;
}
.header .head-top .head-con .t1 em {
color: #de3c34;
}
.header .head-top .head-con .search-w .search-btn {
width: 20px;
height: 20px;
background: url(../images/25.png) no-repeat center;
}
.header .head-top .head-con .search-w .search {
width: 262px;
height: 46px;
line-height: 46px;
background: #eee;
border-radius: 20px;
overflow: hidden;
}
.header .head-top .head-con .search-w .search .txt {
float: left;
width: calc(100% - 55px);
height: 46px;
line-height: 46px;
padding-left: 15px;
background: transparent;
}
.header .head-top .head-con .search-w .search .btn {
float: left;
width: 55px;
height: 46px;
line-height: 46px;
background: url(../images/search.png) no-repeat center;
cursor: pointer;
}
.header .head-top .head-con .search-w .search2 {
border-radius: inherit;
}
.header .head-top .head-con .search-w .search2 .txt {
border-top-left-radius: inherit;
border-bottom-left-radius: inherit;
}
.header .head-top .head-con .search-w .search2 .btn {
border-top-right-radius: inherit;
border-bottom-right-radius: inherit;
}
.header .head-top .head-con .search-w .bottom {
margin: 10px 0 0 10px;
font-size: 12px;
}
.header .head-top .head-con .search-w .bottom .tt1 {
color: #bab9b9;
}
.header .head-top .head-con .search-w .bottom a {
color: #7a7a7a;
margin-left: 15px;
}
.header .head-top .head-con .head-share a {
width: 44px;
height: 44px;
border-radius: 50%;
background: #666;
margin: 0 7px 0 0 !important;
}
.header .head-top .head-con .head-share .a1 {
background: url(../images/a1.png);
}
.header .head-top .head-con .head-share .a2 {
background: url(../images/a2.png);
}
.header .head-top .head-con .head-share .a3 {
background: url(../images/a3.png);
}
.header .head-top .head-con .head-share .a3:hover {
opacity: 1;
filter: alpha(opacity=100);
}
.header .head-top .head-con .head-share .a3:hover .img {
display: block;
}
.header .head-top .head-con .head-share .a3 .img {
display: none;
position: absolute;
z-index: 9;
top: 55px;
right: 0;
width: 112px;
height: 112px;
padding: 5px;
border: 1px solid #e1d6d9;
background: #fff;
}
.header .nav {
background: #eee;
border-bottom: 2px solid #e70012;
}
.header .nav ul li {
width: 12.5%;
float: left;
text-align: center;
}
.header .nav ul li h2 a {
display: block;
height: 55px;
line-height: 55px;
font-size: 16px;
}
.header .nav ul li h2 a:hover {
background: #e70012;
color: #fff;
}
@media (max-width: 1199px) {
.footer {
padding: 0 10px;
}
.footer .foot-l {
padding: 0;
float: none;
}
.footer .foot-l .pt25 {
display: none;
}
.footer .foot-l .copright {
text-align: center;
line-height: 45px;
font-size: .29rem;
}
.footer .foot-l .copright span {
display: none;
}
.footer .foot-r {
display: none;
}
}
@media (max-width: 991px) {
.btn-nav-wrap {
display: block;
}
.header .head-top {
height: 1.2rem;
border-bottom: 1px solid #ccc;
}
.header .head-top .head-con {
display: none;
}
.header {
height: 1.2rem;
}
.header .logo {
line-height: 1.2rem;
}
.header .logo img {
height: 1rem;
}
.header .nav {
display: none;
top: 1.2rem;
z-index: 999;
width: 100%;
border-bottom: none;
background: #fff;
position: absolute;
}
.header .nav ul {
padding: 0 10px;
}
.header .nav ul li {
width: 100%;
border-bottom: 1px solid #eee;
}
.header .nav ul li:nth-child(odd) {
-webkit-animation: slideInLeft .7s both;
animation: slideInLeft .7s both;
}
.header .nav ul li:nth-child(even) {
-webkit-animation: slideInRight .7s both;
animation: slideInRight .7s both;
}
.header .nav ul li h2 a {
height: 45px;
line-height: 45px;
}
}
.footer {
background: #444a4c;
color: #b8b8b8;
}
.footer .foot-l .copright {
color: #7e7e7e;
}
.footer .foot-l .copright em {
color: #b8b8b8;
}
.footer .foot-r dl dt {
width: 20px;
font-size: 12px;
}
.footer .foot-r dl dd {
width: 75px;
height: 75px;
}
/**************************************** Base 缁撴潫 ****************************************/
.i-main .i-about,
.i-main .i-about,
.i-main .i-news,
.i-main .i-pro,
.i-main .i-case {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.i-main .i-more {
width: 158px;
height: 28px;
line-height: 26px;
color: #898989;
border: 1px solid #e2e2e2;
text-indent: 15px;
margin: 0 auto;
background: url(../images/more1.png) no-repeat 103px center;
}
.i-main .i-more:hover{border: 1px solid #e70012; background:#e70012; color:#fff;}
.i-main .i-tt1 em {
color: #c6c6c6;
position: relative;
}
.i-main .i-tt1 em::after,
.i-main .i-tt1 em::before {
position: absolute;
top: 50%;
content: '';
width: 72px;
height: 1px;
background: #c9c9c9;
}
.i-main .i-tt1 em::before {
left: -77px;
}
.i-main .i-tt1 em::after {
right: -77px;
}
.i-main .i-about {
background-image: url(../images/bg1.jpg);
padding: .77rem 0 .9rem 0;
}
.i-main .i-about .i-more {
margin: 0 auto .77rem auto;
}
.i-main .i-about .box1 h3 {
text-align: center;
color: #404040;
}
.i-main .i-about .box1 h3::after {
position: absolute;
bottom: 0;
left: 50%;
content: '';
width: 58px;
height: 4px;
margin-left: -29px;
background: #e70012;
}
.i-main .i-about .box1 .txt {
color: #686868;
}
.i-main .i-about .i-guide {
display: table;
margin: 0 auto;
}
.i-main .i-about .i-guide a {
width: 133px;
height: 133px;
border-radius: 50%;
border: 1px solid #b6b6b6;
text-align: center;
margin-left: .24rem;
}
.i-main .i-about .i-guide a:first-child {
margin-left: 0;
}
.i-main .i-about .i-guide a:hover,.i-main .i-about .i-guide a:hover h4 {
border-color: #e70012;
color:#e70012;
}
.i-main .i-about .i-guide a:hover .img1 {
display: none;
}
.i-main .i-about .i-guide a:hover .img2 {
display: block;
}
.i-main .i-about .i-guide a .img {
height: 86px;
line-height: 98px;
}
.i-main .i-news {
background-image: url(../images/bg2.jpg);
padding: .77rem 0 .9rem 0;
}
.i-main .i-news .album-wrap .gallery-top {
float: left;
position: relative;
}
.i-main .i-news .album-wrap .gallery-top .con {
height: 420px;
}
.i-main .i-news .album-wrap .gallery-top .con a {
width: 100%;
height: 100%;
}
.i-main .i-news .album-wrap .gallery-top .con .info {
left: 0;
bottom: 0;
width: 100%;
padding: .2rem;
background: rgba(0, 0, 0, 0.5);
color: #fff;
}
.i-main .i-news .album-wrap .gallery-top .swiper-wrapper .swiper-slide,
.i-main .i-news .album-wrap .gallery-thumbs .swiper-wrapper .swiper-slide {
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center;
height: auto;
}
.i-main .i-news .album-wrap .gallery-thumbs {
height: 420px;
padding: 27px 30px 27px 30px;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide {
padding-top: 10px;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide .info .date {
position: relative;
width: 120px;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide .info .date::after {
position: absolute;
top: 0;
right: 0;
content: '';
width: 2px;
height: 100%;
background: #ddd;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide .info .txt {
width: calc(100% - 120px);
color: #fff;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide .info .txt div {
color: #d6d6d6;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide-active .info {
color: #fff;
background: #e70012;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-slide-active .info .date::after {
display: none;
}
.i-main .i-news .album-wrap .swiper-button-next,
.i-main .i-news .album-wrap .swiper-button-prev {
width: calc(100% - 60px) !important;
left: .3rem;
height: 27px !important;
z-index: 99;
background: rgba(0, 0, 0, 0.11);
background-color: #7e98a6;
background-repeat: no-repeat;
background-position: center;
}
.i-main .i-news .album-wrap .swiper-button-prev {
top: inherit;
bottom: 0;
background-image: url(../images/s_b.png) !important;
}
.i-main .i-news .album-wrap .swiper-button-next {
top: 0;
margin: 0;
background-image: url(../images/s_t.png) !important;
}
.i-main .i-news .album-wrap .gallery-thumbs .swiper-wrapper .swiper-slide {
cursor: pointer;
height: 420px;
}
.i-main .i-news .album-bottom {
height: 285px;
background: #efefef;
}
.i-main .i-news .album-bottom ul {
display: table;
margin: 0 auto;
}
.i-main .i-news .album-bottom ul li {
float: left;
width: 156px;
height: 206px;
text-align: center;
background: url(../images/4.jpg);
background: red;
font-size: 16px;
color: #fff;
margin-left: 60px;
}
.i-main .i-news .album-bottom ul li:first-child {
margin: 0;
}
.i-main .i-news .album-bottom ul li a {
padding-top: 130px;
}
.i-main .i-news .album-bottom ul li h3 {
padding: 0 10px;
height: 55px;
font-size: 16px;
overflow: hidden;
}
.i-main .i-pro {
background-image: url(../images/bg3.jpg);
padding: .55rem 0 .7rem 0;
}
.i-main .i-pro .list {
margin: .65rem 0 1.1rem 0;
}
.i-main .i-pro .list .item {
width: 23.7%;
height: 285px;
float: left;
margin: 0 7px;
}
.i-main .i-pro .list .item:hover .info {
top: 0;
}
.i-main .i-pro .list .item .info {
top: 285px;
left: 0;
background: rgba(231, 0, 18, 0.73);
}
.i-main .i-pro .list .item .info h4 {
margin: 105px 0 25px 0;
}
.i-main .i-pro .list .item .info .icon {
margin: 0 auto;
width: 41px;
height: 41px;
background: url(../images/1.png) no-repeat center;
}
.i-main .i-pro .bx-wrapper .bx-pager {
bottom: -0.57rem;
}
.i-main .i-pro .bx-wrapper .bx-pager.bx-default-pager a {
width: 12px;
height: 12px;
border-radius: 50%;
background: #fff;
}
.i-main .i-pro .bx-wrapper .bx-pager.bx-default-pager a.active,
.i-main .i-pro .bx-wrapper .bx-pager.bx-default-pager a:focus,
.i-main .i-pro .bx-wrapper .bx-pager.bx-default-pager a:hover {
background: #e70012;
}
.i-main .i-case .i-tt1 span {
color: #404040;
}
.i-main .i-case .i-tt1 em {
color: #888;
}
.i-main .i-case .list li .item:hover .info {
opacity: 1;
}
.i-main .i-case .list li .item .img {
height: 560px;
}
.i-main .i-case .list li .item .info {
opacity: 0;
top: 0;
left: 0;
background: #ccc;
background: rgba(231, 0, 18, 0.73);
padding: 13px;
-webkit-transition: all .5s;
-moz-transition: all .5s;
-ms-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.i-main .i-case .list li .item .info .box {
border: 1px solid #fff;
}
.i-main .i-case .list li .item .info .box h4 {
font-size: 23px;
position: relative;
padding-top: 140px;
}
.i-main .i-case .list li .item .info .box .txt {
position: relative;
padding: 1rem 0 .3rem 0;
}
.i-main .i-case .list li .item .info .box .txt::after {
position: absolute;
content: '';
left: 50%;
top: 25px;
width: 1px;
height: 41px;
background: #fff;
}
.i-main .i-case .list li .item .info .box .txt .li25 {
height: 100px;
overflow: hidden;
}
.i-main .i-case .list li .item .info .box a {
width: 170px;
height: 43px;
text-align: left;
text-indent: 30px;
line-height: 43px;
color: #e70012;
background: #fff url(../images/more2.png) no-repeat 111px center;
}
.i-main .i-case .bx-wrapper .bx-controls-direction a {
width: 67px;
height: 67px;
margin-top: -33.5px;
}
.i-main .i-case .bx-wrapper .bx-prev {
background: url(../images/s_l.png) no-repeat center;
}
.i-main .i-case .bx-wrapper .bx-next {
background: url(../images/s_r.png) no-repeat center;
}
.i-main .i-add {
background-image: url(../images/bg4.jpg);
}
.i-main .i-add form .txt,
.i-main .i-add form textarea {
border: 1px solid #d8d8d8;
}
.i-main .i-add form .txt {
width: calc(50% - 5px);
height: 42px;
line-height: 40px;
}
.i-main .i-add form textarea {
width: 100%;
height: 100px;
padding: .1rem;
}
.i-main .i-add form .btn {
width: 100%;
height: 50px;
line-height: 40px;
cursor: pointer;
border: 0;
background: #ec1324;
color: #fff;
}
.i-main .i-add ul li {
padding-left: .48rem;
background-repeat: no-repeat;
background-position: 5px center;
color: #7b7b7b;
height: 57px;
line-height: 57px;
border-bottom: 1px solid #e8e1e2;
}
/**************************************** 鍐呴〉 寮€濮� ****************************************/
.banner {
position: relative;
height: 310px;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.banner .mauto {
text-align: right;
padding-top: 1.15rem;
}
.banner .mauto strong {
font-size: 34px;
}
.banner .mauto span {
position: relative;
}
.banner .mauto span::after {
position: absolute;
right: 0;
bottom: -50%;
content: '';
width: 47px;
height: 5px;
background: #e70012;
}
@media (max-width: 1199px) {
.banner {
height: 3.1rem;
}
.banner .mauto {
padding-right: .3rem;
}
.banner .mauto strong {
font-size: .5rem;
}
.banner .mauto span {
font-size: .4rem;
}
}
.main .menu ul {
background: #ebebeb;
/*! height: 60px; */
line-height: 60px;
}
.main .menu ul li {
display: inline-block;
}
.main .menu ul li.cur a::after,
.main .menu ul li:hover a::after {
width: 100%;
}
.main .menu ul li a {
position: relative;
font-size: 15px;
margin: 0 15px;
}
.main .menu ul li a::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 0%;
height: 3px;
background: #e70012;
-webkit-transition: all .3s;
-moz-transition: all .3s;
-ms-transition: all .3s;
-o-transition: all .3s;
transition: all 0.3s;
}
.main .news-list li {
border: 1px solid #e0e0e0;
padding: .2rem .15rem;
margin-bottom: .2rem;
}
.main .news-list li:hover .info h3 {
color: #c8000a;
}
.main .news-list li:hover {
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
border-color: #c8000a;
}
.main .news-list li:hover .info .date .fr {
background-color: #c8000a;
}
.main .news-list li .img {
/*! width: 300px; */
height: 200px;
}
.main .news-list li .info {
/*! width: calc(100% - 300px); */
}
.main .news-list li .info .els2 {
height: 48px;
overflow: hidden;
}
.main .news-list li .info .date .fr {
width: 32px;
height: 32px;
background-color: #ccc;
border-radius: 50%;
background-image: url(../images/2.png);
background-repeat: no-repeat;
background-position: center;
-webkit-transform: translateY(-0.1rem);
-moz-transform: translateY(-0.1rem);
-ms-transform: translateY(-0.1rem);
-o-transform: translateY(-0.1rem);
transform: translateY(-0.1rem);
}
.main .news-info {
border: 1px solid #dfdfdf;
}
.main .news-info .tt1 {
border-bottom: 1px dashed #dedede;
}
.main .join-list .join-head {
line-height: 53px;
background: #e70012;
color: #fff;
}
.main .join-list .join-head li {
float: left;
display: inline-block;
font-weight: bold;
width: 20%;
text-align: center;
}
.main .join-list .join-body {
margin-bottom: 5px;
}
.main .join-list .join-body li {
float: left;
display: inline-block;
text-align: center;
width: 20%;
height: 53px;
line-height: 53px;
background-color: #ebebeb;
}
.main .join-list .join-body li.btn {
background-repeat: no-repeat;
background-position: center;
background-image: url(../images/join_1.png);
cursor: pointer;
}
.main .join-list .join-body li.btn.cur {
background-image: url(../images/join_2.png);
}
.main .join-list .join-body .txt {
background: #f6f6f6;
border: 1px solid #ebebeb;
}
.main .pro-list .pro-menu {
margin-left: 10px;
padding-bottom: 135px;
width: 232px;
width: 222px;
border: 1px solid #ececec;
background: #f8f8f8;
}
.main .pro-list .pro-menu .tt1 {
position: relative;
width: 210px;
height: 40px;
line-height: 40px;
background: #da000c;
margin-left: -10px;
margin-top: 40px;
padding: 0 .45rem;
}
.main .pro-list .pro-menu .tt1::after {
position: absolute;
left: 0;
bottom: -7px;
content: '';
width: 10px;
height: 7px;
background: url(../images/pro_menu_icon.png) no-repeat center;
}
.main .pro-list .pro-menu ul {
padding-top: .4rem;
}
.main .pro-list .pro-menu ul li {
padding: 0 .4rem;
margin-bottom: .3rem;
}
.main .pro-list .pro-menu ul li.cur a,
.main .pro-list .pro-menu ul li:hover a {
color: #da000c;
background: url(../images/pro_a2.png) no-repeat left center;
}
.main .pro-list .pro-menu ul li a {
padding-left: 15px;
font-size: 15px;
background: url(../images/pro_a1.png) no-repeat left center;
}
.main .pro-list .pro-menu ul li a .img {
height: 2.85rem;
}
.main .pro-list .list {
padding-left: 4.5%;
width: calc(100% - 232px);
}
.main .pro-list .list ul {
margin-left: -2.5%;
}
.main .pro-list .list ul li {
padding-left: 2.5%;
margin-bottom: .2rem;
}
.main .pro-list .list ul li:hover a {
border-color: #e70012;
}
.main .pro-list .list ul li:hover a h3 {
background: #e70012;
color: #fff;
}
.main .pro-list .list ul li a {
border: 1px solid #ebebeb;
}
.main .pro-list .list ul li a .img {
height: 2.86rem;
}
.main .pro-list .list ul li a h3 {
height: 45px;
line-height: 45px;
background: #ebebeb;
}
.main .pro-info .pro-l {
width: 530px;
}
.main .pro-info .pro-l .pro-detail-slider li img {
width: 100%;
height: 435px;
max-width: 100%;
}
.main .pro-info .pro-l .bx-wrapper {
border: 1px solid #e1e1e1;
}
.main .pro-info .pro-l .bx-pager-wrap {
position: relative;
height: 68px;
margin: 20px auto 0;
overflow: hidden;
}
.main .pro-info .pro-l .bx-pager-wrap .bx-pager {
width: 1000%;
position: absolute;
}
.main .pro-info .pro-l .bx-pager-wrap .bx-pager a {
float: left;
margin: 0 5px;
width: 68px;
height: 68px;
border: 1px solid #d2d2d2;
}
.main .pro-info .pro-l .bx-pager-wrap .bx-pager a.active {
border-color: #e70012;
}
.main .pro-info .pro-l .sl-control div {
width: 30px;
height: 68px;
position: absolute;
bottom: 0;
cursor: pointer;
}
.main .pro-info .pro-l .sl-prev {
left: 0;
background: url(../images/pro_sl.png) no-repeat center;
}
.main .pro-info .pro-l .sl-next {
right: 0;
background: url(../images/pro_sr.png) no-repeat center;
}
.main .pro-info .pro-r {
width: calc(100% - 530px);
padding-left: 3.7%;
}
.main .pro-info .pro-r .tt1 {
height: 80px;
line-height: 80px;
color: #e70012;
border-bottom: 1px solid #ebebeb;
}
.main .pro-info .pro-con ul {
background: #ededed;
}
.main .pro-info .pro-con ul li {
position: relative;
width: 130px;
height: 45px;
line-height: 45px;
text-align: center;
background: #ededed;
}
.main .pro-info .pro-con ul li::after {
display: none;
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 2px;
background: #c8000b;
}
.main .pro-info .pro-con ul li.cur {
background: #fff;
color: #c8000b;
}
.main .pro-info .pro-con ul li.cur::after {
display: block;
}
.main .case-list ul {
margin-left: -0.5rem;
}
.main .case-list ul li {
padding-left: .5rem;
margin-bottom: .5rem;
}
.main .case-list ul li a {
border: 1px solid #e3e2e2;
padding: 9px;
}
.main .case-list ul li a:hover {
background: #e70012;
color: #fff;
}
.main .case-list ul li a .img {
height: 405px;
}
.main .case-list ul li a h3 {
height: 45px;
line-height: 55px;
}
.main .message form {
width: 790px;
margin: 0 auto;
}
.main .message form .txt,
.main .message form textarea {
border: 1px solid #ebebeb;
background: #fafafa;
}
.main .message form .txt {
width: 48.4%;
height: 56px;
}
.main .message form textarea {
width: 100%;
height: 187px;
}
.main .message form .btn input {
width: 280px;
height: 56px;
border: 1px solid #e70012;
line-height: 54px;
color: #e70012;
background: transparent;
cursor: pointer;
}
.main .message form .btn input:hover{ background:#e70012; color:#fff}
.vv {
visibility: visible !important;
opacity: 1;
}
.vh {
opacity: 0;
visibility: hidden !important;
}
.fix_case {
width: 1225px;
height: 680px;
background: #fff;
margin: 0 auto;
padding: 27px;
}
.fix_case li .img {
width: 480px;
height: auto;
}
.fix_case li .info {
width: calc(100% - 536px);
padding-left: 5%;
text-align: left;
height: 623px;
}
.fix_case li .info h3 {
font-size: 23px;
padding: .6rem 0 .35rem 0;
color: #e70012;
}
.fix_case li .info .li30 {
height: calc(100% - 127px);
overflow: auto;
}
.fix_case .bx-wrapper .bx-controls-direction a {
width: 130px;
height: 55px;
background-color: #ededed;
}
.fix_case .bx-wrapper .bx-prev {
top: inherit;
left: inherit;
right: 140px;
bottom: 0;
background: url(../images/s_l1.png) no-repeat center;
}
.fix_case .bx-wrapper .bx-next {
top: inherit;
bottom: 0;
background: url(../images/s_r1.png) no-repeat center;
}
.in-page {
line-height: .3rem;
color: #666;
}
.in-page a {
padding: 0 .1rem;
background: #e3e3e3;
}
.in-page a:hover {
color: #fff;
background: #e70012;
}
.zoomDiv {
z-index: 999;
position: absolute;
background: #fff;
border: 1px solid #ccc;
display: none;
text-align: center;
overflow: hidden;
}
.zoomDiv .bigimg {
max-width: initial;
}
.zoomMask {
position: absolute;
background: #fff;
opacity: .5;
cursor: move;
z-index: 1;
width: 100px;
height: 100px;
}
.other_news{ line-height: 30px;
padding: 10px 15px;
font-size: 12px;
color: #666;}
.other_news a {
font-size: 12px;
color: #666;
}
.newsBB {
border-bottom: 1px dotted #dbdbdb;
background: #f7f7f7;
border-top: 1px dotted #dbdbdb;
}
.scenery_list{width: 100%;padding: 50px 0 90px;}
.scenery_list .scenery_one{
width: 23.7%;margin-left: 1.6%;float:left;transition: all .3s;
margin-bottom: 50px;border-bottom: 1px solid #eaeaea;cursor: pointer;
}
.scenery_one .scenery_img{width: 100%;border-radius: 8px;overflow: hidden;}
.scenery_one .scenery_img img{width: 100%;}
.scenery_one .scenery_name{font-size: 14px;color: #333;text-align:center;line-height: 48px;height:48px;}
.scenery_list .scenery_one:hover{border-bottom-color:#c4161c;transform: translateY(-5px);}
.scenery_one:hover .scenery_name{color:#c4161c;}
.mask-wrap {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 99999;
text-align: center;
display: none;
}
.mask-bg {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background: #000;
opacity: .7;
}
.mask-main {
width: 800px;
height: 600px;
position: absolute;
top: 50%;
margin-top: -300px;
left: 50%;
margin-left: -400px;
}
.mask-img {
width: 100%;
height: 560px;
}
.mask-img .img-md {
max-width: 100%;
max-height: 100%;
}
.mask-img img{
max-width: 100%;
max-height: 100%;
/*position: relative;top:50%;transform: translateY(-50%);*/
}
.mask-main p {
font-size: 18px;
color: #fff;
line-height: 20px;
margin-top: 20px;
}
.mask-pager li {
position: absolute;
top: 0;
cursor: pointer;
height: 100%;
width: 10%;
}
.mask-pager .prev {
left: 10%;
background: url(../images/mask_left.png) no-repeat center;
}
.mask-pager .next {
right: 10%;
background: url(../images/mask_right.png) no-repeat center;
}
.mask-close {
width: 30px;
height: 30px;
position: absolute;
right: 5%;
top: 5%;
cursor: pointer;transition: all 1s;
background: url(../images/mask_off.png) no-repeat center center;
}
.mask-close:hover{transform: rotate(360deg);}
/*******************************************************************************/
/**************************************** 寮瑰嚭灞�****************************************/
.noscroll,
.noscroll body {
height: 100%;
overflow: hidden;
}
.fix-wrap {
z-index: 9999;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
}
.fix-wrap .po-auto {
display: table;
width: 100%;
height: 100%;
}
.fix-wrap .hide {
position: absolute;
width: 25px;
height: 25px;
padding: 25px;
right: 5%;
top: 1%;
cursor: pointer;
background-repeat: no-repeat;
background-position: center;
background-color: #090908;
background-image: url(../images/hide.png);
border-radius: 50%;
-webkit-transition: all 8s;
-moz-transition: all .8s;
-o-transition: all .8s;
transition: all .8s;
}
.fix-wrap .hide:hover {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(180deg);
}
.fix-wrap .video-w video {
width: 55%;
height: 55%;
background: rgba(0, 0, 0, 0.8);
}
@media (max-width: 750px) {
.fix-wrap .video-w video {
width: 90%;
height: 50%;
}
}
/**鎵嬫満绔�-鑿滃崟鏍峰紡*****************************************************************************/
@media (max-width: 1199px) {
.btn-nav-wrap {
position: absolute;
top: 0;
right: 0;
height: 100%;
width: auto;
border: 0;
}
.btn-nav-wrap .btn-nav {
display: block;
position: absolute;
top: 0;
right: 0;
height: 100%;
padding: 0 10px;
background: transparent;
border: 0;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
cursor: pointer;
z-index: 888;
}
.btn-nav-wrap .btn-nav::focus {
outline: 0;
}
.btn-nav-wrap .btn-nav .icon-bar {
display: block;
margin: 4px 0;
width: 30px;
height: 3px;
background-color: #999;
}
.btn-nav-wrap .btn-nav:hover .icon-bar {
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all 0.3s ease;
}
.btn-nav-wrap .animated {
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
}
.btn-nav-wrap .animated .icon-bar {
z-index: 888;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
background-color: #999;
}
.btn-nav-wrap .animated .top {
-webkit-transform: translateY(10px) rotateZ(45deg);
-moz-transform: translateY(10px) rotateZ(45deg);
-ms-transform: translateY(10px) rotateZ(45deg);
-o-transform: translateY(10px) rotateZ(45deg);
transform: translateY(10px) rotateZ(45deg);
}
.btn-nav-wrap .animated .middle {
width: 0;
}
.btn-nav-wrap .animated .bottom {
-webkit-transform: translateY(-5px) rotateZ(-45deg);
-moz-transform: translateY(-5px) rotateZ(-45deg);
-ms-transform: translateY(-5px) rotateZ(-45deg);
-o-transform: translateY(-5px) rotateZ(-45deg);
transform: translateY(-5px) rotateZ(-45deg);
}
}
@media (max-width: 768px) {
.btn-nav-wrap .btn-nav.animated .top {
-webkit-transform: translateY(7px) rotateZ(45deg);
-moz-transform: translateY(7px) rotateZ(45deg);
-ms-transform: translateY(7px) rotateZ(45deg);
-o-transform: translateY(7px) rotateZ(45deg);
transform: translateY(7px) rotateZ(45deg);
}
.btn-nav-wrap .btn-nav.animated .middle {
width: 0;
}
.btn-nav-wrap .btn-nav.animated .bottom {
-webkit-transform: translateY(-5px) rotateZ(-45deg);
-moz-transform: translateY(-5px) rotateZ(-45deg);
-ms-transform: translateY(-5px) rotateZ(-45deg);
-o-transform: translateY(-5px) rotateZ(-45deg);
transform: translateY(-5px) rotateZ(-45deg);
}
.btn-nav-wrap .btn-nav .icon-bar {
display: block;
margin: 3px 0;
width: 25px;
height: 3px;
}
}
/*鏍″洯椋庡厜*/
@media (max-width: 800px) {
.scenery_list .scenery_one{width:40%;margin:0 5% 35px;}
.mask-main{
width:100%;
height: 240px;
position: absolute;
top: 76%;
margin-top: -300px;
left:0;
margin-left:0;
}
}
@media (max-width: 450px) {
.scenery_list .scenery_one{width:90%;margin:0 auto 0.4rem;float:none;max-width: 280px;}
.wxin{ display:none}
.mask-main{
height: 240px;
position: absolute;
top: 76%;
margin-top: -300px;
left:0;
margin-left:0;
}
}
@media only screen and (max-width: 480px){
}
@media only screen and (min-width: 481px) and (max-width: 768px){
}
@media only screen and (min-width: 769px) and (max-width: 1200px){
}
@media only screen and (min-width: 1201px) and (max-width: 1440px){
}
@media only screen and (min-width: 1201px) {
.main .news-list li .info{ width: 60%}
}