#container{
  /*background-image:url(../images/top/mainvisual.jpg);*/
}

main{
  padding-top:8%;
  position:relative;
  padding-top:12%;
}

main #logo_set{
  float:right;
}

main .info1027{
  display:inline-block;
  padding:0.3% 1%;
  text-align:center;
  border:1px #DDD solid;
  background-color:rgba(255,255,255,0.75);
  text-decoration: none;
  color:#111;
  position:absolute;
/*  bottom:2%;
  left:6.5%;*/
  font-size:80%;
  top:3%;
  right:3%;
}


main #platinum_wappen{
  display:block;
  display:inline-block;
  position:absolute;
/*  bottom:2%;
  left:6.5%;*/
  top:3%;
  right:5%;
  width:32%;
}


.mov_button{
  display:inline-block;
  position:absolute;
  bottom:7%;
  right:5%;
  width:26%;
  max-width:350px;
}
.mov_button img{
  width:100%;
  border:1px #900 solid;
  display:block;
  box-shadow:0 0 10px #000,0 0 10px #000,0 0 5px #000;
}

.mov_button span#preview_cap{
  position:absolute;
  width:100%;
  left:0;
  bottom:0;
  padding:0.2%;
  color:#FFF;
  text-shadow:0 0 5px #F00,0 0 5px #F00,0 0 5px #F00,0 0 5px #F00,0 0 5px #F00;
  text-align:center;
  font-size:120%;
}

main #tgs_link{
  position:absolute;
  top:2%;
  right:6.5%;
  width:30%;
  max-width:150px;
}

#content{
  background-image:none !important;
}
.movie{
  width:100%;
  padding-top:56.25%;
  position:relative;
  box-shadow:0 0 9px rgba(155,0,55,0.8);
}
.movie iframe{
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
}

#movChange{
  text-align:center;
}
#movChange a{
  display:inline-block;
  width:24.5%;
  font-size:80%;
  border:1px #444 solid;
  padding:1%;
  color:#FFF;
  text-decoration: none;
  margin:2% 0;
  border-radius:3px;
  position:relative;
}
#movChange a .check_mark{
  font-size:14px !important;
  font-family:serif !important;
  top:-12px !important;
  transform:scale(0.8,1) !important;
}

#movChange a.current{
  background-color:rgba(255,255,255,0.3);
}

.banners,.board{
  margin:5% auto;
  width:100%;
}

.full img{
  width:100%;
  margin:1% 0;
}

.half img{
  width:49%;
}
.half a:first-child img{
  float:left;
}

.half a:last-child img{
  float:right;
}

.triplet img{
  width:32.5%;
  float:left;
  margin-left:1.2%;
}

.triplet a:first-child img{
  margin-left:0;
}




/*-------topics-----*/
#topics{
	/*margin-top:2% !important;*/
}

#topic{
	width:100%;
	min-height:31px;
	background-color:#b09c46;
  background:linear-gradient(to bottom,#8e2f54,#8f2236);
	margin:0 auto;
	padding:3px;
  border:1px #742340 solid;
  box-shadow:0 0 3px #000;
}

#topic #p-topics{
	width:10%;
	height:31px;
	max-width:87px;
	float:left;
	line-height:31px;
  text-align:center;
  text-shadow:1px 1px 2px rgba(0,0,0,0.7);
}

#topic #p-topics img{
	width:100%;
	margin-top:4%;
}


#topic #text{
	width:86%;
	height:31px;
	line-height:31px;
	overflow:hidden;
	background-color:#FFF;
	float:left;
	border-radius:3px;
  font-family: sans-serif;
}

#topic #text a{
  font-weight:bold;
  text-decoration:underline;
  color:#902;
}

#topic #text span{
	white-space:nowrap;
	color:#030;
}

#topic #bn-opener{
	width:3%;
	height:31px;
	margin-left:1%;
	text-align:center;
	line-height:31px;
	color:#FFF;
	float:left;
	cursor:pointer;
  text-shadow:1px 1px 2px rgba(0,0,0,0.7);
}

#topic #topic-backnumber{
	width:100%;
	margin:8px auto;
	display:none;
}

#topic #topic-backnumber table{
	border-collapse:collapse;
	width:100%;
	font-size:80%;
}

#topic #topic-backnumber td{
	vertical-align:top;
	color:#FFF;
	padding:5px;
	border:1px #380611 dotted;
	border-width:1px 0 0 0;
}

