#index #wrapper {
  background: #000; }

#index footer {
  background: url("../img/common/main_bg.png") center top #000; }

#index #main {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden; }
  #index #main > video {
    display: none;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0; }
  #index #main > div.soundcloud {
    display: none;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: url("../img/index/dot.png"); }
    #index #main > div.soundcloud p {
      margin: 0 0 26px 16px;
      position: absolute;
      left: 0;
      bottom: 0;
      width: 50px;
      height: 50px;
      z-index: 2;
      background: black;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      -ms-border-radius: 5px;
      -o-border-radius: 5px;
      border-radius: 5px;
      -webkit-transform-origin: left bottom;
      -moz-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      -o-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: scale(0.8);
      -moz-transform: scale(0.8);
      -ms-transform: scale(0.8);
      -o-transform: scale(0.8);
      transform: scale(0.8); }
      #index #main > div.soundcloud p > iframe {
        opacity: 0.9; }
  #index #main > div.title {
    position: relative;
    top: 30%;
    left: 0;
    width: 1100px;
    height: 590px;
    margin: 0 auto;
    text-align: center;
    z-index: 6; }
    #index #main > div.title h1 {
      width: 266px;
      margin: 0 auto;
      padding-bottom: 40px; }
    #index #main > div.title ul.team {
      width: 608px;
      margin: 0 auto 36px; }
      #index #main > div.title ul.team:after {
        content: "";
        display: block;
        clear: both; }
      #index #main > div.title ul.team li {
        position: relative;
        float: left;
        width: 608px;
        height: 88px;
        -webkit-perspective: 700px;
        -moz-perspective: 700px;
        perspective: 700px; }
        #index #main > div.title ul.team li:nth-of-type(5) {
          width: 608px; }
        #index #main > div.title ul.team li:last-of-type {
          width: 608px; }
        #index #main > div.title ul.team li div {
          display: none;
          width: 608px;
          position: relative;
          -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
          -webkit-transform: translateZ(-304px) rotateY(90deg);
          -moz-transform: translateZ(-304px) rotateY(90deg);
          -ms-transform: translateZ(-304px) rotateY(90deg);
          -o-transform: translateZ(-304px) rotateY(90deg);
          transform: translateZ(-304px) rotateY(90deg); }
          #index #main > div.title ul.team li div p {
            text-align: left;
            position: absolute;
            top: 0;
            left: 0;
            width: 608px;
            height: 88px;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            -o-backface-visibility: hidden;
            backface-visibility: hidden; }
            #index #main > div.title ul.team li div p.front {
              -webkit-transform: translateZ(304px);
              -moz-transform: translateZ(304px);
              -ms-transform: translateZ(304px);
              -o-transform: translateZ(304px);
              transform: translateZ(304px); }
            #index #main > div.title ul.team li div p.left {
              height: 0;
              background-color: #FFF;
              -webkit-transform: rotateY(-90deg) translateZ(304px);
              -moz-transform: rotateY(-90deg) translateZ(304px);
              -ms-transform: rotateY(-90deg) translateZ(304px);
              -o-transform: rotateY(-90deg) translateZ(304px);
              transform: rotateY(-90deg) translateZ(304px); }
    #index #main > div.title ul.member li {
      position: relative;
      height: 30px;
      margin: 0 auto 14px;
      -webkit-perspective: 700px;
      -moz-perspective: 700px;
      perspective: 700px; }
      #index #main > div.title ul.member li div {
        display: none;
        position: relative;
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
        -webkit-transform-origin: center 15px;
        -moz-transform-origin: center 15px;
        -ms-transform-origin: center 15px;
        -o-transform-origin: center 15px;
        transform-origin: center 15px;
        -webkit-transform: translateZ(-15px) rotateX(90deg);
        -moz-transform: translateZ(-15px) rotateX(90deg);
        -ms-transform: translateZ(-15px) rotateX(90deg);
        -o-transform: translateZ(-15px) rotateX(90deg);
        transform: translateZ(-15px) rotateX(90deg); }
        #index #main > div.title ul.member li div p {
          position: absolute;
          top: 0;
          left: 0;
          height: 30px;
          -webkit-backface-visibility: hidden;
          -moz-backface-visibility: hidden;
          -ms-backface-visibility: hidden;
          -o-backface-visibility: hidden;
          backface-visibility: hidden;
          -webkit-transform-origin: center 15px;
          -moz-transform-origin: center 15px;
          -ms-transform-origin: center 15px;
          -o-transform-origin: center 15px;
          transform-origin: center 15px; }
          #index #main > div.title ul.member li div p.front {
            -webkit-transform: translateZ(15px);
            -moz-transform: translateZ(15px);
            -ms-transform: translateZ(15px);
            -o-transform: translateZ(15px);
            transform: translateZ(15px); }
          #index #main > div.title ul.member li div p.bottom {
            width: 0;
            background-color: #FFF;
            -webkit-transform: rotateX(-90deg) translateZ(15px);
            -moz-transform: rotateX(-90deg) translateZ(15px);
            -ms-transform: rotateX(-90deg) translateZ(15px);
            -o-transform: rotateX(-90deg) translateZ(15px);
            transform: rotateX(-90deg) translateZ(15px); }
      #index #main > div.title ul.member li:nth-of-type(1) {
        width: 216px; }
        #index #main > div.title ul.member li:nth-of-type(1) div {
          width: 216px; }
      #index #main > div.title ul.member li:nth-of-type(2) {
        width: 173px; }
        #index #main > div.title ul.member li:nth-of-type(2) div {
          width: 173px; }
      #index #main > div.title ul.member li:nth-of-type(3) {
        width: 218px; }
        #index #main > div.title ul.member li:nth-of-type(3) div {
          width: 218px; }
    #index #main > div.title > p.loading {
      position: relative;
      margin: 40px auto 0;
      top: -300px; }
    #index #main > div.title > p.scroll {
      position: relative;
      top: 0;
      opacity: 0; }
    #index #main > div.title > hr {
      position: relative;
      top: -300px;
      margin: 8px auto 0;
      display: block;
      border: 0;
      width: 0;
      height: 16px;
      background: url("../img/index/main_wave.png") no-repeat top center; }

