body { background: #eee; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 14px; color: #000; } .swiper-slide-active {height: 100%;} .re-aa {position: fixed;bottom: 0; } @media only screen and (max-width: 767px){ .title{text-align: center;height: 18%; overflow: hidden;} .title img{width: 38%; margin-top: 50px;} } .title2{ text-align: center; margin: 6.25rem 0; } .clearx {clear:both;} .sun .img1{top: 110px;left: 40px;} @media only screen and (min-width: 480px) and (max-width: 767px){ .sun .img1{top: 70px;left: 5px; width: 35%;} } @media only screen and (min-width: 411px) and (max-width: 479px){ .sun .img1{top: 70px;left: 5px; width: 35%;} } @media only screen and (min-width: 375px) and (max-width: 410px){ .sun .img1{top: 70px;left: 5px; width: 35%;} } @media only screen and (min-width: 360px) and (max-width: 374px){ .sun .img1{top: 70px;left: 5px; width: 35%;} } @media only screen and (max-width: 359px){ .sun .img1{top: 70px;left: 5px; width: 35%;} } .sun .img3{top: 180px;left: 50%; width: 15%; z-index: 1000;} @media only screen and (min-width: 480px) and (max-width: 767px){ .sun .img3{top: 180px;left: 40%; width: 20%; z-index: 1000;} } @media only screen and (min-width: 411px) and (max-width: 479px){ .sun .img3{top: 200px;left: 40%; width: 20%; z-index: 1000;} } @media only screen and (min-width: 375px) and (max-width: 410px){ .sun .img3{top: 200px;left: 40%; width: 20%; z-index: 1000;} } @media only screen and (min-width: 360px) and (max-width: 374px){ .sun .img3{top: 200px;left: 40%; width: 20%; z-index: 1000;} } @media only screen and (max-width: 359px){ .sun .img3{top: 200px;left: 40%; width: 20%; z-index: 1000;} } .sun .img2 {top: 0px;right: 0%;} .sun .img5 {top: 300px;right: 0%;animation: somename3 100s infinite linear; position: relative;} @keyframes somename3 { 0% { right: 0%; } 50% { right: 20%; top:150px; } 100% { right: 40%; top:0; } } @media only screen and (min-width: 411px) and (max-width: 479px){ .sun .img5 {top: 150px;right: -10%;animation: somename3 100s infinite linear; position: relative; z-index: 800;} @keyframes somename3 { 0% { right: -10%; } 50% { right: 5%; top:50px; } 100% { right: 20%; top:-50px; } } } @media only screen and (min-width: 375px) and (max-width: 410px){ .sun .img5 {top: 150px;right: -10%;animation: somename3 100s infinite linear; position: relative; z-index: 800;} @keyframes somename3 { 0% { right: -10%; } 50% { right: 5%; top:50px; } 100% { right: 20%; top:-50px; } } } @media only screen and (min-width: 360px) and (max-width: 374px){ .sun .img5 {top: 150px;right: -10%;animation: somename3 100s infinite linear; position: relative; z-index: 800;} @keyframes somename3 { 0% { right: -10%; } 50% { right: 5%; top:50px; } 100% { right: 20%; top:-50px; } } } @media only screen and (max-width: 359px){ .sun .img5 {top: 150px;right: -10%;animation: somename3 100s infinite linear; position: relative; z-index: 800;} @keyframes somename3 { 0% { right: -10%; } 50% { right: 5%; top:50px; } 100% { right: 18%; top:-50px; } } } .sun .img4{top:650px; left: 70%; width: 105px; height: 132px; background: url(../images/Ship.png) no-repeat; position: absolute;animation: somename 2s infinite,somename2 100s infinite linear;} @keyframes somename { 0% { background-position:0px 0px; } 33.33332% { background-position:0px 0px; } 33.33333% { background-position:0px -132px; } 66.66665% { background-position:0px -132px; } 66.66666% { background-position:0px -264px; } 100% { background-position:0px -264px; } } @keyframes somename2 { 0% { left: 70%; } 100% { left: 20%; } } @media only screen and (min-width: 411px) and (max-width: 479px){ .sun .img4{top:400px; left: 70%; width: 105px; height: 132px; background: url(../images/Ship.png) no-repeat; position: absolute;animation: somename 2s infinite,somename2 10s infinite linear; transform: scale(0.5);} @keyframes somename { 0% { background-position:0px 0px; } 33.33332% { background-position:0px 0px; } 33.33333% { background-position:0px -132px; } 66.66665% { background-position:0px -132px; } 66.66666% { background-position:0px -264px; } 100% { background-position:0px -264px; } } @keyframes somename2 { 0% { left: 70%; top:400px;transform: scale(0.5); } 50% { left: 50%; top:500px; } 100% { left: 20%; top:600px;transform: scale(1);} } } @media only screen and (min-width: 375px) and (max-width: 410px){ .sun .img4{top:400px; left: 65%; width: 105px; height: 132px; background: url(../images/Ship.png) no-repeat; position: absolute;animation: somename 2s infinite,somename2 100s infinite linear; transform: scale(0.5);} @keyframes somename { 0% { background-position:0px 0px; } 33.33332% { background-position:0px 0px; } 33.33333% { background-position:0px -132px; } 66.66665% { background-position:0px -132px; } 66.66666% { background-position:0px -264px; } 100% { background-position:0px -264px; } } @keyframes somename2 { 0% { left: 65%; top:400px;transform: scale(0.5); } 50% { left: 50%; top:500px; } 100% { left: 30%; top:550px;transform: scale(1);} } } @media only screen and (min-width: 360px) and (max-width: 374px){ .sun .img4{top:400px; left: 65%; width: 105px; height: 132px; background: url(../images/Ship.png) no-repeat; position: absolute;animation: somename 2s infinite,somename2 100s infinite linear; transform: scale(0.5);} @keyframes somename { 0% { background-position:0px 0px; } 33.33332% { background-position:0px 0px; } 33.33333% { background-position:0px -132px; } 66.66665% { background-position:0px -132px; } 66.66666% { background-position:0px -264px; } 100% { background-position:0px -264px; } } @keyframes somename2 { 0% { left: 65%; top:300px;transform: scale(0.5); } 50% { left: 50%; top:400px; } 100% { left: 30%; top:500px;transform: scale(1);} } } @media only screen and (max-width: 359px){ .sun .img4{top:400px; left: 65%; width: 105px; height: 132px; background: url(../images/Ship.png) no-repeat; position: absolute;animation: somename 2s infinite,somename2 100s infinite linear; transform: scale(0.5);} @keyframes somename { 0% { background-position:0px 0px; } 33.33332% { background-position:0px 0px; } 33.33333% { background-position:0px -132px; } 66.66665% { background-position:0px -132px; } 66.66666% { background-position:0px -264px; } 100% { background-position:0px -264px; } } @keyframes somename2 { 0% { left: 65%; top:300px;transform: scale(0.5); } 50% { left: 50%; top:400px; } 100% { left: 30%; top:450px;transform: scale(1);} } } .sun .img6{top:230px; left: 5%; width: 133px; height: 48px; background: url(../images/Cloud1.png) no-repeat; position: absolute;animation: cloud 100s infinite,cloudmove 100s infinite linear;} @keyframes cloud { 0% { background-position:0px 0px; } 14% { background-position:0px 0px; } 14.001% { background-position:0px -48px; } 28% { background-position:0px -48px; } 28.001% { background-position:0px -96px; } 42% { background-position:0px -96px; } 42.001% { background-position:0px -144px; } 56% { background-position:0px -144px; } 56.001% { background-position:0px -192px; } 70% { background-position:0px -192px; } 70.001% { background-position:0px -240px; } 84% { background-position:0px -240px; } 84.001% { background-position:0px -288px; } 100% { background-position:0px -288px; } } @keyframes cloudmove { 0% { left: 5%; } 100% { left: 100%; } } .sun .img7{top:330px; left: -10%; width: 200px; height: 72px; background: url(../images/Cloud2.png) no-repeat; position: absolute;animation: cloud2 100s infinite,cloudmove2 100s infinite linear;} @keyframes cloud2 { 0% { background-position:0px 0px; } 20% { background-position:0px 0px; } 20.001% { background-position:0px -72px; } 38% { background-position:0px -72px; } 38.001% { background-position:0px -144px; } 50% { background-position:0px -144px; } 50.001% { background-position:0px -216px; } 62% { background-position:0px -216px; } 62.001% { background-position:0px -288px; } 75% { background-position:0px -288px; } 75.001% { background-position:0px -360px; } 88% { background-position:0px -360px; } 88.001% { background-position:0px -432px; } 100% { background-position:0px -432px; } } @keyframes cloudmove2 { 0% { left: -10%; } 100% { left: 50%; } } .sun .img8{top:200px; left: 30%; width: 158px; height: 50px; background: url(../images/Cloud3.png) no-repeat; position: absolute;animation: cloud3 100s infinite,cloudmove3 100s infinite linear;z-index: 500;} @keyframes cloud3 { 0% { background-position:0px 0px; } 20% { background-position:0px 0px; } 20.001% { background-position:0px -50px; } 40% { background-position:0px -50px; } 40.001% { background-position:0px -100px; } 60% { background-position:0px -100px; } 60.001% { background-position:0px -150px; } 80% { background-position:0px -150px; } 80.001% { background-position:0px -200px; } 99.999% { background-position:0px -200px; } 100% { background-position:0px -250px; } } @keyframes cloudmove3 { 0% { left: 30%; } 100% { left: 60%; } } .sun .img9{top:100px; left: 0%; position: absolute;animation: cloud4 100s infinite,cloudmove4 100s infinite linear;z-index: 800;} @keyframes cloud4 { 0% { transform: scale(0.5); } 100% {transform: scale(1); } } @keyframes cloudmove4 { 0% { left: 0%; } 100% { left: 100%; } } .sun .img10{top:150px; left: 0%; position: absolute;animation: cloud5 70s infinite,cloudmove5 70s infinite linear;z-index: 300;} @keyframes cloud5 { 0% { transform: scale(1.5); } 100% {transform: scale(1); } } @keyframes cloudmove5 { 0% { left: 0%; } 100% { left: 100%; } } .sun .img11{top:170px; left: -30%; position: absolute;animation: cloud6 120s infinite,cloudmove6 120s infinite linear;z-index: 300;} @keyframes cloud6 { 0% { transform: scale(1); } 100% {transform: scale(1.5); } } @keyframes cloudmove6 { 0% { left: -30%; } 100% { left: 80%; } } .sun .img12{top:210px; left: -50%; position: absolute;animation: cloud7 50s infinite,cloudmove7 50s infinite linear;z-index: 301;} @keyframes cloud7 { 0% { transform: scale(1.8); } 100% {transform: scale(0.8); } } @keyframes cloudmove7 { 0% { left: -50%; } 100% { left: 50%; } } .sun .img13{top:210px; left: 50%; position: absolute;animation: cloud8 60s infinite,cloudmove8 60s infinite linear;z-index: 302;} @keyframes cloud8 { 0% { transform: scale(1.8); } 100% {transform: scale(0.8); } } @keyframes cloudmove8 { 0% { left: 50%; } 100% { left: 100%; } } .sun .img14{top:210px; left: -100%; position: absolute;animation: cloud9 60s infinite,cloudmove9 60s infinite linear;z-index: 302;} @keyframes cloud9 { 0% { transform: scale(1.8); } 100% {transform: scale(0.8); } } @keyframes cloudmove9 { 0% { left: -100%; } 100% { left: 50%; } } .swiper-container { width: 100%; height: 100%; margin:0 auto; } .ls {height: 1000px;} .s1{ background: url(../images/pbanner.jpg) no-repeat left top/100% ; background-size:100% 100% ; } .s3{ background: url(../images/pbanner3.jpg) no-repeat left top/100% ; background-size:100% 100% ; } .sun { max-width: 1200px; margin: 0 auto; position: relative; z-index: 100; } .sun img {position: absolute;} @media only screen and (min-width: 480px) and (max-width: 767px){ .glt {top:80px;} .glt img {width: 50px; left: 2rem;} } @media only screen and (min-width: 411px) and (max-width: 479px){ .glt {top:80px;} .glt img {width: 40px; left: 2rem;} } @media only screen and (min-width: 375px) and (max-width: 410px){ .glt {top:70px;} .glt img {width: 30px; left: 2rem;} } @media only screen and (min-width: 360px) and (max-width: 374px){ .glt {top:70px;} .glt img {width: 30px; left: 2rem;} } @media only screen and (max-width: 359px){ .glt {top:70px;} .glt img {width: 30px; left: 2rem;} } #zjyr{ background: url(../images/pzjyr-bg.jpg); background-size:100% 100% ; } @media only screen and (max-width: 767px){ #zjyr .items{height: 70%; overflow: hidden;} } @media only screen and (min-width: 768px) and (max-width: 980px){ #zjyr .items .iteml { width: 260px; float: left;display: table-cell;vertical-align: middle; margin-top: 100px;} } @media only screen and (min-width: 480px) and (max-width: 767px){ #zjyr .items .iteml { width: 60%; float: initial;margin: 0 auto;} } @media only screen and (max-width: 479px){ #zjyr .items .iteml { width: 50%; float: initial;margin: 0 auto;} } @media only screen and (min-width: 768px) and (max-width: 980px){ #zjyr .items .itemr { width: 470px; float: left; margin-right:0} } @media only screen and (max-width: 767px){ #zjyr .items .itemr { width: 100%; float: initial; margin-right:0} } #zjyr .items .itemr .t {text-align: center;margin-bottom: 15px;} #zjyr .items .itemr .t:hover {filter:drop-shadow(5px 5px 5px gray); margin-top: -4px; margin-bottom: 19px;} @media only screen and (min-width: 480px) and (max-width: 767px){ #zjyr .items .itemr .t img { width: 40%; margin-top: 15px;} #zjyr .items .itemr .t:hover {filter:initial; margin-top: 0; margin-bottom: 15px;} } @media only screen and (max-width: 479px){ #zjyr .items .itemr .t {text-align: center;margin-bottom: 2px;} #zjyr .items .itemr .t img { width: 40%; margin-top: 8px;} #zjyr .items .itemr .t:hover {filter:initial; margin-top: 0; margin-bottom: 2px;} } @media only screen and (max-width: 480px) and (max-width: 767px){ #zjyr .items .itemr .c span {line-height: 2rem; font-size:1rem; font-weight: initial; padding-bottom: 10px; margin: 0 0.5rem;} } @media only screen and (max-width: 411px) and (max-width: 479px){ #zjyr .items .itemr .c span {line-height: 2rem; font-size:0.8rem; font-weight: initial; padding-bottom: 5px; margin: 0 0.5rem;} } @media only screen and (max-width: 375px) and (max-width: 410px){ #zjyr .items .itemr .c span {line-height: 2rem; font-size:0.8rem; font-weight: initial; padding-bottom: 5px; margin: 0 0.5rem;} } @media only screen and (max-width: 360px) and (max-width: 374px){ #zjyr .items .itemr .c span {line-height: 2rem; font-size:0.8rem; font-weight: initial; padding-bottom: 5px; margin: 0 0.5rem;} } @media only screen and (max-width: 359px){ #zjyr .items .itemr .c span {line-height: 1.5rem; font-size:0.7rem; font-weight: initial; padding-bottom: 5px; margin: 0 0.5rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden;} } .gra { transition: all 0.1s;margin-bottom: 10px;} .gra .frm {position: relative;} .gra:hover {margin: -5px 0 5px 0; filter:drop-shadow(5px 5px 5px gray);} @media only screen and (max-width: 767px){ .gra:hover {margin: 0 0 10px 0; filter:initial;} } .gra p {position: absolute;} @media only screen and (max-width: 767px){ .gra p {position: initial;} } .gra:hover p {animation:move1 0.3s 1 forwards;} .gra:hover span {animation:move1 0.3s 1 forwards;} @media only screen and (max-width: 767px){ .gra:hover p {animation:move1 0s 1 forwards;} } .gra2:hover p {animation:move1 0.3s 1 forwards;} @media only screen and (max-width: 767px){ .gra2:hover p {animation:move1 0s 1 forwards;} } .gra3:hover p {animation:move1 0.3s 1 forwards;} @media only screen and (max-width: 767px){ .gra3:hover p {animation:move1 0s 1 forwards;} } @keyframes move1 { 0%{top: 12px; display: none;} 25%{top: 9px; display: none;} 50%{top:6px} 100%{top:0} } .kug {float: left;} .m_c_r {height: 90%; padding-top: 8%;} .kug2 {margin:0 auto; width:100%; height: 30%;transition: all 0.1s; line-height: 30%; vertical-align: middle;} .gra2 {margin:0 auto ;height: 100%;line-height: 100%; width: 122px; padding:0;} .gra2 .f2l {background: url(../images/f2l.png); height: 38px; width: 11px; float: left; margin-left: 0.5rem; } .gra2 .f2m {background: url(../images/f2m.png) repeat-x;height: 38px; float: left; line-height: 38px; font-size: 1rem; color: #fff; font-weight: bold; padding: 0 12px;position: relative; text-align: center;} .gra2 .f2r {background: url(../images/f2r.png);height: 38px; width: 11px;float: left; margin-right: 0.5rem;} @media only screen and (max-width: 767px){ .kug2 {margin:0 auto; width:100%; height: 30%;transition: all 0.1s;} .gra2 {margin:0 auto;height: 100%;line-height: 100%; width: inherit; padding: 25% 0 0 0;} .gra2 .f2l {background: url(../images/f2l.png); background-size:100% 100% ;height: 20px; width: 6px; float: left; margin-left: 0rem; } .gra2 .f2m {background: url(../images/f2m.png) repeat-x; background-size:100% 100% ;height: 20px; float: left; line-height: 20px; font-size: 0.5rem; color: #fff; font-weight: bold; padding:0px;text-align: center;} .gra2 .f2r {background: url(../images/f2r.png); background-size:100% 100% ;height: 20px; width: 6px;float: left; margin-right: 0rem;} } @media only screen and (min-width: 411px)and (max-width: 479px){ } @media only screen and (min-width: 375px)and (max-width: 410px){ } @media only screen and (min-width: 360px)and (max-width: 374px){ } @media only screen and (max-width: 359px){ } .kug2:hover {margin: -5px 0 5px 0; filter:drop-shadow(5px 5px 5px gray);} @media only screen and (max-width: 767px){ .kug2:hover {margin: inherit; filter:inherit;} } .kug3:hover {margin: -5px 0 5px 0; filter:drop-shadow(5px 5px 5px gray);} @media only screen and (max-width: 767px){ .kug3:hover {margin: inherit; filter:inherit;} } .gra2 p {position: absolute;} .gra3 p {position: absolute;} @media only screen and (max-width: 767px){ .gra2 p {position: initial;} .gra3 p {position: initial;} } .kug3 {margin:0 auto; width:100%; height: 33.33%;transition: all 0.1s;} .gra3 {margin:0 auto;height: 100%;line-height: 100%; width: 150px; padding:0;} .gra3 .f2l {background: url(../images/f2l.png); height: 38px; width: 11px; float: left; } .gra3 .f2m {background: url(../images/f2m.png) repeat-x;height: 38px; float: left; line-height: 38px; font-size: 1rem; color: #fff; font-weight: bold; padding: 0 2rem;position: relative;} .gra3 .f2r {background: url(../images/f2r.png);height: 38px; width: 11px;float: left; } @media only screen and (max-width: 767px){ .kug3 {margin:0 auto; width:100%; height: 30%;transition: all 0.1s;} .gra3 {margin:0 auto;height: 100%;line-height: 100%; width: 100px; padding:0;} .gra3 .f2l {background: url(../images/f2l.png); background-size:100% 100% ;height: 20px; width: 6px; float: left; } .gra3 .f2m {background: url(../images/f2m.png) repeat-x;background-size:100% 100% ;height: 20px; float: left; line-height: 20px; font-size: 0.5rem; color: #fff; font-weight: bold; padding: 0 1rem;position: relative;} .gra3 .f2r {background: url(../images/f2r.png);background-size:100% 100% ;height: 20px; width: 6px;float: left; } } .gra .frldj {background: url(../images/frldj.png); height: 54px; width: 15px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;height: 54px; float: left; line-height: 54px; font-size: 24px; color: #d02a2a; font-weight: bold; padding: 0 1rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);height: 54px; width: 15px;float: left; margin-right: 0.5rem;} .gra .frl {background: url(../images/frl.png); height: 54px; width: 15px; float: left; margin-left: 0.5rem; } .gra .frl2 {background: url(../images/frl2.png); height: 54px; width: 51px; float: left; margin-left: 0.5rem;} .gra .frl3 {background: url(../images/frl3.png); height: 54px; width: 51px; float: left; margin-left: 0.5rem;} .gra .frm {background: url(../images/frm.png) repeat-x;height: 54px; float: left; line-height: 54px; font-size: 1.2rem; color: #046433; font-weight: bold; padding: 0 1rem;} .gra .frr {background: url(../images/frr.png);height: 54px; width: 15px;float: left; margin-right: 0.5rem;} .gra .w1 {width: 170px;} .gra .w2 {width: 80px;} .gra .w3 {width: 60px;} .gra .w5 {width: 220px;} .gra2 .w3 {width: 60px;} @media only screen and (max-width: 1279px){ .gra .w5 {width: 170px;} .gra .frmdj {font-size: 18px;} } @media only screen and (max-width: 767px){ .gra2 .w3 {width: 50px;} } .gra3 .w3 {width: 60px;} @media only screen and (max-width: 767px){ .gra3 .w3 {width: 50px;} } .gra .w4 {width: 100px;} @media only screen and (min-width: 768px)and (max-width: 979px){ .gra .w1 {width: 150px;} .gra .w2 {width: 70px;} .gra .w3 {width: 50px;} .gra .w4 {width: 80px;} } @media only screen and (min-width: 480px)and (max-width: 767px){ .gra .w1 {width: 135px;} .gra .w2 {width: 54px;} .gra .w3 {width: 40px;} .gra .w4 {width: 64px;} } @media only screen and (min-width: 411px)and (max-width: 479px){ .gra .w1 {width: 120px;} .gra .w2 {width: 54px;} .gra .w3 {width: 40px;} .gra .w4 {width: 64px;} } @media only screen and (min-width: 375px)and (max-width: 410px){ .gra .w1 {width: 120px;} .gra .w2 {width: 54px;} .gra .w3 {width: 40px;} .gra .w4 {width: 64px;} } @media only screen and (min-width: 360px)and (max-width: 374px){ .gra .w1 {width: 120px;} .gra .w2 {width: 54px;} .gra .w3 {width: 40px;} .gra .w4 {width: 64px;} } @media only screen and (max-width: 359px){ .gra .w1 {width: 120px;} .gra .w2 {width: 54px;} .gra .w3 {width: 40px;} .gra .w4 {width: 64px;} } @media only screen and (min-width: 768px)and (max-width: 979px){ .gra .frl {background: url(../images/frl.png); background-size:100% 100% ;height: 30px; width: 8px; float: left; } .gra .frl2 {background: url(../images/frl2.png); background-size:100% 100% ;height: 30px; width: 28px; float: left; } .gra .frl3 {background: url(../images/frl3.png); background-size:100% 100% ;height: 30px; width: 28px; float: left; } .gra .frm {background: url(../images/frm.png) repeat-x;background-size:auto 100% ; height: 30px; float: left; line-height: 30px; font-size: 1rem; font-weight: bold; padding: 0 1rem;} .gra .frr {background: url(../images/frr.png);background-size:100% 100% ;height: 30px; width: 8px;float: left; } } @media only screen and (min-width: 480px)and (max-width: 767px){ .gra .frl {background: url(../images/frl.png); background-size:100% 100% ;height: 30px; width: 8px; float: left; } .gra .frl2 {background: url(../images/frl2.png); background-size:100% 100% ;height: 30px; width: 28px; float: left; } .gra .frl3 {background: url(../images/frl3.png); background-size:100% 100% ;height: 30px; width: 28px; float: left; } .gra .frm {background: url(../images/frm.png) repeat-x;background-size:auto 100% ; height: 30px; float: left; line-height: 30px; font-size: 1rem; font-weight: bold; padding: 0 1rem;} .gra .frr {background: url(../images/frr.png);background-size:100% 100% ;height: 30px; width: 8px;float: left; } } @media only screen and (min-width: 411px)and (max-width: 479px){ .gra .frl {background: url(../images/frl.png); background-size:100% 100% ;height: 30px; width: 8px; float: left; } .gra .frl2 {background: url(../images/frl2.png); background-size:100% 100% ;height: 30px; width: 28px; float: left; } .gra .frl3 {background: url(../images/frl3.png); background-size:100% 100% ;height: 30px; width: 28px; float: left; } .gra .frm {background: url(../images/frm.png) repeat-x;background-size:auto 100% ; height: 30px; float: left; line-height: 30px; font-size: 0.8rem; font-weight: bold; padding: 0 0.5rem;} .gra .frr {background: url(../images/frr.png);background-size:100% 100% ;height: 30px; width: 8px;float: left; } } @media only screen and (min-width: 375px)and (max-width: 410px){ .gra .frl {background: url(../images/frl.png); background-size:100% 100% ;height: 25px; width: 7px; float: left; } .gra .frl2 {background: url(../images/frl2.png); background-size:100% 100% ;height: 25px; width: 24px; float: left; } .gra .frl3 {background: url(../images/frl3.png); background-size:100% 100% ;height: 25px; width: 24px; float: left; } .gra .frm {background: url(../images/frm.png) repeat-x;background-size:auto 100% ; height: 25px; float: left; line-height: 25px; font-size: 0.8rem; font-weight: bold; padding: 0 0.5rem;} .gra .frr {background: url(../images/frr.png);background-size:100% 100% ;height:25px; width: 7px;float: left; } } @media only screen and (min-width: 360px)and (max-width: 374px){ .gra .frl {background: url(../images/frl.png); background-size:100% 100% ;height: 20px; width: 6px; float: left; } .gra .frl2 {background: url(../images/frl2.png); background-size:100% 100% ;height: 20px; width: 19px; float: left; } .gra .frl3 {background: url(../images/frl3.png); background-size:100% 100% ;height: 20px; width: 19px; float: left; } .gra .frm {background: url(../images/frm.png) repeat-x;background-size:auto 100% ; height: 20px; float: left; line-height: 20px; font-size: .8rem; font-weight: bold; padding: 0 0.2rem;} .gra .frr {background: url(../images/frr.png);background-size:100% 100% ;height:20px; width: 6px;float: left; } } @media only screen and (max-width: 359px){ .gra .frl {background: url(../images/frl.png); background-size:100% 100% ;height: 20px; width: 6px; float: left; } .gra .frl2 {background: url(../images/frl2.png); background-size:100% 100% ;height: 20px; width: 19px; float: left; } .gra .frl3 {background: url(../images/frl3.png); background-size:100% 100% ;height: 20px; width: 19px; float: left; } .gra .frm {background: url(../images/frm.png) repeat-x;background-size:auto 100% ; height: 20px; float: left; line-height: 20px; font-size: .8rem; font-weight: bold; padding: 0 0.2rem;} .gra .frr {background: url(../images/frr.png);background-size:100% 100% ;height:20px; width: 6px;float: left; } } @media only screen and (min-width: 768px) and (max-width: 980px){ #zjyr .bl {float: left; width: 358px; } #zjyr .br {float: left; width: 410px; } } @media only screen and (max-width: 479px){ #zjyr .b {text-align: center; line-height: 120px; } #zjyr .bl {float: left; width: 47%; } #zjyr .br {float: left; width: 53%; } } #jtyw{background: url(../images/jtyw-bg.jpg);background-size:100% 100% ;} @media only screen and (min-width: 981px) { } @media only screen and (min-width: 768px) and (max-width: 980px){ #jtyw .title {height: 18%;} #jtyw .items .iteml{ width: 90%; float: initial; margin: 0 auto;} } @media only screen and (min-width: 480px) and (max-width: 767px){ #jtyw .items .iteml{ width: 90%; float: initial; margin: 0 auto;} #jtyw .items .iteml {height: 30%; overflow: hidden;} } @media only screen and (max-width: 479px){ #jtyw .items .iteml{ width: 90%; float: initial; margin: 0 auto;} #jtyw .items .iteml {height: 40%; overflow: hidden;} } #jtyw .items .iteml .lt {text-align: center;} @media only screen and (min-width: 480px) and (max-width: 767px){ #jtyw .items .iteml .lt img {width: 20%;} } @media only screen and (min-width: 411px) and (max-width: 479px){ #jtyw .items .iteml .lt img {width: 20%;} } @media only screen and (min-width: 375px) and (max-width: 410px){ #jtyw .items .iteml .lt img {width: 20%;} } @media only screen and (min-width: 360px) and (max-width: 374px){ #jtyw .items .iteml .lt img {width: 20%;} } @media only screen and (max-width: 359px){ #jtyw .items .iteml .lt img {width: 20%;} } @media only screen and (min-width: 981px) { #jtyw .items .iteml .item img {width: 100%; overflow: hidden; height: initial} } @media only screen and (max-width: 980px){ #jtyw .items .itemm{ width: 49%; float: left;text-align: center; height: 60%; overflow: hidden;} } @media only screen and (max-width: 767px){ #jtyw .items .itemm .m1 {background: url(../images/yw01.jpg);background-size:100% 100% ;height: inherit;} #jtyw .items .itemm .m2 {background: url(../images/yw02.jpg);background-size:100% 100% ;height: inherit;} #jtyw .items .itemr .m3 {background: url(../images/yw03.jpg);background-size:100% 100% ;height: inherit;} } @media only screen and (max-width: 767px){ #jtyw .items .itemm .item {height: 49%; margin:0px;padding:0px; width: 99%; } } @media only screen and (max-width: 767px){ #jtyw .items .itemm .item .m_c_l p { color: #fff; text-align: left; font-size: 0.5rem; padding: 0 2px 0 10px; line-height: 1.2rem; letter-spacing: 0.0625rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;} } @media only screen and (max-width: 767px){ #jtyw .items .itemm .item .m_c_l {float: left; width: 55%;} #jtyw .items .itemm .item .m_c_r {float: right; width: 45%;} } #jtyw .items .itemm .item .m_c_r img {margin: 8px auto;} @media only screen and (max-width: 767px){ #jtyw .items .itemm .item .m_c_l img {margin: 0px auto; height: 40px;} #jtyw .items .itemm .item .m_c_r img {margin: 8px auto; height: 20px;} } @media only screen and (max-width: 980px){ #jtyw .items .itemr{ width: 50%; height: 60%; overflow: hidden;} } @media only screen and (max-width: 767px){ #jtyw .items .itemr .item {padding:0px; width: 99%; margin:0px; height: 98%; overflow: hidden;} } @media only screen and (max-width: 767px){ #jtyw .items .itemr .item .mm p { color: #fff; text-align: left; font-size: 0.5rem; padding: 0 10px 0 5px; line-height: 1.2rem; letter-spacing: 0.125rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;} } @media only screen and (max-width: 767px){ #jtyw .items .itemr .item .tt {height: 20%; overflow: hidden;} #jtyw .items .itemr .item .mm {height: 40%; overflow: hidden;} #jtyw .items .itemr .item .mb {height: 45%; padding-top: 5px; overflow: hidden;} #jtyw .items .itemr .item img {height: 100%; margin: 4px auto;} } #cxsm{ background: url(../images/cxsm-bg.jpg); background-size:100% 100% ; } @media only screen and (min-width: 480px) and (max-width: 767px){ #cxsm .ct {width: 110px;margin: 0.5rem auto; } } @media only screen and (min-width: 411px) and (max-width: 479px){ #cxsm .ct {width: 110px;margin: 0.5rem auto; } } @media only screen and (min-width: 375px) and (max-width: 410px){ #cxsm .ct {width: 110px;margin: 0.5rem auto; } } @media only screen and (min-width: 360px) and (max-width: 374px){ #cxsm .ct {width: 105px;margin: 0.5rem auto; } } @media only screen and (max-width: 359px){ #cxsm .ct {width: 105px;margin: 0.5rem auto; } } #cxsm .ct .gra { margin:0px auto; display: inline-block; } #cxsm .ct .gra:hover { margin:-5px 0 5px 0; display: inline-block;} #cxsm .items .item {width: 25%;float: left; text-align: center; padding: 1rem 0 2rem;} @media only screen and (max-width: 980px){ #cxsm .items .item {width: 50%;float: left; } } @media only screen and (max-width: 767px){ #cxsm .ct .gra:hover { margin:0; display: inline-block;} #cxsm .items .item {padding: 1px 0 2px;width: 50%;} } @media only screen and (max-width: 980px){ #cxsm .items .item .c {width: 80%; } } @media only screen and (max-width: 767px){ #cxsm .items .item .c {width: 70%; margin: 4px auto;} } @media only screen and (min-width: 480px) and (max-width: 767px){ } @media only screen and (max-width: 479px){ #cxsm .items .item .c .gra {margin:1px 0 1px ; overflow: hidden; display: inline-block;} } #cxsm .items .item .c:hover {box-shadow: 2px 5px 10px #999; top:5px; } #cxsm .items .item .c a {position: relative; display: block;} #cxsm .items .item .c a .bi {position: absolute; bottom: -2px;right: 0; display: none;} #cxsm .items .item .c a:hover .blk {filter: brightness(80%);} #cxsm .items .item .c a:hover .bi { display: block; animation:ttt 0.5s 1 forwards; /*这里的3s表示总动画长3秒，其它属性感兴趣自己去查，反正主要就是那个3s*/} @keyframes ttt { 0%{ opacity:0; } 10%{ /*这里表示3s的66%也就是大约2秒的时候*/ opacity:0.9; } 66%{ /*这里表示3s的66%也就是大约2秒的时候*/ opacity:0.95; } 100%{ opacity:1; } } #cxsm .items .item .c a img{border-radius: 0.4rem; } @media only screen and (min-width: 768px) and (max-width: 980px){ #cxsm .items .item .c img {width: 100%;} } @media only screen and (max-width: 767px){ #cxsm .items .item .c img {width: 100%;} #cxsm .items .item .c .t img {width: 60%;} } #cxsm .items .item .c .t {margin: 1rem 0 0 0;} @media only screen and (max-width: 767px){ #cxsm .items .item .c .t {margin: 2px 0 0 0;} #cxsm .items .item .c .cp {display: none;} } #cxsm .items .item .c .cp p {height: 3rem; line-height: 2rem; font-size: 1.25rem;font-weight: bold; color: #595959;} @media only screen and (min-width: 480px) and (max-width: 767px){ #cxsm .items .item .c .cp p {line-height: 1rem; height: initial; font-size: 0.9rem;font-weight: bold; color: #595959; margin: 0px 0 2px 0;} } @media only screen and (min-width: 411px) and (max-width: 479px){ #cxsm .items .item .c .cp p {line-height: 1rem; height: initial; font-size: 0.9rem;font-weight: bold; color: #595959; margin: 0px 0 2px 0;} } @media only screen and (min-width: 375px) and (max-width: 410px){ #cxsm .items .item .c .cp p {line-height: 0.8rem; height: initial; font-size: 0.8rem;font-weight: bold; color: #595959; margin: 0px 0 2px 0;} } @media only screen and (min-width: 360px) and (max-width: 374px){ #cxsm .items .item .c .cp p {line-height: 0.8rem; height: initial; font-size: 0.8rem;font-weight: bold; color: #595959; margin: 0px 0 2px 0;} } @media only screen and (min-width: 320px) and (max-width: 359px){ #cxsm .items .item .c .cp p {line-height: 0.6rem; height: initial; font-size: 0.5rem;font-weight: bold; color: #595959; margin: 0px 0 2px 0;} } #news{background: url(../images/news-bg.jpg);background-size:100% 100% ; height: 100%;} #news .title {height: 25%;} @media only screen and (max-width: 767px){ #news .title {height: 21%;} } @media only screen and (max-width: 767px){ #news .mt { max-width: 767px; margin: 0px auto; height: 8%; overflow: hidden;} } @media only screen and (min-width: 480px) and (max-width: 767px){ #news .mt { max-width: 400px; margin: 0px auto;} #news .mt .item {float: left; width: 50%;text-align: center;margin: 0.2rem 0 1rem;} } @media only screen and (min-width: 411px) and (max-width: 479px){ #news .mt { max-width: 340px; margin: 0px auto;} #news .mt .item {float: left; width: 50%;text-align: center;margin: 0.2rem 0 1rem;} } @media only screen and (min-width: 375px) and (max-width: 410px){ #news .mt { max-width: 300px; margin: 0px auto;} #news .mt .item {float: left; width: 50%;text-align: center;margin: 0.2rem 0 1rem;} } @media only screen and (min-width: 360px) and (max-width: 374px){ #news .mt { max-width: 250px; margin: 0px auto;} #news .mt .item {float: left; width: 50%;text-align: center;margin: 0.2rem 0 1rem;} } @media only screen and (max-width: 359px){ #news .mt { max-width: 210px; margin: 0px auto;} #news .mt .item {float: left; width: 50%;text-align: center;margin: 0.2rem 0 1rem;} } @media only screen and (max-width: 767px){ #news .items {height: 100%;} } @media only screen and (max-width: 767px){ #news .items .iteml {width: 100%; float: initial; margin: 0;} } @media only screen and (max-width: 767px){ #news .items .iteml .item .mlt{height: 2rem; line-height: 2rem; color: #fff;background-color: rgba(0,0,20,0.5); width: 100%; font-size: 1rem;} } @media only screen and (max-width: 767px){ #news .items .iteml .item {height: 140px;} } @media only screen and (max-width: 767px){ #news .items .iteml img {height: initial;} } #news .items .iteml img:hover {transform: scale(1.2);transition: all 1s;} .tran {transition: all 1s; width: 200px;} .tran:hover {transform: scale(1.2);transition: all 1s;} #news .items .itemr {width:64%; float: right;} @media only screen and (max-width: 980px){ #news .items .itemr {height: 100%;} } @media only screen and (max-width: 980px){ #news .items .itemr {width:100%; float: initial; height: 60%;} } @media only screen and (max-width: 980px){ #news .items .itemr .item {height: 20%; margin:.5rem auto; border-radius:2px;} } @media only screen and (max-width: 980px){ #news .items .itemr .nl img {height: 100%; margin-right: 0.2rem;} } @media only screen and (max-width: 980px){ #news .items .itemr .nr img {float: right; margin-left: 0.2rem; height: 100%;} } #news .items .itemr .item{box-shadow: 2px 2px 5px #ccc;} #news .items .itemr .item:hover {box-shadow: 2px 5px 10px #999; top:4px; } @media only screen and (max-width: 980px){ #news .items .itemr .item .t {font-size: 1.5rem; font-weight: bold; margin:.2rem 0.5rem 0.2rem; line-height: initial;padding-top: initial; overflow: hidden;text-overflow:ellipsis;white-space: nowrap;} } @media only screen and (max-width: 980px){ #news .items .itemr .item p {font-size: 1.2rem; margin:0.2rem 0.4rem 0; line-height: initial; letter-spacing: 1px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;} } #foot {background: #fff; height: 3.75rem; width: 100%; text-align: center; bottom: 0;} #foot2 {background: #fff; height: 3.75rem; width: 100%; text-align: center; margin-top: 30px;} @media only screen and (max-width: 980px) { #foot {display: none;} } #foot p {color: #7d7d7d; line-height: 3.75rem;} #foot2 p {color: #7d7d7d; line-height: 3.75rem;} #foot .wx {margin-top: 30px;} #foot2 .wx {margin-top: 30px;} .second-one .swiper-pagination{/*装有小圆点的容器,把它移动到顶部，不过top为零时容易把内容覆盖一部分，所以减去小圆点的高度*/ max-width:initial; margin:initial; height:initial; bottom: 12%; display: initial; top:initial; background: initial; box-sizing: initial; padding-left: initial; } .second-one .swiper-pagination{position:absolute; text-align:center; -webkit-transition:.3s; -moz-transition:.3s; -o-transition:.3s; transition:.3s; -webkit-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); transform:translate3d(0,0,0); z-index:10} /* .swiper-pagination{装有小圆点的容器,把它移动到顶部，不过top为零时容易把内容覆盖一部分，所以减去小圆点的高度 max-width:1600px; margin:0 auto; height:100px; display: flex; top:0%; background: url(../images/plogo.png) no-repeat left center; box-sizing: border-box; padding-left: 40rem; } */ /* .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {margin: initial;} */ .second-one .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:5px 0;display:block} .second-one .swiper-container-vertical>.swiper-pagination-bullets{ left: initial; margin-left: initial; right:10px; top:50%; -webkit-transform:translate3d(0,-50%,0); -moz-transform:translate3d(0,-50%,0); -o-transform:translate(0,-50%); -ms-transform:translate3d(0,-50%,0); transform:translate3d(0,-50%,0) } /* .swiper-container-vertical>.swiper-pagination-bullets { top: 5%; left: 50%; right: initial; margin-left: -37.5rem; } */ .second-one .swiper-pagination-bullet {/*这个是小圆点的样式*/ -webkit-flex-grow: initial;/*这个就不用解释了吧，就是平均分配的弹性盒*/ text-align: initial; line-height:initial; font-size: initial; font-weight: initial; padding: initial; } .second-one .swiper-pagination-bullet{width:18px;height:18px;display:inline-block;border-radius:100%;background:#666;opacity:.8;transition: width 1s;} .second-one .swiper-pagination-bullet:hover {width:32px;height:18px;border-radius:8px; background: #0d6a3a; animation:moveso .3s 1 ease-in-out; } @keyframes moveso { 0%{width: 18px; color: #0d6a3a;} 100%{width: 38px; color: #0d6a3a;} } .swiper-pagination-bullet-active{/*这个是被选取得当前的小圆点的样式*/color:#0d6a3a; width:32px;height:18px;} .second-one .swiper-pagination-bullet-active{/*这个是被选取得当前的小圆点的样式*/color:#0d6a3a; background: #0d6a3a; width:32px;height:18px;border-radius:8px;} .swiper-pagination a:hover {color: #0d6a3a;} /* 养瑞党建工程 */ #slide-5 {background: url(../images/news-bg.jpg);background-size:100% 100% ; height: 100%;} #slide-9 {background: url(../images/news-bg.jpg);background-size:100% 100% ;} #cg1 {background: url(../images/news-bg.jpg);background-size:100% 100% ; } #cg2 {background: url(../images/news-bg.jpg);background-size:100% 100% ; } #slide-6 {background: url(../images/zcjy-bg.jpg);background-size:100% 100% ; } #slide-7 {background: url(../images/dj-bg.jpg);background-size:100% 100% ; height: 100%;} #slide-8 {background: url(../images/yrm-bg.jpg);background-size:100% 100% ; } @media only screen and (max-width: 639px){ #slide-8 {background: url(../images/yrm-bg2.jpg);background-size:100% 100% ; height: 100%;} } .w300 {width: 300px;} .w135 {width: 135px;} .w145 {width: 145px;} .w180 {width: 180px;} .w210 {width: 210px;} .w270 {width: 270px;} .mnav {height: 15%;margin: 0 auto;} .mnav a {color: #fff;} .mnav .c {margin-top: 100px; background: #0d6a3a; color: #fff; height: 25px; line-height: 25px; padding-left: .5rem; position: relative; box-shadow: 4px 4px 12px #bbb;} .mnav .c span {font-family: "SimSun";} @media only screen and (min-width: 769px) and (max-width: 980px){ .mnav .c {margin-top: 90px;} } @media only screen and (min-width: 481px) and (max-width: 768px){ .mnav .c {margin-top: 80px;} } @media only screen and (min-width: 361px) and (max-width: 480px){ .mnav .c {margin-top: 70px;} } @media only screen and (min-width: 321px) and (max-width: 360px){ .mnav .c {margin-top: 60px;} } @media only screen and (max-width: 320px){ .mnav .c {margin-top: 50px;} } .arrow-outer { position:absolute; height:25px; width:20px; top: 0; right: -19px; overflow:hidden; } .arrow-shadow { transform:rotate(45deg); -o-transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); background: #0d6a3a; height:17px; position:absolute; width:17px; top: 4px; right: 10px; box-shadow: 1px 2px 8px #bbb; } .c-cont {max-width: 1050px;margin: 0 auto;} .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1.5rem; font-weight: bold; margin-bottom: 10px;} .c-cont .c-cont-c p {line-height: 1.8rem; font-size: .9rem;} .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .9rem;} @media only screen and (min-width: 768px) and (max-width: 980px){ .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1.4rem; font-weight: bold; margin-bottom: 10px;} .goc .c-cont .c-cont-c p {line-height: 1.2rem; font-size: .9rem; margin: .5rem 1rem;} .goc .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .9rem;} .goc .gcimg {float: right; margin: 1rem; width: 40%;} } @media only screen and (min-width: 640px) and (max-width: 767px){ .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1.3rem; font-weight: bold; margin-bottom: 10px;} .goc .c-cont .c-cont-c p {line-height: 1.2rem; font-size: .9rem; margin: .5rem 1rem;} .goc .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .9rem;} .goc .gcimg {float: right; margin: 1rem; width: 40%;} } @media only screen and (min-width: 480px) and (max-width: 639px){ .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1.2rem; font-weight: bold; margin-bottom: 10px;} .goc .c-cont .c-cont-c p {line-height: 1rem; font-size: .8rem; margin: .4rem .5rem;} .goc .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .8rem;} .goc .gcimg {float: right; margin: 1rem; width: 40%;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1.1rem; font-weight: bold; margin-bottom: 10px;} .goc .c-cont .c-cont-c p {line-height: 1rem; font-size: .8rem; margin: .4rem .5rem;} .goc .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .8rem;} .goc .gcimg {float: right; margin: 1rem; width: 40%;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1rem; font-weight: bold; margin-bottom: 10px;} .goc .c-cont .c-cont-c p {line-height: 1rem; font-size: .7rem; margin: .2rem .5rem;} .goc .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .7rem;} .goc .gcimg {float: right; margin: .2rem; width: 40%;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .c-cont .tit{color: #0d6a3a; text-align: center; font-size: 1rem; font-weight: bold; margin-bottom: 10px;} .goc .c-cont .c-cont-c p {line-height: 1rem; font-size: .7rem; margin: .2rem .5rem;} .goc .c-cont .c-cont-c p span {color: #0d6a3a; font-size: .7rem;} .goc .gcimg {float: right; margin: .2rem; width: 40%;} } /* 寄语 */ .zcimg {margin: 1rem auto; text-align: center; width:90% ; display: block; } .zcimg2 {margin: 1rem auto; text-align: center; width:100% ; display: none; } @media only screen and (max-width: 980px){ .zcimg {display: none; } .zcimg2 {display: block; } } /* 寄语 */ .zcimg {margin: 30px auto; text-align: center; width:90% ; display: block; } .zcimg2 {margin: 1rem auto; text-align: center; width:100% ; display: none; } @media only screen and (max-width: 980px){ .zcimg {display: none; } .zcimg2 {display: block; } } @media only screen and (min-width: 768px) and (max-width: 980px){ .dj .djicon3 {position: absolute; right: 0px; top: -55px;} .first-two .swiper-slide img {width: 90%;} .dj .dj-c-r .dj-r-t { font-size: 1.1rem;line-height: 24px; font-weight: bold; color: #d02a2a; } .dj .dj-c-r .dj-r-c {margin: 0 0rem 0 1rem;} .dj .dj-c-r .dj-r-c p {text-align: left; line-height: 26px; font-size: .7rem; color: #d02a2a; text-indent: 2em;margin-top: 2px; font-weight: bold;} .dj .dj-c-r .dj-r-c p span {border-bottom: solid 1px #d02a2a; padding-bottom: 5px; } .dj .dj-c-r .dj-r-c .dj-r-c-b {text-align: right; font-weight: bold; color: #666; margin: 3px 1rem 2.5rem 0; font-size: .7rem;} .dj-b {width:580px; margin: 0 auto; position: relative;} .dj-b .dj-b-c {width: 33.333%; float: left; text-align: center;} .gra .frmdj p {text-align: center;} .gra .frldj {background: url(../images/frldj.png);background-size:100% 100%; height: 43px; width: 12px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;background-size:100% 100%; height: 43px; float: left; line-height: 43px; font-size: 1.1rem; color: #d02a2a; font-weight: bold; padding: 0 1rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);background-size:100% 100% ; height: 43px; width: 12px;float: left; margin-right: 0.5rem;} .dj-b .dj-b-c .w1 {width: 100px;} } @media only screen and (min-width: 640px) and (max-width: 767px){ .first-two .swiper-slide img {width: 90%;} .first-two .swiper-slide {font-size: .7rem;} .dj .dj-c-r .dj-r-t { font-size: 1.1rem;line-height: 24px; font-weight: bold; color: #d02a2a; } .dj .dj-c-r .dj-r-c {margin: 0 0rem 0 1rem;} .dj .dj-c-r .dj-r-c p {text-align: left; line-height: 26px; font-size: .7rem; color: #d02a2a; text-indent: 2em;margin-top: 2px; font-weight: bold;} .dj .dj-c-r .dj-r-c p span {border-bottom: solid 1px #d02a2a; padding-bottom: 5px; } .dj .dj-c-r .dj-r-c .dj-r-c-b {text-align: right; font-weight: bold; color: #666; margin: 3px 1rem 2.5rem 0; font-size: .7rem;} .dj-b {width:580px; margin: 0 auto; position: relative;} .dj-b .dj-b-c {width: 33.333%; float: left; text-align: center;} .gra .frmdj p {text-align: center;} .gra .frldj {background: url(../images/frldj.png);background-size:100% 100%; height: 43px; width: 12px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;background-size:100% 100%; height: 43px; float: left; line-height: 43px; font-size: 1rem; color: #d02a2a; font-weight: bold; padding: 0 1rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);background-size:100% 100% ; height: 43px; width: 12px;float: left; margin-right: 0.5rem;} .dj-b .dj-b-c .w1 {width: 100px;} } @media only screen and (min-width: 480px) and (max-width: 639px){ .dj .dj-c-l { width: 85%; float: left; text-align: center;} .dj .dj-c-r { width: 100%; float: left; text-align: center;} .first-two .swiper-slide img {width: 90%;} .first-two .swiper-slide {font-size: .7rem;} .dj .djicon1 {position: absolute; right: 0; top: -50px;} .dj .djicon2 {position: absolute; left: 0; top: -150px;} .dj .djicon3 {position: absolute; right: 200px; top: -150px;} .dj .dj-c-r .dj-r-t { font-size: 1.1rem;line-height: 24px; margin-top: 1rem; font-weight: bold; color: #d02a2a; } .dj .dj-c-r .dj-r-c {margin: 0 0rem 0 1rem;} .dj .dj-c-r .dj-r-c p {text-align: left; line-height: 26px; font-size: .7rem; color: #d02a2a; text-indent: 2em;margin-top: 2px; font-weight: bold;} .dj .dj-c-r .dj-r-c p span {border-bottom: solid 1px #d02a2a; padding-bottom: 5px; } .dj .dj-c-r .dj-r-c .dj-r-c-b {text-align: right; font-weight: bold; color: #666; margin: 3px 1rem 1.5rem 0; font-size: .7rem;} .dj-b {width:460px; margin: 0 auto; position: relative;} .dj-b .dj-b-c {width: 33.333%; float: left; text-align: center;} .gra .frmdj p {text-align: center;} .gra .frldj {background: url(../images/frldj.png);background-size:100% 100%; height: 36px; width: 10px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;background-size:100% 100%; height: 36px; float: left; line-height: 36px; font-size: .9rem; color: #d02a2a; font-weight: bold; padding: 0 1rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);background-size:100% 100% ; height: 36px; width: 10px;float: left; margin-right: 0.5rem;} .dj-b .dj-b-c .w1 {width: 80px;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .dj .dj-c-l { width: 85%; float: left; text-align: center;} .dj .dj-c-r { width: 100%; float: left; text-align: center;} .first-two .swiper-slide img {width: 90%;} .first-two .swiper-slide {font-size: .7rem;} .dj .djicon1 {position: absolute; right: 0; top: -60px;} .dj .djicon2 {position: absolute; left: 0; top: -170px;} .dj .djicon3 {position: absolute; right: 80px; top: -170px;} .dj .dj-c-r .dj-r-t { font-size: 1.1rem;line-height: 24px; margin-top: 1rem; font-weight: bold; color: #d02a2a; } .dj .dj-c-r .dj-r-c {margin: 0 0rem 0 1rem;} .dj .dj-c-r .dj-r-c p {text-align: left; line-height: 26px; font-size: .7rem; color: #d02a2a; text-indent: 2em;margin-top: 2px; font-weight: bold;} .dj .dj-c-r .dj-r-c p span {border-bottom: solid 1px #d02a2a; padding-bottom: 5px; } .dj .dj-c-r .dj-r-c .dj-r-c-b {text-align: right; font-weight: bold; color: #666; margin: 3px 1rem 1.5rem 0; font-size: .7rem;} .dj-b {width:380px; margin: 0 auto; position: relative;} .dj-b .dj-b-c {width: 33.333%; float: left; text-align: center;} .gra .frmdj p {text-align: center;} .gra .frldj {background: url(../images/frldj.png);background-size:100% 100%; height: 36px; width: 10px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;background-size:100% 100%; height: 36px; float: left; line-height: 36px; font-size: .9rem; color: #d02a2a; font-weight: bold; padding: 0 1rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);background-size:100% 100% ; height: 36px; width: 10px;float: left; margin-right: 0.5rem;} .dj-b .dj-b-c .w1 {width: 50px;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .dj .dj-c-l { width: 85%; float: left; text-align: center;} .dj .dj-c-r { width: 100%; float: left; text-align: center;} .first-two .swiper-slide img {width: 90%;} .first-two .swiper-slide {font-size: .7rem;} .dj .djicon1 {position: absolute; right: 0; top: -60px;} .dj .djicon2 {position: absolute; left: 0; top: -170px;} .dj .djicon3 {position: absolute; right: 80px; top: -170px;} .dj .dj-c-r .dj-r-t { font-size: 1.1rem;line-height: 24px; margin-top: .5rem; font-weight: bold; color: #d02a2a; } .dj .dj-c-r .dj-r-c {margin: 0 0rem 0 1rem;} .dj .dj-c-r .dj-r-c p {text-align: left; line-height: 26px; font-size: .7rem; color: #d02a2a; text-indent: 2em;margin-top: 2px; font-weight: bold;} .dj .dj-c-r .dj-r-c p span {border-bottom: solid 1px #d02a2a; padding-bottom: 2px; } .dj .dj-c-r .dj-r-c .dj-r-c-b {text-align: right; font-weight: bold; color: #666; margin: 3px 1rem .5rem 0; font-size: .7rem;} .dj-b {width:360px; margin: 0 auto; position: relative;} .dj-b .dj-b-c {width: 33.333%; float: left; text-align: center;} .gra .frmdj p {text-align: center;} .gra .frldj {background: url(../images/frldj.png);background-size:100% 100%; height: 36px; width: 10px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;background-size:100% 100%; height: 36px; float: left; line-height: 36px; font-size: .9rem; color: #d02a2a; font-weight: bold; padding: 0 .5rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);background-size:100% 100% ; height: 36px; width: 10px;float: left; margin-right: 0.5rem;} .dj-b .dj-b-c .w1 {width: 60px;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .dj .dj-c-l { width: 100%; float: left; text-align: center;} .dj .dj-c-r { width: 100%; float: left; text-align: center;} .first-two .swiper-slide img {width: 90%;} .first-two .swiper-slide {font-size: .7rem;} .dj .djicon1 {position: absolute; right: 0; top: -60px;} .dj .djicon2 {position: absolute; left: 0; top: -170px;} .dj .djicon3 {position: absolute; right: 80px; top: -170px;} .dj .dj-c-l .dl{width: 15%; float: left; text-align: left;} .dj .dj-c-l .dl img{width: 95%;} .dj .dj-c-l .dr{width: 80%; float: left;} .preview { display: none;} .dj .dj-c-r .dj-r-t { font-size: 1rem;line-height: 20px; margin-top: .5rem; font-weight: bold; color: #d02a2a; } .dj .dj-c-r .dj-r-c {margin: 0 .2rem;} .dj .dj-c-r .dj-r-c p {text-align: left; line-height: 20px; font-size:.7rem; color: #d02a2a; text-indent: 2em;margin-top: 2px; font-weight: bold;} .dj .dj-c-r .dj-r-c p span {border-bottom: solid 1px #d02a2a; padding-bottom: 1px; } .dj .dj-c-r .dj-r-c .dj-r-c-b {text-align: right; font-weight: bold; color: #666; margin: 3px 1rem .5rem 0; font-size: .7rem;} .dj-b {width:320px; margin: 0 auto; position: relative;} .dj-b .dj-b-c {width: 33.333%; float: left; text-align: center;} .gra .frmdj p {text-align: center;} .gra .frldj {background: url(../images/frldj.png);background-size:100% 100%; height: 36px; width: 10px; float: left; margin-left: 0.5rem; } .gra .frmdj {background: url(../images/frmdj.png) repeat-x;background-size:100% 100%; height: 36px; float: left; line-height: 36px; font-size: .9rem; color: #d02a2a; font-weight: bold; padding: 0 .2rem; text-align: center;} .gra .frrdj {background: url(../images/frrdj.png);background-size:100% 100% ; height: 36px; width: 10px;float: left; margin-right: 0.5rem;} .dj-b .dj-b-c .w1 {width: 60px;} } /* 集团介绍 */ .jj .c-cont .c-c-y .c-c-y1 {background: #fff; position: absolute; width: 60px; height: 60px;border: solid 8px #0d6a3a;border-radius:50%; top: 0px; right: 0; margin-top: -30px; margin-right: 20%;} .jj .c-cont .c-c-y .c-c-y2 {background: #fff; position: absolute; width: 40px; height: 40px;border: solid 8px #0d6a3a;border-radius:50%; top: 0; right: 0; margin-top: -20%; margin-right:-32px;} .jj .c-cont .c-c-y .c-c-y3 {background: #fff; position: absolute; width: 45px; height: 45px;border: solid 8px #0d6a3a;border-radius:50%; top: 0; right: 0; margin-top: -30px; margin-right:-75px;} .jj .c-cont .c-c-y .c-c-y4 {background: #fff; position: absolute; width: 10px; height: 10px;border: solid 4px #0d6a3a;border-radius:50%; top: 0; right: 0; margin-top: -14%; margin-right:-30px;} .jj .c-cont .c-c-y .c-c-y5 {background: #fff; position: absolute; width: 10px; height: 10px;border: solid 4px #0d6a3a;border-radius:50%; top: 0; right: 0; margin-top: 30px; margin-right:17%;} .jj .c-cont .c-c-y .c-c-y6 {background: #fff; position: absolute; width: 10px; height: 10px;border: solid 4px #0d6a3a;border-radius:50%; top: 0; right: 0; margin-top: 30px; margin-right:-30px;} @media only screen and (min-width: 981px) and (max-width: 1199px){ .jj .c-cont {margin: 4rem 5rem 0;} .jj .c-cont p {text-align: left; font-size: .8rem; line-height: 24px; letter-spacing: 1px; margin:2.5rem 2rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 768px) and (max-width: 980px){ .jj .c-cont {margin: 2rem 0rem 0;} .jj .c-cont p {text-align: left; font-size: .8rem; line-height: 24px; letter-spacing: 1px; margin:2.5rem 1rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 640px) and (max-width: 767px){ .jj .c-cont{ border: solid 6px #0d6a3a; margin: 4rem 1rem 0;background-color: #fff; } .jj .c-cont .c-c-t { font-weight: 500; border: solid 6px #0d6a3a; padding: 1rem 2rem; font-size: 1.2rem;margin:-2.5rem 0 0 0; line-height: 1.5rem; left: 22%;} .jj .c-cont p {text-align: left; font-size: .8rem; line-height: 22px; letter-spacing: 0px; margin:2.5rem 1rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 480px) and (max-width: 639px){ .jj .c-cont{ border: solid 4px #0d6a3a; margin: .5rem 1rem 0;background-color: #fff; } .jj .c-cont .c-c-t { font-weight: 500; border: solid 4px #0d6a3a; padding: .5rem 1rem; font-size: 1.2rem;margin:-2rem 0 0 0; line-height: 1.5rem; left: 15%;} .jj .c-cont p {text-align: left; font-size: .7rem; line-height: 20px; letter-spacing: 0px; margin:1.5rem 1rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 410px) and (max-width: 479px){ .jj .c-cont{ border: solid 4px #0d6a3a; margin: 1.5rem .5rem 0;background-color: #fff; } .jj .c-cont .c-c-t { font-weight: 500; border: solid 4px #0d6a3a; padding: .5rem .5rem; font-size: 1.2rem;margin:-2rem 0 0 0; line-height: 1.5rem; left: 10%;} .jj .c-cont p {text-align: left; font-size: .6rem; line-height:18px; letter-spacing: 0px; margin:1.5rem .5rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 380px) and (max-width: 409px){ .jj .c-cont{ border: solid 4px #0d6a3a; margin: 1rem .5rem 0;background-color: #fff; } .jj .c-cont .c-c-t { font-weight: 500; border: solid 4px #0d6a3a; padding: .5rem .5rem; font-size: 1.2rem;margin:-2rem 0 0 0; line-height: 1.5rem; left: 10%;} .jj .c-cont p {text-align: left; font-size: .6rem; line-height:18px; letter-spacing: 0px; margin:1.5rem .5rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 360px) and (max-width: 379px){ .jj .c-cont{ border: solid 4px #0d6a3a; margin: .5rem .5rem 0;background-color: #fff; } .jj .c-cont .c-c-t { font-weight: 500; border: solid 4px #0d6a3a; padding: .5rem .5rem; font-size: 1.2rem;margin:-2rem 0 0 0; line-height: 1.5rem; left: 8%;} .jj .c-cont p {text-align: left; font-size: .6rem; line-height:18px; letter-spacing: 0px; margin:1.5rem .5rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (min-width: 320px) and (max-width: 359px){ .jj .c-cont{ border: solid 4px #0d6a3a; margin: .5rem .5rem 0;background-color: #fff; } .jj .c-cont .c-c-t { font-weight: 500; border: solid 4px #0d6a3a; padding: .5rem .5rem; font-size: 1rem;margin:-2rem 0 0 0; line-height: 1.5rem; left: 9.5%;} .jj .c-cont p {text-align: left; font-size: .6rem; line-height:18px; letter-spacing: 0px; margin:1.5rem .5rem .5rem; text-indent: 2rem; position: relative; } } @media only screen and (max-width: 980px) { .jj .c-cont .c-c-y .c-c-y1 { margin-top: -30px; margin-right: 20%;} .jj .c-cont .c-c-y .c-c-y2 {margin-top: -5%; margin-right:262px;} .jj .c-cont .c-c-y .c-c-y3 {margin-top: -30px; margin-right:75px;} .jj .c-cont .c-c-y .c-c-y4 {margin-top: 5px; margin-right:230px;} .jj .c-cont .c-c-y .c-c-y5 {margin-top: 30px; margin-right:17%;} .jj .c-cont .c-c-y .c-c-y6 {margin-top: 30px; margin-right:30px;} } .zz .c-cont {text-align: center; } .zz .c-cont .tit {margin-bottom: 20px;} .zz .c-cont img {width: 100%;} @media only screen and (max-width: 980px){ .lx .c-cont .tit {margin-bottom: 10px;font-size: 18px;} .lx .c-cont .lx-c-l {width: 100%; float: left; margin: 0 auto; } .lx .c-cont .lx-c-l #map {width: 98%; height:300px;margin: 0 auto;} .lx .c-cont .lx-c-r {width:100%; float: left;margin: 0 auto;} .lx .c-cont .lx-c-r .c-r-xx {width: 98%;margin: 0 auto; margin-top: 1rem; } } @media only screen and (min-width: 769px) and (max-width: 980px){ .lx .c-cont .lx-c-l #map {width: 98%; height:250px;margin: 0 auto;} .lx .c-cont .lx-c-r .c-r-ly { margin-top: .5rem;} } @media only screen and (max-width: 768px){ .lx .c-cont .lx-c-l #map {width: 98%; height:250px;margin: 0 auto;} .lx .c-cont .lx-c-r p {line-height: 24px; font-size: .8rem; color: #0d6a3a;} .lx .c-cont .lx-c-r p span {font-size: 1rem; line-height: 30px;} .lx .c-cont .lx-c-r .c-r-ly { margin-top: .5rem;} } /* 战略布局 */ .zl .c-c-l { float: left;} .zl .c-cl p {padding: 0 1rem; font-size: 1rem; line-height: 26px;} .zl .c-cl p span {background: #0d6a3a; color: #fff; text-align: center; padding: 0 .5rem; margin-right: .5rem; border-radius: 4px;} .mar-t-1rem {margin-top: 1rem;} .mar-l-1rem {margin-left: 30px;} .mar-r-1rem {margin-left: -30px;} .mar-t-p100 {margin: 4rem 4rem 0 4rem;} .mar-t2-p100 {margin: 0rem 4rem 0 4rem;} .wb40 {width: 40%;} .wb41 {width: 41%;} .wb54 {width: 54%;} .wb57 {width: 57%;} .wb49 {width: 49%;} .wb50 {width: 50%;} .wb48 {width: 48%;} .wb47 {width: 47%; margin: 0 1%;} .wb46 {width: 46%; margin-right: 2%;} .zl .c-c-l img { width: 100%; margin: 1.5rem 0;} .zl .c-c-r img { width: 100%; margin: 0;} .zl .c-cl {background: #eee; border-radius: 8px; width: 100%; padding: .5rem 0 1rem;} .zl .c-cl .col {margin-top: 1.2rem; } .zl .c-c-r {float: right;} @media only screen and (min-width: 768px) and (max-width: 980px){ .wb41 {width: 55%;} .wb57 {width: 43%;} } @media only screen and (min-width: 640px) and (max-width: 767px){ .wb41 {width: 68%;} .wb57 {width: 30%;} .zl .c-cl {background: #eee; border-radius: 8px; width: 100%; padding: .5rem 0 1rem;} .zl .c-cl .col {margin-top: 1.2rem; } } /* 发展规划 */ .fz .fz-t {max-width: 800px; margin: 1rem auto; text-indent: 2em; font-size: 1rem; line-height: 26px;} .fz .fz-c {width: 100%; } .fz-c-m {width: 60px; background: #eee; margin: 2rem auto;border-radius: 8px; padding: 1rem 0; text-align: center;} .fz-c-m .cm-1 {width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 7px solid #0d6a3a;line-height: 46px; font-size: 1.5rem; font-weight: bold; color: #0d6a3a; position: relative;} .fz-c-m .cm-1 .cmicon {position: absolute; top: 0;background: #0d6a3a; height: 32px; width: 64px; line-height: 32px; margin:7px 0;} .fz-c-m .cm-1 .cmicon img {margin-top:5px ;} .cm-d1 {height: 8px; width: 8px; border-radius: 50%;background: #0d6a3a; margin: .5rem auto; } .fz-c-m .cm-1 .ic1 {left: -64px; border-radius: 8px 0 0 8px;} .fz-c-m .cm-1 .ic2 {right: -64px; border-radius: 0 8px 8px 0;} .ic-c1 {position: absolute; left: -540px; top: -20px; font-weight: initial;} .ic-c2 {position: absolute; left: -510px; top: -20px; font-weight: initial;} .ic-c3 {position: absolute; right: -510px; top: -100px; font-weight: initial;} .ic-c4 {position: absolute; right: -540px; top: -50px; font-weight: initial;} .cmicon p {font-size: 1rem; color: #333; width: 500px; line-height: 30px; text-align: left; text-indent: 2rem;} .cmicon p .col2{color: #0d6a3a;} .fz .fz-b {max-width: 900px; margin: 4rem auto 0; text-indent: 2rem; font-size: 1rem; line-height: 26px;} /* 养瑞梦 */ .yrm {} .c-cont {height: 100%;} .yrm .c-s {background: url(../images/yrm-s-bg.png);background-size:100% 100% ; height: 562px; position: relative;} .yrm .c-s .zgm {position: absolute; left: -80px; top: 50px; z-index: 100px;} .yrm .c-s .zgm2 {position: absolute; top: 0px; right: 0;} .yrm .c-s .zgm3 {position: absolute; top: 250px; right: 150px;} .yrm .c-s .zgm4 {position: absolute; top: 0; left: 0;} .yrm .zgm5 {display: none;} .yrm .c-s .y-t1 {width: 700px; margin: 0 auto;} .yrm .c-s .y-t2 {width: 580px; margin: 0 auto;} .yrm .c-s .y-t3 {width: 312px; margin: 0 auto; position: absolute; top: -120px; left: -105px;} .yrm .c-s .y-t4 {transition: all 1s ease-out; width: 100px; height: 100px; margin: 120px auto 0; border-radius: 50%; border: 1px solid #0d6a3a; position: relative;} .yrm .c-s .y-t5 {transition: all 1s ease-out; width: 80px; height: 80px; border-radius: 50%; border: 1px solid #0d6a3a; margin: 10px auto; text-align: center; color:#0d6a3a ; font-size: 1rem; font-weight: bold;} .yrm .c-s .y-t5 p {line-height:20px;padding-top:20px ;} .yrm .c-s .y-t4:hover{ background: #fff; box-shadow: 2px 5px 10px #999; border: 1px solid #eee;} .yrm .c-s .y-t4:hover .l-t1{box-shadow: 2px 5px 10px #999;background: url(../images/yrm-l-bg2.png); background-size:100%;} .yrm .c-s .y-t5:hover{background:radial-gradient(#035129,#0d6a3a,#228d56,#36a76d,#fff) ; color: #fff; border: 1px solid #fff;} .yrm .c-s .t1-t {transition: all 1s ease-out; height: 50px; width: 50px; border: 1px solid #0d6a3a; position: relative; color: #0d6a3a; font-size: 1.15rem; font-weight: bold; text-align: right; line-height: 25px; float: left;} .yrm .c-s .t1-k {transition: all 1s ease-out; height: 70px; width: 50px; border: 1px solid #0d6a3a; position: absolute; top: -10px; left: 10px;} .yrm .c-s .t1-t:hover {color:#fff ; background: #0d6a3a; text-align: center;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:10px 0 0 -10px; height: 50px;} .yrm .c-s .l-t1 {transition: all 1s ease-out; height:86px ; width:33px ; background: url(../images/yrm-l-bg.png); text-align: center; font-size: .95rem; color: #0d6a3a; font-weight: bold; float: left;} .mar-t-mct1 {margin: 150px 30px 0 30px;} .mar-t-mct2 {margin: 100px 30px 0 30px;} .mar-t-mct3 {margin: 50px 30px 0 30px;} .mar-t-mct4 {margin: 40px 30px 0; } .mar-t-mct5 {margin: -10px 30px 0;} .mar-t-mct6 {margin: -50px 30px 0;} .rot1 {transform:rotate(315deg); margin:60px 15px 0 15px ;} .rot2 {transform:rotate(340deg); margin:15px 30px 0 30px ;} .rot3 {transform:rotate(20deg); margin:15px 30px 0 30px ;} .rot4 {transform:rotate(45deg); margin:60px 15px 0 15px ;} @media only screen and (min-width: 1701px) and (max-width: 2800px){ .cont {max-width: 1500px;} .c-cont {max-width: 1280px;} .yrm .c-s {height: 700px;} .yrm .c-s .zgm2 {position: absolute; top: 0px; right: -50px;} .yrm .c-s .zgm {position: absolute; left: -180px; top: 50px; z-index: 100px;} .yrm .c-s .t1-t {height: 60px; width: 60px;line-height: 30px; font-size: 1.5rem;} .yrm .c-s .t1-k {height: 80px; width: 60px; border: 1px solid #0d6a3a; position: absolute; top: -10px; left: 10px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:10px 0 0 -10px; height: 60px;} .yrm .c-s .y-t1 {width: 800px; margin: 0 auto;} .yrm .c-s .y-t2 {width: 620px; margin: 0 auto;} .yrm .c-s .y-t3 {width: 500px; margin: 0 auto; top: -60px; left: -95px;} .yrm .c-s .y-t4 {width: 120px; height: 120px; margin: 160px auto 0; } .yrm .c-s .y-t5 {width: 100px; height: 100px; text-align: center; line-height: 35px; font-size: 1.5rem;} .yrm .c-s .y-t5 p {line-height:35px;padding-top:10px ;} .yrm .c-s .l-t1 {height:105px ; width:40px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 25px; font-size: 1rem; } .mar-t-mct1 {margin: 180px 30px 0;} .mar-t-mct2 {margin: 100px 30px 0;} .mar-t-mct3 {margin: 60px 40px 0;} .mar-t-mct4 {margin: 40px 30px 0;} .mar-t-mct5 {margin: -20px 30px 0;} .mar-t-mct6 {margin: -50px 30px 10px;} .rot1 {transform:rotate(320deg); margin:-20px 20px 0;} .rot2 {transform:rotate(350deg); margin:-60px 20px 0 ;} .rot3 {transform:rotate(10deg); margin:-60px 20px 0;} .rot4 {transform:rotate(40deg); margin:-20px 20px 0;} } @media only screen and (min-width: 1501px) and (max-width: 1700px){ .cont {max-width: 1440px;} .c-cont {max-width: 1000px;} .yrm .c-s {height: 620px;} .yrm .c-s .zgm2 {position: absolute; top: 0px; right: -50px;} .yrm .c-s .zgm {position: absolute; left: -180px; top: 50px; z-index: 100px;} .yrm .c-s .t1-t {height: 60px; width: 60px;line-height: 30px; font-size: 1.5rem;} .yrm .c-s .t1-k {height: 80px; width: 60px; border: 1px solid #0d6a3a; position: absolute; top: -10px; left: 10px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:10px 0 0 -10px; height: 60px;} .yrm .c-s .y-t1 {width: 800px; margin: 0 auto;} .yrm .c-s .y-t2 {width: 620px; margin: 0 auto;} .yrm .c-s .y-t3 {width: 500px; margin: 0 auto; top: -60px; left: -95px;} .yrm .c-s .y-t4 {width: 120px; height: 120px; margin: 100px auto 0; } .yrm .c-s .y-t5 {width: 100px; height: 100px; text-align: center; line-height: 35px; font-size: 1.5rem;} .yrm .c-s .y-t5 p {line-height:35px;padding-top:10px ;} .yrm .c-s .l-t1 {height:105px ; width:40px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 25px; font-size: 1rem; } .mar-t-mct1 {margin: 190px 30px 0;} .mar-t-mct2 {margin: 100px 30px 0;} .mar-t-mct3 {margin: 60px 40px 0;} .mar-t-mct4 {margin: 40px 30px 0;} .mar-t-mct5 {margin: -40px 30px 0;} .mar-t-mct6 {margin: -70px 30px 10px;} .rot1 {transform:rotate(320deg); margin:-20px 20px 0;} .rot2 {transform:rotate(350deg); margin:-60px 20px 0 ;} .rot3 {transform:rotate(10deg); margin:-60px 20px 0;} .rot4 {transform:rotate(40deg); margin:-20px 20px 0;} } @media only screen and (min-width: 1201px) and (max-width: 1500px){ .cont {max-width: 1150px;} .c-cont {max-width: 900px;} .yrm .c-s {height: 550px;} .yrm .c-s .zgm2 {position: absolute; top: 0px; right: 0; width: 130px;} .yrm .c-s .zgm {position: absolute; left: -100px; top: 50px; z-index: 100px;width: 150px;} .yrm .c-s .zgm3 {position: absolute; top: 240px; right: 100px;} } @media only screen and (min-width: 1101px) and (max-width: 1199px){ .yrm .c-s {width: 980px; margin: 0 auto;} .yrm .c-s .zgm {position: absolute; left: -60px; top: 60px; z-index: 100px; width: 120px;} } @media only screen and (min-width: 981px) and (max-width: 1100px){ .yrm .c-s {width: 880px; margin: 0 auto;} .yrm .c-s .zgm {position: absolute; left: -60px; top: 60px; z-index: 100px; width: 120px;} } @media only screen and (min-width: 768px) and (max-width: 980px){ .yrm .c-s {width: 680px; margin: 0 auto; height: 380px;} .yrm .c-s .zgm {position: absolute; left: -45px; top: 60px; z-index: 100px; width: 80px;} .yrm .c-s .zgm2 {position: absolute; top: 0px; right: 50px; width: 100px;} .yrm .c-s .zgm3 {position: absolute; top: 300px; right: 100px;} .yrm .c-s .zgm4 {position: absolute; top: 0; left: 0;} .yrm .c-s .t1-t {height: 40px; width: 40px;line-height: 20px; font-size: .90rem;} .yrm .c-s .t1-k {height: 60px; width: 40px; border: 1px solid #0d6a3a; position: absolute; top: -10px; left: 10px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:10px 0 0 -10px; height: 40px;} .yrm .c-s .y-t1 {width: 560px; margin: 0 auto;} .yrm .c-s .y-t2 {width: 460px; margin: 0 auto;} .yrm .c-s .y-t3 {width: 215px; margin: 0 auto; top: -60px; left: -65px;} .yrm .c-s .y-t4 {width: 80px; height: 80px; margin: 60px auto 0; } .yrm .c-s .y-t5 {width: 60px; height: 60px; text-align: center; line-height: 20px; font-size: .9rem;} .yrm .c-s .y-t5 p {line-height:20px;padding-top:10px ;} .mar-t-mct1 {margin: 120px 20px 0 20px;} .mar-t-mct2 {margin: 70px 20px 0 20px;} .mar-t-mct3 {margin: 40px 30px 0 30px;} .mar-t-mct4 {margin: 20px 22px 0;} .mar-t-mct5 {margin: -35px 22px 0;} .mar-t-mct6 {margin: -50px 22px 10px;} .rot1 {transform:rotate(320deg); margin:-5px 10px 0 10px ;} .rot2 {transform:rotate(350deg); margin:-35px 10px 0 10px ;} .rot3 {transform:rotate(10deg); margin:-35px 10px 0 10px ;} .rot4 {transform:rotate(40deg); margin:-5px 10px 0 10px ;} } @media only screen and (min-width: 640px) and (max-width: 767px){ .yrm .c-s {width: 560px; margin: 0 auto; height: 320px;} .yrm .c-s .zgm {position: absolute; left: -40px; top: 50px; z-index: 100px; width: 60px;} .yrm .c-s .zgm2 {position: absolute; top: 0px; right: 30px; width: 90px;} .yrm .c-s .zgm3 {position: absolute; top: 300px; right: 100px; width: 50px;} .yrm .c-s .zgm4 {position: absolute; top: 0; left: 0; width: 50px;} .yrm .c-s .t1-t {height: 30px; width: 30px;line-height: 15px; font-size: .7rem;} .yrm .c-s .t1-k {height: 40px; width: 30px; border: 1px solid #0d6a3a; position: absolute; top: -5px; left: 5px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:5px 0 0 -5px; height: 30px;} .yrm .c-s .y-t1 {width: 420px; margin: 0 auto;} .yrm .c-s .y-t2 {width: 320px; margin: 0 auto;} .yrm .c-s .y-t3 {width: 176px; margin: 0 auto; top: -40px; left: -54px;} .yrm .c-s .y-t4 {width: 70px; height: 70px; margin: 40px auto 0; } .yrm .c-s .y-t5 {width: 50px; height: 50px; text-align: center; line-height: 16px; font-size: .7rem;} .yrm .c-s .y-t5 p {line-height:20px;padding-top:5px ;} .mar-t-mct1 {margin: 90px 20px 0 20px;} .mar-t-mct2 {margin: 50px 15px 20px 15px;} .mar-t-mct3 {margin: 30px 20px 20px 20px;} .mar-t-mct4 {margin: 30px 10px 0;} .mar-t-mct5 {margin: -10px 20px 20px;} .mar-t-mct6 {margin: -30px 15px 20px;} .yrm .c-s .l-t1 {height:63px ; width:24px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 15.5px; text-align: center; font-size: .7rem; color: #0d6a3a; font-weight: bold; float: left;} .rot1 {transform:rotate(320deg); margin:-0px 10px 0 10px ;} .rot2 {transform:rotate(350deg); margin:-25px 10px 0 10px ;} .rot3 {transform:rotate(10deg); margin:-25px 10px 0 10px ;} .rot4 {transform:rotate(40deg); margin:-0px 10px 0 10px ;} } @media only screen and (min-width: 480px) and (max-width: 639px){ .yrm .c-s {background:none; position: relative;width: initial; margin: 0 auto; height: initial;} .yrm .c-s .zgm {display: none;} .yrm .c-s .zgm2 {position: absolute; top: -200px; right: 40px; width: 90px;} .yrm .c-s .zgm3 {position: absolute; top: 350px; right: 100px; width: 50px;} .yrm .c-s .zgm4 {position: absolute; top: -150px; left: 10px; width: 50px;} .yrm .zgm5 { width: 100px; display: block; margin: 0 auto;} .yrm .c-s .t1-t {height: 40px; width: 40px;line-height: 20px; font-size: .9rem; position: relative;} .yrm .c-s .t1-k {height: 60px; width: 40px; border: 1px solid #0d6a3a; position: absolute; top: -10px; left: 10px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:10px 0 0 -10px; height: 40px;} .yrm .c-s .y-t1 {width: 440px; margin:20px auto; clear: both;} .yrm .c-s .y-t2 {width: 440px; margin:20px auto; clear: both;} .yrm .c-s .y-t3 {width: 320px; margin: 0 auto; top: -90px; left: -110px;} .yrm .c-s .y-t4 {width: 100px; height: 100px; margin: 160px auto 0; } .yrm .c-s .y-t5 {width: 80px; height: 80px; text-align: center; font-size: 1.2rem;} .yrm .c-s .y-t5 p {line-height:28px;padding-top:10px;} .mar-t-mct1 {margin:0 15px 40px;} .mar-t-mct2 {margin:0 15px 40px;} .mar-t-mct3 {margin:0 15px 40px;} .mar-t-mct4 {margin:0 20px 20px;} .mar-t-mct5 {margin:0 20px 20px;} .mar-t-mct6 {margin:0 20px 20px;} .yrm .c-s .l-t1 {height:104px ; width:40px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 25px; text-align: center; font-size: 1rem; color: #0d6a3a; font-weight: bold; float: left;} .rot1 {transform:rotate(320deg); margin:-0px 20px 0 20px ;} .rot2 {transform:rotate(350deg); margin:-35px 20px 0 20px ;} .rot3 {transform:rotate(10deg); margin:-35px 20px 0 20px ;} .rot4 {transform:rotate(40deg); margin:-0px 20px 0 20px ;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .yrm .c-s {background:none; position: relative;width: initial; margin: 0 auto; height: initial;} .yrm .c-s .zgm {display: none;} .yrm .c-s .zgm2 {position: absolute; top: -200px; right: 40px; width: 90px;} .yrm .c-s .zgm3 {position: absolute; top: 350px; right: 100px; width: 50px;} .yrm .c-s .zgm4 {position: absolute; top: -150px; left: 10px; width: 50px;} .yrm .zgm5 { width: 100px; display: block; margin: 0 auto;} .yrm .c-s .t1-t {height: 30px; width: 30px;line-height: 15px; font-size: .7rem; position: relative;} .yrm .c-s .t1-k {height: 40px; width: 30px; border: 1px solid #0d6a3a; position: absolute; top: -5px; left: 5px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:5px 0 0 -5px; height: 30px;} .yrm .c-s .y-t1 {width: 380px; margin:20px auto; clear: both;} .yrm .c-s .y-t2 {width: 380px; margin:20px auto; clear: both;} .yrm .c-s .y-t3 {width: 320px; margin: 0 auto; top: -60px; left: -88px;} .yrm .c-s .y-t4 {width: 90px; height: 90px; margin: 140px auto 0; } .yrm .c-s .y-t5 {width: 70px; height: 70px; text-align: center; font-size: 1rem;} .yrm .c-s .y-t5 p {line-height:24px;padding-top:10px;} .mar-t-mct1 {margin:0 15px 40px;} .mar-t-mct2 {margin:0 15px 40px;} .mar-t-mct3 {margin:0 15px 40px;} .mar-t-mct4 {margin:0 20px 20px;} .mar-t-mct5 {margin:0 20px 20px;} .mar-t-mct6 {margin:0 20px 20px;} .yrm .c-s .l-t1 {height:67px ; width:26px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 17px; text-align: center; font-size: .7rem; color: #0d6a3a; font-weight: bold; float: left;} .rot1 {transform:rotate(320deg); margin:-0px 20px 0 20px ;} .rot2 {transform:rotate(350deg); margin:-35px 20px 0 20px ;} .rot3 {transform:rotate(10deg); margin:-35px 20px 0 20px ;} .rot4 {transform:rotate(40deg); margin:-0px 20px 0 20px ;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .yrm .c-s {background:none; position: relative;width: initial; margin: 0 auto; height: initial;} .yrm .c-s .zgm {display: none;} .yrm .c-s .zgm2 {position: absolute; top: -200px; right: 40px; width: 90px;} .yrm .c-s .zgm3 {position: absolute; top: 350px; right: 100px; width: 50px;} .yrm .c-s .zgm4 {position: absolute; top: -150px; left: 10px; width: 50px;} .yrm .zgm5 { width: 100px; display: block; margin: 0 auto;} .yrm .c-s .t1-t {height: 30px; width: 30px;line-height: 15px; font-size: .7rem; position: relative;} .yrm .c-s .t1-k {height: 40px; width: 30px; border: 1px solid #0d6a3a; position: absolute; top: -5px; left: 5px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:5px 0 0 -5px; height: 30px;} .yrm .c-s .y-t1 {width: 320px; margin:20px auto; clear: both;} .yrm .c-s .y-t2 {width: 320px; margin:20px auto; clear: both;} .yrm .c-s .y-t3 {width: 320px; margin: 0 auto; top: -50px; left: -88px;} .yrm .c-s .y-t4 {width: 90px; height: 90px; margin: 100px auto 0; } .yrm .c-s .y-t5 {width: 70px; height: 70px; text-align: center; font-size: 1rem;} .yrm .c-s .y-t5 p {line-height:24px;padding-top:10px;} .mar-t-mct1 {margin:0 10px 40px;} .mar-t-mct2 {margin:0 10px 40px;} .mar-t-mct3 {margin:0 10px 40px;} .mar-t-mct4 {margin:0 15px 20px;} .mar-t-mct5 {margin:0 15px 20px;} .mar-t-mct6 {margin:0 15px 20px;} .yrm .c-s .l-t1 {height:67px ; width:26px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 17px; text-align: center; font-size: .7rem; color: #0d6a3a; font-weight: bold; float: left;} .rot1 {transform:rotate(320deg); margin:-0px 20px 0 20px ;} .rot2 {transform:rotate(350deg); margin:-35px 20px 0 20px ;} .rot3 {transform:rotate(10deg); margin:-35px 20px 0 20px ;} .rot4 {transform:rotate(40deg); margin:-0px 20px 0 20px ;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .yrm .c-s {background:none; position: relative;width: initial; margin: 0 auto; height: initial;} .yrm .c-s .zgm {display: none;} .yrm .c-s .zgm2 {position: absolute; top: -200px; right: 40px; width: 90px;} .yrm .c-s .zgm3 {position: absolute; top: 350px; right: 100px; width: 50px;} .yrm .c-s .zgm4 {position: absolute; top: -150px; left: 10px; width: 50px;} .yrm .zgm5 { width: 60px; display: block; margin: 0 auto;} .yrm .c-s .t1-t {height: 30px; width: 30px;line-height: 15px; font-size: .7rem; position: relative;} .yrm .c-s .t1-k {height: 40px; width: 30px; border: 1px solid #0d6a3a; position: absolute; top: -5px; left: 5px;} .yrm .c-s .t1-k:hover {animation: tk 3s infinite; margin:5px 0 0 -5px; height: 30px;} .yrm .c-s .y-t1 {width: 380px; margin:20px auto; clear: both;} .yrm .c-s .y-t2 {width: 380px; margin:20px auto; clear: both;} .yrm .c-s .y-t3 {width: 320px; margin: 0 auto; top: -40px; left: -88px;} .yrm .c-s .y-t4 {width: 90px; height: 90px; margin: 85px auto 0; } .yrm .c-s .y-t5 {width: 70px; height: 70px; text-align: center; font-size: 1rem;} .yrm .c-s .y-t5 p {line-height:24px;padding-top:10px;} .mar-t-mct1 {margin:0 10px 20px;} .mar-t-mct2 {margin:0 10px 20px;} .mar-t-mct3 {margin:0 10px 20px;} .mar-t-mct4 {margin:0 15px 10px;} .mar-t-mct5 {margin:0 15px 10px;} .mar-t-mct6 {margin:0 15px 10px;} .yrm .c-s .l-t1 {height:67px ; width:26px ; background: url(../images/yrm-l-bg.png) ;background-size:100%; line-height: 17px; text-align: center; font-size: .7rem; color: #0d6a3a; font-weight: bold; float: left;} .rot1 {transform:rotate(320deg); margin:-0px 20px 0 20px ;} .rot2 {transform:rotate(350deg); margin:-35px 20px 0 20px ;} .rot3 {transform:rotate(10deg); margin:-35px 20px 0 20px ;} .rot4 {transform:rotate(40deg); margin:-0px 20px 0 20px ;} } /* 技术成果 */ @media only screen and (max-width: 768px){ .cg .c-li {width: 33.333%; float: left;} .cg .c-li .c-li-c { background: #fff; margin:.1rem .2rem 1rem; padding: 4px;border-radius: 6px; box-shadow: 2px 5px 10px #999;} .cg .c-li .c-li-c:hover {box-shadow: 2px 5px 10px #666; margin:.1rem .2rem 1rem; } .cg .c-li .c-li-c p {line-height: 1.4rem; font-size: .8rem; color:#0d6a3a; font-weight: bold;} } @media only screen and (max-width: 360px){ .cg .c-li .c-li-c p {line-height: 1.4rem; font-size: .7rem; color:#0d6a3a; font-weight: bold;} } @media only screen and (min-width: 640px) and (max-width: 767px){ .cg p{margin:0rem 1rem; line-height: 24px; font-size: .7rem;} .cg .c-cb .cb-c{float: left; width: 25%; text-align: center; margin-top: 1rem;} .cg .c-cb .cb-c .k {margin: .5rem; transition: all .3s ease; border-radius: 6px;} } @media only screen and (min-width: 480px) and (max-width: 639px){ .cg p{margin:0rem 1rem; line-height: 20px; font-size: .7rem;} .cg .c-cb .cb-c{float: left; width: 25%; text-align: center; margin-top: 1rem;} .cg .c-cb .cb-c .k {margin: .5rem; transition: all .3s ease; border-radius: 6px;} .colt {color: #0d6a3a; padding-top: .5rem;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .cg p{margin:0rem .5rem; line-height: .9rem; font-size: .7rem;} .cg .c-cb .cb-c{float: left; width: 25%; text-align: center; margin-top: .1rem;} .cg .c-cb .cb-c .k {margin: .5rem; transition: all .3s ease; border-radius: 6px;} .colt {color: #0d6a3a; padding-top: .5rem;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .cg p{margin:0rem .5rem; line-height: .9rem; font-size: .7rem;} .cg .c-cb .cb-c{float: left; width: 25%; text-align: center; margin-top: .1rem;} .cg .c-cb .cb-c .k {margin: .5rem; transition: all .3s ease; border-radius: 6px;} .colt {color: #0d6a3a; padding-top: .5rem;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .cg p{margin:0rem .5rem; line-height: .9rem; font-size: .7rem;} .cg .c-cb .cb-c{float: left; width: 25%; text-align: center; margin-top: .1rem;} .cg .c-cb .cb-c .k {margin: .5rem; transition: all .3s ease; border-radius: 6px;} .colt {color: #0d6a3a; padding-top: .5rem;} } /* 第二页 */ .cg .c-ct2 .c-cl { width: 48%; float: left; margin-right: 2%;} .cg .c-ct2 .c-cr { width: 48%; float: right; margin-left: 2%;} .cg .c-ct2 .cl-t {border-radius: 6px; background: #eee; width: 100%;} .cg .g img {width: 100%; border-radius: 6px;transition: all 1s ease-out;} .cg .jst1 {margin-top: 4%;} .cg .jst2 {margin-bottom: 4%;} .cg .g {margin: 0; transition: all .3s ease; border-radius: 6px; overflow: hidden; font-size: 0;} .cg .g:hover {transition: all .3s ease; font-size: 0;} .cg .g:hover img { transform:scale(1.1);transition: all 1s ease;} /* 古茶树 */ @media only screen and (min-width: 480px) and (max-width: 639px){ .cg .gc .c-cl { width: 98%; float: left; margin-right: 2%;} .cg .gc .c-cr { display: none;} .cg .gc .c-cl .c {width: 34.25%; float: left; margin:0 1%; } .cg .gc .c-cl .cb {width: 24.5%; float: left; margin:0 1%; display: block;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .cg .gc .c-cl { width: 98%; float: left; margin-right: 2%;} .cg .gc .c-cr { display: none;} .cg .gc .c-cl .c {width: 34.25%; float: left; margin:0 1%; } .cg .gc .c-cl .cb {width: 24.5%; float: left; margin:0 1%; display: block;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .cg .gc .c-cl { width: 98%; float: left; margin-right: 2%;} .cg .gc .c-cr { display: none;} .cg .gc .c-cl .c {width: 34.25%; float: left; margin:0 1%; } .cg .gc .c-cl .cb {width: 24.5%; float: left; margin:0 1%; display: block;} .cg .gc .c-cl .cl-t p{margin:0rem 1rem; line-height: 20px; font-size: .7rem; padding-top: .5rem; text-indent: 2em;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .cg .gc .c-cl { width: 98%; float: left; margin-right: 2%;} .cg .gc .c-cr { display: none;} .cg .gc .c-cl .c {width: 34.25%; float: left; margin:0 1%; } .cg .gc .c-cl .cb {width: 24.5%; float: left; margin:0 1%; display: block;} .cg .gc .c-cl .cl-t p{margin:0rem .5rem; line-height: 1rem; font-size: .7rem; padding-top: .2rem; text-indent: 2em;} } /* 绿茶 */ @media only screen and (min-width: 480px) and (max-width: 639px){ .cg .lc .c-cl { width: 100%; float: left; margin-right: 0%; display: none;} .cg .lc .c-cr { width: 100%; float: right; margin:0; font-size: 0;} .cg .lc .c-cr .c1 {width: 40.6%; float: left; margin-left: .5%; } .cg .lc .c-cr .c2 {width: 26.3%; float: left; margin-left: .5%; } .cg .lc .c-cr .c3 {width: 30.1%; float: left; margin-left: .5%; display: block;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .cg .lc .c-cl { width: 100%; float: left; margin-right: 0%; display: none;} .cg .lc .c-cr { width: 100%; float: right; margin:0; font-size: 0;} .cg .lc .c-cr .c1 {width: 40.6%; float: left; margin-left: .5%; } .cg .lc .c-cr .c2 {width: 26.3%; float: left; margin-left: .5%; } .cg .lc .c-cr .c3 {width: 30.1%; float: left; margin-left: .5%; display: block;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .cg .lc .c-cl { width: 100%; float: left; margin-right: 0%; display: none;} .cg .lc .c-cr { width: 100%; float: right; margin:0; font-size: 0;} .cg .lc .c-cr .c1 {width: 40.6%; float: left; margin-left: .5%; } .cg .lc .c-cr .c2 {width: 26.3%; float: left; margin-left: .5%; } .cg .lc .c-cr .c3 {width: 30.1%; float: left; margin-left: .5%; display: block;} .cg .lc .c-cr .cl-t p{margin:0rem 1rem; line-height: 20px; font-size: .7rem; padding-top: .2rem; text-indent: 2em;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .cg .lc .c-cl { width: 100%; float: left; margin-right: 0%; display: none;} .cg .lc .c-cr { width: 100%; float: right; margin:0; font-size: 0;} .cg .lc .c-cr .c1 {width: 40.6%; float: left; margin-left: .5%; } .cg .lc .c-cr .c2 {width: 26.3%; float: left; margin-left: .5%; } .cg .lc .c-cr .c3 {width: 30.1%; float: left; margin-left: .5%; display: block;} .cg .lc .c-cr .cl-t p{margin:0rem 1rem; line-height: 20px; font-size: .7rem; padding-top: .2rem; text-indent: 2em;} } /* 生态示范基地 */ @media only screen and (min-width: 640px) and (max-width: 1045px){ .cbr1 {display: block;} .cbr2 {display: none;} } @media only screen and (min-width: 480px) and (max-width: 639px){ .cbr1 {display: none;} .cbr2 {display: none;} .cg .st .c-cl { width: 99%; float: left; margin-right: 0%;} .cg .st .c-cl .c1 { display: none;} .cg .st .c-cl .c2 { display: none;} .cg .st .c-cr { width: 99%; float: right; margin-left: 0%;} .cg .st .c-cr .c3 { width: 24%; float: left; margin: .5rem 0 0 .5%; display: block;} .cg .st .c-cr .c4 { width: 24%; float: left; margin: .5rem 0 0 1%; display: block;} .cg .st .c-cr .c1 { width: 24%; float: left; margin: .5rem 0 0 1%;} .cg .st .c-cr .c2 { width: 24%; float: left; margin: .5rem .5% 0 .5%;} } @media only screen and (min-width: 410px) and (max-width: 439px){ .cbr1 {display: none;} .cbr2 {display: none;} .cg .st .c-cl { width: 99%; float: left; margin-right: 0%;} .cg .st .c-cl .c1 { display: none;} .cg .st .c-cl .c2 { display: none;} .cg .st .c-cr { width: 99%; float: right; margin-left: 0%;} .cg .st .c-cr .c3 { width: 24%; float: left; margin: .5rem 0 0 .5%; display: block;} .cg .st .c-cr .c4 { width: 24%; float: left; margin: .5rem 0 0 1%; display: block;} .cg .st .c-cr .c1 { width: 24%; float: left; margin: .5rem 0 0 1%;} .cg .st .c-cr .c2 { width: 24%; float: left; margin: .5rem .5% 0 .5%;} .cg .st .cl-t p {margin:0rem 1rem; line-height: 20px; font-size: .7rem; padding-top: .4rem; text-indent: 2em; } } @media only screen and (min-width: 360px) and (max-width: 409px){ .cbr1 {display: none;} .cbr2 {display: none;} .cg .st .c-cl { width: 99%; float: left; margin-right: 0%;} .cg .st .c-cl .c1 { display: none;} .cg .st .c-cl .c2 { display: none;} .cg .st .c-cr { width: 99%; float: right; margin-left: 0%;} .cg .st .c-cr .c3 { width: 24%; float: left; margin: .2rem 0 0 .5%; display: block;} .cg .st .c-cr .c4 { width: 24%; float: left; margin: .2rem 0 0 1%; display: block;} .cg .st .c-cr .c1 { width: 24%; float: left; margin: .2rem 0 0 1%;} .cg .st .c-cr .c2 { width: 24%; float: left; margin: .2rem .5% 0 .5%;} .cg .st .cl-t {border-radius: 6px; background: #eee; margin-bottom: 5px; padding-bottom: 5px;} .cg .st .cl-t p {margin:0rem 1rem; line-height: 18px; font-size: .7rem; padding-top: .1rem; text-indent: 2em; } } @media only screen and (min-width: 320px) and (max-width: 359px){ .cbr1 {display: none;} .cbr2 {display: none;} .cg .st .c-cl { width: 99%; float: left; margin-right: 0%;} .cg .st .c-cl .c1 { display: none;} .cg .st .c-cl .c2 { display: none;} .cg .st .c-cr { width: 99%; float: right; margin-left: 0%;} .cg .st .c-cr .c3 { width: 24%; float: left; margin: .2rem 0 0 .5%; display: block;} .cg .st .c-cr .c4 { width: 24%; float: left; margin: .2rem 0 0 1%; display: block;} .cg .st .c-cr .c1 { width: 24%; float: left; margin: .2rem 0 0 1%;} .cg .st .c-cr .c2 { width: 24%; float: left; margin: .2rem .5% 0 .5%;} .cg .st .cl-t {border-radius: 6px; background: #eee; margin-bottom: 5px; padding-bottom: 5px;} .cg .st .cl-t p {margin:0rem 1rem; line-height: 18px; font-size: .7rem; padding-top: .1rem; text-indent: 2em; } } /* 石斛 */ @media only screen and (min-width: 320px) and (max-width: 980px){ .cg .sh .c-c2 .tw {display: none;} .cg .sh .c-c2 .t {display: block;} } /* 现代肉牛产业基地 */ @media only screen and (min-width: 480px) and (max-width: 639px){ .cg .rn .c-cl { width: 60%; float: left; margin-right: 1%;} .cg .rn .cl-t {border-radius: 6px; background: #eee; } .cg .rn .cl-t p {margin:0 .5rem; line-height: 20px; font-size: .7rem; text-indent: 1.7rem; padding: 1rem 0;} .cg .rn .c-cr { width: 38%; float: right; margin-left: 1%;} .cg .rn .mb {margin-bottom: 1rem;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .cg .rn .c-cl { width: 100%; float: left; margin-right: 0;} .cg .rn .cl-b {display: none;} .cg .rn .cl-cb{ display: block; width: 57.123%; float: left; margin:0 .5% 0 .5%;} .cg .rn .cl-cb2 { display: block; width: 40.877%; float: left; margin:0 .5% 0 .5%;} .cg .rn .cl-t {border-radius: 6px; background: #eee; } .cg .rn .cl-t p {margin:0 .5rem; line-height: 20px; font-size: .7rem; text-indent: 1.7rem; padding: 1rem 0;} .cg .rn .c-cr { width: 100%; float: right; margin-left: 0%;} .cg .rn .mb {margin-bottom: 1rem;} } @media only screen and (min-width: 320px) and (max-width: 409px){ .cg .rn .c-cl { width: 100%; float: left; margin-right: 0;} .cg .rn .cl-b {display: none;} .cg .rn .cl-cb{ display: block; width: 57.123%; float: left; margin:0 .5% 0 .5%;} .cg .rn .cl-cb2 { display: block; width: 40.877%; float: left; margin:0 .5% 0 .5%;} .cg .rn .cl-t {border-radius: 6px; background: #eee; } .cg .rn .cl-t p {margin:0 .5rem; line-height: 1rem; font-size: .7rem; text-indent: 1.7rem; padding: .5rem 0;} .cg .rn .c-cr { width: 100%; float: right; margin-left: 0%;} .cg .rn .mb {margin-bottom: .5rem;} } /* 皂角米基地简介 */ @media only screen and (min-width: 480px) and (max-width: 639px){ .cg .jz .cl-t p {margin:.5rem .2rem; line-height: 1.2rem; font-size: .8rem; text-indent: 2em; padding:0;} } @media only screen and (min-width: 410px) and (max-width: 479px){ .cg .jz .cl-t p {margin:.5rem .2rem; line-height: 1.2rem; font-size: .8rem; text-indent: 2em; padding:0;} .cg .jz .c-cl { width: 100%; float: left; margin-right: 0%;} .cg .jz .c-cl .cl-b {width: 48%; float: left;margin:0 1%;} .cg .jz .c-cr .cl-b {width: 98%; float: left;margin:0 1%;} .cg .jz .c-cr { width: 100%; float: left; margin-left: 0%;} .cg .jz .mb {margin-bottom: .5rem;} .cg .jz .cl-t {border-radius: 6px; background: #eee; padding: .5rem 1rem;} } @media only screen and (min-width: 360px) and (max-width: 409px){ .cg .jz .cl-t p {margin:.5rem .2rem; line-height: 1.2rem; font-size: .8rem; text-indent: 2em; padding:0;} .cg .jz .c-cl { width: 100%; float: left; margin-right: 0%;} .cg .jz .c-cl .cl-b {width: 48%; float: left;margin:0 1%;} .cg .jz .c-cr .cl-b {width: 98%; float: left;margin:0 1%; height: 140px; overflow: hidden; border-radius: 6px;} .cg .jz .c-cr { width: 100%; float: left; margin-left: 0%;} .cg .jz .mb {margin-bottom: .5rem;} .cg .jz .cl-t {border-radius: 6px; background: #eee; padding: .5rem 1rem;} } @media only screen and (min-width: 320px) and (max-width: 359px){ .cg .jz .cl-t p {margin:.5rem .2rem; line-height: 1.2rem; font-size: .8rem; text-indent: 2em; padding:0;} .cg .jz .c-cl { width: 100%; float: left; margin-right: 0%;} .cg .jz .c-cl .cl-b {width: 48%; float: left;margin:0 1%;} .cg .jz .c-cr .cl-b {width: 98%; float: left;margin:0 1%; height: 140px; overflow: hidden; border-radius: 6px;} .cg .jz .c-cr { width: 100%; float: left; margin-left: 0%;} .cg .jz .mb {margin-bottom: .5rem;} .cg .jz .cl-t {border-radius: 6px; background: #eee; padding: .5rem 1rem;} } /* 发展规划 */ @media only screen and (min-width: 480px) and (max-width: 639px){ .cg .gh .gh-l {width: 100%; float: left; margin-right: 0%;} .cg .gh .gh-r {width: 100%; float: right; margin-right: 0%;} .gh .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 5px auto;} .gh .gh-t p {margin:.2rem 1rem; line-height: 18px; font-size: .8rem; text-indent: 2em; padding:0;} .gh .gh-img .l {width: 24%; margin-right: 1%; float: left;} .gh .gh-img .r {width: 24%; margin-left: 1%; float: right;} .gh .gh-bk {display: none;} .gh-n {display: block;} } @media only screen and (min-width: 410px) and (max-width: 439px){ .cg .gh .gh-l {width: 100%; float: left; margin-right: 0%;} .cg .gh .gh-r {width: 100%; float: right; margin-right: 0%;} .gh .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 2px auto;} .gh .gh-t p {margin:.2rem 1rem; line-height: 18px; font-size: .7rem; text-indent: 2em; padding:0;} .gh .gh-img .l {width: 24%; margin-right: 1%; float: left;} .gh .gh-img .r {width: 24%; margin-left: 1%; float: right;} .gh-bk {display: none;} .gh-n {display: block;} } @media only screen and (min-width: 360px) and (max-width: 410px){ .cg .gh .gh-l {width: 100%; float: left; margin-right: 0%;} .cg .gh .gh-r {width: 100%; float: right; margin-right: 0%;} .gh .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 2px auto;} .gh .gh-t p {margin:0 1rem; line-height: 18px; font-size: .7rem; text-indent: 2em; padding:0;} .gh .gh-img .l {width: 24%; margin-right: 1%; float: left;} .gh .gh-img .r {width: 24%; margin-left: 1%; float: right;} .gh-bk {display: none;} .gh-n {display: block;} } @media only screen and (min-width: 320px) and (max-width: 410px){ .cg .gh .gh-l {width: 100%; float: left; margin-right: 0%;} .cg .gh .gh-r {width: 100%; float: right; margin-right: 0%;} .gh .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 2px auto;} .gh .gh-t p {margin:0 .5rem; line-height: 16px; font-size: .7rem; text-indent: 2em; padding:0;} .gh .gh-img .l {width: 24%; margin-right: 1%; float: left;} .gh .gh-img .r {width: 24%; margin-left: 1%; float: right;} .gh-bk {display: none;} .gh-n {display: block;} } /* 发展定位 */ @media only screen and (min-width: 480px) and (max-width: 639px){ .dw .gh-l {width: 100%; float: left; margin-right: 0%;} .dw .gh-r {width: 100%; float: left; margin-right: 0%;} .dw .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 5px auto;} .dw .gh-t p {margin:.2rem 1rem; line-height: 18px; font-size: .8rem; text-indent: 2em; padding:0;} .gh-img .l {width: 49%; margin-right: 1%; float: left;} .gh-bk {display: none;} .gh-n {display: block;} } @media only screen and (min-width: 410px) and (max-width: 439px){ .dw .gh-l {width: 100%; float: left; margin-right: 0%;} .dw .gh-r {width: 100%; float: left; margin-right: 0%;} .dw .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 5px auto;} .dw .gh-t p {margin:.2rem 1rem; line-height: 18px; font-size: .8rem; text-indent: 2em; padding:0;} .gh-img .l {width: 49%; margin-right: 1%; float: left;} .gh-bk {display: none;} .gh-n {display: block;} } @media only screen and (min-width: 360px) and (max-width: 410px){ .dw .gh-l {width: 100%; float: left; margin-right: 0%;} .dw .gh-r {width: 100%; float: left; margin-right: 0%;} .dw .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 5px auto;} .dw .gh-t p {margin:.2rem 1rem; line-height: 18px; font-size: .8rem; text-indent: 2em; padding:0;} .gh-img .l {width: 49%; margin-right: 1%; float: left;} .gh-bk {display: none;} .gh-n {display: block;} } @media only screen and (min-width: 320px) and (max-width: 410px){ .dw .gh-l {width: 100%; float: left; margin-right: 0%;} .dw .gh-r {width: 100%; float: left; margin-right: 0%;} .dw .gh-t {border-radius: 6px; background: #eee; width: 100%; margin: 5px auto;} .dw .gh-t p {margin:.1rem 1rem; line-height: 16px; font-size: .7rem; text-indent: 2em; padding:0;} .gh-img .l {width: 49%; margin-right: 1%; float: left;} .gh-bk {display: none;} .gh-n {display: block;} }