/*------common-------*/
section .content-tit h2 {display: inline-block; font-size: 5rem; font-weight: 800; margin-bottom: 10px; position: relative;}
section .content-tit h2::after {content: ''; background-color: #F0943F; width: 10px; height: 10px; border-radius: 100px; position: absolute; left: 0; top: -10px;}
section .content-tit p  {font-family: 'GothicA1-Regular'; letter-spacing: -0.1rem; font-size: 1.8rem;}
.link-btn {display: inline-block; padding: 15px 75px 15px 25px; border: #fff 1px solid; border-radius: 50px; position: relative; transition: all 0.3s; font-family: 'GothicA1-Regular';}
.link-btn:hover {background-color: #fff; color: #444; font-weight: 700;}
.link-btn::after  {content: ''; position: absolute; width: 24px; height: 17px; background: url("../images/main/arrow01.png") no-repeat center / cover; right: 30px; top: 17px; }
.link-btn:hover::after {animation: arrow .3s 2 ease-in-out alternate; background: url("../images/main/arrow02.png") no-repeat center / cover;}

@keyframes arrow {
    0%{transform:translateX(0px);}
    100%{transform:translateX(5px);}
}

@media all and (max-width:1440px) {
    .link-btn {padding: 12px 60px 12px 25px;}
    .link-btn::after {top: 14px;}
}
@media all and (max-width:1200px) {
    section .content-tit h2 {font-size: 4.5rem;}
}
@media all and (max-width:768px) {
    section .content-tit h2 {font-size: 4rem;}
    section .content-tit p {font-size: 1.7rem;}
}
@media all and (max-width:420px) {
    section .content-tit h2 {font-size: 3.4rem;}
    .link-btn {font-size: 1.5rem; padding: 10px 50px 10px 20px;}
    .link-btn::after {width: 20px; height: 14px; right: 20px;}
}

/*------main-visual-------*/
.main-visual  {width: 100%; height: 800px; background: url("../images/main/main-visual.jpg") no-repeat center / cover; color: #fff;}
.main-visual .inner  {display: flex; justify-content: center; position: relative; padding-top: 180px; top: 50%; transform: translateY(-50%);}
.main-visual .inner .title-wrap {width: 506px; border-radius: 30px; padding: 60px; position: relative; margin-right: 30px; overflow: hidden;}
.main-visual .inner .title-wrap::before {content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);}
.main-visual .inner .title-wrap .title-tx strong  {display: block; font-size: 4.0rem; font-weight: 600; margin-bottom: 20px; line-height: 1.2;}
.main-visual .inner .title-wrap .title-tx strong span  {display: block; font-size: 1.6rem; font-weight: 400; opacity: 0.8;}
.main-visual .inner .title-wrap .title-tx  {margin-bottom: 20px;}
.main-visual .inner .title-wrap .title-tx p {font-size: 1.8rem; line-height: 1.4; font-family: 'GothicA1-Regular';}
.main-visual .inner .title-wrap .slide-controll {position: absolute; bottom: 60px; z-index:3;}
.main-visual .inner .title-wrap .slide-controll button {width: 20px; height: 20px; display: inline-block;}
.main-visual .inner .title-wrap .slide-controll button.prev-btn {background: url("../images/main/prev_ico.png") no-repeat center;}
.main-visual .inner .title-wrap .slide-controll button.stop-btn {background: url("../images/main/stop_ico.png") no-repeat center;}
.main-visual .inner .title-wrap .slide-controll button.start-btn {display: none; background: url("../images/main/start.png") no-repeat center;}
.main-visual .inner .title-wrap .slide-controll button.next-btn {background: url("../images/main/next_ico.png") no-repeat center;}
.main-visual .inner .mainSwiperBa {width: 724px; margin: 0; border-radius: 30px;}
.main-visual .inner .mainSwiperBa .visual-ba {width:100%; font-size: 5rem;}
.main-visual .inner .mainSwiperBa .visual-ba a {display: block; width: 100%; padding-bottom: 62.68%; position: relative;}
.main-visual .inner .mainSwiperBa .visual-ba img {width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
@media all and (max-width:1440px) {
    .main-visual .inner .title-wrap {padding: 50px;}
    .main-visual .inner .title-wrap .title-tx {margin-bottom: 15px;}
    .main-visual .inner .title-wrap .title-tx strong {font-size: 3.6rem; margin-bottom: 30px;}
    .main-visual .inner .title-wrap .title-tx p {font-size: 1.8rem;}
    .main-visual .inner .title-wrap .slide-controll {bottom: 50px;}
}
@media all and (max-width:1200px) {
    .main-visual {height: auto;}
    .main-visual .inner {padding: 160px 0 80px 0; flex-direction:column-reverse; padding-bottom: 100px; position: inherit; transform: unset;}
    .main-visual .inner .title-wrap {width: 100%; padding: 45px; margin-right: 0; margin-top: 30px;}
    .main-visual .inner .title-wrap .title-tx strong {font-size: 3.2rem;}
    .main-visual .inner .title-wrap .slide-controll {right: 45px; bottom: 45px;}
    .main-visual .inner .mainSwiperBa {width: 100%;}
}
@media all and (max-width:768px) {
    .main-visual .inner {padding: 140px 0 60px 0;}
    .main-visual .inner .title-wrap .title-tx p {font-size: 1.7rem;}
}
@media all and (max-width:640px) {
    .main-visual .inner .title-wrap {margin-top: 20px;}
    .main-visual .inner .title-wrap .title-tx strong {font-size: 2.8rem;}
    .main-visual .inner .title-wrap .title-tx p {font-size: 1.6rem;}
    
}
@media all and (max-width:420px) {
    .main-visual .inner .title-wrap {padding: 30px;}
    .main-visual .inner .title-wrap .title-tx strong {font-size: 2.4rem;}
    .main-visual .inner .title-wrap .slide-controll {right: 30px; bottom: 30px;}
    .main-visual .inner .title-wrap .title-tx p br {display:none;}
    
}


/* ---------- 메인 비주얼 동영상 영역 ------------------------*/
.video_bg {display:none; position:absolute; z-index: 9999;top:0; left:0;right:0;bottom:0; background: rgba(0,0,0,0.5)no-repeat center center;}
.video_bg.on {display:block;}

.video_wrap {display:none;position: absolute; z-index: 9999; top: 50vh; left: 0; right: 0;transform: translate(0, -50%);}
.video_wrap video {width:50%;max-width:1000px; display:flex; margin:0 auto;}
.video_wrap.on{display:block;}

.btn_wrap {position: absolute; top: -10%; right: 26%; background: #fff; width: 44px; height: 44px; border-radius: 22px; overflow: hidden;} .btn_wrap button 
{padding:10px;}

@media all and (max-width:1024px) {
	.video_wrap video {width:80%;}
	.btn_wrap {top:-14%; right:10%;}
}
@media all and (max-width:768px) {
	.btn_wrap {top:-26%; right:10%;}
}




/*------icon menu-------*/
.icon-menu-wrap {width: 100%; padding: 80px 0;}
.icon-menu-wrap .inner ul {width: 100%; max-width: 1070px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.icon-menu-wrap .inner ul li a  {display: block; text-align: center; font-size: 1.8rem;}
.icon-menu-wrap .inner ul li a:hover  {color: #0B7B65;}
.icon-menu-wrap .inner ul li a .icon-menu  {width: 110px; height: 110px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); border-radius: 20px; margin-bottom: 15px; transition: all 0.3s;}
.icon-menu-wrap .inner ul li a:hover .icon-menu  {transform: translateY(-10px); box-shadow: 0 0 10px rgba(11, 123, 101, 0.7);}
.icon-menu-wrap .inner ul li:first-child a .icon-menu  {background: url("../images/main/icon-menu01.png") no-repeat center;}
.icon-menu-wrap .inner ul li:nth-child(2) a .icon-menu  {background: url("../images/main/icon-menu02.png") no-repeat center;}
.icon-menu-wrap .inner ul li:nth-child(3) a .icon-menu  {background: url("../images/main/icon-menu03.png") no-repeat center;}
.icon-menu-wrap .inner ul li:nth-child(4) a .icon-menu  {background: url("../images/main/icon-menu04.png") no-repeat center;}
.icon-menu-wrap .inner ul li:last-child a .icon-menu  {background: url("../images/main/icon-menu05.png") no-repeat center;}



@media all and (max-width:1200px) {
    .icon-menu-wrap .inner ul {max-width: unset; margin: 0;}
}
@media all and (max-width:999px) {
    .icon-menu-wrap .inner ul li a .icon-menu {width: 85px; height: 85px; background-size: 55% !important;}
}
@media all and (max-width:768px) {
    .icon-menu-wrap {padding: 60px 0;}
    .icon-menu-wrap .inner ul li a {font-size: 1.7rem;}
    .icon-menu-wrap .inner ul li a .icon-menu {width: 80px; height: 80px;}
    
}
@media all and (max-width:640px) {
    .icon-menu-wrap .inner > ul {width: auto; flex-wrap: wrap; justify-content: flex-start; margin-right: -20px; margin-bottom: -20px;}
    .icon-menu-wrap .inner ul li {width: calc((100% - 60px) / 3); margin-right: 20px; margin-bottom: 20px;}
    .icon-menu-wrap .inner ul li a { width: 100%; font-size: 1.6rem;}
    .icon-menu-wrap .inner ul li a .icon-menu {width: 100%; background-size: 25% !important;}
}
@media all and (max-width:420px) {
    .icon-menu-wrap {padding: 40px 0;}
    .icon-menu-wrap .inner > ul > li > a .icon-menu {background-size: 35% !important;}
    
}

/*------Content 01-------*/
.content01 {width: 100%; position: relative; margin: 100px 0;}
.content01::before {content: ''; position: absolute; width: 85%; height: 360px; top: -100px; border-radius: 0 80px 0 0; background-color: #F2F3F5; z-index: -999;}
.content01::after {content: ''; position: absolute; width: 63%; height: 380px; right: 0; bottom: 0; border-radius: 0 0 0 80px; background: #0B7B65 url("../images/main/content01-map.png") no-repeat right top; z-index: -999;}
.content01 .inner {display: flex;}
.content01 .inner .journal-slide {width: 100%; top: -30px;}
.content01 .inner .content-tit {margin-right: 200px; flex-shrink: 0;}
.content01 .inner .content-tit p {line-height: 1.4; margin-bottom: 50px;}
.content01 .inner .content-tit .link-btn {color: #444; background: #fff; font-weight: 700; border: 2px solid #fff; border: none;}
.content01 .inner .content-tit .link-btn:hover {background: #0B7B65; color: #fff; font-weight: 400;}
.content01 .inner .content-tit .link-btn::after {background: url("../images/main/arrow02.png")no-repeat center / cover;}
.content01 .inner .content-tit .link-btn:hover::after {background: url("../images/main/arrow01.png")no-repeat center / cover;}
.content01 .inner .content-cnt {display: flex; align-items: flex-end; padding-bottom: 10px;}
.content01 .inner .content-cnt .content-ba {width: 290px; height: 380px; margin-right: 90px; position: relative; border-radius: 20px; flex-shrink: 0;}
.content01 .inner .content-cnt .content-ba::before  {content: ""; width: 100%; height: 100%; background: url("../images/main/content01-img-bg.png") center / cover; position: absolute; z-index: -1; top: 10px; left: 10px;}
.content01 .inner .content-cnt .content-ba img {width: 100%; height: 100%; border-radius: 20px; object-fit: cover;}
.content01 .inner .content-cnt .content-tx  {margin-bottom: 60px;}
.content01 .inner .content-cnt .content-tx strong {display: block; font-size: 3rem; font-weight: 500; color: #fff; padding-bottom: 50px; position: relative;}
.content01 .inner .content-cnt .content-tx strong::after {content: ''; width: 90px; height: 3px; background: url("../images/main/content01-bar.png"); position: absolute; left: 0; bottom: 30px;}
.content01 .inner .content-cnt .content-tx dl {font-family: 'GothicA1-Regular'; display: flex; font-size: 1.8rem; font-weight: 300; color: #fff; margin-bottom: 10px;}
.content01 .inner .content-cnt .content-tx dl dt  {width: 70px; position: relative; margin-right: 40px;
}
.content01 .inner .content-cnt .content-tx dl dt::after {content: ''; background-color: #fff; width: 1px; height: 18px; position: absolute; right: -20px;  top: 2px;}
.content01 .inner .content-cnt .content-tx dl dd {font-weight: 300; color: #fff;}



@media all and (max-width:1920px) {
    .content01::after {width: 67%;}
}

@media all and (max-width:1440px) {
    .content01::after {width: 75%;}
    .content01 .inner .content-tit {margin-right: 120px;}
    
}
@media all and (max-width:1200px) {
    .content01 {margin: 80px 0; padding-bottom: 80px;}
    .content01::before {width: 90%; top: -80px;}
    .content01::after {width: 90%;}
    .content01 .inner {flex-direction: column;}
    .content01 .inner .content-tit {margin-right: 0; text-align: center; margin-bottom: 30px;}
    .content01 .inner .content-tit p {margin-bottom: 20px;}
    .content01 .inner .content-tit p br {display: none;}
    .content01 .inner .content-tit .slide-controller {justify-content: center;}
    .content01 .inner .journal-slide {top: 0;}
    .content01 .inner .content-cnt {justify-content: center;}
    .content01 .inner .content-cnt .content-tx strong {font-size: 2.6rem;}
    .content01 .inner .content-cnt .content-ba {margin-right: 60px;}
    
}
@media all and (max-width:768px) {
    .content01 {margin: 60px 0; padding-bottom: 60px;}
    .content01::before {top: -60px;}
    .content01 .inner .content-cnt .content-ba {width: 245px; height: 320px; margin-right: 30px;}
    .content01 .inner .content-cnt .content-tx {margin: 30px 0 0 0;}
    .content01 .inner .content-cnt .content-tx strong {font-size: 2.2rem;}
    .content01 .inner .content-cnt .content-tx dl {font-size: 1.7rem;}
}
@media all and (max-width:640px) {
    .content01::before {width: 100%; border-radius: 0;}
    .content01::after {width: 100%; border-radius: 0;}
    .content01 .inner .content-cnt {flex-direction: column; align-items: center;}
    .content01 .inner .content-cnt .content-ba {width: 185px; height: 242px;}
    .content01 .inner .content-cnt .content-tx strong {font-size: 2rem; padding-bottom: 30px;}
    .content01 .inner .content-cnt .content-tx strong::after {bottom: 15px;}
    .content01 .inner .content-cnt .content-tx dl {font-size: 1.6rem;}
}
@media all and (max-width:420px) {
    .content01 {margin: 40px 0; padding-bottom: 40px;}
    .content01::before {top: -40px;}
    

}

/*------Content 02-------*/
.content02 {margin: 100px 0;}
.content02 .inner .tab-title {display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 40px;}
.content02 .inner .content-tit h3 {margin-bottom: 8px; z-index: 999;}
.content02 .inner .tab-title .tabs {background-color: #F2F3F5; border-radius: 50px; padding: 10px 15px; display: flex;}
.content02 .inner .tab-title .tabs .tab-menu:not(:last-child) {margin-right: 5px;}
.content02 .inner .tab-title .tabs .tab-menu a {display: block; width: 150px; height: 60px; line-height: 60px; text-align: center; font-size: 1.8rem; font-weight: 500; border-radius: 50px;}
.content02 .inner .tab-title .tabs .tab-menu a.on {color: #fff; background-color: #000; font-weight: 500;}


/*-----Tab Menu Contents*/

.content02 .inner .tab-content {display: none;}
.content02 .inner .tab-content.on {display: block;}


.content02 .inner .tab-content ul {display: flex; flex-wrap: wrap; margin-right: -30px; margin-bottom: -30px;}

.content02 .inner .tab-content ul li {width: calc((100% - 90px) / 3); margin-right: 30px; margin-bottom: 30px;}
.content02 .inner .tab-content ul li a {display: block; padding: 30px; border: #ccc 1px solid; border-radius: 20px; transition: all 0.2s; position: relative;}
.content02 .inner .tab-content ul li a::before {content: ""; border-top: 1px solid #0B7B65; border-bottom: 1px solid #0B7B65; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transform: scale3d(0, 1, 1); transition: 0.3s;}
.content02 .inner .tab-content ul li a::after {content: ""; border-left: 1px solid #0B7B65; border-right: 1px solid #0B7B65; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transform: scale3d(1, 0, 1); transition: 0.3s;}
.content02 .inner .tab-content ul li a:hover::before,
.content02 .inner .tab-content ul li a:hover::after {transform: scale3d(1, 1, 1); border-radius: inherit;}
.content02 .inner .tab-content ul li a p {height:52px; font-size: 2rem; font-weight: 500; word-break: keep-all; margin-bottom: 35px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.content02 .inner .tab-content ul li a span {font-family: 'GothicA1-Regular'; color: #999; font-weight: 300; font-size: 1.6rem;}

@media all and (max-width:1440px) {
    .content02 .inner .tab-title .tabs .tab-menu a {width: 120px;}
}
@media all and (max-width:1200px) {
    .content02 {margin: 80px 0;}
    .content02 .inner .tab-title {flex-direction: column; align-items: center;}
    .content02 .inner .tab-title .content-tit {text-align: center;}
    .content02 .inner .tab-title .tabs {width: 100%; margin-top: 30px;}
    .content02 .inner .tab-title .tabs .tab-menu a {height: 48px; line-height: 48px;}
    .content02 .inner .tab-content ul li a {padding: 24px;}
    .content02 .inner .tab-content ul li a p {font-size: 1.8rem; height: 46px; margin-bottom:25px;}
}
@media all and (max-width: 999px) {
    .content02 .inner .tab-content ul li {width: calc((100% - 60px) / 2);}


}
@media all and (max-width:768px) {
    .content02 {margin: 60px 0;}
    .content02 .inner .tab-title {margin-bottom: 30px;}
    .content02 .inner .tab-title .tabs .tab-menu {width: 33.33%;}
    .content02 .inner .tab-title .tabs .tab-menu a {width: 100%; font-size: 1.7rem;}
}
@media all and (max-width:640px) {
    .content02 .inner .tab-content ul {margin-right: 0; margin-bottom: 0;}
    .content02 .inner .tab-content ul li {width: 100%; margin-right: 0; margin-bottom: 20px;}
    .content02 .inner .tab-content ul li a p {margin-bottom: 20px; font-size: 1.7rem;}
    .content02 .inner .tab-title .tabs {padding: 8px}
    .content02 .inner .tab-title .tabs .tab-menu a {font-size: 1.6rem;}
}
@media all and (max-width:420px) {
    .content02 {margin: 40px 0;}
    .content02 .inner .tab-title {margin-bottom: 20px;}
    .content02 .inner .tab-title .tabs {flex-wrap: wrap; border-radius: 25px; margin: 20px -5px -5px 0;}
    .content02 .inner .tab-title .tabs .tab-menu {width: calc((100% - 10px) / 2);}
    .content02 .inner .tab-title .tabs .tab-menu:not(:last-child) {margin-bottom: 5px;}
    .content02 .inner .tab-title .tabs .tab-menu a {height: 40px; line-height: 40px;}
    .content02 .inner .tab-content ul li {margin-bottom: 10px;}
    .content02 .inner .tab-content ul li:last-child {margin-bottom: 0;}

}

/** popup **/
.popup { max-width: calc(100% - 30px); min-width: 290px; position: absolute; top: 140px; left: 140px; z-index: 10001; box-shadow: 10px 10px 10px rgb(0 0 0 / 20%);	background-color:#fff;  }
.popup__content-wrap .title {text-align:Center; font-size:1.4em; }
.popup__content-wrap .text {font-size:1.4em; }
.popup__footer {position:relative; background-color:#000; padding:10px 20px; }
.popup__footer .close1day {color:#fff; font-size:0.9em;}
.popup__footer .close {position:Absolute; width:15px; height:15px; display:block; color:#fff; ; background:url("../images/common/tm_bullet2.gif") repeat-x center center ; opacity:1; transform:rotate(45deg); right:10px; top:14px;} 
.popup__footer .close span {display:none !important; }


/* 텍스트 타이틀 */
.popup .text_popup { padding: 0; }
.popup .text_popup .popup__content-header .title,
.popup .text_popup .popup__content-wrap .title { text-align:center; font-weight: 600; color: #222; font-size: 30px; line-height: 1.3; padding: 30px 10px 20px; border-top: 2px solid #050505; border-bottom: 1px solid #ccc; position: relative;}
.popup .text_popup .popup__content-header .title::after,
.popup .text_popup .popup__content-wrap .title::after{ content: "NOTICE"; font-size: 14px; color: #fff; display:inline-block; background-color:#000; border-radius:25px; height: 34px; line-height:34px; position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); padding:0 40px; letter-spacing: 1px;}
.popup .text_popup .popup__content-wrap .text { max-height: 400px; overflow-y: auto; line-height: 1.4; /*background-color: #f5f5f5; padding:20px;*/}
.popup .text_popup .popup__content-wrap {padding:20px;}


/* 팝업 슬릭 버튼 */
.popup.type-slide .popup__content-button a{ border: none; outline: none; width: 40px; height: 40px; position: absolute; top: 50%; transform: translate(0, -50%); z-index: 999;}
.popup.type-slide .prev{left: 0; border-top-right-radius: 50%; border-bottom-right-radius: 50%; background: rgba(0,0,0,0.2) url(../images/common/slick_btn_white.png) no-repeat -65px 50%;; }
.popup.type-slide .next{right: 0; border-top-left-radius: 50%; border-bottom-left-radius: 50%; background: rgba(0,0,0,0.2) url(../images/common/slick_btn_white.png) no-repeat -118px 50%; }
.popup.type-slide:hover .prev{background: rgba(0,0,0,1) url(../images/common/slick_btn_white.png) no-repeat -65px 50%; transition: background-color 1s;}
.popup.type-slide:hover .next{background: rgba(0,0,0,1) url(../images/common/slick_btn_white.png) no-repeat -118px 50%;; transition: background-color 1s;}



/* 슬라이드 팝업 */
.popup.type-slide {position:relative;  }
.popup.type-slide .popup__content-wrap { position:relative; overflow: hidden; display:block;  padding:10px 10px 2px 10px;  }
/*.popup.type-slide .popup__content-wrap .slick-slide { float: left; height:100%; min-height: 1px;}*/ 
.popup__content-img img {max-width: 100%; height: auto;}

@media(max-width:768px){
	.popup {top:50% !important; left:50% !important; transform: translate(-50%, -50%); max-height:calc(100% - 30px);}
	.popup .text_popup .popup__content-header .title,
	.popup .text_popup .popup__content-wrap .title { font-size: 20px; padding: 30px 10px 20px;}
	.popup .text_popup .popup__content-header .title::after,
	.popup .text_popup .popup__content-wrap .title::after{ content: "NOTICE"; font-size: 12px; height: 28px; line-height:28px; padding:0 30px;}
	.popup .text_popup .popup__content-wrap .text{ max-height: 400px; ;}
	.popup .text_popup .popup__content-wrap {padding:20px 20px;}
}