@import url(https://fonts.googleapis.com/earlyaccess/cwtexfangsong.css);
html
{
	font-size:2vh;
	font-family: 'cwTeXFangSong', serif;/*中文和英文字型*/
}

.logo
{
	width:25vw;
	
}

.logo:after
{
	content:"123";
}


nav ul
{
	list-style:none;
}

nav ul li
{
	background-color:rgba(255,255,255,0.8);
	border: solid 0.12vw #000000;
	width:5vw;
	height:5vw;
	border-radius:100%;
	text-indent:-9999px;
	position: relative;
}
nav ul li:after
{
	content:"";
	border-top:solid 1vw rgba(0,0,0,0);/*三角形的高度*/
	border-left:solid 0.5vw rgba(0,0,0,0);/*三角形的左邊*/
	border-right:solid 0.5vw rgba(0,0,0,0);/*三角形的右邊*/
	position:absolute;
	bottom:0;
	left:50%;
	margin-left:-0.5vw;
	transition:all 0.2s;
	z-index:-1;
	/*利用left+margin-left(負值)來讓元素置中*/
}

nav ul li:hover:after
{
	border-top:solid 1vw #000000;
	bottom:-1vw;
}

nav ul li a
{
	width:100%;
	height:100%;
	display:block;
	background-size:60%;
	background-repeat:no-repeat;
	background-position:center center;
}


nav ul li:first-child a
{
	background-image:url(../images/navicon/navmark1.png);
}

nav ul li:last-child a
{
	background-image: url(../images/navicon/navmark5.png);
}

nav ul li:nth-child(2) a
{
	background-image: url(../images/navicon/navmark2.png);
}

nav ul li:nth-child(3) a
{
	background-image: url(../images/navicon/navmark3.png);
}

nav ul li:nth-child(4) a
{
	background-image: url(../images/navicon/navmark4.png);
}

nav ul
{
	display:flex;
	justify-content: space-between;
	width:35vw;
	margin-top:3vh;
}

header
{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	height:100vh;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:2;
	
}

.btnmenu
{
	display:none;
}

.content
{
	display:none;
	z-index:4;
	position:relative;
}

section
{
	background-image:url(../images/bgdot.png);
	background-color:rgba(0,0,0,0.8);
	height:100vh;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	display:flex;/*為了讓.newscontent上下置中*/
	align-items:center;
	justify-content:center;
}

.newscontent img
{
	width:25vh;
	
	
}

.newscontent li:after
{
	content:"";
	width:25vh;
	height:25vh;
	background-color:rgba(0,0,0,0);
	background-image: none;
	background-size:20%;
	background-repeat:no-repeat;
	background-position:center center;
	position:absolute;
	top:0;
	left:0;
	transition:all 0.5s;
	cursor:pointer;/*手形符號*/
}

.newscontent li:hover:after
{
	background-color:rgba(0,0,0,0.8);
	background-image:url(../images/icon/zoom-in-button.svg);
}

.newscontent li
{
	width:25%;
	position:relative;
	
}

.newscontent
{
	display:flex;/*為了要讓裡面的li左右排列*/
	justify-content:space-between;
	width:70vw;/*如果要用vw做單位,就要利用flex的方法左右置中*/
	height:45vh;
	
}

.newscontent li h2
{
	color:#C7AD3F;
	font-size:2rem;
	line-height:3rem;
}

.newscontent li p
{
	color:#FFFFFF;
	font-size:1.2rem;
	line-height:1.5rem;
	text-align:justify;/*For chrome*/
	text-justify:inter-ideograph;/*For IE*/
	display:none;
}

section h1
{
	display:none;
}

section i.fa-times
{
	color:#FFFFFF;
	font-size:4rem;
	cursor:pointer;
	position:absolute;
	right:3vh;
	top:3vh
}

#info iframe
{
	border:solid 0.5vh #CBCBCB;
	width:50vh;
	height:50vh;
}

#info p
{
	margin:3vw 0;
	color:#FFFFFF;
	font-size:1.5rem;
}

#info span
{
	display:block;
	font-size:2rem;
	line-height:3rem;
	color:#C7AD3F;
}

#info a
{
	color:#FFFFFF;
}

.tel
{
	text-decoration:none;
	cursor:default;
}

#info
{
	display:flex;
	justify-content:space-between;
	width:65vw;
	align-items:center;
	
}



footer
{
	position:fixed;
	bottom:1vh;
	left:0;
	width:100%;
	font-size:1.2rem;
	text-align:center;
	cursor:default;
}

body
{
/*	單一圖像背景
	background:url(../images/bg.jpg) no-repeat center center;
	background-size:cover;
*/
}

#news,#infoouter
{
	display:none;
}


.special a
{
	
	font-size:1.5rem;
	color:#C7AD3F;
	text-decoration:none;
}

.special li:first-child
{
	background-color:#AF0000;
}

.special li:last-child
{
	background-color:#000000;
	margin-left:1vh;
}

.special li
{
	display: inline-block;
	padding:1vh;
	box-sizing:border-box;
	border-radius:0.5vh;
}

.special
{
	position:fixed;
	right:5vh;
	top:5vh;
	z-index:3;
}

.specialimg
{
	position:fixed;
	right:5vh;
	top:15vh;
	z-index:3;
	
}

.specialimg img
{
	width:17vh;
	display:none;
	
}

.specialimg:after
{
	content:"";
	position: absolute;
	right:-1vw;
	top:-1vw;
	background:url(../images/icon/error.svg)  center center no-repeat;
	background-size:100%;
	width:3vh;
	height:3vh;
	cursor:pointer;
	
}
.outer
{
	display:none;
}

.line
{
	position:fixed;
	left:0;
	right:0;
	bottom:6vh;
	margin:auto;
	height:6vh;
	
}

/*導覽列文字的區塊*/
.navtxt
{
	position:absolute;
	writing-mode:vertical-lr;
	-webkit-writing-mode:vertical-lr;
	-moz-writing-mode:vertical-lr;/*firefox*/
	-ms-writing-mode:vertical-lr;/*IE*/
	font-size:2.1rem;
	color:#80FFFF;
	/*在CSS裡面不定義它的top.left的位置,因為這樣會讓所有的文字的位置都是一樣的*/
	/*位置就必須從js定義*/
}

.fbouter
{
	position: absolute;
	left:5vh;
	top:5vh;
}

.txtred
{
	font-size:1.5rem;
	color:#FF0000;
}
