/*Asign font code*/
@charset "utf-8";


/*Reset*/
*{
    margin: 0;
    padding: 0;
    }

a {
    text-decoration : none;
    }
    
ul, ol {
    list-style : none;
    }

html {
    font-family : verdana, sans-serif;
    line-height : 1.5;
	background-color:#f1efec;
	height:100%;
   /*background : url(../img/960_grid.jpg) repeat-y top center;*/
}

/*Delete the bottom space of img*/
img{
    vertical-align : middle;
    max-width : 100%;
	border-style:none;
    }
	
p{
text-align:justify;
}

td, th {
padding: 5px 0 10px 0;
}
	
h3{
color:#f8941d;
padding:20px 0 ;
}

h4{
padding:10px 0 ;
}
/*-----------------*/

/*Link colors*/

#contents a{
color:#F8941D;
}

#contents a:hover{
color:#F8941D;
}

.border_bottom a{
color:#000000;
}

.border_bottom a:hover{
color:#F8941D;
}


/*-----------------*/


#top{
width:100%;
margin:0 auto;
}

#top_menu{
max-width:980px;
height:40px;
margin:0 auto;
}

#banner{
background-color:#080808;
}

#btn_banner{
display:none;
}

#top_menu_inside{

margin: 0 auto;
}

#site_menu{
position:relative;
}

#site_menu img{
width:19px;
width:15px;
}

.section{
margin-bottom:50px;
}

.table_left{
width:30%;
}

#detail_1,#detail_2,#detail_3{
display:none;
width:100%;
}

tr.border_bottom td {
border-bottom:1pt solid #cccccc;
}


#contents{
width:90%;
margin-top:0;
margin: 0 auto;
font-size:15px;
background-color:#fff;
padding: 2% 5%;
min-height:600px;
}

#footer p{
padding:10px 20px;
color:white;
background-color:#222222;
text-align:center;
font-size:12px;
}

/***** menu bar******/

.navbar{
margin-top:-25px;
background-color:#222222;
text-align:center;
}
.navbar ul{
display:inline-block;

}

.navbar ul li {
float:left;
width:100px;

}

.navbar ul li a {
	display:block;
	padding:12px 0;
	color:#fff;
}

.navbar li a:hover{
color:#f7941d;
}

/**********/

/*整體網站的site_menu ( 網頁右上角的下拉選單 )*/

#dropmenu_container{
min-width:120px;
float:right;
height: 34px;
margin-right:3%;
}

#site_menu{
  list-style-type: none;
  height: 100%;
  /*margin: 30px auto 300px;*/
  padding: 0;
  background: #b9b7b4;
top: 10%;
}
#site_menu li{
  position: relative;
  width: 100%;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
#site_menu li a{
  display: block;
  margin: 0;
  padding: 10px 0 11px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  text-decoration: none;

}
#site_menu li ul{
  list-style: none;
  position: absolute;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
#site_menu li:last-child ul{
  
  width: 100%
}
#site_menu li ul li{
  overflow: hidden;
  width: 100%;
  height: 0;
  color: #fff;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;
}
#site_menu li ul li a{
  padding: 13px 15px;
  background: #b9b7b4;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  width:100%\9;
}
#site_menu li:hover{
  background: #b9b7b4;
  color: #f1c600;
  font-weight:bold;
}
#site_menu > li:hover > a{
  
}
#site_menu li:hover ul li{
  overflow: visible;
  height: 38px;
  border-top: 1px solid #b9b7b4;
  border-bottom: 1px solid #616d0b;

}
#site_menu li:hover ul li:first-child{
  border-top: 0;
}
#site_menu li:hover ul li:last-child{
  border-bottom: 0;
}
#site_menu li:hover ul li:last-child a{

}

#close_menu {
display:none;
}

#close_menu img{
width:100%;
height:100%;
position:absolute;
}

/***********************************/


#logo_container{ /*Logo座標*/
position:relative;
margin-left:3%;
float:left;
}

.logo{
width: 180px;
height: 40px;
text-indent: -9999px;
background: url('../img/logo.png') no-repeat;
display: block;
cursor: pointer;
}
	
.logo a{
		width: 180px;
		height: 40px;
		text-indent: -9999px;
		position: absolute;
	}
	
.float_img img{
width:100%;
} 

/*訂閱頁面的切換選單*/


#ordernav{
text-align:center;
}

#ordernav ul{
 display:inline-block;
}

#ordernav li{
float:left;
background: #e4e2e0;
/*background:url(../img/bt_color_0.png) top center;*/
padding:3px 20px;
cursor: pointer;
}

#ordernav li + li {
    margin-left:20px;
}

 #ordernav ul li.select {
       background: #f8941d;
     }

 #content_1{
display: none;
}
    
#content_0 iframe{

width:100%;
height:100% ;
border: #cec7bf solid 1px;
}
	

#order_contents{
width:95%;
}






/*768px以上*/
@media screen and (min-width : 768px){

#contents{
text-align:left;
max-width:800px;
border-left:solid 1px #cec7bf;
border-right:solid 1px #cec7bf;
}
#banner{
height:190px;
background :url(../img/webtitle.jpg) no-repeat;
background-color:#080808;
background-position:center;

}

#banner img{
visibility:hidden;
}

#btn_banner{
display:block;
position:absolute;
top:150px;
left:40%;
}

#site_menu{

margin: 0 auto;
float:right;
}

#site_menu ul li{
width:10%;
float:left;
}

.float_img img{
width:30%;
float: left;
} 

.table_left{
width:15%;
}
#dropmenu_container{
min-width:150px;
}

#site_menu{
  width: 100%;
}

#site_menu img{
width:13px;
width:10px;
}

#order_contents{
width:100%;

}

#content_0 iframe{
width:100%;
height:520px;
overflow:scroll;
}

#site_menu li{
min-width:120px\9; /*For IE*/
}
#site_menu li ul li a{
width:100%\9; /*For IE*/
}
} /*←Do not delete*/

/*For Retina Device show high resolution img */

@media
		(-webkit-min-device-pixel-ratio: 2),
		(min-resolution: 2dppx) {
		    .logo{
			width: 180px;
			height: 40px;
			background: url('../img/logo@2x.png') no-repeat;
			background-size: 100%;
			display: block;
			cursor: pointer;
			
	    }
}

	
/*iframe for iPhone */
@media screen and (max-device-width: 480px) {
#content_0 {
height:300px;
overflow:auto;
margin-top:20px;
-webkit-overflow-scrolling: touch;
}
}