header{ border-bottom: 1px #d7d7d7 solid;box-sizing: border-box; height: 80px;line-height: 80px; background: url(../image/head-bg.png) repeat-x;overflow: hidden; } .logo{ max-width: 180px;max-width: 40%; } .nav .nav-i{ color: #333;font-size: 18px;line-height: 40px;height: 40px;margin:20px 0; float: left;margin-right: 15px; width: 120px;text-align: center; border-bottom: 3px rgba(0,0,0,0) solid; } .nav .nav-i:hover,.nav .nav-i.on{ color: #FCD400;border-bottom: 3px #fcd400 solid; } .nav-icon{ cursor: pointer;display: none; } .phone-nav{ display: none;position: fixed;;z-index:99;top: 6rem;bottom: 0;overflow-y: auto; background: rgba(0,0,0,.8); left: 0;right: 0; } .phone-nav .nav-i{ line-height: 1.5;text-align: center;color: #fff; font-size: 14px;padding: 10px 0; } .language{ position: absolute;top: 0;right: 0;line-height: 1.5;padding: 5px 0; } .language-i{ padding:0 5px; } @media only screen and (min-width: 100px) and (max-width: 768px) { .nav{ display: none; } .nav-icon{ display: block; } } .banner,.s-banner{ overflow: hidden;width: 100%; } /*-----------------------新聞start--------------------------*/ .news{ background: #4b4b4b;height: 40px;line-height: 40px;; } .news h1{ color: #fff;font-size: 16px;padding: 0 15px;display: inline-block; } .news-slide{ font-size: 16px;color: #666;vertical-align: top;overflow: hidden;position: relative; color: #fff;height: 40px;width: 100%; } .news-slide-wrap{ position: relative;width: 60%;overflow: hidden;padding-left: 80px; } .news-slide-wrap .swiper-button-prev,.news-slide-wrap .swiper-button-next{ background-image: none;background: #6f6f6f;height: 30px;line-height: 30px;text-align: center; left: 0;;margin-top: -15px;display: inline-block; color: #fff;font-size: 16px; } .news-slide-wrap .swiper-button-next{ left: 40px; } .news .more{ font-size: 16px;color: #fff;margin-right: 15px; } .news-ul{ padding: 35px 0 0;max-width: 1070px;width: 95%;margin: 0 auto; } .news-li{ padding-top: 20px; border-bottom: 1px #000 solid; } .news-li .t{ float: left;padding-right:3%;padding-bottom: 0;width: 35%; } .news-li .w{ padding: 30px 0; float: left; width: 62%; } .news-li .w-title{ font-size: 16px;color: #333;line-height: 1.5; } .news-li .w-descrip{ color: #666; margin-top: 15px; } .newspage .pages{ max-width: 1000px;margin: 0 auto;width: 90%;padding: 15px 0; } @media only screen and (min-width: 100px) and (max-width: 640px) { .news h1{ display: none; } .news-slide-wrap .swiper-button-prev,.news-slide-wrap .swiper-button-next{ display: none; } .news-li .w{ padding-top: 10px; } .news-slide-wrap{ padding-left: 0; width: 76%; } } @media only screen and (min-width: 100px) and (max-width:450px) { .news-li .t{ padding-right:0;padding-bottom: 0;width:100%;text-align: center; } .news-li .w{ padding: 10px 0; width: 100%; } } /*-----------------------新聞end--------------------------*/ /*-----------------------模板start--------------------------*/ /*-----------------------模板end--------------------------*/ .icon{ height: 2rem;line-height: 2rem;text-align: center;padding-bottom: 7px; } .box{ margin-bottom: 15px; } .box>div{ border-top: 10px #fcd700 solid; background: linear-gradient(#f9f2e4, #faf5f0); box-shadow: 2px 2px 5px #ddd; padding: 0 20px;margin: 20px 0; } .box .contact .c>div{ padding-bottom: 15px;color: #000;font-size: 16px; } .box h1{ color: #333;font-size: 18px;padding: 10px 0 20px; } .box .contact{ margin: 0 10px; } .box .contact p{ font-size: 14px;color: #000; } .box .hz{ margin: 0 10px;padding-bottom: 23px; } .box .hz .c>div{ margin: 15px 0;overflow: hidden; } .box .hz .pic{ width: 100%; } .box .hz .pic+.text{ width: 70%; } .box .hz .title-1{ font-size: 14px; } .box .hz .title-2{ color: #58a9fc; font-size:12px; } .box .hz .c{ display: flex; flex-flow: row nowrap; justify-content: center; } @media only screen and (min-width: 100px) and (max-width: 960px) { .box .hz {padding: 0 10px;} .box .hz .c>div {margin: 5px 0 15px;} } @media only screen and (min-width: 100px) and (max-width: 640px) { .box .contact .c>div{ max-width: 100%;width:33.3%; } .box .contact{ padding: 0 10px;} .box .contact p{ font-size: 12px;} } footer{ background: url(../image/footer-bg.png) no-repeat;padding: 2rem 0;color: #666;line-height: 1.5; background-size: 100% 100%; } .beian{ padding: 8px 0; } /*-----------------------本網站通用--------------------------*/ .cwrap{ width: 100%;overflow: hidden; } .captos{ border-bottom: 1px #000 solid;padding-top: 20px;padding-left: 15px; line-height: 2;color: #666666;font-size: 14px } .pages-i{ display: inline-block;width: 26px;height: 26px;line-height: 28px; background: #fff;color: #666666;font-size: 14px; border: 1px #000 solid;border-radius: 5px;text-align: center; margin:0 5px; } .pages-i.on,.pages-i:hover{ background: #000;color: #fabe00; } .bg{ position: absolute;text-align: center; } .page-tab{ padding: 50px 0 30px; } .page-tab-i{ display:inline-block;vertical-align: middle;margin:0 45px;width: 20%; max-width: 190px;position: relative; } .page-tab-i .cn{ color: #333;font-size: 26px;line-height: 1.8; } .page-tab-i .en{ color: #fabe00;font-size: 16px; } .page-tab-i .bg1{ display: block; } .page-tab-i .bg2{ display: none; } .page-tab-i:hover .bg2,.page-tab-i.on .bg2{ display: block; } .page-tab-i:hover .bg1,.page-tab-i.on .bg1{ display: none; } .page-tab-i:hover .en,.page-tab-i.on .en{ color: #fff; } .page-tab-i .page-tab-text{ position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%); width: 100%; } @media only screen and (min-width: 100px) and (max-width: 640px) { .page-tab-i{ margin: 0 5%; } .page-tab-i .cn{ font-size: 12px; } .page-tab-i .en{ color: #fabe00;font-size: 12px; } } .liuyanform{ width: 95%;max-width: 930px;margin: 0 auto;padding: 60px 0; } @media only screen and (min-width: 100px) and (max-width: 640px) { .liuyanform{ padding-top: 0;padding-bottom: 20px; } } .important:after{ content: "*"; color: red; width: 100%; text-align: center; } .form-i{ margin-bottom: 15px; } .form-i input{ max-width: 300px;height: 30px;width: 90%;text-indent: 8px;line-height: 30px; } .form-i textarea{ max-width: 800px;width: 90%;height: 300px; } @media only screen and (min-width: 100px) and (max-width: 640px) { .form-i textarea{ max-width: 800px;width: 90%;height: 100px; } } .form-i label{ width: 90px;display: inline-block;vertical-align: top;padding: 10px 0; color: #333333;font-size: 14px;text-align: right; } .form-i .fenge{ display: inline-block;width: 10px;vertical-align: top;padding: 10px 0; } .form-i.check input[type="text"]{ width: 85px; } .form-i.check input[type="button"]{ width: 85px;background: rgba(255,255,255,0); border: none;cursor: pointer;font-size: 14px; } .liuyanform input[type="submit"]{ width: 100px;height: 40px;line-height: 40px;text-align: center;color: #fabe00; background: #333333; } .cp-page{ width: 95%;max-width: 1070px;margin: 0 auto; } .cp-page .ctitle{ font-size: 16px;color: #666;line-height: 1.8; } .cp-page .ctitle span{ background: url(../image/jiantou.png) no-repeat center bottom;padding-bottom:35px; } .cp-page .w-title{ color: #000;font-size: 16px;line-height: 1.6;font-weight: bold;padding: 10px 0;height: 50px;overflow: hidden; } .cp-page .w-content{ color: #666;font-size: 14px;line-height: 1.8;height: 50px;overflow: hidden; } @media only screen and (min-width: 100px) and (max-width: 640px) { .cp-page .w-content{ height: 150px; display: none; } .cp-page .w-title{ height: 66px; padding: 10px 0 0; font-size: 14px; color: #333; font-weight:normal; display: inline-block; } } .cp-page .w-more{ width: 100%;max-width: 120px; height: 30px;text-align: center;line-height: 30px;color: #fff; font-size: 14px;background: #ff0000;font-weight: bold;margin: 15px 0;border-radius: 5px; } .cp-page .w-more-2{ background: #fabe00;color: #fff;border-radius: 5px; } .cp-page .tuijian-box{ padding: 30px 10px; width: 46%; } .cp-page .t{ text-align: center;padding:10px 0; } .cp-box .left{ padding: 50px 0; } .cp-page .tj{ text-align: center;padding:20px 2%; width: 40%; } .cp-page .tj img{max-width: 100%;height: auto;} .tuijian-ul .tjn {display: none} @media only screen and (min-width: 1200px) { .tuijian-ul .tjn {display: block} } @media only screen and (min-width: 1025px) { .cp-page .tjw{ width: 54%; padding-left: 2%; } } @media only screen and (min-width: 100px) and (max-width: 640px) { .cp-box .left{ padding:20px 0; } } .cp-box:nth-child(2n+1){ background: #fff; } .cp-box:nth-child(2n){ background: #fff8cb; } .cp-box:nth-child(2n+1) .left{ background: #fff8cb; } .cp-box:nth-child(2n) .left{ background: #fff; } .cp-page .tj_top{ padding:50px;background: #36434a;max-width: 580px; color: #fff; } .cp-page .tj_top .t,.cp-page .tj_top .w{ display: inline-block; } .cp-page .tj_top .t{ width: 25%; } .cp-page .tj_top .w-content,.cp-page .tj_top .w-title{ color: #fff; } .product-li .tw{ background: #fff; -webkit-transition: all 0.5s; transition: all 0.5s; } .product-li{ box-sizing: border-box; padding: 15px 20px; } .product-li .tw{ border: 1px #ddd solid; } .product-li .tw:hover{ background: #fff8cb; } .product-li .tw .w{ padding: 0 25px; } .product-new{ background: #fabe00;padding:0 40px 80px; } .tuijian-box{ background:#fff;display: inline-block;border-radius: 10px; -webkit-box-shadow:2px 2px 7px rgba(0,0,0,0.20); box-shadow:2px 2px 7px rgba(0,0,0,0.20); } .tuijian-ul {padding: 0 20px;} .tj-title{ padding:20px 0;text-align: center; } .tj-title .cn{ color: #fff;font-size: 36px;vertical-align: bottom;line-height: 1; } .tj-title .en{ color: #ff0000;font-size:36px; } .tj-title .fenge{ width: 40px;padding-top: 20px; border-bottom: 4px #ff0000 solid; } @media only screen and (min-width: 100px) and (max-width: 640px) { .product-new{ padding: 0 15px 80px; } .product-li .tw .w{ padding: 0 15px; } .tuijian-ul { padding: 0 10px; } .tj-title .cn{ font-size: 16px } .tj-title .en{ font-size: 20px; } .cp-page .t,.cp-page .w {float: none;display: inline-block; padding: 0 10px;} .cp-page .t {padding: 10px 0;width: 100%} .cp-page .tuijian-box {text-align: center;padding: 10px 0;width: 48%;} .product-li { padding: 15px 5px; } .tj-title { padding: 20px 0; } .page-tab { padding: 20px 0 20px; } .pro2 {padding-bottom: 20px;} .pro2:nth-child(2n+1) .left { background: #fff; } .pro2:nth-child(2n) .left { background: #fff8cb; } .cp-page .pro2 .w-title {height: auto;} .cp-page .pro2 .w-content { height: auto; display:block; } } /*-----------------------產品詳情start--------------------------*/ .name{ color: #000;font-size: 21px;padding:0 5%;line-height: 1.5; border-bottom: 1px #ddd solid;padding: 25px 0 10px; } .showpage .cptos{ color: #666666;font-size: 12px;padding:8px 5%;line-height: 1.5; } .showpage .content{ width: 96%;max-width: 1070px;margin: 0 auto;padding: 30px 0; } .showpage .sc-box{ margin: 50px 0; } .showpage .sc-box h1{ margin-bottom: 40px; color: #fabe00; } .showpage .sc-box .cn{ font-size: 21px;color: #333; } .showpage .sc-box .en{ font-size: 14px;color: #333333; } .showpage .sc-box .sc-cc{ width: 80%;margin: 0 auto; } .showpage .sc-box .sc-cc h1{ font-size: 15px;line-height: 1.8;margin-bottom: 10px;color: #176097; text-align: center; } .showpage .sc-box .sc-cc .article{ font-size: 12px;color: #000; } .showpage .sc-content{ color: #000;font-size: 14px;overflow: hidden; } .showpage .sc-content .cp-info{ border-left: 1px #ddd solid;margin-left: -1px;padding: 15px 0; } .showpage .sc-content .cp-info:first-child{ border-left:1px #fff solid; } .showpage table tr td{ padding: 5px 25px 5px 15px; } .showpage table tr td:nth-last-child(2n+1){ background: #fde9d9; } .showpage table tr td:nth-last-child(2){ background: #92cddc; } .showpage table tr td:nth-last-child(4){ background: #eaf1dd; } .showpage .sc-box-2{ } .showpage .sc-box-2 .cn{ font-size: 21px;color: #fabe00; } .showpage .sc-box-2 .en{ font-size: 14px;color: #fabe00; } .showpage .sc-box-2 .left{ width: 40%;float: left;font-size: 14px; } .showpage .sc-box-2 .right{ width: 60%;float: right;font-size: 14px; } @media only screen and (min-width: 100px) and (max-width: 640px) { .showpage .sc-box-2 .left{ width: 100%;float: left;font-size: 14px; } .showpage .sc-box-2 .right{ width: 100%;float: right;font-size: 14px; } .showpage .sc-box .sc-cc .article { min-height: 96px; } } .showpage .sc-box-2 .description{ background: #fff;width: 70%;margin: 0 auto; padding: 20px 40px; } .article-cp{ color: #000;font-size: 14px;line-height: 1.8; } /*-----------------------產品詳情ed--------------------------*/ /*-----------------------服務網點start--------------------------*/ .service .map{ margin-top: 50px;margin-bottom: 20px; } .service .service-box.first{ margin-bottom: 120px; } @media only screen and (min-width: 100px) and (max-width: 640px) { .service .service-box.first{ margin-bottom: 30px; } } .service-box h1{ color: #000;font-size:20px;line-height:20px; } .service-box h3{ color: #000;font-size:24px;margin-bottom: 15px; margin-top: 0;padding-bottom: 10px;font-weight: normal; line-height: 1.5;border-bottom: 1px #b5b5b6 solid; } .service-article,.service-article p{ color: #666;font-size: 14px;line-height: 2; } /*-----------------------服務網點ed--------------------------*/ .xuanfu{ position: fixed;top: 10%;right: 0;z-index: 5;text-align: center; background: #f9faf0;padding: 5px;display: block; } .xuanfu p{ margin-bottom: 5px;color: #333; } @media only screen and (min-width: 100px) and (max-width: 640px) { .xuanfu{ display: none; } } /*-----------------------流程--------------------------*/ .lc-pic{ margin-top: 80px; } .lc-pic-c{ padding: 100px 0; } .lc-pic-c .ctitle{ padding: 20px 0 0; } .lc-text{ background: url(../image/ryzz-bg.png) center bottom no-repeat #f6f6f6; margin-top: 30px; } .lc-text .cc{ padding: 50px 0; position: relative;z-index: 9; max-width: 780px;width: 98%; text-align: left;color: #333;font-size: 14px;line-height: 1.8; } .lc-pic-c ul{padding:0 4%;} .lc-pic-c li{padding: 10px 0;position: relative;} .lc-pic-c li::after{content: "";width: 1px;top:0;bottom: 0;left: 10%;margin-left: -10px; background: #000;position: absolute;} .lc-pic-c li h3{width: 10%;margin-right: 3%; font-size: 18px;font-weight: normal;background: url(../image/lcdot.png) no-repeat right center;color: #0c5da4;display: inline-block;vertical-align: middle;padding: 10px 0;position: relative;z-index: 9;} .lc-pic-c li .lcimg{width: 37%;display: inline-block;vertical-align: middle;} .lc-pic-c li .lctxt{width: 46%;margin-left: 4%; display: inline-block;vertical-align: middle;font-size: 18px;font-weight: 400; color: #000;text-align: left;line-height: 2;} @media only screen and (min-width:640px) and (max-width:1024px) { .lc-pic-c li h3 {width:16%;} .lc-pic-c li .lctxt {font-size: 14px;width: 40%;font-weight: normal;} .lc-pic-c li .lcimg {width: 30%;} .lc-pic-c li::after {left: 16%;} .cp-page .tj{padding:10px 0;width:100%;} .cp-page .tuijian-box {width: 44%;} } @media only screen and (min-width: 100px) and (max-width: 640px) { .lc-pic{ margin-top: 30px; } .lc-pic-c{ padding: 30px 0; } .lc-text{ margin-top: 0; } .lc-text .cc{ padding: 20px 0; } .lc-pic-c li h3 {width:24%;font-size: 14px;} .lc-pic-c li .lcimg {width: 70%;} .lc-pic-c li .lctxt {font-size: 12px;width: 70%;margin-left: 27%;margin-top: 10px; font-weight: normal;} .lc-pic-c li::after {left: 24%;} } @media only screen and (min-width:768px) { .showpage .sc-content{ overflow:inherit; } .showpage .sc-content .cp-info{ height: 100px; } }