@charset "utf-8";

* {font-family: 'NotoSansKR';}
a, abbr, address, article, aside, audio, body, canvas, caption, cite, dd, details, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, img, label, legend, li, menu, nav, object, ol, p, section, span, strong, summary, table, tbody, td, tfoot, th, thead, tr, ul, video{font-family: 'NotoSansKR';font-weight: 500;}

@-webkit-keyframes ProgressDots {from {width: 0px;}to {width: 100%;}}
@keyframes ProgressDots {from {width: 0px;}to {width: 100%;}}
/* @keyframes ProgressDots {
  0% { width: 0%; }
  11.11% { width: 11.11%; } 1/9
  22.22% { width: 22.22%; } 2/9
  33.33% { width: 33.33%; } 3/9
  44.44% { width: 44.44%; } 4/9
  55.55% { width: 55.55%; } 5/9
  66.66% { width: 66.66%; } 6/9
  77.77% { width: 77.77%; } 7/9
  88.88% { width: 88.88%; } 8/9
  100% { width: 100%; }
}

@-webkit-keyframes ProgressDots {
  0% { width: 0%; }
  11.11% { width: 11.11%; } 1/9
  22.22% { width: 22.22%; } 2/9
  33.33% { width: 33.33%; } 3/9
  44.44% { width: 44.44%; } 4/9
  55.55% { width: 55.55%; } 5/9
  66.66% { width: 66.66%; } 6/9
  77.77% { width: 77.77%; } 7/9
  88.88% { width: 88.88%; } 8/9
  100% { width: 100%; }
} */

@keyframes typing {0%,30% {opacity:1; width: 0%; }100% {opacity:1; width:98%; }}
@-webkit-keyframes typing {0%,30% {opacity:1; width: 0%; }100% {opacity:1; width:98%; }}

@keyframes blink-caret {0%{opacity:0;}50%{opacity:1;}100%{opacity:0;}}
@-webkit-keyframes blink-caret {0%{opacity:0;}50%{opacity:1;}100%{opacity:0;}}

@keyframes opacity {0%, 100% {opacity:0;}50% {opacity:1;}}
@-webkit-keyframes opacity {0%, 100% {opacity:0;}50% {opacity:1;}}

.main-photo__skin,
.main-photo__skin .photo_list--wrap,
.main-photo__skin .photo_list--wrap .slick-list,
.main-photo__skin .photo_list--wrap .slick-list .slick-track,
.main-photo__skin .photo_list--wrap .slick-list .slick-track .slick-slide,
.main-photo__skin .photo_list--wrap .slick-list .slick-track .slick-slide >div,
.main-photo__skin .photo_list--wrap .slick-list .slick-track .slick-slide >div .photo_list--item,
.main-photo__skin .photo_list--wrap .slick-list .slick-track .slick-slide >div .photo_list--item a {display: inline-block; width: 100%; height: 100%; vertical-align: top;}

/* 레이아웃 */
#top_layout {position: absolute; border: none;}

/*플로팅 및 팝업 */
.fmOpenBtn {position: absolute; bottom: 5%; right: 3%; z-index: 4; cursor: pointer;}
.fmOpenBtn > a {
	display: block; width: 105px; height: 105px; font-size: 19px; font-weight: 700; color: #fff; border-radius: 50%; background: #ea5413; display: flex; flex-wrap: wrap; flex-direction: row; 
	/*수평 정렬*/ 
	align-items: center; justify-content: center; position: absolute; top: 50%; left: 50%; text-align: center; line-height: normal; margin-left: -52px; margin-top: -53px;
	/* 링크 클릭 */
	z-index: 10;
}
.fmOpenBtn .deco {content: ""; display: block; width: 140px; height: 140px; background: url(../img/main/fm_deco.png); left: 50%; top: 50%; animation: rotate 30s infinite;background-size: cover;}
.fmOpenBtn.moFm {display: none; position: fixed; bottom: 6%; /* z-index: 9999; */z-index: 10;}
@keyframes rotate {
  from {
    -webkit-transform: rotate(0deg) ;
    -o-transform: rotate(0deg) ;
    transform: rotate(0deg) ;
  }
  to {
    -webkit-transform: rotate(360deg) ;
    -o-transform: rotate(360deg) ;
    transform: rotate(360deg) ;
  }
}

#main-menu {display: block; position: fixed; z-index: 1; top: 50%; left: 50px; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s; -webkit-transition:all 0.3s;}
#main-menu li {position: relative;}
#main-menu li a {display: block; width: 10px; height: 35px;}
#main-menu li a span {display: none; width: 10px; height: 10px; background: #fff;}
#main-menu li.active a span {display: block; position: relative; width: 7px; height: 7px; top: 7px; border-radius: 50%; background: #ea5414;}
#main-menu li a em {position: absolute; left: 0; top: 0; color: #fff; font-weight: bold; font-size:21px;}
#main-menu li.active a em {display: block; left: 20px; color: #ea5414;}

.fp-viewing-NEWS #main-menu li a span {border:1px solid #949a9a;}
.fp-viewing-NEWS #main-menu li.active a span {border: 1px solid #1aa59f; background: #1aa59f;}
.fp-viewing-NEWS #main-menu li a em {color:#333;}
.fp-viewing-NEWS #main-menu li a em:after {background:#cfd8d8;}
.fp-viewing-FOOTER #main-menu {opacity: 0;}

#main_visual {overflow: hidden; position: relative; width: 100%; height: 100%;}
#main_visual .form_wrap {position: absolute; top: 180px; right: 150px; z-index: 10; width: 100%; max-width: 500px;}
#main_visual .form_wrap input[type="text"]{width:100%;height: 75px;line-height: 60px;padding: 0 55px 0 25px;border: 7px solid #05aba7;background:transparent;font-size: 18px; color: #fff;}
#main_visual .form_wrap input[type="text"]::placeholder {color:#fff;}

#main_visual .scroll {position: absolute; bottom: 50px; left: 50%; margin-left: -60px; width: 120px; text-align: center; z-index: 9; color: #fff; animation: down 2s infinite; -webkit-animation: down 2s infinite;}
#main_visual .scroll span {display: block; width: auto; height: 26px; background: url(../img/main/scroll.png) no-repeat center; margin-top: 10px;}
@keyframes down {
  0% {transform: translate(0);}
  20% {transform: translateY(15px);}
  40% {transform: translate(0);}
}

