.pchead .nav li:nth-child(5) .navs span::after { transform: scale(1); } .aa { position: relative; z-index: 6; } .aa .aanavs { border: 1px solid #e6e6e6; background: #fff; } .aa .aanavs .inwrap .navBox a { float: left; display: block; width: 33.333333%; line-height: 50px; font-size: 16px; color: #4d4d4d; text-align: center; position: relative; } .aa .aanavs .inwrap .navBox a::after { transition: all .5s; content: ""; display: block; width: 100%; height: 2px; height: 3px; background: #ee9655; position: absolute; left: 0; bottom: -2px; transform: scale(0); } .aa .aanavs .inwrap .navBox a:hover::after, .aa .aanavs .inwrap .navBox .actA::after { transform: scale(1); } .bb { position: relative; z-index: 6; background: #fff; padding-top: 80px; } .bb .inwrap .lt { float: left; } .bb .inwrap .lt .enTl span { display: block; font-size: 40px; line-height: 50px; color: #ee9654; border-bottom: 1px solid #ee9654; padding-bottom: 8px; float: left; } .bb .inwrap .lt .cntl span { display: block; float: left; margin-top: 26px; font-size: 40px; line-height: 50px; color: #333; padding-bottom: 15px; border-bottom: 2px solid #7d7d7d; } .bb .inwrap .lt .smg { color: #4d4d4d; margin-top: 15px; } .bb .inwrap .lt .company-name { color: #333; font-size: 18px; margin-top: 60px; font-weight: bold; } .bb .inwrap .lt .infoBox { margin-top: 36px; color: #4d4d4d; font-size: 16px; line-height: 40px; } .bb .inwrap .lt .infoBox .tel .big { font-size: 30px; line-height: 30px; color: #ee9654; } .bb .inwrap .rt { float: right; width: 400px; } .bb .inwrap .rt .rttl { font-size: 16px; color: #4d4d4d; line-height: 50px; } .bb .inwrap .rt .inp { width: 100%; outline: none; border: none; box-sizing: border-box; padding-left: 22px; color: #555; background: #f3f3f3; height: 50px; margin-bottom: 10px; } .bb .inwrap .rt .selectBox { margin-bottom: 10px; } .bb .inwrap .rt .selectBox select { width: 90px; height: 34px; background: url(../images/select_01.png) no-repeat #555; background-position: 94% center; margin-right: 6px; color: #fff; border: none; box-sizing: border-box; padding-left: 10px; padding-right: 5%; } .bb .inwrap .rt .like { width: 100%; height: 50px; line-height: 50px; padding-left: 18px; color: #fff; background: url(../images/select_02.png) no-repeat #f3f3f3; background-position: 98% center; border: none; box-sizing: border-box; color: #555; margin-bottom: 10px; padding-right: 5%; } .bb .inwrap .rt textarea { background: #F3F3F3; padding: 22px; box-sizing: border-box; height: 178px; width: 100%; color: #555; resize: none; border: none; font-family: "寰蒋闆呴粦"; } .bb .inwrap .rt .subBtn { margin-bottom: 60px; box-sizing: border-box; width: 400px; height: 50px; border: solid 1px #ee9655; color: #ee9654; background: transparent; cursor: pointer; margin-top: 10px; font-size: 16px; position: relative; transition: all .5s; z-index: 2; overflow: hidden; } .bb .inwrap .rt .subBtn input { border: none; width: 100%; height: 100%; position: relative; z-index: 10; margin: 0; } .bb .inwrap .rt .subBtn::after { position: absolute; width: 500px; height: 500px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -ms-border-radius:50%; left: 50%; top: 50%; margin-left: -250px; margin-top: -250px; content: ""; background: #ee9655; transform: scaleX(0); transform-origin: right; -webkit-transition: transform .5s; -webkit-transform: scaleX(0); -webkit-transform-origin: right; -moz-transition: transform .5s; -moz-transform: scaleX(0); -moz-transform-origin: right; transition: transform .5s; z-index: -1; display: block; } .bb .inwrap .rt .subBtn:hover { color: #fff; } .bb .inwrap .rt .subBtn:hover::after { transform: scaleX(1); transform-origin: left center; } .cc { position: relative; z-index: 6; background: #f7f7f7; } .cc .inwrap .addLi { margin-bottom: 50px; } .cc .inwrap .addLi li { cursor: pointer; float: left; width: 120px; height: 35px; line-height: 31px; box-sizing: border-box; border: 2px solid #313131; margin-right: 60px; text-align: center; border-radius: 17px; -moz-border-radius: 17px; -webkit-border-radius: 17px; -ms-border-radius:17px; transition: all .5s; position: relative; z-index: 12; overflow: hidden; margin-bottom: 20px; } .cc .inwrap .addLi li a{ display: block; width: 100%; height: 100%; } .cc .inwrap .addLi li:nth-child(7n) { margin-right: 0; } .cc .inwrap .addLi li::after{ position: absolute; width: 150px; height: 150px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -ms-border-radius:50%; left: 50%; top: 50%; margin-left: -75px; margin-top: -75px; content: ""; background: #313131; transform: scale(0); transition: all .5s; z-index: -1; display: block; } .cc .inwrap .addLi li:hover, .cc .inwrap .addLi .actli{ color: #fff; } .cc .inwrap .addLi li:hover::after, .cc .inwrap .addLi .actli::after{ transform: scale(1); } .cc .inwrap .addrliinfo { overflow: hidden; } .cc .inwrap .addrliinfo .title { font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 30px; } .cc .inwrap .addrliinfo .infoBox { padding-bottom: 74px; } .cc .inwrap .addrliinfo .infoBox .geInfo { width: 32.08333%; box-sizing: border-box; border: solid 1px #e5e5e5; height: 230px; overflow: hidden; float: left; position: relative; margin-right: 1.875005%; margin-bottom: 22px; background: #fff; transition: all .5s; top: 0; } .cc .inwrap .addrliinfo .infoBox .geInfo .lj { position: absolute; width: 60px; left: 0px; top: 0px; } .cc .inwrap .addrliinfo .infoBox .geInfo .name { font-size: 18px; font-weight: bold; color: #333; line-height: 18px; margin-top: 50px; margin-bottom: 10px; text-align: center; } .cc .inwrap .addrliinfo .infoBox .geInfo .detailAdd { margin-top: 16px; line-height: 2; padding:0 23px 0 63px; font-size: 14px; color: #666; } .cc .inwrap .addrliinfo .infoBox .geInfo .d1 { background: url(../images/contact_03.png) no-repeat; background-position: 37px 5px; } .cc .inwrap .addrliinfo .infoBox .geInfo .d2 { background: url(../images/contact_04.png) no-repeat; background-position: 37px 5px; } .cc .inwrap .addrliinfo .infoBox .geInfo:hover { top: -10px; } .cc .inwrap .addrliinfo .infoBox .geInfo:nth-child(3n) { margin-right: 0; } .dd { position: relative; z-index: 6; background: #fff; padding-bottom: 67px; margin-bottom: 440px; } .dd .lt { float: left; } .dd .rt { float: right; } .dd .lei { width: 48.3333%; display: block; } .dd .lei a{ display: block; } .dd .lei img { width: 100%; display: block; } .dd .lei .title { line-height: 100px; background: #ee9655; } .dd .lei .title .cn { font-size: 30px; letter-spacing: 2px; margin-left: 40px; color: #fff; } .dd .lei .title .en { margin-left: 13px; font-size: 16px; color: #fff; opacity: .8; } @media screen and (min-width: 100px) and (max-width: 1024px) { .aa .aanavs .inwrap .navBox a { line-height: 42px; font-size: 14px; } .bb { padding-top: 6%; } .bb .inwrap .lt{ max-width: 48%; } .bb .inwrap .lt .enTl span { font-size: 20px; line-height: 30px; } .bb .inwrap .lt .cntl span { margin-top: 15px; font-size: 20px; line-height: 30px; } .bb .inwrap .lt .smg { color: #4d4d4d; margin-top: 15px; } .bb .inwrap .lt .company-name { font-size: 16px; margin-top: 6%; } .bb .inwrap .lt .infoBox { margin-top: 6%; font-size: 14px; line-height: 30px; } .bb .inwrap .lt .infoBox .tel .big { font-size: 20px; line-height: 20px; } .bb .inwrap .rt { width:48%; } .bb .inwrap .rt .rttl { font-size: 16px; color: #4d4d4d; line-height: 50px; } .bb .inwrap .rt .subBtn { width: 100%; } .cc { position: relative; z-index: 6; background: #f7f7f7; } .cc .inwrap .addLi { margin-bottom: 3%; } .cc .inwrap .addLi li { margin-right: 3%; width: 22%; margin-bottom: 3%; } .cc .inwrap .addLi li:nth-child(7n) { margin-right: 3%; } .cc .inwrap .addLi li:nth-child(4n) { margin-right: 0; } .cc .inwrap .addLi li::after{ width: 300px; height: 300px; margin-left: -150px; margin-top: -150px; } .cc .inwrap .addrliinfo { overflow: hidden; } .cc .inwrap .addrliinfo .title { font-size: 20px; margin-bottom: 6%; } .cc .inwrap .addrliinfo .infoBox { padding-bottom: 6%; } .cc .inwrap .addrliinfo .infoBox .geInfo { width: 32%; margin-right: 2%; } .cc .inwrap .addrliinfo .infoBox .geInfo:nth-child(3n) { margin-right: 0; } .dd { margin-bottom: 0!important; } .dd .lt { float: left; margin-bottom: 6%; } .dd .rt { float: right; } .dd .lei { width: 47.5%; } .dd .lei .title { line-height: 44px; } .dd .lei .title .cn { font-size: 18px; margin-left: 30px; } .dd .lei .title .en { margin-left: 13px; font-size: 14px; } } @media screen and (max-width:768px){ .bb .inwrap .rt { width: 100%; } .bb .inwrap .rt .rttl { font-size: 16px; color: #4d4d4d; line-height: 50px; } .bb .inwrap .rt .subBtn { width: 100%; } .cc .inwrap .addrliinfo .infoBox .geInfo { width: 100%; margin-right: 0; } .cc .inwrap .addrliinfo .infoBox .geInfo:nth-child(3n) { margin-right: 0; } .dd .lei { width: 100%; } .cc .inwrap .addLi li { margin-right: 5%; width: 30%; margin-bottom: 3%; } .cc .inwrap .addLi li:nth-child(7n) { margin-right: 5%; } .cc .inwrap .addLi li:nth-child(4n) { margin-right: 5%; } .cc .inwrap .addLi li:nth-child(3n) { margin-right: 0; } }