@charset "utf-8";
@-ms-viewport {
	width: 720px;
	user-zoom:fixed;
}

* {
	outline: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    -webkit-focus-ring-color:  rgba(0, 0, 0, 0);
	
}



html, body {
    height: 100%;
    width:720px;
}
html{
    overflow-y:scroll;
}
body {

    font-family:"Roboto","微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
    font-size: 12px;
    font-weight:300;
    color:#000000;
    background-color:#FFF;

}
body.black_theme{
	  color:#FFF;
    background-color:#000;
}
a{
	
	color:#F60;
	text-decoration: none;
}
.loading{
	position:fixed;
	z-index:9999;
	text-align:center;
	width:100px;
	height:100px;
	background-color:#000;
	border-radius:8px;
	line-height:98px;
	left:310px;
	bottom:50%;	
}
.fix_width{
    position:relative;
    width:720px;
    /*margin:0 auto;	*/
}
#container {
    position:relative;
    /*width: 1200px;*/
    overflow:hidden; 
    min-height:100%;

    width:720px;

}
#header {	
    position:fixed;
    display: block;
    height:96px;
    width:720px;
    top:0px;
    left:0px;
    z-index:999;
 	background-color:#FFF;
 
}
.black_theme #header{
	background-color:#000;
}
#header .logo{
    /*
    background: url("../images/common.png") no-repeat -200px -0px;
    */
    position: absolute;
    width: 147px;
    height: 50px;
    left: 33px;
    display: block;
    color: #000;
    font-size: 147px;
    top:50px;
    line-height:0px;	
}
.black_theme #header .logo {
	color: #FFF;
}


#header .btn_lang{
    position:absolute;
	background-color:#444;
	border-radius:5px;
    width:48px;
    height:48px;
    right:36px;
    top:24px;
    display:block;
	text-align:center;
	font-family:"微軟正黑體", "Microsoft JhengHei", "Arial Unicode MS", "Arial";
	font-size:32px;
	
	color:#CCC;
}
#header .btn_lang>span{
	display:block;
	margin-top:22px;	
	line-height:0px;
}

#main{
    display:block;
    min-height:300px;
    margin-top:100px;
    margin-bottom:235px;
	
}

#main .content{
	position:relative;
/*	list-style:none;*/
}
/*#main .content>li{
	
}
#main .content>li:last-child{
	
}*/
#footer {	
    position:absolute;
    display: block;
    min-height:235px;
    bottom:0px;
    width:720px;
	color:#444;
	font-size:22px;
	 max-height: 5000px;
}
.black_theme #footer {
	color:#CCC;
}
#footer .btn_more{
	display:block;
	position:relative;
	width:540px;
	
	background-color:#F66000;
	color:#FFF;
	border-radius:10px;
	margin-left:88px;
	margin-top:50px;
	margin-bottom:20px;
	text-align:center;
	padding-top:20px;
	padding-bottom:20px;
	font-family:"Roboto Condensed";
	font-size:44px;	
	font-weight:700;
}
#footer .btn_more>.ico{
	font-size:36px;	
}
#footer ul.icons{
    list-style:none;
    width:100%;
    text-align:center;
}
#footer ul.icons>li{
    display:inline-block;
    width:80px;
    font-family: 'feva-sony-icons';
    font-size:80px;
    margin:22px;
}
#footer ul.icons>li a{
    color: #CCC;
}
#footer ul.links{
	list-style:none;
	width:100%;
	text-align:center;
	padding-top:10px;
}
#footer ul.links>li{
	display:inline-block;
}
#footer ul.links>li:not(:last-child):after{
	content:"|";
	margin-left:15px;
	margin-right:10px;
}
#footer .copyright{
	text-align:center;
	margin-top:18px;
	font-size:18px;
	margin-bottom:10px;
}
/*===========================common style by fky==================================*/


.scrollSlider{
	width:720px;
	overflow-x:scroll;
	overflow-y:hidden;
	-webkit-overflow-scrolling: touch;
}
.scrollSlider>ul{
	list-style:none;
	
}
.scrollSlider>ul>li{
	position:relative;
	display:block;
	float:left;

}

/*===========================common style by fky==================================*/

.zindex10{
    position:absolute;
    z-index:10;	
}
.zindex20{
    position:absolute;
    z-index:20;	
}
.zindex30{
    position:absolute;
    z-index:30;	
}
.zindex40{
    position:absolute;
    z-index:40;	
}
.zindex50{
    position:absolute;
    z-index:50;	
}
.zindex60{
    position:absolute;
    z-index:60;	
}
.zindex70{
    position:absolute;
    z-index:70;	
}
.zindex80{
    position:absolute;
    z-index:80;	
}
.zindex90{
    position:absolute;
    z-index:90;	
}
/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