#main_visual .viewer_area {width: 100%; height: 100%;}
#main_visual .viewer_area .slick-arrow {position: absolute; bottom: 0;}
#main_visual .slick-list {width: 100%; height: 100%;}
#main_visual .slick-list .slick-track {width: 100%; height: 100%;}
#main_visual .slick-list .slick-slide {width: 100%; height: 100%;}
#main_visual .images_fade {width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;}
/* bgimg -> 메인으로이등
#main_visual .bgimg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: left; transform: scale(1.1); -webkit-transform: scale(1.1); animation: bg 15s linear 1; -webkit-animation: bg 15s linear 1;}
@keyframes bg {
    0% {transform: scale(1.2) rotate(-0.01deg); -webkit-transform: scale(1.2) rotate(-0.01deg);}
    100% {transform: scale(1) rotate(-0.01deg); -webkit-transform: scale(1) rotate(-0.01deg);}
}
#main_visual .images_fade1 .bgimg {background-image: url(../img/main/visual01.jpg);}
#main_visual .images_fade2 .bgimg {background-image: url(../img/main/visual02.jpg);}
#main_visual .images_fade3 .bgimg {background-image: url(../img/visual03.jpg);}
#main_visual .images_fade4 .bgimg {background-image: url(../img/visual04.jpg);}
#main_visual .images_fade5 .bgimg {background-image: url(../img/visual05.jpg);}
*/
/* 2024-05-08 main text animation :: 로고, 물흐르듯 효과
#main_visual .tiptxtWrap {position: absolute; top: 200px; left: 310px; z-index: 10;}
#main_visual .tiptxt p {font-size: 22px; color: #fff; font-weight: bold; margin-bottom: 20px;}
#main_visual .tiptxt span {color: #fff; font-size: 18px;}
#main_visual .tiptxt2 {color: #fff; line-height: 70px; margin-bottom: 150px;}
#main_visual .tiptxt2 strong {display: block; font-size: 55px; text-shadow: 2px 2px 6px rgb(0 0 0 / 40%); letter-spacing: -3px; font-weight: bold;}
#main_visual .tiptxt2 p {font-size: 55px; text-shadow: 2px 2px 6px rgb(0 0 0 / 40%);letter-spacing: -3px; margin: 0;}
#main_visual .tiptxt2 p span {font-size: 60px; color: #ff580f; letter-spacing: -7px;}
#main_visual .tiptxt3 p {font-size: 32px; width: 100%; float: left; margin-bottom: -15px;}
#main_visual .tiptxt3 p span {font-size: 42px;  color: #fff; float: left; padding: 8px 0; letter-spacing: -2px;line-height: 100px;}
#main_visual .tiptxt3 p span.txtimg {width: 185px; padding: 0; animation: fadeout 3s;}
#main_visual .tiptxt3 span.txtspan {opacity: 0;}
#main_visual .tiptxt3 .txtspan strong{color: #ea5413; font-weight: 800;font-size: 48px;}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes fadeInAndGrow {
    from {opacity: 0; transform: scale(5);}
    to {opacity: 1; transform: scale(1);}
}
.txtspan {display: none; opacity: 0; animation: fadeIn 0.05s ease forwards;}
.txtbig {opacity: 0; animation: fadeInAndGrow 3s ease forwards;min-width: 180px;}
@keyframes fade {
  to {opacity: 1;}
}
@keyframes fadeout {
	from {opacity: 1;}
	to {opacity: 0;}
}
*/
#main_visual .tiptxtWrap {position: absolute; top: 200px; left: 310px; z-index: 10;}
#main_visual .tiptxt p {font-size: 22px; color: #fff; font-weight: bold; margin-bottom: 20px;}
#main_visual .tiptxt span {color: #fff; font-size: 18px;}
#main_visual .tiptxt2 {color: #fff; line-height: 70px; margin-bottom: 150px;}
#main_visual .tiptxt2 strong {display: block; font-size: 55px; text-shadow: 2px 2px 6px rgb(0 0 0 / 40%); /*font-family: 'GmarketSansMedium';*/ letter-spacing: -3px; font-weight: bold;}
#main_visual .tiptxt2 p {font-size: 55px; text-shadow: 2px 2px 6px rgb(0 0 0 / 40%); /*font-family: 'GmarketSansMedium';*/ letter-spacing: -3px; margin: 0;}
#main_visual .tiptxt2 p span {/*font-family: 'GmarketSansMedium';*/ font-size: 60px; color: #ff580f; letter-spacing: -7px;}
#main_visual .tiptxt3 {display: flex; flex-direction: column; gap: 10px;}
#main_visual .tiptxt3 p {font-size: 32px; width: 100%; margin-bottom: 25px;/* margin-bottom: 12px; */}
#main_visual .tiptxt3 p span {font-size: 40px;  color: #fff; letter-spacing: -2px; line-height: 1;}
#main_visual .tiptxt3 p span.txtimg {width: 185px; padding: 0; animation: fadeout 3s; /*animation: txtimg 3s infinite; -webkit-animation: txtimg 3s infinite;*/}
#main_visual .tiptxt3 span.txtspan {opacity: 0;}
#main_visual .fullWord{float: left; width: 320px;}
#main_visual .tiptxtWrap{position: inherit; top: 0; left: 0; padding-top: 200px; padding-left: 310px;}
#main_visual .tiptxt3 .txtbig{transform: scale(1); display: inline-block; color: #ea5413; font-weight: bold; font-size: 52px; opacity: 1; transition: all .3s;vertical-align: bottom;}
#main_visual .tiptxt3 .word{display: inline-block; vertical-align: bottom; padding: 0; opacity: 0; margin-left: 0; line-height: 1; /* font-weight: 300; */}
#main_visual .tiptxt3 .typing{ float: left; margin-top: -20px;/* margin-top: 6px; */}
#main_visual .tiptxt3 .typing strong{color: #ea5413; font-weight: bold; font-size: 52px;}
#main_visual .tiptxt3 .typing span{ white-space: nowrap; width: 0; opacity: 1;  overflow: hidden; transition: width .3s; display: block; /*animation: blink .5s infinite .1s;*/ line-height: 1;}
.typing-animation {border-right: .10em solid transparent; animation: typing02 3s steps(7, end) forwards,blink .5s infinite 1s;}
.fade-animation{animation: fadeIn 5s ease forwards;}

/* 텍스트 애니메이션 이미지 매핑 */
/* .fw01 .txtbig{background: url("../img/main/visu_word01.png") no-repeat center;width:100px;height: 100px;background-size: contain;}
.fw02 .txtbig{background: url("../img/main/visu_word02.png") no-repeat center;width:100px;height: 100px;background-size: contain;}
.fw03 .txtbig{background: url("../img/main/visu_word03.png") no-repeat center;width:100px;height: 100px;background-size: contain;}
.fw04 .txtbig{background: url("../img/main/visu_word04.png") no-repeat center;width:100px;height: 100px;background-size: contain;} */ 

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}
@keyframes fadeInAndGrow {
    from {transform: scale(20);}
    to {opacity: 1; transform: scale(1);}
}
@keyframes fade {
    to {opacity: 1;}
}
@keyframes fadeout {
    from {opacity: 1;}
    to {opacity: 0;}
}
@keyframes typing02 {
  0%, 30% {opacity: 1; width: 0%;}
  100% {opacity: 1; width: 100%;}
}
@keyframes fadeInUp {
    0% {opacity: 0; transform: translate3d(0, 100%, 0);}
    to {opacity: 1; transform: translateZ(0);}
}
/*@keyframes blink {
    from {border-color: transparent;}
    to {border-color: orange;}
}*/
.fullWord .txtbig img {height: 45px; width: auto;}

#main_visual .pagingbox {position: absolute; left: 560px; bottom: 250px; z-index: 10;}
#main_visual .paging .inner {display: inline-block; position: relative; margin-right: 10px; float: left;}
#main_visual .paging .slick-dots {display: inline-block; position: relative; top: 0; width: 300px; height: 1px; background: rgba(255, 255, 255, 0.3); float: left; margin: 9px 10px 9px 0;}
#main_visual .paging .slick-dots::after {display: block; clear: both; visibility: hidden; content: '';}
#main_visual .paging .slick-dots li {display: inline-block; float: left; position: absolute; left: 0; bottom: 0; width: 0; height: 100%; background: #fff;}
#main_visual .paging .slick-dots li.slick-active {width: 100%;-webkit-animation: ProgressDots 5s both;animation: ProgressDots 5s both;}
#main_visual .paging .slick-dots li button {display:none;}
#main_visual .paging .paging-btnwrap {display: none; float: left;}
/* #main_visual .paging .paging-btnwrap {float: left;} */
#main_visual .title_wrap .pagingbox .paging .paging-btnwrap button {display:inline-block; margin: 0; font-size: 0;}
#main_visual .title_wrap .pagingbox .paging .paging-btnwrap button[data-control="stop"]::before{content: ""; width: 3px;height: 12px;box-shadow: -3px 0 #fff, 3px 0 #fff;}
#main_visual .title_wrap .pagingbox .paging .paging-btnwrap button[data-control="play"]::before{content: ""; right: -2px;width: 0;height: 0;border-width: 6px 0 6px 9px;border-style: solid;border-color: transparent transparent transparent #fff;}


/* #main_visual .paging .total {display: inline-block;} */
#main_visual .paging .total {display: inline-block; /*재생바 강제 조정*/ position: absolute;top: -6px;width: 100px;}
#main_visual .paging .total span {display:inline-block;line-height:25px;font-size:15px;color: rgba(255,255,255,.5);}
#main_visual .paging .total span.current {font-size:15px; font-weight:bold; color:#fff;}
#main_visual .paging .total span.current::before,
#main_visual .paging .total span.count::before {display:inline-block; content:"0"; font-size:15px;}
#main_visual .paging .total span.line {margin:0 5px 0 3px;}
#main_visual .paging .slick-arrow {display: inline-block; position: relative; width: 13px; height: 20px; font-size: 0; vertical-align: top; float: left; margin: 0 5px;}
#main_visual .paging .slick-arrow.slick-prev {background: url(../img/main/arr3.png) no-repeat; }
#main_visual .paging .slick-arrow.slick-next {background: url(../img/main/arr2.png) no-repeat;}

.sideov {overflow: hidden;}
.sideov #top_layout {z-index: 1;}
.sideov #body_layout {z-index: 99999;}

