@charset "utf-8";

/* CSS Document Edited by LiLu */

* {

	margin:0;

	padding:0;

	outline:none;

	blr:expression(this.onFocus=this.blur());

     -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}

html{ font-size: 100px;}

body, ul, ol, dl, dt, dd, h1, h2, h3, h4, h5, h6 {

	list-style:none;

	text-decoration:none;

    margin: 0;

}

body,html {

    height: 100%;

    overflow: hidden;

	color:#000;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale; 

    position: relative; 

    font-family:'Microsoft Jhenghei', '微軟正黑體', Microsoft YaHei, "微软雅黑";



}

body{ font-size: 14px; line-height:1.7;}

img {

    /*display: block;*/

	border:none;

	max-width: 100%;

	width: auto\9;

	height: auto;

	-ms-interpolation-mode: bicubic;

	_width:auto;

}

input, textarea{ cursor:pointer; font-family:'Microsoft Jhenghei', '微軟正黑體', Microsoft YaHei, "微软雅黑"; font-size:14px; vertical-align:middle; }

input, textarea {

	border:none;

	background:none;

}

a {

	text-decoration:none;

    blr:expression(this.onFocus=this.blur());

	outline: none;

	color:#000; 

}

a:hover,a:focus{

	text-decoration:none;

}

em, i {

	font-style:normal;

}

a:focus, input{

	outline:none;

}

.clearfix { *zoom:1; }

.clearfix::after {

	content:"\200B";

	display: block;

	clear: both;

	height: 0;

}

@-webkit-viewport {

width: device-width;

}

@-moz-viewport {

width: device-width;

}

@-ms-viewport {

    width: device-width;

}

@-o-viewport {

width: device-width;

}

@viewport {

width: device-width;

}

input[type="submit"], input[type="reset"], input[type="button"], button {

	-webkit-appearance: none; -webkit-border-radius:inherit; -moz-border-radius: inherit; border-radius:inherit;

}

header,main,footer,section{ display: block;}



/*loading*/

#loadingTips{ width: 100px; height: 100px; position: absolute; background-size: contain;}

