/*********
**common**
*********/

html {
    height: 100%;
}

body {
    position: relative;
    width: 100%;
    min-width: 1200px;
    height: 100%;
    overflow-x: hidden;

}

.posNum {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 300px;
    height: 50px;
    margin: -25px 0 0 -150px;
    background: #111;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
    z-index: 9999;
}

#wrap {
    width: 100%;
    height: 100%;
}

#wrap > div {
    width: 100%;
    position: relative;
}

/********
** gnb **
********/
#gnb {
    width: 100%;
    height: 80px;
    background: #fff;
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;

}

#gnb h1 {
    position: absolute;
    top: 24px;
    left: 50%;
    margin-left: -600px;
}

#gnb .rightLink {
    width: 183px;
    height: 14px;
    /*background: red;*/
    position: absolute;
    left: 50%;
    top: 13px;
    margin-left: 417px;
}

#gnb .rightLink > li {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0.6;
}

#gnb .rightLink li:nth-child(2) {
    left: 54px;
}

#gnb .rightLink li:nth-child(3) {
    left: 140px;
}

#gnb .innerGnb {
    width: 687px;
    height: 18px;
    position: absolute;
    left: 50%;
    top: 35px;
    margin-left: -347px;
    /*background: red;*/
}

#gnb .innerGnb > li {
    position: absolute;
    left: 0;
    top: 0;
}

#gnb .innerGnb > li:nth-child(2) {
    left: 148px;
}

#gnb .innerGnb > li:nth-child(3) {
    left: 317px;
}

#gnb .innerGnb > li:nth-child(4) {
    left: 467px;
}

#gnb .innerGnb > li:nth-child(5) {
    left: 629px;
}

#gnb .mega {
    width: 100%;
    height: 0;
    position: absolute;
    left: 0;
    top: 80px;
    background: #fff;
    background: rgba(0, 0, 0, 0.5);
    overflow: hidden;

}

#gnb .mega > ul {
    position: absolute;
    left: 50%;
    top: 20px;

}

#gnb .mega .sub1 {
    width: 59px;
    height: 142px;
    margin-left: -339px;
}

#gnb .mega .sub2 {
    width: 115px;
    height: 142px;
    margin-left: -212px;
}

#gnb .mega .sub3 {
    width: 62px;
    height: 206px;
    margin-left: -31px;
}

#gnb .mega .sub4 {
    width: 71px;
    height: 110px;
    margin-left: 120px;
}

#gnb .mega ul > li {
    position: absolute;
    left: 0;
    top: 0;
}

#gnb .mega ul > li:nth-child(2) {
    top: 32px;
}

#gnb .mega ul > li:nth-child(3) {
    top: 64px;
}

#gnb .mega ul > li:nth-child(4) {
    top: 96px;
}

#gnb .mega ul > li:nth-child(5) {
    top: 128px;
}

#gnb .mega ul > li:nth-child(6) {
    top: 160px;
}

#gnb .mega ul > li:nth-child(7) {
    top: 192px;
}

#bar {
    position: absolute;
    left: 50%;
    top: 80px;
    z-index: 999;
    margin-left: -387px;
    opacity: 0;
}



/************
** scene01 **
************/

#scene01 {
    height: 980px;
    background: url("../img/sub4/bg.jpg") no-repeat center top fixed;

}

#scene01 .contents {
    position: absolute;
    left: 50%;
    top: 400px;
    width: 252px;
    height: 126px;
    margin-left: -126px;

}

#scene01 .contents > div {
    position: absolute;
    opacity: 0;
}

#scene01 .contents .text1 {
    left: 87px;
    top: -20px;

}

#scene01 .contents .text2 {
    left: 116px;
    top: 30px;
}

#scene01 .contents .text3 {
    left: 27px;
    top: 75px;
}

#scene01 .contents .text4 {
    top: 142px;
}

