﻿@import url("reset.css");

*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}

html{ 
	font-family:Arial, sans-serif, "微軟正黑體";
	-webkit-text-size-adjust:none; width:100%;}
a:link{color: turquoise;}
/* DeskTop First 桌機版優先－－－－－－－－－－－－－－－－－－ */

body{color: #fff;font-size: 16px; letter-spacing:0.05em; font-weight: 300;line-height: 22px;}
.ftv_t{display: inline-block; width: 10%; height: 45px; padding: 10px 20px 0px 20px; }
.ftv_t img{width:auto; height: 100%;}
.top_link{display: inline-block; width: 89%; height: 45px; text-align: right; padding: 20px 12px 0px 12px; vertical-align: top;}
.top_link li{display: inline-block; color: #ffffff; margin: 0px 8px; } 

.ftv_f{ display: inline-block; width: 35%; height: 50px; padding: 2px 10px; text-align: right;}
.ftv_f img{ width:auto; height: 100%; opacity: 0.7; }
.ft_info{ display: inline-block; width: 60%; padding-top: 10px; font-size: 0.8em; border-left: rgba(255,255,255,1.00) solid 1px; padding: 5px 20px; margin: 0px 15px;}

#MENU{display:none;z-index: 888;}
#SUBMENU{
	width:210px;
	height:310px;
	background:url(images/menu_box.png) no-repeat;
	padding-bottom:15px;
	position:absolute;
	top: 0px;
	left:0px;
  display:none;
  z-index: 899;
}

#SUBMENU ul{
	padding:25px 20px 20px 25px;
}

#SUBMENU li a{
	font-size:0.85em;
	display:block;
	line-height:45px;
	text-align:justify;
	text-justify:inter-word;
	color:#000;
	text-decoration:none;
	margin-bottom:-1px;
	font-weight:bold;
}
#SUBMENU li a:hover{}


/* 以下為 平板電腦－－－－－－－－－－－－－－－－－－以下為 平板電腦－－－－－－－－－－－－－－－－－－以下為 平板電腦－－－－－－－－－－－－－－－－－－ */ 
@media screen and (min-width: 577px) and (max-width: 1024px) {
body{color: #fff;font-size: 16px; letter-spacing:0.05em; font-weight: 300;line-height: 22px;}
.ftv_t{display: inline-block; width: 10%; height: 45px; padding: 10px 20px 0px 20px; }
.ftv_t img{width:auto; height: 100%;}
.top_link{display: inline-block; width: 89%; height: 45px; text-align: right; padding: 20px 12px 0px 12px; vertical-align: top;}
.top_link li{display: inline-block; color: #ffffff; margin: 0px 8px; } 

.ftv_f{ display: inline-block; width: 35%; height: 50px; padding: 2px 10px; text-align: right;}
.ftv_f img{ width:auto; height: 100%; opacity: 0.7; }
.ft_info{ display: inline-block; width: 60%; padding-top: 10px; font-size: 0.8em; border-left: rgba(255,255,255,1.00) solid 1px; padding: 5px 20px; margin: 0px 15px;}

	
}



/* 以下為 手機版－－－－－－－－－－－－－－－－－－ 以下為 手機版－－－－－－－－－－－－－－－－－－ 以下為 手機版－－－－－－－－－－－－－－－－－－ */
@media screen and (max-width: 576px) and (min-width: 320px){

body{color: #fff;font-size: 16px; letter-spacing:0.05em; font-weight: 300;line-height: 20px;}
.ftv_t{display: inline-block; width: 10%; height: 26px; padding: 3px 15px 0px 10px; }
.ftv_t>img{width:auto; height: 100%;}


.ftv_f{ display:inline-block; width: 10%; height: 30px; padding: 2px 5px; text-align:center;}
.ftv_f>img{ width:auto; height: 100%; opacity: 0.7; }
.ft_info{ display:block; width: 96%; font-size: 0.8em; border-left:none; padding: 5px 5px; margin: 0px 5px;}

#MENU{display:inline-block; position: fixed; width: 35px; padding: 3px; top:0; right: 0; color: #FFFFFF;z-index: 988; background-color: aqua;}
#SUBMENU{
  width:50%;
  height: inherit; min-height: 300px;
  background-color: rgba(45, 45, 45, 0.845);
  /* background-color:#333333; */
	/* background:url(../images/menu_box.png) no-repeat; */
  padding-bottom:15px;
  display:none;
  position:absolute;
  top:35px;
  left: 50%;
  z-index: 899;

}

#SUBMENU ul{
	padding:25px 20px 20px 25px; list-style: none;
}

#SUBMENU li a{
	font-size:1.1em;
	display:block;
	line-height:45px;
	text-align:justify;
  text-justify:inter-word;
  color: #FFFFFF;
  /* color: rgb(255, 255, 255, 0.7); */
	text-decoration:none;
	margin-bottom:-1px;
	font-weight:bold;
}
#SUBMENU li a:hover{
	color: rgb(255, 255, 255, 1);}



}