/*---common css---*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

:root {
	/*color*/

	--color-basic:#fff;

	/*font-size*/
	--font-size-13: 0.813rem;
	--font-size-14: 0.875rem;
	--font-size-16: 1rem; 
	--font-size-17: 1.0625rem; 
	--font-size-18: 1.125rem;
	--font-size-19: 1.188rem;
	--font-size-20: 1.25rem; 
	--font-size-21: 1.313rem;
	--font-size-22: 1.375rem; 
	--font-size-23: 1.438rem; 
	--font-size-24: 1.5rem; 
	--font-size-25: 1.563rem; 
	--font-size-26: 1.625rem;
	--font-size-27: 1.688rem; 
	--font-size-28: 1.75rem; 
	--font-size-30: 1.875rem; 
	--font-size-31: 1.938rem; 
	--font-size-32: 2rem; 
	--font-size-34: 2.125rem; 
	--font-size-35: 2.188rem; 
	--font-size-36: 2.25rem; 
	--font-size-37: 2.313rem; 
	--font-size-38: 2.375rem; 	
	--font-size-40: 2.5rem; 	
	--font-size-42: 2.625rem; 
	--font-size-43: 2.688rem; 
	--font-size-45: 2.813rem; 
	--font-size-48: 3rem; 
	--font-size-50: 3.125rem;
	--font-size-55: 3.438rem;
	--font-size-58: 3.625rem;
	--font-size-60: 3.75rem;
	--font-size-70: 4.375rem;
	--font-size-72: 4.5rem;
	--font-size-80: 5rem;
	--font-size-85: 5.313rem;
	--font-size-90: 5.625rem;
	--font-size-100: 6.25rem;
	--font-size-120: 7.5rem;

	/*font-weight*/
	--font-t: 100;
	--font-l: 300;
	--font-r: 400;
	--font-m: 500;
	--font-sb: 600;
	--font-b: bold;
	--font-eb: 800;
	--font-bl: 900;
}

/*--- font size ---*/
.fs_13{font-size: var(--font-size-13);}
.fs_14{font-size: var(--font-size-14);}
.fs_16{font-size: var(--font-size-16);} 
.fs_17{font-size: var(--font-size-17);} 
.fs_18{font-size: var(--font-size-18);}
.fs_19{font-size: var(--font-size-19);}
.fs_20{font-size: var(--font-size-20);}
.fs_21{font-size: var(--font-size-21);}
.fs_22{font-size: var(--font-size-22);}
.fs_23{font-size: var(--font-size-23);}
.fs_24{font-size: var(--font-size-24);}
.fs_25{font-size: var(--font-size-25);}
.fs_26{font-size: var(--font-size-26);}
.fs_27{font-size: var(--font-size-27);} 
.fs_28{font-size: var(--font-size-28);} 
.fs_30{font-size: var(--font-size-30);} 
.fs_31{font-size: var(--font-size-31);}
.fs_32{font-size: var(--font-size-32);}
.fs_34{font-size: var(--font-size-34);}
.fs_35{font-size: var(--font-size-35);}
.fs_36{font-size: var(--font-size-36);}
.fs_37{font-size: var(--font-size-37);}
.fs_38{font-size: var(--font-size-38);}
.fs_40{font-size: var(--font-size-40);}
.fs_42{font-size: var(--font-size-42);}
.fs_43{font-size: var(--font-size-43);}
.fs_45{font-size: var(--font-size-45);}
.fs_48{font-size: var(--font-size-48);}
.fs_50{font-size: var(--font-size-50);}
.fs_55{font-size: var(--font-size-55);}
.fs_58{font-size: var(--font-size-58);}
.fs_60{font-size: var(--font-size-60);}
.fs_70{font-size: var(--font-size-70);}
.fs_72{font-size: var(--font-size-72);}
.fs_80{font-size: var(--font-size-80);}
.fs_85{font-size: var(--font-size-85);}
.fs_90{font-size: var(--font-size-90);}
.fs_100{font-size: var(--font-size-100);}
.fs_120{font-size: var(--font-size-120);}

@media screen and (max-width:1480px){

}

@media screen and (max-width:767px){
.fs_90 {font-size:35px;}
.fs_55 {font-size:22px;}
.fs_45 {font-size:18px;}
.fs_40 {font-size:18px;}
.fs_22 {font-size:16px;}
.fs_20 {font-size:16px;}
}



/*--- font weight ---*/

