@charset "utf-8";
/* CSS Document */
body{
	background-color: #9a312b;
	
}
img{
	max-width:100%;}
header{
	padding:5px;}
#index_header{
	background-color: #94580d;
	position: fixed;
	width: 100%;
	z-index: 100;
	background-repeat: no-repeat;	
	background-size: 100% 100%;
}	
#index_header img{
	max-height:40px;
	}
#header_bt{
	display:inline-block; float:right;
	}	
#header_bt img{  margin:0px 5px;}	
.awarded_stroe .photo{
	height:100px;
	background-color:#F93;}
.card{
	overflow:hidden;}	
.card:hover .hover{
  display:flex;
  color:#FFF;
    animation-name:oxxo;
    animation-duration:0.5s;


}
.hover{
	position: absolute;
	display: none;
	width: 100%;
	height: 100%;
	color: #FFF;
	
	justify-content: center;
	align-items: center;

	background-color:#000;
	text-decoration: none;  

}
.awarded_stroe .card{
	text-align:center;}
.awarded_stroe .card p{
	margin:1px;
}
.awarded_stroe .card p:first-child{
	font-weight:bolder;
	font-size:100%;
}
.awarded_stroe .card{
	margin-bottom:15px;}
#nav-item-8 a{
	background-color:#F30;
	border-radius: 30px;
	color:#FF6;
	font-weight:bolder;
	}	
#nav-item-8 a:hover{
	background-color:#FF6;
	color:#F30;
}

@keyframes oxxo{
    from{
	
		bottom:-200px;
     
    }
    to{
        bottom:0px;
    }
}

.bt_index{
	padding: 80px 10px 10px 10px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background-repeat: no-repeat;
	background-position: center 10px;
	display: block;
	color: #FFF;
	text-align: center;
	font-size: 160%;
	text-decoration: none;
	font-weight:bolder;
	}	
.bt_index:hover{
	color:#FF9;
	-webkit-filter:saturate(0.5);}	
.bt01{
	background-color: #2195ae;
	background-image: url(images/i_1.png);
}
.bt02{
	background-color:#d4aa00;
background-image: url(images/i_2.png);

	}
.bt03{
	background-color:#be4e4c;
background-image: url(images/i_3.png);
}
.bt04{
	background-color:#6a854e;
background-image: url(images/i_4.png);
}
.sp{
	padding:50px 0px;
	}
.sp1{
	background-color:#fff3e3;
	}	
	.sp2{
	background-color: #ffe9dc;
	font-size: 120%;
	color: #6c503e;
}	
.sp3{
	background-color:#fff3e3;
	color:#1d8586;
	
}
.spbt{
	}	
footer{
	color:#fff;
	padding-top:10px;
	background-color:#351506;
}
footer a{
	color: #fff;
	text-decoration: none;
	}
footer a:hover{
	color:#FF9;
}
.animate
{
	transition: all 0.1s;
	-webkit-transition: all 0.1s;
}
.action-button
{
	font-weight:bolder;
	position: relative;
	padding: 10px 40px;
 
	border-radius: 10px;

	font-size: 25px;
	color: #FFF;
	text-decoration: none;
	display:inline-block;
	text-align:center;


	width:300px;

		margin:20px;

}
.action-button:hover{
	color:#000;}

.red
{
	background-color: #E74C3C;
	border-bottom: 5px solid #BD3E31;
	text-shadow: 0px -2px #BD3E31;
}
.red:hover{
	color:#FC3;
	}
.red2
{
	background-color: #FF6600;
	text-shadow: 0px -2px #BD3E31;
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #C24B29;
}

.red2:hover
{
	color: #FFC;
}
.action-button:active
{
	transform: translate(0px,5px);
  -webkit-transform: translate(0px,5px);
	border-bottom: 1px solid;
}	
.awarded_stroe h1.right-arrow {
  display: inline-block;
  color: #FFFFFF;
 
  line-height:60px;
  margin: 15px auto;
  position: relative;
  width: 320px;
  font-size:120%;

  text-align:center;
}
h1.right-arrow {
  display: inline-block;
  color: #FFFFFF;
  text-align:center;
 
  line-height:60px;
  margin: 15px 0;
  position: relative;
  width: 200px;
}
h1.right-arrow:before,
h1.right-arrow:after {
  content: "";
  border-style: solid;
  border-width: 0;
  height: 0;
  position: absolute;
  width: 0;
}
h1.right-arrow {
  background-color: #005d98;
}

h1.right-arrow:after {
  border-width: 30px  30px 30px 0 ;
  
}


h1.right-arrow:before {
  border-width: 30px 0 30px 30px;
}
h1.right-arrow:before {
  border-color: #005d98 transparent;
  left: -30px;
}

h1.right-arrow:after {
  border-color:  #005d98 transparent;
  right: -30px;
}
.news{
	list-style:none;margin:0px;
	padding:0px;}

.news li{
	margin:5px 0px;
	padding:5px 10px;
	background-color:#FFF;
	border-radius: 10px;
	border-left-style: none;
}
.news a{
	color: #630;
	text-decoration: none;
}
.news .time{
	float: right;
	font-size: 80%;
	background-color: #d3ede0;
	border-radius: 10px;
	padding: 2px 5px;
}
.page_title{
	color: #1d8586;
}


.ribbon2 {
		font-weight:bolder;
 width: 40px;
 padding: 10px 0;
 position: absolute;
 z-index:5;
 top: -6px;
 left: 25px;
 text-align: center;
 border-top-left-radius: 3px;
 background-color:#FED825;
}
.ribbon2:before {
 height: 0;
 width: 0;
 right: -5.5px;
 top: 0.1px;
 border-bottom: 6px solid #8D5A20;
 border-right: 6px solid transparent;
}
.ribbon2:before, .ribbon2:after {
  content: "";
  position: absolute;
}
.ribbon2:after {
  height: 0;
  width: 0;
  bottom: -19.5px;
  left: 0;
  border-left: 20px solid #FED825;
  border-right: 20px solid #FED825;
  border-bottom: 20px solid transparent;
}
.ribbon{
position: relative;
}
.ribbon_moon{
	margin-top:30px;
	position:relative;}
.ribbon2_moon{
	z-index:500;
	  position: absolute;
  top: 18px;
  right:90px;
 /* background-color: yellow;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 5px 5px 10px rgba(255,220,28, 0.5);
  */
	}
.ribbon2_moon::before {
/*	font-family:
  content: "中秋\A好禮";  
  color: black;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
    white-space: pre; 
	text-shadow: 
    -1px -1px 0 #fff,  
    1px -1px 0 #fff,   
    -1px 1px 0 #fff,   
    1px 1px 0 #fff;    */
	
	content: url('images/icon_moon.png');  
  position: absolute;
  width: 150px;  
  height: 150px; 
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;  
  
  
}	
@media (min-width:769px){
.imagebox{
	
	height:250px;
	overflow:hidden;
	text-align:center;}
.imagebox img{
	width:100%;
	}	
}
@media (max-width:768px){
	#header_bt{
		display:none;}
	.imagebox{
	height:auto;
	overflow:auto;
	}
.imagebox img{
	width:100%;

	}	
	.index_banner{
		padding-top:40px;}
	
}
#menu_2{
	color:#FF0;
	font-weight:bolder;
	}