/*---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=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');
: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-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);}

.font_bs {color:var(--color-basic);}
/*font weight*/
.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);}



@media screen and (max-width:1020px){
.fs_50 {font-size:30px;}

}

@media screen and (max-width:720px){
.fs_30 {font-size:18px;}
.fs_50{font-size:25px;} 
.fs_70{font-size:25px;}

}

/*--- common ---*/

.j_inner {max-width:1520px; width:92%; margin:0 auto;}
.com_pd {padding:150px 0;}
.point_c {color:#ed7845;}

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

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

/*text-motion*/
.j_motion.common_motion{transform: translateY(25px);opacity: 0;transition: transform .8s ease, opacity .4s;}
.j_motion.common_motion.on {transform: translateY(0);opacity: 1;}

/* 위에서 아래 */
.j_motion.top_to_bottom { transform: translateY(-25px); }
.j_motion.top_to_bottom.on { transform: translateY(0); opacity: 1; }

/* 아래에서 위 */
.j_motion.bottom_to_top { transform: translateY(25px); }
.j_motion.bottom_to_top.on { transform: translateY(0); opacity: 1; }

/* 왼쪽에서 오른쪽 */
.j_motion.left_to_right { transform: translateX(-25px); }
.j_motion.left_to_right.on { transform: translateX(0); opacity: 1; }

/* 오른쪽에서 왼쪽 */
.j_motion.right_to_left { transform: translateX(25px); }
.j_motion.right_to_left.on { transform: translateX(0); opacity: 1; }

.j_delay_01{transition-delay: .2s !important;}
.j_delay_02{transition-delay: .4s !important;}
.j_delay_03{transition-delay: .6s !important;}
.j_delay_04{transition-delay: .8s !important;}
.j_delay_05{transition-delay: 1s !important;}
.j_delay_06{transition-delay: 1.2s !important;}


/*header*/
#j_header {height:100px; position:fixed; width:100%; z-index:99; transition:0.28s;}
#j_header.active {background:#fff;}
#j_header.active .hd_logo img{filter: brightness(0);}
#j_header.active .hd_wrap > .j_gnb > li > a {color:#000}
#j_header.active .mo_btn span {background:#000;}
#j_header .hd_wrap {display:flex; justify-content:space-between; max-width:1520px; width:92%; margin:0 auto; align-items:center; height:100%;}
#j_header .hd_logo {display:block;}
#j_header .hd_wrap > .j_gnb {display:flex; height:100%;}
#j_header .hd_wrap > .j_gnb > li {position:relative; height:100%;}
#j_header .hd_wrap > .j_gnb > li:first-child a {padding-left:0;}
#j_header .hd_wrap > .j_gnb > li:last-child a {padding-right:0;}
#j_header .hd_wrap > .j_gnb > li > a {padding:0 34px; display:block; height:100%; color:#fff; font-size:var(--font-size-18); transition:0.28s; line-height:100px;}
#j_header .hd_wrap > .j_gnb > li:hover > a{color:#ed7845}


.mo_btn {width:26px; height:21px; float:right; position:relative; display:none;}
.mo_btn span {display:block; background:#fff; width:100%; height:3px;position: absolute;}
.mo_btn span:nth-of-type(1) {transform:translateY(6px);}
.mo_btn span:nth-of-type(2) {transform:translateY(0px);}
.mo_btn span:nth-of-type(3) {transform:translateY(-6px);}

.mobile_wrap {position:fixed;  width:40%; height:100vh; top:0; right:0; padding:100px 20px; background:#fff;transition: transform 0.4s; transform:translateX(100%); box-shadow: 5px 20px 24px 0px rgba(0, 0, 0, 0.11); z-index:90;}
.mobile_wrap.on {transform:translateX(0);}
.mo_inner {height:100%}
.mo_inner > .j_gnb {height:100%; display: flex; height: 100%;  flex-direction: column; width: 100%; gap: 40px; }
.mo_inner > .j_gnb > li { word-break: keep-all; }
.mo_inner > .j_gnb > li > a {transition:0.28s; color:#000; font-family: 'SUIT-SemiBold'; font-size:14px;}
.mo_inner > .j_gnb > li:hover > a {color:#ed7845;}
.mo_inner > .j_gnb > li .depth02 {margin-top:10px;}
.mo_inner > .j_gnb > li .depth02 > li > a {font-family: 'SUIT-SemiBold'; font-size:12px; display:block; padding:5px 0; color:#b9b9b9;}
.mo_inner > .j_gnb > li .depth02 > li > a:hover {color:#ed7845;}

.close_btn {position:absolute; right:10px; top:10px; width: 30px; height: 30px;}
.close_btn span {background:#000; width:20px; height:2px;  display:block;  position:absolute; transform:translate(0);}
.close_btn span:nth-of-type(1) {transform: rotate(45deg);}
.close_btn span:nth-of-type(2) {transform: rotate(-45deg);}

.j_site_bg {position: fixed; left: 0; top: 0;width: 100%; height: 100%;  background-color: rgba(0, 0, 0, .8); display: none; z-index: 40;}
.j_site_bg.on {display:block;}


/*depth02*/
#j_header .hd_wrap > .j_gnb > li > .depth02 {padding:10px 5px;position:absolute; top:100%; left:50%; transform:translateX(-50%); background:rgba(255,255,255,0.2); width:150px; text-align:center; display:none;}
#j_header .hd_wrap > .j_gnb > li > .depth02 > li > a {padding:10px 0; display:block; color:#fff; font-family: 'SUIT-SemiBold'; transition:0.28s;}
#j_header .hd_wrap > .j_gnb > li > .depth02 > li > a:hover {color:#ed7845;}



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

}

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

}

@media screen and (max-width:767px){
#j_header .hd_wrap > .j_gnb > li {margin:0 15px;}
#j_header .hd_wrap > .j_gnb > li > a {padding:0 10px;}
.mo_inner > .j_gnb {gap:20px;}
}

@media screen and (max-width:720px){
#j_header .hd_wrap > .j_gnb {display:none;}
.mo_btn {display:block;} 
#j_header {height:70px;}
#j_header .hd_logo img {width:70%;}
.mo_btn {width:21px;}
}

/*main*/

.mainVisual {width:100%; height:100vh;}
.mv_inner {max-width:1520px; width:92%; margin:0 auto; height:100%; position:relative;}
.mvSwip {height:100%;}
.mvBg.mv_01 {background:url(/img/main/mv_bg01.jpg) no-repeat center / cover; width:100%; height:100%;}
.mvBg.mv_02 {background:url(/img/main/mv_bg02.jpg) no-repeat center / cover; width:100%; height:100%;}
.mvBg.mv_03 {background:url(/img/main/mv_bg03.jpg) no-repeat center / cover; width:100%; height:100%;}
.mvDescBox {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; text-align:Center;}
.mvDescBox h2 {margin-top:20px;}
.mvDescBox p {margin-top:26px;}
.mvDescBox h2 ,.mvDescBox p, .mv_img {color:#fff; text-align:center; transform: translateY(25px);opacity: 0;transition: transform 1s ease, opacity .6s;}
.mvBg.on .mvDescBox h2, .mvBg.on .mvDescBox p, .mvBg.on .mv_img {transform: translateY(0);opacity: 1;}

.swiper-button-next.mv_next {background: url(/img/icon/mv_next.png) no-repeat center / cover; width:15px; height:27px; right:0; top:auto; margin-top:0;}
.swiper-button-prev.mv_prev {background: url(/img/icon/mv_prev.png) no-repeat center / cover; width:15px; height:27px; left:0; top:auto; margin-top:0;}
.swiper-button-next::after,.swiper-button-prev::after {display: none;}

.mvNaviBox {position:absolute; display:flex; justify-content:space-between; width:92%; max-width:1520px; height:27px; top:50%; left:50%; transform:translate(-50%, -50%); z-index:11; }
.mv_img img {max-width:100%;}
/*scroll ani*/
.scroll__down {position:absolute; bottom:78px; left:50%; transform:translateX(-50%); z-index:10; display:flex; align-items:center; gap:14px;}
.scroll__mouse {position: relative;display: inline-block;width: 18px;height: 12px;border: 1px solid #fff;border-radius: 6px;}
.scroll__wheel {position: absolute;top: 50%;left: 3px;width: 4px;height: 4px;background-color: #ef6959;border-radius: 50%;animation: scrollDown 2.5s infinite ease-in-out; transform:translateY(-50%);}
.scroll__down p {color:#fff; letter-spacing:0.2em}

@keyframes scrollDown {
  0% {
    left: 3px;
    opacity: 0;
  }

  20% {
    left: 3px;
    opacity: 1;
  }

  50% {
    left: 10px;
    opacity: 1;
  }

  80% {
    left: 10px;
    opacity: 0;
  }

  100% {
    left: 3px;
    opacity: 0;
  }
}


@media screen and (max-width:767px){
.mv_img img {max-width:80%;}
.mvDescBox h2 {font-size:40px; margin-top:10px;}
.mvDescBox p {margin-top:13px;}
}

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

}

/*section01*/

#ms01 {background:#000; position:relative;}
#ms01::after {content:'';position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:1px; height:100%; background:rgba(255,255,255,0.3);}
#ms01::before {content:'';position:absolute; right:6.25%; top:50%; transform:translateY(-50%); width:1px; height:100%; background:rgba(255,255,255,0.3);} 
#ms01::after, #ms01::before, .ms01List li:nth-of-type(2) .ms01Content::after {height: 0; transition: height 1s ease;}
#ms01.on::after { height: 100%;}
#ms01.on::before {height: 100%;}

.ms01Wrap {display:flex; align-items:center;}
.ms01Lt {width:50%;}
.ms01Desc h2 {color:#fff; line-height:1.3em; margin-top:30px;}
.ms01Desc h4 {color:#797979; line-height:1.3em; margin-top:55px;}
.ms01Rt {width:50%} 
.ms01List h4 {color:#797979}
.ms01List h2 {color:#fff;}
.ms01Content span {color:#797979; font-family: 'Pretendard Variable', Pretendard, sans-serif;}
.ms01List li { display:flex; position:relative;} 
.ms01List li:nth-of-type(2) {margin-top:76px; justify-content:end;}
.ms01List li:nth-of-type(3) {margin-top:66px;}

.countBox {  display: flex; align-items: baseline; gap:5px;}
.ms01List li .ms01Content {padding:8px 30px; border-left:2px solid #fff; box-sizing:border-box;position:relative;}
.ms01List li:nth-of-type(1) .ms01Content .countBox h2{min-width:174px;}
.ms01List li:nth-of-type(2) .ms01Content .countBox h2{ min-width:218px;}
.ms01List li:nth-of-type(3) .ms01Content .countBox h2{ min-width:127px;}
.ms01List li:nth-of-type(2) .ms01Content::after {position:absolute; content:''; left:0; top:50%; transform:translateY(-50%); width:1px; background:rgba(255,255,255,0.3); height:0;}
#ms01.on .ms01List li:nth-of-type(2) .ms01Content::after  { height: 620%; /* on 클래스가 추가되면 위에서 아래로 늘어남 */}


@media screen and (max-width:1680px){
#ms01::before {right:4.25%;}
}

@media screen and (max-width:1340px){
.ms01List li:nth-of-type(2) {justify-content: unset;}
#ms01.on .ms01List li:nth-of-type(2) .ms01Content::after {display:none;}
}



@media screen and (max-width:767px){
.ms01Wrap {flex-wrap:wrap; gap:40px;}
.ms01Lt {width:100%; text-align: center;}
.ms01Rt {width:100%;}
#ms01.on::before {display:none;}
#ms01.on::after {display:none;}
.ms01List {text-align:center;}
.ms01List li .ms01Content {padding:4px 15px; width:50%; border:none;}
.ms01List li:nth-of-type(2) {justify-content: end; margin-top:25px;} 
.ms01List li:nth-of-type(3) {margin-top:25px;} 
.ms01List li:nth-of-type(2) .ms01Content {border:none;} 
.ms01Desc h4 {margin-top:20px;}
.ms01List h2 {font-size:25px;}
.ms01List li:nth-of-type(1) .ms01Content .countBox h2{min-width:100px;}
.ms01List li:nth-of-type(2) .ms01Content .countBox h2{ min-width:100px;}
.ms01List li:nth-of-type(3) .ms01Content .countBox h2{ min-width:100px;}
.ms01List li .ms01Content {padding:4px 10px;}
.ms01List h4 {font-size:13px;}
.ms01Content span {font-size:13px;}
.countBox {    justify-content: center; margin-top:10px;}
.ms01List {position:relative;}
.ms01List::after {position:absolute; left:50%; top:50%;transform:translate(-50%, -50%); background:#666; width:2px; height:100%; content:''; }
}

/*section02*/

#ms02 {background:url(/img/main/ms02_bg.jpg) no-repeat center / cover;}
.ms02Desc {text-align:center;}
.ms02Desc h2 {color:#fff; line-height:1.3em; margin-top:30px;}
.ms02Desc p {color:#797979; line-height:1.3em; margin-top:55px;}


@media screen and (max-width:720px){
.ms02Desc p {margin-top:25px;}
}



/*section03*/

#ms03 {background:#000;}
.ms03Inner {max-width:1440px; width:92%; margin:0 auto;}
.ms03Desc {text-align:center;}
.ms03Desc h2 {color:#fff; line-height:1.3em; margin-top:30px;}
.ms03List {display:flex; margin-top:60px;}

.ms03List li {position:relative; display:flex;flex-direction: column; width:calc((100% - 13px*3)/4); margin-right:13px; padding:41px; box-sizing:border-box; align-items: center; border-left:2px solid rgba(67,67,67,.5); border-right:2px solid rgba(67,67,67,.5);}
.ms03List li::after {content:''; position:absolute; top:0; left:0; width:100%; height:2px; background: linear-gradient(to right, rgba(67,67,67,.5), #ffffff, rgba(67,67,67,.5));}
.ms03List li::before  {content:''; position:absolute; bottom:0; left:0; width:100%; height:2px; background: linear-gradient(to right, rgba(67,67,67,.5), #ffffff, rgba(67,67,67,.5));}
.ms03List li:nth-of-type(4n) {margin-right:0;}
.ms03List li h4 {letter-spacing:0.04em; color:rgba(255,255,255,.3);}
.ms03List li figure {margin-top:40px;}
.ms03List li p {line-height:1.4em; color:#fff; margin-top:40px; text-align:Center;}

@media screen and (max-width:1280px){
.ms03List li {padding:20px;}
.ms03List li p {font-size:18px;}
}

@media screen and (max-width:1040px){
.ms03List {flex-wrap:wrap;}
.ms03List li { width:calc((100% - 13px)/2); margin-right:13px;}
.ms03List li:nth-of-type(2n) {margin-right:0;}
.ms03List li:nth-of-type(n + 3) {margin-top:13px;} 
}

@media screen and (max-width:767px){
.ms03List {margin-top:30px;}
.ms03List li {padding:20px 10px; justify-content:center; }
.ms03List li figure {margin-top:20px; width:30px;}
.ms03List li figure img {width:100%;}
.ms03List li p {margin-top:20px; font-size:13px;}
}


/*section04*/

.ms04Desc {text-align:center;}
.ms04Desc span {letter-spacing:0.06em; color:#ef6959;}
.ms04Desc h2 {margin-top:30px; color:#0f0f0f;}

/*msLine*/

.j_bot_slide{position:relative; background-color:#fff; overflow:hidden; height:142px; margin-top:40px;}
.j_bot_slide .j_wrap{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;}
.j_bot_slide img{display:block;}

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


@media screen and (max-width:767px){
.j_bot_slide {width:2000px; margin-top:20px;}
}


/*footer*/

.mi22 {margin-left:22px; position:relative;}
.mi22::before {content:'';position:absolute; left:-11px; top:50%; transform:translateY(-50%); width:2px; height:12px; background:#666666;}
.j_footer {background:#000; padding:67px 0;}
.ft_inner {max-width:1440px; width:92%; margin:0 auto;}
.ftWrap {display:flex; justify-content:space-between;}

.ft_link {display:flex;}
.ft_link a {display:block; color:#fff; transition:0.28s;}
.ft_link a:hover {    font-family: 'SUIT-Bold';}
.ft_link a + a {margin-left:22px; position:relative;}
.ft_link a + a:after {content:'';position:absolute; left:-11px; top:50%; transform:translateY(-50%); width:2px; height:12px; background:#666666; }
.ft_info {margin-top:22px;}
.ft_info p {line-height:2em; color:#666;}


@media screen and (max-width:890px){
.ftWrap {flex-wrap:Wrap; flex-direction: column-reverse; gap:30px;}

}

@media screen and (max-width:720px){
.ft_info {margin-top:11px;}
.ml0 {margin-left:0 !important;}
.mi22.ml0::before {display:none;}
.mi22::before {height:8px;}
.j_footer {padding:40px 0;}
.ft_logo img {    width: 45.8%;}
}

/* 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: #ed7845;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;}
}

/* admin menu */
.b_adm_list{position:fixed; right:20px; bottom:110px; z-index:15; }
.b_adm_list li{margin-bottom:7px; }
.b_adm_list li:last-child{margin-bottom:0px; }
.b_adm_list li a{display:flex; align-items: center; justify-content: center; color:#fff; width:100px; height:40px; border-radius:6px; text-align:center; background-color:#ed7845; border:1px solid #ed7845; }

@media screen and (max-width:767px){
.b_adm_list{position:fixed; right:20px; bottom:190px; z-index:15; } 
}