body {
	margin: 0px;
	padding: 0px;
	font-family: Microsoft JhengHei, Arial, Helvetica, sans-serif,"微軟正黑體";
	font-size:13px;
	font-weight:bold;
	background:url(../img/bg.jpg) repeat 0 0;

	
}


/*main
============================================================== */
.main{
	width:100%;
	position:relative; 
	min-width:959px;width: auto !important;width: 959px;
	overflow:hidden;

}

/*header
============================================================== */
.header {background: -moz-linear-gradient(top,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.9) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.9)), color-stop(100%,rgba(255,255,255,0.9))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.9) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.9) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.9) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.9) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ffffff', endColorstr='#e6ffffff',GradientType=0 ); /* IE6-9 */
width:960px;
height:85px;
position:absolute;
top:0;
left:50%;
margin-left:-480px;
border-radius:0 0 5px 5px;
z-index:2;
box-shadow:0 0 5px rgba(0,0,0,0.7);
}
.header .mooktit { float:left; margin-left:35px; margin-right:25px;}
.header .likebtn { float:left; width:95px; margin-top:35px;}
.header .links { float:right; margin-right:25px; background:url(../img/x.png) no-repeat 105px 0; width:260px;}
.header .links .logo { float:left;}
.header .links .logo_gamme { float:right;}

