/********************************************************************************
 * slide 6
 ********************************************************************************/
#slide6 {
  font-family: Tahoma;
  font-weight: normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

#slide6 > div {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100em;
  height: 170.0em;
}

/********************************************************************************
 * blue background
 ********************************************************************************/
#slide6 > div > .background {
  position: absolute;
  display: block;
  left: 0;
  top: 154.5em;
  width: 100%;
  height: 15.5em;
  z-index: 0;
  background-color: #6699cc;
}

/********************************************************************************
 * logos
 ********************************************************************************/
#slide6 .text-logo {
  left: 20.0em;
  top: 4em;
  text-align: left;
  color: #666666;
  z-index: 100;
}

#slide6 .text-logo > span {
  font-size: 3em;
}

#slide6 .text-logo > span > span {
  font-size: 1.2em;
}

#slide6 .top-logo {
  left: 0;
  top: 0;
  width: 17.4em;
  height: 12.8em;
  background-image: url(../images/slide6/top-logo.png);
  z-index: 100;
}

#slide6 .top-text2 {
  left: 90.0em;
  top: 14.3em;
  width: 9.5em;
  height: 9.1em;
  z-index: 100;
}

#slide6 .top-text2 > a {
  font-size: 1.2em;
  text-decoration: underline;
}

/********************************************************************************
 * time-line
 ********************************************************************************/
#slide6 .castle {
  top: 135.8em;
  left: 0;
  background-image: url(../images/slide6/castle.png);
  width: 110.1em;
  height: 18.7em;
}

#slide6 .time-line {
  top: 153.2em;
  left: -30em;
  width: 256em;
}

#slide6 .time-line div.line {
  top: 0;
  left: 0;
  width: 100%;
  height: 2.6em;
  white-space: nowrap;
  text-align: left;
}

#slide6 .time-line div.line > div.p1 {
  display: inline-block;
  width: .8em;
  height: 100%;
  background-image: url(../images/slide6/line1.png);
  background-position: 0 0;
  background-size: 2px 2.6em;
  background-repeat: no-repeat;
  opacity: .75;
}

#slide6 .time-line div.line > div.p2 {
  display: inline-block;
  width: .8em;
  height: 100%;
  background-image: url(../images/slide6/line2.png);
  background-position: 0 0;
  background-size: 2px 2.6em;
  background-repeat: no-repeat;
  opacity: .75;
}

#slide6 .time-line .year-num {
  top: 5em;
  width: 9.6em;
  height: 3.4em;
  margin-left: -4.8em;
  line-height: 3.4em;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  color: #ffffff;
}

#slide6 .time-line .year-num > span {
  display: inline-block;
  font-size: 2.5em;
  vertical-align: middle;
}

#slide6 .time-line .circle {
  width: 6.4em;
  height: 6.4em;
  margin-left: -3.2em;
  margin-top: -3.2em;
  border: 2px solid #666666;
  border-radius: 3.2em;
  background-color: #ffffff;
}

#slide6 .time-line .circle-tail {
  opacity: .75;
  width: 2px;
  background-image: url(../images/slide6/dash-line.png);
  background-size: 2px 13px;
  background-position: 0 100%;
  background-repeat: repeat;
  /*border-left: 1px dashed #cccccc;*/
  -webkit-transform-origin: 0 100%;
  -moz-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  -o-transform-origin: 0 100%;
  transform-origin: 0 100%;
}

#slide6 .time-line .circle .text {
  position: absolute;
  display: block;
  left: 4.2em;
  top: 4.8em;
  width: 20em;
  font-size: 1.2em;
  color: #6699cc;
  text-align: left;
  text-transform: uppercase;
}

#slide6 .time-line .circle .text > span {
  font-size: 1.2em;
}

#slide6 .time-line-cursor {
  top: 152.0em;
  width: 5.7em;
  height: 5.7em;
  background-image: url(../images/slide6/cursor.png);
  cursor: pointer;
}

#slide6 .time-line-cursor.img2 {
  background-image: url(../images/slide6/cursor2.png);
}

#slide6 .time-line-cursor.drop {
  -webkit-transition: margin-left .5s ease-in-out;
  -moz-transition: margin-left .5s ease-in-out;
  -ms-transition: margin-left .5s ease-in-out;
  -o-transition: margin-left .5s ease-in-out;
  transition: margin-left .5s ease-in-out;
}

/********************************************************************************
 * top part
 ********************************************************************************/
#slide6 .top-part .block1 {
  left: 1.8em;
  top: 15.0em;
  width: 17.1em;
  height: 25.4em;
  background-image: url(../images/slide6/block1.png);
  border: 3px solid #6699cc;
  border-radius: 1px;
}

#slide6 .top-part .block1-line {
  left: 1.1em;
  top: 28.8em;
  width: 16.7em;
  height: 15.2em;
  background-image: url(../images/slide6/block1-text.png);
}

#slide6 .top-part .block1-text {
  left: 2.1em;
  top: 42.0em;
  width: 14em;
  height: 4em;
  text-align: left;
  letter-spacing: -.1em;
  text-transform: uppercase;
  color: #666666;
}

#slide6 .top-part .block1-text > span,
#slide6 .top-part .block2-text > span,
#slide6 .top-part .block3-text > span,
#slide6 .top-part .block4-text > span,
#slide6 .top-part .block5-text > span {
  font-size: 1.2em;
}

#slide6 .top-part .block2 {
  left: 2.0em;
  top: 53.4em;
  width: 31.4em;
  height: 30.5em;
  background-image: url(../images/slide6/block2.png);
  border: 3px solid #6699cc;
  border-radius: 1px;
}