#scene01 .slide {
    width: 1200px;
    height: 34px;

    position: absolute;
    left: 50%;
    top: 473px;
    margin-left: -600px;
}

#scene01 .slide > div {
    position: absolute;
    left: 0;
    top: 0;
}

#scene01 .slide .prev {
}

#scene01 .slide .next {
    left: 1080px;
}

.scroll {
    position: absolute;
    left: 50%;
    top: 817px;
    margin-left: -41px;
    z-index: 10;
    opacity: 0;
}

.scroll > div {
    position: absolute;
    left: 0;
    top: 0;
}

.scroll .scrollBtn {
    left: 7px;
    top: 25px;
    z-index:10;

}

.scroll .scrollBtn .one {
    position: absolute;
    left: 0;
    top: 0;
    transform: rotate(0deg);
    z-index: -2;
    transition: all .5s;
}

.scroll .scrollBtn:hover .one {
    transform: rotate(180deg);
}


/************
** scene02 **
************/

#scene02 {
    height: 980px;
    background: url("../img/sub4/bg.jpg") no-repeat center top fixed;

}

#scene02 .contents {
    position: absolute;
    left: 50%;
    top: 160px;
    width: 777px;
    height: 626px;
    margin-left: -334px;
}

#scene02 .contents > div {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#scene02 .contents .text1 {
    left: 250px;
    top: -20px;
}

#scene02 .contents .text2 {
    left: 324px;
    top: 25px;
}

#scene02 .contents .text3 {

    top: 50px;
}

#scene02 .contents .text4 {
    left: 73px;
    top: 184px;
}

#scene02 .contents .text5 {
    left: 550px;
    top: 341px;
}

#scene02 .contents .text6 {
    left: 601px;
    top: 417px;
}

#scene02 .contents .text7 {
    left: 595px;
    top: 491px;
}

#scene02 .contents .text8 {
    left: 539px;
    top: 552px;
}










/************
** scene03 **
************/
#scene03 {
    height: 980px;
    background: url("../img/sub4/bg.jpg") no-repeat center top fixed;

}

#scene03 .contents {

    width: 762px;
    height: 664px;

    position: absolute;
    left: 50%;
    top: 160px;

    margin-left: -381px;
}

#scene03 .contents > div {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#scene03 .contents .text1 {
    left: 253px;
    top: -20px;
}

#scene03 .contents .text2 {
    left: 371px;
    top: 25px;
}

#scene03 .contents .text3 {

    top: 50px;
}

#scene03 .contents .text4 {
    left: 62px;
    top: 123px;
}

/*--------------------------------------------------footer--------------------------------------------------------*/


#footer {
    width: 100%;
    height: 300px;
    background: #212121;
    /*position: absolute;*/
}

#footer .group {
    position: absolute;
    width: 980px;
    height: 242px;
    left: 50%;
    top: 22px;
    margin-left: -490px;
}

#footer .group > li {
    position: absolute;
    left: 0;
    top: 0;
}

#footer .group > li:nth-child(2) {
    left: 113px;
}

#footer .group > li:nth-child(3) {
    left: 180px;
}

#footer .group > li:nth-child(4) {
    left: 293px;
}

#footer .group > li:nth-child(5) {
    left: 443px;
}

#footer .group > li:nth-child(6) {
    left: 830px;
}

#footer .group > li:nth-child(7) {
    top: 90px;
}

#footer .group > li:nth-child(8) {
    left: 193px;
    top: 80px;
}

#footer .group > li:nth-child(9) {
    left: 830px;
    top: 110px;
}

#footer .group > li:nth-child(10) {
    left: 830px;
    top: 153px;
}

#footer .group > li:nth-child(11) {
    left: 918px;
    top: 153px;
}

#footer .group > li:nth-child(12) {
    left: 944px;
    top: 153px;
}

#footer .group > li:nth-child(13) {
    left: 822px;
    top: 140px;
}

#footer .group > li:nth-child(14) {
    left: 822px;
    top: 183px;
}