@charset "utf-8";
/* ********************************************************************
 * name : ARML
 * filename : main.css
 * author : JBieN Á¦À̺ñ¿£
 * date : 2025-10-27
********************************************************************* */


/* === ¸ÞÀκñÁÖ¾ó¼½¼Ç === */
.mVisual{position: relative;margin: 0 3.125%;max-width: calc(100% - 6.25%);}
.mVisual:after{content: '';position: absolute;background: url(./../img/main/vis_bg.png) no-repeat;width: 788px;height: 674px;top: 1.3em;right: -5em;z-index: -1;}
.mVis-inner{position: relative;padding: 10em 0 4em;}
.visTxt{color: var(--black-color);position: absolute;left: 50%;margin-left: 6.5%;top: 30%;text-transform: uppercase;z-index: 10;letter-spacing: -0.1em;}
.visTxt .sTxt1{font-size: 2rem;color:#232121;position: relative;font-weight: 500;margin-left: 0.3em;}
.visTxt .sTxt1:after{content:'';background: url(./../img/main/vis_icon.png) no-repeat;width:30px;height:25px;position: absolute;margin-left: 0.5em;}
.visTxt .sTxt2{font-size: 4.5rem;color:#2d2d2d;font-weight: 600;line-height: 1.1;margin-top: 0.1em;}
.visTxt .sTxt2 span{-webkit-text-fill-color: transparent;background-image: radial-gradient(circle at 0 100%, #207bc2 39%, #2d76ba 50%, #4b66b5 80%, #202d96 100%);-webkit-background-clip: text;display: block;font-weight: 600;display: block;font-size: 4.5rem;}

/* === ½½¶óÀ̵å === */
.visualSlide .swiper {width: 100%;height: 100%;margin-top: 40px;}
.visualSlide .swiper-wrapper{padding-bottom: 55px;}
.visualSlide .swiper-slide {text-align: center;font-size: 18px;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;
    -ms-flex-pack: center;-webkit-justify-content: center;justify-content: flex-start;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.visualSlide .swiper-slide .imgBox{width: 940px;height: 630px;overflow: hidden;position: relative;}
.visualSlide .swiper-slide .imgBox img{width: 100%;height: 100%;object-fit: cover;}
.visualSlide .swiper-slide .imgBox::before {content: "";position: absolute;left: 0;right: 0;bottom: -5px;height: 150px;backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px);mask-image: linear-gradient(to top, black 70%, transparent 100%);-webkit-mask-image: linear-gradient(to top, black 50%, transparent 100%);pointer-events: none;z-index: 1;}
.visualSlide .swiper-slide .imgBox::after {content: "";position: absolute;left: 0;right: 0;bottom: -5px;height: 300px;background: linear-gradient(to top, rgb(0 20 37 / 70%) 0%, rgba(0, 20, 37, 0.0) 100%);pointer-events: none;z-index: 2;}
.visualSlide .swiper-slide .txtBox{width: calc(940px - 5em);text-align: right;color: #ffff;padding: 1.3em 2.5em;position: absolute;bottom: 0;z-index: 100;font-size: 1.325rem;}

.visualSlide .control{width: 95px;height: 45px;position: absolute;bottom: 70px;left: 50%;margin-left: 6.5%;}
.visualSlide .control .swiper-button-next{right: 0;}
.visualSlide .control .swiper-button-next:after{right: 0;}
.visualSlide .control .swiper-button-next i,
.visualSlide .control .swiper-button-prev i{color: #000000;z-index: 1;font-size: 0.8rem;}
.visualSlide .control .swiper-button-next:after,
.visualSlide .control .swiper-button-prev:after{content: '';position: absolute;box-sizing: border-box;transition: all 0.5s ease;display: inline-block;background: #ededed;width: 45px;height: 45px;border-radius: 4px;}
.visualSlide .control .swiper-button-next{width: 45px;height: 45px;}
.visualSlide .control .swiper-button-prev{width: 45px;height: 45px;}
.visualSlide .control .swiper-button-prev{left: 0;opacity: 0.5;}
.visualSlide .control .swiper-button-prev:after{left: 0;}
.visualSlide .control .swiper-pagination{margin-left: 85px;color: #b7b7b7;}
.visualSlide .control .swiper-pagination .swiper-pagination-current{color:  var(--black-color);}

.mVisual .scroll{position: absolute;right: 0;bottom: 9em;transform: translateX(0%);z-index: 3;color: #535353;display: flex;flex-direction: row;z-index: 100;align-items: flex-end;}
.mVisual .scroll .txt{font-weight: 500;font-size: 1.11rem;margin-bottom: -18px;margin-right: 1.5rem;}
.mVisual .scroll .line{position: relative;width: 1px;height: 6rem;background-color: rgb(181 181 181 / 30%);overflow: hidden;}
.mVisual .scroll .line::after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #7f7f7f; transform: scaleY(0);transform-origin: top;animation: growLine 1.5s ease-in-out infinite;}
.mVisual .scroll::before{content:'';background: url(./../img/main/scroll_icon.jpg) no-repeat;width:13px;height:8px;position: absolute;right: -6px;bottom: -13px;animation: scrollDown 1s ease-in-out infinite;}


/* === mCon1¹è³Ê === */
.mCon1{background: url(./../img/main/ban_bg.jpg) no-repeat;background-size: cover;background-attachment: fixed;background-position: center;background-repeat: no-repeat;height: 85vh;position: relative;}
.mCon1::after{content:'';background: linear-gradient(to bottom, rgb(0 0 0 / 22%) 0%, rgba(0, 0, 0, 0.8) 100%);position: absolute;top: 0;width: 100%;height: 85vh;z-index: 0;}
.mBan{display: flex;flex-direction: column;justify-content: center;height: 100%;position: relative;z-index: 2;}
.mBan .titleBox{position: relative;}
.mBan .titleBox h2{color: var(--white-color);font-size: 4rem;font-weight: 500;line-height: 1;}
.mBan .titleBox h3{color: var(--main-color);font-size: 4rem;position: absolute;top: 23vh;font-weight: 500;}
.mBan .titleBox p{color: var(--white-color);font-size: 1.5rem;width: 38%;line-height: 1.3;position: absolute;right: 0;bottom: 0;font-weight: 300;}
.cardBanContainer{display: flex;gap: 1.5rem;margin-top: 5rem;flex-wrap: wrap;}
.cardBan{flex: 1;min-width: 280px;aspect-ratio: 1.8/1;position: relative;border-radius: 12px;overflow: hidden;background: rgb(255 255 255 / 5%);display: flex;justify-content: center;align-items: center;transition: transform 0.4s ease;background-color: rgb(20 23 42 / 0%);backdrop-filter: blur(4px);box-shadow: inset -7px -2px 12px -7px rgb(255 255 255 / 15%);-webkit-backdrop-filter: blur(4px);  border-top: 1px solid transparent;border-image: linear-gradient(45deg, #2196f300, #ffffff14) 1;}
.cardBan:hover {transform: translateY(-3px);}
.cardBan .cardBanCon{position: relative;z-index: 1;display: flex;justify-content: space-between;width: 90%;height: 100%;align-items: center;}
.cardBan .cardBanCon h3{font-size: 2.5rem;color: #f6f6f6;font-weight: 300;animation: btnDown 1s ease-out forwards;}
.cardBan .cardBanCon .banBtn{display: flex;align-items: center;animation: txtUp 1s ease-out forwards;}
.cardBan .cardBanCon .banBtn .text{opacity: 0;}
.cardBan .cardBanCon .banBtn .icon{width: 44px;height: 44px;background: var(--main-color);border-radius: 50%;display: flex;justify-content: center;align-items: center;}
.cardBan .cardBanCon .banBtn .icon::before {color: #fff;transform: rotate(320deg);}
.cardBan::before {content: "";position: absolute;  inset: 0;  background-size: cover;  background-position: center;  opacity: 0;  transition: opacity 0.7s ease;  z-index: 0;}
.cardBan:nth-child(1)::before {background-image: url(./../img/main/card_ban01.jpg);}
.cardBan:nth-child(2)::before {background-image: url(./../img/main/card_ban02.jpg);}
.cardBan:nth-child(3)::before {background-image: url(./../img/main/card_ban03.jpg);}
.cardBan:hover::before {opacity: 1;}

.cardBan:hover .cardBanCon{align-items: flex-start;}
.cardBan:hover .cardBanCon h4{position: absolute;top: 8%;animation: txtUp 1s ease-out forwards;}
.cardBan:hover .banBtn{position: absolute;bottom: 8%;right: 0;animation: btnDown 1s ease-out forwards}
.cardBan:hover .banBtn .text{opacity: 1;width: 160px;height: 52px;margin-right: -23px;display: flex;align-items: center;color: #fff;font-size: 1.125rem;position: relative;z-index: 1;justify-content: center;}
.cardBan:hover .banBtn .text::before{content: "";width: 160px;height: 52px;margin-right: -47px;background: linear-gradient(135deg, #2196f3, #00bcd4);border-radius: 3rem;transform-origin: right center;transform: scaleX(0);animation: expandLeft 0.8s ease-out forwards;position: absolute;z-index: -1;}
.cardBan:hover .banBtn .icon{background: #fff;position: relative;z-index: 2;}
.cardBan:hover .banBtn .icon::before{color: #000;transform: rotate(0deg);}


/* === mCon2 ¸®¼­Ä¡ === */
.mCon2{background:#f7f7f7;padding: 10em 0;}
.mResearch{border-top: 1px solid #e3e3e3;}
.mResearch::after{content: "";width: 1px;height: 120%;background-color:#e3e3e3;position: absolute;left: calc(50% - 9%);top: 0;}
.section-label{position: relative;}
.section-label::after{content: "";width: 1px;height: 62px;background-color:#e3e3e3;position: absolute;left: 12em;}
.section-label span{display: block;font-size: 1.15rem;font-weight: 500;padding-left: 1.2em;position: absolute;top: 2.5em;}
.section-label span::before {content: "";width: 8px;height: 8px;position: absolute;background: #1f1f1f;border-radius: 50%;top: 50%;margin-top: -4px;left: 0;}

#mReWrap{display: flex;justify-content: center;align-items: flex-start;width: 100%;padding: 15em 0 5em;}
#mReWrap .mReWrapCon{display: flex;width: 100%;max-width: 1540px;gap: 170px;align-items: flex-start;}

.mReLeftWrap{width:540px;}
.mReLeft {flex: 0 0 35%;position: relative;}
.mReLeft-inner {position: sticky;top: 120px;margin-left: 3em;}
.mReLeft h2 {font-size: 4.8rem;margin-bottom: 0;font-weight: 500;color: #1f1f1f;}
.mReLeft p {font-size: 1.25rem;color: #1f1f1f;margin-bottom: 6em;}
.readmoreBtn{display: flex;align-items: center;animation: txtUp 1s ease-out forwards;width: 240px;height: 52px;background: var(--main-color);border-radius: 3rem;}
.readmoreBtn .text{display: flex;align-items: center;color: #fff;font-size: 1.125rem;justify-content: center;padding-left: 1.5em;opacity: 1;}
.readmoreBtn .icon{background: #fff;position: absolute;right: 4px;width: 44px;height: 44px;background: #fff;border-radius: 50%;display: flex;justify-content: center;align-items: center;font-size: 1.25rem;}
.readmoreBtn .icon::before {color: #000;transform: rotate(320deg);transition:all 0.5s;}
.readmoreBtn:hover .icon::before {transform: rotate(360deg);}
.readmoreBtn:hover::before{content: "";width: 90%;height: 52px;margin-right: -47px;background: linear-gradient(135deg, #00bcd4, var(--main-color));border-radius: 3rem 0 0 3rem;transform-origin: right center;transform: scaleX(0);animation: expandLeft 0.8s ease-out forwards;position: absolute;z-index: -1;}
.moReBtn{display:none;}

.mReRight {flex: 1;display: grid;grid-template-columns: repeat(2, 1fr);gap: 3em 4em;scroll-behavior: smooth;margin-top: -8em;}
.mReRight .rCard {display: block;  text-decoration: none;  color: inherit;  background: #fff;  border-radius: 15px;  overflow: hidden;  width: 100%;  /*max-width: 500px;*/  transition: transform 0.4s ease, box-shadow 0.4s ease;  border: 1px solid #e3e3e3;}
.mReRight .rCard:nth-child(2n) {top: 70px;  position: relative;}
.mReRight .rCard:hover {transform: translateY(-10px);}
.mReRight .rCard img {width: 100%;  height: 200px;  object-fit: cover;  transition: transform 0.5s ease;}
.mReRight .rCard:hover img {  transform: scale(1.08);}
.mReRight .rCard .imgBox {width: calc(100% - 1em);height: 200px;overflow: hidden;position: relative;background: #f0f0f0; /display: flex;align-items: center;justify-content: center;margin: 0.5em;border-radius: 15px;}
.mReRight .rCard .imgBox img {width: 100%;height: 100%;object-fit: cover; object-position: center;transition: transform 0.5s ease;}
.mReRight .rCard:hover .imgBox img {transform: scale(1.08);}
.mReRight .txtBox {padding: 20px;}
.mReRight .txtBox h3 {font-size: 1.4rem;margin-bottom: 8px;}
.mReRight .txtBox p {font-size: 0.9rem;color: #757575;margin-bottom: 16px;min-height: 40px;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.mReRight .infoBox {display: flex;  justify-content: space-between;  align-items: center;  font-size: 0.9rem;  padding-top: 1.2em;}
.mReRight .infoBox .category{display: flex;flex-direction: column;}
.mReRight .infoBox .category span{font-weight: 500;}
.mReRight .infoBox .progress {display: flex;  align-items: center;  gap: 6px;  font-weight: 500;}
.mReRight .infoBox .progress .status-dot {width: 8px;  height: 8px;  border-radius: 50%;}
.mReRight .ongoing .progress{color:#2196f3;}
.mReRight .ongoing .status-dot {background: #2196f3;}
.mReRight .finished .progress{color:#E12723;}
.mReRight .finished .status-dot {background: #E12723;}

/* === mCon3 ´º½º === */
.mCon3{background:#fff;padding: 10em 0 5em;z-index: 1;position: relative;}
.mNews{}
.mNews .armlLine{border-top: 1px solid #e3e3e3;}
.newsWrap {position: relative;width: 100%;overflow: hidden;display: flex;align-items: center;padding: 15em 0 10em;}
.newsCon {display: flex;gap: 30px;padding: 0 12vw;margin-top: 5em;}
.newsWrap .titleBox {position: absolute;top: 100px;left: 12vw;z-index: 10;width: calc(100% - 12vw);}
.newsWrap .titleBox h2 {font-size: 4.8rem;font-weight: 500;margin: 0;}
.newsWrap .titleBox .readmoreBtn{position: absolute;right: 3%;top: 29px;background:#757575;}
.newsWrap .titleBox .readmoreBtn:hover::before{background: linear-gradient(81deg, #2192ce, #cdcdcd);}
.newsCard {flex: 0 0 412px;min-width: 412px;border: 1px solid #dadada;padding: 2em 1.5em;box-sizing: border-box;display: flex;flex-direction: column;justify-content: space-between;transition: transform 0.3s ease, box-shadow 0.3s ease;position: relative;}
.newsCard .tag {color: #1A7CAD;font-weight: 500;margin-bottom: 12px;font-size: 1.15rem;}
.newsCard h3 {font-size: 1.6rem;font-weight: 500;line-height: 1.4;margin: 0 0 2.5em;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;position: relative;}
.newsCard .imgBox{width: 100%;height: 200px;border-radius: 15px;overflow: hidden;position: relative;background: #f0f0f0;display: flex;align-items: center;justify-content: center;}
.newsCard .imgBox img {width: 100%;height: 100%;object-fit: cover; object-position: center;}
.newsCard .date {font-size: 1.1rem;color: #555;margin-top: 1em;}
.newsCard:hover {background: var(--main-color);color: #fff;border: 1px solid var(--main-color);}
.newsCard:hover .tag,
.newsCard:hover .date{color:#fff;}
.newsCard:hover h3::after{background:#fff;}

.newsSwiper {width: 100%;padding: 0 12vw;margin-top: 5em;}
.newsSwiper-wrapper {display: flex;}
.newsSwiper-slide {width: 412px !important;margin-right: 30px;}

.arrow-btn {position: absolute;top: 50%;transform: translateY(-50%);z-index: 50;width: 60px;height: 60px;border-radius: 50%;background: rgba(255,255,255,0.85);border: 1px solid #ddd;display: flex;align-items: center;justify-content: center;font-size: 32px;cursor: pointer;user-select: none;}
.arrow-btn span{margin-top: -7px}
.newsSwiper-prev { left: 3vw; }
.newsSwiper-next { right: 3vw; }
.newsSwiper-prev::after,
.newsSwiper-next::after {display: none !important;}
.newsWrap .arrow-btn{top: 55%;}

.mPartnerWrap{position: relative;}
.mPartnerWrap .titleBox {position: relative;top: -3em;left: 12vw;z-index: 10;}
.mPartnerWrap .titleBox h2 {font-size: 4rem;font-weight: 500;margin: 0;}
.mPartner .swiper-slide a{width: 100%;height: 140px;border: 1px solid #dadada;display: flex;justify-content: center;align-items: center;border-radius: 15px;}

.mPartner-prev { left: 3vw; }
.mPartner-next { right: 3vw; }
.mPartner-prev::after,
.mPartner-next::after {display: none !important;}

.mPartnerMarquee {position: relative;width: 100%;overflow: hidden;padding: 80px 0;}
.marquee-track {display: flex;gap: 20px;white-space: nowrap;}
.marquee-item {flex: 0 0 auto;width: 305px;height: 140px;display: flex;border-radius: 15px;align-items: center;justify-content: center;background: #fff;position: relative;z-index: 1;}.marquee-item img {width: 100%;height: auto;object-fit: none;position: relative;z-index: -1;}
.marquee-item a{width: 305px;height: 140px;display: flex;border: 1px solid #dadada;border-radius: 15px;justify-content: center;}
.marquee-btn {position: absolute;top: 50%;transform: translateY(-50%);z-index: 10;width: 50px;height: 50px;border-radius: 50%;background: rgba(255,255,255,0.9);border:1px solid #ddd;font-size:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;user-select:none;}
.marquee-prev { left: 3vw; }
.marquee-next { right: 3vw; }

/*
===============================================
animation
===============================================
*/

@keyframes growLine {
	0% {transform: scaleY(0);	opacity: 1;}
	80% {transform: scaleY(1);opacity: 1;}
	100% {transform: scaleY(1);opacity: 0;}
}
@keyframes scrollDown {
	0% {opacity: 0.6;transform: translateY(-2px);}
	50% {opacity: 1;transform: translateY(2px);}
	100% {opacity: 0.6;transform: translateY(-2px);}
}

@keyframes txtUp {
	0% {transform: translateY(50px);opacity: 0;}
	100% {transform: translateY(0);opacity: 1;}
  }

@keyframes btnDown {
	0%{transform: translateY(-50px);opacity: 0;}
	100% {transform: translateY(0);opacity: 1;}
  }

@keyframes expandLeft {
	0%{transform: scaleX(0);opacity: 0.4;}
	100% {transform: scaleX(1);opacity: 1;}
  }


/*
===============================================
¹ÝÀÀÇü css
===============================================
*/

@media all and (min-width:1921px){

	.mVis-inner {max-width: 1920px;margin: 0 auto;}
	.mBan {max-width: 1920px;margin: 0 auto;}

	#mReWrap .mReWrapCon {max-width: 1920px;}
	.mResearch::after {left: calc(50% - 14%);}

}

@media all and (max-width:1900px){

	.visualSlide .swiper-slide .imgBox {width: 840px;height: 563px;}
	.visualSlide .swiper-slide .txtBox {width: calc(840px - 5em);}
	.visTxt,
	.visualSlide .control {margin-left: 4.8%;}

}

@media all and (max-width:1700px){

	.visualSlide .swiper-slide .imgBox {width: 790px;height: 529px;}
	.visualSlide .swiper-slide .txtBox {width: calc(790px - 5em);}
	.visTxt .sTxt2,
	.visTxt .sTxt2 span{font-size: 3.5rem;}
	.visTxt, 
	.visualSlide .control {margin-left: 12%;}
	.visTxt {top: 34%;}

	.mBan .titleBox h2 {font-size: 3rem;}
	.mBan .titleBox p {font-size: 1.25rem;width: 45%;}
	.cardBanContainer {margin-top: 8rem;}
	.cardBan .cardBanCon h3 {font-size: 2rem;}

	#mReWrap .mReWrapCon {gap: 120px;}
	.mResearch::after {left: calc(50% - 14%);}
	.mReLeftWrap {width: 480px;}

}

@media all and (max-width:1460px){

	.mVis-inner {padding: 8em 0 1em;}
	.visTxt {position: static;width: 100%;margin-left: 0;text-align: center;margin-bottom: 3em;}
	.visTxt .sTxt2 br{display:none;}
	.visualSlide{width: 100%;}
	.visualSlide .swiper-slide a {display: block;width: 100%;}
	.visualSlide .swiper-slide .imgBox {width: 100%;height: 100%;max-height: 883px;}
	.visualSlide .swiper-slide .txtBox {width: calc(100% - 5em);}
	.visualSlide .control {margin-left: 0;left: 2em;}
	.visualSlide .control .swiper-pagination .swiper-pagination-current {color: #ffffff;}
	.mVisual .scroll {right: -12px;bottom: 3em;}
	
	.mBan .titleBox p {width: 60%;position: sticky;margin-top: 2em;}
	.cardBanContainer {gap: 0.5rem;}
	.cardBan {min-width: 300px;}

	#mReWrap .mReWrapCon {gap: 60px;}
	.mReRight {gap: 3em 2em;}
	.mResearch::after{display:none;}
	.mReLeftWrap {width: 300px;}
	.mReLeft-inner { margin-left: 0;}
	.mCon2 {padding: 5em 0;}
	.section-label span {font-size: 1rem;top: 2em;}
	#mReWrap {padding: 8em 0 3em;}
	.mReLeft h2 {font-size: 4rem;}
	.mReLeftWrap {width: 100%;}
	.mReLeft {flex: 0 0 35%;position: relative !important;top: auto !important;left: auto !important;transform: none !important;}
	.mReLeft-inner {position: static !important; /* sticky ÇØÁ¦ */top: auto !important;margin-left: 0;text-align: left;margin-bottom: 2em;}
	#mReWrap .mReWrapCon {gap: 75px;flex-direction: column;}
	.mReLeft p {margin-bottom: 2em; }
	.mReRight {width: 100%;grid-template-columns: repeat(2, 1fr);margin-top: 0;gap: 2em;}
	.mReRight .rCard:nth-child(2n){top: 0;}

	.mCon3 {padding: 5em 0;}
	.newsWrap .titleBox h2 {font-size: 4.5rem;}
	.newsSwiper {margin-top: 2em;}
	.newsCard h3 {font-size: 1.5rem;}

	.moReBtn{display: flex;justify-content: center;width: 100%;margin-top: 6em;}
	.moReBtn .readmoreBtn{width: 170px;height: 170px;border-radius: 50%;display: flex;justify-content: center;align-items: center;background: #197BAE;position: relative;overflow: hidden; transition: background 0.4s ease; }
	.moReBtn .readmoreBtn:hover::before{width: 170px;height: 170px;margin-right: 0;border-radius: 50%;transform: scaleX(1);    background: linear-gradient(135deg, #00bcd4, #197BAE);}
	.moReBtn .readmoreBtn .text{font-size: 1.25rem;padding-left: 0;}
	.moReBtn .readmoreBtn .icon{display: none;}
	#mReWrap {flex-direction: column;}

}

@media all and (max-width:1120px){

}

@media all and (max-width:1024px){

	.mCon1 {height: 100%;padding: 7em 0;}
	.mCon1::after{height:100%;}

	.newsWrap {padding: 15em 0 8em;}
	.newsWrap .titleBox {left: 3%;width: calc(100% - 3%);}
	.newsSwiper {padding: 0 3%;}

	.mPartnerWrap .titleBox {left: 3%;}
	.mPartnerWrap .titleBox h2 {font-size: 3rem;}
	.mPartnerMarquee {padding: 20px 0;}
	.marquee-item{width:260px;height:110px;text-align:center;}
	.marquee-item img{width:70%;}

}

@media all and (max-width:830px){

	.visTxt .sTxt2, 
	.visTxt .sTxt2 span {font-size: 2.5rem;}

	.mReRight {gap: 1em;}

}

@media all and (max-width:768px){

	.visualSlide .swiper-slide .txtBox {width: calc(100% - 3em);padding: 1.3em 1.5em;}

}

@media all and (max-width:640px){
	
	.visualSlide .swiper-slide .txtBox {font-size: 1.125rem;}
	.visualSlide .control{bottom: 3px;left: 0;}
	.visualSlide .control .swiper-pagination .swiper-pagination-current {color: var(--black-color);}
	.visualSlide .swiper-slide .imgBox::before {height: 70px;}

	.visTxt .sTxt2, 
	.visTxt .sTxt2 span {font-size: 2rem;}	
	.visTxt .sTxt1:after{width: 25px;height: 20px;background-size: cover;}
	.mVis-inner {padding: 6em 0 2.5em;}
	.mVisual:after {top: -12em;}
	.mVisual .scroll {right: -8px;bottom: 4em;}

	.mBan .titleBox h2 {font-size: 2rem;}
	.mBan .titleBox p {width: 100%;}
	.cardBanContainer {margin-top: 4rem;}

	.mReRight {grid-template-columns: 1fr; gap: 2em;}
	.mReRight .rCard {max-width: 100%;}
	.mReLeft h2 {font-size: 3rem;}
	.mReLeft p {font-size: 1.125rem;}

	.newsWrap{padding: 10em 3%;}
	.newsSwiper-prev{left: 1vw;}
	.newsSwiper-next {right: 7vw;}
	.newsWrap .titleBox h2 {font-size: 4rem;}
	.newsSwiper {padding: 0;margin-top: 0;}
	.newsSwiper-slide {width: calc(100% - 29px) !important;}
	.newsCard {min-width: auto;}

	.mPartnerWrap {margin-top: -2em;}
	.mPartnerWrap .titleBox h2 {font-size: 2.5rem;}

	.visTxt {text-align: left;}
	.visTxt .sTxt1 {margin-left: 0;}
	.mCon1 {padding: 5em 0;background-attachment: inherit;background-position: 20%;}

	.moReBtn {margin-top: 3em;}
	.moReBtn .readmoreBtn {width: 130px;height: 130px;}
	.moReBtn .readmoreBtn .text {font-size: 1.1rem;}
	.mCon2 {padding: 5em 0 0;}

	.cardBan::before{opacity: 1;}
	.cardBan .cardBanCon .banBtn .text {opacity: 0;}
	.cardBan .cardBanCon .banBtn .icon {background: var(--main-color);}
	.cardBan:hover .banBtn .icon::before {color: #fff}

	.newsWrap .titleBox {top: 50px;}
	.newsWrap .titleBox h2 {font-size: 3rem;}
	.newsWrap .titleBox .readmoreBtn {right: 8%;top: 8px;width: 52px;height: 52px;}
	.newsWrap .titleBox .readmoreBtn:hover::before,
	.newsWrap .titleBox .readmoreBtn .text{display:none;}

	#mReWrap {padding: 3em 0;}
}

@media all and (max-width:480px){

	.visTxt .sTxt2, 
	.visTxt .sTxt2 span {font-size: 1.8rem;}
	.mVisual .scroll{display: none;}

  .readmoreBtn { width: 215px;height: 53px; }
  .mReRight .txtBox h3 { font-size: 1.2rem; }


}