#ajaxLayer {overflow: hidden !important; position: fixed; left: 0; top: 0; z-index: 99999; width: 100%; height: 100%; background: rgba(0,0,0,.6);}
#ajaxLayer > div {width: 100%; height: 100%;}
#ajaxLayer > div:after {display:block; clear:both; visibility:hidden;}
#ajaxLayer .con_inner {float:right;position: relative;width:480px;height: 100%;background:#fff;}
#ajaxLayer .con_inner .l_con {overflow: hidden;position: absolute;z-index: 1;left: -268px;bottom: 268px;width: 590px;height:55px;background: #1aa59f;transform: rotate(90deg);-webkit-transform: rotate(90deg);}
#ajaxLayer .con_inner .l_con ul {position:absolute; right:0; bottom:0; padding-right:135px; }
#ajaxLayer .con_inner .l_con ul:before {display:block;position:absolute;top: -108px;right: 108px;content:'';width: 55px;height: 271px;background:url(/images/kor/main/bg3.jpg)no-repeat;transform: rotate(-90deg);-webkit-transform: rotate(-90deg);}
#ajaxLayer .con_inner .l_con ul li {float:left;position: relative;z-index: 1;}
#ajaxLayer .con_inner .l_con ul li a {display:block; line-height:55px; padding:0 15px; color:#fff; font-size:17px; font-weight:bold;  }
#ajaxLayer .con_inner .l_con ul li .ico {display:inline-block;margin: -3px 6px 0 0; vertical-align:middle;}
#ajaxLayer .con_inner .l_con ul li .ico1 {width:14px; height:16px; background:url(/images/kor/main/icon2.png)no-repeat;}
#ajaxLayer .con_inner .l_con ul li .ico2 {width:16px; height:15px; background:url(/images/kor/main/icon3.png)no-repeat;}
#ajaxLayer .con_inner .l_con ul li .ico3 {width:16px; height:15px; background:url(/images/kor/main/icon4.png)no-repeat;}
#ajaxLayer .con_inner .r_con {width: 100%;height: 100%;padding-left:55px;}
#ajaxLayer .con_inner .r_con:before {display:inline-block;position:absolute;left: 0;top: 0;content:'';width:55px;height:100%;background: #1aa59f url(/images/kor/main/bg2.jpg)no-repeat left top;}
#ajaxLayer .con_inner .r_con .inner {overflow-y: scroll;height: 100%;}
#ajaxLayer .con_inner .r_con .modalbtn {padding: 8px 40px;background:#f6f6f6;}
#ajaxLayer .con_inner .r_con .modalbtn label {margin: 0;font-size:15px;color:#666;vertical-align: top;}
#ajaxLayer .con_inner .r_con .modalbtn label input {width:18px; height:18px; margin-right:5px; }
#ajaxLayer .con_inner .r_con .box {position: relative;padding: 0 40px 35px;}
#ajaxLayer .con_inner .r_con .box .title {margin: 0 0 15px;font-size:20px;font-weight:bold;color:#444;}
#ajaxLayer .con_inner .r_con .box .title span {display:inline-block; font-size:20px; font-weight:bold; color:#00aca9;}
#ajaxLayer .con_inner .r_con .box1 {padding-top: 30px;}
#ajaxLayer .con_inner .r_con .box1 #sideslide {position:relative;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control {position:absolute;right:0;top: -48px;z-index:100;width: 100%;text-align: right;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control:after {display:block; clear:both; visibility:hidden; content:'';}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control .pageCount {display: inline-block; float: left; position: relative; padding: 5px 0 0 110px; font-size: 14px; color: #777; letter-spacing: 0.5em;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control .pageCount:before {display: block; position: absolute; left: 77px; top: 14px; content: ''; width: 20px; height: 1px; background: #ddd;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control .pageCount em {display:inline-block; margin-right:5px; font-size:14px; font-weight:bold; color:#00ada9;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control button {display:inline-block; width:30px; height:30px; margin:0; border-radius:50%; background:#f6f6f6; font-size:0;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control button[data-control="prev"]:before,
#ajaxLayer .con_inner .r_con .box1 #sideslide .control button[data-control="next"]:before{width: 5px;height: 5px;border-width:2px;border-style: solid;border-color: #75889b;transform: rotate(45deg);}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control button[data-control="prev"]:before{right: -3px;border-width: 0 0 2px 2px;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .control button[data-control="next"]:before{left: -3px;border-width: 2px 2px 0 0;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .grap {overflow:hidden;height:240px;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .grap ul {position:relative;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .grap ul li {margin:0 0 50px;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .grap ul li a {display:block;}
#ajaxLayer .con_inner .r_con .box1 #sideslide .grap ul li a:focus {border:1px dotted #000;}
#ajaxLayer .con_inner .r_con .box2 .snslist {position: absolute;top: 1px;right: 40px;} 
#ajaxLayer .con_inner .r_con .box2 .snslist ul {text-align:right;vertical-align: top;}
#ajaxLayer .con_inner .r_con .box2 .snslist ul li {display:inline-block;vertical-align: top;}
#ajaxLayer .con_inner .r_con .box2 .snslist ul li a {display:block; width:30px; height:30px; border-radius:50%;  background:#f6f6f6 url(/images/kor/main/sns.png)no-repeat;font-size:0;}
#ajaxLayer .con_inner .r_con .box2 .snslist ul li.n1 a {background-position:0 0;}
#ajaxLayer .con_inner .r_con .box2 .snslist ul li.n2 a {background-position:-35px 0;}
#ajaxLayer .con_inner .r_con .box2 .snslist ul li.n3 a {background-position:-71px 0;}
#ajaxLayer .con_inner .r_con .box2 .snslist ul li.n4 a {background-position:-106px 0;}
#ajaxLayer .con_inner .r_con .box2 #snsslide {margin:0 -40px;padding: 25px 40px 40px;background: #f6f6f6;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap {overflow:hidden; height:264px;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul {position:relative;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li {padding: 10px 0;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li a {display:block;position:relative;width:100%;padding-left:85px;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li .thumb {position:absolute; left:0; top:0; width:66px; height:66px; border-radius:50%; background-position:center; background-size:cover; background-repeat:no-repeat; }
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li .thumb:after {display:block;position:absolute;left:0;top:0;content:'';width: 100%;height: 100%;background-position:center;background-size:cover;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li.bl .thumb:after {background-image:url(/images/kor/main/bl.png);}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li.fa .thumb:after {background-image:url(/images/kor/main/fa.png);}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li.in .thumb:after {background-image:url(/images/kor/main/in.png);}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li.yo .thumb:after {background-image:url(/images/kor/main/yo.png);}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li .info strong {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;height: 38px;line-height: 1.3;text-overflow: ellipsis;white-space: normal;font-size: 15px;color:#222;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .grap ul li .info p {margin:10px 0 0;font-size:13px; color:#666;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .control {position:absolute;right:40px;bottom: 55px;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .control button {font-size:0;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .control button[data-control="prev"]:before,
#ajaxLayer .con_inner .r_con .box2 #snsslide .control button[data-control="next"]:before{width:5px;height:5px;border-width:2px;border-style: solid;border-color: #7e8fa1;transform: rotate(45deg);}
#ajaxLayer .con_inner .r_con .box2 #snsslide .control button[data-control="prev"]:before{right: -5px;border-width: 0 0 2px 2px;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .control button[data-control="next"]:before{left: -5px;border-width: 2px 2px 0 0;}
#ajaxLayer .con_inner .r_con .box2 #snsslide .control em {display:inline-block; width:1px; height:10px; margin:0 5px; background:#bbc3cc; vertical-align:middle; }

#ajaxLayer .con_inner .r_con .box3 ul {margin:0 -3px;}
#ajaxLayer .con_inner .r_con .box3 ul li {float:left; width:calc(50% - 6px); margin:0 3px 6px;}
#ajaxLayer .con_inner .r_con .box3 ul li a {display:block; height:45px; line-height:43px; border:1px solid #e8e8e8; text-align:center; font-size:15px; color:#444;}

#ajaxLayer .con_inner .modal__close {position:absolute;left: -7px;top: 50px;z-index: 99;transform: rotate(90deg);-webkit-transform: rotate(90deg);}
#ajaxLayer .con_inner .modal__close button {line-height: 55px;color: #fff;font-size: 17px;font-weight: bold;}
#ajaxLayer .con_inner .modal__close button span {display:inline-block;width: 9px;height: 9px;margin: 3px 15px 0 0;border:solid #fff;border-width:2px 0 0 2px;transform:rotate(45deg);-webkit-transform: rotate(45deg);vertical-align:middle;}

.section {overflow: hidden; min-height: 100vh;}

/*section1*/
.section1 {position:relative;}
/* .section1 #slide1 {position: absolute; top: 270px; right: 216px; width: 520px; height: 280px; background: linear-gradient(to right, #121c3e, #ea5413); z-index: 100;} */
/*24-10-17,soyun,popup height & top change*/
.section1 #slide1 {display: none;} /*24-10-17,soyun,popup 기본 비활성화, 조건에 따라 활성화 */
.section1 #slide1 {position: absolute; top: 200px; right: 216px; width: 520px; height: 355px; background: linear-gradient(to right, #121c3e, #ea5413); z-index: 100;} 
.section1 #slide1 .slide_btn {position: absolute; right: 10px;left:9px; bottom: 10px; z-index: 1; background: rgb(0 0 0 / 50%); padding: 7px 20px 3px 30px; border-top-left-radius: 30px;}
.section1 #slide1 .slide_btn p {color: #fff; font-size: 18px; float: left; font-weight: bold; /* margin-right: 130px; */}
.section1 #slide1 .slide_btn .control {float: right;}/*24-10-17,soyun,팝업 재생바*/
.section1 #slide1 .control button {display: block; width: 30px; height: 30px; margin: 0; font-size: 0; float: left;}
.section1 #slide1 .control button.btn_prev {width:13px; height:20px; margin: 5px auto;border:none; background:url(../img/main/arr3.png) no-repeat; border-radius: 0;}
.section1 #slide1 .control button.btn_prev:before,
.section1 #slide1 .control button.btn_prev:after {display:none;}
.section1 #slide1 .control button.btn_next {width:13px; height:20px; margin: 5px auto;border:none; background:url(../img/main/arr2.png) no-repeat; border-radius: 0;}
.section1 #slide1 .control button.btn_next:before,
.section1 #slide1 .control button.btn_next:after {display:none;}
.section1 #slide1 .control button:focus {outline-color: #fff;}
.section1 #slide1 .control button[data-control="stop"]:before{box-shadow: -3px 0 #fff, 3px 0 #fff;}
.section1 #slide1 .control button[data-control="play"]:before{right:-3px; border-width: 5px 0 5px 8px;border-color: transparent transparent transparent #fff;}
.section1 #slide1 .grap {overflow: hidden; width: calc(100% - 20px); height: calc(100% - 20px); background: #fff; margin: 10px;}
.section1 #slide1 .grap ul {position: relative;}
.section1 #slide1 .grap ul li a {display:block;width:100%;}
.section1 #slide1 .grap ul li a:focus {outline-color:#fff;outline-offset: -1px;}
.section1 #slide1 .grap ul li strong {display:block; overflow:hidden; font-size:24px; color:#48c4bf; text-overflow: ellipsis;white-space: nowrap;}
.section1 #slide1 .grap ul li p {display:block;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;height: 50px;margin: 5px 0 20px;font-size:16px;text-overflow: ellipsis;white-space: normal;}
.section1 #slide1 .grap ul li span {display:inline-block;padding-right: 25px;font-size:14px; background: url(/images/kor/main/arr2.png)no-repeat right center;background-size: 14px auto;}
/* .section1 #slide1 .close_btn {position: absolute; top: 0; right: -50px; background: rgb(0 0 0 / 60%); width: 50px; height: 50px; cursor: pointer;} */
/*24-10-17,soyun,popup style 변경-모바일, 오늘 안보기 */
.section1 #slide1 .close_btn {position: absolute; background: rgb(0 0 0 / 60%); width: 100%; cursor: pointer;}
.close_btn .checkbox_pack {width:fit-content;}
#noShowToday{position:absolute; left:5px; top:-5px;}
.close_btn .checkbox_pack label span {position:relative; left:20px; top:-3px; color:#fff;}
.section1 #slide1 .close_btn button {position: absolute;right: 3px;}
.section1 #slide1 .close_btn i {font-size: 0; background: url(../img/main/close.png) no-repeat center; width: 30px; height: 30px; display: block;}

/*section2*/
.section2 {overflow: hidden; position: relative;}
.section2:after {content: ""; position: absolute; bottom: -75px; right: 0; width: 1535px; height: 219px; background: url(../img/main/s2_text.png) no-repeat;background-size: cover;}
.section2 .bgbox {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.section2 .bg {opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 0.3s; -webkit-transition: all 0.3s;}
.section2 .bg.bg1 {background:url(../img/main/s2_bg01.jpg) no-repeat; background-size: cover;}
/*.section2 .bg.bg2 {background:url(../img/main/s2_bg02_tmp.jpg) no-repeat; background-size: cover;}*/ /*계단 사진*/
.section2.data1 .bg1 {opacity: 1;}.section2.data1 .bg1 {opacity: 1;}
.section2.data2 .bg2 {opacity: 1;}
.section2 .group {height: 100vh;}
.section2 .group .boxcon {overflow: hidden;float:left;position:relative;width:50%;height:100%;}

/* SECTION2 CHANNEL의 이미지가 밝을때 */
.section2 .group .boxcon:last-child.ov { background: rgb(0 0 0 / 20%); }

.section2 .group .boxcon .inner {position: relative; top: 50%; /*height: 525px;*/ transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.section2 .group .boxcon .boxcon_inner {padding: 0 35px;  transition:all 0.8s; -webkit-transition:all 0.8s; transform: translateX(-100%); -webkit-transform: translateX(-100%);}
.section2.active .group .boxcon .boxcon_inner {transform: translateX(0); -webkit-transform: translateX(0);}
.section2.focusov .group .boxcon .boxcon_inner {transform: translateX(0); -webkit-transform: translateX(0);}

.section2 .group .title {height:100%;}
.section2 .group .title strong {display:block;position: relative;line-height:1.1;}
.section2 .group .title strong:before {display:block;position:absolute;content:'';left:-10px;top: -10px;width:16px;height:16px;border-radius:50%;background:#61bfb8;}
.section2 .group .title strong:after {display:block;content:'';width:1px;height:50px;margin: 10px 0 25px 5px;background:rgba(255,255,255,.5);}
.section2 .group .title strong span {display:block;line-height: 1.1;font-size:60px; font-weight: 700;color:#fff;}
.section2 .group .title p {width: 100%;max-width: 250px;font-size:16px;color:rgba(255,255,255,.7);}

.section2 .group .box {height:100%;}
.section2 .group .box .inner {opacity:.5;}
.section2 .group .box .tit .num {display:block;height: 35px;line-height:1;margin:0 0 30px;font-size:30px;font-weight:bold;color:#fff; transition:margin 0.5s , height 0.5s; -webkit-transition:margin 0.5s , height 0.5s;}
.section2 .group .box .tit .num img {opacity:0;transition:all 0.5s; -webkit-transition:all 0.5s;}
.section2 .group .box .tit p {line-height: 30px; font-size: 18px; color: #fff; margin: 0 0 60px; text-align: center;}
.section2 .group .box .tit strong {display: block; margin: 0 0 30px; font-size: 60px; font-weight: bold; color: #fff; transition: all 0.5s; -webkit-transition: all 0.5s; text-align: center; position: relative;}
.section2 .group .box .cont {position: relative; /*display: none;*/ transition:all 0.5s; -webkit-transition:all 0.5s;}

.section2 .group .box.ov .inner {opacity: 1;}
.section2 .group .box.ov .tit p,
.section2 .group .box.ov .tit strong {text-align: left;}
.section2 .group .box.ov .tit strong {margin: 0;}
.section2 .group .box.ov .cont {display: block;}

.section2 .group .box1 {border-right: 1px solid #fff;}
.section2 .group .box1 .inner {max-width: 550px; margin: 0 auto;}
.section2 .group .box1 .cont:before {content: ""; position: absolute; bottom: 75px; right: 18px; width: 135px; height: 30px; background: url(../img/main/s4_tit.png); z-index: 1;}
.section2 .group .box1 .cont:after {content: ""; position: absolute; bottom: 0; right: 0; width: 179px; height: 186px; background: url(../img/main/s4_circle.png); animation: rotation 30s 0s infinite linear}
@keyframes rotation {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}

.section2 .group .box1 .cont > ul > li {float: left; width: calc((100% / 2) - 10px);}
.section2 .group .box1 .cont > ul > li:first-child {margin-right: 20px; margin-bottom: 20px;}
.section2 .group .box1 .cont > ul > li:nth-child(2) {margin-bottom: 20px;}
.section2 .group .box1 .cont > ul > li > a {display: grid; place-items: center; position: relative; width: 100%; height: 180px; border: 1px solid #fff; color:#fff; padding: 30px; border-radius: 10px;}
.section2 .group .box1 .cont > ul > li > a:hover,
.section2 .group .box1 .cont > ul > li > a:focus {background-color: #ea5413; border: 1px solid #ea5413;}
.section2 .group .box1 .cont > ul > li > a h1 {font-size: 24px; text-align: center;}
.section2 .group .box1 .cont > ul > li > a i {width: 55px; height: 55px; display: block; margin: 0 auto;}
.section2 .group .box1 .cont > ul > li:first-child > a i {background: url(../img/main/s2_01.png); background-size: cover;}
.section2 .group .box1 .cont > ul > li:nth-child(2) > a i {background: url(../img/main/s2_02.png); background-size: cover;}
.section2 .group .box1 .cont > ul > li:last-child > a i {background: url(../img/main/s2_03.png); background-size: cover;width: 100px;}

.section2 .group .box3 .inner {max-width: 715px; margin: 0 auto;}
.section2 .group .box3 .tit strong i {background: url(../img/main/channel.png);  width: 163px; height: 42px; display: inline-block; margin-left: 15px; background-size: cover;}

.section2 .group .box3 .news {margin-bottom: 30px;}
.section2 .group .box3 .news h1 {font-size: 21px; color: #fff; font-weight: bold; margin-bottom: 10px;}
/* .section2 .group .box3 .news ul li {float: left; width: calc((100% / 2) - 10px);}
.section2 .group .box3 .news ul li:first-child {margin-right: 20px;} */
.section2 .group .box3 .news ul li a {border-top: 1px solid #fff; border-bottom: 1px solid #fff; padding: 20px 20px; width: 100%; float: left; min-width: 360px;min-height: 110px;}
.news .n2 a {min-width: 317px !important;}
.section2 .group .box3 .news ul li a p {font-size: 18px; margin-bottom: 10px; line-height: normal; color: #fff; float: left; width: 100%; white-space: normal; /* display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; */ 
	overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.section2 .group .box3 .news ul li a p:hover {text-decoration: underline;}
.section2 .group .box3 .news ul li a span {float: right; display: block; color: #63beff;}
.section2 .group .box3 .news ul li a span i {background: url(../img/main/blueNext.png);  width: 15px; height: 11px; display: inline-block; margin-left: 10px;}

.section2 .group .box3 .infoNews ul {width: calc(100% - 20px);}
.section2 .group .box3 .infoNews ul li.i1 {width: 22%; float: left; margin-right: 35px;}
.section2.en .group .box3 .infoNews ul li.i1 {width: 22%; float: left; margin-right: 100px;}
.section2 .group .box3 .infoNews ul li.i2 {width: 22%; float: left; margin-right: 35px;}
.section2 .group .box3 .infoNews ul li.i3 {width: calc(50% - 30px); float: left;}
.section2 .group .box3 .infoNews ul li.i3 .video {width: 100%; height: 215px;/* height: 252px; */}
.section2 .group .box3 .infoNews ul li h1 {font-size: 21px; color: #fff; font-weight: bold; margin-bottom: 10px;}

/*브로슈어 이미지 크기 */
.section2.en .brochure{ width: 150%; height: 130%; }
.section2.en .brochure-overlay{ width: 100%; height : 100% }

/* youtube링크 썸네일 효과*/
.section2 .group .box3 .infoNews ul li.i3 .video {position: relative;}
.thumbnail-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;cursor: pointer;}
.thumbnail-overlay img {width: 100%;height: 100%;object-fit: cover;}
.section2.en .thumbnail-overlay {position: absolute;top: 0;left: 0;width: 150%;height: 150%;cursor: pointer;}
.section2.en .thumbnail-overlay img {width: 150%;height: 100%;object-fit: cover;}

/*section3*/
.section3 {overflow: hidden; position: relative;}
.section3 .bgbox {position: absolute; left: 0; top: 0; width: 100%; height: 100%;background: rgb(0 0 0 / 15%); }
.section3 .bg {opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 0.3s; -webkit-transition: all 0.3s;}
.section3 .bg.bg1 {background: url(../img/main/s3_bg01.jpg) no-repeat center; background-size: cover;}
.section3 .bg.bg2 {background: url(../img/main/s3_bg02.jpg) no-repeat center; background-size: cover;}
.section3 .bg.bg3 {background: url(../img/main/s3_bg03.jpg) no-repeat center; background-size: cover;}
.section3 .bg.bg4 {background: url(../img/main/s3_bg04.jpg) no-repeat center; background-size: cover;}
.section3 .bg.bg5 {background: url(../img/main/s3_bg05.jpg) no-repeat center; background-size: cover;}

/* 피혁섬유소재 및 ICT 스마트제조의 경우 이미지가 밝아서 살짝 어둡게 수정 */
.section3 .bg.bg4 .bg4_bg {background: rgb(0 0 0 / 12%);height: 100%;}
.section3 .bg.bg5 .bg5_bg {background: rgb(0 0 0 / 15%);height: 100%;}

.section3.data1 .bg1,
.section3.data2 .bg2,
.section3.data3 .bg3,
.section3.data4 .bg4,
.section3.data5 .bg5 {opacity: 1;}

.section3 .group {height: 100vh;}
.section3 .group .boxcon {overflow: hidden; float: left; position: relative; width: 19%;height: 100%; transition: all 0.5s; -webkit-transition: all 0.5s;}
.section3 .group .boxcon:before {display: block; position: absolute; left: 0; top: -100px; bottom: -100px; content: ''; width: 1px; height: auto; background: rgba(255,255,255,.25);}
.section3 .group .boxcon .inner {position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.5s; -webkit-transition:all 0.5s;}
.section3 .group .boxcon .boxcon_inner {padding: 0 35px; transition: all 0.8s; -webkit-transition: all 0.8s; transform: translateX(-100%); -webkit-transform: translateX(-100%);}
.section3.active .group .boxcon .boxcon_inner {transform: translateX(0); -webkit-transform: translateX(0);}
.section3.focusov .group .boxcon .boxcon_inner {transform: translateX(0); -webkit-transform: translateX(0);}

.section3 .group .title {height:100%;}
.section3 .group .title strong {display:block;position: relative;line-height:1.1;}
.section3 .group .title strong:before {display:block;position:absolute;content:'';left:-10px;top: -10px;width:16px;height:16px;border-radius:50%;background:#61bfb8;}
.section3 .group .title strong:after {display:block;content:'';width:1px;height:50px;margin: 10px 0 25px 5px;background:rgba(255,255,255,.5);}
.section3 .group .title strong span {display:block;line-height: 1.1;font-size:60px;font-weight: 700;color:#fff;}
.section3 .group .title p {width: 100%;max-width: 250px;font-size:16px;color:rgba(255,255,255,.7);}

.section3 .group .box {height: 100%;}
.section3 .group .box .inner {opacity: .9;}
.section3 .group .box .tit {text-align: center;}
.section3 .group .box .tit p {font-size: 18px; color: #fff;}
.section3 .group .box .tit strong {display: block; margin: 0 0 40px; font-size: 32px; font-weight: bold; color: #fff; transition: all 0.5s; -webkit-transition: all 0.5s;}

.section3 .group .box .cont {display: none; transition:all 0.5s; -webkit-transition:all 0.5s;}
.section3 .group .box .cont:after {display:block; clear:both; visibility:hidden; content:'';}
.section3 .group .box .cont p {margin: 0 0 150px; font-size: 20px; color: #fff; line-height: normal;}
.section3 .group .box .cont a span {color: #fff; padding: 3px 0 0 0; float: left; margin-right: 20px;}
.section3 .group .box .cont a i {position: relative; width: 39px; height: 28px; background: url(../img/main/s3_arr.png); display: block; float: left;}
.section3 .group .box .cont a i:before {content: ""; position: absolute; top: -12px; left: -2px; width: 50px; height: 50px; background: rgb(255 78 1 / 30%); border-radius: 50%; animation: shadow 2s infinite; -webkit-animation: shadow 2s infinite; z-index: -1;}
@keyframes shadow {
  0% {transform: scale(1.2);}
  50% {transform: scale(1.0);}
  100% {transform: scale(1.2);}
}
.section3 .group .box.ov {background: rgb(39 77 168 / 55%);}
.section3 .group .box.ov .cont {display: block;}
.section3 .group .box.ov .inner {opacity: 1; top: 40%;}
.section3 .group .box.ov .tit {text-align: left;}
.section3 .group .box.ov .tit strong {font-size: 40px;}
.section3 .group .box.ov .tit p {display: none;}
.section3 .group .box.ov .boxcon_inner {padding-left: 60px;}

.section3 .group .box.box1.boxcon:before {display: none;}
.section3 .group .box.box1 {padding-left: 150px; width: 24%;}
.section3 .group .box.box1.ov .boxcon_inner {padding: 0 35px;}

/*section4*/
.section4 {background: url(../img/main/s4_bg.jpg) no-repeat; background-size: cover;}
.section4 .title {position: absolute; top: 200px; left: 300px; color: #fff;}
.section4 .title span {font-size: 20px; display: block; position: relative; color: #fff;}
.section4 .title h1 {position: relative; font-size: 60px; font-weight: bold; margin-bottom: 40px;}
.section4 .title h1:before {content: ""; position: absolute; top: 32px; right: -200px; width: 135px; height: 30px; background: url(../img/main/s4_tit.png); z-index: 1;}
.section4 .title h1:after {content: ""; position: absolute; top: -46px; right: -218px; width: 179px; height: 186px; background: url(../img/main/s4_circle.png); animation: rotation 30s 0s infinite linear}
@keyframes rotation {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
/* .section4 .title p {font-size: 22px; line-height: normal;}
.section4 .centerList {position: relative; height: 100%;}
.section4 .centerList ul {position: absolute; bottom: 0; right: 0; width: 40%;}
.section4 .centerList ul li {width: calc((100% / 2) - 1px); float: left; margin-left: 1px; transition: all 0.5s; -webkit-transition: all 0.5s;}
.section4 .centerList ul li:first-child {background: rgb(255 255 255 / 20%) url(../img/s4_c01.png) no-repeat left 60px bottom 38px; margin-left: 0; margin-bottom: 1px;}
.section4 .centerList ul li:nth-child(2) {background: rgb(255 255 255 / 20%) url(../img/s4_c02.png) no-repeat left 60px bottom 38px; margin-bottom: 1px;}
.section4 .centerList ul li:nth-child(3) {background: rgb(255 255 255 / 20%) url(../img/s4_c03.png) no-repeat left 60px bottom 38px; margin-bottom: 1px;}
.section4 .centerList ul li:nth-child(4) {background: rgb(255 255 255 / 20%) url(../img/s4_c04.png) no-repeat left 60px bottom 38px; margin-bottom: 1px;}
.section4 .centerList ul li:first-child:hover {background: #ea5413 url(../img/s4_c01h.png) no-repeat left 60px bottom 38px; margin-left: 0;}
.section4 .centerList ul li:nth-child(2):hover {background: #ea5413 url(../img/s4_c02h.png) no-repeat left 60px bottom 38px;}
.section4 .centerList ul li:nth-child(3):hover {background: #ea5413 url(../img/s4_c03h.png) no-repeat left 60px bottom 38px;}
.section4 .centerList ul li:nth-child(4):hover {background: #ea5413 url(../img/s4_c04h.png) no-repeat left 60px bottom 38px;}
.section4 .centerList ul li a {display: block; position: relative; width: 100%; height: 325px; transition: all 0.5s; -webkit-transition: all 0.5s; padding: 60px 60px 0;}
.section4 .centerList ul li p {color: #fff; font-size: 25px; transition: all 0.5s; -webkit-transition: all 0.5s; margin-bottom: 10px;}
.section4 .centerList ul li a:hover p {font-size: 30px;}
.section4 .centerList ul li span {color: rgb(255 255 255 / 80%); font-size: 18px; line-height: normal;}
.section4 .centerList ul li i {position: absolute; bottom: 55px; right: 60px; background: url(../img/main/more.png); width: 28px; height: 20px; display: inline-block;} */

.section4 .title p {font-size: 22px; line-height: normal;}
.section4 .fp-tableCell {background: rgb(0 0 0 / 5%);}
.section4 .fix-layout {max-width: 1450px; margin: 0 auto; width: 100%;}
.section4 .centerList {position: relative;}
.section4 .centerList ul li {width: calc((100% / 4) - 40px); float: left; margin: 0 20px; transition: all 0.5s; -webkit-transition: all 0.5s; border-radius: 15px;}
/* 
.section4 .centerList ul li:first-child {background: rgb(255 255 255 / 40%) url(../img/main/s4_c01.png) no-repeat right 30px bottom 50px;}
.section4 .centerList ul li:nth-child(2) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c02.png) no-repeat right 30px bottom 50px;}
.section4 .centerList ul li:nth-child(3) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c03.png) no-repeat right 30px bottom 50px;}
.section4 .centerList ul li:nth-child(4) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c04.png) no-repeat right 30px bottom 50px;}
.section4 .centerList ul li:first-child:hover {background: #ea5413 url(../img/main/s4_c01h.png) no-repeat right -20px bottom 30px;}
.section4 .centerList ul li:nth-child(2):hover {background: #ea5413 url(../img/main/s4_c02h.png) no-repeat right -20px bottom 30px;}
.section4 .centerList ul li:nth-child(3):hover {background: #ea5413 url(../img/main/s4_c03h.png) no-repeat right -20px bottom 30px;}
.section4 .centerList ul li:nth-child(4):hover {background: #ea5413 url(../img/main/s4_c04h.png) no-repeat right -20px bottom 30px;}

 */
.section4 .centerList ul li:first-child {background: rgb(255 255 255 / 40%) url(../img/main/s4_c01.png) no-repeat right 30px bottom 50px;background-color: #333333;opacity: 0.4; }
.section4 .centerList ul li:nth-child(2) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c02.png) no-repeat right 30px bottom 50px;background-color: #333333;opacity: 0.4; }
.section4 .centerList ul li:nth-child(3) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c03.png) no-repeat right 30px bottom 50px;background-color: #333333;opacity: 0.4; }
.section4 .centerList ul li:nth-child(4) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c04.png) no-repeat right 30px bottom 50px;background-color: #333333;opacity: 0.4; }
 
.section4 .centerList ul li:first-child:hover {background: #ea5413 url(../img/main/s4_c01h.png) no-repeat right -20px bottom 30px;opacity: 1; }
.section4 .centerList ul li:nth-child(2):hover {background: #ea5413 url(../img/main/s4_c02h.png) no-repeat right -20px bottom 30px;opacity: 1; }
.section4 .centerList ul li:nth-child(3):hover {background: #ea5413 url(../img/main/s4_c03h.png) no-repeat right -20px bottom 30px;opacity: 1; }
.section4 .centerList ul li:nth-child(4):hover {background: #ea5413 url(../img/main/s4_c04h.png) no-repeat right -20px bottom 30px;opacity: 1; }

.section4 .centerList ul li a {display: block; position: relative; width: 100%; height:290px; /* height: 325px; */ transition: all 0.5s; -webkit-transition: all 0.5s; padding: 60px 60px 0;}
.section4 .centerList ul li p {color: #fff; font-size: 29px; transition: all 0.5s; -webkit-transition: all 0.5s; font-weight: 500;}
.section4 .siteList {margin-top: 60px; float: right; margin-right: 20px;}
.section4 .siteList h1 {font-size: 36px;/* font-size: 40px; */ font-weight: 600; color: #fff; float: left; margin-right: 55px;}
.section4 .siteList ul {float: left;}
.section4 .siteList ul li {border-radius: 15px; float: left; width: 500px;/* width: 520px; */}
.section4 .siteList ul li:first-child {background: url(../img/main/s4_s01.png) no-repeat left 50px center; border: 1px solid #fff; margin-right: 25px;background-color: #333333;opacity: 0.4; }
.section4 .siteList ul li:last-child {background: url(../img/main/s4_s02.png) no-repeat left 50px center; border: 1px solid #fff;background-color: #333333;opacity: 0.4; }

/* 
.section4 .siteList ul li:first-child {background: url(../img/main/s4_s01.png) no-repeat left 50px center; border: 1px solid #fff; margin-right: 25px;}
.section4 .siteList ul li:last-child {background: url(../img/main/s4_s02.png) no-repeat left 50px center; border: 1px solid #fff;}
 */
.section4 .siteList ul li i {display: block; width: 27px; height: 16px; background: url(../img/main/s4_arrow01.png) no-repeat center; float: right; padding: 18px;}
.section4 .siteList ul li a {display: block; color: #fff; font-size: 24px; font-weight: 600; padding: 40px 30px 40px 110px;}
/* 
.section4 .siteList ul li:first-child:hover {background: rgb(0 0 0 / 50%) url(../img/main/s4_s01h.png) no-repeat left 50px center; border: 1px solid #ea5413;}
.section4 .siteList ul li:last-child:hover {background: rgb(0 0 0 / 50%) url(../img/main/s4_s02h.png) no-repeat left 50px center; border: 1px solid #ea5413;}
 */
.section4 .siteList ul li:first-child:hover {background: rgb(0 0 0 / 70%) url(../img/main/s4_s01h.png) no-repeat left 50px center; border: 1px solid #ea5413;opacity: 1.0; }
.section4 .siteList ul li:last-child:hover {background: rgb(0 0 0 / 70%) url(../img/main/s4_s02h.png) no-repeat left 50px center; border: 1px solid #ea5413;opacity: 1.0; }

.section4 .siteList ul li:first-child:hover a,
.section4 .siteList ul li:last-child:hover a {color: #ea5413;}
.section4 .siteList ul li:first-child:hover i,
.section4 .siteList ul li:last-child:hover i {background: url(../img/main/s4_arrow02.png) no-repeat center;}


/*section5*/
.section5 {overflow: visible; min-height: auto;}

/*반응형*/
@media(max-width: 1650px){
	#top_layout {position: fixed;}
    #main-menu {left: 2%;}
    
    .section3 .group .boxcon.title:before,
    .section3 .group .box3:after {display: none;}
    .section3 .group .box.ov .tit strong {font-size: 30px;}
    .section3 .group .box.ov .boxcon_inner {padding: 0 30px;}

}
@media(max-width: 1519px){  
    html.fp-enabled,
    .fp-enabled body {overflow: visible;}
    .fp-tableCell {display: block; height: 100% !important;}
    
    .fmOpenBtn.moFm {display: block;}
    .fmOpenBtn.pcFm {display: none;}
    
    #main-menu,
    #main_visual .scroll {display: none;}
    #main_visual .pagingbox {left: 50%; bottom: 6%; margin-left: -160px;}
    #main_visual .tiptxtWrap {left: 10%;}
    
    .section2:after {display: none;}
    .section2 .group .box {width: 100%;}
    .section2 .group .box1 {border-right: 0; border-bottom: 1px solid #fff; background: url(../img/main/s2_bg01.jpg) no-repeat center; background-size: cover;}
    .section2 .group .box3 {background: url(../img/main/s2_bg02_tmp.jpg) no-repeat center; background-size: cover; border-bottom: 1px solid #fff;}
    .section2 .group .boxcon:last-child.ov { background: url(../img/main/s2_bg02_tmp.jpg) no-repeat center; background-size: cover; }
    .section2 .group .box:last-child.ov .inner { background: rgb(0 0 0 / 20%); }
    
    
    .section3 .group .boxcon {width: 20%;}
    .section3 .group .box.box1 {padding-left: 0; width: 20%;}
    
    .section4 .fp-tableCell {display: table-cell;}
}
@media(max-width: 1450px){
    .section1 #slide1 {top: 100px; right: 80px;}
    
    .section3 .group .box {height: 20%;}
    .section3 .group .box .cont p {margin: 0;}
    .section3 .group .box .cont p br {display: none;}
    .section3 .group .box .tit {text-align: left;}
    .section3 .group .box .tit strong {margin: 0 0 10px;}
    .section3 .group .box.box1 {width: 100%;}
    
    .section3 .group .boxcon {width: 100%;}
    .section3 .group .boxcon:before {left: 0; top: 0; bottom: auto; width: 100%; height: 1px;}
    .section3 .group .boxcon .inner {transform: none; -webkit-transform: none; top: 0;}
    .section3 .group .boxcon .boxcon_inner {padding: 52px; transition: none; -webkit-transition: none;}
    
    .section3 .group .box.ov .inner {top: 0;}
    .section3 .group .box.ov .boxcon_inner,
    .section3 .group .box.box1.ov .boxcon_inner {padding: 56px;}
    .section3 .group .box.ov .boxcon_inner a {position: absolute; top: 83px; right: 60px;}
    
    .section4 .fix-layout {max-width: none;}
    .section4 .centerList ul li {width: calc((100% / 2) - 20px); margin: 0 10px 20px;}
    .section4 .centerList ul li:first-child:hover {background: #ea5413 url(../img/main/s4_c01h.png) no-repeat right 0px bottom 30px;}
    .section4 .centerList ul li:nth-child(2):hover {background: #ea5413 url(../img/main/s4_c02h.png) no-repeat right 0px bottom 15px;}
    .section4 .centerList ul li:nth-child(3):hover {background: #ea5413 url(../img/main/s4_c03h.png) no-repeat right 0px bottom 15px;}
    .section4 .centerList ul li:nth-child(4):hover {background: #ea5413 url(../img/main/s4_c04h.png) no-repeat right 0px bottom 15px;}
    .section4 .centerList ul li a {height: 200px; padding: 45px 45px 0;}
    .section4 .siteList {float: none; margin-right: 0; margin-top: 30px; padding: 0 15px;}
    .section4 .siteList h1 {float: none; margin-bottom: 10px;}
    .section4 .siteList ul {float: none; width: 100%;}
    .section4 .siteList ul li {width: calc((100% / 2) - 10px);}
    .section4 .siteList ul li:first-child {margin-right: 20px;}
}
@media(max-width: 1200px){ }

@media(max-width: 1100px){
	/* bgimg -> 메인으로이등
    #main_visual .bgimg {transform: none; -webkit-transform: none; animation: none; -webkit-animation: none;}
    */
    #main_visual .slick-list .slick-slide {display: flex; align-items: center; justify-content: center;}
    #main_visual .tiptxtWrap {position: relative; top: auto; left: auto; /*width: 740px; left: 50%; margin-left: -370px; top: 200px;*/}
    #main_visual .tiptxt {display: none;}
    #main_visual .tiptxt2 {margin-bottom: 0;}
    #main_visual .tiptxt2.tiptxt3 {margin-bottom: 0;}
    #main_visual .tiptxt2 strong {text-align: center;}
    #main_visual .tiptxtWrap{padding-top:50px;padding-left:12px;}
    #main_visual .tiptxt3 p {display: flex; align-items: center; justify-content: center;}
    #main_visual .tiptxt3 p span.txtimg {display: none;}
    
    .section2 {min-height: auto; height: auto !important;}
    
    .section3 {min-height: auto; height: auto !important;}
    .section3 .group {height: auto;}
    
    .section4 .centerList ul li p {font-size: 24px;}
    .section4 .siteList h1 {font-size: 30px;}
    .section4 .siteList ul li a {font-size: 20px;}
}
@media(max-width: 915px){
    .section2 .group {height: auto;}
    .section2 .group .boxcon .inner {transform: none; -webkit-transform: none; padding: 90px 0; top: auto;}
    .section2 .group .box1 {height: 100%;}
    
    .section4 {padding: 20px 0 30px;}
}
@media(max-width: 800px){
    #main_visual .tiptxt2 strong {font-size: 36px; line-height: 50px;}
    #main_visual .tiptxt2 p {font-size: 30px; letter-spacing: -1px; text-align: center; line-height: normal;}
    #main_visual .tiptxt2 p span {font-size: 30px; letter-spacing: -1px;}
    #main_visual .tiptxt2.tiptxt3 p {font-size: 20px; text-align: center; line-height: 45px;}
    #main_visual .tiptxt2.tiptxt3 p span {width: auto;}
    
    .fmOpenBtn.moFm {bottom: 14%;}
}
@media(max-width: 768px){ /*iPad 세로*/
    #main_visual .pagingbox {margin-left: -158px;}
    #main_visual .paging .slick-dots {width: 200px;}
    #main_visual .tiptxt3 .txtbig{font-size: 24px;}
    #main_visual .tiptxt3 .typing{float: none;}
    #main_visual .tiptxt3 .typing strong {font-size: 24px;}
    #main_visual .tiptxt3 p {font-size: 25px; text-align: center;}
    #main_visual .tiptxt3 p span {font-size: 24px;}
    #main_visual .fullWord{width: 100%; float: none;}
    @keyframes blink {
        from {border-color: transparent;}
        to {border-color: transparent;}
    }
    /* .fmOpenBtn a {width: 100px; height: 100px; font-size: 18px; margin-left: -50px; margin-top: -50px;}
    .fmOpenBtn .deco {width: 130px; height: 130px; background-size: cover;} */
    
    /* .section1 #slide1 {display: none;} */
    /*24-10-17,soyun,모바일환경 팝업 크기 수정 */
    .section1 #slide1 {width:80%;height:420px;;left:10%;top:150px;}
    .section1 #slide1 .slide_btn p {font-size: 14px; margin-top: 5px;/* margin-right:25%; */} 
    
    .section2 {min-height: auto; height: auto !important;}
    .section2 .group {height: auto;}
    .section2 .group .box .tit strong {font-size: 36px;}
    .section2 .group .box .tit p {font-size: 16px;}
    .section2 .group .box .tit p br {display: none;}
    .section2 .group .box1 {height: 100vh;}
    .section2 .group .box1 .inner {max-width: 100%; padding: 0 15px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
    .section2 .group .box1 .tit {margin-bottom: 20px;}
    .section2 .group .box1 .cont > ul > li > a h1 {font-size: 18px;}
    .section2 .group .box1 .cont:before,
    .section2 .group .box1 .cont:after {display: none;}
    .section2 .group .box1 .cont > ul > li {width: 100%;}
    .section2 .group .box1 .cont > ul > li:first-child {margin-right: 0;}
    .section2 .group .box1 .cont > ul > li > a {height: 150px; padding: 20px 10px;}
    .section2 .group .box1 .cont > ul > li > a i {width: 50px; height: 50px;}
    .section2 .group .box3 .tit strong i {width: 124px; height: 32px; background-size: cover;}
    .section2 .group .box3 .inner {max-width: 100%; top: 0; transform: none; -webkit-transform: none; padding: 90px 15px;}
    .section2 .group .box3 .infoNews ul {width: 100%;}
    .section2 .group .box3 .infoNews ul li.i1 {width: calc(50% - 8px); margin-right: 8px;}
    .section2 .group .box3 .infoNews ul li.i2 {width: calc(50% - 8px); margin-right: 0; margin-left: 8px;}
    .section2 .group .box3 .infoNews ul li.i3 {width: 100%; margin-top: 30px;}
    .section2 .group .box.ov .tit p,
    .section2 .group .box.ov .tit strong {text-align: center;}

    .section3 .group .box .tit p {font-size: 16px;}
    .section3 .group .box .tit strong {font-size: 25px; margin: 0;}
    .section3 .group .box .cont p {font-size: 18px; line-height: inherit;}
    .section3 .group .boxcon,
    .section3 .group .boxcon .inner,
    .section3 .group .boxcon .boxcon_inner {transition: none; -webkit-transition: none;}
    .section3 .group .boxcon .boxcon_inner {padding: 35px;}
    .section3 .group .box.ov .boxcon_inner {padding: 35px;}
    .section3 .group .box.ov .boxcon_inner a {position: relative; top: 0; right: 0; float: right; margin-top: 35px;}
    .section3 .group .box.ov .boxcon_inner,
    .section3 .group .box.box1.ov .boxcon_inner {padding: 35px;}
    
    .section4 .centerList {padding: 0 15px;}
    .section4 .centerList ul li {width: 100%; margin: 10px 0;}
    .section4 .siteList ul li {width: 100%;}
    .section4 .siteList ul li:first-child {margin-right: 0; margin-bottom: 10px;}
}
@media(max-width: 580px){
	#main_visual .tiptxt3 p span {font-size: 20px;}
	
	/* 메인,2번째 - 공지사항 및 뉴스 배열 */
	.news {flex-direction: column;}
	.news div {margin-right: 0; width:100%;margin-bottom: 10px;}
	
	/*모바일 환경*/
	.section1 #slide1 {height:295px;} /* 24-10-17,soyun,popup height */	
	.section2 .group .box3 {background: url(../img/main/s2_bg02_tmp_m.jpg) no-repeat center; background-size: cover; }
    .section2 .group .boxcon:last-child.ov { background: url(../img/main/s2_bg02_tmp_m.jpg) no-repeat center; background-size: cover; }

	.section2 .group .box3 .inner {padding:55px 15px;}
	.section2 .group .box3 .news ul li a{padding:15px; min-height: 45px; display: flex;}
	.section2 .group .box3 .news ul li a span {font-size:18px; min-width:110px;}
	.section2 .group .box3 .news ul li a p{margin-bottom: 0px;}
	.section2 .group .box1 .cont > ul > li > a p {display: block;}
	
	.section3 .group .title strong,
	.section3 .group .title strong span {font-size:35px;}
	.section3 .group .box .cont p {font-size: 16px;}
	.section3 .group .box1 .cont > ul {float:none;width:auto;}
	.section3 .group .box1 .cont .btmbox {float: none;width:100%;}
	.section3 .group .box2 .cont #slide1 {width:100%;margin: 0 0 20px;}
	.section3 .group .box2 .cont .btnbox {width:100%;}
	.section3 .group .box3 ul li {width:calc(50% - 10px);}
	.section2 .group .box3 .news ul li:first-child {width: 100%; margin-right: 0;}
	/* .section2 .group .box3 .news ul li.n2 {display: none;} */
	.section3 .group .box.ov .tit strong {font-size: 25px;}
	.section3 .group .box.ov .boxcon_inner a {margin-top: 12px; font-size: 14px;}
	
}
@media(max-width: 500px){
	.fmOpenBtn.moFm {bottom: 12%;}
	
	#main_visual .pagingbox {margin-left: -132px;}
	#main_visual .paging .slick-dots {width: 150px;}
	#main_visual .tiptxt2 strong {font-size: 30px;}
	#main_visual .tiptxt2.tiptxt3 p {font-size: 16px; line-height: 30px;}
	#main_visual .tiptxt2.tiptxt3 p span {font-size: 20px;}
	#main_visual .tiptxt3 p {font-size: 18px;}
	
	.section2 .bg.bg2 {background:no-repeat center center;}
	.section2 .group .box1 {height: 100vh;}
	.section2 .group .box3 .notice ul li a p {width: 100%;}
	.section2 .group .box3 .notice ul li a span {display: none;}
	.section2 .group .box3 .news ul li.n2 .video {width: 100%;}
	
	.section3 .group {height: 100vh;}
	
	.section4 .centerList ul li:first-child {background: rgb(255 255 255 / 40%) url(../img/main/s4_c01.png) no-repeat right 20px bottom 25px; background-size: 50px;}
	.section4 .centerList ul li:nth-child(2) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c02.png) no-repeat right 20px bottom 25px; background-size: 70px;}
	.section4 .centerList ul li:nth-child(3) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c03.png) no-repeat right 20px bottom 25px; background-size: 60px;}
	.section4 .centerList ul li:nth-child(4) {background: rgb(255 255 255 / 40%) url(../img/main/s4_c04.png) no-repeat right 20px bottom 25px; background-size: 70px;}
	.section4 .centerList ul li:first-child:hover {background: #ea5413 url(../img/main/s4_c01h.png) no-repeat right 0px bottom 25px; background-size: 65px;}
	.section4 .centerList ul li:nth-child(2):hover {background: #ea5413 url(../img/main/s4_c02h.png) no-repeat right 0px bottom 25px; background-size: 85px;}
	.section4 .centerList ul li:nth-child(3):hover {background: #ea5413 url(../img/main/s4_c03h.png) no-repeat right 0px bottom 25px; background-size: 85px;}
	.section4 .centerList ul li:nth-child(4):hover {background: #ea5413 url(../img/main/s4_c04h.png) no-repeat right 0px bottom 25px; background-size: 80px;}
	.section4 .centerList ul li p {font-size: 20px;}
	.section4 .centerList ul li a {height: 160px; padding: 25px 30px 0;}
	.section4 .siteList h1 {font-size: 24px;}
	.section4 .siteList ul li:first-child {background: url(../img/main/s4_s01.png) no-repeat left 35px center; background-size: 35px;}
	.section4 .siteList ul li:last-child {background: url(../img/main/s4_s02.png) no-repeat left 35px center; background-size: 35px;}
	.section4 .siteList ul li:first-child:hover {background: rgb(0 0 0 / 50%) url(../img/main/s4_s01h.png) no-repeat left 35px center; background-size: 35px;}
	.section4 .siteList ul li:last-child:hover {background: rgb(0 0 0 / 50%) url(../img/main/s4_s01h.png) no-repeat left 35px center; background-size: 35px;}
	.section4 .siteList ul li i {display: none;}
	.section4 .siteList ul li a {padding: 30px 20px 25px 80px; font-size: 16px;}
}
/*24-10-17,soyun,popup height*/
@media(max-width: 450px){
    .section1 #slide1 {height:220px;}
}

@media(max-width: 403px){
    #main_visual .slick-list .slick-slide {height: 100vh;}
    .section1 #slide1 {height:200px;}
}
@media(max-width: 350px){
    .section1 #slide1 {height:190px;}
}