.warp{ /*height: 100%; */ background: #fff; opacity: 1;}

.body_service .warp,.body_plan .warp,.body_system .warp,.body_about .warp{ height: 100%;}

/*===================header========================*/

header{ width: 100%; position: fixed; top:0; left:0; z-index: 8000; background: #fff; box-shadow: 0 0 20px -2px #ddd; line-height: 80px;}

.logo{ float: left; padding: 20px 0.6rem;}

.logo img{ display: block; float:left}

.logo span{ float:right; padding-left:20px; line-height:120%;  font-size:14px; padding-top:5px; text-align:right; padding-top:13px; color:#333; font-weight:normal}

.nav{ overflow: hidden; margin-top:8px}

.nav li{ float: left; padding: 0 3%;}

.nav li a{ display: block; font-size: 0.16rem; overflow: hidden;}

.nav li a span{ position: relative; }

.nav li a span:before{ content: ""; position: absolute; bottom: -3px; left:50%; width: 0; height: 1px; background: #00a0e9;}

.nav li.nav_cur a,.nav li:hover a{ color: #00a0e9;}

.nav li.nav_cur a span:before,.nav li:hover a span:before{ left:0; width: 100%;}

.header_r{ float: right; padding:0 0.6rem 0 0.2rem; margin-top:6px}

.QR_menu,.QR_menu img,.tel{ display: inline-block; vertical-align: middle;}

.QR_menu img{ margin: 0;}

.tel,.consult{ float: left; margin-left: 15px; font-size: 16px;}

.tel,.tel a{ font-family: Verdana; color: #555;}

.tel img{ display: inline-block; vertical-align: middle; margin-right: 5px;}

.tel span{ color: #ccc; margin: 0 4px;}

/*pad&phone*/

.guide_pad{ display: none;}

/*a.menu-activator*/

a.menu-activator{ display: block; float: right; padding: 0 15px; border-left: 1px solid transparent; }

a.menu-activator span.descriptor,a.menu-activator div.visual { display: inline-block; vertical-align: middle; cursor: pointer; color: #fff;}

a.menu-activator span.descriptor { font-family:Aparajita; font-size: 18px; text-transform: uppercase; }

a.menu-activator div.visual { position: relative; margin-left: 4px; width: 32px; height:34px; }

a.menu-activator div.visual i.line {

    width: 100%;

    height:3px;

    background-color: #666;

    -webkit-border-radius: 2px;

    -moz-border-radius: 2px;

    border-radius: 2px;

    display: block;

    position: absolute;

    -moz-transition: all 300ms ease;

    -o-transition: all 300ms ease;

    -webkit-transition: all 300ms ease;

    transition: all 300ms ease;

    -moz-transform: translate3d(0, 0, 0);

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

}

a.menu-activator div.visual i.line.line01 {

    top: 6px;

    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);

    opacity: 1;

    -moz-transition-delay: 210ms;

    -o-transition-delay: 210ms;

    -webkit-transition-delay: 210ms;

    transition-delay: 210ms;

}

a.menu-activator div.visual i.line.line02 {

    top: 14px;

    -moz-transition-delay: 140ms;

    -o-transition-delay: 140ms;

    -webkit-transition-delay: 140ms;

    transition-delay: 140ms;

}

a.menu-activator div.visual i.line.line03 {

    top: 22px;

    -moz-transition-delay: 70ms;

    -o-transition-delay: 70ms;

    -webkit-transition-delay: 70ms;

    transition-delay: 70ms;

}

a.menu-activator div.visual i.line.line04 {

    top: 30px;

    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);

    opacity: 0;

    -moz-transition-delay: 0ms;

    -o-transition-delay: 0ms;

    -webkit-transition-delay: 0ms;

    transition-delay: 0ms;

}



a.menu-activator.active div.visual i.line:nth-child(1), a.menu-activator.active div.visual i.line:nth-child(3) {

    top:16px

}

a.menu-activator.active div.visual i.line:nth-child(1) {

    -moz-transform:rotate(-45deg);

    -ms-transform:rotate(-45deg);

    -webkit-transform:rotate(-45deg);

    transform:rotate(-45deg)

}

a.menu-activator.active div.visual i.line:nth-child(3) {

    -moz-transform:rotate(45deg);

    -ms-transform:rotate(45deg);

    -webkit-transform:rotate(45deg);

    transform:rotate(45deg)

}

a.menu-activator.active div.visual i.line:nth-child(2), a.menu-activator.active div.visual i.line:nth-child(4) {

    filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);

    opacity:0

}

/* a.menu-activator.active span.descriptor{color: #e02d39;}*/

a.menu-activator.active div.visual i.line.line01, a.menu-activator.active div.visual i.line.line02, a.menu-activator.active div.visual i.line.line03, a.menu-activator.active div.visual i.line.line04 {

    /*background-color: #e02d39;*/

    -moz-transition-delay:0ms;

    -o-transition-delay:0ms;

    -webkit-transition-delay:0ms;

    transition-delay:0ms

}

a.menu-activator.active div.visual:hover i.line.line01, a.menu-activator.active div.visual:hover i.line.line03 {

    filter:progid:DXImageTransform.Microsoft.Alpha(enabled=false);

    opacity:1

}

a.menu-activator.active div.visual:hover i.line.line01, a.menu-activator.active div.visual:hover i.line.line02, a.menu-activator.active div.visual:hover i.line.line03, a.menu-activator.active div.visual:hover i.line.line04 {

    -moz-transition-delay:0ms;

    -o-transition-delay:0ms;

    -webkit-transition-delay:0ms;

    transition-delay:0ms

}

/*menu-overlay*/

.menu-overlay{

    width: 0;

    height:0;

    overflow:hidden;

    position: fixed;

    z-index: 3000;

    top:50px;

    left:-100%;

    filter: Alpha(Opacity=0);

    opacity: 0;

    background-color: rgba(0,0,0,0.75);

    -webkit-transition: transition:all 0.5s ease;

    -moz-transition: transition:all 0.5s ease;

    -ms-transition: transition:all 0.5s ease;

    -moz-transition: transition:all 0.5s ease;

    transition: all 0.5s ease;

}

.menu-overlay.active{ width: 100%; height:100%; padding:0 0.3rem; left:0; filter: Alpha(Opacity=100); opacity: 1.00;}

.menu-overlay .tel,.menu-overlay .consult{ line-height: normal;}

.menu-overlay .tel{ margin:0.3rem 0 0.2rem; color: #fff;}

.menu-overlay .tel a,.menu-overlay .consult a{ color: #fff;}

.menu-overlay .tel a:hover,.menu-overlay .consult a:hover{ color: #00a0e9;}

.nav_list{}

.nav_list li{ line-height: normal; border-bottom: 1px solid rgba(255,255,255,.30);}

.nav_list li a{ display: block; padding: 0.2rem; color: #fff; font-size: 16px;}

.nav_list li a:active{  background: rgba(0,160,233,.90);}



/*===================footer========================*/

footer{ width: 100%; padding: 0 0.4rem; line-height: 0.5rem; position: fixed; bottom:0; left:0; z-index: 8000; background: #fff; text-align: right; font-size: 12px;}

footer .gh{float:left; float: left; padding: 0px 5px; padding-top:5px}

footer .gh span{ padding-top:5px}

.beian{ float:left}

.f_consult{ display:inline-block;}

.f_consult img{ vertical-align: middle; margin-right: 5px;}

.f_consult:hover{ color: #00a0e9;}

.f_line{ margin: 0 0.1rem;}

.footer_dif{ background-color: #000; color: #fff;}

.footer_dif a{ color: #fff;}

.footer_dif a:hover{ color: #00a0e9;}

.body_work footer,.body_view footer{ position: relative;}



.scroll_i {

     cursor:pointer; background: url(../images/scroll_i.png) no-repeat 0 0; background-size: contain; position: absolute; bottom:100px; left:50%; margin-left: -32px;  width: 64px; height: 72px; z-index: 5;

    -webkit-filter: drop-shadow(1px 1px 0px #333333); filter: drop-shadow(1px 1px 0px #333333);

}

.wheel {

    position: absolute;

    top: 10px;

    left: 50%;

    margin-left: -1.5px;

    height: 8px;

    width: 3px;

    display: block;

    background: #999;

    border-radius: 10px;

    -webkit-animation: mouse-wheel 1.2s ease infinite;

    -moz-animation: mouse-wheel 1.2s ease infinite;

}

.scroll_down .unu { display: block; position: absolute; bottom:18px; left:0; width: 100%; height: 8px; background: url(../images/scroll_down.png) center top no-repeat; background-size: contain;}

@-webkit-keyframes mouse-wheel {

    0% {

        opacity: 1;

        -webkit-transform: translateY(0);

        -ms-transform: translateY(0);

        transform: translateY(0);

    }

    100% {

        opacity: 0;

        -webkit-transform: translateY(6px);

        -ms-transform: translateY(6px);

        transform: translateY(6px);

    }

}

@-moz-keyframes mouse-wheel {

    0% {

        top: 1px;

    }

    50% {

        top: 2px;

    }

    100% {

        top: 3px;

    }

}

.unu,

.doi,

.trei {

    -webkit-animation: mouse-scroll 1s infinite;

    -moz-animation: mouse-scroll 1s infinite;

}

.unu {

    -webkit-animation-delay: .3s;

    -moz-animation-delay: .3s;

    -webkit-animation-direction: alternate;

}

.doi {

    -webkit-animation-delay: .2s;

    -moz-animation-delay: .2s;

    -webkit-animation-direction: alternate;

}

@-webkit-keyframes mouse-scroll {

    0% {

        opacity: 0;

    }

    50% {

        opacity: .5;

    }

    100% {

        opacity: 1;

    }

}

@-moz-keyframes mouse-scroll {

    0% {

        opacity: 0;

    }

    50% {

        opacity: .5;

    }

    100% {

        opacity: 1;

    }

}

@-o-keyframes mouse-scroll {

    0% {

        opacity: 0;

    }

    50% {

        opacity: .5;

    }

    100% {

        opacity: 1;

    }

}

@keyframes mouse-scroll {

    0% {

        opacity: 0;

    }

    50% {

        opacity: .5;

    }

    100% {

        opacity: 1;

    }

}







@media (max-width:1279px){

    .nav li a,.tel,.consult{ font-size: 14px;}

    .logo{ padding-left: 0.3rem; padding-right: 0.3rem;}

    .header_r{ padding-right: 0.3rem;}

}



@media (max-width:1023px){

    header{ line-height: 50px;}

    .logo{ padding-top: 10px; padding-bottom: 10px;}

    .logo img{ height: 30px;}

    .header_r,.nav{ display: none;}

    .guide_pad{ display: block;}

    .tel,.consult{ float: none; margin: 0;}

}



@media (max-width: 767px){

    footer{ display: none;}

}