@charset "UTF-8";

body {
  font-family: '微軟正黑體', 'Malgun Gothic', Dotum, Tahoma, sans-serif;
  background-color: #111;
  color: #fff;
  min-width: 1200px;
  max-width: 1920px;
  margin: 0 auto
}

img {
  max-width: 100%;
  height: auto
}

button {
  background: 0 0;
  border: none
}

.container {
  width: 1200px
}

a#gotop {
  display: block;
  position: fixed;
  bottom: 30px;
  left: 30px;
  z-index: 999;
  background: transparent url(../image/btn_top.png) no-repeat 0 0;
  width: 120px;
  height: 269px;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .2));
  -webkit-filter: brightness(100%);
  filter: brightness(100%)
}

:focus {
  outline: 0
}

a:active,
a:focus,
a:hover {
  text-decoration: none
}

ul {
  margin: 0;
  padding: 0;
  list-style-type: none
}

.navbar-inverse .navbar-nav>li>a,
.nav-center li a,
.evenBtn a,
.sideBtn ul>li>a {
  -moz-transition: all .25s ease-in-out;
  -webkit-transition: all .25s ease-in-out;
  transition: all .25s ease-in-out
}

.sideBtn {
  position: fixed;
  right: 30px;
  top: 65px;
  z-index: 99;
}

.sideBtn ul>li {
  margin: 15px 0;
  display: block;
}

.sideBtn ul>li>a {
  background: transparent url(../images/sidebtn_off.png) no-repeat 0 0;
  width: 120px;
  height: 120px;
  display: block;
  text-indent: -999999px;
}

.sideBtn ul>li>a:hover {
  background: transparent url(../images/sidebtn_on.png) no-repeat 0 0;
}

.sideBtn ul>li:nth-child(2)>a {
  background-position-y: -120px;
}

.wrapper {
  min-width: 1200px;
  max-width: 1920px;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
}

.head {
  background: url(../images/headbg.jpg) no-repeat 50% 0;
  height: 1004px;
  position: relative;
}

#fireworks {
  min-height: 65vh;
  padding-top: 50px;
  color: white;
  z-index: 0;
}

.ribbon,
.tit,
.cha,
.sub {
  position: absolute;
  left: 50%;
  margin: 0 auto;
}

.ribbon {
  background: transparent url(../images/ribbon.png) no-repeat 0 0;
  width: 912px;
  height: 597px;
  z-index: 5;
  margin-left: -413px;
  top: 83px;
}

.tit {
  background: transparent url(../images/tit.png) no-repeat 0 0;
  width: 583px;
  height: 226px;
  z-index: 1;
  margin-left: -292px;
  top: 137px;
}

.cha {
  background: transparent url(../images/cha.png) no-repeat 0 0;
  width: 745px;
  height: 626px;
  z-index: 3;
  margin-left: -372px;
  top: 252px;
}

.sub {
  background: transparent url(../images/subtit.png) no-repeat 0 0;
  width: 899px;
  height: 149px;
  z-index: 9;
  margin-left: -450px;
  bottom: 150px;
}

.hash {
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 75px;
  z-index: 11;
}

.hash p {
  font-size: 30px;
  color: #004bba;
  margin: 0;
  font-weight: bolder;
  line-height: 62px;
  text-shadow: #FFF 0px 0px 5px, #FFF 0px 0px 10px, #FFF 0px 0px 15px, #7ad5ff 0px 0px 20px, #7ad5ff 0px 0px 30px, #7ad5ff 0px 0px 40px, #7ad5ff 0px 0px 50px, #7ad5ff 0px 0px 75px;
}

.evenBtn {
  display: inline-block;
  margin-left: 20px;
}

.evenBtn a {
  background: transparent url(../images/evenbtn_off.png) no-repeat 0 0;
  width: 198px;
  height: 62px;
  display: block;
  text-indent: -999999px;
}

.evenBtn a:hover {
  background: transparent url(../images/evenbtn_on.png) no-repeat 0 0;
}

.content {
  background: url(../images/content.jpg) no-repeat 50% 0;
  height: 1659px;
  position: relative;
}

@media screen and (max-width:1199px) {
  
  .sideBtn ul>li>a {
    width: 151px;
    height: 151px;
    background: transparent url(../images/sidebtn_off_mob.png) no-repeat 0 0;
  }
  .sideBtn ul>li>a:hover {
    background: transparent url(../images/sidebtn_on_mob.png) no-repeat 0 0;
  }
  .sideBtn ul>li:nth-child(2)>a {
    background-position-y: -151px;
}
}