@charset "utf-8";
            /*@import url(https://fonts.googleapis.com/css?family=Titillium+Web:500);*/
            @import url(https://fonts.googleapis.com/css?family=Titillium+Web);
            /* CSS Document */

			html, body{
				background: #010000;
				font-family: 'Titillium Web', sans-serif, '微軟正黑體', Microsoft JhengHei;
				font-size: 22px;
				width: 100%;
			}

			a {
				text-decoration: none;
				color: #0CF;
			}

			h2 {
				padding-left: 6%;
				padding-top: 5%;
				color:#ff3300;
				font-size: 30px;
				letter-spacing:2px;	
				width: 90%;
				font-weight:bold;
				/*text-shadow:#F00 0px 0px 6px;*/
			}
			h3{ 
			    position:relative;
				margin-top:-5%;
				padding-bottom:3%;
				text-align:center;
				font-size: 40px;
				color: #FFF;
				font-weight:70px;
				text-shadow: #F60 0px 0px 6px;
				
			}
			
			p {
				margin-top:1%;
				padding-top: 1%;
				padding-left:1%;
				margin-left:5%;
				padding-bottom:1%;	
				color: #ddd;
				font-size: 20px;
				line-height:28px;
				width: 90%;
				letter-spacing: 1px;

				
			}


        .ytcontainer {

                    padding: 25px;  
            }

            #ytplayer {
                max-width: 1100px;  
                margin: 0 auto;
            }



            .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 

            .embed-container iframe, .embed-container object, .embed-container .embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


			
 .content_01{
      background-image:url('../img/06.jpg');
      background-size:cover;
      background-repeat:no-repeat;
    }






@media screen and (min-width: 1331px) {
   

.content_01_w{
  padding-top: 10%;
}

.content_02_w{
  padding-top: 10%;
}

.content_03_w{
  padding-top: 20%;
}

.content_03_img{
  margin-bottom:5%; 
}

.content_04_w{
  padding-top: 12%;
}


.content_04_img{
  margin-top: 3%;
  margin-bottom: 3%;
}


.content_05_w{
  padding-top: 10%;
}

.content_05_img{
  margin-top:5%;
  margin-bottom:5%;
}

	

    
}


@media screen and (min-width: 994px) and (max-width: 1330px) {
   

.content_01_w{
  padding-top: 10%;
}

.content_02_w{
  padding-top: 10%;
}

.content_03_w{
  padding-top: 12%;
}

.content_03_img{
  margin-bottom:5%; 
}

.content_04_w{
  padding-top: 5%;
}


.content_04_img{
  margin-top: 2%;
  margin-bottom: 2%;
}


.content_05_w{
  padding-top: 5%;
}

.content_05_img{
  margin-top:5%;
  margin-bottom:5%;
}

h2 {
        padding-left: 6%;
        padding-top: 5%;
        color:#ff3300;
        font-size: 25px;
        letter-spacing:2px; 
        width: 90%;
        font-weight:bold;
        /*text-shadow:#F00 0px 0px 6px;*/
      }
p {
        margin-top:1%;
        padding-top: 1%;
        padding-left:1%;
        margin-left:5%;
        padding-bottom:1%;  
        color: #ddd;
        font-size: 18px;
        line-height:26px;
        width: 90%;
        letter-spacing: 1px;

        
      }


	

    
}




@media screen and (min-width: 769px) and (max-width: 993px) {

.content_01_w{
  padding-top: 3%;
}

.content_02_w{
  padding-top: 5%;
}

.content_03_w{
  padding-top: 5%;
}

.content_03_img{
  margin-bottom:5%; 
}

.content_04_w{
  padding-top: 5%;
}


.content_04_img{
  margin-top: 3%;
  margin-bottom: 3%;
}


.content_05_w{
  padding-top: 2%;
}

.content_05_img{
  margin-top:5%;
  margin-bottom:5%;
}





h2 {
        padding-left: 6%;
        padding-top: 5%;
        color:#ff3300;
        font-size: 20px;
        letter-spacing:2px; 
        width: 90%;
        font-weight:bold;
        /*text-shadow:#F00 0px 0px 6px;*/
      }
p {
        margin-top:1%;
        padding-top: 1%;
        padding-left:1%;
        margin-left:5%;
        padding-bottom:1%;  
        color: #ddd;
        font-size: 15px;
        line-height:26px;
        width: 90%;
        letter-spacing: 1px;

        
      }

   


    
}




@media screen and (min-width: 581px) and (max-width: 768px) {


	



	h2 {
				padding-left: 6%;
				padding-top: 5%;
				color:#ff3300;
				font-size: 20px;
				letter-spacing:2px;	
				width: 90%;
				font-weight:bold;
				/*text-shadow:#F00 0px 0px 6px;*/
			}

   

   p {
				margin-top:1%;
				padding-top: 1%;
				padding-left:1%;
				margin-left:5%;
				padding-bottom:1%;	
				color: #ddd;
				font-size: 16px;
				line-height:24px;
				width: 90%;
				letter-spacing: 1px;

				
			}



    
}




@media screen and (min-width: 469px) and (max-width: 580px) {






	h2 {
				padding-left: 6%;
				padding-top: 5%;
				color:#ff3300;
				font-size: 18px;
				letter-spacing:2px;	
				width: 90%;
				font-weight:bold;
				/*text-shadow:#F00 0px 0px 6px;*/
			}



   

   p {
				margin-top:1%;
				padding-top: 1%;
				padding-left:1%;
				margin-left:5%;
				padding-bottom:1%;	
				color: #ddd;
				font-size: 16px;
				line-height:24px;
				width: 90%;
				letter-spacing: 1px;

				
			}



    
}






@media screen and (max-width: 468px) {








	h2 {
				padding-left: 6%;
				padding-top: 0%;
				color:#ff3300;
				font-size: 16px;
				letter-spacing:2px;	
				width: 90%;
				font-weight:bold;
				/*text-shadow:#F00 0px 0px 6px;*/
			}






	p {
				margin-top:1%;
				padding-top: 1%;
				padding-left:1%;
				margin-left:5%;
				padding-bottom:1%;	
				color: #ddd;
				font-size: 12px;
				line-height:24px;
				width: 90%;
				letter-spacing: 1px;

				
			}

    
}