@charset "utf-8";

/***************************
  Contents
***************************/

#wrapper {
    position:relative; width:100%; height:100%;
    background-size: cover;
    background-attachment: fixed;
    background-position:center center;
    background-image: url();
    background-color:#fff;
font-smooth: always; -webkit-font-smoothing: antialiased;}
}



/* Backgrounds will cover all the section
* --------------------------------------- */

#section1,
#section2,
#section3,
#section4,
#section5,
#section6 {
	background-size: cover;
	background-attachment: fixed;
	background-position:center center;
}


/* Defining each sectino background and styles
* --------------------------------------- */
section { position: relative; min-width:100%; overflow: hidden}
section .cont { position: relative; width: 1400px; margin:0 auto; }


/* 섹션1 */


/* 섹션2 */
#section2 { position: relative; width:1600px; height:900px; margin:0 auto; background-color:#efefef;}
#section2 .cont { position: relative; margin:0 auto;  width:1600px; height:900px;}
#section2 .cont .warp-pslider { position:absolute; left:75px; top:380px; width:1400px; height:330px; border:0px solid red;}
#section2 .bx-wrapper { background-color:transparent;}
#section2 #slider2-next, #section2 #slider2-prev { position:absolute; top:200px; }
#slider2-next {right:450px;}
#slider2-prev {left:450px;}


.circle { width:200px; height: 200px; position: absolute; top:470px;left: 650px; z-index:1;  }
    @keyframes rotate {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }

.circle {
    display: inline-block;
    animation: rotate 10s linear infinite;
}

/* 섹션3 */
#section3 { width:100%; height:960px; overflow:hidden; display: flex;align-items: center; justify-content: center; }
#section3 img {display:block;}
#section3 .inner1 { display: block; width:1109px; height:165px; position:absolute; top:688px; margin:0 auto; z-index:99; }
#section3 .inner2 { width:100%; background-position: center center; position:relative; z-index:1;}


/* 섹션4 */
#section4 { height: 1000px !important; min-width: 1400px; overflow:hidden; }

.off_wrap { width:100%; height:100%; }
.off_inner { width:100%; height:100%; }
.off_box {
    width: 25%;
    height: 100%;
    text-align: center;
    display: block;
    float: left;
    transition: width 0.7s ease; 
    background-color: #f7f6f2;
    border-right:1px solid #ccc;

}
.off_box > div:last-child { border:none;}

.off_box:hover {
    /*width: 35%; background-color: #f2ede8;*/
}
.off_box_tt1 { position:absolute; top:0; left:0; width:100%; }
.off_box_tt2 {position:relative; top:340px; font-size:3em; color:#2e4a56;   font-family:'나눔명조', 'sans-serif' letter-spacing: -1px; font-weight:600;}


.sec4_bg1,
.sec4_bg2,
.sec4_bg3,
.sec4_bg4 {
    margin-top: 50px;
    opacity: 0;  /* 초기 투명도 설정 */
}

.off_box:hover .sec4_bg1,
.off_box:hover .sec4_bg2,
.off_box:hover .sec4_bg3,
.off_box:hover .sec4_bg4 {
    display: block;
    opacity: 1;  /* 투명도를 1로 변경하여 나타나도록 함 */
    transition: all 0.5s ease;  /* 트랜지션 효과 설정 (0.5초 동안 ease 함수 사용) */
}
.off_box_inner  { position:relative;  }
.off_box:hover .off_box_inner .off_box_tt1,
.off_box:hover .off_box_inner .off_box_tt2 {
    transition: all .5s ease; opacity: 0;
}



/* 동영상 */
#MainMovie { position: relative; width: 1400px; margin: 0 auto; padding:70px 5px; }
#MainMovie .title { position: relative; width: 1400px; margin: 0 auto; font-size:20px; padding-bottom: 5px; font-family: Noto Sans KR; }
