@charset "utf-8";
/*----------reset----------*/
body, h1, h2, h3, h4, h5, h6, hr, p, dl, dt, dd, ul, ol, li, form, button, input, textarea, th, td { margin: 0; padding: 0 }
body, button, input, select, textarea { font: 12px Arial, Helvetica, sans-serif }
ul, ol, li { list-style: none }
a { text-decoration: none }
img { border: 0; max-width: 100%; }
button, input, select, textarea { font-size: 100%; vertical-align: middle; }
select { padding: 2px; border: 1px solid #ddd; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px }
img { vertical-align: top; display: inline-block; background-color: none; }
article, aside, footer, header, section { display: block; margin: 0; padding: 0 }
/*public*/
.tac { text-align: center; }
.fl { float: left; }
.fr { float: right; }
.fix:after { content: "."; display: block; height: 0; font-size: 0; clear: both; visibility: hidden; }
.fix { display: inline-block; }
.bigfs { font-weight: normal; font-family: '微軟雅黑', 'YaHei', '黑體', 'Hei', Tahoma, Helvetica, arial, sans-serif; }
.ofh { white-space: nowrap; word-wrap: normal; word-break: normal; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden }
/*public*/
body { background: #fff; position: relative; }
.mod-wrap {  min-height: 100%; }
.mod-content{position: relative;width: 800px;margin:0 auto;  }
.mod-tip{ position:absolute;width:100%;height:48px;background:#1f7eb0; background: rgba(0,0,0,.3);-webkit-animation: fadeInDown .6s .5s ease both; -moz-animation: fadeInDown .6s .5s ease both;z-index: 100;}
.mod-tip .logo{ float: left;}
.mod-tip p{padding:14px 0 10px; line-height: 24px; font-size: 13px;color:#fff; text-align: right;}
.mod-tip p a{color:#fff;padding:0 5px; background: #2ab4fc;}
.mod-tip p a:hover{background: #5ec6fd;}
.mod-top{height:508px; background: #35b8fc; overflow: hidden;-webkit-animation: bgColor1 60s linear infinite;}
.mod-top .mod-content{height: 100%; overflow: hidden;}
.mod-iphone{position:absolute;bottom:0;left:-100px;width:600px;height:452px; background: url(images/iphone.png);}
.mod-iphone .app-image{position:absolute;top:109px;left:176px;;width:238px;height:416px; background: #ececec;}
.mod-iphone .app-image img{width: 100%;}
.app-info{position: absolute;  bottom: 25px;right: 60px;width:340px; text-align: center;}
.app-info .app-icon{ display: inline-block;*display:inline;zoom:1;width:114px;height:114px;border:3px solid #fff; background: #fff; border-radius: 20px;margin-bottom:15px; overflow: hidden;}
.app-info .app-name{ font-size: 44px; text-align: center; color:#fff;margin-bottom:15px; }
.app-info .app-des{margin-bottom:25px; padding:15px 0;border-width: 1px 0 1px;border-style:solid;border-color:#95dafe;border-color:rgba(255,255,255,.3);}
.app-info .app-des p{color:#fff; font-size: 14px; line-height: 1.6;}
.app-link .a-link,.app-link .i-link{ position: relative; display: inline-block;*display:inline;zoom:1;margin:0 5px;}
.app-link a{  display: inline-block;*display:inline;zoom:1;line-height:20px;height:20px;padding:12px;border:2px solid #fff; background: rgba(255,255,255,.1);border-radius: 5px 0 0 5px;font-size:16px;color:#fff;  }
.app-link a:hover{ background: rgba(255,255,255,.3)}
.app-link .link-qrcode{margin-left:-2px;border-radius: 0 5px 5px 0;}
.icon-qrcode,.icon-a-link,.icon-i-link{display:inline-block;width:24px;height:24px; background: url(images/icon_download.png) no-repeat; vertical-align: middle;}
.icon-i-link{ background-position: 0 -24px;}
.icon-qrcode{ background-position: 0 -48px;}
.app-link .qrcode{ display: none; position:absolute;bottom:50px;left:19px;width:103px;height:103px;padding:10px; background: #fff;}
.app-link.active .qrcode{ display: block;}
.app-link a:hover{ background: rgba(255,255,255,.3)}
.app-link a.disabled{border-color:rgba(255,255,255,.5);color:rgba(255,255,255,.5);}
.app-link a.disabled:hover{background: rgba(255,255,255,.1);color:rgba(255,255,255,.5); }
.mod-gallery{padding:40px 0;}
.mod-gallery h3{ font-size: 16px;margin:0 0 30px 10px; font-weight: bold;color:#333;border-left:3px solid #35b8fc;padding-left:10px;}
.mod-slider{ position: relative;width: 780px;height:426px;margin:0 10px;overflow: hidden;}
.mod-slider ul { width: 5000px; height: 426px; position: absolute; left: 0; top: 0; }
.mod-slider ul li { width: 240px; height: 426px;margin:0 10px; float: left; overflow:hidden; text-align: center;  background: #ececec;  }
.mod-slider ul li img { width:238px; vertical-align: middle; }
.mod-slider ul li::after,.mod-slider ul li::before{content:"";display: inline-block;width:1px;height: 100%;vertical-align: middle;}
.mod-slider .slider-ctrl a { position: absolute; top: 50%;margin-top:-44px; display: block; height: 88px; width: 40px; background:  url(images/icon_control.png) no-repeat; opacity: .8; }
.mod-slider .slider-ctrl a:hover { opacity: 1; }
.mod-slider .slider-ctrl a.prev { left: 20px; }
.mod-slider .slider-ctrl a.next { right: 20px; background-position: -40px 0; }

.mod-footer {height:48px; background: #bfbfbf;  }
.mod-footer p{ line-height: 24px; padding:12px; text-align: center;color:#888;}
@-webkit-keyframes bgColor1 {
    0% {
        background-color:#37b8fc;
    }
    26% {
        background-color:#37b8fc;
    }
    33% {
        background-color:#35c3a6;
    }
    60% {
        background-color:#35c3a6;
    }
    66% {
        background-color:#e8a02d;
    }
    94% {
        background-color:#e8a02d;
    }
    100% {
        background-color:#37b8fc;
    }
}
@-webkit-keyframes fadeInDown {
    0% {
        opacity:0;
        -webkit-transform:translateY(-20px)
    }
    100% {
        opacity:1;
        -webkit-transform:translateY(0)
    }
}
@-moz-keyframes fadeInDown {
    0% {
        opacity:0;
        -moz-transform:translateY(-20px)
    }
    100% {
        opacity:1;
        -moz-transform:translateY(0)
    }
}