/*normalize*/
html { line-height: 1.15; -webkit-text-text-adjust: 100% }
body { margin: 0 }
main { display: block }
h1 { font-size: 2em; margin: 0.67em 0 }
hr { box-sizing: content-box; height: 0; overflow: visible }
pre { font-family: monospace, monospace; font-size: 1em }
a { background-color: transparent }
abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted }
b, strong { font-weight: bolder }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em }
small { font-size: 80% }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline }
sub { bottom: -0.25em }
sup { top: -0.5em }
img { border-style: none }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0 }
button, input { overflow: visible }
button, select { text-transform: none }
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button }
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0 }
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText }
fieldset { padding: 0.35em 0.75em 0.625em }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal }
progress { vertical-align: baseline }
textarea { overflow: auto }
[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0 }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto }
[type="search"] { -webkit-appearance: textfield; outline-offset: -2px }
[type="search"]::-webkit-search-decoration { -webkit-appearance: none }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit }
details { display: block }
summary { display: list-item }
template { display: none }
[hidden] { display: none }

/*reset*/
@charset "utf-8";
body { background-color: #fff; }
body, body * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, img, figure, figcaption { margin: 0; padding: 0; }
body, button, input, select, textarea { font: 12px/1.5 "sohne-var","Helvetica Neue","Arial","sans-serif", 'microsoft yahei', tahoma, Srial, helvetica, sans-serif; color: #333; }
form { display: block; }
em { font-style: normal; }
ul, ol, li { list-style: none; }
a { text-decoration: none; color: inherit; }
a:hover { text-decoration: none; color: inherit; }
img { border: 0px; }
table { border-collapse: collapse; border-spacing: 0; }
.al { float: left; }
.ar { float: right; text-align: right; }
.ac { text-align: center; }
.fl { float: left; }
.fr { float: right; }
.fn { float: none; }
.clear, .cb { clear: both; text-indent: -9999px; }
h1, h2, h3, h4, h5, h6 { margin: 0;}
* html .clf { height: 1%; }
.clf, .clearfix { display: block; }
.clf:after, .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.container { 
    width: 1080px;
    margin-left: auto;
    margin-right: auto; 
}
@media (max-width: 1080px) {
    .container{
        width: 100%;
    }
}

/*custom*/
a:hover { text-decoration: none; }
a.link:hover { opacity: .8; }
hr { height: 1px; border: 0; background-color: #ddd; margin: 15px 0; }
hr.hr-dashed { height: 0px; border-bottom: 1px dashed #ccc; background-color: transparent; margin: 15px 0; }
.overflow-auto { overflow: auto !important; }
.overflow-hidden { overflow: hidden !important; }
.opc-0 { opacity: 0; filter: opacity(0); }
.opc-2 { opacity: 0.2; filter: opacity(20); }
.opc-4 { opacity: 0.4; filter: opacity(40); }
.opc-6 { opacity: 0.6; filter: opacity(60); }
.opc-8 { opacity: 0.8; filter: opacity(80); }
.trans-2 { -webkit-transition: .2s all; transition: .2s all; }
.trans-3 { -webkit-transition: .3s all; transition: .3s all; }
.trans-5 { -webkit-transition: .5s all; transition: .5s all; }
.rotate-90 { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.rotate-360 { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
ul { padding-left: 0 }
.list-style li { list-style: none; position: relative; }
.list-style-line li, .list-style-square li, .list-style-disc li, .list-style-circle li { padding-left: 20px; }
.list-style-line li:before, .list-style-square li:before, .list-style-disc li:before, .list-style-circle li:before { content: ''; position: absolute; top: 50%; left: 0; width: 10px; height: 10px; background-color: #555; }
.list-style-line li:before { width: 10px; height: 1px; }
.list-style-square li:before { width: 10px; height: 10px; margin-top: -5px; }
.list-style-disc li:before { width: 10px; height: 10px; margin-top: -5px; border-radius: 100%; }
.list-style-circle li:before { width: 10px; height: 10px; margin-top: -5px; background-color: transparent; border: 1px solid #555; border-radius: 100%; }
.list-style.list-style-top li:before { top: 0; margin-top: 0; }
.list-style-primary li:before { background-color: #3370FF; }
.list-style-blue li:before { background-color: #0099ff; }
.list-style-indigo li:before { background-color: #6610f2; }
.list-style-purple li:before { background-color: #6f42c1; }
.list-style-pink li:before { background-color: #e83e8c; }
.list-style-red li:before { background-color: #dc3545; }
.list-style-orange li:before { background-color: #fd7e14; }
.list-style-yellow li:before { background-color: #ffc107; }
.list-style-green li:before { background-color: #28a745; }
.list-style-teal li:before { background-color: #20c997; }
.list-style-cyan li:before { background-color: #17a2b8; }
.list-style-white li:before { background-color: #fff; }
.list-style-gray li:before { background-color: #6c757d; }
.list-style-gray-dark li:before { background-color: #343a40; }
.list-style-secondary li:before { background-color: #6c757d; }
.list-style-success li:before { background-color: #28a745; }
.list-style-info li:before { background-color: #17a2b8; }
.list-style-warning li:before { background-color: #ffc107; }
.list-style-danger li:before { background-color: #dc3545; }
.list-style-light li:before { background-color: #f8f9fa; }
.list-style-dark li:before { background-color: #343a40; }
.list-style-circle.list-style-primary li:before { background-color: transparent; border-color: #3370FF; }
.list-style-circle.list-style-blue li:before { background-color: transparent; border-color: #0099ff; }
.list-style-circle.list-style-indigo li:before { background-color: transparent; border-color: #6610f2; }
.list-style-circle.list-style-purple li:before { background-color: transparent; border-color: #6f42c1; }
.list-style-circle.list-style-pink li:before { background-color: transparent; border-color: #e83e8c; }
.list-style-circle.list-style-red li:before { background-color: transparent; border-color: #dc3545; }
.list-style-circle.list-style-orange li:before { background-color: transparent; border-color: #fd7e14; }
.list-style-circle.list-style-yellow li:before { background-color: transparent; border-color: #ffc107; }
.list-style-circle.list-style-green li:before { background-color: transparent; border-color: #28a745; }
.list-style-circle.list-style-teal li:before { background-color: transparent; border-color: #20c997; }
.list-style-circle.list-style-cyan li:before { background-color: transparent; border-color: #17a2b8; }
.list-style-circle.list-style-white li:before { background-color: transparent; border-color: #fff; }
.list-style-circle.list-style-gray li:before { background-color: transparent; border-color: #6c757d; }
.list-style-circle.list-style-gray-dark li:before { background-color: transparent; border-color: #343a40; }
.list-style-circle.list-style-secondary li:before { background-color: transparent; border-color: #d7b737; }
.list-style-circle.list-style-success li:before { background-color: transparent; border-color: #28a745; }
.list-style-circle.list-style-info li:before { background-color: transparent; border-color: #17a2b8; }
.list-style-circle.list-style-warning li:before { background-color: transparent; border-color: #ffc107; }
.list-style-circle.list-style-danger li:before { background-color: transparent; border-color: #dc3545; }
.list-style-circle.list-style-light li:before { background-color: transparent; border-color: #f8f9fa; }
.list-style-circle.list-style-dark li:before { background-color: transparent; border-color: #343a40; }
.m-0 { margin: 0 !important }
.mr-3, .mx-3 { margin-right: 3px !important }
.ml-3, .mx-3 { margin-left: 3px !important }
.mt-3, .my-3 { margin-top: 3px !important }
.mb-3, .my-3 { margin-bottom: 3px !important }
.m-3 { margin: 3px !important }
.mr-5, .mx-5 { margin-right: 5px !important }
.ml-5, .mx-5 { margin-left: 5px !important }
.mt-5, .my-5 { margin-top: 5px !important }
.mb-5, .my-5 { margin-bottom: 5px !important }
.m-5 { margin: 5px !important }
.mr-10, .mx-10 { margin-right: 10px !important }
.ml-10, .mx-10 { margin-left: 10px !important }
.mt-10, .my-10 { margin-top: 10px !important }
.mb-10, .my-10 { margin-bottom: 10px !important }
.m-10 { margin: 10px !important }
.mr-15, .mx-15 { margin-right: 15px !important }
.ml-15, .mx-15 { margin-left: 15px !important }
.mt-15, .my-15 { margin-top: 15px !important }
.mb-15, .my-15 { margin-bottom: 15px !important }
.m-15 { margin: 15px !important }
.mr-20, .mx-20 { margin-right: 20px !important }
.ml-20, .mx-20 { margin-left: 20px !important }
.mt-20, .my-20 { margin-top: 20px !important }
.mb-20, .my-20 { margin-bottom: 20px !important }
.m-20 { margin: 20px !important }
.mr-25, .mx-25 { margin-right: 25px !important }
.ml-25, .mx-25 { margin-left: 25px !important }
.mt-25, .my-25 { margin-top: 25px !important }
.mb-25, .my-25 { margin-bottom: 25px !important }
.m-25 { margin: 25px !important }
.mr-32, .mx-32 { margin-right: 32px !important }
.ml-32, .mx-32 { margin-left: 32px !important }
.mt-32, .my-32 { margin-top: 32px !important }
.mb-32, .my-32 { margin-bottom: 32px !important }
.m-30 { margin: 30px !important }
.mr-35, .mx-35 { margin-right: 35px !important }
.ml-35, .mx-35 { margin-left: 35px !important }
.mt-35, .my-35 { margin-top: 35px !important }
.mb-35, .my-35 { margin-bottom: 35px !important }
.m-35 { margin: 35px !important }
.mr-40, .mx-40 { margin-right: 40px !important }
.ml-40, .mx-40 { margin-left: 40px !important }
.mt-40, .my-40 { margin-top: 40px !important }
.mb-40, .my-40 { margin-bottom: 40px !important }
.m-40 { margin: 40px !important }
.mr-45, .mx-45 { margin-right: 45px !important }
.ml-45, .mx-45 { margin-left: 45px !important }
.mt-45, .my-45 { margin-top: 45px !important }
.mb-45, .my-45 { margin-bottom: 45px !important }
.m-45 { margin: 45px !important }
.mr-50, .mx-50 { margin-right: 50px !important }
.ml-50, .mx-50 { margin-left: 50px !important }
.mt-50, .my-50 { margin-top: 50px !important }
.mb-50, .my-50 { margin-bottom: 50px !important }
.m-50 { margin: 50px !important }
.mr-60, .mx-60 { margin-right: 60px !important }
.ml-60, .mx-60 { margin-left: 60px !important }
.mt-60, .my-60 { margin-top: 60px !important }
.mb-60, .my-60 { margin-bottom: 60px !important }
.m-60 { margin: 60px !important }
.mr-70, .mx-70 { margin-right: 70px !important }
.ml-70, .mx-70 { margin-left: 70px !important }
.mt-70, .my-70 { margin-top: 70px !important }
.mb-70, .my-70 { margin-bottom: 70px !important }
.m-70 { margin: 70px !important }
.mr-80, .mx-80 { margin-right: 80px !important }
.ml-80, .mx-80 { margin-left: 80px !important }
.mt-80, .my-80 { margin-top: 80px !important }
.mb-80, .my-80 { margin-bottom: 80px !important }
.m-80 { margin: 80px !important }
.mr-100, .mx-100 { margin-right: 100px !important }
.ml-100, .mx-100 { margin-left: 100px !important }
.mt-100, .my-100 { margin-top: 100px !important }
.mb-100, .my-100 { margin-bottom: 100px !important }
.m-100 { margin: 100px !important }
.mr--30, .mx--30 { margin-right: -30px !important }
.ml--30, .mx--30 { margin-left: -30px !important }
.mt--30, .my--30 { margin-top: -30px !important }
.mb--30, .my--30 { margin-bottom: -30px !important }
.p-0 { padding: 0 !important }
.pr-3, .px-3 { padding-right: 3px !important }
.pl-3, .px-3 { padding-left: 3px !important }
.pt-3, .py-3 { padding-top: 3px !important }
.pb-3, .py-3 { padding-bottom: 3px !important }
.p-3 { padding: 3px !important }
.pr-5, .px-5 { padding-right: 5px !important }
.pl-5, .px-5 { padding-left: 5px !important }
.pt-5, .py-5 { padding-top: 5px !important }
.pb-5, .py-5 { padding-bottom: 5px !important }
.p-5 { padding: 5px !important }
.pr-10, .px-10 { padding-right: 10px !important }
.pl-10, .px-10 { padding-left: 10px !important }
.pt-10, .py-10 { padding-top: 10px !important }
.pb-10, .py-10 { padding-bottom: 10px !important }
.p-10 { padding: 10px !important }
.pr-15, .px-15 { padding-right: 15px !important }
.pl-15, .px-15 { padding-left: 15px !important }
.pt-15, .py-15 { padding-top: 15px !important }
.pb-15, .py-15 { padding-bottom: 15px !important }
.p-15 { padding: 15px !important }
.pr-20, .px-20 { padding-right: 20px !important }
.pl-20, .px-20 { padding-left: 20px !important }
.pt-20, .py-20 { padding-top: 20px !important }
.pb-20, .py-20 { padding-bottom: 20px !important }
.p-20 { padding: 20px !important }
.pr-25, .px-25 { padding-right: 25px !important }
.pl-25, .px-25 { padding-left: 25px !important }
.pt-25, .py-25 { padding-top: 25px !important }
.pb-25, .py-25 { padding-bottom: 25px !important }
.p-25 { padding: 25px !important }
.pr-30, .px-30 { padding-right: 30px !important }
.pl-30, .px-30 { padding-left: 30px !important }
.pt-30, .py-30 { padding-top: 30px !important }
.pb-30, .py-30 { padding-bottom: 30px !important }
.p-30 { padding: 30px !important }
.pr-35, .px-35 { padding-right: 35px !important }
.pl-35, .px-35 { padding-left: 35px !important }
.pt-35, .py-35 { padding-top: 35px !important }
.pb-35, .py-35 { padding-bottom: 35px !important }
.p-35 { padding: 35px !important }
.pr-40, .px-40 { padding-right: 40px !important }
.pl-40, .px-40 { padding-left: 40px !important }
.pt-40, .py-40 { padding-top: 40px !important }
.pb-40, .py-40 { padding-bottom: 40px !important }
.p-40 { padding: 40px !important }
.pr-45, .px-45 { padding-right: 45px !important }
.pl-45, .px-45 { padding-left: 45px !important }
.pt-45, .py-45 { padding-top: 45px !important }
.pb-45, .py-45 { padding-bottom: 45px !important }
.p-45 { padding: 45px !important }
.pr-50, .px-50 { padding-right: 50px !important }
.pl-50, .px-50 { padding-left: 50px !important }
.pt-50, .py-50 { padding-top: 50px !important }
.pb-50, .py-50 { padding-bottom: 50px !important }
.p-50 { padding: 50px !important }
.pr-60, .px-60 { padding-right: 60px !important }
.pl-60, .px-60 { padding-left: 60px !important }
.pt-60, .py-60 { padding-top: 60px !important }
.pb-60, .py-60 { padding-bottom: 60px !important }
.p-60 { padding: 60px !important }
.pr-70, .px-70 { padding-right: 70px !important }
.pl-70, .px-70 { padding-left: 70px !important }
.pt-70, .py-70 { padding-top: 70px !important }
.pb-70, .py-70 { padding-bottom: 70px !important }
.p-70 { padding: 70px !important }
.pr-80, .px-80 { padding-right: 80px !important }
.pl-80, .px-80 { padding-left: 80px !important }
.pt-80, .py-80 { padding-top: 80px !important }
.pb-80, .py-80 { padding-bottom: 80px !important }
.p-80 { padding: 80px !important }
.pr-100, .px-100 { padding-right: 100px !important }
.pl-100, .px-100 { padding-left: 100px !important }
.pt-100, .py-100 { padding-top: 100px !important }
.pb-100, .py-100 { padding-bottom: 100px !important }
.p-100 { padding: 100px !important }
.m--30 { margin: -30px !important }
.mr--25, .mx--25 { margin-right: -25px !important }
.ml--25, .mx--25 { margin-left: -25px !important }
.mt--25, .my--25 { margin-top: -25px !important }
.mb--25, .my--25 { margin-bottom: -25px !important }
.m--25 { margin: -25px !important }
.mr--20, .mx--20 { margin-right: -20px !important }
.ml--20, .mx--20 { margin-left: -20px !important }
.mt--20, .my--20 { margin-top: -20px !important }
.mb--20, .my--20 { margin-bottom: -20px !important }
.m--20 { margin: -20px !important }
.mr--15, .mx--15 { margin-right: -15px !important }
.ml--15, .mx--15 { margin-left: -15px !important }
.mt--15, .my--15 { margin-top: -15px !important }
.mb--15, .my--15 { margin-bottom: -15px !important }
.m--15 { margin: -15px !important }
.mr--10, .mx--10 { margin-right: -10px !important }
.ml--10, .mx--10 { margin-left: -10px !important }
.mt--10, .my--10 { margin-top: -10px !important }
.mb--10, .my--10 { margin-bottom: -10px !important }
.m--10 { margin: -10px !important }
.mr--5, .mx--5 { margin-right: -5px !important }
.ml--5, .mx--5 { margin-left: -5px !important }
.mt--5, .my--5 { margin-top: -5px !important }
.mb--5, .my--5 { margin-bottom: -5px !important }
.m--5 { margin: -5px !important }
.mr--3, .mx--3 { margin-right: -3px !important }
.ml--3, .mx--3 { margin-left: -3px !important }
.mt--3, .my--3 { margin-top: -3px !important }
.mb--3, .my--3 { margin-bottom: -3px !important }
.m--3 { margin: -3px !important }
.mr--1, .mx--1 { margin-right: -1px !important }
.ml--1, .mx--1 { margin-left: -1px !important }
.mt--1, .my--1 { margin-top: -1px !important }
.mb--1, .my--1 { margin-bottom: -1px !important }
.m--1 { margin: -1px !important }
.mr-auto, .mx-auto { margin-right: auto !important }
.ml-auto, .mx-auto { margin-left: auto !important }
.mt-auto, .my-auto { margin-top: auto !important }
.mb-auto, .my-auto { margin-bottom: auto !important }
.m-auto { margin: auto !important }
.w-1 { width: 1px !important }
.w-2 { width: 2px !important }
.w-3 { width: 3px !important }
.w-4 { width: 4px !important }
.w-5 { width: 5px !important }
.w-6 { width: 6px !important }
.w-8 { width: 8px !important }
.w-10 { width: 10px !important }
.w-20 { width: 20px !important }
.w-30 { width: 30px !important }
.w-40 { width: 40px !important }
.w-50 { width: 50px !important }
.w-60 { width: 60px !important }
.w-80 { width: 80px !important }
.w-100 { width: 100px !important }
.w-120 { width: 120px !important }
.w-150 { width: 150px !important }
.w-160 { width: 160px !important }
.w-200 { width: 200px !important }
.w-250 { width: 250px !important }
.w-300 { width: 300px !important }
.w-350 { width: 350px !important }
.w-400 { width: 400px !important }
.w-450 { width: 450px !important }
.w-500 { width: 500px !important }
.w-p5 { width: 5% !important }
.w-p10 { width: 10% !important }
.w-p15 { width: 15% !important }
.w-p20 { width: 20% !important }
.w-p25 { width: 25% !important }
.w-p30 { width: 30% !important }
.w-p33 { width: 33.3333% !important }
.w-p50 { width: 50% !important }
.w-p75 { width: 75% !important }
.w-p100 { width: 100% !important }
.h-1 { height: 1px !important }
.h-2 { height: 2px !important }
.h-3 { height: 3px !important }
.h-4 { height: 4px !important }
.h-5 { height: 5px !important }
.h-6 { height: 6px !important }
.h-8 { height: 8px !important }
.h-10 { height: 10px !important }
.h-10 { height: 10px !important }
.h-20 { height: 20px !important }
.h-30 { height: 30px !important }
.h-40 { height: 40px !important }
.h-50 { height: 50px !important }
.h-45 { height: 45px !important }
.h-60 { height: 60px !important }
.h-80 { height: 80px !important }
.h-100 { height: 100px !important }
.h-120 { height: 120px !important }
.h-140 { height: 140px !important }
.h-150 { height: 150px !important }
.h-160 { height: 160px !important }
.h-200 { height: 200px !important }
.h-250 { height: 250px !important }
.h-300 { height: 300px !important }
.h-350 { height: 350px !important }
.h-400 { height: 400px !important }
.h-450 { height: 450px !important }
.h-500 { height: 500px !important }
.h-600 { height: 600px !important }
.h-p5 { height: 5% !important }
.h-p10 { height: 10% !important }
.h-p15 { height: 15% !important }
.h-p20 { height: 20% !important }
.h-p25 { height: 25% !important }
.h-p30 { height: 30% !important }
.h-p33 { height: 33.3333% !important }
.h-p50 { height: 50% !important }
.h-p75 { height: 75% !important }
.h-p100 { height: 100% !important }
.w-auto { width: auto !important }
.h-auto { height: auto !important }
.w-full { width: 100% !important }
.h-full { height: 100% !important }
.mw-100 { max-width: 100% !important }
.mh-100 { max-height: 100% !important }

/*
font-size
 */
.text-12 { font-size: 12px !important; }
.text-14 { font-size: 14px !important; }
.text-15 { font-size: 15px !important; }
.text-16 { font-size: 16px !important; }
.text-18 { font-size: 18px !important; }
.text-20 { font-size: 20px !important; }
.text-22 { font-size: 22px !important; }
.text-24 { font-size: 24px !important; }
.text-26 { font-size: 26px !important; }
.text-28 { font-size: 28px !important; }
.text-30 { font-size: 30px !important; }
.text-32 { font-size: 32px !important; }
.text-34 { font-size: 34px !important; }
.text-40 { font-size: 40px !important; }
.text-50 { font-size: 50px !important; }
.text-60 { font-size: 60px !important; }
.text-70 { font-size: 70px !important; }
.text-80 { font-size: 80px !important; }

/*
font-weight
 */
.font-weight-300 { font-weight: 300 !important; }
.font-weight-600 { font-weight: 600 !important; }

/*
radius
 */
.radius-0 { border-radius: 0px !important; }
.radius-2 { border-radius: 2px !important; }
.radius-4 { border-radius: 4px !important; }
.radius-6 { border-radius: 6px !important; }
.radius-10 { border-radius: 10px !important; }
.radius-p100 { border-radius: 100% !important; }
.radius-0-tl { border-top-left-radius: 0 !important; }
.radius-0-tr { border-top-right-radius: 0 !important; }
.radius-0-br { border-bottom-right-radius: 0 !important; }
.radius-0-bl { border-bottom-left-radius: 0 !important; }
.lh-1 { line-height: 1em !important }
.lh-15 { line-height: 1.5em !important }
.lh-2 { line-height: 2em !important }
.lh-20 { line-height: 20px !important }
.lh-22 { line-height: 22px !important }
.lh-24 { line-height: 24px !important }
.lh-25 { line-height: 25px !important }
.lh-28 { line-height: 28px !important }
.lh-30 { line-height: 30px !important }
.lh-34 { line-height: 34px !important }
.lh-38 { line-height: 38px !important }
.lh-40 { line-height: 40px !important }
.lh-45 { line-height: 45px !important }
.lh-50 { line-height: 50px !important }
.lh-60 { line-height: 60px !important }
.lh-70 { line-height: 70px !important }
.lh-80 { line-height: 80px !important }
.lh-100 { line-height: 100px !important }
.hr-theme-1 { position: relative; }
.hr-theme-1:after { content: ''; display: block; width: 80px; height: 5px; position: absolute; left: 0; top: -3px; background: #bbb; }
.hr-theme-1.text-center:after { left: 50%; margin-left: -40px; }
.hr-theme-1.text-right:after { left: auto; right: 0; }
.hr-theme-2 { position: relative; }
.hr-theme-2:after { content: ''; display: block; width: 100px; height: 1px; position: absolute; left: 0; bottom: 0px; background: #bbb; }
.hr-theme-2.text-center:after { left: 50%; margin-left: -40px; }
.hr-theme-2.text-right:after { left: auto; right: 0; }
.hr-primary:after { background: #3370FF; }
.hr-blue:after { background: #0099ff; }
.hr-indigo:after { background: #6610f2; }
.hr-purple:after { background: #6f42c1; }
.hr-pink:after { background: #e83e8c; }
.hr-red:after { background: #dc3545; }
.hr-orange:after { background: #fd7e14; }
.hr-yellow:after { background: #ffc107; }
.hr-green:after { background: #28a745; }
.hr-teal:after { background: #20c997; }
.hr-cyan:after { background: #17a2b8; }
.hr-white:after { background: #fff; }
.hr-gray:after { background: #6c757d; }
.hr-gray-dark:after { background: :#343a40; }
.hr-secondary:after { background: #d7b737; }
.hr-success:after { background: #28a745; }
.hr-info:after { background: #17a2b8; }
.hr-warning:after { background: #ffc107; }
.hr-danger:after { background: #dc3545; }
.hr-light:after { background: #f8f9fa; }
.hr-dark:after { background: #343a40; }
.color-inherit { color: inherit !important; }
.bg-transparent { background-color: transparent !important }
.bg-white { background-color: #fff !important }
.bg-white-op2 { background-color: rgba(255, 255, 255, 0.2) !important; }
.bg-white-op4 { background-color: rgba(255, 255, 255, 0.4) !important; }
.bg-white-op6 { background-color: rgba(255, 255, 255, 0.6) !important; }
.bg-white-op8 { background-color: rgba(255, 255, 255, 0.8) !important; }
.bg-white-op9 { background-color: rgba(255, 255, 255, 0.9) !important; }
.bg-black { background-color: #212121 !important }
.bg-black-op2 { background-color: rgba(0, 0, 0, 0.2) !important; }
.bg-black-op4 { background-color: rgba(0, 0, 0, 0.4) !important; }
.bg-black-op6 { background-color: rgba(0, 0, 0, 0.6) !important; }
.bg-black-op8 { background-color: rgba(0, 0, 0, 0.8) !important; }
.bg-primary { background-color: rgb(51, 118, 246) !important }
.bg-primary-op2 { background-color: rgba(51, 118, 246, 0.2) !important; }
.bg-primary-op4 { background-color: rgba(51, 118, 246, 0.4) !important; }
.bg-primary-op6 { background-color: rgba(51, 118, 246, 0.6) !important; }
.bg-primary-op8 { background-color: rgba(51, 118, 246, 0.8) !important; }
.bg-light-primary { background-color: #356cd8 !important; }
.relative{position: relative;}
.absolute{ position: absolute; }
.top-0 { top: 0; }
.left-0 { left: 0; }
.right-0 { right: 0; }
.bottom-0 { bottom: 0; }
.top-10 { top: 10px; }
.right-10 { right: 10px; }
.left-10 { top: 10px; }
.bottom-10 { bottom: 10px; }
.top-auto { top: auto; }
.left-auto { left: auto; }
.right-auto { right: auto; }
.bottom-auto { bottom: auto; }
.vertical-align { font-size: 0 }
.vertical-align:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; }
.vertical-align-bottom, .vertical-align-middle { display: inline-block; max-width: 100%; font-size: inherit; }
.vertical-align-middle { vertical-align: middle }
.vertical-align-bottom { vertical-align: bottom }
.inline { display: inline !important }
.inline-block { display: inline-block !important }
.block { display: block !important }
.hidden-xs-up, .hidden-xxl-down { display: none !important }
.text-break { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-wrap: break-word }
.text-top { vertical-align: top !important }
.text-middle { vertical-align: middle !important }
.text-bottom { vertical-align: bottom !important }
.text-left { text-align: left !important }
.text-right { text-align: right !important }
.text-center { text-align: center !important }
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-uppercase { text-transform: uppercase; }
.text-lowercase { text-transform: lowercase; }
.text-underline { text-decoration: underline; }
.word-space-xs { word-spacing: .1em; }
.word-space-sm { word-spacing: .2em; }
.word-space-md { word-spacing: .3em; }
.word-space-la { word-spacing: .4em; }
.letter-space--xs { letter-spacing: -.02em; }
.letter-space-xs { letter-spacing: .02em; }
.letter-space-sm { letter-spacing: .04em; }
.letter-space-md { letter-spacing: .06em; }
.letter-space-la { letter-spacing: .08em; }
.cover-background { height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover }
.overlay { position: relative; -webkit-transform: translateZ(0); transform: translateZ(0); overflow: hidden; }
.overlay-panel { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 20px; color: #fff }
.overlay-panel a:not([class]) { color: inherit; text-decoration: underline }
.overlay-icon .icon { text-decoration: none }
.overlay-hover:not(:hover) .overlay-panel:not(.overlay-background-fixed) { opacity: 0 }
.overlay-background { background: rgba(0, 0, 0, .5) }
.overlay-image { padding: 0 }
.overlay-shade { background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, .87) 90%, #fff 100%) rgba(0, 0, 0, 0); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, .87) 90%, #fff 100%) rgba(0, 0, 0, 0) }
.overlay-top { bottom: auto }
.overlay-bottom { top: auto }
.overlay-left { right: auto }
.overlay-right { left: auto }
.overlay-icon { font-size: 0; text-align: center }
.overlay-icon:before { height: 100% }
.overlay-icon .icon { width: 2.286rem; height: 2.286rem; margin-right: 10px; margin-left: 10px; font-size: 2.286rem; line-height: 1; color: #fff }
.overlay-anchor { position: absolute; top: 0; right: 0; bottom: 0; left: 0 }
.overlay-blur, .overlay-fade, .overlay-grayscale, .overlay-scale, .overlay-spin, [class*=overlay-slide] { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: opacity transform filter; transition-property: opacity transform filter }
.overlay-fade { opacity: .7 }
.overlay-hovered .overlay-fade, .overlay-hover:hover .overlay-fade { opacity: 1 }
.overlay-fadeed { opacity: 1 !important }
.overlay-scale { -webkit-transform: scale(1); transform: scale(1) }
.overlay-hovered .overlay-scale, .overlay-hover:hover .overlay-scale { -webkit-transform: scale(1.1); transform: scale(1.1) }
.overlay-spin { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0) }
.overlay-hovered .overlay-spin, .overlay-hover:hover .overlay-spin { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg) }
.overlay-grayscale { -webkit-filter: grayscale(100%); filter: grayscale(100%) }
.overlay-hovered .overlay-grayscale, .overlay-hover:hover .overlay-grayscale { -webkit-filter: grayscale(0); filter: grayscale(0) }
[class*=overlay-slide] { opacity: 0 }
.overlay-slide-top { -webkit-transform: translateY(-100%); transform: translateY(-100%) }
.overlay-slide-bottom { -webkit-transform: translateY(100%); transform: translateY(100%) }
.overlay-slide-left { -webkit-transform: translateX(-100%); transform: translateX(-100%) }
.overlay-slide-right { -webkit-transform: translateX(100%); transform: translateX(100%) }
.overlay-hovered [class*=overlay-slide], .overlay-hover:hover [class*=overlay-slide] { opacity: 1; -webkit-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0) }

/*size*/
.text-xl { font-size: 1.2em; }
.text-xxl { font-size: 1.4em; }
.text-xxxl { font-size: 1.6em; }

/*
icon-circle
 */
.icon-circle { position: relative; display: inline-block; width: 40px; height: 40px; border-radius: 100%; text-align: center; line-height: 40px; overflow: hidden; font-size: 16px; vertical-align: middle; }
.icon-circle.icon-circle-dot { width: 6px; height: 6px; background: #888; }
.icon-circle img { max-width: 100%; max-height: 100%; }
.icon-circle.icon-circle-sm { width: 30px; height: 30px; line-height: 30px; font-size: 14px; }
.icon-circle.icon-circle-lg { width: 50px; height: 50px; line-height: 50px; font-size: 18px; }
.icon-circle.icon-circle-xl { width: 60px; height: 60px; line-height: 60px; font-size: 20px; }
.icon-circle.icon-circle-xxl { width: 80px; height: 80px; line-height: 80px; font-size: 24px; }
.icon-circle.icon-circle-xxxl { width: 100px; height: 100px; line-height: 100px; font-size: 30px; }
.icon-circle.border-1 { line-height: 38px; }
.icon-circle.icon-circle-fillet { border-radius: 0.3rem; }
.icon-circle.icon-circle-square { border-radius: 0; }
.icon-circle.icon-circle-sm.border-1 { line-height: 28px; }
.icon-circle.icon-circle-lg.border-1 { line-height: 48px; }
.icon-circle.icon-circle-xl.border-1 { line-height: 58px; }
.icon-circle.icon-circle-xxl.border-1 { line-height: 78px; }
.icon-circle.icon-circle-xxxl.border-1 { line-height: 98px; }
.icon-badge { width: 42px; height: 42px; background: #eee; border-radius: 6px; display: inline-block; line-height: 42px; text-align: center; color: #999; }
.icon-circle.icon-circle-theme-1:before, .icon-circle.icon-circle-theme-1:after { position: absolute; content: ''; display: block; width: 80%; height: 80%; background-color: rgba(255, 255, 255, 0.1); border-radius: 50%; }
.icon-circle.icon-circle-theme-1:after { width: 50%; height: 50%; bottom: 0; right: 0; background-color: rgba(255, 255, 255, 0.1); }
.icon-circle.icon-circle-theme-2:before, .icon-circle.icon-circle-theme-2:after { position: absolute; top: 3%; left: 3%; content: ''; display: block; width: 94%; height: 94%; border: 2px solid  rgba(255, 255, 255, 0.6); border-radius: 50%; }
.icon-circle.icon-circle-theme-2:after { top: 8%; left: 8%; width: 84%; height: 84%; bottom: 0; right: 0; border: 1px solid  rgba(255, 255, 255, 0.4); }
.icon-circle.icon-circle-theme-3:before, .icon-circle.icon-circle-theme-3:after { position: absolute; top: 0; left: 10%; content: ''; display: block; width: 2px; height: 100%; background: rgba(255, 255, 255, 0.4); }
.icon-circle.icon-circle-theme-3:after { top: 10%; left: 0; width: 100%; height: 2px; }
.icon-circle.icon-circle-theme-4:before { position: absolute; top: 6%; left: 6%; content: ''; display: block; width: 88%; height: 88%; background: rgba(0, 0, 0, 0.1); border-radius: 50%; box-shadow: 0 0 14px rgba(100, 100, 100, 0.1); }
.icon-circle.shadow>i { -webkit-filter: drop-shadow(rgba(100, 100, 100, 0.2) 0px 0px 2px); filter: drop-shadow(rgba(100, 100, 100, 0.2) 0px 0px 2px); }

/*btn*/
.btn { 
    display: inline-block;
    height: 32px;
    padding: 4px 32px 4px 16px;
    font-weight: 400;
    text-align: left;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 0;
    font-size: 15px;
    line-height: 24px;
    font-weight: 400;
    border-radius: 0;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    background: linear-gradient(273.23deg, #3974FF 2.92%, #6A96FE 98.48%);
    color: #fff;
    border-radius: 18px;
    position: relative;
    font-weight: 400;
}
.btn:after{
    content: '';
    position: absolute;
    top: 50%;
    right: 18px;
    display: block;
    width: 6px;
    height: 8px;
    margin-top: -4px;
    background: url(../images/btn_arrow.svg) center center no-repeat;
    background-size: contain;
}
.btn:hover { 
    background-color: #3370FF; 
    color: #fff;
}
.btn.btn-white{
	background: #fff;
	color: #3370FF;
}
.btn.btn-white:after{
    background: url(../images/btn_arrow_blue.svg) center center no-repeat;
}
.btn-primary{
    display: inline-block;
    padding: 0 34px;
    height: 50px;
    line-height: 50px;
    background: #3370FF;
    border-radius: 4px;
    color: #FAFAFA;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    border: 0;
    cursor: pointer;
}
.btn-primary:hover { 
    background-color: #2056ba; 
    color: #fff;
}
.btn-primary.round{
    border-radius: 25px;
}
.btn-primary-plain{
    display: inline-block;
    padding: 0 34px;
    height: 50px;
    line-height: 50px;
    border: #3370FF 1px solid;
    border-radius: 4px;
    color: #3370FF;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
}
.btn-primary-plain:hover { 
    border-color: #2056ba; 
    color: #3370FF;
}
.dropdown, .dropleft, .dropright, .dropup { position: relative; }
.dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 100px; padding: 0; margin: 3px 0 0; font-size: 12px; color: #212529; text-align: left; list-style: none; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .15); border-radius: .25rem; }
.dropdown-menu[x-placement^=bottom], .dropdown-menu[x-placement^=left], .dropdown-menu[x-placement^=right], .dropdown-menu[x-placement^=top] { right: auto; bottom: auto; }
.dropdown-menu.show { display: block; }
.dropdown-item { display: block; width: 100%; padding: 5px 10px; clear: both; font-weight: 400; color: #212529; text-align: inherit; white-space: nowrap; background-color: transparent; border: 0; }
.dropdown-item:focus, .dropdown-item:hover { color: #16181b; text-decoration: none; background-color: #f8f9fa; }

.dropdown-toggle::after { display: inline-block; width: 12px; height: 7px; vertical-align: 2px; content: ""; background: url(../images/ico_arrow_down.jpg) no-repeat; }

/*
flexbox
 */
.flex { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center }
.flex-start { -webkit-box-align: start !important; -webkit-align-items: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; }
.flex-end { -webkit-box-align: end !important; -webkit-align-items: flex-end !important; -ms-flex-align: end !important; align-items: flex-end !important; }

.flex-vertical { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; height: 100% }
.flex-vertical .flex-item { width: 100% }
.flex-item { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 }
.flex-item-start { -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; justify-self: flex-end }
.flex-item-center { -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center }
.flex-item-end { -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end }

/* theme */
.text-primary { color: #3370FF !important; }
.text-blue { color: #0099ff !important; }
.text-indigo { color: #6610f2 !important; }
.text-purple { color: #6f42c1 !important; }
.text-pink { color: #e83e8c !important; }
.text-red { color: #dc3545 !important; }
.text-orange { color: #fd7e14 !important; }
.text-yellow { color: #fed214 !important; }
.text-green { color: #28a745 !important; }
.text-teal { color: #20c997 !important; }
.text-cyan { color: #17a2b8 !important; }
.white { color: #fff !important; }
.black { color: #2c2c2c !important; }
.text-white { color: #fff !important; }
.text-gray { color: #555 !important; }
.text-light-gray { color: #999 !important; }
.text-gray-dark { color: #343a40 !important; }
.text-secondary { color: #d7b737 !important; }
.text-success { color: #28a745 !important; }
.text-info { color: #17a2b8 !important; }
.text-warning { color: #ffc107 !important; }
.text-danger { color: #dc3545 !important; }
.text-light { color: #f8f9fa !important; }
.text-light-light { color: #acacac !important; }
.text-dark { color: #343a40 !important; }
.text-222 { color: #222 !important; }
.text-333 { color: #333 !important; }
.text-666 { color: #666 !important; }
.text-777 { color: #777 !important; }
.text-888 { color: #888 !important; }
.text-999 { color: #999 !important; }
.text-aaa { color: #aaa !important; }
.text-ccc { color: #ccc !important; }
.text-eee { color: #eee !important; }
.bg-primary { background-color: #3370FF !important; }
.bg-blue { background-color: #0099ff !important; }
.bg-indigo { background-color: #6610f2 !important; }
.bg-purple { background-color: #6f42c1 !important; }
.bg-pink { background-color: #e83e8c !important; }
.bg-red { background-color: #dc3545 !important; }
.bg-orange { background-color: #fd7e14 !important; }
.bg-yellow { background-color: #ffc107 !important; }
.bg-green { background-color: #28a745 !important; }
.bg-teal { background-color: #20c997 !important; }
.bg-cyan { background-color: #17a2b8 !important; }
.bg-white { background-color: #fff !important; }
.bg-gray { background-color: #6c757d !important; }
.bg-light-gray { background-color: #c7c7c7 !important; }
.bg-gray-dark { background-color: #343a40 !important; }
.bg-secondary { background-color: #d7b737 !important; }
.bg-success { background-color: #28a745 !important; }
.bg-info { background-color: #17a2b8 !important; }
.bg-warning { background-color: #ffc107 !important; }
.bg-danger { background-color: #dc3545 !important; }
.bg-light { background-color: #f8f9fa !important; }
.bg-light-light { background-color: #eee !important; }
.bg-dark { background-color: #343a40 !important; }
.hover-white:hover { color: #fff !important; }
.hover-bg-grey:hover, .hover-bg-grey.hover { background-color: #eeeeee; }
.hover-bg-light-grey:hover, .hover-bg-light-grey.hover { background-color: #f7f7f7; }
.hover-bg-light-white:hover, .hover-bg-light-white.hover { background-color: #f9f9f9; }
.hover-opacity-8:hover, .hover-opacity-8.hover { opacity: 0.8; filter: opacity(80); }
.hover-zoom-up { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); }
.hover-zoom-up:hover, .hover-zoom-up.hover { transform: translate3d(0, -5px, 0); -webkit-transform: translate3d(0, -5px, 0); }
.hover-primary:hover, .hover-primary.hover { color: #3370FF !important; }
.hover-primary-hover:hover .hover-primary, .hover-primary-hover.hover .hover-primary, .hover-primary:hover, .hover-primary.hover { color: #3370FF !important; }
.hover-bg-primary:hover, .hover-bg-primary.hover { background-color: #3370FF !important; }
.hover-border-light-grey:hover, .hover-border-light-grey.hover { background-color: #f9f9f9; }
.hover-border-primary:hover, .hover-border-primary.hover { border-color: #3370FF !important; }
.hover-zindex-1:hover, .hover-zindex-1.hover { z-index: 1 }
.hover-colors { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; }
.hover-colors:hover, .hover-colors.hover { -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); filter: gray; }
.hover-shadow { box-shadow: 0 0 0px rgba(0, 0, 0, 0); }
.hover-shadow:hover, .hover-shadow.hover { box-shadow: 0 0 20px rgba(0, 0, 0, .2); }
.hr-bg-animate-hover:hover .hr-bg-animate, .hr-bg-animate-hover.hover .hr-bg-animate, .hr-bg-animate:hover, .hr-bg-animate.hover { width: 100% !important; background: #3370FF !important; }
.btn-width-anmate { display: block; width: 10px; }
.btn-width-anmate-hover:hover .btn-width-anmate, .btn-width-anmate-hover.hover .btn-width-anmate, .btn-width-anmate:hover, .btn-width-anmate.hover { width: 100%; background: #3370FF !important; border-color: #3370FF !important; color: white !important; }
.border-1 { border: 1px solid #ddd; }
.border-left { border-left: 1px solid #ddd; }
.border-right { border-right: 1px solid #ddd; }
.border-top { border-top: 1px solid #ddd; }
.border-bottom { border-bottom: 1px solid #ddd; }
.border-left-dashed { border-left: 1px dashed #ddd; }
.border-right-dashed { border-right: 1px dashed #ddd; }
.border-top-dashed { border-top: 1px dashed #ddd; }
.border-bottom-dashed { border-bottom: 1px dashed #ddd; }
.border-0 { border-width: 0; }
.border-l-0 { border-left-width: 0; }
.border-r-0 { border-right-width: 0; }
.border-t-0 { border-top-width: 0; }
.border-b-0 { border-bottom-width: 0; }
.border-black { border-color: #999; }

/*ico*/
.ico { display: inline-block; vertical-align: middle; outline: 0; *display: inline; *zoom: 1; }
.ico_right { width: 36px; height: 22px; background: url(../images/ico_right.png) -36px 0 no-repeat; }
.btn:hover .ico_right{background-position: 0 0px;}
.ico_30 { width: 30px; height: 30px; background: url(../images/ico_30.png) no-repeat; }
.ico_30.ico_30_1 { background-position: 0 0; }
.ico_30.ico_30_2 { background-position: 0 -30px; }
.ico_30.ico_30_3 { background-position: 0 -60px; }
.ico_30.ico_30_4 { background-position: 0 -90px; }
.ico_30.ico_30_5 { background-position: 0 -120px; }
.ico_30.ico_30_6 { background-position: 0 -150px; }
.ico_30.ico_30_7 { background-position: 0 -180px; }
.ico_60 { width: 60px; height: 60px; background: url(../images/ico_60.png) no-repeat; -webkit-transition: background-position .3s;
   -moz-transition: background-position .3s;
    -ms-transition: background-position .3s;
     -o-transition: background-position .3s;
        transition: background-position .3s;}
.ico_60.ico_60_1 { background-position: 0 0; }
.ico_60.ico_60_2 { background-position: 0 -60px; }
.ico_60.ico_60_3 { background-position: 0 -120px; }
.ico_60.ico_60_4 { background-position: 0 -180px; }
a:hover .ico_60.ico_60_1 { background-position: -60px 0; }
a:hover .ico_60.ico_60_2 { background-position: -60px -60px; }
a:hover .ico_60.ico_60_3 { background-position: -60px -120px; }
a:hover .ico_60.ico_60_4 { background-position: -60px -180px; }
/*table*/
.table { width: 100% }
.table th, .table td { font-size: 14px; line-height: 24px; color: #555; border: 1px solid #dcdcdc; padding: 8px 10px; text-align: center; }
.table th { font-size: 16px; color: #222222; font-weight: normal; }
.table-line th { line-height: 30px; border-top-width: 2px; }
.table-line th, .table-line td { border-left: 0; border-right: 0; border-bottom: 0; }

/*grid*/
.grid { }
.grid > li { display: block; float: left; }
.grid.grid-2 > li { width: 50%; }
.grid.grid-3 > li { width: 33.333333333%; }
.grid.grid-4 > li { width: 25%; }
.grid.grid-5 > li { width: 20%; }
.grid.grid-6 > li { width: 16.6666666%; }
.grid-space-6 { margin-left: -3px; margin-right: -3px; }
.grid-space-6 .grid > li { padding-left: 3px; padding-right: 3px; }
.grid-space-10 { margin-left: -5px; margin-right: -5px; }
.grid-space-10 .grid > li { padding-left: 5px; padding-right: 5px; }
.grid-space-20 { margin-left: -10px; margin-right: -10px; }
.grid-space-20 .grid > li { padding-left: 10px; padding-right: 10px; }
.grid-space-30 { margin-left: -15px; margin-right: -15px; }
.grid-space-30 .grid > li { padding-left: 15px; padding-right: 15px; }
.grid-space-40 { margin-left: -20px; margin-right: -20px; }
.grid-space-40 .grid > li { padding-left: 20px; padding-right: 20px; }
.section { }
.section-header { position: relative; margin-bottom: 5px; text-align: center; }
.section-header h1 { font-size: 40px; line-height: 1em; color: #222; font-weight: bold; text-align: center; margin-bottom: 18px; }
.section-header h2 { font-size: 30px; line-height: 1em; color: #222; text-align: left; margin-bottom: 8px; }
.section-header h3 { display: inline-block; margin-bottom: 14px; font-size: 14px; color: #666; text-align: center; line-height: 32px; border-top: 1px solid #bdbdbd; border-bottom: 1px solid #bdbdbd; }
.section-header h4 { font-size: 16px; line-height: 1em; color: #a9a9a9; text-align: left; }
.section-header-inverse h1, .section-header-inverse h2, .section-header-inverse h3, .section-header-inverse h4, .section-header-inverse h5 { color: #fff; border-color: #fff; }
.section-header > .section-header-right { position: absolute; right: 20px; font-size: 14px; top: 0; line-height: 46px; color: #fff; }
.section-body { }
.list { }
.list > li, .list-wrap { display: block; position: relative; }
.list-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center }
.list-wrap.list-wrap-top { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; }
.list-wrap > .list-center { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }
.pager { display: inline-block; }
.pager:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.pager > a { display: block; float: left; background-color: #fff; padding: 6px 14px; font-size: 14px; color: #333; border-radius: 2px; border: 1px solid #ddd; margin: 0 4px; cursor: pointer; }
.pager > a.pager-control { }
.pager > a:hover { color: #3370FF; }
.pager > a.disabled { color: #aaa; background-color: #f1f1f1; cursor: none; pointer-events: none; }
.pager > a.active { border-color: #3370FF; background-color: #3370FF; color: #fff; }
.stit-1 { height: 25px; line-height: 25px; font-size: 22px; color: #333; font-weight: normal; padding-left: 10px; border-left: 4px solid #d7b737; }

/*main*/
.header { height: 75px; width: 100%; background-color: #fff; }
.header-nav { font-size: 14px; height: 75px; }
.header-nav-wrap { position: relative; padding-left: 304px; padding-right: 120px; }
.header-nav .logo { display: block; position: absolute; left: 0; width: 304px; height: 75px; vertical-align: middle; padding-top: 14px; }
.header-nav-wrap-inner { width: 100%; }
.header-nav-ul { text-align: right; height: 75px; float: left; padding-left: 30px; }
.header-nav-ul > li { display: inline-block; height: 75px; }
.header-nav-ul > li > a { position: relative; display: block; padding: 0 14px; height: 75px; line-height: 75px; color: #333; font-size: 16px; }
.header-nav-ul > li > a:after { content: ''; display: none; width: calc(100% - 26px); height: 2px; background-color: #3370FF; position: absolute; bottom: 8px; left: 0; margin-left: 13px; }
.header-nav-ul > li.active > a:after { display: block; }
.header-nav-ul > li.active > a, .header-nav-ul > li > a:hover { color: #3370FF; }
.header-extra-ul { position: absolute; top: 0; right: 0; width: 120px; text-align: right; height: 75px; }
.header-extra-ul > li { display: inline-block; height: 75px; }
.header-extra-ul > li > a { position: relative; display: block; padding: 0 10px; height: 75px; line-height: 75px; color: #333; font-size: 14px; }
.header-extra-ul > li.active > a, .header-extra-ul > li > a:hover { color: #222222; text-decoration: underline }
@media(min-width:1848px) {

    /*1200 + 304*2 + 20*2 = 1544*/
    .header-nav-wrap { width: 100%; }
    .header-nav .logo { left: 20px; }
    .header-nav-wrap-inner { width: 1200px; position: absolute; left: 50%; margin-left: -600px; top: 0; height: 100%; padding-left: 30px; }
    .header-nav-ul > li > a { padding: 0 26px; }
}
.footer { padding: 60px 0; background: #323029 url(../images/footbg.jpg) no-repeat center center; background-size: cover; color: #fff; font-size: 14px; line-height: 1.8em }
.footer-1 { width: 600px; text-align: left }
.footer-2 { width: 600px; text-align: right }
.footer h4 { font-size: 24px; font-weight: 600; color: #fff; line-height: 1em; margin-bottom: 10px; }
.footer p { font-size: 18px; font-weight: normal; color: #fff; line-height: 1.6em; margin-bottom: 10px; }
.footer-3 { width: 300px; }

/*in*/
.in-nav { float: right; color: #888888; font-size: 14px; text-align: right; }
.in_main { position: relative; padding-top: 50px; padding-bottom: 80px; margin-top: -154px; background: #fff; border-radius: 20px; }
.inbanner { height: 534px; width: 100%; background-position: center bottom; }
@media (max-height:800px) {
    .inbanner { height: 434px; }
}
.in_main_header { position: relative; line-height: 74px; font-size: 18px; color: #666666; font-weight: 500; text-align: left; margin-bottom: 26px; height: 72px; border-bottom: 2px solid #efefef; }
.in_main_header > h3 { font-size: 26px; color: #222222; display: inline-block; }
.in_main_header:after { content: ''; display: block; width: 80px; height: 2px; position: absolute; left: 0; bottom: -2px; background: #f5d281; }
.article { font-size: 14px; color: #555; line-height: 1.5em; text-indent: 0; }
.article p { margin-bottom: 5px; }
.article img { max-width: 100%; }
.article-title { height: 32px; line-height: 32px; font-size: 22px; color: #3370FF; font-weight: normal; padding-left: 10px; border-left: 3px solid #3370FF; margin-top: 30px; margin-bottom: 30px; }
.in-aside { float: left; width: 220px; }
.in-aside-title { height: 100px; line-height: 50px; color: #222222; font-size: 24px; text-align: right; }
.in-aside-title h1 { font-size: 50px; color: #222222; font-weight: 300; letter-spacing: -4px; }
.in-aside-title h2 { font-size: 22px; color: #222222; font-weight: 600; }
.in-aside > ul { display: block; width: 220px; margin-top: 80px; }
.in-aside > ul > li { margin-bottom: 8px; }
.in-aside > ul > li > a { position: relative; display: block; width: 220px; height: 50px; line-height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 20px; background-color: #fff; color: #444444; font-size: 18px; padding-right: 50px; text-align: right; }
.in-aside > ul > li > a:hover, .in-aside > ul > li.active > a, .in-aside > ul > li.open > a { background-color: #e3e3e1; }
.in-aside > ul > li.menu > a:before { content: ""; display: block; width: 20px; height: 7px; position: absolute; right: 26px; top: 50%; margin-top: -2px; background: url(../images/down.png) no-repeat center center; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); }
.in-aside > ul > li.menu.open > a:before { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
.in-aside > ul > li > ul { display: none; padding: 0; }
.in-aside > ul > li.open > ul { display: block; }
.in-aside > ul > li > ul > li { text-align: right; padding-right: 30px; }
.in-aside > ul > li > ul > li > a { position: relative; display: inline-block; height: 50px; line-height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 20px; color: #444; font-size: 16px; text-align: right; }
.in-aside > ul > li > ul > li.active > a, .in-aside > ul > li > ul > li > a:hover { color: #444; border-bottom: 2px solid #3370FF; }
.in_main .main { float: right; width: 910px; margin-right: 30px; min-height: 700px }
.pro-list .grid > li { height: 322px; margin-bottom: 40px; }
.pro-list .grid > li>figure { width: 100%; height: 250px; border-bottom: 1px solid #ddd; }
.pro-list .grid > li .name { height: 50px; line-height: 48px; background-color: #fff; text-align: center; color: #444444; font-size: 16px; border: 1px solid #ddd; border-top: 0; }
.pro-list .grid > li:hover .name { background-color: #3370FF; color: #fff; border-color: #3370FF }
.feedback { width: 720px; }
.form-group { margin-bottom: 15px; }
.form-group > label { display: block; font-size: 14px; line-height: 14px; height: 20px; color: #444444; }
.input-wrap > .form-control { outline: none; width: 100%; border: 1px solid #dcdcdc; background-color: #fff; color: #333; padding: 8px 12px; font-size: 14px; }
.input-wrap > .form-control:focus { border-color: #0099ff; }
.input-wrap > select.form-control { border-radius: 20px; border: 0; background: #eeeeee; padding: 0 20px; }
.check-wrap { position: relative; display: inline-block; vertical-align: middle; height: 24px; padding-left: 13px; line-height: 24px; font-size: 16px; color: #444444; }
.check-wrap~.check-wrap { margin-left: 10px; }
.check-wrap > .icheck { opacity: 0; }
.check-wrap > .ilabel { border-radius: 3px; cursor: pointer; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.check-wrap > .ilabel:after { content: " "; border: 1px solid #999; display: block; font-weight: bold; text-align: center; border-radius: 3px; width: 22px; height: 22px; line-height: 22px; }
.check-wrap > .icheck:checked + .ilabel:after { content: "✓"; border-color: #999; background-color: #fff; color: #3ad045; }
.check-wrap > .icheck:indeterminate + .ilabel:after { content: "■"; color: #3f51b5; background-color: #FFF; border-color: #3f51b5; }
.form-group-horizontal { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center }
.form-group-horizontal > label { display: block; width: 120px; text-align: right; padding-right: 10px; line-height: 1em; }
.form-group-horizontal.form-group-top { -webkit-box-align: start; -webkit-align-items: start; -ms-flex-align: start; align-items: start }
.form-group-horizontal.form-group-top > label { margin-top: 8px; }
.form-group-horizontal .input-wrap { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 }
.feedback .form-control { height: 38px; border: 0; border-bottom: 1px solid #bbb; font-size: 16px; }
.feedback .form-group >  label { width: auto; font-size: 16px; }
.feedback .input-wrap > textarea { max-width: 100%; min-width: 100%; min-height: 96px; }
.feedback .input-wrap > .form-control:focus { border-bottom-color: #0099ff; border-bottom-width: 1px; }
#online_qq_layer { z-index: 1000; }
.online_icon { width: 36px; height: 150px; overflow: hidden; }
.online_icon a { display: block; width: 36px; height: 156px; background: url(../images/online/online_bg.png) no-repeat; _background: url(../images/online/online_bg_ie6.png) no-repeat; text-decoration: none; }
.online_windows { width: 150px; background-color: #fff; border: 3px solid #1b96e8; }
.online_w_top { background: url(../images/online/online_bg.png) no-repeat -42px 0 #1b96e8; height: 45px; }
.online_w_bottom { background: url(../images/online/online_bg.png) repeat-y -44px -118px; height: 29px; _background: url(../images/online/online_bg_ie6.png) repeat-y -44px -118px; }
.online_content { padding: 8px 0; text-align: center; border-bottom: 1px solid #d0d0d0; margin-bottom: 1px; }
.online_content > ul > li { line-height: 24px; margin-bottom: 4px; vertical-align: middle; }
.online_content > ul > li > a { height: 22px; height: 22px; width: 77px; display: inline-block; margin: 0 auto; line-height: 22px; cursor: pointer; border-radius: 4px; background-color: #dcf3ff; border: 1px solid #7cb8ce; text-align: center; font-size: 12px; -webkit-transition: background-color .25s; -moz-transition: background-color .25s; -ms-transition: background-color .25s; -o-transition: background-color .25s; transition: background-color .25s; color: #00587b; }
.online_content > ul > li > a:hover { background-color: #c6eafd; }
.online_content > ul > li > a.qq_btn { background-color: #dcf3ff; border: 1px solid #7cb8ce; color: #00587b; }
.online_content > ul > li > a.qq_btn:hover { background-color: #c6eafd; }
.online_content > ul > li > a.wangwang_btn { background-color: #dcf3ff; border: 1px solid #7cb8ce; color: #00587b; }
.online_content > ul > li > a.wangwang_btn:hover { background-color: #c6eafd; }
.online_content > ul > li > a.line_btn { background-color: #dcf3ff; border: 1px solid #7cb8ce; color: #00587b; }
.online_content > ul > li > a.line_btn:hover { background-color: #c6eafd; }
.online_content > ul > li > a>img { width: 16px; height: 16px; vertical-align: -3px; }
.online_bar .h2 { background: url(../images/online/online_bg.png) repeat-x 0 -156px; height: 29px; line-height: 27px; font-size: 12px; color: #666; text-align: left; _background: url(../images/online/online_bg_ie6.png) repeat-x 0 -156px; }
.online_bar .h2 a { display: block; padding-left: 14px; margin-left: 6px; cursor: pointer; }
.expand .h2 a { background: url(../images/online/online_bg.png) no-repeat -40px -69px; _background: url(../images/online/online_bg_ie6.png) no-repeat -40px -69px; }
.collapse .h2 a { background: url(../images/online/online_bg.png) no-repeat -40px -96px; _background: url(../images/online/online_bg_ie6.png) no-repeat -40px -96px; height: 28px; line-height: 28px; color: #000; }
.collapse .h2 a:hover { color: #000; }
#online_qq_layer { position: fixed; right: 0px; top: 120px; _position: absolute; }
* html, * html body { _background-attachment: fixed; }
* html #online_qq_layer { _bottom: auto; _top: expression(eval(document.documentElement.scrollTop + 150)); }
#online_qq_tab { float: left; margin-top: 50px; }
#onlineService { float: left; margin-left: -3px; display: none; }
.online_bottom { padding: 3px; border: 0; line-height: 24px; }
.online_bottom ul li { margin-bottom: 0; }
.btn-tab { }
.btn-tab .btn { background-color: #fff; color: #333333; border: 1px solid #bbb; margin: 0 3px; }
.btn-tab .btn:hover { background-color: #f2f2f2; color: #333; }
.btn-tab .btn.active { background-color: #3370FF; color: #fff; border: 0; }
.btn-tab .btn.active:hover { background-color: #f3cf3f; color: #fff; }
.btn-tab-style1 .btn { background-color: #e7e7e7; color: #333333; border: 0; margin: 0 3px; }
.btn-tab-style1 .btn:hover { background-color: #f2f2f2; color: #333; }
.tab-body { }
.tab-body > .tab-content { display: none }
.tab-body > .tab-content.active { display: block }