#topic #topic-backnumber td a{
	color:#FFF;
  text-decoration:underline;
}

/*----About BERSERK----*/
#about_berserk{
  background-image:url(../images/about_berserk/bg.jpg);
  background-size: 100% 100%;
  padding:4%;
  overflow: hidden;
}

#about_berserk img#about_main{
  width:105%;
  margin-top:-4%;
}

#about_berserk p{
  font-family:serif;
  transform:scale(1,1.005);
  text-shadow:0 0 5px #FFF;
  color:#111;
  margin:2% 0;
  line-height:1.5;
}

#about_berserk #banners{
  text-align:center;
  margin:3% 0;
}
#about_berserk #banners img{
  width:40%;
  margin:0 2%;
}


/*----Message----*/
#message{
  background-image:url(../images/about_berserk/bg.jpg);
  background-size: 100% 100%;
  padding:4%;
  overflow: hidden;
}

#message img#message_title{
  width:100%;
}

#message p{
  font-family:serif;
  font-size:120%;
  transform:scale(1,1.005);
  text-shadow:0 0 5px #FFF;
  color:#111;
  margin:0;
  margin-top:4%;
  line-height:1.5;
}

#message img#message_illust{
  width:90%;
  max-width:593px;
  display:block;
  margin:0 auto;
  margin-top:4%;
}

#message #link_report{
  text-align:center;
  margin:3% 0;
}
#message #link_report img{
  width:70%;
  max-width:593px;
  margin:0 2%;
}



/*---PLATINUM---*/
#platinum{
  width:100%;
  max-width:1000px;
  margin:1% auto;
}
#platinum_box{
  background-color: rgba(0,0,0,0.75);
  width:55%;
  margin-right:5%;
  padding:1% 2%;
  border-radius:0px;
  border:1px #700 solid;
  font-size:75%;
  float:right;
}

#platinum img{
  width:25%;
  max-width:353px;
  float:left;
  margin-right:2%;
}

#platinum span{
  display:inline-block;
}




/*----Media Query----*/
@media screen and (max-width:768px){
  main{
    padding-top:90%;
  }
  main #logo_set{
    width:78%;
    float:none;
    display: block;
    margin:0 auto;
  }


  #platinum_box{
    width:90%;
    margin:1% auto;
    float:none;
  }

  main #platinum_wappen{
    top:17%;
    width:40%;
  }

  /*#platinum img{
    display:block;
    width:50%;
    float:none;
    margin:0 auto;
    margin-bottom:1%;
  }*/

  .mov_button{
    width:32%;
    bottom:4%;
    right:17%;
  }
  .mov_button span#preview_cap{
    font-size:100%;
  }

  main #tgs_link{
    top:180px;
  }

  /*main .info1027{
    top:160px;
  }*/

  #movChange a{
    width:45%;
    font-size:80%;
    margin:0.8% 0;
  }

}

@media screen and (max-width:639px){
  main .info1027{
    position:static;
    display:block;
    width:40%;
    margin:1% auto 2%;
  }

  main #platinum_wappen{
    position:static;
    display:block;
    width:70%;
    margin:1% auto 2%;
  }


  .mov_button{
    bottom:18%;
  }

  .mov_button span#preview_cap span{
    display:none;
  }

  main #tgs_link{
    top:120px;
  }


  #container{
/*    background-image:url(../images/top/mob/mainvisual.jpg);*/
  }

  /*#topic #p-topics{
    font-size:80%;
  }

  #platinum img{
    width:70%;
    float:none;
    display:block;
    margin:0 auto;
  }*/

}


@media screen and (max-width:460px){
  #platinum_box{
    text-align:center;
  }
  #platinum img{
    width:30%;
    float:none;
    display:block;
    margin:0 auto;
  }

  #topic #p-topics{
  	width:15%;
  }
  #topic #text{
  	width:77%;
  }
  #topic #bn-opener{
  	width:7%;
  }

  #movChange a{
    width:80%;
    margin:1% 0 0;
  }

  #message p{
    font-size:100%;
  }
  .half img,.triplet img{
    width:73%;
    display:block;
    margin:2% auto !important;
    float:none;
  }
  .half a:first-child img{
    float:none;
  }

  .half a:last-child img{
    float:none;
  }
}