/*--css--*/

/* ==
　首頁
=============================================================================== */

.IndexBanner{	
    width: 100%;
	position: relative;
}
.IndexBanner img {
    width: 100%;
    height: auto;
}
.index_banner{
    width: 100%;
	position: absolute;
    font-weight: bold;
    top: 0;
    left : 0; 
    display: block;
    height: auto;
    padding: 10% 10% 5% 10% ;
    text-align: center;
} 

.index_banner h2{
    font-size: 3.2em;
    font-weight: 800;
    margin-bottom: 10px;
    text-shadow: -1.5px -1.5px 0 #fff,
              1.5px -1.5px 0 #fff,
              -1.5px 1.5px 0 #fff,
              1.5px 1.5px 0 #fff;
}


.index_banner h3{
    font-size: 2.2em;
    font-weight: 600;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    color: #fc8902;
    margin-bottom: 0;
    text-shadow: -1.5px -1.5px 0 #fff,
              1.5px -1.5px 0 #fff,
              -1.5px 1.5px 0 #fff,
              1.5px 1.5px 0 #fff;
} 
.index_banner p{
    font-size: 1.3em;
    font-weight: bolder;
    color: #FFF;
    margin-bottom: 0;
    line-height: 1.2;
    text-shadow: -1px -1px 0 #8C8C8C,
              1px -1px 0 #8C8C8C,
              -1px 1px 0 #8C8C8C,
              1px 1px 0 #8C8C8C;
} 

/*-- responsive-mediaquries --*/
@media(max-width:1024px){
  .index_banner{
    padding: 9% 7% 5% 7% ;
} 
}
@media (max-width: 820px) {
    .index_banner {
        padding: 8% 7% 5% 7%;
    }
    .index_banner h2 {
  font-size: 2.5em;
    }
.index_banner p{
    font-size: 1.1em;
} 
}
@media (max-width: 600px) {
  .index_banner {
    padding: 5% 5% 2% 5%;
  }
.index_banner h3 {
  font-size: 2em;
    }
  .index_banner h2 {
    font-size: 2.2em;
  }   
   .index_banner p {
    font-size: 1em;
  }   
}

@media (max-width: 480px) {
  .index_banner h3 {
  font-size: 1.7em;
    }
  .index_banner h2 {
    font-size: 2em;
  }   
   .index_banner p {
    font-size: .8em;
  }   
}

@media (max-width: 450px) {
  .index_banner h3 {
  font-size: 1.5em;
    }
  .index_banner h2 {
    font-size: 1.8em;
  } 
}

@media (max-width: 420px) {
      .index_banner h3 {
        font-size: 1.2em;
    }
    .index_banner h2 {
    font-size: 1.5em;
  }
    .index_banner p {
        font-size: 12px;
    }
}