/*video
============================================================== */
.video { width:100%; height:510px; overflow:hidden; border-bottom:3px solid #48e4f4; box-shadow:0 0 5px rgba(0,0,0,0.7); position:relative; z-index:1;}
/*video_block*/
.video_block {width:100%; height:510px; position:relative; z-index:1;}
.video_block a { width:100%; height:510px; overflow:hidden; display:block; text-decoration:none; color:#fff;}
.video_block a.v1,.video_block a.v2,.video_block a.v3 { position:absolute; top:0; left:0;}
.video_block a.v1 { }
.video_block a.v2 {filter:alpha(opacity=0); opacity:0;}
.video_block a.v3 { filter:alpha(opacity=0); opacity:0;}
.video_block a .play { background:url(../img/play.png) no-repeat 0 0; width:140px; height:140px; position:absolute; top:205px; left:50%; margin-left:-70px;transition:0.4s; -moz-transition:0.4s;-webkit-transition:0.4s; -o-transition:0.4s; z-index:2;filter:alpha(opacity=70); opacity:0.7;}
.video_block a .name { background:url(../img/good.png) no-repeat 0 0; position:absolute; width:575px; height:30px; top:370px; left:50%; margin-left:-480px; font-size:15px; padding-left:30px; line-height:30px; z-index:2;}
.video_block a h3 { font-size:28px; line-height:30px; z-index:2; position:absolute; width:605px; height:75px; top:405px; left:50%; margin-left:-480px; line-height:37px; text-shadow:0 0 5px rgba(0,0,0,0.7); overflow:hidden; z-index:2;}
.video_block a img { position:absolute; top:0; left:50%; margin-left:-960px; z-index:1;}
.video_block a:hover .play {filter:alpha(opacity=100); opacity:1;}
/*page_arw*/
.page_arw { position:absolute; z-index:2; top:50%; margin-top:-17px; left:50%; margin-left:-585px; width:1170px;} 
.page_arw a.arw_r { position:absolute; background:url(../img/arw_r.png) no-repeat 0 0; width:15px; height:35px; display:block; right:0px;}
.page_arw a.arw_l { position:absolute; background:url(../img/arw_l.png) no-repeat 0 0; width:15px; height:35px; display:block; left:0px;}
.page_arw a:hover { background-position:0 -35px;}
/*page_dot*/
.page_dot { width:60px; position:absolute; z-index:2; top:475px; left:50%; margin-left:400px;}
.page_dot a { background-color:#181818; width:14px; height:14px; display:block; float:left; border-radius:14px; box-shadow: -1px -1px 1px #b8b9b4 inset; margin-right:5px;}
.page_dot a.dselect { background-color:#0c4da2;}




/*content
============================================================== */
.content { width:972px; margin:0 auto; position:relative; z-index:1; margin-top:20px;}
/*list*/
.list ul { width:100%; overflow:hidden;}
.list ul li { float:left; width:310px; height:430px; padding:5px 7px 15px 7px;}
.list ul li a { cursor:pointer; display:block; width:310px; height:430px; border-radius:5px; overflow:hidden; background-color:#fff; box-shadow:0 0 5px rgba(0,0,0,0.2); text-decoration:none; position:relative; z-index:1;transition:0.4s; -moz-transition:0.4s;-webkit-transition:0.4s; -o-transition:0.4s;}
.list ul li a h2 { width:280px; height:44px; overflow:hidden; font-size:18px; color:#000000; line-height:22px; margin-top:15px; margin-left:20px; margin-bottom:10px;}
.list ul li a p { width:280px; height:30px; overflow:hidden; color:#434343; font-size:13px; line-height:15px; margin-left:20px;}
.list ul li a .listarw { background:url(../img/list_arw.png) no-repeat 0 0; width:27px; height:25px; position:absolute; z-index:3; top:395px; left:50%; margin-left:-14px;}
.list ul li a:after{    
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(80%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 80%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 80%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 80%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 80%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    background-size: 100% auto;
    bottom: 0px;
    content: "";
    display: block;
    height: 25%;
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
	z-index:2;
}
.list ul li a:hover { background-color:#0adcf2;} 
.list ul li a:hover h2 { color:#fff;}
.list ul li a:hover p { color:#fff;}
.list ul li a:hover:after{    
background: -moz-linear-gradient(top,  rgba(12,77,162,0) 0%, rgba(12,77,162,0) 80%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(12,77,162,0)), color-stop(80%,rgba(12,77,162,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(12,77,162,0) 0%,rgba(12,77,162,0) 80%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(12,77,162,0) 0%,rgba(12,77,162,0) 80%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(12,77,162,0) 0%,rgba(12,77,162,0) 80%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(12,77,162,0) 0%,rgba(12,77,162,0) 80%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000c4da2', endColorstr='#0c4da2',GradientType=0 ); /* IE6-9 */
}

.list a.readmore { width:958px; margin-left:7px; box-shadow:0 0 5px rgba(0,0,0,0.2); height:50px; text-align:center; display:block; line-height:50px; font-size:15px; text-decoration:none; color:#000; background:url(../img/rm_arw.png) #ffffff no-repeat 915px 20px; margin-bottom:25px; border-radius:5px; overflow:hidden;}
.list a.readmore:hover { background:url(../img/rm_arw.png) #0c4da2 no-repeat 915px 20px; color:#fff;}

/*footer*/
.s_btn { position:absolute; top:0; right:-35px; width:25px;}
.s_btn li{ float:left; margin-bottom:2px;}
.s_btn li a{width:25px; height:25px; display:block;}
.s1 a{ background:url(../img/icon1.png)}
.s2 a{ background:url(../img/icon2.png)}
.s3 a{ background:url(../img/icon3.png)}
.s1 a:hover,.s2 a:hover,.s3 a:hover{ background-position:0 -25px;}

/*footer*/
.footer { text-align:center; font-size:15px; color:#fff; line-height:15px; margin-bottom:40px; text-shadow:2px 2px 5px rgba(0,0,0,0.5);}





.gotop{
	width:70px;
	height:70px;
	position:absolute;
	bottom: 75px;
	left: 50%;
	margin-left: 500px;
	background:url(../img/goTop.png) no-repeat 0 0;
	text-indent:-5000px;
}
.gotop:hover { background-position: 0 -70px;}



/*popup
============================================================== */
.v1a,.v2a,.v3a,.v4a,.v5a{    
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99;
	display:none;
}
.btnx {
    position: absolute;
    right: -40px;
    top: 0px;
	z-index:2;
	text-indent:0 !important;
}

.va_con { width:725; height:410; position:absolute; top:50%; left:50%; margin-left:-362px; margin-top:-205px; padding:10px; background-color:#0c4da2; z-index:2;}

.blackbg { position:fixed; top:0; left:0; z-index:1; background-color:#fff; width:100%; height:100%; z-index:1;filter:alpha(opacity=90); opacity:0.9;}