#index #container {
  visibility: hidden; }
  #index #container section.news {
    position: relative;
    height: 410px;
    margin: 0 auto;
    padding: 71px 0 0;
    background: url("../img/common/bg_mosaic.jpg") center top; }
    #index #container section.news:after {
      content: "";
      display: block;
      clear: both; }
    #index #container section.news > div {
      position: relative;
      width: 1290px;
      margin: 0 auto; }
      #index #container section.news > div > a {
        position: relative;
        float: left;
        display: block;
        margin-top: 148px;
        width: 26px;
        overflow: hidden;
        text-decoration: none; }
        #index #container section.news > div > a img {
          position: relative; }
        #index #container section.news > div > a.back {
          background: url("../img/index/news_arr_back.png") left bottom; }
          #index #container section.news > div > a.back img {
            left: 0; }
          #index #container section.news > div > a.back.on {
            background: none; }
        #index #container section.news > div > a.next {
          background: url("../img/index/news_arr_next.png") left bottom; }
          #index #container section.news > div > a.next img {
            right: 26px; }
          #index #container section.news > div > a.next.on {
            background: none; }
      #index #container section.news > div > div {
        position: relative;
        float: left;
        width: 1150px;
        height: 410px;
        margin: 0 42px;
        overflow: hidden; }
      #index #container section.news > div ul {
        position: absolute;
        left: 0;
        width: 3970px; }
        #index #container section.news > div ul:after {
          content: "";
          display: block;
          clear: both; }
        #index #container section.news > div ul li {
          float: left;
          width: 355px;
          height: 358px;
          margin-right: 42px;
          line-height: 1; }
          #index #container section.news > div ul li h4 {
            padding: 11px 8px 5px;
            font-family: 'Oswald', sans-serif;
            font-weight: 500;
            font-size: 17px;
            letter-spacing: 0.8px;
            color: #e22e2e; }
          #index #container section.news > div ul li a {
            display: block;
            text-decoration: none; }
          #index #container section.news > div ul li div {
            width: 355px;
            height: 255px;
            background-image: url("../img/index/news_default2.png");
            background-size: cover; }
            #index #container section.news > div ul li div span {
              display: inline-block;
              width: 343px;
              height: 243px;
              padding: 0;
              border: solid 6px black; }
          #index #container section.news > div ul li p {
            width: 355px;
            height: 3.5em;
            display: block;
            padding: 5px 8px 0;
            line-height: 1.5em;
            color: #DDD;
            text-overflow: ellipsis;
            overflow: hidden;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -ms-box-sizing: border-box;
            -o-box-sizing: border-box;
            box-sizing: border-box; }
  #index #container section.information {
    background: url("../img/index/con_bg2.png") 300px top no-repeat;
    position: relative;
    width: 2000px;
    display: table; }
    #index #container section.information > div.movies {
      position: absolute;
      top: 0;
      left: 0;
      width: 2000px;
      height: 100%;
      overflow: hidden;
      z-index: 1; }
      #index #container section.information > div.movies > div {
        position: relative;
        width: 2000px;
        height: 1298px;
        overflow: hidden; }
      #index #container section.information > div.movies video {
        position: absolute;
        top: -2px;
        left: 0;
        display: block; }
      #index #container section.information > div.movies p {
        position: absolute;
        width: 2000px;
        height: 100%;
        background: url("../img/index/dot.png");
        top: 0;
        left: 0;
        z-index: 1; }
    #index #container section.information > div.decoration {
      background: url("../img/index/con_bg2.png") 300px top no-repeat;
      position: absolute;
      width: 2000px;
      height: 550px;
      z-index: 2; }
    #index #container section.information > div.info {
      display: table-cell;
      position: relative;
      float: left;
      top: 0;
      width: 50%;
      padding: 0 0 100px;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box;
      box-sizing: border-box;
      z-index: 3; }
      #index #container section.information > div.info:after {
        content: "";
        display: block;
        clear: both; }
      #index #container section.information > div.info.left {
        padding-left: 270px;
        padding-top: 178px;
        padding-bottom: 160px;
        background: url("../img/index/info_record.png") 350px bottom no-repeat; }
        #index #container section.information > div.info.left > div {
          text-align: right; }
          #index #container section.information > div.info.left > div.youtube-box {
            position: relative;
            width: 557px;
            left: 165px; }
          #index #container section.information > div.info.left > div > a, #index #container section.information > div.info.left > div > span {
            margin-left: 4px; }
      #index #container section.information > div.info.right {
        padding-right: 280px;
        padding-top: 82px; }
        #index #container section.information > div.info.right > div {
          float: left; }
          #index #container section.information > div.info.right > div.youtube-box {
            float: left; }
          #index #container section.information > div.info.right > div > a, #index #container section.information > div.info.right > div > span {
            margin-right: 4px; }
      #index #container section.information > div.info > div {
        position: relative;
        margin: 0 4px 8px; }
        #index #container section.information > div.info > div > * {
          display: inline-block;
          border: solid 6px #000; }
        #index #container section.information > div.info > div > img {
          border: none; }
        #index #container section.information > div.info > div.youtube-box {
          height: 317px;
          position: relative;
          overflow: hidden; }
          #index #container section.information > div.info > div.youtube-box p {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 5; }
          #index #container section.information > div.info > div.youtube-box a {
            position: absolute;
            top: 0;
            left: 0;
            margin: 0;
            z-index: 10; }
      #index #container section.information > div.info .member > a, #index #container section.information > div.info .member > span {
        border: none;
        margin: 0; }
      #index #container section.information > div.info .member span {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        z-index: -1; }
      #index #container section.information > div.info .member a {
        opacity: 0; }
      #index #container section.information > div.info .member.kireek > * {
        left: auto;
        right: 0; }
      #index #container section.information > div.info .member.plantrecords {
        width: 489px; }
