@charset "utf-8";

.mcnt1{overflow: hidden; position: relative;width: 100%; max-width:100%;  height: 970px; transition:.3s; z-index: 20;}
.mcnt1 .item{width: 100%; height: 970px; position: relative; overflow: hidden; }
.mcnt1 .item .mv_img{width: 100%; height: 100%;}
.mcnt1 .item .mv_img img{width: 100%; height: 100%; object-fit:cover; transition:2.2s;} 
.mcnt1 .active .mv_img img{transform:scale(1.05) rotate(.001deg); }
.mcnt1 .active .mv_img{transform:scale(1.05) rotate(.001deg); }
.mcnt1 .m_txt{position: absolute; left: 0; top: 0; width: 100%; height: 100%;  align-items:center; box-sizing: border-box;  }
.mcnt1 .m_txt .box {display: flex; align-items: center;justify-content: center;width: 100%;height: 100%;flex-direction: column;text-align: center; width: 100%; height: 100%;  gap:0px; flex-direction: column; text-align: center;  box-sizing: border-box;}
.mcnt1 .m_txt .box h3{position: relative; color: #FFF; text-align: center; font-size: 72px; font-weight: 500; line-height: 80px;  letter-spacing: -2.16px; opacity: 0; filter:blur(10px); transition:.4s; top: 30px;  }
.mcnt1 .m_txt .box h3 span{display: block; margin-top: 20px; font-weight: 700;}
.mcnt1 .mv01 .m_txt .box h3 span{color: #122A89; font-weight: 700;}

.mcnt1 .mv03 .m_txt .box {padding-bottom: 320px;}

.mcnt1 .active .m_txt .box h3{opacity: 1;  top: 0; filter:blur(0px); }
.mcnt1 .owl-dots{display: none;}
.mv-controll{position: absolute; left: 50%; margin-left: -700px;bottom: 60px; z-index: 100; display: flex; align-items: center; gap:24px; }
.mv-controll > span{color: #FFF; font-family: 'Montserrat';  font-size: 22px; font-weight: 700; line-height: 34px;  letter-spacing: -0.66px;}
.mv-controll .mv-slider-bt{cursor: pointer;}
.mv-controll .dot{width: 100px; height: 4px; overflow: hidden;}
.mv-controll .dot .line-bar{position: relative; width: 100%; height: 100%; background: rgba(255,255,255,0.3);}
.mv-controll .dot .line-bar i{position:absolute;left:0;top:0;width:0%;height:100%;background:#fff;border-radius:100px;}
.mv-controll .dot .line-bar i.active{animation: mvBar 8s linear forwards;}
.mv-controll .dot .line-bar i.stop{animation-play-state: paused;}
@keyframes mvBar{from { width:0%; }to{ width:100%; }}
.mv-controll .mv-btn-box{position: relative; top: 2px; display: flex; align-items:center;  gap:4px; margin-left: -5px;} 
.mv-controll .mv-btn{position: relative; width: 24px; height: 24px; }
.mv-controll .mv-btn span{position: absolute; left: 0; top: 0; line-height: 0; cursor: pointer;  z-index: 10; opacity: 1; z-index: 0; line-height: 0;}
.mv-controll .mv-btn span img{line-height: 0;}
.mv-controll .mv-btn span:last-child{}
.mv-controll .mv-btn span.on{opacity: 0; z-index: -1;}
.mv-scroll{position: absolute; right: 72px; bottom: 69px; z-index: 1000; display: flex; flex-direction: column; align-items:center; justify-content: center; gap:20px; cursor: pointer;}
.mv-scroll i{position: relative; width: 14px;height: 46px; border-radius: 4px; background: linear-gradient(180deg, rgba(217, 217, 217, 0.00) 0%, #FFF 100%); overflow: hidden; }
.mv-scroll i:after{position: absolute; content: ''; width: 14px; height: 14px; border-radius: 4px; background: #fff; left: 0; top: 0; animation: mvScroll 1s linear infinite forwards;}
@keyframes mvScroll{0% { top: 0; }70%{ top: 80%;; } 100%{top: 0;  }}

.main-tit{display: flex; flex-direction: column; gap:32px; }
.main-tit h3{font-family: 'Montserrat'; color: #111;  font-size: 60px; font-weight: 700; letter-spacing: -1.8px;}
.main-tit p{color: #333; font-size: 22px; font-weight: 400; line-height: 34px;  letter-spacing: -0.66px; margin-left: 6px;}
.main-tit2{display: flex; flex-direction: column; gap:16px; }
.main-tit2 h3{color: #111; font-size: 54px; font-weight: 600; line-height: 80px; letter-spacing: -1.62px;}
.main-tit2 p{color: #333; font-size: 22px; font-weight: 400; line-height: 34px;  letter-spacing: -0.66px;}
.main-link > a{display: flex; align-items:center; justify-content: space-between;  color: #FFF; font-size: 18px; font-weight: 600; line-height: 28px;  letter-spacing: -0.54px; border-radius: 80px; background: #122A89; width: 174px; height: 58px; padding: 0 24px; transition:.3s;}
.main-link > a i{line-height: 0;  transition:.3s;}
.main-link > a:hover{background: #000;}
.mcnt2{padding-top: 160px;}
.mcnt2-cnt{display: flex; flex-wrap:wrap; gap:120px; margin-top: 80px;}
.mcnt2-cnt > *{}
.mcnt2-cnt figure{width: 100%; max-width:700px; height: 550px; border-radius: 20px; background: #F8F8F8; display: flex; align-items:center; justify-content: center;}
.mcnt2-cnt .tbx{display: flex; flex-direction: column; align-items: flex-start; gap:40px; padding-top: 24px; flex:1; }
.mcnt2-cnt .tbx .box {display: flex; flex-direction: column; gap:16px; }
.mcnt2-cnt .tbx .box b{color: #122A89;  font-size: 26px; font-weight: 600; line-height: 34px; letter-spacing: -0.78px;}
.mcnt2-cnt .tbx .box p{color: #666; font-size: 20px; font-weight: 400; line-height: 34px; letter-spacing: -0.6px;}
.mcnt2-cnt .tbx .main-link{margin-top: auto; margin-bottom: 44px;}
.mcnt3{padding-top: 200px;}
.mcnt3-cnt{margin-top: 80px; display: flex; flex-wrap:wrap; gap:40px;}
.mcnt3-cnt > li{flex:1; }
.mcnt3-cnt > li > a{position: relative; display: block;  cursor: default; transition:.3s; overflow: hidden; border-radius: 20px; z-index: 10;}
.mcnt3-cnt > li > a:before {position: absolute; content: ''; width: 100%; height: 100%; left: 0; top: 0;border-radius: 20px; border: 2px solid var(--Point-01, #122A89); background: linear-gradient(124deg, rgba(87,87,87,0) 3.61%, var(--Point-01, #122A89) 83.13%), linear-gradient(180deg, rgba(60,35,7,0) 0%, rgba(32,30,28,0.5) 100%); transition:.5s; opacity: 0; box-sizing: border-box;}



.mcnt3-cnt > li:hover > a:before{opacity: 1;} 



.mcnt3-cnt > li > a img{transition:.6s;}
.mcnt3-cnt > li > a .tbx{position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; gap:10px; align-items:center; justify-content: center; text-align: center; transition:.3s;}
.mcnt3-cnt > li > a .tbx p{color: #FFF; font-size: 36px; font-weight: 600; line-height: 44px;  letter-spacing: -1.08px;}
.mcnt3-cnt > li > a .tbx span{ font-size: 20px; font-weight: 400; line-height: 34px;  letter-spacing: -0.6px; color: #fff;}
/* .mcnt3-cnt > li > a:hover {
 > img{scale:1.05;}
 > .tbx{translate:0 -20px;}
} */


.mcnt4{background: url(../img/main/mcnt4-bg.jpg) center / cover no-repeat; padding-top: 160px; height: 910px; margin-top: 200px;}
.mcnt4 .wrap2{display: flex; flex-direction: column;}
.mcnt4 .main-tit2 h3{color: #fff;}
.mcnt4 .main-tit2 p{color: rgba(255,255,255,0.6);}
.mcnt4 .main-link{margin-left: auto; margin-top: -20px;}

.mcnt4-cnt{display: flex; gap:20px; margin-top: 40px; max-width:100%;}  
.mcnt4-cnt > li{ height: 360px; flex:1; min-width: 0;}
.mcnt4-cnt > li > a{display: flex; flex-direction: column;width: 100%; height: 100%;  min-width: 0; border-radius: 20px; background: #FFF; padding: 60px 40px 70px; justify-content: space-between; transition:.3s;}
.mcnt4-cnt > li > a b{color: #111; font-size: 28px; font-weight: 600; line-height: 34px; letter-spacing: -0.84px; transition:.3s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  word-break: keep-all;}
.mcnt4-cnt > li > a p{color: #666; font-size: 20px; font-weight: 400; line-height: 34px;  letter-spacing: -0.6px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin-bottom: 30px; transition:.3s; word-break: break-all; } 
.mcnt4-cnt > li > a span{display: flex; align-items:center; gap:4px; color: #888; font-size: 18px; font-weight: 400; line-height: 24px;  letter-spacing: -0.54px; transition:.3s;}
.mcnt4-cnt > li > a span svg path{stroke:#888; transition:.3s;}
.mcnt4-cnt > li:hover {
	> a{translate:0 -20px; background: #122A89;}
	> a b{color: #fff;}
	> a p{color: rgba(255,255,255,0.6); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: auto; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font;} 
	> a span{color: rgba(255,255,255,0.3);}
	> a span svg path{stroke:rgba(255,255,255,0.3); }
}