@charset "utf-8";
/* reset css */
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;}
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;}
input , select , textarea , button{outline:none; border-radius:0;}

@font-face{
font-family: arial-round;
src: url('arial-round.ttf');
}

body{font-family:arial,"微軟正黑體";}

/* top */
#top{height:286px; background:url(../images/header_bg.jpg) center top no-repeat;}

/* header */
#header{position:relative; width:1000px; margin:0 auto; padding:30px 0 0 80px; z-index:1;}

/* logo */
#logo{display:inline-block; width:157px; height:34px; background:url(../images/logo.png); text-indent:-9999px; cursor:pointer;}

/* lang */
#lang{position:absolute; right:165px; top:11px;}
#lang a{display:inline-block; padding-left:20px; font-family:"新細明體"; font-size:12px; color:#b08484;}
#lang a:before{content:""; position:relative; left:-5px; top:-2px; display:inline-block; width:0; height:0; border-style:solid; border-width:2.5px 0 2.5px 5px; border-color:transparent transparent transparent #999; transition:all .3s;}
#lang a:hover{color:#bc9898;}
#lang a:hover:before{left:-2px; border-color:transparent transparent transparent #FFF;}

/* home */
#home-link{position:absolute; right:75px; top:13px; display:block; width:75px; height:18px; background:url(../images/home.jpg) top;}
#home-link:hover{background-position:bottom;}

/* navigation */
#navigation{position:relative; left:50px; display:inline-block; width:600px; overflow:hidden;}
#navigation li{position:relative; top:-50px; float:left; display:none; width:100px; border-left:1px dotted #000; border-right:1px dotted #a37474; font-size:15px; text-align:center; box-sizing:border-box; z-index:1;}
#navigation li a{color:#FFF;}
#navigation .hover{position:absolute; left:10; top:0; display:block; width:80px; height:30px; background:#960000; opacity:0; z-index:0;}

/* ani-page */
#ani-page{position:absolute; left:50%; top:-182px; width:1000px; height:182px; margin-left:-500px; background:url(../images/header.png); z-index:0}

/* slogan */
#slogan{width:1000px; margin:0 auto; padding:100px 0 0 290px; overflow:hidden; box-sizing:border-box;}
#slogan h1 ,
#slogan h2{position:relative; left:-100px; font-family:arial-round; color:#990000; opacity:0;}
#slogan h1{font-size:24px;}
#slogan h2{font-size:16px;}
#slogan p{display:none; width:880px; padding-top:5px; font-size:10px; color:#666; line-height:16px; transform-origin:left top; -webkit-transform-origin:left top; transform:scale(.8,.8); -webkit-transform:scale(.8,.8);}

/* tree */
#tree{position:absolute; left:50%; top:0; width:475px; height:286px; margin-left:-660px; background:url(../images/tree.png);}
#flower{position:absolute; left:50%; top:150px; width:1000px; height:100px;}
#flower .big-flower{position:absolute; display:block; width:11px; height:10px; background:url(../images/leaf_1.png);}
#flower .flower{position:absolute; display:block; width:5px; height:6px; background:url(../images/leaf_2.png);}

/* container */
#container{background:url(../images/main_bg.png) center top no-repeat; margin-top:-13px; padding:11px 0 21px 0;}
#container .wrapper{width:1000px; margin:0 auto; overflow:hidden;}

/* 最新消息 */
#left{float:left; width:328px;}
#left h3{display:block; width:328px; height:56px; background:url(../images/index_02.jpg);}
#left dl{float:left; width:290px; height:auto; margin-left:22px; border-bottom:#6c0000 1px dashed; _display:inline;}
#left dt{float:left; display:block; width:72px; background:url(../images/index_06.jpg) left no-repeat; padding-left:8px; color:#e49898; font-size:12px; font-family:Arial; line-height:29px;}
#left dd{float:right; display:block; width:210px; color:#FFFFFF; font-size:12px; line-height:28px; font-family:Arial;}
#left a{color:#FFFFFF; font-size:12px; line-height:29px; font-family:Arial; text-decoration:none;}
#left a:hover{color:#d5cfb5; line-height:28px;}

.more{display:block; width:97px; height:56px; background-image:url(../images/btn-more.jpg); background-position:left top; text-indent:-9999px; float:right;}
.more:hover{ background-position:left bottom;}

/* 最新案例 */
#middle{float:left; width:427px;}
#middle h1{width:427px; height:56px; background:url(../images/index_03.jpg); text-indent:-9999px;}
#middle ul{overflow:hidden; padding:8px 10px 0 10px;}
#middle li{float:left; display:block; width:46%; margin:0 2%; background:url(../images/new-case-bg.jpg) left top no-repeat;}
#middle li img{display:block; width:100%; height:auto;}
#middle li p{font-size:12px; color:#d5cfb5; line-height:16px; margin:5px 0 0 5px;}

/* 品牌故事 */
#right{float:left; width:245px;}
#right h1{display:block; width:245px; height:56px; background:url(../images/index_04.jpg); text-indent:-9999px;}
#right ul{width:200px; margin:5px auto;}
#right a{font-size:13px; font-family:Arial; color:#FFFFFF; line-height:22px; text-decoration:none;}
#right a:hover{border-bottom:1px solid #990000;}

/* footer */
#footer{width:100%; margin:0 auto; padding-top:10px; background:url(../images/ftbg_rx.jpg) top repeat-x; font-family:arial , "新細明體"; font-size:12px; color:#898989; line-height:20px; text-align:center;}
#footer > div{width:1000px; margin:0 auto; padding:3px 0;}
#footer .path a{color:#565656;}
#footer .path a:hover{color:#CC0000;}
#footer .copyright{line-height:18px;}
#footer .copyright a{color:#898989;}
#footer .copyright a:hover{color:#333333; text-decoration:underline;}