#cast img{
			/*border:#fff 3px solid;*/
			box-shadow:5px 20px 30px rgba( 0, 0, 0, 0.3);
		}
        body{
        	font-family:'微軟正黑體', Arial, Helvetica, sans-serif;	
            margin:0;
            background-color:#f8ece9;
            /*background-image:url(images/bg.jpg);*/
			/*background-repeat:no-repeat;*/
			background-position:top center;
			background-color:#fff;
        }
        #wrapper{
        }
        a{
            color:#FFF;
            cursor:pointer;
            text-decoration:none;
        }
        p,h1,h1,h3,h4,h5,pre{
        	font-family:'微軟正黑體', Arial, Helvetica, sans-serif;	
            letter-spacing:0.1em;
        }
		p{
			font-size: 17px;
			color:#eee;	
		}
		pre{
			font-size: 17px;
			color:#eee;	
		    line-height: 36px;
		    padding-bottom: 2em;
		    margin: 0 3%;
			white-space: pre-wrap;
			word-wrap: break-word;
		}
        h1{
			font-family:'jinxuan';
			font-weight:600;
			letter-spacing:6px;
			font-size:46px;
            color:#fff;
            text-align:center;
            height:120px;
			line-height:100px;
			padding:0;
			clear:both;
			color: #5fdfce;
			width: 300px;
			margin: 5% auto;
			background-image: url(../images/title_bg.png);
			background-position: center;
        }
        h3{
        	display: inline-block;
        	background-color: #5fdfce;
        	color:#333;
        	font-weight: normal;
        	width: 120px;
        	padding: 8px 10px;
        	text-align: center;
        	margin: 30px;
        }
        #nav{
            width:100%;
            position:fixed;
            z-index:2;
            top:0;	
			padding:0.5% 0;
            letter-spacing:0.1em;
            font-size:1em;
            color:#fff;
            background-color:rgba( 0, 0, 0, 1);
		   	box-shadow: 0px 1px 50px rgba( 255, 255, 255, 0.2); 
			-webkit-box-shadow: 0px 1px 50px rgba( 255, 255, 255, 0.2); 
			-moz-box-shadow: 0px 1px 50px rgba( 255, 255, 255, 0.2); 
        }
        #nav .dramaInfo{
            margin-left:1em;
            float:left;	
        }
        #nav .dramaInfo span{
            font-size:1.2em;
            font-weight:bold;
			margin-right:.5em;
        }
        #nav ul{
            margin:0;
            width:auto;
            float:right;
        }
        #nav ul li{        	
        	font-weight: bolder;
            text-align:center;
            margin-right:15px;
            list-style:none;
            float:left;
        }
        #nav ul li:hover{
            color:#5fdfce;
        }
        .active{
        	color:#5fdfce;
        }
        #header{
			position:fixed;
            margin:0 auto;
        }
        #header .header{
			border:none;
            width:100%;
        }
        #top{
			float:left;
			z-index:1;
			position:relative;
            margin-top:34%;
            border:none;
        }
        #top .top{
            width:100%;
        }
        #content{
			background-image:url(../images/c_bg.png);
			background-color:rgba( 0, 0, 0, 0.8);
            padding:1% 17.5% 10% 17.5%;
			position:relative;
			z-index:1;
			width:65%;
			height:auto;
			display: inline-block;
        }
        #about,#story,#cast{
			/*border:#fff 3px solid;*/
			display:inline-block;
        }
        .clear{
        	clear: both;
        }
		#about p{
			float:left;
			text-align:left;	
		}
		#about .info{
			float:left;
            width:96%;
			margin:0 2% 5% 2%;
		}
		#about .info p{
			letter-spacing: 1.5px;
			float:left;
			font-size:18px;
			margin:0.5%;
			text-align:center;
			font-weight: bolder;
			border:#5fdfce 1px solid;
			background-color: rgba(0,0,0,.3);
			color:#fff;
			padding:1.8%;
			width:45%;

			/*
			letter-spacing: 1.5px;
			float:left;
			font-size:18px;
			margin:0.5%;
			text-align:center;
			border:#5fdfce 1px solid;
			color:#fff;
			padding:1.8%;
			width:45%;
			*/
		}
		#about .info span{
			color:#5fdfce;
			font-size: 24px;
		}
		.mv{

            width:80%;
            margin:0 10% 0 10%;
        }
        .story{
			padding:1% 7.5% 0 7.5%;
			width:85%;
        }
        .cast{
            width:84%;
            padding:1% 8% 50px 8%;
        }
		.cast .row{
			width:50%;
			float:left;
			margin-bottom: 5%;
		}
        .cast img{
			margin:5%;	
			float:left;	
            width:90%;	
        }
		.cast .content{
			float: left;
			text-align:left;
			padding:0 1.5em;
		}
		.cast h4{
			float: left;
			text-align:center;
			font-weight:normal;
			margin-bottom:10px;
			color:#fff;
			font-size: 27px;

		}
		.cast p{
			float: left;
			margin:0px;
			font-size:17px;
			line-height:36px;
		}
		.cast span{
			float: left;
			color:#5fdfce;
			margin-right: 10px;
		}
        .story p{
        	float: left;
            line-height:36px;
            padding-bottom:2em;
            margin:0 3%;
        }
        #footer{
            text-align:center;
            width:100%;
			float:left;
			position:fixed;
			bottom: 0;
            z-index:1;
            bottom:0;
            padding: 0.8% 0;
            letter-spacing:1px;
            font-size:15px;
            color:#fff;
            background-color:rgba( 0, 0, 0, 1);
		   	box-shadow: 0px 1px 50px rgba( 255, 255, 255, 0.2); 
			-webkit-box-shadow: 0px 1px 50px rgba( 255, 255, 255, 0.2); 
			-moz-box-shadow: 0px 1px 50px rgba( 255, 255, 255, 0.2); 
        }
		#gotop img{
			display: none;
		}
		.fb-like{
			top:5px;
			z-index:999;
			position:absolute;
			margin-left:10px;
		}
        @media screen and (max-width: 1023px) { 
			#gotop {
				position: fixed;
				z-index:999;
				right: 10px;
				bottom: 10px;    
				padding: 20px;    
				cursor: pointer;
			}
			#gotop img{
				display:block;
			}
			#cast img{
				-webkit-border-radius: 0;
				-moz-border-radius: 0;
				border-radius: 0;	
			}
			#nav{
				width:96%;
				padding:2%;
				line-height:1.4em;
				box-shadow:none;
			}
            #nav ul{
                display:none;
            }
			#header{
				margin:6% auto;
			}
			#top{
				margin-top:45%;
			}
			#about .info{
				float:left;
				width:80%;
				margin:-2% 7.5% 5% 7.5%;
			}
			#about .info p{
				width: 95%;
				font-size:18px;
				/*font-weight:bolder;*/
				margin:1% 1% 3% 1%;
				text-align:center;
				border:#aaa 1px solid;
				color:#fff;
				padding:3% 5%;
				float:left;
			}
            #content{
				position:relative;
				z-index:1;
				padding:1% 1% 10% 1%;
				height:auto;
				width:98%;
				background-color:rgba( 0, 0, 0, 0.85);
            }

			.cast .row{
				min-height:350px;
				width:100%;
			}
			.cast img{
				margin:2.5%;	
				float:left;	
				width:95%;	
			}
			.cast h4{
				font-size:1.6em;
				line-height:1.8em;
			}
			.cast .content{
				padding:1.5em;	
			}
			#footer{
				display:none;	
			}
		}
		@media screen and (max-width: 500px){
			h1{
				font-size: 2em;
				width: 100%;
			}
			h3{
        		width: 40%;
        		padding: 2% 3%;
        		margin: 30px 26.5%;
        	}
			pre,p{
				font-size:1.2em;
				line-height:2em;	
			}
			#header{
				margin:12% auto;
			}
			#nav{
				width: 94%;
				padding: 3%;
			}
			#nav .dramaInfo{
				margin:0;
				width:100%;
				clear:both;
				text-align:center;
			}
			#nav .dramaInfo span{
				width:100%;
				font-size:1.3em;
				font-weight:bold;
			}
			#top{
				margin-top: 50%;
				width: 100%;
			}
	        #top .top{
	        	display: none;
	        }
			#about .info p{
				width:94%;
			}
			.cast p{
				margin:0px;
				font-size:1.2em;
				line-height:2em;
			}
			#content {
			    position: relative;
			    z-index: 1;
			    padding: 1% 0% 10% 0%;
			    height: auto;
			    width: 100%;
			    background-color: rgba( 0, 0, 0, 0.85);
			}
		}