@font-face { font-family: 'Montserrat'; src: url(../font/MontserratSemiBold.otf); font-weight: normal; } :before, *:after { -ms-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } *:focus { outline: inherit } html { -webkit-tap-highlight-color: transparent } body { overflow-x: hidden; color: #3b3b3b; font-size: 14px; -webkit-overflow-scrolling: touch; font-family: '寰蒋闆呴粦'; } body, dd, dl, figure, form, h1, h2, h3, h4, h5, h6, p, td, th { margin: 0; padding: 0; border: 0 } li, ol, ul { margin: 0; padding: 0; list-style-type: none } table { border-collapse: collapse; border-spacing: 0 } a { color: inherit; outline: none; text-decoration: none; background: transparent } a:hover { color: #04438d } a, em, i, span { display: inline-block } b, em, i { font-style: normal } h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 14px } button { padding: 0 } button, input, optgroup, select, textarea { outline: 0; border: 0; vertical-align: middle; font-family: 'Microsoft Yahei' } input[type=radio], input[type=checkbox] { vertical-align: -2px } button, html input[type=button], input[type=reset], input[type=submit], input[type=text] { outline: 0; border: 0; border-radius: 0; cursor: pointer; -webkit-appearance: button } textarea { resize: none; font-size: 14px } textarea, .select { appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none } .select::-ms-expand { display: none } .clearfix::after, .mauto::after, .row::after, .hsms::after { display: table; content: "" } .clearfix:after, .mauto:after, .row:after, .hsms:after, .clear { clear: both } /* 鍥剧墖缂╂斁 */ .img-scale { overflow: hidde } .img-scale img { -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transform: scale(1); -o-transition: all .8s; -moz-transition: all .8s; transition: all .8s; -webkit-transition: all .8s } .img-scale:hover img { -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); -webkit-transform: scale(1.1) } .ov { overflow: hidden } .l2, .l3, .l4, .l5 { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical } .l2 { -webkit-line-clamp: 2 } .l3 { -webkit-line-clamp: 3 } .l4 { -webkit-line-clamp: 4 } .l5 { -webkit-line-clamp: 5 } .l1 { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } /* 鎵嬫満澶撮儴 */ .mob-nav { display: none; width: 40px; height: 40px; margin-top: 5px; border-radius: 50%; margin-left: 10px; -o-background-size: auto 40%; background-size: auto 40%; position: relative; left: 0px } .mob-nav:before { content: ''; position: absolute; left: 50%; top: 50%; height: 2px; width: 26px; margin-left: -13px; margin-top: -8px; background: #333; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .mob-nav:after { content: ''; position: absolute; left: 50%; top: 50%; height: 2px; width: 26px; margin-left: -13px; margin-top: 6px; background: #333; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .mob-nav span { position: absolute; left: 50%; top: 50%; height: 2px; width: 26px; margin-left: -13px; margin-top: -1px; background: #333; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .mob-nav.on { -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .mob-nav.on:before { margin-top: -1px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .mob-nav.on:after { margin-top: -1px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .mob-nav.on span { width: 0; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease } .auto { height: 100%; overflow: hidden } /* 瑙嗛寮圭獥 */ .fix-wrap { display: none; z-index: 999; position: fixed; background: rgba(0, 0, 0, 0.8) } .fix-wrap, .fix-wrap svg { top: 0; left: 0; width: 100%; height: 100% } .dt { display: table; table-layout: fixed } .wh1 { width: 100%; height: 100% } .dtcell { display: table-cell; vertical-align: middle; text-align: center; padding: 15px } .dtcell img { max-width: 100%; -o-object-fit: contain; object-fit: contain; max-height: 600px; margin: 0 auto } .fix-video .video-wrap { margin: 0 auto; width: 100%; } .fix-video video { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 100%; padding: 10px; border-radius: 5px; border: 1px solid #3a3a3a; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); background: #2d2d2d; -o-object-fit: cover; object-fit: cover; -moz-animation: ReturnToNormal .5s both; -o-animation: ReturnToNormal .5s both; animation: ReturnToNormal .5s both; -webkit-animation: ReturnToNormal .5s both } .fix-wrap .hide01, .fix-wrap circle { -o-transition: all .8s; -moz-transition: all .8s; transition: all .8s; -webkit-transition: all .8s } .fix-wrap .hide01 { position: fixed; top: 5%; right: 5%; width: 49px; height: 49px; border-radius: 50%; cursor: pointer; overflow: hidden; background: transparent } .fix-wrap .hide01:hover { -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); -webkit-transform: rotate(-180deg) } .fix-wrap .hide01::before, .fix-wrap .hide01::after { z-index: 1; position: absolute; content: ""; top: 50%; left: 50%; width: 1px; height: 50%; margin-top: -25%; background: #fff } .fix-wrap .hide01::before { -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transform: rotate(45deg) } .fix-wrap .hide01::after { -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform: rotate(-45deg) } .fix-wrap svg { position: absolute } .fix-wrap, .fix-wrap svg { top: 0; left: 0; width: 100%; height: 100% } .fix-wrap circle { stroke-dasharray: 0 145 } .fix-wrap .hide01:hover circle { fill: none; stroke-dasharray: 145 } /* 鎵嬫満鐨勫唴椤佃彍鍗 */ .main-nav-m { display: none; position: relative; z-index: 55; cursor: pointer } .main-nav-m .title { position: relative; height: 45px; line-height: 45px; padding: 0 10px; background: -webkit-gradient(linear, right top, left top, from(#006AAA), to(#00A3EE)); background: -webkit-linear-gradient(right, #006AAA, #00A3EE); background: -moz-linear-gradient(right, #006AAA, #00A3EE); background: -o-linear-gradient(right, #006AAA, #00A3EE); background: linear-gradient(270deg, #006AAA, #00A3EE); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: left; border-bottom: none } .main-nav-m .title strong { color: #fff; font-size: 16px; font-weight: bold } .main-nav-m .title i { position: absolute; content: ''; width: 45px; height: 100%; right: 0 } .main-nav-m .title i::before, .main-nav-m .title i::after { position: absolute; top: 50%; content: ''; width: 12px; height: 1px; background: #fff; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; -webkit-transition: all .3s } .main-nav-m .title i::before { left: 46%; -moz-transform: rotate(40deg) scaleY(1.5); -ms-transform: rotate(40deg) scaleY(1.5); -o-transform: rotate(40deg) scaleY(1.5); transform: rotate(40deg) scaleY(1.5); -webkit-transform: rotate(40deg) scaleY(1.5) } .main-nav-m .title i::after { right: 46%; -moz-transform: rotate(-40deg) scaleY(1.5); -ms-transform: rotate(-40deg) scaleY(1.5); -o-transform: rotate(-40deg) scaleY(1.5); transform: rotate(-40deg) scaleY(1.5); -webkit-transform: rotate(-40deg) scaleY(1.5) } .main-nav-m .title.active i::before { -moz-transform: rotate(-40deg) scaleY(1.5); -ms-transform: rotate(-40deg) scaleY(1.5); -o-transform: rotate(-40deg) scaleY(1.5); transform: rotate(-40deg) scaleY(1.5); -webkit-transform: rotate(-40deg) scaleY(1.5) } .main-nav-m .title.active i::after { -moz-transform: rotate(40deg) scaleY(1.5); -ms-transform: rotate(40deg) scaleY(1.5); -o-transform: rotate(40deg) scaleY(1.5); transform: rotate(40deg) scaleY(1.5); -webkit-transform: rotate(40deg) scaleY(1.5) } .main-nav-m>ul { display: none; position: absolute; top: 45px; width: 100%; padding: 0 10px; background: -webkit-gradient(linear, right top, left top, from(#006AAA), to(#00A3EE)); background: -webkit-linear-gradient(right, #006AAA, #00A3EE); background: -moz-linear-gradient(right, #006AAA, #00A3EE); background: -o-linear-gradient(right, #006AAA, #00A3EE); background: linear-gradient(270deg, #006AAA, #00A3EE); color: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .main-nav-m ul>li { -moz-animation: ReturnToNormal .5s both; -o-animation: ReturnToNormal .5s both; animation: ReturnToNormal .5s both; -webkit-animation: ReturnToNormal .5s both } .main-nav-m ul>li>a { display: block; line-height: 45px; border-bottom: 1px solid rgba(255, 255, 255, 0.55); color: #fff } .m_sub_nav01 { width: 97%; display: none } .m_sub_nav01 a { padding-left: 20px; display: block; line-height: 45px } .auto { height: 100%; overflow: hidden } /* 鍔ㄧ敾 */ .animation { visibility: hidden; opacity: 0 } .fadel, .fader, .fadeup, .fadez { visibility: visible } .fadeup { -moz-animation: slideInUp ease-out .6s forwards; -o-animation: slideInUp ease-out .6s forwards; animation: slideInUp ease-out .6s forwards; -webkit-animation: slideInUp ease-out .6s forwards } @-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0) } to { opacity: 1; -webkit-transform: none; transform: none } } @-moz-keyframes slideInUp { from { -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0) } to { opacity: 1; -moz-transform: none; transform: none } } @-o-keyframes slideInUp { from { transform: translate3d(0, 50%, 0) } to { opacity: 1; -o-transform: none; transform: none } } @keyframes slideInUp { from { -webkit-transform: translate3d(0, 50%, 0); -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0) } to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; transform: none } } @-webkit-keyframes fadeInUp { from { -webkit-transform: translate3d(0, 50%, 0) } to { opacity: 1; -webkit-transform: none } } .fadel { -moz-animation: slideInLeft ease-out .8s forwards; -o-animation: slideInLeft ease-out .8s forwards; animation: slideInLeft ease-out .8s forwards; -webkit-animation: slideInLeft ease-out .8s forwards } @-moz-keyframes slideInLeft { from { -moz-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0) } to { opacity: 1; -moz-transform: none; transform: none } } @-o-keyframes slideInLeft { from { transform: translate3d(-50%, 0, 0) } to { opacity: 1; -o-transform: none; transform: none } } @keyframes slideInLeft { from { -webkit-transform: translate3d(-50%, 0, 0); -moz-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0) } to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; transform: none } } @-webkit-keyframes slideInLeft { from { -webkit-transform: translate3d(-50%, 0, 0) } to { opacity: 1; -webkit-transform: none } } .fader { -moz-animation: slideInRight ease-out .6s forwards; -o-animation: slideInRight ease-out .6s forwards; animation: slideInRight ease-out .6s forwards; -webkit-animation: slideInRight ease-out .6s forwards } @-moz-keyframes slideInRight { from { -moz-transform: translate3d(50%, 0, 0); transform: translate3d(50%, 0, 0) } to { opacity: 1; -moz-transform: none; transform: none } } @-o-keyframes slideInRight { from { transform: translate3d(50%, 0, 0) } to { opacity: 1; -o-transform: none; transform: none } } @keyframes slideInRight { from { -webkit-transform: translate3d(50%, 0, 0); -moz-transform: translate3d(50%, 0, 0); transform: translate3d(50%, 0, 0) } to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; transform: none } } @-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(50%, 0, 0) } to { opacity: 1; -webkit-transform: none } } .fadez { -moz-animation: zoomIn ease-out .6s forwards; -o-animation: zoomIn ease-out .6s forwards; animation: zoomIn ease-out .6s forwards; -webkit-animation: zoomIn ease-out .6s forwards } @-moz-keyframes zoomIn { from { -moz-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3) } to { opacity: 1; -moz-transform: none; transform: none } } @-o-keyframes zoomIn { from { transform: scale3d(.3, .3, .3) } to { opacity: 1; -o-transform: none; transform: none } } @keyframes zoomIn { from { -webkit-transform: scale3d(.3, .3, .3); -moz-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3) } to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; transform: none } } @-webkit-keyframes zoomIn { from { -webkit-transform: scale3d(.3, .3, .3) } to { opacity: 1; -webkit-transform: none } } /* 鍒嗕韩 */ .qrcode_mask { position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: #000; opacity: 0.5; z-index: 1999 } .qrcode { width: 180px; padding: 20px; position: fixed; z-index: 2000; left: 50%; top: 50%; margin-left: -120px; margin-top: -140px; background: #fff; z-index: 100000; font-size: 14px; text-align: center; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1) } .qrcode img { max-width: 100%; max-height: 100% } .qrcode p { margin: 10px 0 } .weixin_close { background: #0058A7; display: inline-block; width: 100%; height: 30px; line-height: 30px; text-align: center; color: #fff; text-decoration: none } /* flex */ .flex-row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .flex-wrap { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap } .flex { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex } .justify-start { -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .justify-end { -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .justify-center { -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .justify-between { -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .float-right { float: right } .float-left { float: left } .block { display: block; } .inline-block { display: inline-block } .fixed { position: fixed } .abs { position: absolute } .rel { position: relative; } .box-border { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .font-bold { font-weight: bold } .text-center { text-align: center } .text-right { text-align: right; } .text-justify { text-align: justify } .content-center { -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center } .align-center { -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center } .bg-white { background: #fff }