#slide6 .top-part .block2-line {
  left: 1.1em;
  top: 83.1em;
  width: 26.3em;
  height: 5.0em;
  background-image: url(../images/slide6/block2-text.png);
}

#slide6 .top-part .block2-text {
  left: 2.1em;
  top: 86.2em;
  width: 14em;
  height: 4em;
  text-align: left;
  letter-spacing: -.1em;
  text-transform: uppercase;
  color: #666666;
}

#slide6 .top-part .block3 {
  left: 1.1em;
  top: 92.5em;
  width: 16.1em;
  height: 16.0em;
  background-image: url(../images/slide6/block3.png);
  border: 3px solid #6699cc;
  border-radius: 1px;
}

#slide6 .top-part .block3-text {
  left: 17.6em;
  top: 92.5em;
  width: 82em;
  height: 12em;
  text-align: left;
  letter-spacing: -.1em;
  text-transform: uppercase;
  color: #666666;
}

#slide6 .top-part .block3-text > span > span {
  font-size: 1.8em;
}

#slide6 .top-part .big-image {
  left: 30.6em;
  top: 9.1em;
  width: 69.4em;
  height: 66.7em;
  background-image: url(../images/slide6/big-image.png);
  text-transform: uppercase;
  color: #666666;
}

#slide6 .top-part .big-image .top {
  position: relative;
  font-weight: bold;
  overflow: hidden;
  height: 5em;
  line-height: 5em;
}

#slide6 .top-part .big-image .bottom {
  position: relative;
  overflow: hidden;
}

#slide6 .top-part .big-image .top > span {
  position: relative;
  top: 6em;
}
#slide6 .top-part .big-image .bottom > span {
  position: relative;
  top: -5em;
}

#slide6 .top-part .big-image .top > span {
  display: inline-block;
  font-size: 4em;
  vertical-align: bottom;
  line-height: 1em;
}

#slide6 .top-part .big-image .top small {
  display: inline-block;
  font-size: .6em;
  line-height: 1em;
}

#slide6 .top-part .big-image .bottom span {
  font-size: 1.2em;
}

#slide6 .top-part .big-image .line {
  opacity: 0;
}

#slide6 .top-part .big-image .p1.text {
  left: -9.0em;
  top: 2.5em;
}
#slide6 .top-part .big-image .p2.text {
  left: -9.2em;
  top: 13.6em;
}
#slide6 .top-part .big-image .p3.text {
  left: -10.8em;
  top: 23.3em;
}
#slide6 .top-part .big-image .p4.text {
  left: -10.4em;
  top: 33.9em;
}
#slide6 .top-part .big-image .p5.text {
  left: 7em;
  top: 61.1em;
}
#slide6 .top-part .big-image .p6.text {
  left: 24.6em;
  top: 64.4em;
}
#slide6 .top-part .big-image .p7.text {
  left: 45.6em;
  top: 66.1em;
}

#slide6 .top-part .big-image .p1.line {
  left: -9.0em;
  top: 6.8em;
  width: 23.2em;
  height: 7.5em;
  background-image: url(../images/slide6/b-i-line1.png);
}
#slide6 .top-part .big-image .p2.line {
  left: -9.8em;
  top: 18.1em;
  width: 19.8em;
  height: 2.4em;
  background-image: url(../images/slide6/b-i-line2.png);
}
#slide6 .top-part .big-image .p3.line {
  left: -9.8em;
  top: 27.8em;
  width: 16.5em;
  height: 1.8em;
  background-image: url(../images/slide6/b-i-line3.png);
}
#slide6 .top-part .big-image .p4.line {
  left: -9.8em;
  top: 35.3em;
  width: 17.5em;
  height: 3.8em;
  background-image: url(../images/slide6/b-i-line4.png);
}
#slide6 .top-part .big-image .p5.line {
  left: 6.7em;
  top: 49.8em;
  width: 12.0em;
  height: 16.9em;
  background-image: url(../images/slide6/b-i-line5.png);
}
#slide6 .top-part .big-image .p6.line {
  left: 24.6em;
  top: 54.6em;
  width: 14.2em;
  height: 15.3em;
  background-image: url(../images/slide6/b-i-line6.png);
}
#slide6 .top-part .big-image .p7.line {
  left: 27.6em;
  top: 42.1em;
  width: 38.9em;
  height: 29.0em;
  background-image: url(../images/slide6/b-i-line7.png);
}

/********************************************************************************
 * animation
 ********************************************************************************/
#slide6 .tip-line,
#slide6 .tip-text {
  opacity: 0;
}

#slide6.anim1 .tip-line.block1-line,
#slide6.anim2 .tip-line.block2-line,
#slide6.anim3 .tip-line.block3-line,
#slide6.anim4 .tip-line.block4-line,
#slide6.anim5 .tip-line.block5-line {
  opacity: 1;
  -webkit-transition: opacity .5s linear;
  -moz-transition: opacity .5s linear;
  -ms-transition: opacity .5s linear;
  -o-transition: opacity .5s linear;
  transition: opacity .5s linear;
}

#slide6.anim1 .tip-text.block1-text,
#slide6.anim2 .tip-text.block2-text,
#slide6.anim3 .tip-text.block3-text,
#slide6.anim4 .tip-text.block4-text,
#slide6.anim5 .tip-text.block5-text {
  opacity: 1;
  -webkit-transition: opacity .5s linear .5s;
  -moz-transition: opacity .5s linear .5s;
  -ms-transition: opacity .5s linear .5s;
  -o-transition: opacity .5s linear .5s;
  transition: opacity .5s linear .5s;
}