.font_t{font-weight: var(--font-t);}
.font_l{font-weight: var(--font-l);}
.font_r{font-weight: var(--font-r);}
.font_m{font-weight: var(--font-m);}
.font_sb{font-weight: var(--font-sb);}
.font_b{font-weight: var(--font-b);}
.font_eb{font-weight: var(--font-eb);}
.font_bl{font-weight: var(--font-bl);}


/*--- common ---*/
.texc {text-align:center;}
.basic_c {color:var(--color-basic);}
.j_inner {max-width:1480px; margin:0 auto; width:92%;}
.j_inner02 {max-width:1600px; margin:0 auto; width:92%;}
.mainDesc {text-align:center;}
.mainDesc h4 {color:#0062ff;}
.mainDesc h2 {margin-top:34px;}
.msPd {padding:150px 0;}
.wb {word-break:keep-all;}
.main_inner {max-width:1480px; margin:0 auto; width:92%; height:100%; position:relative;}
.j_eng {  font-family: "Outfit", sans-serif;font-optical-sizing: auto;font-style: normal;}
.j_color {color:#0062ff;}

@media screen and (max-width:1480px){
.msPd {padding:120px 0;}
}

@media screen and (max-width:1020px){
.msPd {padding:100px 0;}
}

@media screen and (max-width:767px){
.msPd {padding:80px 0;}
}

/*--- sideNav ---*/

.sideNav {position:fixed;left:22px;top:50%;transform:translateY(-50%) translateX(-20px);z-index:90;color:#fff;opacity:0;pointer-events:none;transition:opacity 0.5s ease, transform 0.5s ease, color 0.3s ease;}
.sideNav.show {opacity:1;transform:translateY(-50%) translateX(0);pointer-events:auto;}
.sideNav.white {color:#fff;transition:color 0.5s ease;}
.sideNav.white i {background-color:#fff;border-color:#fff;transition:background-color 0.5s ease,border-color 0.5s ease;}
.sideNav.black {color:#000;transition:color 0.5s ease;}
.sideNav.black i {background-color:#000;border-color:#000;transition:background-color 0.5s ease,border-color 0.5s ease;}
.sideNavItem {margin-top:17px;}
.sideNavItem a {display:flex;gap:12px;align-items:center;position:relative;color:inherit;}
.sideNavItem i {display:block;width:7px;height:7px;border-radius:7px;border:1px solid;flex-shrink:0;background-color:transparent;}
.sideNavItem a span {opacity:0;transform:translateX(-10px);transition:all 0.3s ease;}
.sideNavItem.on a span {opacity:1;transform:translateX(0);}


@media screen and (max-width:720px){
.sideNav {display:none;}
}


/*--- 헤더 ---*/
#j_header {position:fixed; left:0; top:0; width:100%; height:100px; z-index:99; transition:0.28s;}
#j_header.active {background:#000;}
.hd_logo {display:block; z-index:90;}
.hd_logo img {width:100%;}
.hdInner {max-width:1600px; width:92%; height:100%; margin:0 auto; display:flex; align-items:center; justify-content:space-between;}
.hdInner > .j_gnb {display:flex; align-items:center; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50% , -50%); max-width:560px; width:100%; }

.hdInner > .j_gnb > li > a {display:block; color:#fff; font-size:var(--font-size-18); font-weight:500; margin:0 31px; transition:0.28s; }
.hdInner > .j_gnb > li > a:hover {color:#145ce5;}
.hdInner > .j_gnb > li:first-child > a {margin-left:0;}
.hdInner > .j_gnb > li:last-child > a {margin-right:0;}


.allGnb {position:relative; width:37px; height:20px;}
.allGnb span {display:block;position: absolute; height: 2px; top: 50%; background:#fff; transform: translateY(-50%);}
.allGnb span:nth-of-type(1) {width:100%; transform: translateY(6px);}
.allGnb span:nth-of-type(2) {width:80%; right:0;}
.allGnb span:nth-of-type(3) {width:100%; transform: translateY(-8px);}

.utilBox {display:flex; align-items:center; gap:33px; z-index:90;}
.langBox {position:relative; cursor:pointer;}
.langDepth02 {position:absolute; top:35px; left:-17px; width:100%; width:61px;border-radius:10px; background: rgba(0, 0, 0, 0.6); padding:14px 0; display:none; }
.langDepth02 > li {text-align:center;}
.langDepth02 > li + li {margin-top:10px;}


nav .j_gnb {list-style: none;margin: 0;padding: 0;visibilty: hidden;transition: all 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;opacity: 0;display: flex;flex-direction: row;    -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);  -moz-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);-ms-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);-o-transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);transition: all 0.8s cubic-bezier(0.77, 0, 0.175, 1);}
nav .j_gnb li {    padding: 0 20px;  visibility: hidden;    transition: all 0.4s;  -webkit-transition: all 0.4s;  -moz-transition: all 0.4s;  -ms-transition: all 0.4s;  -o-transition: all 0.4s;}
nav .j_gnb li:hover {opacity:1; transform: scale(1.1, 1.1);}
nav .j_gnb li:hover a {  font-weight:700;}
.menu--open > nav .j_gnb li.nav__item--hover {opacity:0.25;}

.full-menu {position: fixed;top:0;width: 100%;height:0;display: flex;justify-content: center;align-items: center;transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -webkit-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -moz-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -ms-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -o-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;}   
.full-menu:before, .full-menu:after{content: '';  height: 0;position: fixed;top:0; width: 100%;height: 0;}
.full-menu:before{z-index: -2;  background-color:#3b3b3b;transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -webkit-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -moz-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -ms-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -o-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;} 
.full-menu:after{z-index: -1;  background-color:#000;transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -webkit-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -moz-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -ms-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;  -o-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) ;}

.menu--open:before, .menu--open:after{height: 100%;}
.menu--open:before{    transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1);  -webkit-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1);  -moz-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1);  -ms-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1);  -o-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1);} 
.menu--open:after{    transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -webkit-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -moz-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -ms-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -o-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;}
.menu--open{  height:100%;  transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -webkit-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -moz-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -ms-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -o-transition: height 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;}
.menu--open > nav .j_gnb {  visibilty: visible;  opacity: 1;  -webkit-transition: all 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -moz-transition: all 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -ms-transition: all 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  -o-transition: all 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;  transition: all 0.9s cubic-bezier(0.77, 0, 0.175, 1) 0.3s;}
.menu--open > nav .j_gnb li {  visibility: visible;}
nav .j_gnb li a {    text-decoration: none;    color: #fff; font-weight:600;    font-size: 40px;  letter-spacing: 1px;}


@media screen and (max-width:1090px){
.hdInner > .j_gnb {display:none;}
  nav .j_gnb {    flex-direction:column;    text-align:center;  }
  nav .j_gnb li{    padding:8px 0;  }
  }


@media screen and (max-width:767px){
#j_header {height:60px;}
.hd_logo {width:30%;}
.utilBox {gap:15px;}
.allGnb {width:20px;}
}


@media screen and (max-width:480px){
  nav .j_gnb li a{    font-size:26px;  }
}


/*--- 메인비주얼 ---*/
#mainVisual {width:100%; height:100vh;}
.mv.mv01 {background:url(/img/main/mv01.jpg) no-repeat center / cover; width:100%; height:100%;}
.mv.mv02 {background:url(/img/main/mv02.jpg) no-repeat center / cover; width:100%; height:100%;}
.mv.mv03 {background:url(/img/main/mv03.jpg) no-repeat center / cover; width:100%; height:100%;}
.mv .mvDescBox {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); text-align:center; width:100%;}
.mv .mvDescBox h2 {opacity: 0; animation-duration: 1s; animation-timing-function: ease; animation-fill-mode: both; animation-name: fadeOut;  animation-delay: 0.1s;}
.mv .mvDescBox p {line-height:1.36em; margin-top:45px; opacity: 0; animation-duration: 1s; animation-timing-function: ease; animation-fill-mode: both; animation-name: fadeOut;  animation-delay: 0.3s;}

.mv.on .mvDescBox h2 {opacity: 1;animation-name: fadeIn; animation-delay: 0.1s}
.mv.on .mvDescBox p {opacity: 1; animation-name: fadeIn; animation-delay: 0.3s;}

.mvPage {position: absolute; width: 168px;left: 50%; height: 20px;bottom: 20%; transform:translateX(-50%); z-index:10;}
.mvPage .page_num {display:flex; align-items:center; gap:15px; left:auto; bottom: auto;}
.mvPage .page_num span {display:block;    letter-spacing: 0.01em; width:20px;}
.mvPage .page_num span.mainLine {position:relative; display:block; width:100px; background:rgba(255,255,255, 0.4); height:2px; overflow:hidden;}
.mvPage .page_num .mainLine .progress {    position: absolute;    width: 0;    height: 100%;    background: #fff;    left: 0;    top: 0;}

.swiper-button-next.mvNext {background: url(/img/icon/mvNext.png) no-repeat center / cover; width:19px; height:34px; right:220px;}
.swiper-button-prev.mvPrev {background: url(/img/icon/mvPrev.png) no-repeat center / cover; width:19px; height:34px; left:220px;}
.swiper-button-next::after,.swiper-button-prev::after {  display: none;}


@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}


.scrollBox {position: absolute; bottom: 20px;    left: 50%;    transform: translate(-50%);z-index:10;}
.scrollBox p {color:#fff; letter-spacing:0em; margin-top:20px;}
.scroll-downs {}
.mousey {margin:0 auto ;width: 14px;  height: 20px;  border: 1px solid #fff;  border-radius: 7px;   box-sizing: content-box; position:relative;}
.scroller {position:absolute; left:5px; width: 4px;height: 4px;  border-radius: 50%;  background-color: #fff;  animation-name: scroll;  animation-duration: 2.2s;  animation-timing-function: cubic-bezier(.15,.41,.69,.94);  animation-iteration-count: infinite;}

@keyframes scroll {
  0% { opacity: 0; }
  10% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(15px); opacity: 0; }
}

@media screen and (max-width:1380px){
.mvNav {display:none;}
}

@media screen and (max-width:1090px){

}

@media screen and (max-width:767px){

}


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

}


/*--- ms01 ---*/
#ms01 {background:url(/img/main/ms01_bg.png) no-repeat center /cover; width:100%;}
.ms01Tabs {max-width:600px; margin:0 auto; display:flex; border-radius:30px; border:1px solid #e0e0e0; overflow:hidden; margin-top:48px;}
.ms01Tabs li.current {background:#000; color:rgba(255,255,255, .9);  border-radius:30px;}
.ms01Tabs li {width:100%; font-size:var(--font-size-30); font-weight:600; color:rgba(0,0,0, .8); text-align:center; padding:18px; cursor:pointer; box-sizing:border-box; font-family: "Outfit", sans-serif; }

.tab-content{display: none; margin-top:30px;}
.tab-content.current{display: inherit;}
.ms01Item {display:flex; align-items:center;}
.ms01Item figure {border-radius:100px; overflow:hidden; width:calc(100% - 803px);}
.ms01Item figure img {width:100%;}
.ms01Desc { padding-left:122px;width:803px;}
.ms01Desc p {word-break:keep-all;}
.msTabContent {position:relative;}
.ms01Swiper {padding: 0 100px;}

.mt10 {margin-top:10px;}
.mt30 {margin-top:30px;}
.mt50 {margin-top:50px;}
.ms01Btn {display:flex; gap:10px; align-items:center;}
.ms01Btn i img {display:block;}

.swiper-button-next.ms01Next {background: url(/img/icon/ms01Next.png) no-repeat center / cover; width:50px; height:50px;}
.swiper-button-prev.ms01Prev {background: url(/img/icon/ms01Prev.png) no-repeat center / cover; width:50px; height:50px;}

@media screen and (max-width:1480px){
.ms01Swiper {padding:0 50px;}
.ms01Desc {padding-left:80px;}
}

@media screen and (max-width:1420px){
.ms01Item {flex-wrap:Wrap;}
.ms01Item figure {border-radius:100px; overflow:hidden; width:100%; max-width:520px; margin:0 auto;}
.ms01Desc { padding-left:0px;width:100%; margin-top:20px; text-align:center;}
.ms01Btn {justify-content:center;}
}


@media screen and (max-width:1020px){
.ms01Swiper {padding:0;}
}

@media screen and (max-width:767px){

.swiper-button-next.ms01Next {width:35px; height:35px;}
.swiper-button-prev.ms01Prev { width:35px; height:35px;}
.ms01Tabs li {padding:5px; font-size:12px;}
}


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

}




/*--- ms02 ---*/

#ms02 {  background-image: url(/img/main/ms02_bg.jpg);  background-size: cover;  background-position: center;  background-attachment: fixed; /* 패럴랙스 효과 핵심 */  width: 100%;  overflow: hidden;  position: relative;}
.ms02Desc h4{color:rgba(255,255,255, .5);}
.ms02Desc h2 {color:#fff; margin-top:30px;}

.ms02Btn {display:flex; gap:10px; align-items:center;}
.ms02Btn i img {display:block;}

.ms02ContentBox {display:flex; align-items: flex-start; /* 중요: 높이를 기준으로 정렬되게 */}
.ms02Lt {width:50%; position:relative;}
.ms02Rt {width:50%; position:relative;}

.ms02List {box-sizing:border-box; font-size:0; }
.ms02Item { display:inline-block; vertical-align:top; border-radius:20px; width:calc((100% - 45px)/2); margin-right:45px; overflow:hidden; position:relative; cursor:pointer; } /* 기본 카드 스타일 */
.ms02Item img { width:100%; transition:0.28s;} /* 이미지 블러 + 밝기 */
.ms02Item:hover img {    filter: blur(10px);}
.ms02Item::after { content:''; position:absolute; bottom:0; left:0; width:100%; height:100%; background-color:rgba(0,98,255,0.5); transform:translateY(100%); transition:transform 0.5s ease; z-index:1; } /* 파란 배경 슬라이드용 */
.ms02Item:hover::after { transform:translateY(0); } /* hover 시 배경 위로 올라옴 */
.ms02TxtBox { position:absolute; padding:0 35px; bottom:80px; width:100%; z-index:3; transition:transform 0.5s ease; } /* 텍스트 박스 기본 위치 */
.ms02Item:hover .ms02TxtBox { transform:translateY(-75px); } /* hover 시 텍스트 살짝 위로 이동 */
.ms02Txt { width:100%; word-break:keep-all; color:white; } /* 텍스트 영역 스타일 */
.ms02Txt h4 { color:rgba(255,255,255,0.5); margin-top:20px; } /* 서브텍스트 스타일 */
.ms02NumBox { width:100%; left:39px; top:39px; position:absolute; z-index:10; } /* 넘버 위치 */
.ms02hoverBox { position:absolute; bottom:0; left:0; width:100%; transform:translateY(100%); opacity:0; transition:transform 0.5s ease, opacity 0.5s ease; z-index:2; padding:0 35px; } /* hoverBox 숨겨진 상태 */
.ms02Item:hover .ms02hoverBox { transform:translateY(-70px); opacity:1; } /* hover 시 hoverBox 위로 슬라이드 인 */
.ms02hoverBox p { color:rgba(255,255,255,0.9); line-height:1.5em; margin:0; word-break:keep-all; } /* hoverBox 안 텍스트 스타일 */
.ms02Item:nth-of-type(2n) { margin-right:0; margin-top:90px; } /* 짝수 번째 마진 조정 */


@media screen and (max-width:1620px){
.ms02Item { width:calc((100% - 25px)/2); margin-right:25px;}
.ms02NumBox {left:20px; top:20px;}
.ms02TxtBox {padding:0 20px;}
.ms02hoverBox  {padding:0 20px;}
}

@media screen and (max-width:1080px){
.ms02NumBox h3 {font-size:40px;}
.ms02Desc h2 {font-size:25px;}
.ms02Txt h2 {font-size:18px;}
.ms02NumBox {left:10px; top:10px;}
.ms02Txt  {left:10px; bottom:30px;}
.ms02hoverBox p {font-size:14px;}
.ms02NumBox {left:10px; top:10px;}
.ms02TxtBox {padding:0 10px;}
.ms02hoverBox  {padding:0 10px;}
.ms02Item:hover .ms02TxtBox { transform:translateY(-45px); } /* hover 시 텍스트 살짝 위로 이동 */
.ms02Item:hover .ms02hoverBox { transform:translateY(-45px); opacity:1; } /* hover 시 hoverBox 위로 슬라이드 인 */
}

@media screen and (max-width:920px){

.ms02ContentBox {flex-wrap:wrap;}
.ms02Lt {width:100%;}
.ms02Rt {width:100%; position:relative; margin-top:20px;}
.ms02Item:nth-of-type(2n) {margin-right:0; margin-top:0px;}
.ms02Item:nth-of-type(n + 3) {margin-top:25px;} 
}


@media screen and (max-width:720px){
.ms02Item { width:100%; margin-right:0;}
.ms02Item:nth-of-type(n + 2) {margin-top:25px;} 
.ms02Item {height:300px;}
.ms02TxtBox {bottom:50px;}
.ms02Item:hover .ms02hoverBox { transform:translateY(-32px);} 
}


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

}




/*-- ms03 ---*/

#ms03 .mainDesc p {color:rgba(51,51,51, 0.9); line-height:1.5em;}

.ms03BotSlide {position:relative; background-color:#fff; overflow:hidden; height:58px;}
.ms03BotSlide .ms03wrap{height:100%; display:flex; align-items:center; position:absolute; left:0; top:0; animation-name:logo_motion; animation-duration:25s; animation-timing-function:linear; animation-iteration-count: infinite;}
.ms03BotSlide .ms03wrapimg{display:block; margin-right:30px; }

.ms03BotSlide.msbot02 .ms03wrap {animation-name:logo_motion02;}


.mt100 {margin-top:100px;}

@keyframes logo_motion{ 
	0%{left:0;}	
	100%{left:-100%;}	
}


@keyframes logo_motion02{ 
	0%{left:-100%;}	
	100%{left:0;}	
}
@media screen and (max-width:720px){
.ms03BotSlide {width: 1000px;}

}

/*--- ms04 ---*/

#ms04 {background:url(/img/main/ms04_bg.jpg) no-repeat center /cover; width:100%;}
.ms04Desc {text-align:center;}
.ms04Desc h2 {margin-top:35px;}
.ms04Btn {display:flex;; align-items:center; border-radius:30px; width:200px; height:60px; line-height:60px; background:#0062ff; text-align:Center; justify-content:center; gap:35px; margin:42px auto 0 auto;}

@media screen and (max-width:720px){
.ms04Btn {    width: 150px;height: 35px;line-height: 35px;}
.mt100 {margin-top:50px;}
}



/*--- footer ---*/
.j_footer {background:#000; padding:74px 0;}
.ftInner {max-width:1480px; width:92%; margin:0 auto;}
.ftWrap {display:flex; justify-content:space-between;}
.ftLt p {color:rgba(255,255,255, 0.7); font-size:15px; font-weight:400; margin-top:40px; line-height:1.66em;}
.ftLt p i {margin-left:22px;}
.ml0 {margin-left:0 !important;}
.ftRt ul li + li {margin-top:20px;}
.ftRt ul li a {display:block; color:rgba(255,255,255, 0.6); transition:0.28s;}
.ftRt ul li a:hover {color:rgba(255,255,255, 1);}
.ftline {position:Relative;}
.ftline::after {content:''; position:absolute; width:1px; height:12px; background:rgba(87,87,87, 0.7); left:-13px; top:50%; transform:translateY(-50%); }

.ftLogo {display:block}
.ftLogo img {max-width:100%;}
@media screen and (max-width:920px){
.ftWrap {flex-wrap:Wrap;}
.ftLt {width:100%;}
.ftRt {width:100%; margin-top:20px;}
.ftRt ul {display:flex; justify-content: flex-end; gap:10px;}
.ftRt ul li + li {margin-top:0;}
}
.ft_br {display:none;}

@media screen and (max-width:790px){
.j_footer {background:#000; padding:30px 0;} 
.ml02 {margin-left:0 !important;}
.ft_br {display:block;}
.ftline::after{display:none;}
.ftLt p  {font-size:12px; margin-top:20px;}
.ftLt p i{margin-left:10px;}
.ftRt ul {gap:10px;}
.ftLt .copy_p {font-size:11px;}
.ftLogo  {width:30%;}
}

/* add_pop */
.add_pop_wrap {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.7);z-index: 9999;display: none;}
.add_pop_wrap *{color: #fff;}
.add_pop_inner{position: absolute;top: 50%;left: 50%;width: 94%;max-width: 800px;height: 600px;border-radius: 15px;overflow: hidden;transform: translate(-50%,-50%) scale(.9);transition: transform .3s ease;}
#add_wrap_02 .add_pop_inner{height: 600px;}
.add_pop_wrap.active .add_pop_inner{transform: translate(-50%,-50%) scale(1);}

.add_pop_tit{background: #0062ff;color: #FFF;display: flex;flex-direction: row;align-items: center;justify-content: space-between;padding: 0 25px;}
.add_pop_close{width: 20px;height: 60px;position: relative;}
.add_pop_close span{position: absolute;top: 29px;left: 0;width: 20px;height: 2px;background: #fff;z-index: 1;transition: transform .3s ease; }
.add_pop_close span:nth-child(1){transform: rotate(45deg);}
.add_pop_close span:nth-child(2){transform: rotate(-45deg);}

.add_pop_close:hover span{transform: rotate(0);}

.add_pop_con{background: #FFF;padding: 22px 25px;overflow-y: scroll;height: calc( 100% - 60px );}
.add_pop_con h5{font-size: 1rem;font-weight: bold;margin-bottom: 10px; color:#000;}
.add_pop_con p{font-size: 14px;line-height: 160%;margin-bottom: 25px; color:#000;}


@media (max-width: 780px){ 
	.add_pop_con p{font-size: 12px;}
}