﻿@charset "utf-8";
/* CSS Document */
/*--reset--*/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, th, var {
	font-style:normal;
	font-weight:normal;
}
ol, ul {
	list-style:none;
}
caption, th {
	text-align:left;
}
/*h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
}

html {
	min-height: 100%;
	_height:100%;
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	min-height: 100%;
	_height:100%;
	height: 100%;
}
a{text-decoration:none;}
/*--reset_END--*/

/*--共用版型--*/
body{ font-family:"微軟正黑體";}
   
/*背景漸層色*/  
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #BDEAEF));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #FFFFFF 0%, #BDEAEF 100%);

/*背景漸層色*/ 
 
  }

html,body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}
div
{
     font-family:微軟正黑體;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
 }
 a
 {
     font-family:微軟正黑體;
     text-decoration:none;
 }
#DIV_PARENT {
    position: relative;
    background:rgba(0,0,0,0);
	// 這個DIV是提供定位點的父區塊，一般設為 relative
    // 提供定位點的父區塊，因為只提供定位點，一般不設定寬度與高度
} 
.vm{
	vertical-align:middle;
	}
.center{text-align:center;}
.mg{margin:0 auto;}
.clear_b{
	clear:both;	
}	
.divtable{ display:table;}
.divtr{ display:table-row;}
.divtd{ display:inline-block;}
.divtd2{display:table-cell;}
.p1vw{padding:1vw;}
.col-vw-12 {
  width: 100vw;
}
.col-vw-11 {
  width: 91.66666667vw;
}
.col-vw-10 {
  width: 84vw;
}
.col-vw-9 {
  width: 75vw;
}
.col-vw-8 {
  width: 66.66666667vw;
}
.col-vw-7 {
  width: 58.33333333vw;
}
.col-vw-6 {
  width: 50vw;
}
.col-vw-5 {
  width: 41.66666667vw;
}
.col-vw-4 {
  width: 33.33333333vw;
}
.col-vw-3 {
  width: 25vw;
}
.col-vw-2 {
  width: 16.6667vw;
}
.col-vw-1 {
  width: 8.3333vw;
}
.font-vw-12 {
  font-size: 6.3vw;
}
.font-vw-11 {
  font-size: 5.4vw;
}
.font-vw-10 {
  font-size: 4.95vw;
}
.font-vw-9 {
  font-size: 4.5vw;
}
.font-vw-8 {
  font-size: 4.05vw;
}
.font-vw-7 {
  font-size: 3.6vw;
}
.font-vw-6 {
  font-size: 3.15vw;
}
.font-vw-5 {
  font-size: 2.7vw;
}
.font-vw-4 {
  font-size: 2.25vw;
}
.font-vw-3 {
  font-size: 1.8vw;
}
.font-vw-2 {
  font-size: 1.35vw;
}
.font-vw-1 {
  font-size: 0.9vw;
}

.mobnav {display:none}
.b{font-weight:900;}








@media screen and (max-width: 1400px){

}
@media screen and (max-width: 1150px)
{
.mobnav { display: block; cursor: pointer; padding:5px; position: absolute; top:0px; left:34vw;border:black solid 1px;border-radius:5px;}
.movicon {display: block;background: #000;position: relative;top:8px;width: 26px;height: 2px;border-radius: 2.5rem;transition:all .3s;}    
.movicon::before {display: block;background: #000;top:7px;content: "";transform: rotate(0deg);position: absolute;z-index: 999999;height: 2px;width: 100%;border-radius: 2.5rem;transition:all .3s;}
.movicon::after { display: block; background: #000; top:-7px; content: ""; transform: rotate(0deg); position: absolute; z-index: 999999; height: 2px; width: 100%; border-radius: 2.5rem; transition:all .3s;}
#leftlist{position:fixed;top:4.4vw;left:0px;z-index:99;left:-33vw;}
.moviconfocus { display: block; background: rgba(255,255,255,0); position: relative; top:0px; width: 26px; height: 2px; border-radius: 2.5rem; transition:all .3s; }
.moviconfocus::before {display: block;background: #000;top:0;content: "";transform: rotate(45deg);position: absolute;z-index: 999999;height: 2px;width: 100%;border-radius: 2.5rem;transition:all .3s;}
.moviconfocus::after {display: block;background: #000;top:0;content: "";transform: rotate(-45deg);position: absolute;z-index: 999999;height: 2px;width: 100%;border-radius: 2.5rem;transition:all .3s;}	

}
@media screen and (max-width: 1000px){

}
@media screen and (max-width: 880px){

}
@media screen and (max-width: 650px)
{
}
@media screen and (max-width: 550px){


}
@media screen and (max-width: 480px){

}
@media screen and (max-width: 400px){

}