#wrapper{
	background-color: white;
}

#wrapper.character #contents {
  background: url("../images/character/bg.jpg") center top no-repeat;
  min-height: 5540px;
}


#wrapper.character .container .title {
  position: absolute;
  top: 120px;
  left: calc(50% - 526px / 2);
  width: 526px;
  height: 83px;
  opacity: 0;
  z-index: 1000;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .title.doShow {
  opacity: 1;
}

#wrapper.character .container .cnt01 {
  position: absolute;
  top: 180px;
  left: calc(50% - 640px / 2);
  width: 640px;
  height: 877px;
  opacity: 0;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .cnt01.doShow {
  opacity: 1;
}

#wrapper.character .container .cnt02 {
  position: absolute;
  top: 989px;
  left: calc(50% - 640px / 2);
  width: 640px;
  height: 877px;
  opacity: 0;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .cnt02.doShow {
  opacity: 1;
}

#wrapper.character .container .cnt03 {
  position: absolute;
  top: 1800px;
  left: calc(50% - 640px / 2);
  width: 640px;
  height: 877px;
  opacity: 0;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .cnt03.doShow {
  opacity: 1;
}

#wrapper.character .container .cnt04 {
  position: absolute;
  top: 2615px;
  left: calc(50% - 640px / 2);
  width: 640px;
  height: 877px;
  opacity: 0;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .cnt04.doShow {
  opacity: 1;
}

#wrapper.character .container .cnt05 {
  position: absolute;
  top: 3428px;
  left: calc(50% - 640px / 2);
  width: 640px;
  height: 991px;
  opacity: 0;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .cnt05.doShow {
  opacity: 1;
}


#wrapper.character .container .oizumi {
  position: absolute;
  top: 26px;
  left: 26px;
  width: 125px;
  height: 35px;
  opacity: 0;
  z-index: 1000;
  transition: all ease 300ms 0s;
}
#wrapper.character .container .oizumi.doShow {
  opacity: 1;
}