﻿/*
  HTML5 Reset :: style.css
  ----------------------------------------------------------
  We have learned much from/been inspired by/taken code where offered from:
  Eric Meyer          :: http://meyerweb.com
  HTML5 Doctor        :: http://html5doctor.com
  and the HTML5 Boilerplate :: http://html5boilerplate.com
-------------------------------------------------------------------------------*/
/*引入字体图库*/
@import url('iconfont.css');
[class*="Ic"] { font-family: "Ic" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
/*声明 WebFont*/
@font-face { font-family: 'NSL'; src: url('./font/HyundaiSansTextCN.eot'); src: url('./font/HyundaiSansTextCN.eot?#font-spider') format('embedded-opentype'),
    url('./font/HyundaiSansTextCN.ttf') format('truetype'),
    url('./font/HyundaiSansTextCN.woff') format('woff'),
    url('./font/HyundaiSansTextCN.svg') format('svg'); font-weight: normal; font-style: normal; }
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
/*@CHARSET "UTF-8";@media all and (min-width:721px){html{ font-size: 250%; }
}
@media all and (max-width:720px){html{ font-size: 250%; }
}
@media all and (max-width:640px){html{ font-size: 222.222%; }
}
@media all and (max-width:540px){html{ font-size: 187.5%; }
}
@media all and (max-width:480px){html{ font-size: 166.668%; }
}
@media all and (max-width:432px){html{ font-size: 150%; }
}
@media all and (max-width:414px){html{ font-size: 143.75%; }
}
@media all and (max-width:400px){html{ font-size: 138.888%; }
}
@media all and (max-width:384px){html{ font-size: 130.204%; }
}
@media all and (max-width:375px){html{ font-size: 130.204%; }
}
@media all and (max-width:360px){html{ font-size: 125%; }
}
@media all and (max-width:340px){html{ font-size: 118.056%; }
}
@media all and (max-width:320px){html{ font-size: 111.112%; }
}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,del,dfn,em,img,ins,kbd,q,samp,small,strong,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,table,tbody,tfoot,thead,tr,th,td,article,aside,footer,header,nav,section{ margin: 0; padding: 0; border: 0; outline: 0; }
html{ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(35,167,217,.5); }
body{ font-family: Arial,Helvetica,sans-serif,'Lucida Grande',Verdana; word-wrap: break-word; line-height: 1; min-width: 320px; background-color: #f5f5f5; margin: 0 auto; color: #333; }
h1,h2,h3,h4,h5,h6{ font-weight: normal; }
img{ border: 0; max-width: 100%; height: auto; vertical-align: top; }
ol,ul{ list-style: none; }
table{ border-collapse: collapse; border-spacing: 0; }
abbr,acronym{ border: 0; font-variant: normal; }
abbr[title]{ border-bottom: 1px dotted; }
del{ text-decoration: line-through; }
address,caption,cite,code,dfn,em,th,var{ font-style: normal; font-weight: 400; }
input[type=button],input[type=submit]{ padding: 0; -webkit-appearance: none; outline: 0; }
button,input[type=button]{ cursor: pointer; -webkit-appearance: button; }
a:active,a:focus,input:focus{ outline: 0; }
b{ font-weight: normal; }
a,input{ background-clip: padding-box; }
a{ text-decoration: none; color: #333; -webkit-tap-highlight-color: rgba(0,0,0,0); }
input,select,textarea{ font: .65em sans-serif,Helvetica,Arial,'Lucida Grande',Verdana; }
input[type=checkbox],input[type=radio]{ box-sizing: border-box; margin: 0; padding: 0; font-size: .5em; }
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder,select::-webkit-input-placeholder{ color: #ccc; }
input[type=text]{ border-radius: .72em; -webkit-border-radius: .72em; font-size: .7em; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; background-color: #fff; width: 3.43em; height: 1.72em; padding: 0 .6em; text-align: center; color: #888; vertical-align: middle; }
.textbox input{ border: 0 none; border-radius: 0; font-size: .65em; line-height: 1.5; width: 100%; height: auto; padding: .6em 0; text-align: left; color: #333; }
textarea{ border: 0 none; width: 100%; color: #333; height: 100%; vertical-align: middle; line-height: 1.2; resize: none; padding: .5em 2.4em .5em 0; box-sizing: border-box; }
.text-area textarea{ border: 1px solid #b2b2b2; border-radius: 1em; padding: 3%; }
*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary,input,select,button,input::-webkit-input-placeholder { margin: 0; padding: 0; border: 0; font-weight: normal; vertical-align: baseline; background: transparent; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-overflow-scrolling: touch; outline: none; text-decoration: none; }
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary,input,select,button,input::-webkit-input-placeholder,.h1, .h2, .h3, .h4, .h5, .h6 { font-family: "NSL","微软雅黑","Helvetica Neue", Helvetica, Arial, sans-serif; }
br{ font-family: "微软雅黑","Helvetica Neue", Helvetica, Arial, sans-serif; }
article, aside, figure, footer, header, nav, section, details, summary { display: block; }
/* Handle box-sizing while better addressing child elements:
   http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html { box-sizing: border-box; }
*,
*:before,
*:after { box-sizing: inherit; }
/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
/*img,
object,
embed { max-width: 100%; }
*/
/* force a vertical scrollbar to prevent a jumpy page */
/*html { overflow-y: scroll; }
*/
/*gavin edit*/
/* html { overflow-y: auto; }
*/
/* we use a lot of ULs that aren't bulleted.
  don't forget to restore the bullets within content. */
ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before,
blockquote:after,
q:before,
q:after { content: ''; content: none; }
a { margin: 0; padding: 0; vertical-align: baseline; background: transparent; }
a { text-decoration: none; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted #000; cursor: help; }
/* tables still need cellspacing="0" in the markup */
table { border-collapse: collapse; border-spacing: 0; }
th { font-weight: bold; vertical-align: bottom; }
td { font-weight: normal; vertical-align: top; }
hr { display: block; height: 0px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }
pre { white-space: pre; /* CSS2 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
    word-wrap: break-word; /* IE */; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
select, input, textarea { font: 99% sans-serif; }
table { font-size: inherit; font: 100%; }
small { font-size: 85%; }
strong { font-weight: bold; }
td, td img { vertical-align: top; }
/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
/* standardize any monospaced elements */
pre, code, kbd, samp { font-family: monospace, sans-serif; }
/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button { cursor: pointer; }
/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea { margin: 0; }
/* make buttons play nice in IE */
button,
input[type=button] { width: auto; overflow: visible; }
/* scale images in IE7 more attractively */
.ie7 img { -ms-interpolation-mode: bicubic; }
/* prevent BG image flicker upon hover
   (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html { filter: expression(document.execCommand("BackgroundImageCache", false, true)); }
*/
select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; }
/* 禁用select默认下拉箭头 */
select::-ms-expand{ display: none; }
/* 禁用PC端表单输入框默认清除按钮 */
/*input[type=text]::-ms-clear,input[type=tel]::-ms-clear,input[type=number]::-ms-clear{ display: none; }
*/
/* 禁用radio和checkbox默认样式 */
/*input[type=radio]::-ms-check,input[type=checkbox]::-ms-check{ display: none; }
*/
/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.line { margin: 0; padding: 0; }
.x1, .x2, .x3, .x4, .x5, .x6, .x7, .x8, .x9, .x10, .x11, .x12, .xl1, .xl2, .xl3, .xl4, .xl5, .xl6, .xl7, .xl8, .xl9, .xl10, .xl11, .xl12, .xs1, .xs2, .xs3, .xs4, .xs5, .xs6, .xs7, .xs8, .xs9, .xs10, .xs11, .xs12, .xm1, .xm2, .xm3, .xm4, .xm5, .xm6, .xm7, .xm8, .xm9, .xm10, .xm11, .xm12, .xb1, .xb2, .xb3, .xb4, .xb5, .xb6, .xb7, .xb8, .xb9, .xb10, .xb11, .xb12 { position: relative; min-height: 1px; }
.line-big { margin-left: -10px; margin-right: -10px; }
.line-big .x1, .line-big .x2, .line-big .x3, .line-big .x4, .line-big .x5, .line-big .x6, .line-big .x7, .line-big .x8, .line-big .x9, .line-big .x10, .line-big .x11, .line-big .x12, .line-big .xl1, .line-big .xl2, .line-big .xl3, .line-big .xl4, .line-big .xl5, .line-big .xl6, .line-big .xl7, .line-big .xl8, .line-big .xl9, .line-big .xl10, .line-big .xl11, .line-big .xl12, .line-big .xs1, .line-big .xs2, .line-big .xs3, .line-big .xs4, .line-big .xs5, .line-big .xs6, .line-big .xs7, .line-big .xs8, .line-big .xs9, .line-big .xs10, .line-big .xs11, .line-big .xs12, .line-big .xm1, .line-big .xm2, .line-big .xm3, .line-big .xm4, .line-big .xm5, .line-big .xm6, .line-big .xm7, .line-big .xm8, .line-big .xm9, .line-big .xm10, .line-big .xm11, .line-big .xm12, .line-big .xb1, .line-big .xb2, .line-big .xb3, .line-big .xb4, .line-big .xb5, .line-big .xb6, .line-big .xb7, .line-big .xb8, .line-big .xb9, .line-big .xb10, .line-big .xb11, .line-big .xb12 { position: relative; min-height: 1px; padding-right: 10px; padding-left: 10px; }
.line-middle { margin-left: -5px; margin-right: -5px; }
.line-middle .x1, .line-middle .x2, .line-middle .x3, .line-middle .x4, .line-middle .x5, .line-middle .x6, .line-middle .x7, .line-middle .x8, .line-middle .x9, .line-middle .x10, .line-middle .x11, .line-middle .x12, .line-middle .xl1, .line-middle .xl2, .line-middle .xl3, .line-middle .xl4, .line-middle .xl5, .line-middle .xl6, .line-middle .xl7, .line-middle .xl8, .line-middle .xl9, .line-middle .xl10, .line-middle .xl11, .line-middle .xl12, .line-middle .xs1, .line-middle .xs2, .line-middle .xs3, .line-middle .xs4, .line-middle .xs5, .line-middle .xs6, .line-middle .xs7, .line-middle .xs8, .line-middle .xs9, .line-middle .xs10, .line-middle .xs11, .line-middle .xs12, .line-middle .xm1, .line-middle .xm2, .line-middle .xm3, .line-middle .xm4, .line-middle .xm5, .line-middle .xm6, .line-middle .xm7, .line-middle .xm8, .line-middle .xm9, .line-middle .xm10, .line-middle .xm11, .line-middle .xm12, .line-middle .xb1, .line-middle .xb2, .line-middle .xb3, .line-middle .xb4, .line-middle .xb5, .line-middle .xb6, .line-middle .xb7, .line-middle .xb8, .line-middle .xb9, .line-middle .xb10, .line-middle .xb11, .line-middle .xb12 { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; }
.line-small { margin-left: -2px; margin-right: -2px; }
.line-small .x1, .line-small .x2, .line-small .x3, .line-small .x4, .line-small .x5, .line-small .x6, .line-small .x7, .line-small .x8, .line-small .x9, .line-small .x10, .line-small .x11, .line-small .x12, .line-small .xl1, .line-small .xl2, .line-small .xl3, .line-small .xl4, .line-small .xl5, .line-small .xl6, .line-small .xl7, .line-small .xl8, .line-small .xl9, .line-small .xl10, .line-small .xl11, .line-small .xl12, .line-small .xs1, .line-small .xs2, .line-small .xs3, .line-small .xs4, .line-small .xs5, .line-small .xs6, .line-small .xs7, .line-small .xs8, .line-small .xs9, .line-small .xs10, .line-small .xs11, .line-small .xs12, .line-small .xm1, .line-small .xm2, .line-small .xm3, .line-small .xm4, .line-small .xm5, .line-small .xm6, .line-small .xm7, .line-small .xm8, .line-small .xm9, .line-small .xm10, .line-small .xm11, .line-small .xm12, .line-small .xb1, .line-small .xb2, .line-small .xb3, .line-small .xb4, .line-small .xb5, .line-small .xb6, .line-small .xb7, .line-small .xb8, .line-small .xb9, .line-small .xb10, .line-small .xb11, .line-small .xb12 { position: relative; min-height: 1px; padding-right: 2px; padding-left: 2px; }
.x1, .x2, .x3, .x4, .x5, .x6, .x7, .x8, .x9, .x10, .x11, .x12 { float: left; }
.x1 { width: 8.33333333%; }
.x2 { width: 16.66666667%; }
.x3 { width: 25%; }
.x4 { width: 33.33333333%; }
.x5 { width: 41.66666667%; }
.x6 { width: 50%; }
.x7 { width: 58.33333333%; }
.x8 { width: 66.66666667%; }
.x9 { width: 75%; }
.x10 { width: 83.33333333%; }
.x11 { width: 91.66666667%; }
.x12 { width: 100%; }
.x0-left { left: 0; }
.x1-left { left: 8.33333333%; }
.x2-left { left: 16.66666667%; }
.x3-left { left: 25%; }
.x4-left { left: 33.33333333%; }
.x5-left { left: 41.66666667%; }
.x6-left { left: 50%; }
.x7-left { left: 58.33333333%; }
.x8-left { left: 66.66666667%; }
.x9-left { left: 75%; }
.x10-left { left: 83.33333333%; }
.x11-left { left: 91.66666667%; }
.x12-left { left: 100%; }
.x0-right { right: 0; }
.x1-right { right: 8.33333333%; }
.x2-right { right: 16.66666667%; }
.x3-right { right: 25%; }
.x4-right { right: 33.33333333%; }
.x5-right { right: 41.66666667%; }
.x6-right { right: 50%; }
.x7-right { right: 58.33333333%; }
.x8-right { right: 66.66666667%; }
.x9-right { right: 75%; }
.x10-right { right: 83.33333333%; }
.x11-right { right: 91.66666667%; }
.x12-right { right: 100%; }
.x0-move { margin-left: 0; }
.x1-move { margin-left: 8.33333333%; }
.x2-move { margin-left: 16.66666667%; }
.x3-move { margin-left: 25%; }
.x4-move { margin-left: 33.33333333%; }
.x5-move { margin-left: 41.66666667%; }
.x6-move { margin-left: 50%; }
.x7-move { margin-left: 58.33333333%; }
.x8-move { margin-left: 66.66666667%; }
.x9-move { margin-left: 75%; }
.x10-move { margin-left: 83.33333333%; }
.x11-move { margin-left: 91.66666667%; }
.x12-move { margin-left: 100%; }
/*gavin 公共部分*/
/* html,body{ width: 100%; height: 100%; position: relative; }
*/
.mobile-view{ position: absolute; top: 0px; right: 0px; left: 0px; bottom: 0px; overflow: hidden; z-index: 1; }
.mobile-page{ display: -webkit-box; display: -moz-box; display: box; display: -ms-flexbox; -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-box-orient: vertical; box-orient: vertical; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: flex; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; height: 100%; width: 100%; z-index: 1; position: relative; }
.mobile-page form{ display: -webkit-box; display: -moz-box; display: box; display: -ms-flexbox; -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-box-orient: vertical; box-orient: vertical; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: flex; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; height: 100%; width: 100%; z-index: 1; position: relative; }
.mobile-top{ -webkit-box-sizing: border-box; box-sizing: border-box; }
.mobile-main{ -webkit-box-flex: 1; -moz-box-flex: 1; -ms-box-flex: 1; box-flex: 1; -webkit-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; overflow: auto; height: 100%; position: relative; z-index: 1; }
.mobile-foot{ -webkit-box-sizing: border-box; box-sizing: border-box; }
a{ text-decoration: none; transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; }
a:hover{ text-decoration: none; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; /* color: #ffffff; */; }
button{ transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; }
button:hover{ transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; }
/*----------------------------------------------------------------------------------------*/
.image{ display: block; width: 100%; height: 100%; }
.image-gray{ background-color: #e5e5e5; }
.text-yc { overflow: hidden; text-overflow: ellipsis; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/*去除滚动条*/
.overflow-y { overflow-y: scroll; overflow-x: hidden; }
.overflow-y::-webkit-scrollbar { width: auto !important; width: 0 !important; }
.overflow-x { overflow-x: scroll; overflow-y: hidden; }
.overflow-x::-webkit-scrollbar { width: auto !important; width: 0 !important; }
[class*="flex-"] { display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
        display: -moz-box; /* Firefox 17- */
        display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
        display: -moz-flex; /* Firefox 18+ */
        display: -ms-flexbox; /* IE 10 */
        display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */; }
/*交叉轴上对齐 居中*/
.flex-level { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
/*交叉轴上对齐 元素第一行文字的基线对齐*/
.flex-bottom { -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
/*主轴对齐 左右 左中右 基于子元素的数量*/
.flex-lr{ -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
/*换行*/
.flex-br{ -webkit-box-wrap: wrap; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
/*主轴对齐 居右*/
.flex-right{ -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; }
/*主轴对齐 居中*/
.flex-center{ -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; }
/*cs3动画*/
/*动画放大*/
.dh-fd { overflow: hidden; }
.dh-fd .img{ transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; width: 100%; height: 100%; display: block; }
.dh-fd:hover .img{ transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; transform: scale(1.2); }
/*动画旋转*/
.dh-xz { cursor: pointer; }
.dh-xz .dh-xz-tp { transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; }
.dh-xz:hover .dh-xz-tp { transform: rotate(180deg); -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari and Chrome */; }
.mgt-10{margin-top: 10px;}
.mgt-15{margin-top: 15px;}
.mgt-20{margin-top: 20px;}
.mgt-60{margin-top: 60px}
.mgb-10{margin-bottom: 10px}
.mgt-50{margin-top: 50px}
.mgb-60{margin-bottom: 60px}
.mgt-0{margin-top: 0!important;}
.mgb-0{margin-bottom: 0!important;}
.pt-0{padding-top: 0!important;}
.pb-0{padding-bottom: 0!important;}
.pd-05-1{padding: 0 5%!important;}
.pt-60{padding-top: 60px!important;}
.pb-60{padding-bottom: 60px!important;}
.text-left{text-align: left!important;}
.dark-blue{color: #336E9B}
.text-right{text-align: right!important;}
.pl-10{padding-left: 10px!important;}
.pl-15{padding-left: 15px!important;}
.pl-20{padding-left: 20px!important;}
.pl-30{padding-left: 30px!important;}
.pl-50{padding-left: 50px!important;}
.vh100{height: 100vh}
.no-padding{padding: 0!important;}
.bold{font-weight: bold!important;}
.pr-15{padding-right: 15px!important;}
.color666{color: #666}
.ptb-60{padding: 60px 0!important;}