body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, th, td {margin:0; padding:0; -webkit-text-size-adjust:none;}
th{font-weight:normal; text-align:left;}
table{border-collapse:collapse; border-spacing:0;}
img{border:0;}
ol, ul{list-style:none;}
a{outline:none; hlbr:expression(this.onFocus=this.blur()); text-decoration:none; cursor:pointer;}
input , select , textarea , button{outline:none; border-radius:0; font-family:arial , "微軟正黑體";}
input[type="number"]::-webkit-inner-spin-button ,
input[type="date"]::-webkit-inner-spin-button{-webkit-appearance:none;}
button{padding:0; cursor:pointer;}
body{font-family:"微軟正黑體" , arial; background:url(../images/star.png) no-repeat fixed #000;}

/* header */
#header{max-width:1200px; width:95%; margin:0 auto; color:#FFF; text-align:center; padding-top:40px;}
#header .logo{width:296px; height:131px; display:block; background:url(../images/logo.png); text-indent:-9999px;}
#header h1{font-size:48px; margin-top:65px;}
#header p{font-size:24px; margin-top:30px;}
#header img{max-width:872px; width:100%; height:auto; display:inline-block; position:relative; bottom:-100px;}
#header:after{content:""; display:block; clear:both;}

/* title */
#title{background:#be2c2c; color:#FFF; text-align:center; padding:190px 0 100px 0; margin-top:-50px;}
#title h1{font-size:48px; line-height:72px; font-weight:normal;}
#title p{font-size:18px; line-height:36px; margin-top:30px;}
#title span{display:block;}

/* features */
#features{max-width:1200px; width:95%; margin:0 auto; color:#FFF; text-align:center; padding:100px 0;}
#features h1{font-size:48px; font-weight:normal;}
#features h2{font-size:34px; font-weight:normal; margin-top:20px;}
#features p{font-size:18px; line-height:35px; margin-top:30px;}
#features span{display:block;}
#features ul{overflow:hidden; margin-top:80px;}
#features li{width:25%; float:left;}
#features li:before{content:""; width:250px; height:250px; display:block; border-radius:50%; margin:0 auto;}

#features .item11:before{content:""; background:url(../images/section-icon1.png) #43d1d1; background-size:100% auto;}
#features .item12:before{content:""; background:url(../images/section-icon2.png) #43d1d1; background-size:100% auto;}
#features .item13:before{content:""; background:url(../images/section-icon3.png) #43d1d1; background-size:100% auto;}
#features .item14:before{content:""; background:url(../images/section-icon4.png) #43d1d1; background-size:100% auto;}

/* case */
#case{background:url(../images/bg2.jpg) no-repeat; background-size:cover; color:#FFF; text-align:center; padding:100px 0;}
#case h1{font-size:48px; font-weight:normal;}
#case h1 span{font-size:18px; margin-top:30px; display:block;}
#case .wrap{max-width:1500px; width:95%; margin:0 auto;}
#case .wrap table{width:100%;}
#case .wrap td{width:25%; vertical-align:top; padding:80px 1% 0 1%; box-sizing:border-box;}
#case .wrap td img{max-width:268px; width:100%; height:auto; display:block; margin:0 auto;}
#case .wrap td h2{font-size:32px; font-weight:normal; margin-top:40px;}
#case .wrap td  p{font-size:18px; line-height:35px; margin-top:20px;}
#case .wrap td span{display:block;}

/* map */
#map{background:#FFF;}
#map iframe{width:100%; height:600px;}

/* conclusion */
#conclusion{background:#FFF; padding:120px 0; text-align:center;}
#conclusion h1{font-size:30px;}
#conclusion span{font-weight:normal; padding:0 10px;}
#conclusion p{font-size:18px; font-weight:bold; padding:30px 2.5%;}
#conclusion p:after{content:""; width:65px; height:2px; display:block; background:url(../images/section-after.jpg); margin:50px auto 0 auto;}

/* contact */
#contact{background:#f6f6f6; padding:50px 0;}
#contact:after{content:""; display:block; clear:both;}
#contact .wrap{max-width:1400px; width:95%; margin:0 auto; position:relative}
#contact .wrap h1{font-size:48px;}
#contact .wrap form{max-width:700px; margin-top:30px;}
#contact .wrap select,
#contact .wrap input,
#contact .wrap textarea{width:100%; font-size:15px; padding:15px; box-sizing:border-box; margin-bottom:15px; border:none;}
#contact .wrap select{background:#303030; color:#FFF;}
#contact .wrap input,
#contact .wrap textarea{text-indent:15px;}
#contact .wrap textarea{height:160px;}
#contact .wrap .submit{background:#303030; color:#FFF; font-size:15px; padding:10px 40px; border:none; position:relative; left:100%; margin-left:-110px;}
#contact .wrap .pic{width:100%; max-width:574px; height:auto; display:block; position:absolute; right:0; top:-140px;}

/* footer */
#footer{background:#43d1d1; text-align:center; border-top:5px solid #1f1f1f; padding:50px 0;}
#footer h1{font-size:30px; font-weight:normal;}
#footer p{font-size:18px; margin-top:20px;}
#footer span{padding:0 10px;}


/* RWD */
@media screen and (max-width:1470px){
#case .wrap td h2{font-size:24px; margin-top:30px;}
}

@media screen and (max-width:1340px){
#contact .wrap .pic{width:35%; top:auto; bottom:0;}
}
@media screen and (max-width:1024px){
/* header */
#header .logo{width:496px; height:231px; display:block; margin:0 auto;}

/* title */
#title{padding:190px 0 50px 0;}
#title h1{font-size:36px; line-height:45px;}

/* features */
#features{padding:50px 0;}
#features h1{font-size:36px;}
#features h2{font-size:24px;}
#features p{margin-top:15px;}
#features ul{margin-top:50px;}
#features li:before{content:""; width:170px; height:170px;}

/* case */
#case{padding:50px 0;}
#case h1{font-size:36px;}
#case h1 span{font-size:18px; display:block;}
#case .wrap tr{overflow:hidden;}
#case .wrap td{width:50%; display:block; float:left; padding-top:40px;}
#case .wrap td img{max-width:268px; width:100%; height:auto; display:block; margin:0 auto;}
#case .wrap td  p{font-size:18px; line-height:35px; margin-top:20px;}
#case .wrap td span{display:block;}

/* conclusion */
#conclusion{background:#FFF; padding:50px 0; text-align:center;}

/* contact */
#contact .wrap h1{font-size:30px; text-align:center;}
#contact .wrap form{margin:30px auto 0 auto;}
#contact .wrap .pic{display:none;}
}
@media screen and (max-width:768px){
/* header */
#header h1{font-size:36px; margin-top:50px;}
#header p{margin-top:15px;}
#header img{max-width:872px; width:100%; height:auto; display:inline-block; position:relative; bottom:-65px;}

/* title */
#title{padding:150px 2.5% 50px 2.5%;}
#title h1{font-size:28px;}
#title p{margin-top:20px;}
#title p span{display:inline;}

/* features */
#features h1{font-size:30px;}
#features h2{font-size:24px;}
#features ul{margin-top:0;}
#features li{width:50%; margin-top:30px;}
#features li:before{content:""; width:170px; height:170px;}

/* case */
#case h1 span{margin-top:15px;}
#case .wrap table,
#case .wrap tbody,
#case .wrap tr,
#case .wrap td{width:100%; display:block; float:none;}
#case .wrap td img{max-width:268px; width:100%; height:auto; display:block; margin:0 auto;}
#case .wrap td  p{font-size:18px; line-height:35px; margin-top:20px;}
#case .wrap td span{display:block;}

/* map */
#map iframe{height:300px;}

/* footer */
#footer p{font-size:14px; margin-top:10px;}
#footer span{display:block; padding:5px 0;}
}
@media screen and (max-width:640px){
/* header */
#header h1{font-size:28px; margin-top:50px;}

/* title */
#title{text-align:left; padding:150px 5% 50px 5%;}

/* features */
#features li{width:100%; float:none;}

/* footer */
#footer h1{font-size:24px;}
}
