.visualWrap {
    position: relative;
    overflow: hidden;
	background: #a08b73;
}

.visualWrap>.sample {
    width: 100%;
}

.visualWrap iframe { opacity: 0; transition: all 2s;}

.onload .visualWrap iframe { opacity: 1;}

.visualWrap ul {
    position: relative;
    height: 100%;
}

.visualWrap ul li {
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
}

.visualWrap ul li.active {
    left: 0;
}

.visualWrap .imageWrap {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.visualWrap ul li.active .imageWrap img {
    transform:scale(1.2);
}

@keyframes visualAni {
    0% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

.visualWrap .textWrap {
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    flex-flow:column wrap;
    justify-content: center;
    padding-left: 30px;
}

.visualWrap .textWrap h1 {
    color:#fff;
    font-family: 'MontL';
    /* font-weight: 300; */
    font-size: 30px;
    line-height: 1.2;
    margin-bottom: 20px;
}

.visualWrap .textWrap p {
    font-size: 12px;
    color:#fff;
    font-family: 'NotoKrR';
    line-height: 1.6;
}

.visualWrap .reBtn {
    position: absolute;
    top:36%;
    right:0;
    width: 50px;
    height: 160px;
    border:2px solid rgba(255, 255,  255, .5);
    display: flex;
    flex-flow:column wrap;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border-right: none;
}

.visualWrap .reBtn img {
    margin-top: 20px;
}

.visualWrap .reBtn span {
    font-family: 'NanumMJ_R';
    font-size: 15px;
    color:#fff;
    margin:10px 0;
    line-height: 1.3;
}

.visualWrap .reBtn hr {
    height: 30px;
    width: 1px;
    background-color: #fff;
}

.visualWrap .scrollImage {
    position: absolute;
    bottom: 50px;
    right: calc(50% + -24px);
    z-index: 10;
    animation:viScAni 1s infinite;
}

@keyframes viScAni {
    0% {
        bottom:50px;
    }

    50% {
        bottom: 20px;
    }

    100% {
        bottom:50px;
    }
}

.visualWrap .posWrap {
    width: 100px;
    height: calc(100% - 100px);
    position:absolute;
    top:100px;
    left:0;
    display: flex;
    flex-flow:column wrap;
    align-items: center;
    justify-content: center;
    border-right: 1px solid rgba(255, 255,  255, .5);
}

.visualWrap .posWrap a {
    margin-bottom: 10px;
    display: flex;
    flex-flow:column wrap;
    align-items: center;
}

.visualWrap .posWrap a .circle {
    display: block;
    border-radius:100%;
    width: 13px;
    height: 13px;
    border: 3px solid #fff;
}

.visualWrap .posWrap a .txt {
    display: block;
    margin: 10px 0;
    display: none;
}

.visualWrap .posWrap a hr {
    width: 1px;
    height: 50px;
    background-color: rgba(255, 255,  255, .5);
    display: none;
}

.visualWrap .posWrap a.active .txt,
.visualWrap .posWrap a.active hr {
    display: block;
}

.sec1Wrap {
    display: flex;
    flex-flow:row wrap;
    padding-left: 0px;
    position:relative;
    z-index: 5;
}

.sec1Wrap .leftWrap {
    margin-bottom: 0px;
	position: relative;
}

.sec1Wrap .leftWrap .posWrap {
    position:absolute;
    bottom:20px;
    left:0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.sec1Wrap .leftWrap .posWrap>* {
    width: 8px;
    height: 8px;
    border:2px solid #fff;
    opacity: 1 !important;
    margin:0 5px;
    background-color: transparent;
}

.sec1Wrap .leftWrap .posWrap>*.swiper-pagination-bullet-active {
    background-color: #fff;
}

.sec1Wrap .rightWrap {
    margin-top: 0px;
    padding-top: 40px;
    overflow: hidden;
    padding-left: 20px;
    padding-bottom: 70px;
    width: 100%;
    padding-right: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sec1Wrap .rightWrap .topWrap {
    display: flex;
    flex-flow:row wrap;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 125px;
}

.sec1Wrap .rightWrap .text2 {
    margin-bottom: 70px;
}

.sec1Wrap .rightWrap h1 {
    color:#484848;
    font-size: 12px;
    font-family: 'NotoKrT';
    line-height: 1.6;
}

.sec1Wrap .rightWrap h2 {
    font-family: 'NanumMJ_R';
    font-weight: bold;
    color:#000000;
    font-size: 14px;
    margin-bottom:20px;
    line-height: 1.5;
}

.sec2Wrap {
    position:relative;
    display: flex;
    flex-flow:column wrap;
    background:url(../images/main/bg_sec2.jpg) no-repeat center center/auto 100%;
    background-attachment: fixed;
    padding:40px 30px 30px;
}

.sec2Wrap:before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    background-color:rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.sec2Wrap video {
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
}

.sec2Wrap .textWrap {
    position:relative;
    z-index: 2;
    margin-bottom: 30px;
}

.sec2Wrap .textWrap .text1 {
    margin-bottom: 10px;
    font-size: 11px;
    color:#fff;
    font-family: 'NotoKrT';
}

.sec2Wrap .textWrap .text2 {
    margin-bottom: 10px;
    font-family: 'NotoKrM';
    color: #fff;
    font-size: 16px;
}

.sec2Wrap .textWrap .text3 {
    margin-bottom: 25px;
    font-family: 'NotoKrM';
    font-size: 25px;
    color: #fff;
}

.sec2Wrap .textWrap .text4 {
    font-family: 'NotoKrT';
    color: #fff;
    font-size: 10px;
    line-height: 1.5;
    margin-bottom: 15px;
}

.sec2Wrap .image1 {
    position:relative;
    z-index: 2;
}

.sec3Wrap {
    display: flex;
    flex-flow:column wrap;
}

.sec3Wrap .leftWrap {
    width: 100%;
}

.sec3Wrap .rightWrap {
    width: 100%;
}

.sec3Wrap .rightWrap .topWrap {
    overflow:hidden;
    padding-top: 40px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 20px;
    /* background-color: #f5f5f5; */
}

.sec3Wrap .rightWrap .topWrap .thumb {
    margin-bottom: 31px;
}

.sec3Wrap .rightWrap .topWrap .arrowsWrap {
    display: flex;
    flex-flow:row wrap;
    justify-content: flex-end;
}

.sec3Wrap .rightWrap .topWrap .arrowsWrap .left {
    margin-right: 5px;
}

.sec3Wrap .rightWrap .topWrap .arrowsWrap .arrows img {
    width: 50px;
}

.sec3Wrap .rightWrap .topWrap .tWrap {
    display: flex;
    padding-bottom: 10px;
    border-bottom: 1px solid #dbd5ce;
    align-items: flex-end;
    margin-bottom: 15px;
}

.sec3Wrap .rightWrap .topWrap .tWrap .text1 {
    font-family: 'NotoKrM';
    font-size: 20px;
    color:#000000;
    margin-right: 10px;
}

.sec3Wrap .rightWrap .topWrap .tWrap .text2 {
    font-family: 'NotoKrT';
    font-size: 14px;
    color:#797979;
}

.sec3Wrap .rightWrap .topWrap .bWrap .text3 {
    font-family: 'NotoKrM';
    font-size: 20px;
    color:#a08b73;
    margin-bottom: 20px;
}

.sec3Wrap .rightWrap .topWrap .bWrap .text4 {
    font-family: 'NotoKrT';
    color:#797979;
    font-size: 13px;
    line-height: 1.5;
}

.sec4Wrap {
    display: flex;
    justify-content: center;
    flex-flow:column wrap;
    align-items: center;
    padding:40px 0;
}

.sec4Wrap .text1 {
    margin-bottom: 20px;
    font-family: 'MontM';
    text-align: center;
    /* font-weight: 700; */
    font-size: 23px;
    color: #a08b73;
    line-height: 1;
}

.sec4Wrap .text2 {
    margin-bottom: 10px;
    font-family: 'NotoKrB';
    font-size: 16px;
    color: #494949;
}

.sec4Wrap .text3 {
    margin-bottom: 25px;
    font-family: 'NotoKrL';
    font-size: 10px;
    color: #494949;
    line-height: 1.6;
    text-align: center;
}

.sec5Wrap {
    height: 500px;
    overflow: hidden;
    position:relative;
}
.sec5Wrap .imageWrap {
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
}

.sec5Wrap .imageWrap li {
    position: absolute;
    top:0;
    left:100%;
    width: 100%;
    height: 100%;
}

.sec5Wrap .imageWrap li.active {
    left: 0;
}

@keyframes sec5ImgB {
    0% {
        transform:scale(1);
    }

    100% { 
        transform:scale(1.1);
    }
}

@keyframes sec5ImgS {
    0% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

.sec5Wrap .btnsWrap {
    position: absolute;
    top: 50px;
    width: 100%;
    padding: 0px 20px;
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    justify-content: space-around;
}

.sec5Wrap .btnsWrap li {
    max-width: 30%;
    width: 30%;
    flex:1;
    opacity: .5;
    cursor: default;
    transition:all .5s;
}

.sec5Wrap .btnsWrap li:last-child { margin-right: 0px;}
.sec5Wrap .btnsWrap li.active {
    opacity: 1;
}

.sec5Wrap .btnsWrap li .en {
    padding-top: 10px;
    position: relative;
    border-top: 1px solid #fff;
    font-family: 'Mont';
    font-size: 12px;
    margin-bottom: 5px;
    color: #fff;
}

.sec5Wrap .btnsWrap li .en:before {
    content:'';
    position:absolute;
    top:-2px;
    left:0;
    width: 0%;
    height: 4px;
    background-color:#fff;
    transition:all .5s;
}

.sec5Wrap .btnsWrap li.active .en:before {
    width: 100%;
}

.sec5Wrap .btnsWrap li .kr {
    font-family: 'NotoKrT';
    font-size: 13px;
    color:#fff;
}

.sec5Wrap .text1 {
    position:absolute;
    bottom:210px;
    left:255px;
}

.sec5Wrap .textWrap {
    position: absolute;
    bottom: 40px;
    left: 20px;
    width: calc(100% - 40px);
}

.sec5Wrap .textWrap>h1 {
    font-family: 'MontL';
    /* font-weight: 300; */
    font-size: 14px;
    color: #fff;
    margin-bottom: 5px;
}

.sec5Wrap .textWrap>h2 {
    font-family: 'MontM';
    /* font-weight: 700; */
    font-size: 30px;
    color: #fff;
    margin-bottom: 15px;
}

.sec5Wrap .textWrap ul {
    height: 105px;
    position: relative;
    overflow: hidden;
}

.sec5Wrap .textWrap li {
    position:absolute;
    top:100%;
    left:0;
    display: flex;
    align-items: flex-start;
    flex-flow: column wrap;
}

.sec5Wrap .textWrap li.active {
    top:0;
}

.sec5Wrap .textWrap li .leftWrap {
    margin-bottom: 10px;
}

.sec5Wrap .textWrap li .leftWrap p {
    font-family: 'NotoKrM';
    font-size: 20px;
    color:#fff;
    line-height: 1.4;
}

.sec5Wrap .textWrap li .rightWrap p {
    font-family: 'NotoKrL';
    font-size: 14px;
    color:#fff;
    line-height: 1.5;
}

.sec6Wrap {
    display: flex;
    flex-flow:column wrap;
    /* height: 580px; */
}

.sec6Wrap .leftWrap {
    width: 100%;
    background-color: #e3dbd7;
    padding:50px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow:column wrap;
}

.sec6Wrap .leftWrap .text1 {
    font-family: 'MontM';
    /* font-weight: 700; */
    font-size: 27px;
    color: #a08b73;
    margin-bottom: 10px;
}

.sec6Wrap .leftWrap .text2 {
    margin-bottom: 20px;
    font-family: 'NotoKrM';
    font-size: 15px;
    color: #494949;
}

.sec6Wrap .leftWrap ul {
    display: flex;
    flex-flow:row wrap;
    align-items: flex-start;
}

.sec6Wrap .leftWrap ul li {
    margin: 0 2px;
}

.sec6Wrap .leftWrap ul li .imageWrap {
    width: 70px;
    height: 70px;
    border-radius: 100%;
    position: relative;
    margin-bottom: 10px;
}

.sec6Wrap .leftWrap ul li .imageWrap img {
    position:absolute;
    top:0;
    left:0;
    transition: .3s;
}

.sec6Wrap .leftWrap ul li:not(:hover) .imageWrap img:last-child,
.sec6Wrap .leftWrap ul li:hover .imageWrap img:first-child {
    opacity: 0;
}

.sec6Wrap .leftWrap ul li p {
    font-family: 'NotoKrR';
    color:#211c1c;
    font-size: 13px;
    text-align: center;
}

.sec6Wrap .leftWrap ul li:hover p {
    font-weight: bold;
}

.sec6Wrap .rightWrap {
    flex:1 1;
    padding:50px 0;
    display: flex;
    flex-flow:column wrap;
    align-items: center;
    justify-content: center;
}

.sec6Wrap .rightWrap .text1 {
    font-family: 'MontM';
    /* font-weight: 700; */
    font-size: 27px;
    color:#a08b73;
    margin-bottom: 10px;
}

.sec6Wrap .rightWrap .text2 {
    margin-bottom: 30px;
    font-family: 'NotoKrM';
    color:#494949;
    font-size: 15px;
}

.sec6Wrap .rightWrap .text3 {
    font-family: 'NotoKrT';
    font-size: 13px;
    color:#494949;
    margin-bottom: 15px;
}

.sec6Wrap .rightWrap .text4 {
    margin-bottom: 25px;
    font-family: 'NotoKrL';
    color:#494949;
    font-size: 12px;
}

.sec6Wrap .rightWrap .text4 strong {
    font-family: 'crimson';
    margin-left: 5px;
    font-size: 20px;
    color:#000000;
}

.sec7Wrap {
    height: 250px;
}

.sec7Wrap .titleWrap {
    float:left;
    width: 60px;
    border-right:1px solid #e3dbd7;
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: center;
}

.sec7Wrap .titleWrap p {
    transform:rotate(-90deg);
    text-align: center;
    white-space: nowrap;
}

.sec7Wrap .titleWrap p .text1 {
    font-family: 'MontM';
    /* font-weight: 700; */
    font-size: 15px;
    color:#000000;
    margin-bottom: 5px;
    display: block;
}

.sec7Wrap .titleWrap p .text2 {
    font-family: 'MontL';
    display: block;
    /* font-weight: 300; */
    font-size: 10px;
    color:#a08b73;
}

.sec7Wrap .listWrap {
    float:left;
    padding-right: 15px;
    width: calc(100% - 60px);
    height: 100%;
    display: flex;
    flex-flow:row wrap;
    padding-left: 30px;
    align-items: center;
}

.sec7Wrap .listWrap .article {
    margin-right: 30px;
    flex:1;
}

.sec7Wrap .listWrap .article:last-child {
    margin-right: 0;
}

.sec7Wrap .listWrap .article .date {
    color:#000000;
    font-family: 'NanumMJ_R';
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 15px;
}

.sec7Wrap .listWrap .article .cont {
    color:#211c1c;
    font-family: 'NotoKrR';
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 25px;
}

.sec7Wrap .listWrap .article .more {
    font-family: 'MontR';
    font-size: 14px;
    color:#a08b73;
    display: flex;
    align-items: center;
}

.sec7Wrap .listWrap .article .more:after {
    content: '';
    width: 20px;
    height: 1px;
    background-color: #a08b73;
    margin-left: 5px;
}

.sec8Wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    overflow: hidden;
    background:url(../images/main/bg_sec8.png) no-repeat center center/auto 100%;
    background-attachment: fixed;
    position:relative;
}

.sec8Wrap img {
    width: 250px;
}

.sec8Wrap:before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    background-color:rgba(0, 0, 0, 0.3);
}

.sec8Wrap .text1 {
    position:relative;
}