@charset "utf-8";


/* m_txt */
.m_txt{ font-family: 'SUIT', sans-serif;}
.m_txt h3{font-size: 48px; color: #222; font-weight: 800; line-height: 1.3em;}
.m_txt h3 span{color: var(--c01); }
.m_txt p{font-size: 18px; color: #999999; font-weight: 600; line-height: 1.5em; margin-top: 25px; word-break:keep-all; }
.m_txt a.btn{font-size: 18px; font-weight: 700; color: var(--c01); padding: 20px 40px; display: inline-block; border: 1px solid var(--c01); margin-top: 55px;}
.m_txt a.btn::after{content: '→'; padding-left: 20px; color: var(--c01); font-size: 18px; font-weight: 700; }

@media all and (max-width:1280px){
	.m_txt h3{font-size: 42px;}
	.m_txt p{font-size: 17px; margin-top: 20px;}
	.m_txt a.btn{font-size: 17px; padding: 15px 35px; margin-top: 45px;}
	.m_txt a.btn::after{font-size: 17px; padding-left: 18px;}
}
@media all and (max-width:976px){
	.m_txt h3{font-size: 36px;}
	.m_txt p{font-size: 16px; margin-top: 15px;}
	.m_txt a.btn{font-size: 16px; padding: 13px 25px; margin-top: 35px;}
	.m_txt a.btn::after{font-size: 16px; padding-left: 15px;}
}
@media all and (max-width:640px){
	.m_txt h3{font-size: 32px;}
	.m_txt p{font-size: 15px; margin-top: 10px; max-width: 85%; margin-left: auto; margin-right: auto;}
	.m_txt a.btn{font-size: 15px; padding: 12px 20px; margin-top: 28px;}
	.m_txt a.btn::after{font-size: 15px; padding-left: 13px;}
}
@media all and (max-width:480px){
	.m_txt h3{font-size: 28px;}
}


/* sec1 */
.sec1{height: 100vh; position: relative;}
.sec1 .visual{height: 100%;}
.sec1 .visual .mv{height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat;}
.sec1 .visual .mv.mv1{background-image: url(/images/main/mv1.jpg);}
.sec1 .visual .mv .inner{height: 100%; display: flex; align-items: center;}
.sec1 .visual .mv .inner .txt{color: #fff;}
.sec1 .visual .mv .inner .txt h4{font-weight: 500; font-size: 20px; word-break: keep-all;}
.sec1 .visual .mv .inner .txt h3{font-size: 56px; font-weight: 800; word-break: keep-all;}
.sec1 .visual .mv .inner .txt p{font-weight: 600; font-size: 18px; margin-top: 15px; word-break: keep-all;}
.sec1 .shortcut{position: absolute; z-index: 2; bottom: 0; max-width: 1480px; width: 100%;left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; bottom: 100px;}
.sec1 .shortcut .box{width: 300px; display: flex; align-items: center; justify-content: space-between;}
.sec1 .shortcut .box .txt{color: #fff;}
.sec1 .shortcut .box .txt p{font-size: 18px; font-weight: 600;}
.sec1 .shortcut .box .txt h3{font-size: 26px; font-weight: 600;}
.sec1 .shortcut .box .button{}
.sec1 .shortcut .box .button a{}
.sec1 .shortcut .box .button a img{}

@media all and (max-width:1479px){
	.sec1 .shortcut{max-width: 94%;}
}
@media all and (max-width:1280px){
	.sec1 .visual .mv .inner .txt h4{font-size: 18px;}
	.sec1 .visual .mv .inner .txt h3{font-size: 48px;}
	.sec1 .visual .mv .inner .txt p{font-size: 17px; margin-top: 10px;}
	.sec1 .shortcut{bottom: 80px;}
	.sec1 .shortcut .box{width: 240px;}
	.sec1 .shortcut .box .txt p{font-size: 17px;}
	.sec1 .shortcut .box .txt h3{font-size: 22px;}
	.sec1 .shortcut .box .button a img{max-width: 48px;}
}
@media all and (max-width:976px){
	.sec1 .visual .mv .inner .txt{margin-top: -80px;}
	.sec1 .visual .mv .inner .txt h4{font-size: 17px;}
	.sec1 .visual .mv .inner .txt h3{font-size: 42px;}
	.sec1 .visual .mv .inner .txt p{font-size: 16px; margin-top: 6px;}
	.sec1 .shortcut{flex-direction: column; max-width: 100%; bottom: 30px;}
	.sec1 .shortcut .box{padding: 20px 3%; width: 100%; border-top: 1px solid rgba(255,255,255,0.2);}
	.sec1 .shortcut .box .txt p{font-size: 16px;}
	.sec1 .shortcut .box .txt h3{font-size: 20px;}
	.sec1 .shortcut .box .button a img{max-width: 42px;}
}
@media all and (max-width:640px){
	.sec1{height: 85vh;}
	.sec1 .visual .mv .inner{justify-content: center;}
	.sec1 .visual .mv .inner .txt{margin-top: 0px; text-align: center;}
	.sec1 .visual .mv .inner .txt h4{font-size: 16px;}
	.sec1 .visual .mv .inner .txt h3{font-size: 32px;}
	.sec1 .visual .mv .inner .txt p{font-size: 15px; margin-top: 5px;}
	.sec1 .shortcut{display: none;}
}


/* sec2 */
.sec2{display: flex; align-items: center; padding: 110px 0 100px; background: url(/images/main/sec2.png) no-repeat left top;}
.sec2 .m_txt{width: 750px; padding: 0 0 0 220px;}
.sec2 .cont{display: flex; gap:0 30px; width:calc(100% - 750px);}
.sec2 .cont .slick-prev{display: none !important;}
.sec2 .cont .slick-next{width: 76px; height: 76px; background-color: #fff; right: 120px; z-index: 6;}
.sec2 .cont .slick-next::before{ color: var(--c01); font-family: 'SUIT', sans-serif; font-weight: 700;}
.sec2 .cont .box{margin-right: 30px;}
.sec2 .cont .box .img{}
.sec2 .cont .box .img img{max-width: 100%;}
.sec2 .cont .box .txt{margin-top: 10px;}
.sec2 .cont .box .txt h3{font-size: 24px; color: #000000; font-weight: 600;}
.sec2 .cont .box .txt p{font-size: 20px; font-weight: 600; opacity: 0.6; color: #000;}

@media all and (max-width:1479px){
	.sec2 .m_txt{padding-left: 3%; width: 550px;}
	.sec2 .cont{width:calc(100% - 550px);}
}
@media all and (max-width:1280px){
	.sec2{padding: 90px 0 80px;}
	.sec2 .m_txt{width: 500px;}
	.sec2 .cont{width:calc(100% - 500px);}
	.sec2 .cont .box .img img{max-width: 400px;}
	.sec2 .cont .box .txt h3{font-size: 22px;}
	.sec2 .cont .box .txt p{font-size: 19px;}
	.sec2 .cont .slick-next{width: 64px; height: 64px; right: 3%;}
}
@media all and (max-width:976px){
	.sec2{padding: 80px 0 70px; flex-direction: column; background-size: 60% !important;}
	.sec2 .m_txt{width: 100%; text-align: center; padding-left: 0;}
	.sec2 .cont{margin-top: 50px; width: 100%; padding: 0 3%;}
	.sec2 .cont .box .img img{max-width: 320px;}
	.sec2 .cont .box .txt{margin-top: 6px;}
	.sec2 .cont .box .txt h3{font-size: 20px;}
	.sec2 .cont .box .txt p{font-size: 18px;}
	.sec2 .cont .slick-next{right: 5%; width: 60px; height: 60px;}
}
@media all and (max-width:640px){
	.sec2{padding: 70px 0 60px;}
	.sec2 .cont .box{margin-right: 20px;}
	.sec2 .cont .box .img img{max-width: 260px;}
	.sec2 .cont .box .txt h3{font-size: 18px;}
	.sec2 .cont .box .txt p{font-size: 16px;}
	.sec2 .cont .slick-next{width: 54px; height: 54px;}
}
@media all and (max-width:480px){
	.sec2 .cont .box .img img{max-width: 240px;}
}


/* sec3 */
.sec3{padding: 120px 0; background: url(/images/main/sec3.jpg) no-repeat center center / cover;}
.sec3 .inner{}
.sec3 .inner .m_txt{text-align: center;}
.sec3 .inner .m_txt h3{color: #fff;}
.sec3 .inner .m_txt h3 span{color: #ffd74a;}
.sec3 .inner .tab{display: flex; justify-content: center; margin: 40px 0 60px; gap:0 40px;}
.sec3 .inner .tab li{font-size: 20px; color: #ffb7b7; font-weight: 600;}
.sec3 .inner .tab li.on{color: #fff;}
.sec3 .inner .tabcontent{display: none; gap:0 26px; width: 100%; overflow: hidden;}
.sec3 .inner .tabcontent.on{display: flex; margin-top: 50px;}
.sec3 .inner .tabcontent .box{background-color: #fff; width: calc(100% / 2 - 60px / 4);}
.sec3 .inner .tabcontent .box a{display: block; padding: 50px;}
.sec3 .inner .tabcontent .box a .top{}
.sec3 .inner .tabcontent .box a .top h4{color: #ca2b2b; font-size: 16px; font-weight: 600; margin-bottom: 30px;}
.sec3 .inner .tabcontent .box a .top .txt{}
.sec3 .inner .tabcontent .box a .top .txt h3{font-size: 24px; color: #000; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.sec3 .inner .tabcontent .box a .top .txt p{font-size: 18px; color: #666666; margin-top: 10px; overflow: hidden; text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2; /* 자를 줄 만큼 */
-webkit-box-orient: vertical;}
.sec3 .inner .tabcontent .box a .top .txt .date{font-size: 18px; font-weight: 600; color: #666666; font-family: 'SUIT', sans-serif; margin-top: 30px;}
.sec3 .inner .tabcontent .box a .bottom{}
.sec3 .inner .tabcontent .box a .bottom .icon{margin-top: 35px; text-align: right;}
.sec3 .inner .tabcontent .box a .bottom .icon img{max-width: 100%;filter: invert(28%) sepia(95%) saturate(2050%) hue-rotate(342deg) brightness(78%) contrast(94%)}

@media all and (max-width:1280px){
	.sec3{padding: 100px 0;}
	.sec3 .inner .tab{gap:0 30px;}
	.sec3 .inner .tab li{font-size: 19px;}
	.sec3 .inner .tabcontent .box a{padding: 40px; box-sizing: border-box;}
	.sec3 .inner .tabcontent .box a .top h4{font-size: 15px; margin-bottom: 25px;}
	.sec3 .inner .tabcontent .box a .top .txt h3{font-size: 22px;}
	.sec3 .inner .tabcontent .box a .top .txt p{font-size: 17px;}
	.sec3 .inner .tabcontent .box a .top .txt .date{font-size: 17px; margin-top: 25px;}
	.sec3 .inner .tabcontent .box a .bottom .icon{margin-top: 30px;}
	.sec3 .inner .tabcontent .box a .bottom .icon img{max-width: 32px;}
}
@media all and (max-width:976px){
	.sec3{padding: 80px 0;}
	.sec3 .inner .tab{margin: 25px 0 50px; gap:0 20px;}
	.sec3 .inner .tab li{font-size: 18px;}
	.sec3 .inner .tabcontent {flex-wrap: wrap; gap:20px;}
	.sec3 .inner .tabcontent .box{width: calc(100% / 2 - 20px / 2);}
	.sec3 .inner .tabcontent .box a{padding: 30px;}
	.sec3 .inner .tabcontent .box a .bottom .icon{margin-top: 26px;}
	.sec3 .inner .tabcontent .box a .bottom .icon img{max-width: 28px;}
	.sec3 .inner .tabcontent .box a .top h4{font-size: 14px; margin-bottom: 20px;}
	.sec3 .inner .tabcontent .box a .top .txt h3{font-size: 20px;}
	.sec3 .inner .tabcontent .box a .top .txt p{font-size: 16px;}
	.sec3 .inner .tabcontent .box a .top .txt .date{font-size: 16px; margin-top: 18px;}
}
@media all and (max-width:640px){
	.sec3{padding: 70px 0;}
	.sec3 .inner .tab {margin: 20px 0 40px;}
	.sec3 .inner .tab li{font-size: 17px;}
	.sec3 .inner .tabcontent {gap:10px;}
	.sec3 .inner .tabcontent .box{width: calc(100% / 2 - 10px / 2);}
	.sec3 .inner .tabcontent .box a{padding: 25px;}
	.sec3 .inner .tabcontent .box a .bottom .icon{margin-top: 22px;}
	.sec3 .inner .tabcontent .box a .bottom .icon img{max-width: 24px;}
	.sec3 .inner .tabcontent .box a .top h4{font-size: 14px; margin-bottom: 12px;}
	.sec3 .inner .tabcontent .box a .top .txt h3{font-size: 18px;}
	.sec3 .inner .tabcontent .box a .top .txt .date{font-size: 15px; margin-top: 14px;}
	.sec3 .inner .tabcontent .box a .top .txt p{display: none;}
}
@media all and (max-width:480px){
	.sec3 .inner .tabcontent .box{width: 100%;}
	.sec3 .inner .tabcontent .box a{padding: 20px;}
	.sec3 .inner .tabcontent .box a .bottom .icon{margin-top: 16px;}
	.sec3 .inner .tabcontent .box a .top .txt .date{margin-top: 10px;}
}


/* sec4 */
.sec4{padding: 100px 0;}
.sec4 .inner{}
.sec4 .inner .m_txt{text-align: center;}
.sec4 .inner .cont{margin-top: 60px; border-top: 2px solid #000;}
.sec4 .inner .cont li{padding: 40px 0; display: flex; border-bottom: 1px solid #cdcdcd; align-items: center;}
.sec4 .inner .cont li h4{font-size: 19px; font-weight: 500; color: #ca2b2b; width:140px; text-align: center;}
.sec4 .inner .cont li h3{font-size: 24px; color: #000; font-weight: 600; width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.sec4 .inner .cont li h3 a{}
.sec4 .inner .cont li p{font-size: 16px; color: #666666; margin-left: auto; padding: 0 40px;}

@media all and (max-width:1280px){
	.sec4{padding: 80px 0;}
	.sec4 .inner .cont{margin-top: 50px;}
	.sec4 .inner .cont li{padding: 35px 0;}
	.sec4 .inner .cont li h4{font-size: 18px;}
	.sec4 .inner .cont li h3{font-size: 22px; width: 60%;}
}
@media all and (max-width:976px){
	.sec4{padding: 70px 0;}
	.sec4 .inner .cont{margin-top: 40px;}
	.sec4 .inner .cont li{padding: 30px 0;}
	.sec4 .inner .cont li h4{font-size: 17px; width: 120px;}
	.sec4 .inner .cont li h3{font-size: 19px; width: 50%;}
	.sec4 .inner .cont li p{font-size: 15px; padding: 0 30px;}
}
@media all and (max-width:640px){
	.sec4{padding: 60px 0;}
	.sec4 .inner .cont li{padding: 25px 0;}
	.sec4 .inner .cont li h4{font-size: 16px; width: 100px;}
	.sec4 .inner .cont li h3{font-size: 18px; width: calc(100% - 100px);}
	.sec4 .inner .cont li p{display: none;}
}
@media all and (max-width:480px){
	.sec4 .inner .cont li{padding: 20px 0;}
	.sec4 .inner .cont li h4{font-size: 15px; width: 80px;}
	.sec4 .inner .cont li h3{font-size: 17px; width: calc(100% - 80px);}
}