body {
	    box-sizing: border-box;
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    background: #0e4559;
}
#bg {
    background-image: url(../images/index.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    color: #fff;
    background-color: #db8747;
    width: 1920px;
}
#wrap {
    max-width: 1200px;
    position: relative;
    margin: 0 auto;
    height: 1400px;
}
.slogan {
       background: url(../images/slogan.png);
    width: 427px;
    height: 276px;
    position: absolute;
    z-index: 50;
    top: 0%;
    margin-left: 1%;
    -webkit-animation: float ease-in-out 1.5s infinite;
    animation: float ease-in-out 1.5s infinite;
    -moz-animation: float ease-in-out 1.5s infinite;
    -ms-animation: float ease-in-out 1.5s infinite;
}

.logo {
  position: absolute;
    background: url(../images/logo.png);
    width: 230px;
    height: 140px;
    display: block;
    top: 10px;
    margin-left: 5%;
    cursor: pointer;
    z-index: 99;
}
a.logo:hover {
	-webkit-filter: brightness(1.3);
	filter: brightness(1.3);
}
ul.activity {
      position: absolute;
    color: #002e51;
    font-size: 18px;
    font-weight: bold;
    line-height: 26px;
    margin-top: 67%;
    margin-left: -6%;
       text-shadow: -3px -4px 3px #ffffff, 9px 5px 9px #ffffff, 9px 5px 9px #ffffff;
}
/*---------------------------
	內容 CONTENT
----------------------------*/
.content {
      position: absolute;
    width: 716px;
    text-align: center;
    margin-top: 28%;
    margin-left: -8%;
    height: 400px;
}
.content ul {
    height: 371px;
    overflow: auto;
}
.content li {
    float: left;
    margin: 5px 10px;
}
.box {
    width: 120px;
    height: 160px;
    background: url(../images/box.png) no-repeat;
    position: relative;
    /* margin-bottom: 5px; */
}
.dialog {
    content: "";
    display: block;
    position: absolute;
    padding-top: 17px;
    padding-left: 9px;
    right: -24px;
    top: -15px;
    width: 58px;
    height: 49px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: -1px;
    background: url(../images/dialog.png) no-repeat;
}
.collar {
    background: url(../images/done.png);
    width: 120px;
    height: 120px;
    top: 0px;
    position: absolute;
}
.date {
    /* background-color: #000; */
    width: 25px;
    height: 25px;
    text-align: center;
    border-radius: 20px;
    line-height: 23px;
    display: block;
    position: relative;
    top: 7px;
    left: 9px;
}
.props {
   text-align: center;
    width: 110px;
    margin: 25px auto 0 auto;
    height: 60px;
    line-height: 20px;
    overflow: hidden;
    font-weight: bold;
    font-size: 14px;
    color: #000;
}
/*---------------------------
	按鈕 BTN
----------------------------*/

.btn01 a {
       background: url(../images/btn01.png);
    width: 100px;
    height: 32px;
    display: block;
    margin-top: 1px;
    margin: 0 auto;
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -ms-transition-duration: 0.3s;
}
.btn01 a:hover{
	-webkit-filter: brightness(1.3);
	filter: brightness(1.3);
}
.btn01_b a {
	background: url(../images/btn01_b.png);
  width: 100px;
    height: 32px;
    display: block;
    margin-top: 1px;
    margin: 0 auto;
}
.light {
     position: absolute;
    mix-blend-mode: plus-lighter;
    animation: Leftslide linear 0.7s forwards, light01 ease-in-out 5s infinite;
    margin-top: -9%;
}
 @keyframes Leftslide {
 0% {
 opacity: 0;
 left: -50px;
}
 100% {
 opacity: 1;
 left: 0;
}
}
 @keyframes rightslide {
 from {
 opacity: 0;
 left: 50px;
}
to {
	opacity: 1;
	left: 0px;
}
}
 @keyframes light01 {
 0% {
transform: rotate(0deg);
transform-origin: 50% 100%;
opacity: 0;
}
 50% {
transform: rotate(-10deg);
transform-origin: 50% 100%;
	  opacity: 1;
}
 100% {
transform: rotate(0deg);
transform-origin: 50% 100%;
	  opacity: 0;
}
}
#style-3::-webkit-scrollbar-track {
  background-color: #FFF6D7;
}
#style-3::-webkit-scrollbar {
  width: 6px;
  background-color: black;
}
#style-3::-webkit-scrollbar-thumb {
background-color: #d88100;
  border-radius: 20px;
}
h1 {
	width: 27%;
    display: inline-block;
    background: rgb(119 69 7 / 95%);
    border: 0px solid #060404;
    border-radius: 40px;
    margin: 1%;
    height: 32px;
    text-align: center;
    padding-top: 5px;
    font-size: 24px;
    font-weight: bold;
    color: #ffee00;
}
.content .box02 {
	position: absolute;
    margin-left: 22%;
}
.notice {
   position: relative;
    display: inline-block;
    margin-top: 76%;
    width: 87%;
    color: #d1eeff;
    line-height: 31px;
    font-weight: 700;
    background-color: #006d97e8;
    font-size: 17px;
    text-align: justify;
    padding-left: 5%;
    padding-top: 3%;
    padding-right: 5%;
    padding-bottom: 3%;
    border: 6px solid #ffffff38;
    border-radius: 20px;
    box-shadow: aqua;
    box-shadow: inset 2px -1px 20px 9px #00000045;
}

h3 {
      color: #e9ff93;
    font-size: 26px;
    margin-bottom: 1%;
	margin-left: -2%;
}
.notice strong {
    color: #FDC400;
}
.notice li {
    list-style: auto;
}
/* ===scroll=== */
/*::-webkit-scrollbar {
 width: 5px;
}
::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.0);
 background: rgba(0,0,0,0.0);
 border-radius: 10px;
}

::-webkit-scrollbar-thumb {
 border-radius: 10px;
 -webkit-box-shadow: inset 1px 1px 6px 2px rgba(255,255,255,0.9);
}*/
/*---------------------------
	FOOTER
----------------------------*/

#footer {
	width: 100%;
	height: 75px;
	color: #fff;
	font-size: 12px;
       background: #0e4559;
}
.copyright {
    width: 1000px;
    margin: 0 auto;
    position: relative;
    top: 15px;
}
.copyright table {
	margin: 0 auto 0 auto
}
.copyright table td {
	padding-right: 8px
}
.copyright .about {
	line-height: 20px;
	color: #fff;
}
.copyright table span {
	color: #900;
}
.copyright table .t {
	font-size: 11px;
	line-height: 15px;
	color: #fff;
}
/*---------------------------
	IE提示
----------------------------*/

#alert-ie8 {
	background: rgba(0, 0, 0, 0.6);
	background: url(../images/bg.png)\0;
	clear: both;
	display: block;
	font-size: 15px;
	height: 20px;
	letter-spacing: 1px;
	padding: 5px;
	position: fixed;
	text-align: center;
	top: 0px;
	width: 100%;
	z-index: 1000;
	left: 50%;
	margin-left: -50%;
	color: #FFF;
}
#alert-ie8 a:link, #alert-ie8 a:visited {
	color: #FC3;
}
#alert-ie8 a:hover {
	color: #FF0;
}
#alert-ie8 strong {
	color: #F00;
}