





/*****導覽列菜單*****/

/***.navbar {

  width: 100%;

  height: 60px;

  background: #000000;

  position: fixed;

  top: 0;

  z-index: 100;

}



.logo {

  height: 30px;

  position: absolute;

  top: 0;

  bottom: 0;

  left: 20px;

  margin: auto;

}



.logo img {

  width: auto;

  height: 30px;

}



.navbar_nav {

  width: 250px;

  height: calc(100vh - 60px);

  background: #000000;

  position: fixed;

  top: 60px;

  right: -250px;

  transition: .5s;

}



.navbar_nav a {

  display: block;

  text-decoration: none;

  color: #ffffff;

  padding: 20px;

  border-bottom: 1px solid #818181;

  text-align: center;

}



.menu_btn {

  width: 50px;

  height: 50px;

  background: #000000;

  position: absolute;

  top: 5px;

  right: 10px;

  margin: auto;

}



.menu_btn span {

  opacity: 0;

  width: 1px;

  height: 1px;

}



.menu_btn::after {

  content: '';

  position: absolute;

  width: 36px;

  height: 2px;

  left: 7px;

  background: #ffffff;

  top: 0;

  bottom: 0;

  margin: auto;

  box-shadow: 0 10px 0 #ffffff, 0 -10px 0 #ffffff;

}



#menu_control {

  opacity: 0;

  position: absolute;

}



#menu_control:checked~.navbar_nav {

  right: 0;

}***/



.pc {

  display: none;

}



.sequence {

  width: 100%;

}



.animateImgSmall{

  width: 100%;

  background: url(https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/sequence_s_1.sym no-repeat center / cover;;

  margin: 0 auto;

}



.download {

  width: 98%;

  display: flex;

  margin: -4% auto 0;

}





.download a {

  margin: 0 auto;

  padding: 0 3px;

}



.reminder{

  color: #ffffff;

  text-align: center;

  margin: 0 auto;

  padding: 10px 15px; 

}



.reminder h4{

  font-size: 16px; 

  color: yellow;

  padding: 0 0 5px;

}



.reminder p{

  font-size: 14px; 

  line-height: 20px; 

  font-weight: lighter; 

}



.reminder strong{

  font-weight: bolder;  

}



.title {

  width: 90%;

  margin: 10% auto 0;

}



.content{

  width: 90%;

  margin: 0 auto;

}



#story .content{

  margin-top: 0px;

  margin-right: auto;

  margin-bottom: 0;

  margin-left: auto;

}



.content img {

  width: 100%;

  margin: 0 auto;

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

  background-image: url('https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/story_content_1.sym');

}





/***遊戲特色****/

/***#introduce{

  margin-bottom: 10%;

}



.swiper-slide img {

  width: 100%;

  margin: 0 auto;

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}



.introduce_img1 {

  background-image: url('https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/introduce_1.sym');

}



.introduce_img2 {

  background-image: url('https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/introduce_2.sym');

}



.introduce_img3 {

  background-image: url('https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/introduce_3.sym');

}



.introduce_img4 {

  background-image: url('https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/introduce_4.sym');

}***/





@media (min-width: 768px) {



#qr{    

  display: block;

}



/*****導覽列菜單*****/

/**.menu_btn {

  display: none;

}



.navbar_nav {

  width: auto;

  height: 60px;

  display: flex;

  top: 0;

  right: 0;

}



.navbar_nav a {

  border-bottom: none;

}***/







.mobile {

  display: none;

}



.pc {

  display: block;

}



.animateImg{

  width: 100%;

  background: url(https://b.xn--qoxzm.xn--fiqs8s/bkg/sym/sequence_1.sym no-repeat center / cover;  

  margin: 0 auto;

}



.download {

  width: 44%;

  margin-top: 0%;

  margin-right: auto;

  margin-bottom: 0;

  margin-left: auto;

}



.download a {

  margin: 0 auto 0;

  padding: 10px;

}



.title {

  width: 30%;

  margin: 5% auto 0;

}



.content{

  width: 60%;

}



/***遊戲特色****/

/**#introduce{

  margin-bottom: 5%;

}**/

}





