/* Page Banner Star */ .page-banner { height: 360px; background-position: center center; background-size: cover;} /* Page Banner End */ /* Page Content Star */ .page-content { padding-top: 20px; padding-bottom: 20px;} .page-content .c-left { float: left; width: 25.000000%;} .page-content .c-right { float: right; width: calc(75.000000% - 30px);} /* Page Content End */ /* Column Title Star */ .column-title { border-bottom: solid 3px #333; padding-top: 10px; padding-bottom: 10px;} .column-title .icons { float: left; color: #FFF; width: 38px; height: 38px; text-align: center; line-height: 38px; background: #333; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%;} .column-title .names { float: left; margin-left: 15px; line-height: 38px; font-size: 18px; color: #333;} /* Column Title End */ /* Column List Star */ ul.column-list { margin-top: 30px; margin-left: 20px;} ul.column-list li { padding-left: 15px; position: relative; margin-bottom: 3px;} ul.column-list li:after { position: absolute; left: 0; top: 0; content: '●'; color: #666;} ul.column-list li a { color: #666; -o-transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -ms-transition: all .6s; transition: all .6s;} ul.column-list li a:hover { color: #bc1c22;} ul.column-list li.active a { color: #bc1c22;} /* Column List End */ /* Navigation Title Star */ .navigation-title { border-bottom: solid 1px #CCC; padding-top: 10px; padding-bottom: 10px;} .navigation-title .icons { float: right; line-height: 38px; color: #CCC;} .navigation-title .names { float: left; line-height: 38px; font-size: 18px; color: #333;} /* Navigation Title End */ /* Navigation Title One Star */ .navigation-title-one { border-bottom: solid 1px #CCC; padding-top: 10px; padding-bottom: 10px; line-height: 38px;} .navigation-title-one .names { float: left; font-size: 16px;} .navigation-title-one .locations { float: right;} .navigation-title-one .locations span { float: left;} .navigation-title-one .locations a { color: #999; transition: color .3s;} .navigation-title-one .locations span:last-child a { color: #666;} .navigation-title-one .locations i { width: 4px; height: 38px; display: block; float: left; background: url('../img/arrow.png') no-repeat center; margin: 0 10px; } .navigation-title-one .locations i.fa { width: auto; height: 38px; color: #999; background: none; line-height: 38px; margin: 0 10px 0 0;} /* Navigation Title One End */ /* Navigation Title Full Star */ .navigation-title-full { padding-top: 10px; padding-bottom: 10px;} .navigation-title-full .n-left { float: left; border-bottom: solid 3px #333; padding-bottom: 10px;} .navigation-title-full .n-left .icons { color: #FFF; width: 38px; height: 38px; text-align: center; line-height: 38px; background: #333; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%;} .navigation-title-full .n-right { float: right; width: calc(100% - 58px); line-height: 38px; border-bottom: solid 1px #CCC; padding-bottom: 11px;} .navigation-title-full .n-right .names { float: left; font-size: 16px;} .navigation-title-full .n-right .locations { float: right;} .navigation-title-full .n-right .locations span { float: left;} .navigation-title-full .n-right .locations a { color: #999; transition: color .3s;} .navigation-title-full .n-right .locations span:last-child a { color: #666;} .navigation-title-full .n-right .locations i { width: 4px; height: 38px; display: block; float: left; background: url('../img/arrow.png') no-repeat center; margin: 0 10px; } .navigation-title-full .n-right .locations i.fa { width: auto; height: 38px; color: #999; background: none; line-height: 38px; margin: 0 10px 0 0;} /* Navigation Title Full End */ /* List News Star */ ul.list-news li { float: left; width: 23.500000%; margin-right: 2%; overflow: hidden; margin-bottom: 30px;} ul.list-news li:nth-child(4n) { margin-right: 0;} ul.list-news li .imgs { overflow: hidden; -moz-border-radius: 16px; -webkit-border-radius: 16px; border-radius: 16px;} ul.list-news li img { -o-transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -ms-transition: all .6s; transition: all .6s;} ul.list-news li:hover img { transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2);} ul.list-news li .names { font-weight: 700; margin-top: 10px; margin-bottom: 5px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;} /* List News End */ /* Navigation Title Detail Star */ .navigation-title-detail { padding-top: 10px; padding-bottom: 10px;} .navigation-title-detail .n-left { float: left; width: 25.000000%; border-bottom: solid 3px #333; padding-bottom: 30px;} .navigation-title-detail .n-left .cng { font-size: 16px; font-weight: 700; line-height: 30px; color: #555;} .navigation-title-detail .n-left .eng { font-family: 'Calibri';font-size: 50px;line-height: 40px;text-transform: uppercase;font-weight: 700;color: #999;} .navigation-title-detail .n-right { float: right; width: calc(75% - 20px); border-bottom: solid 1px #CCC; padding-bottom: 31px;} .navigation-title-detail .n-right .locations { float: right;} .navigation-title-detail .n-right .locations span { float: left;} .navigation-title-detail .n-right .locations a { color: #999; height: 70px; line-height: 70px; transition: color .3s;} .navigation-title-detail .n-right .locations span:last-child a { color: #666;} .navigation-title-detail .n-right .locations i { width: 4px; height: 70px; line-height: 70px; display: block; float: left; background: url('../img/arrow.png') no-repeat center; margin: 0 10px; } .navigation-title-detail .n-right .locations i.fa { width: auto; color: #999; background: none; margin: 0 10px 0 0;} /* Navigation Title Detail End */ /* Detail One Star */ .detail-one { } .detail-one .d-left { float: left; width: 25.000000%;} .detail-one .d-left .cng { font-size: 18px;} .detail-one .d-left .eng { font-size: 16px; color: #014099; margin-top: 10px; margin-bottom: 20px;} .detail-one .d-left .icos i { font-size: 18px; width: 38px; height: 38px; line-height: 38px; text-align: center; color: #eee; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background-color: #333;} .detail-one .d-right { float: right; width: calc(75% - 20px);} /* Detail One End */ .detail-one-mt { margin-top: 30px;} /* Navigation Title Back Star */ .navigation-title-back { padding-top: 10px; padding-bottom: 10px;} .navigation-title-back .title { margin-bottom: 50px;} .navigation-title-back .title .cng { font-size: 16px; font-weight: 700; line-height: 30px; color: #555;} .navigation-title-back .title .eng { font-family: 'Calibri';font-size: 50px;line-height: 40px;text-transform: uppercase;font-weight: 700;color: #999;} .navigation-title-back .back { font-size: 16px;} .navigation-title-back .back a { color: #666;} /* Navigation Title Back End */ /* Page Advert Start */ .page-advert { position: relative; margin-top: 30px; margin-bottom: 30px; width: 100%; height: 260px; background-image: url('../img/page-advert.jpg');background-size: cover; background-position: center center; background-attachment: fixed; } .page-advert .floating-layer { content: '';width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.65);position: absolute;} .page-advert .classify { margin-top: 100px;} .page-advert .classify ul li { width: 16.666666%; float: left; text-align: center;} .page-advert .classify ul li .icos { margin: 0 auto; width: 70px; height: 70px; line-height: 70px; text-align: center; background: #222; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; overflow: hidden; -o-transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -ms-transition: all .6s; transition: all .6s;} .page-advert .classify ul li .icos img { transform:scale(0.8); -webkit-transform:scale(0.8); -moz-transform:scale(0.8); -ms-transform:scale(0.8); -o-transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -ms-transition: all .6s; transition: all .6s;} .page-advert .classify ul li:hover .icos img { transform:scale(1); -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1);} .page-advert .classify ul li:hover .icos { background: #bc1c22;} .page-advert .classify ul li .names { margin-top: 10px; color: #eee;} /* Page Advert End */ /* List Case Star */ ul.list-images-texts { } ul.list-images-texts li { float: left; width: 23.5000000%; margin-right: 2%; margin-bottom: 40px;} ul.list-images-texts li:nth-child(4n) { margin-right: 0;} ul.list-images-texts li .imgs { overflow: hidden;} ul.list-images-texts li .imgs img { -o-transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -ms-transition: all .6s; transition: all .6s;} ul.list-images-texts li:hover .imgs img { transform:scale(1.2); -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2);} ul.list-images-texts li .names { text-align: center; margin-top: 15px;} /* List Case End */ .list-images-texts-mt { margin-top: 30px;} /* Single Content Star */ .single-content { margin-top: 20px;} /* Single Content End */ /* Our Map Star */ .our-map { margin: 30px 0 0 0; position: relative;} .our-map .containerMap { width: 100%; height: 420px; overflow: hidden; border: solid 1px #e4e4e4; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;} .our-map .mapIcon { position: absolute;left: 60px; top: 60px; background: rgba(255,255,255,.9);padding: 2%;max-width: 50%; color: #555;} .our-map .mapIcon a { color: #555;} .our-map .mapIcon a:hover { color: #014099;} .our-map .mapIcon .company { color: #212121; font-weight: 700;} .our-map .mapIcon ul.list { margin: 10px 0 0 0; font-size: 15px;} .our-map .mapIcon ul.list li { margin: 0 0 5px 0; font-weight: lighter;} .our-map .mapIcon ul.list li i { width: 16px; height: 16px; color: #888; display: inline-block; margin: 0 10px 0 0; text-align: center;} /* Our Map End */ .company-name { margin-bottom: 5px;} /* Ajax Page Star */ .ajax-page { text-align: center; margin: 0 auto;} .ajax-page .current { color: #fff; background-color: #014099; border-color: #014099;} /* Ajax Page End */ /* Loading Star */ .loading { font-size: 0; text-align: center; line-height: 10px; margin: 20px auto;} .loading i { margin: 0 9px; display: inline-block; vertical-align: top; width: 10px; height: 10px; background-color: #333; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%;} .loading i:nth-of-type(1) {-webkit-animation: loading1 1s linear infinite;animation: loading1 1s linear infinite;} .loading i:nth-of-type(2) {opacity: .85;-webkit-animation: loading2 1s linear infinite;animation: loading2 1s linear infinite;} .loading i:nth-of-type(3) {opacity: .7;-webkit-animation: loading3 1s linear infinite;animation: loading3 1s linear infinite;} .loading i:nth-of-type(4) {opacity: .55;-webkit-animation: loading4 1s linear infinite;animation: loading4 1s linear infinite;} .loading i:nth-of-type(5) {opacity: .4;-webkit-animation: loading5 1s linear infinite;animation: loading5 1s linear infinite;} .loading i:nth-of-type(6) {-webkit-opacity: .25;animation: loading6 1s linear infinite;animation: loading6 1s linear infinite; } @keyframes loading1 { 0% {opacity: 1} 50% {opacity: .25} 100% {opacity: 1} } @keyframes loading2 { 0% {opacity: .85} 10% {opacity: 1} 60% {opacity: .25} 100% {opacity: .85} } @keyframes loading3 { 0% {opacity: .7} 20% {opacity: 1} 70% {opacity: .25} 100% {opacity: .7} } @keyframes loading4 { 0% {opacity: .55} 30% {opacity: 1} 80% {opacity: .25} 100% {opacity: .55} } @keyframes loading5 { 0% {opacity: .4} 40% {opacity: 1} 90% {opacity: .25} 100% {opacity: .4} } @keyframes loading6 { 0% {opacity: .25} 50% {opacity: 1} 100% {opacity: .25} } @-webkit-keyframes loading1 { 0% {opacity: 1} 50% {opacity: .25} 100% {opacity: 1} } @-webkit-keyframes loading2 { 0% {opacity: .85} 10% {opacity: 1} 60% {opacity: .25} 100% {opacity: .85} } @-webkit-keyframes loading3 { 0% {opacity: .7} 20% {opacity: 1} 70% {opacity: .25} 100% {opacity: .7}} @-webkit-keyframes loading4 { 0% {opacity: .55} 30% {opacity: 1} 80% {opacity: .25} 100% {opacity: .55}} @-webkit-keyframes loading5 { 0% {opacity: .4} 40% {opacity: 1} 90% {opacity: .25} 100% {opacity: .4}} @-webkit-keyframes loading6 { 0% {opacity: .25} 50% {opacity: 1} 100% {opacity: .25}} /* Loading End */ /* <1920的设备 */ @media screen and (max-width: 1920px){ } /* <1680的设备 */ @media screen and (max-width: 1680px){ } /* <1500的设备 */ @media screen and (max-width: 1500px){ } /* <1440的设备 */ @media screen and (max-width: 1440px){ } /* <1366的设备 */ @media screen and (max-width: 1366px){ } /* <1200的设备 */ @media screen and (max-width: 1200px){ } /* <991的设备 */ @media screen and (max-width: 991px){ /* Page Banner Star */ .page-banner { height: 120px;} /* Page Banner End */ /* Page Content Star */ .page-content { padding-top: 5px; padding-bottom: 5px;} .page-content .c-left { display: none;} .page-content .c-right { float: none; width: 100%;} /* Page Content End */ /* Navigation Title Full Star */ .navigation-title-full { padding-top: 5px; padding-bottom: 5px;} .navigation-title-full .n-left { padding-bottom: 5px;} .navigation-title-full .n-left .icons { width: 28px; height: 28px; line-height: 28px;} .navigation-title-full .n-right { width: calc(100% - 48px); line-height: 28px; padding-bottom: 6px;} .navigation-title-full .n-right .locations i { height: 28px; margin: 0 5px; } .navigation-title-full .n-right .locations i.fa { height: 28px; line-height: 28px; margin: 0 5px 0 0;} /* Navigation Title Full End */ /* Navigation Title Detail Star */ .navigation-title-detail { padding-top: 5px; padding-bottom: 5px;} .navigation-title-detail .n-left { width: 30.000000%; border-bottom: solid 3px #333; padding-bottom: 10px;} .navigation-title-detail .n-left .cng { font-size: 16px; line-height: 22px;} .navigation-title-detail .n-left .eng { font-size: 18px;line-height: 22px;} .navigation-title-detail .n-right { float: right; width: calc(70% - 20px); padding-bottom: 11px;} .navigation-title-detail .n-right .locations a { height: 45px; line-height: 45px; } .navigation-title-detail .n-right .locations i { height: 45px; line-height: 45px; margin: 0 5px; } .navigation-title-detail .n-right .locations i.fa { margin: 0 5px 0 0;} /* Navigation Title Detail End */ /* Detail One Star */ .detail-one { } .detail-one .d-left { float: none; width: 100.000000%; margin-bottom: 15px;} .detail-one .d-right { float: none; width: 100.000000%;} /* Detail One End */ .detail-one-mt { margin-top: 15px;} /* Page Advert Start */ .page-advert { height: 330px;} .page-advert .classify { margin-top: 50px;} .page-advert .classify ul li { width: 33.333333%; margin-bottom: 20px;} /* Page Advert End */ /* Navigation Title Back Star */ .navigation-title-back .title { margin-bottom: 20px;} /* Navigation Title Back End */ /* List Case Star */ ul.list-images-texts { } ul.list-images-texts li { width: 49.0000000%; margin-bottom: 20px;} ul.list-images-texts li:nth-child(2n) { margin-right: 0;} /* List Case End */ .list-images-texts-mt { margin-top: 15px;} /* List News Star */ ul.list-news li { width: 48.500000%; margin-right: 3%; margin-bottom: 15px;} ul.list-news li:nth-child(2n) { margin-right: 0;} /* List News End */ } /* <767的设备 */ @media screen and (max-width: 767px){ } /* <450的设备 */ @media screen and (max-width: 450px){ }