@charset "utf-8";
@import url("common.css");

/*Layer*/
body{width:100%}
#wrap{width:100%}
#header{}
#container{width:100%}
#contents{}
#footer{width:100%;}

/*header*/
.pcbr{display:block;}
.ptbr{display:block;}
.tbbr{display:none;}
.mbbr{display:none;}
.dn{display:none;}

.t_view{display: none;}
.tm_view{display: none;}
.m_view{display: none;}

/*subtab*/
.subtabarea {  
padding-bottom: 100px;
display: flex;
justify-content: center;
}

.subtabarea .subtabarea_wrap {
position: relative;
max-width: 1640px;
width: 92%;
margin: 0 auto;
}

.subtabarea .subtab{
border-radius: 52px;
display: flex;
justify-content: space-between;
background: #F2F2F2;
height: 52px;
}

.subtab li {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
width: calc(100% / 4);
}

.subtab li a {
display: block;
color: #666666;
text-align: center;
font-size: var(--font-size-18);
border-radius: 52px;
transition: all 0.3s;
padding: 0 10px;
width: 100%;
height: 100%;
line-height: 52px;
}

.subtab li.on a {
background-color: #111;
color: #fff;
}



/* paging */
.paging{
	margin-top:85px;
	text-align:center;
}
.paging a{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width:50px;height:50px;
	color:#666;font-size:24px;line-height:50px; font-weight: 500;
}
.paging strong{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width:50px;height:50px;
	color:#266EF0;font-size:24px;line-height:50px;font-weight:500;
	border-bottom: 2px solid #266EF0;
}
.paging .page_begin{
	width:50px;height:50px;
	background:url(/images/common/page_begin.png) no-repeat center;
	border:0;
}
.paging .page_prev{
	width:50px;height:50px;
	background:url(/images/common/page_prev.png) no-repeat center;
	border:0;margin-right:20px;
}
.paging .page_next{
	width:50px;height:50px;
	background:url(/images/common/page_next.png) no-repeat center;
	border:0;margin-left:20px;
}
.paging .page_end{
	width:50px;height:50px;
	background:url(/images/common/page_end.png) no-repeat center;
	border:0;
}



/* 공통 */
.page_top{
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
}

.page_top .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.page_top.pn1 .bg{background: url(/images/page/page_visual1.jpg) no-repeat center / cover;}
.page_top.pn2 .bg{background: url(/images/page/page_visual2.png) no-repeat center / cover;}
.page_top.pn2.cn1 .bg{background: url(/images/page/page_visual211.png) no-repeat center / cover;}
.page_top.pn2.cn2 .bg{background: url(/images/page/page_visual212.png) no-repeat center / cover;}
.page_top.pn2.cn3 .bg{background: url(/images/page/page_visual213.png) no-repeat center / cover;}
.page_top.pn2.cn4 .bg{background: url(/images/page/page_visual214.png) no-repeat center / cover;}
.page_top.pn3 .bg{background: url(/images/page/page_visual3.jpg) no-repeat center / cover;}
.page_top.pn4 .bg{background: url(/images/page/page_visual4.jpg) no-repeat center / cover;}
.page_top.pn5 .bg{background: url(/images/page/page_visual5.jpg) no-repeat center / cover;}
.page_top.pn6 .bg{background: url(/images/page/page_visual6.jpg) no-repeat center / cover;}

.page_top .inner{
	position: relative;
	width: 92%;
	max-width: 1640px;
	margin: 0 auto 80px;
}

.page_top .inner .txtwrap{}
.page_top .inner .txtwrap h2{
	font-size: 28px;
	color: #fff;
}
.page_top .inner .txtwrap .slogan_en{
	font-size: 86px;
	color: #fff;
	margin-top: 20px;
}
.page_top .inner .txtwrap .line{
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.5);
	margin: 20px 0 20px;
}
.page_top .inner .txtwrap .slogan_kr{
	font-size: 28px;
	color: #fff;
}
.page_top .inner .sub_tab{}
.page_top .inner .sub_tab ul{
	display: flex;
	gap: 7px;
	margin-top: 80px;
}
.page_top .inner .sub_tab ul li{}
.page_top .inner .sub_tab ul li a{
	display: inline-block;
	padding: 13px 30px;
	border-radius: 50px;
	backdrop-filter: blur(10px);
	background: rgba(255,255,255,0.2);
	font-size: 18px;
	color: #fff;
}
.page_top .inner .sub_tab ul li.on a{
	background: #000;
}

.page_tit{
	position: relative;
	width: 92%;
	max-width: 1640px;
	margin: 0 auto;
	padding: 140px 0 160px;
}
.page_tit h3{
	font-size: 38px;
	font-weight: 500;
}
.page_tit .page_slg{
	margin-top: 140px;
	font-size: var(--font-size-60);
	font-weight: 500;
}

/* m00 */

.m11{}
.m11 .section1{
	padding: 0 0 200px;
}
.m11 .section1 .conwrap{
	display: flex;
	align-items: center;
}
.m11 .section1 .conwrap .txtwrap{
	width: 50%;
	padding-right: 5%;
}
.m11 .section1 .conwrap .txtwrap .slg{
	font-size: 60px;
	font-weight: 500;
}
.m11 .section1 .conwrap .txtwrap p{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #666;
	margin-top: 60px;
}
.m11 .section1 .conwrap .imgwrap{
	width: 50%;
	height: 645px;
	border-radius: 15px;
	overflow: hidden;
}
.m11 .section1 .conwrap .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m11 .section1 .infowrap{
	margin-top: 200px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.m11 .section1 .infowrap dl{
	width: 49%;
	padding: 40px 30px;
	border-top: 1px solid #ccc;
	display: flex;
}
.m11 .section1 .infowrap dl:nth-child(5),
.m11 .section1 .infowrap dl:nth-child(6){
	border-bottom: 1px solid #ccc;
}
.m11 .section1 .infowrap dl dt{
	width: 200px;
	padding-left: 35px;
	font-size: 18px;
	font-weight: 500;
}
.m11 .section1 .infowrap dl:nth-child(1) dt{background: url(/images/page/m11_sec1_icon1.png) no-repeat left center;}
.m11 .section1 .infowrap dl:nth-child(2) dt{background: url(/images/page/m11_sec1_icon2.png) no-repeat left center;}
.m11 .section1 .infowrap dl:nth-child(3) dt{background: url(/images/page/m11_sec1_icon3.png) no-repeat left center;}
.m11 .section1 .infowrap dl:nth-child(4) dt{background: url(/images/page/m11_sec1_icon4.png) no-repeat left center;}
.m11 .section1 .infowrap dl:nth-child(5) dt{background: url(/images/page/m11_sec1_icon5.png) no-repeat left center;}
.m11 .section1 .infowrap dl:nth-child(6) dt{background: url(/images/page/m11_sec1_icon6.png) no-repeat left center;}
.m11 .section1 .infowrap dl dd{
	width: calc(100% - 200px);
	font-size: 18px;
	color: #666;
}

.m11 .section2{
	position: relative;
	padding: 180px 0 80px;
	overflow: hidden;
}
.m11 .section2 .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/page/m11_sec2_bg.jpg) no-repeat center / cover;
}
.m11 .section2 .slg{
	font-size: 60px;
	font-weight: 500;
	color: #fff;
	margin-bottom: 230px;
}
.m11 .section2 ul{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}
.m11 .section2 li{
	width: calc((100% - 90px) / 4);
	height: 338px;
	padding: 35px;
	border: 1px solid #ccc;
	border-radius: 13px;
	backdrop-filter: blur(10px);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.m11 .section2 li .titwrap{}
.m11 .section2 li .titwrap .num{
	display: inline-block;
	padding: 8px 19px;
	font-size: 14px;
	background: rgba(255,255,255,0.4);
	border-radius: 10px;
}
.m11 .section2 li .titwrap .tit{
	margin-top: 25px;
	font-size: 25px;
	font-weight: 500;
	color: #fff;
}
.m11 .section2 li  p{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: rgba(255,255,255,0.7);
}



.m12{}
.m12 .section1{
	padding: 0 0 200px;
}
.m12 .section1 .conwrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.m12 .section1 .conwrap .txtwrap{
	width: 100%;
}
.m12 .section1 .conwrap .txtwrap .slg{
font-size: var(--font-size-60);
	font-weight: 500;
}
.m12 .section1 .conwrap .txtwrap p{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #666;
	margin-top: 60px;
}
.m12 .section1 .conwrap .imgwrap{
	width: 480px;
	height: 416px;
	border-radius: 15px;
	overflow: hidden;
}
.m12 .section1 .conwrap .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.m12 .section1 .conwrap2{
	margin: 180px 0 150px;
	display: flex;
	justify-content: space-between;
}
.m12 .section1 .conwrap2 .imgwrap{
	display: flex;
	gap: 24px;
	width: 48%;
	margin-right: 2%;
}
.m12 .section1 .conwrap2 .txtwrap{
	width: 50%;
	font-size: 18px;
	line-height: 1.7em;
	color: #666;
}
.m12 .section1 .sign{
	padding-top: 40px;
	border-top: 1px solid #ccc;
	text-align: right;
	font-size: 18px;
}
.m12 .section1 .sign img{
	margin: 0 0 0 10px;
}

/* m13 */
.m13 {}

.m13 .section:last-child{
padding-bottom: 200px;
}

.m13 .section1-title {
font-size: var(--font-size-60);
font-weight: 500;
}

.m13 .content-wrap{
position: relative;
max-width: 1780px;
width: 95%;
margin: 160px auto 0;
}

.m13 .content {
display: flex;
align-items: center;
}

.m13 .content:nth-child(even) {
flex-direction: row-reverse;
}

.m13 .content-img,
.m13 .content-year {
width: 50%;
position: relative;
}
.m13 .content-img .bg{
	opacity: 0;
}
.m13 .content-img.in-view .bg {
animation-name: bgMotion;
animation-duration: 1s;
animation-fill-mode: forwards;
animation-timing-function: ease-in-out;
animation-delay: 0.3s;
opacity: 0;
}

@keyframes bgMotion{
	0% { clip-path: inset(50%);opacity:0; }
	100% {clip-path: inset(0);opacity:1;}
}

.m13 .content-img .bg img{
border-radius: 15px;
}

.m13 .content-img .content-img__title {
position: absolute;
font-size: var(--font-size-110);
color: #fff;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.m13 .content:nth-child(odd) .content-year {
padding: 0px 70px 0px 125px;
}

.m13 .content:nth-child(even) .content-year {
padding: 0px 125px 0px  70px;
}

.m13 .content-year__title{
color: #000;
font-size: var(--font-size-110);
line-height: 1;
}

.m13 .content-year .timeLIne-list {
margin-top: 45px;
}

.m13 .content-year .timeLIne-list .list-item{
padding: 18px 0;
display: flex;
gap: 95px;
}

.m13 .content-year .timeLIne-list .list-item + .list-item{
border-top: 1px solid #B3B3B3;
}

.m13 .content-year .timeLIne-list dt{
color: var(--main-color);
font-size: var(--font-size-24);
font-weight: 500;
}

.m13 .content-year .timeLIne-list dd p{
font-size: var(--font-size-20);
color: #666;
}

.m13 .content-year .timeLIne-list dd p + p{
margin-top: 10px;

}


.m14{}
.m14 .section .con{}
.m14 .section .con .con_tit{
	margin-bottom: 100px;
}
.m14 .section .con .con_tit .tit1{
	font-size: var(--font-size-34);
	font-weight: 500;
	color: #266EF0;
	margin-bottom: 40px;
}
.m14 .section .con .con_tit .tit2{
	font-size: var(--font-size-60);
	font-weight: 500;
	color: #000;
}
.m14 .section1 .con{}
.m14 .section1 .con .mission{
	padding-bottom: 100px;
}
.m14 .section1 .con .mission .swiper-slide{
	width: 527px;
	height: 540px;
	border-radius: 15px;
	overflow: hidden;
}
.m14 .section1 .con .mission .swiper-slide .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.m14 .section1 .con .mission .swiper-slide .bg img{
	width: 100%;
	height: 100%;
	transition: all 0.8s;
}
.m14 .section1 .con .mission .swiper-slide:hover .bg img{
	transform: scale(1.1);
}
.m14 .section1 .con .mission .swiper-slide .txtwrap{
	position: relative;
	width: 100%;
	height: 100%;
	padding: 50px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.m14 .section1 .con .mission .swiper-slide .txtwrap .num{
	font-size: 50px;
	font-weight: 300;
	color: #fff;
}
.m14 .section1 .con .mission .swiper-slide .txtwrap .txts .slg{
	font-size: 34px;
	font-weight: 500;
	color: #fff;
}
.m14 .section1 .con .mission .swiper-slide .txtwrap .txts p{
	font-size: 20px;
	color: #fff;
	margin-top: 10px;
}
.m14 .section1 .con .mission .swiper-scrollbar{
	display:block !important;
	width:100%;height:2px;
	left:0;
	background:#c4c4c4;
}
.m14 .section1 .con .mission .swiper-scrollbar .swiper-scrollbar-drag{
	height:4px;
	background:#266EF0;
}
.m14 .section2{
	padding: 120px 0;
	background: url(/images/page/m14_con2_bg0.png) no-repeat center bottom / cover;
}
.m14 .section2 .con .boxwrap{
	display: flex;
	gap: 40px;
}
.m14 .section2 .con .boxwrap .box{
	position: relative;
	width: calc((100% - 40px) / 2);
	height: 480px;
	border-radius: 15px;
	overflow: hidden;
}
.m14 .section2 .con .boxwrap .box .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.m14 .section2 .con .boxwrap .box .bg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.8s;
}
.m14 .section2 .con .boxwrap .box:hover .bg img{
	transform: scale(1.1);
}
.m14 .section2 .con .boxwrap .box .txtwrap{
	position: relative;
	width: 100%;
	height: 100%;
	padding: 50px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.m14 .section2 .con .boxwrap .box .txtwrap .num{
	font-size: 50px;
	font-weight: 300;
	color: #fff;
}
.m14 .section2 .con .boxwrap .box .txtwrap .txts .slg{
	font-size: 34px;
	font-weight: 500;
	color: #fff;
}
.m14 .section2 .con .boxwrap .box .txtwrap .txts p{
	font-size: 20px;
	color: #fff;
	margin-top: 10px;
}
.m14 .section2 .con .secSlg{
	margin-top: 200px;
	font-size: min(10vw, 184px);
	font-weight: 500;
	color: #fff;
}

.m14 .section3{
	padding: 200px 0 0;
}
.m14 .section3 .list{
	border-top: 1px solid #ccc;
	display: flex;
}
.m14 .section3 .list > div{
	width: 25%;
}
.m14 .section3 .list > div .txtwrap{
	width: 100%;
	height: 300px;
	padding: 80px 60px;
	border-right: 1px solid #ccc;
}
.m14 .section3 .list > div .txtwrap .tit_en{
	font-size: 20px;
	font-weight: 500;
	color: #266EF0;
}
.m14 .section3 .list > div .txtwrap .tit_kr{
	font-size: 34px;
	font-weight: 500;
	color: #000;
	margin: 10px 0 15px;
}
.m14 .section3 .list > div .txtwrap p{
	font-size: 18px;
	line-height: 1.7em;
	color: #666;
}
.m14 .section3 .list > div .imgwrap{
	width: 100%;
	height: 380px;
}
.m14 .section3 .list > div .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}




.m15{}
.m15 .section1{
	padding: 0 0 200px;
}
.m15 .section1 .conwrap{
	position: relative;
	display: flex;
	align-items: flex-end;
	border: 1px solid #ccc;
	border-radius: 15px;
}
.m15 .section1 .conwrap:after{
	content: "";
	position: absolute;
	left: 45%;
	top: 0;
	width: 1px;
	height: 100%;
	background: #ccc;
}
.m15 .section1 .conwrap + .conwrap{
	margin-top: 100px;
}
.m15 .section1 .conwrap .logowrap{
	width: 45%;
	padding: 40px;
}
.m15 .section1 .conwrap .logowrap .logo{
	text-align: center;
}
.m15 .section1 .conwrap .logowrap .link{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	margin-top: 60px;
	width: 100%;
	height: 70px;
	border-radius: 15px;
	background: #F0F4FC;
	font-size: 16px;
	font-weight: 500;
	color: #266EF0;
	transition: all 0.3s;
}
.m15 .section1 .conwrap .logowrap .link:hover{
	color: #fff;
	background: #266EF0;
}
.m15 .section1 .conwrap .logowrap .link i{
	display: block;
	width: 14px;
	height: 14px;
	background: url(/images/page/m15_link_icon1.png) no-repeat center / contain;
	margin-right: 10px;
	transition: all 0.3s;
}
.m15 .section1 .conwrap .logowrap .link:hover i{
	background: url(/images/page/m15_link_icon2.png) no-repeat center / contain;
}

.m15 .section1 .conwrap .txtwrap{
	width: 55%;
	padding: 95px 110px;
}
.m15 .section1 .conwrap .txtwrap .name{
	font-size: var(--font-size-38);
	font-weight: 500;
	color: #266EF0;
}
.m15 .section1 .conwrap .txtwrap p{
	font-size: var(--font-size-18);
	line-height: 1.8em;
	color: #666;
	margin-top: 20px;
}


.m16{}
.m16 .section1{
	padding: 0 0 200px;
}
.m16 .section1 .m16_tabs{
	width: 100%;
	display: flex;
	background: rgba(0,0,0,0.1);
	border-radius: 50px;
	margin-bottom: 100px;
}
.m16 .section1 .m16_tabs li{
	width: 33.3333%;
}
.m16 .section1 .m16_tabs li a{
	display: block;
	width: 100%;
	height: 50px;
	line-height: 50px;
	border-radius: 50px;
	font-size: var(--font-size-18);
	color: #666;
	text-align: center;
}
.m16 .section1 .m16_tabs li.on a{
	color: #fff;
	background: #000;
}

.m16 .section1 .tabconwrap{}
.m16 .section1 .tabconwrap .tabcon{display: none;}
.m16 .section1 .tabconwrap .tabcon.on{display: block;}
.m16 .section1 .tabconwrap .tabcon .main_img{
	width: 100%;
	height: 626px;
	border-radius: 15px;
	overflow: hidden;
}
.m16 .section1 .tabconwrap .tabcon .main_img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m16 .section1 .tabconwrap .tabcon .conwrap{
	margin-top: 100px;
	display: flex;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .name{
	width: 400px;
	font-size: var(--font-size-60);
	font-weight: 500;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap{
	width: calc(100% - 400px);
	padding-left: 110px;
	border-left: 1px solid #ccc;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .exp{
	font-size: var(--font-size-18);
	line-height: 1.8em;
	color: #666;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .info{
	margin-top: 80px;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .info dl{
	display: flex;
	padding: 30px;
	border-top: 1px solid #ccc;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .info dl:last-child{
	border-bottom: 1px solid #ccc;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .info dl dt{
	width: 170px;
	font-size: var(--font-size-18);
	font-weight: 500;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .info dl dt .icon{
	display: inline-block;
	width: 34px;
}
.m16 .section1 .tabconwrap .tabcon .conwrap .infowrap .info dl dd{
	width: calc(100% - 170px);
	font-size: var(--font-size-18);
	color: #666;
}





/* m17 */
.m17{}
.m17 .section{padding:0 0 200px;}
.m17 .section .mapArea{
	overflow:hidden;
	display:flex;flex-wrap:wrap;
	border-radius:12px;
	background:#DDE3F0;
}
.m17 .section .mapArea .area1{
	width:25%;
	padding:80px 60px;
	background:#4B7CD4;
	border-radius:12px;
}
.m17 .section .mapArea .area1 .tit1{font-size:23px;color:#fff;font-weight:500;}
.m17 .section .mapArea .area1 .tit2{margin:20px 0 30px;font-size:48px;color:#fff;font-weight:600;}
.m17 .section .mapArea .area1 .txt{font-size:17px;color:#fff;line-height:170%;}
.m17 .section .mapArea .area1 .sort{margin:120px 0 0;}
.m17 .section .mapArea .area1 .sort ul{}
.m17 .section .mapArea .area1 .sort ul li{border-bottom:1px solid rgba(255,255,255,0.2);}
.m17 .section .mapArea .area1 .sort ul li:first-child{border-top:1px solid rgba(255,255,255,0.2);}
.m17 .section .mapArea .area1 .sort ul li.on{border:0;}
.m17 .section .mapArea .area1 .sort ul li a{
	display:flex;align-items:center;
	position:relative;
	width:100%;height:64px;
	padding:0 20px;
	border-radius:12px;
	font-size:17px;color:#fff;font-weight:600;
}
.m17 .section .mapArea .area1 .sort ul li.on a{
	background:#fff;
	color:#4B7CD4;
}
.m17 .section .mapArea .area2{
	position:relative;
	width:75%;min-height:700px;
	padding:30px 100px;
}
.m17 .section .mapArea .area2 .mapImg{
	position:absolute;left:50%;top:50%;z-index:10;
	width:40%;height:calc(100% - 60px);
	margin:0 auto;
	transform:translate(calc(-50% + 40px), -50%);
}
.m17 .section .mapArea .area2 .mapImg img{width:100%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer{position:absolute;left:0;top:0;z-index:100;width:100%;height:100%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li{
	position:absolute;
}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p1{left:14%;top:19.5%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p2{left:15.5%;top:21%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p3{left:26%;top:57%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p4{left:58%;top:67%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p5{left:20%;top:13%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p6{left:31%;top:30.5%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p7{left:25%;top:37.5%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p8{left:15%;top:40%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p9{left:23.5%;top:57.5%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p10{left:14.5%;top:71%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p11{left:62%;top:54%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.p12{left:55.5%;top:68%;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.off{
	pointer-events: none;
	opacity:0;
}
.m17 .section .mapArea .area2 .mapImg ul.pointer li a{	
	display:block;
	position:relative;
	width:10px;height:10px;
	background:#4B7CD4;
	border-radius:50%;
	text-indent:-9999px;
	transition:all 1s;
}
.m17 .section .mapArea .area2 .mapImg ul.pointer li a:after{
	display:block;content:"";
	width:100%;height:100%;
	background:red;
	border-radius:50%;
	transform:translate(-50%,-50%) scale(0);
	position:absolute;left:50%;top:50%;
	transition:all 0.7s;
}
.m17 .section .mapArea .area2 .mapImg ul.pointer li:hover a{background:red;}
.m17 .section .mapArea .area2 .mapImg ul.pointer li:hover a:after{	
	transform:translate(-50%,-50%) scale(3);
	opacity:0;
}
.m17 .section .mapArea .area2 .mapImg ul.pointer li.on a{background:red;}


.m17 .section .mapArea .area2 .mapBtns{
	position:relative;
	width:100%;height:100%;
	display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;
}
.m17 .section .mapArea .area2 .mapBtns ul{}
.m17 .section .mapArea .area2 .mapBtns ul li{position:relative;z-index:100;width:50%;margin-bottom:20px;}
.m17 .section .mapArea .area2 .mapBtns ul li:nth-child(2n){text-align:right;}
.m17 .section .mapArea .area2 .mapBtns ul li:last-child{margin:0;}
.m17 .section .mapArea .area2 .mapBtns ul li a{
	display:inline-flex;align-items:center;	
	width:12vw;height:60px;
	padding:0 30px;
	background:#fff;
	border-radius:50px;
	font-size:19px;color:#222;font-weight:500;	
	transition:all 0.24s;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(1) a{
	background:#fff url(/images/page/m17_icon1.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(2) a{
	background:#fff url(/images/page/m17_icon2.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(3) a{
	background:#fff url(/images/page/m17_icon2.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(4) a{
	background:#fff url(/images/page/m17_icon2.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(5) a{
	background:#fff url(/images/page/m17_icon3.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(6) a{
	background:#fff url(/images/page/m17_icon3.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(2) li a{
	background:#fff url(/images/page/m17_icon3.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul li a span{
	display:block;
	position:relative;
	padding:0 0 0 18px;
}
.m17 .section .mapArea .area2 .mapBtns ul li a span:before{
	display:block;content:"";
	width:8px;height:8px;
	border:2px solid #4B7CD4;
	box-sizing:border-box;
	border-radius:50%;
	position:absolute;left:0;top:50%;margin-top:-4px;transition:all 0.24s;
}
.m17 .section .mapArea .area2 .mapBtns ul li.off{}
.m17 .section .mapArea .area2 .mapBtns ul li.off a{
	pointer-events: none;
	opacity:0.5;
}
.m17 .section .mapArea .area2 .mapBtns ul li.on a{color:#fff;}
.m17 .section .mapArea .area2 .mapBtns ul li.on a span:before{background:#fff;border:2px solid #fff;}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(1).on a{
	background:#4B7CD4 url(/images/page/m17_icon1.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(2).on a{
	background:#4B7CD4 url(/images/page/m17_icon2.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(3).on a{
	background:#4B7CD4 url(/images/page/m17_icon2.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(4).on a{
	background:#4B7CD4 url(/images/page/m17_icon2.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(5).on a{
	background:#4B7CD4 url(/images/page/m17_icon3.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(1) li:nth-child(6).on a{
	background:#4B7CD4 url(/images/page/m17_icon3.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .mapArea .area2 .mapBtns ul:nth-child(2) li.on a{
	background:#4B7CD4 url(/images/page/m17_icon3.png) no-repeat calc(100% - 30px) center;
	background-size:26px;
}
.m17 .section .areaList{margin:20px 0 0;}
.m17 .section .areaList .boxwrap{
	margin-bottom:20px;
	background:#FAFAFA;
	box-shadow:0 0 1px #555 inset;border-radius:12px;
	cursor:pointer;
}
.m17 .section .areaList .boxwrap .titlearea{
	display:flex;align-items:center;justify-content:space-between;
	padding:35px 40px;
	border-radius:12px;
	border:1px solid #ccc;
	background:#fff;
}
.m17 .section .areaList .boxwrap .titlearea .tit{font-size:27px;color:#000;font-weight:500;}
.m17 .section .areaList .boxwrap .titlearea .arr{
	width:14px;height:14px;
	border-right:2px solid #333;border-bottom:2px solid #333;
	transform:rotate(45deg);
}
.m17 .section .areaList .boxwrap .infoarea{display:none;}
.m17 .section .areaList .boxwrap .infoarea>div{display:flex;align-items:center;justify-content:space-between;padding:30px 40px;}
.m17 .section .areaList .boxwrap .infoarea .info1{display:flex;align-items:center;gap:70px;}
.m17 .section .areaList .boxwrap .infoarea .info1 dl{display:flex;padding-left:40px;line-height:25px;}
.m17 .section .areaList .boxwrap .infoarea .info1 dl:nth-child(1){
	background:url(/images/page/m17_list_icon1.png) no-repeat left top;
	background-size:24px;
}
.m17 .section .areaList .boxwrap .infoarea .info1 dl:nth-child(2){
	background:url(/images/page/m17_list_icon2.png) no-repeat left top;
	background-size:24px;
}
.m17 .section .areaList .boxwrap .infoarea .info1 dl:nth-child(3){
	background:url(/images/page/m17_list_icon3.png) no-repeat left top;
	background-size:24px;
}
.m17 .section .areaList .boxwrap .infoarea .info1 dl dt{margin-right:30px;font-size:17px;color:#000;font-weight:500;}
.m17 .section .areaList .boxwrap .infoarea .info1 dl dd{font-size:17px;color:#666;}
.m17 .section .areaList .boxwrap .infoarea a{
	display:flex;align-items:center;justify-content:space-between;
	width:160px;height:45px;
	padding:0 24px;
	background:#dde3f0;
	border-radius:50px;
	font-size:16px;color:#000;
}
.m17 .section .areaList .boxwrap .infoarea a i{
	display:inline-block;
	width:16px;height:16px;
	background:url(/images/page/m17_list_icon4.png) no-repeat;
	background-size:cover;
}

/* m21 */
.m21{}
.m21 .section1{
padding-bottom: 345px;
}
.m21 .conwrap {
background-color: #F6F6F6;
border-radius: 13px;
position: relative;
display: flex;
padding: 90px 80px;
gap:70px;
}
.m21 .conwrap + .conwrap {
margin-top: 60px;
}
.m21 .conwrap::after {
content:'';
position: absolute;
border-radius: 13px;
width: 25%;
height: 100%;
background-color: #F2EDE0;
top:0;
right: 0;
transition: all 0.4s;
}
.m21 .conwrap:hover::after {
content:'';
position: absolute;
border-radius: 13px;
width: 25%;
height: 100%;
background-color: #4B7CD4;
top:0;
right: 0;
}
.m21 .conwrap .box{
position: relative;
z-index: 1;
width: 50%;
}
.m21 .conwrap .thumb-box img{
border-radius: 13px;
}
.m21 .conwrap .badge-box {
display: flex;
align-items: center;
gap:8px;
}
.m21 .conwrap .badge-box .badge{
padding: 10px 20px;
display: flex;
align-items: center;
justify-content: center;
font-size: var(--font-size-22);
}
.m21 .conwrap .badge-box .badge-gray {
color: #fff;
background-color: #666;
border-radius: 13px;
}
.m21 .conwrap .badge-box .badge-white {
border: 1px solid #666;
border-radius: 13px;
}
.m21 .conwrap .logo-box {
margin-top: 85px;
display: flex;
align-items: flex-end;
justify-content: flex-start;
gap: 38px;
}
.m21 .conwrap .text {
margin-top: 40px;
line-height: 1.6;
font-size: var(--font-size-18);
color: #666;
}
.m21 .conwrap .link-box {
margin-top: 40px;
display: flex;
gap:6px;
}
.m21 .conwrap .link-box a {
padding: 18px 20px;
border-radius: 31px;
display: flex;
justify-content: space-between;
align-items: center;
min-width: 153px;
transition: all 0.4s;
}
.m21 .conwrap .link-box a:hover:first-child {
border: 1px solid #4B7CD4;
color: #4B7CD4;
}
.m21 .conwrap .link-box a:hover:last-child {
background-color: #4B7CD4;
color: #fff;
}
.m21 .conwrap .link-box a:first-child {
border: 1px solid #646464;	
}
.m21 .conwrap .link-box a:last-child {
background-color: #F2EDE0;
}
.m21 .conwrap .link-box a:hover:first-child .icon-arr {
display: inline-block;
width: 24px;
height: 24px;
background: url(/images/page/m21_arr_color.png) no-repeat center / contain;
}
.m21 .conwrap .link-box a:hover:last-child .icon-arr {
display: inline-block;
width: 24px;
height: 24px;
background: url(/images/page/m21_arr_w.png) no-repeat center / contain;
}
.m21 .conwrap .link-box .icon-arr {
display: inline-block;
width: 24px;
height: 24px;
background: url(/images/page/m21_arr_b.png) no-repeat center / contain;
transition: all 0.4s;
}

/* m211 - 214 공통 */
.m210 .section1{margin-top: 200px;}
.m210 .page-titleWrap {
text-align: center;
}
.m210 .page-title {
font-size: var(--font-size-60);
color: #000;
font-weight: 500;
}
.m210 .page-titleWrap .logo-box {
margin-top: 110px;
}
.m210 .content-title {
font-size: var(--font-size-44);
color: #000;
font-weight: 600;
}
.m210 .content-text {
font-size: var(--font-size-18);
line-height: 1.6;
}
.m210 .box-title {
font-size: var(--font-size-40);
color: #000;
font-weight: 600;
}
.m210 .box-text {
font-size: var(--font-size-18);
line-height: 1.6;
}
.m210 .img-title {
font-size: var(--font-size-30);
color: #000;
font-weight: 600;
}
.m210 .icon-box {
background-color: #F2EDE0;
padding: 20px;
border-radius: 13px;
width: 90px;
height: 90px;
display: flex;
align-items: center;
justify-content: center;
}
.m210 .productImg-box {
margin-top: 100px;
position: relative;
}
.m210 .productImg-box::before{
content: '';
position: absolute;
width: 100%;
height: 85%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(102, 102, 102, 0.00) 70%);
left: 0;
top: 45%;
z-index: -1;
}
.m210 .section-haccp{
margin-top: 200px;
}
.m210 .section-haccp .content1 .content-title {
text-align: center;
}
.m210 .section-haccp .content1 .content-text {
text-align: center;
margin-top: 32px;
color: #666;
}
.m210 .section-haccp .content1 .box-warp .box1 {
background: url(/images/page/m210_haccp_bg1.png) no-repeat center / cover;
}
.m210 .section-haccp .content1 .box-warp .box2 {
background: url(/images/page/m210_haccp_bg2.png) no-repeat center / cover;
}
.m210 .section-haccp .content1 .box-warp .box3 {
background: url(/images/page/m210_haccp_bg3.png) no-repeat center / cover;
}
.m210 .section-haccp .content1 .box .box-title {
color: #fff;
}
.m210 .section-haccp .content1 .box .box-content {
margin-top: 60px;
padding: 60px 40px;
text-align: center;
border:1px solid rgba(255, 255, 255, 0.2);
border-radius: 13px;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}
.m210 .section-haccp .content1 .box-warp{
margin-top: 100px;
display: flex;
}
.m210 .section-haccp .content1 .box-warp .box {
width: 33.3%;
padding: 140px 100px;
}
.m210 .section-haccp .content1  .box .box-textarea {
margin-top: 40px;
padding-top: 40px;
border-top: 1px solid rgba(255, 255, 255, 0.3);
}
.m210 .section-haccp .content1 .box .box-year {
font-size: var(--font-size-22);
color: #333;
font-weight: 600;
padding: 10px 20px;
background-color: #fff;
border-radius: 13px;
display: inline-block;
}
.m210 .section-haccp .content1 .box .box-text {
margin-top: 15px;
font-size: var(--font-size-26);
color: #fff;
}
.m212 .section1 .content1,
.m213 .section1 .content1,
.m214 .section1 .content1{
margin-top: 266px;
}

.m211 .section1{}
.m211 .section1 .content1{
margin-top: 160px;
}
.m211 .section1 .content1 .box-container {
display: flex;
position: relative;
padding: 80px 80px 80px 0;
align-items: center;
justify-content: space-between;
}
.m211 .section1 .content1 .box-container::after {
content:'';
position: absolute;
border-radius: 13px;
width: 25%;
height: 100%;
background-color: #4B7CD4;
top:0;
right: 0;
}
.m211 .section1 .content1 .text-box {
position: relative;
z-index: 1;
width: 50%;
}
.m211 .section1 .content1 .content-title {
margin-top: 40px;
}
.m211 .section1 .content1 .content-text {
margin-top: 30px;
color: #666;
}
.m211 .section1 .content1 .thumb-box {
position: relative;
z-index: 1;
width: calc(50% - 80px);
}
.m211 .section1 .content1 .thumb-box  img{
border-radius: 13px;
}
.m211 .section1 .content2 {
margin-top: 105px;
background: url(/images/page/m211_img2.png) no-repeat center / cover;
border-radius: 13px;
padding:103px 0;
}
.m211 .section1 .content2 .box {
width: 50%;
margin-left: auto;
}
.m211 .section1 .content2 .content-title {
margin-top: 40px;
color: #fff;
}
.m211 .section1 .content2 .content-text {
margin-top: 30px;
color: #fff;
}
.m211 .section1 .content3{
margin-top: 200px;
}
.m211 .section1 .content3 .box + .box {
margin-top: 200px;
}
.m211 .section1 .content3 .img-box{
margin-top: 100px;
}
.m211 .section1 .content3 .box3 .box-text{
margin-top: 30px;
color: #666;
}
.m211 .section1 .content3 .box3 .img-box{
background-color: #F8F8F8;
border-radius: 13px;
padding: 80px;
}
.m211 .section1 .content3 .box3 .img-title {
text-align: center;
margin-bottom: 50px;
}
.m211 .section2 {
background: url(/images/page/m211_img6.png) no-repeat center / cover;
padding: 284px 0 173px;
}
.m211 .section2 .content1 {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.m211 .section2 .content1 .content-title,
.m211 .section2 .content1 .content-text {
color: #fff;
}
.m211 .section2 .content1 .content-box {
width: 50%;
}
.m211 .section2 .content1 .circle-box {
margin-top: 130px;
display: flex;
align-items: center;
justify-content: center;
}
.m211 .section2 .content1 .circle-box .circle {
flex:1;
text-align: center;
border-radius: 50%;
border: 1px solid #fff;
aspect-ratio: 1 / 1;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 15px;
min-width: 296px;
position: relative;
}
.m211 .section2 .content1 .circle-box .circle1 {
transform: translateX(35px);
}
 .m211 .section2 .content1 .circle-box .circle3 {
transform: translateX(-35px);
}
.m211 .section2 .content1 .circle-box .circle:not(:last-child)::before{
content:'';
position: absolute;
width: 2px;
height: 16px;
background-color: #fff;
right: calc(33px/2);
}
.m211 .section2 .content1 .circle-box .circle:not(:last-child)::after{
content:'';
position: absolute;
width: 16px;
height: 2px;
background-color: #fff;
right: 9px;
}
.m211 .section2 .content1 .circle-box .circle p{
font-weight: 500;
font-size: var(--font-size-26);
color: #fff;
}

.m212 .section1 .content1 .box {
border-radius: 13px;
padding: 103px 7.3vw;
}
.m212 .section1 .content1 .box1 {
background: url(/images/page/m212_img2.png) no-repeat center / cover;
}
.m212 .section1 .content1 .box2 {
margin-top: 80px;
background: url(/images/page/m212_img3.png) no-repeat center / cover;
}
.m212 .section1 .content1 .box2 .box-wrap {
margin-left: auto;
width: 50%;
}
.m212 .section1 .content1 .content-title {
color: #fff;
margin-top: 40px;
}
.m212 .section1 .content1 .content-text {
color: #fff;
margin-top: 30px;
}
.m212 .section1 .content2 {
margin-top: 160px;
}
.m212 .section1 .content2 .content-title {
text-align: center;
}
.m212 .section1 .content2 .content-text {
text-align: center;
color: #666;
margin-top: 30px;
padding-top: 70px;
position: relative;	
}
.m212 .section1 .content2 .content-text::before{
content:'';
position: absolute;
top:0;
left:50%;
transform: translateX(-50%);
width: 1px;
height: 40px;
background-color: rgba(0,0,0,0.5);
}
.m212 .section1 .content2 .box-container {
margin-top: 155px;
padding: 88.5px 0;
position: relative;
}
.m212 .section1 .content2 .box-container::before{
content:'';
position: absolute;
width: 50%;
height: 100%;
background: url(/images/page/m212_img4.png) no-repeat center / cover;
top:0;
left:0;
z-index: -1;
border-radius: 13px;
}
.m212 .section1 .content2 .box {
width: 60%;
margin-left: auto;
background: #F2EDE0;
border-radius: 13px;
padding: 120px 100px;
}
.m212 .section1 .content2 .box .box-subTitle {
margin-top: 15px;
font-size: var(--font-size-22);
color: #000;
display: inline-block;	
}
.m212 .section1 .content2 .box .box-text {
margin-top: 32px;
color: #666;
}
.m212 .section1 .content3 {
margin-top: 200px;
}
.m212 .section1 .content3 .img-box {
margin-top: 100px;
}
.m212 .section1 .content3 .img-title {
font-size: var(--font-size-26);
color: #000;
}
.m212 .section1 .content3 .img-wrap {
margin-top: 90px;
}
.m212 .section1 .content3 .img-caption {
margin-top: 50px;
}
.m212 .section1 .content3 .img-caption p {
font-size: var(--font-size-18);
color: #666;
}
.m212 .section1 .content3 .img-caption span {
color: #266EF0;
margin-right: 5px;
}
.m212 .section1 .content3 .box2 {
margin-top: 200px;
}
.m212 .section2 {
margin-top: 200px;
margin-bottom: 170px;
}
.m212 .section2 .content1 {
display: flex; 
align-items: flex-start;
justify-content: space-between;
}
.m212 .section2 .content1 .content-text {
color: #666;
}
.m212 .section2 .content2 {
margin-top: 100px;
height: 650px;
border-radius: 13px;
background: url(/images/page/m212_img8.png) no-repeat center / cover;
}

.m213{}
.m213 .section1 .content1 {}
.m213 .section1 .content1 .box1 {
display: flex;
align-items: center;
gap:100px;
}
.m213 .section1 .content1 .box1 .thumb-box,
.m213 .section1 .content1 .box1 .text-box {
width: 50%;
}
.m213 .section1 .content1 .box1 .thumb-box img {
border-radius: 13px;
}
.m213 .section1 .content1 .box1 .text-box .content-title {
margin-top: 40px;
}
.m213 .section1 .content1 .box1 .text-box .content-text {
margin-top: 30px;
color: #666;
}
.m213 .section1 .content1 .box2 {
margin-top: 80px;
background: url(/images/page/m213_img3.png) no-repeat center / cover;
border-radius: 13px;
padding: 103px 0;
}
.m213 .section1 .content1 .box2 .box-wrap {
width: 50%;
margin-left: auto;
}
.m213 .section1 .content1 .box2 .content-title {
margin-top: 40px;
color: #fff;
}
.m213 .section1 .content1 .box2  .content-text {
margin-top: 30px;
color: #fff;
}
.m213 .section1 .content1 .box3 {
display: flex;
align-items: center;
gap:100px;
margin-top: 80px;
}
.m213 .section1 .content1 .box3 .thumb-box,
.m213 .section1 .content1 .box3 .text-box {
width: 50%;
}
.m213 .section1 .content1 .box3 .thumb-box img {
border-radius: 13px;
}
.m213 .section1 .content1 .box3 .text-box .content-title {
margin-top: 40px;
}
.m213 .section1 .content1 .box3 .text-box .content-text {
margin-top: 30px;
color: #666;
}
.m213 .section1 .content1 .box4 {
display: flex;
align-items: center;
gap:100px;
margin-top: 80px;
}
.m213 .section1 .content1 .box4 .text-box {
width: 45%;
}
.m213 .section1 .content1 .box4 .thumb-box {
width: 55%;
}
.m213 .section1 .content1 .box4 .thumb-box img {
border-radius: 13px;
}
.m213 .section1 .content1 .box4 .text-box .content-title {
margin-top: 40px;
}
.m213 .section1 .content1 .box4 .text-box .content-text {
margin-top: 30px;
color: #666;
}
.m213 .section1 .content1 .box5 {
margin-top: 200px;
}
.m213 .section1 .content1 .box5 .img-box{
margin-top: 70px;
}
.m213 .section2 {
margin-top: 200px;
margin-bottom: 170px;
}
.m213 .section2 .content1 .content-text{
margin-top: 32px;
color: #666;
}
.m213 .section2 .content2 {
margin-top: 100px;
display: flex;
align-items: flex-start;
justify-content: space-between;
gap:30px;
}
.m213 .section2 .content2 .box {
border-radius: 13px;
padding: 50px 60px;
height: 360px;
flex:1;
display: flex;
flex-direction: column;
}
.m213 .section2 .content2 .box1 {
background: url(/images/page/m213_img7.png) no-repeat center / cover;
}
.m213 .section2 .content2 .box2 {
background: url(/images/page/m213_img8.png) no-repeat center / cover;
}
.m213 .section2 .content2 .box3 {
background: url(/images/page/m213_img9.png) no-repeat center / cover;
}
.m213 .section2 .content2 .box p {
color: #fff;
font-size: var(--font-size-26);
margin-top: auto;
}


.m214 .section1 .content1 .box1 {
display: flex;
position: relative;
padding: 80px 80px 80px 0;
align-items: center;
justify-content: space-between;
}
.m214 .section1 .content1 .box1::after {
content:'';
position: absolute;
border-radius: 13px;
width: 25%;
height: 100%;
background-color: #4B7CD4;
top:0;
right: 0;
}
.m214 .section1 .content1 .box1 .text-box {
position: relative;
z-index: 1;
width: 50%;
}
.m214 .section1 .content1 .box1 .content-title {
margin-top: 40px;
}
.m214 .section1 .content1 .box1 .content-text {
margin-top: 30px;
color: #666;
}
.m214 .section1 .content1 .box1 .thumb-box {
position: relative;
z-index: 1;
width: calc(50% - 80px);
}
.m214 .section1 .content1 .box1 .thumb-box  img{
border-radius: 13px;
}
.m214 .section1 .content1 .box2 {
margin-top: 105px;
background: url(/images/page/m214_img3.png) no-repeat center / cover;
border-radius: 13px;
padding:103px 0;
}
.m214 .section1 .content1 .box2 .box-wrap {
width: 50%;
margin-left: auto;
}
.m214 .section1 .content1 .box2 .content-title {
margin-top: 40px;
color: #fff;
}
.m214 .section1 .content1 .box2 .content-text {
margin-top: 30px;
color: #fff;
}
.m214 .section1 .content1 .box3 {
display: flex;
align-items: center;
gap:100px;
margin-top: 80px;
}
.m214 .section1 .content1 .box3 .text-box {
width: 50%;
}
.m214 .section1 .content1 .box3 .video-box{
width: 50%;
aspect-ratio: 820 / 600;
position: relative;
}
.m214 .section1 .content1 .box3 .video-box video {
border-radius: 13px;
width: 100%;
height: 100%;
object-position: center;
object-fit: cover;
}
.m214 .section1 .content1 .box3 .video-box .play-button{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.m214 .section1 .content1 .box3 .video-box .play-button::before{
content:'';
position: absolute;
width: 135%;
height: 135%;
border: 1.6px solid #fff;
opacity: 0.12;
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.m214 .section1 .content1 .box3 .video-box .play-button button{
background: none;
border: 1.6px solid #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
width: 142px;
height: 142px;
position: relative;	
}

.m214 .section1 .content1 .box3 .video-box .play-button button::before{
content:'';
position: absolute;
width: 115%;
height: 115%;
border: 1.6px solid #fff;
opacity: 0.5;
border-radius: 50%;
}

.m214 .section1 .content1 .box3 .video-box .play-button button::after{
content:'';
position: absolute;
width: 125%;
height: 125%;
border: 1.6px solid #fff;
opacity: 0.25;
border-radius: 50%;
}

.m214 .section1 .content1 .box3 .video-box .play-button{
opacity: 0; transition:all 0.4s 1.2s;
}

.m214 .section1 .content1 .box3 .video-box .play-button{
opacity: 1;
}

.m214 .section1 .content1 .box3 .video-box .play-button::before{
animation: opacityAni3 3.4s infinite linear;
animation-delay: 0.2s;
}

.m214 .section1 .content1 .box3 .video-box .play-button button::before{
animation: opacityAni1 3s infinite linear;
animation-delay: 0.1s;
}

.m214 .section1 .content1 .box3 .video-box .play-button button::after{
animation: opacityAni2 3.2s infinite linear;
animation-delay: 0.15s;
}

@keyframes opacityAni1 {
  0% { opacity: 0; }
  33.3% { opacity: 0.5; }
  100% { opacity: 0; }
}

@keyframes opacityAni2 {
  0% { opacity: 0; }
  33.3% { opacity: 0.25; }
  100% { opacity: 0; }
}

@keyframes opacityAni3 {
  0% { opacity: 0; }
  33.3% { opacity: 0.12; }
  100% { opacity: 0; }
}

.m214 .section1 .content1 .box3 .text-box .content-title {
margin-top: 40px;
}
.m214 .section1 .content1 .box3 .text-box .content-text {
margin-top: 30px;
color: #666;
}
.m214 .section1 .content1 .box4 {
margin-top: 200px;
}
.m214 .section1 .content1 .box4 .img-box {
margin-top: 70px;
}
.m214 .section2{
margin-top: 200px;
}
.m214 .section2 .content1 .box1 {
display: flex;
align-items: center;
gap:100px;
margin-top: 80px;
}
.m214 .section2 .content1 .box1 .thumb-box,
.m214 .section2 .content1 .box1 .text-box {
width: 50%;
}
.m214 .section2 .content1 .box1 .thumb-box img {
border-radius: 13px;
}
.m214 .section2 .content1 .box1 .text-box .content-title {
margin-top: 40px;
}
.m214 .section2 .content1 .box1 .text-box .content-text {
margin-top: 30px;
color: #666;
}
.m214 .section2 .content1 .box2 {
margin-top: 105px;
background: url(/images/page/m214_img7.png) no-repeat center / cover;
border-radius: 13px;
padding:103px 0;
}
.m214 .section2 .content1 .box2 .box-wrap {
width: 50%;
margin-left: auto;
}
.m214 .section2 .content1 .box2 .content-title {
margin-top: 40px;
color: #fff;
}
.m214 .section2 .content1 .box2 .content-text {
margin-top: 30px;
color: #fff;
}
.m214 .section2 .content1 .box3 {
display: flex;
align-items: center;
gap:100px;
margin-top: 80px;
}
.m214 .section2 .content1 .box3 .thumb-box,
.m214 .section2 .content1 .box3 .text-box {
width: 50%;
}
.m214 .section2 .content1 .box3 .thumb-box img {
border-radius: 13px;
}
.m214 .section2 .content1 .box3 .text-box .content-title {
margin-top: 40px;
}
.m214 .section2 .content1 .box3 .text-box .content-text {
margin-top: 30px;
color: #666;
}
.m214 .section2 .content1 .box4 {
margin-top: 140px;
}
.m214 .section2 .content1 .box4 .img-box {
margin-top: 70px;
}
.m214 .section3 {
margin-top: 200px;
}
.m214 .section3 .content1 .content-title {
text-align: center;
}
.m214 .section3 .content1 .content-text {
text-align: center;
margin-top: 32px;
color: #666;
}
.m214 .section3 .content2 {
background: url(/images/page/m214_img10.png) no-repeat center / cover;
padding: 140px;
margin-top: 90px;
}
.m214 .section3 .content2 .box {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.m214 .section3 .content2 .box-title {
color: #fff;
}
.m214 .section3 .content2 .box .box-content {
padding: 100px;
text-align: center;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 13px;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
display: flex;
align-items: center;
justify-content: space-between;
}
.m214 .section3 .content2 .box .box-content .box-textarea {
margin-left: 60px;
padding-left: 60px;
border-left: 1px solid rgba(255, 255, 255, 0.3);
text-align: left;
}
.m214 .section3 .content2 .box .box-content .box-year {
font-size: var(--font-size-22);
color: #333;
font-weight: 600;
padding: 10px 20px;
background-color: #fff;
border-radius: 13px;
display: inline-block;
}
.m214 .section3 .content2 .box .box-content .box-text {
margin-top: 15px;
font-size: var(--font-size-26);
color: #fff;
}


/* m30 */
.m31{}
.m31 .section1{
	position: relative;
	padding: 220px 0;
	/* background: url(/images/page/m31_sec1_bgIcon.png) no-repeat right 10% top 10% #F2EDE0; */
	background: #F2EDE0;
}
.m31 .section1 .bgImg{
	position:absolute;right:8%;top:10%;
	width:515px;
	display:flex;justify-content:space-between;gap:44px;
}
.m31 .section1 .bgImg>div:nth-child(1){aspect-ratio:167/551;width:32.42%;transform:rotateY(180deg);}
.m31 .section1 .bgImg>div:nth-child(2){aspect-ratio:304/1004;width:59.02%;}
.m31 .section1 .bgImg>div svg{width:100%;height:100%;opacity:0.2;}
.m31 .section1 .bgImg>div svg path{
    fill: none;
    stroke: #36312E;
    stroke-width: 1;
	stroke-dasharray: var(--path-length);
	stroke-dashoffset: var(--path-length);
}
.m31 .section1 .bgImg>div svg path{animation:draw 5s ease-in-out forwards;}

@keyframes draw{
	to {
		stroke-dashoffset: 0;
	}
}
.m31 .section1 .boxwrap{
	position: relative;
	z-index: 5;
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
}
.m31 .section1 .boxwrap .box{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	width: calc((100% - 36px ) / 3);
	aspect-ratio: 526 / 440;
	border-radius: 13px;
	padding: 50px;
	overflow: hidden;
}
.m31 .section1 .boxwrap .box .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.m31 .section1 .boxwrap .box1 .bg{background: url(/images/page/m31_sec1_bg1.jpg) no-repeat center / cover;}
.m31 .section1 .boxwrap .box2 .bg{background: url(/images/page/m31_sec1_bg2.jpg) no-repeat center / cover;}
.m31 .section1 .boxwrap .box3 .bg{background: url(/images/page/m31_sec1_bg3.jpg) no-repeat center / cover;}
.m31 .section1 .boxwrap .box4 .bg{background: url(/images/page/m31_sec1_bg4.jpg) no-repeat center / cover;}
.m31 .section1 .boxwrap .box5 .bg{background: url(/images/page/m31_sec1_bg5.jpg) no-repeat center / cover;}
.m31 .section1 .boxwrap .box6 .bg{background: url(/images/page/m31_sec1_bg6.jpg) no-repeat center / cover;}
.m31 .section1 .boxwrap .box .bg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m31 .section1 .boxwrap .box .icon{
	position: relative;
}
.m31 .section1 .boxwrap .box .tit{
	position: relative;
	font-size: var(--font-size-34);
	font-weight: 500;
	color: #fff;
	margin: 20px 0 15px;
}
.m31 .section1 .boxwrap .box .slg{
	position: relative;
	font-size: var(--font-size-18);
	color: #fff;
}
.m31 .section1 .boxwrap .box .con{
	position: relative;
	font-size: var(--font-size-18);
	color: #fff;
	line-height: 1.5em;
	margin-top: 30px;
}
.m31 .section1 .boxwrap .box:hover .bg{
	filter: blur(10px);
}


.m32{}
.m32 .section1{
	padding: 200px 0;
	background: #F2EDE0;
}
.m32 .section1 .sec_tit{
	font-size: var(--font-size-38);
	font-weight: 500;
	margin-bottom: 80px;
}
.m32 .section1 ul{
	display: flex;
	flex-direction: column;
	gap: 15px;
}
.m32 .section1 li{
	width: 100%;
	padding: 35px 30px;
	border-radius: 13px;
	background: #fff;
	border: 1px solid #b3b3b3;
	display: flex;
	align-items: center;
}
.m32 .section1 li .num{
	width: 66px;
	height: 66px;
	line-height: 66px;
	border-radius: 13px;
	text-align: center;
	background: #666;
	font-size: var(--font-size-20);
	font-weight: 500;
	color: #fff;
}
.m32 .section1 li dl{
	width: calc(100% - 66px - 35px);
	padding-left: 35px;
	margin-left: 35px;
	border-left: 1px solid #ccc;
}
.m32 .section1 li dl dt{
	font-size: var(--font-size-26);
	font-weight: 500;
}
.m32 .section1 li dl dd{
	font-size: var(--font-size-18);
	margin-top: 10px;
	color: #666;
}
.m32 .section1 .linkWrap{
	overflow:hidden;
	position:relative;
	width:100%;height:420px;
	border-radius:15px;
	display:flex;align-items:center;justify-content:center;
	text-align:center;
	margin-top: 120px;
}
.m32 .section1 .linkWrap .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	background:url(/images/page/m32_link_bg.jpg) no-repeat center;
	background-size:cover;
}
.m32 .section1 .linkWrap .bg + div{position:relative;z-index:10;}
.m32 .section1 .linkWrap .bg + div .txt{font-size:34px;color:#fff;font-weight:500;line-height:1.3em;}
.m32 .section1 .linkWrap .bg + div a{
	display:flex;align-items:center;justify-content:center;
	position:relative;
	overflow:hidden;
	width:286px;height:56px;
	margin:45px auto 0;
	border:1px solid #fff;border-radius:30px;
	font-size:14px;color:#fff;
}
.m32 .section1 .linkWrap .bg + div a i{
	display:inline-block;
	width:8px;aspect-ratio:1/1;
	margin-left:14px;
	background:url(/images/page/icon_link.png) no-repeat;
	background-size:cover;
}

.m32 .section1 .linkWrap .bg + div a:before{
	display:block;content:"";
	width:50%;height:100%;
	position:absolute;left:0;top:0;
	background:#000;
	transform:scaleX(0);transform-origin:left;
	transition:all 0.4s;
}
.m32 .section1 .linkWrap .bg + div a:after{
	display:block;content:"";
	width:50%;height:100%;
	position:absolute;right:0;top:0;
	background:#000;
	transform:scaleX(0);transform-origin:right;
	transition:all 0.4s;
}
.m32 .section1 .linkWrap .bg + div a span{display:flex;align-items:center;justify-content:space-between;
width:100%;position:relative;z-index:10;padding:0 20px;}
.m32 .section1 .linkWrap .bg + div a span i{
	display:inline-block;
	width:24px;height:24px;
	background:url(/images/main/arr2.png) no-repeat;
	background-size:cover;
	transition:all 0.4s;
}
.m32 .section1 .linkWrap .bg + div a:hover{color:#fff;}
.m32 .section1 .linkWrap .bg + div a:hover:before{transform:scaleX(1);}
.m32 .section1 .linkWrap .bg + div a:hover:after{transform:scaleX(1);}
.m32 .section1 .linkWrap .bg + div a:hover span i{
	background:url(/images/main/arr2.png) no-repeat;
	background-size:cover;
}


.m33{}
.m33 .section1{
	padding: 0 0 200px;
}
.m33 .section1 .sec_tit{
	font-size: var(--font-size-38);
	font-weight: 500;
	margin-bottom: 80px;
}
.m33 .section1 .boxwrap{
	display: flex;
	gap: 40px;
}
.m33 .section1 .boxwrap .box{
	position: relative;
	width: calc((100% - 80px) / 3);
	aspect-ratio: 1;
	border-radius: 13px;
	padding: 60px;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	overflow: hidden;
}
.m33 .section1 .boxwrap .box .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.m33 .section1 .boxwrap .box1 .bg{background: url(/images/page/m33_sec1_bg1.jpg) no-repeat center / cover;}
.m33 .section1 .boxwrap .box2 .bg{background: url(/images/page/m33_sec1_bg2.jpg) no-repeat center / cover;}
.m33 .section1 .boxwrap .box3 .bg{background: url(/images/page/m33_sec1_bg3.jpg) no-repeat center / cover;}
.m33 .section1 .boxwrap .box p{
	position: relative;
	font-size: var(--font-size-38);
	font-weight: 500;
	color: #fff;
}

.m33 .section2{
	position: relative;
	width: 100%;
	padding: 100px 0;
	overflow: hidden;
}
.m33 .section2 .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/page/m33_sec2_bg.jpg) no-repeat center / cover;
}
.m33 .section2 dl{
	position: relative;
	display: flex;
	padding: 80px 0;
	border-bottom: 1px solid rgba(255,255,255,0.5);
}
.m33 .section2 dl:last-child{
	border-bottom: none;
}
.m33 .section2 dl dt{
	width: 50%;
	padding-right: 5%;
	font-size: var(--font-size-34);
	font-weight: 500;
	line-height: 1.4em;
	color: #fff;
}
.m33 .section2 dl dd{
	width: 50%;
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #fff;
}



.m41{}
.m41 .section1{
	padding: 0 0 200px;
}
.m41 .section1 .titwrap{
	padding-top: 30px;
	border-top: 1px solid #ccc;
	display: flex;
}
.m41 .section1 .titwrap .tit{
	width: 50%;
	font-size: var(--font-size-38);
	font-weight: 500;
}
.m41 .section1 .titwrap p{
	width: 50%;
	font-size: var(--font-size-18);
	font-weight: 500;
	line-height: 1.7em;
	color: #666;
	padding-left: 60px;
	border-left: 1px solid #ccc;
}
.m41 .section1 .ccwrap{
	position: relative;
	margin-top: 90px;
	display: flex;
	justify-content: space-between;
}
.m41 .section1 .ccwrap .left{
	display: flex;
}
.m41 .section1 .ccwrap .cc{
	position: relative;
	z-index: 2;
	width: 474px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: rgba(38, 110, 240, 0.1);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}
@media (max-width: 1599px){
	.m41 .section1 .ccwrap .cc{
		width: 400px;
	}
}
.m41 .section1 .ccwrap .cc .tit{
	font-size: var(--font-size-38);
	font-weight: 500;
	color: #266EF0;
}
.m41 .section1 .ccwrap .cc p{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #266EF0;
	margin-top: 20px;
}
.m41 .section1 .ccwrap .cc .icon{
	margin-bottom: 20px;
}
.m41 .section1 .ccwrap .cc2{
	position: relative;
	margin-left: -60px;
}
.m41 .section1 .ccwrap .cc2:after{
	content: "";
	position: absolute;
	left: 100%;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	height: 2px;
	background: #266EF0;
}

.m41 .section1 .ccwrap .cc3{
	position: relative;
	z-index: 3;
	background: #266EF0;
}
.m41 .section1 .ccwrap .cc3 .tit{
	color: #fff;
}
.m41 .section1 .ccwrap .cc3 p{
	color: #fff;
}
.m41 .section2{
	position: relative;
	background: #000;
	overflow: hidden;
	padding: 180px 0 90px;
}
.m41 .section2 .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: all 0.3s;
}
.m41 .section2 .bg.on{
	opacity: 1;
}
.m41 .section2 .bg1{background: url(/images/page/m41_sec2_con1_bg.jpg) no-repeat center / cover;}
.m41 .section2 .bg2{background: url(/images/page/m41_sec2_con2_bg.jpg) no-repeat center / cover;}
.m41 .section2 .bg3{background: url(/images/page/m41_sec2_con3_bg.jpg) no-repeat center / cover;}

.m41 .section2 .cont{
	position: relative;
	overflow: hidden;
}


.m41 .section2 .conwrap{
	position: relative;
	display: flex;
	justify-content: space-between;
}
.m41 .section2 .conwrap .txtwrap{
	width: 940px;
	padding-right:5%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.m41 .section2 .conwrap .txtwrap .titwrap{

}
.m41 .section2 .conwrap .txtwrap .titwrap .tit{
	font-size: var(--font-size-60);
	font-weight: 500;
	color: #fff;
}
.m41 .section2 .conwrap .txtwrap .titwrap p{
	font-size: var(--font-size-26);
	font-weight: 500;
	color: rgba(255,255,255,0.8);
	margin-top: 20px;
	line-height: 1.4em;
}
.m41 .section2 .conwrap .txtwrap .con{

}
.m41 .section2 .conwrap .txtwrap .con .slg{
	font-size: var(--font-size-26);
	font-weight: 500;
	color: rgba(255,255,255,0.8);
	margin-bottom: 40px;
}
.m41 .section2 .conwrap .txtwrap .con ul{
	display: flex;
	flex-wrap: wrap;
	column-gap: 27px;
	row-gap: 33px;
}
.m41 .section2 .conwrap .txtwrap .con li{
	width: calc((100% - 27px) / 2);
	display: flex;
	align-items: center;
}
.m41 .section2 .conwrap .txtwrap .con li .icon{
	width: 70px;
}
.m41 .section2 .conwrap .txtwrap .con li dl{
	width: calc(100% - 70px);
	padding: 0 10px;
}
.m41 .section2 .conwrap .txtwrap .con li dl dt{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #fff;
}
.m41 .section2 .conwrap .txtwrap .con li dl dd{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: rgba(255,255,255,0.8);
}

.m41 .section2 .conwrap .imgwrap{
	width: calc(100% - 940px);
	height: 547px;
	border-radius: 13px;
	overflow: hidden;
}
.m41 .section2 .conwrap .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.m41 .section2 .btnwrap{
	margin-top: 110px;
	display: flex;
	justify-content: space-between;
}
.m41 .section2 .btnwrap li{
	width: 30%;
	cursor: pointer;
}
.m41 .section2 .btnwrap li .num{
	font-size: var(--font-size-18);
	color: rgba(255,255,255,0.5);
}
.m41 .section2 .btnwrap li .line{
	position: relative;
	width: 100%;
	height: 2px;
	background:rgba(255,255,255,0.2);
	margin: 32px 0;
}
.m41 .section2 .btnwrap li .line:after{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 2px;
	background: #fff;
	transition: all 0.3s;
}
.m41 .section2 .btnwrap li .cate{
	font-size: var(--font-size-26);
	font-weight: 500;
	color: rgba(255,255,255,0.7);
}

.m41 .section2 .btnwrap li.on .num{
	color: rgba(255,255,255,1);
}
.m41 .section2 .btnwrap li.on .line:after{
	width: 100%;
}
.m41 .section2 .btnwrap li.on .cate{
	color: rgba(255,255,255,1);
}

.m41 .section3{
	padding: 200px 0;
}
.m41 .section3 .titwrap{

}
.m41 .section3 .titwrap .txt1{
	font-size: var(--font-size-38);
	font-weight: 500;
}
.m41 .section3 .titwrap .txt2{
	font-size: var(--font-size-20);
	font-weight: 500;
	margin: 30px 0 20px;
}
.m41 .section3 .titwrap p{
	font-size: var(--font-size-18);
	color: #333;
}

.m41 .section3 .conwrap{
	margin: 100px 0 200px;
	display: flex;
	justify-content: space-between;
}
.m41 .section3 .conwrap .con{
	display: flex;
	width: 48%;
}
.m41 .section3 .conwrap .con .imgwrap{
	width: 210px;
	height: 360px;
	border-radius: 15px;
	overflow: hidden;
}
.m41 .section3 .conwrap .con .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m41 .section3 .conwrap .con .txtwrap{
	width: calc(100% - 210px - 15px);
	margin-left: 15px;
	height: 360px;
	border-radius: 15px;
	background: #FBFBFB;
	padding: 60px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.m41 .section3 .conwrap .con .txtwrap .titwrap{
	display: flex;
	justify-content: space-between;
}
.m41 .section3 .conwrap .con .txtwrap .titwrap .tit{
	flex-shrink: 1;
	font-size: var(--font-size-26);
	font-weight: 500;
}
.m41 .section3 .conwrap .con .txtwrap .titwrap .icon{
	flex-shrink: 0;
}
.m41 .section3 .conwrap .con .txtwrap p{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #666;
}
.m41 .section3 .slgwrap{
	position: relative;
	width: 100%;
	padding: 120px 4%;
	border-radius: 15px;
	overflow: hidden;
}
.m41 .section3 .slgwrap .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/page/m41_sec3_slg_bg.jpg) no-repeat center / cover;
}
.m41 .section3 .slgwrap .txt{
	width: 100%;
	position: relative;
	font-size: var(--font-size-34);
	font-weight: 500;
	line-height: 1.4em;
	color: #fff;
	text-align: center;
}


.m42 .section1{
	padding: 0 0 120px;
}
.m42 .section1 .conwrap{
	width: 98%;
	max-width: 1880px;
	margin: 0 auto;
	overflow: hidden;
}
.m42 .section1 .conwrap .con{
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: 720px;
	border-radius: 13px;
	overflow: hidden;
	margin-bottom: 20px;
}
.m42 .section1 .conwrap .con .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.m42 .section1 .conwrap .con.con1 .bg{
	background: 
        linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)), /* 어둡게 하는 레이어 */
        url(/images/page/m42_bg1.jpg) no-repeat center / cover;
    background-blend-mode: multiply; 
}
.m42 .section1 .conwrap .con.con2 .bg{
	background: 
        linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)), /* 어둡게 하는 레이어 */
        url(/images/page/m42_bg2.jpg) no-repeat center / cover;
    background-blend-mode: multiply; 
}
.m42 .section1 .conwrap .con.con3 .bg{
	background: 
        linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)), /* 어둡게 하는 레이어 */
        url(/images/page/m42_bg3.jpg) no-repeat center / cover;
    background-blend-mode: multiply; 
}
.m42 .section1 .conwrap .con .txtwrap{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 92%;
	max-width: 1640px;
}
.m42 .section1 .conwrap .con .txtwrap .tit{
	font-size: var(--font-size-60);
	font-weight: 500;
	color: #fff;
}
.m42 .section1 .conwrap .con .txtwrap ul{
	margin-top: 30px;
}
.m42 .section1 .conwrap .con .txtwrap li{
	position: relative;
	padding-left: 20px;
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #fff;
}
.m42 .section1 .conwrap .con .txtwrap li:after{
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	border: 2px solid #fff;
	box-sizing: border-box;
}





.searchTop{
	display: flex;
	justify-content: space-between;
}
.searchTop .total{
	font-size: 20px;
	font-weight: 500;
	color: #666;
}
.searchTop .total span{
	color: #000;
}
.searchTop .searchwrap{
	width:400px;
	height:70px;
	border-radius:70px;
	display: flex;
	align-items:center;
	padding: 0 30px;
	border: 1px solid #ccc;
}
.searchTop .searchwrap .search_bar{
width:calc(100% - 25px);height:100%;
border:none;outline:none;
font-size:18px;color:#000;
}
.searchTop .searchwrap .search_bar::placeholder{font:inherit;color:#999;}
.searchTop .searchwrap button{
	width:25px;
	border: none;
	background: none;
}

.bbs{}
.bbs .section1{
	padding: 0 0 200px;
}
.bbs .list{
	border-top: 2px solid #000;
	margin-top: 40px;
}
.bbs .list li{
	width: 100%;
	border-bottom: 1px solid #ccc;
}
.bbs .list li a{
	width: 100%;
	padding: 40px;
	display: flex;
	align-items: center;
}
.bbs .list li a .thumb{
	width: 576px;
	height: 335px;
	border-radius: 13px;
	overflow: hidden;
}
.bbs .list li a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 1s;
}
.bbs .list li a:hover .thumb img{
	transform: scale(1.05);
}
.bbs .list li a .txtwrap{
	width: calc(100% - 576px);
	padding-left: 100px;
}
.bbs .list li a .txtwrap .tit{
	font-size: var(--font-size-26);
	font-weight: 500;
	color: #000;
}
.bbs .list li a:hover .txtwrap .tit{
	text-decoration: underline;
	text-underline-offset: 4px;
}
.bbs .list li a .txtwrap .con{
	margin: 20px 0;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-size: var(--font-size-20);
	line-height: 1.6em;
	height: 3.2em;
	color: #666;
}
.bbs .list li a .txtwrap .date{
	font-size: var(--font-size-20);
	color: #666;
}

.bbs_view{}
.bbs_view .section1{
	padding:  0 0 200px;
}
.bbs_view .section1 .titwrap{
	width: 100%;
	padding: 70px 4%;
	border-top: 1px solid #000;
	border-bottom: 1px solid #ccc;
	text-align: center;
}
.bbs_view .section1 .titwrap .tit{
	font-size: 34px;
	font-weight: 500;
	color: #000;
}
.bbs_view .section1 .titwrap .date{
	font-size: 20px;
	color: #666;
	margin: 30px 0 0;
}
.bbs_view .section1 .titwrap .filewrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
	margin-top: 30px;
}
.bbs_view .section1 .titwrap .filewrap dl{
	display: flex;
}
.bbs_view .section1 .titwrap .filewrap dl dt{
	position: relative;
	font-size: 18px;
	font-weight: 500;
	color: #666;
	padding-right: 26px;
}
.bbs_view .section1 .titwrap .filewrap dl dt img{
	margin-right: 10px;
}
.bbs_view .section1 .titwrap .filewrap dl dt:after{
	content: "";
	position: absolute;
	right: 12px;
	top: 2px;
	width: 1px;
	height: 18px;
	background: rgba(0,0,0,0.2);
}
.bbs_view .section1 .titwrap .filewrap dl dd a{
	font-size: 18px;
	color: #666;
}
.bbs_view .section1 .conwrap{
	padding: 80px 0 120px;
}
.bbs_btn{
	padding-top: 80px;
	text-align: center;
	border-top: 1px solid #ccc;
}
.bbs_btn a{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 185px;
	height: 50px;
	border-radius: 50px;
	background: #111;
}
.bbs_btn a span{
	font-size: 18px;
	color: #fff;
}
.bbs_btn a > div{
	width: 20px;
	margin-left: 10px;
}
.bbs_btn a > div > div{
	width: 100%;
	height:2px;
	border-radius: 2px;
	background: #fff;
}
.bbs_btn a > div > div + div{
	margin-top: 3px;
}





/* m53 */
.m53{}
.m53 .linkWrap{
	overflow:hidden;
	position:relative;
	width:100%;height:420px;
	border-radius:15px;
	display:flex;align-items:center;justify-content:center;
	text-align:center;
}
.m53 .linkWrap .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	background:url(/images/page/m53_bg.jpg) no-repeat center;
	background-size:cover;
}
.m53 .linkWrap .bg + div{position:relative;z-index:10;}
.m53 .linkWrap .bg + div .txt{font-size:34px;color:#fff;font-weight:500;line-height:1.3em;}
.m53 .linkWrap .bg + div a{
	display:flex;align-items:center;justify-content:center;
	position:relative;
	overflow:hidden;
	width:286px;height:56px;
	margin:45px auto 0;
	border:1px solid #fff;border-radius:30px;
	font-size:14px;color:#fff;
}
.m53 .linkWrap .bg + div a i{
	display:inline-block;
	width:8px;aspect-ratio:1/1;
	margin-left:14px;
	background:url(/images/page/icon_link.png) no-repeat;
	background-size:cover;
}

.m53 .linkWrap .bg + div a:before{
	display:block;content:"";
	width:50%;height:100%;
	position:absolute;left:0;top:0;
	background:#000;
	transform:scaleX(0);transform-origin:left;
	transition:all 0.4s;
}
.m53 .linkWrap .bg + div a:after{
	display:block;content:"";
	width:50%;height:100%;
	position:absolute;right:0;top:0;
	background:#000;
	transform:scaleX(0);transform-origin:right;
	transition:all 0.4s;
}
.m53 .linkWrap .bg + div a span{display:flex;align-items:center;justify-content:space-between;
width:100%;position:relative;z-index:10;padding:0 20px;}
.m53 .linkWrap .bg + div a span i{
	display:inline-block;
	width:24px;height:24px;
	background:url(/images/main/arr2.png) no-repeat;
	background-size:cover;
	transition:all 0.4s;
}
.m53 .linkWrap .bg + div a:hover{color:#fff;}
.m53 .linkWrap .bg + div a:hover:before{transform:scaleX(1);}
.m53 .linkWrap .bg + div a:hover:after{transform:scaleX(1);}
.m53 .linkWrap .bg + div a:hover span i{
	background:url(/images/main/arr2.png) no-repeat;
	background-size:cover;
}






/* m60 */
.m60 section:last-child{
padding-bottom: 200px;
}

.m61{}

.m61 .section1{
background: url(/images/page/m61_bg1.png) no-repeat center / cover;
width: 100%;
height: 100%;
}

.m61 .section1 .content1 {
display: flex;
align-items: flex-start;
justify-content: space-between;
padding: 140px 0;
}

.m61 .section1 .content-title {
font-size: var(--font-size-60);
color: #fff;
font-weight: 600;
}

.m61 .section1 .content-content  {
width: 50%;
}

.m61 .section1 .contnet-list {
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
}

.m61 .section1 .contnet-list .list-item{
display: flex;
align-items: center;
justify-content: space-between;
padding: 34px 20px;
}

.m61 .section1 .contnet-list .list-item + .list-item {
border-top: 1px solid #fff;
}

.m61 .section1 .contnet-list .list-item p {
font-size: var(--font-size-26);
color: #fff;
}

.m61 .section1 .contnet-list .list-item p span {
font-size: var(--font-size-20);
color: #fff;
position: relative;
padding-right: 20px;
margin-right: 20px;
}

.m61 .section1 .contnet-list .list-item p span::after{
content:'';
position: absolute;
width: 1px;
height: 80%;
background-color: #D9D9D9;
top:0;	
right:0;
}

.m61 .section1 .content-content  > p {
text-align: right;
color: #fff;
font-size: var(--font-size-34);
margin-top: 50px;
}

.m61 .section2 {
margin-top: 200px;
}

.m61 .section2 .content{
display: flex;
align-items: center;
justify-content: space-between;
height: 600px;
gap:8vw;
}

.m61 .section2 .content + .content {
margin-top: 120px;
}

.m61 .section2 .content:nth-child(even) {
flex-direction: row-reverse;
}

.m61 .section2 .content .img-box,
.m61 .section2 .content .text-box{
width: 50%;
}

.m61 .section2 .content .img-box {
position: relative;
height: 100%;
}

.m61 .section2 .content1 .img-box::after {
content:'';
position: absolute;
background: url(/images/page/m61_img1.png) no-repeat center;
width: 118%;
height: 100%;
right: 0;
}

.m61 .section2 .content2 .img-box::after {
content:'';
position: absolute;
background: url(/images/page/m61_img2.png) no-repeat center;
width: 118%;
height: 100%;
left: 0;
}

.m61 .section2 .content3 .img-box::after {
content:'';
position: absolute;
background: url(/images/page/m61_img3.png) no-repeat center;
width: 118%;
height: 100%;
right: 0;
}

.m61 .section2 .content4 .img-box::after {
content:'';
position: absolute;
background: url(/images/page/m61_img4.png) no-repeat center;
width: 118%;
height: 100%;
left: 0;
}

.m61 .section2 .content .text-box{
display: flex;
gap:30px;
}

.m61 .section2 .content .text-box span{
color: var(--main-color);
font-size: var(--font-size-20);
margin-top: 10px;
}

.m61 .section2 .content .text-box h6{
font-size: var(--font-size-56);
font-weight: 500;
}

.m61 .section2 .content .text-box p{
font-size: var(--font-size-18);
color: #666;
line-height: 1.65;
margin-top: 40px;
}

.m62{}

.m62 .section-bg {
width: 100%;
height: 680px;
}

.m621 .section-bg {
background: url(/images/page/m62_cate1_bg1.png) no-repeat center / cover;
}

.m622 .section-bg {
background: url(/images/page/m62_cate2_bg1.png) no-repeat center / cover;
}

.m623 .section-bg {
background: url(/images/page/m62_cate3_bg1.png) no-repeat center / cover;
}

.m624 .section-bg {
background: url(/images/page/m62_cate4_bg1.png) no-repeat center / cover;
}

.m62 .section-container {
display: flex;
margin-top: 100px;
}

.m62 .section-container .section-title {
width: 35%;
font-size: var(--font-size-60);
font-weight: 600;
}

.m62 .section-container .section-content {
width: 65%;
border-top: 1px solid #000;
}

.m62 .contnet {
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}

.m62 .contnet .content-title_box {
padding: 40px;
display: flex;
align-items: center;
justify-content: space-between;
}

.m62 .contnet .content-title_box p {
font-size: var(--font-size-34);
font-weight: 600;
}

.m62 .contnet .content-title_box .content-button {
position: relative;
border: none;
}

.m62 .contnet .content-title_box .content-button::after {
content: "";
position: absolute;
width: 12px;
height: 12px;
border-right: 2px solid #111;
border-bottom: 2px solid #111;
top: calc(50% - 6px);
left: calc(50% - 6px);
transform: rotate(45deg);
transform-origin: center center;
transition: transform 0.4s;
}

.m62 .contnet .content-title_box.on .content-button::after {
transform: rotate(225deg);
}

.m62 .contnet .content-box {
overflow: hidden;
height: 0;
transition: all 0.4s;
}

.m62 .contnet .content-box .work-list{
padding: 20px 40px 60px;
}

.m62 .contnet .content-box .work-list .list-item{}

.m62 .contnet .content-box .work-list .list-item + .list-item{
margin-top: 40px;
}

.m62 .contnet .content-box .work-list .list-item strong {
font-size: var(--font-size-26);
font-weight: 600;
}

.m62 .contnet .content-box .work-list .list-item p {
font-size: var(--font-size-18);
color: #666;
line-height: 1.85;
margin-top: 20px;
}

.m63{}

.m63 .section1{
height: 300vh;

}

.m63 .section1 .section-wrap{
height: 100vh;
position: relative;
overflow: hidden;
}

.m63 .section1 .text-box{
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 2;
}

.m63 .section1 .text-box h5{
font-size: var(--font-size-60);
color: #000;
font-weight: 600;		
}

.m63 .section1 .text-box p{
margin-top: 30px;
font-size: var(--font-size-26);
color: #000;
}

.m63 .section1 .img-box {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
}

.m63 .section1 .img-box .img-center_box{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 420px;
height: 530px;
}

.m63 .section1 .img-box .img-list{}

.m63 .section1 .img-box .img-list .list-item{
position: absolute;
}

.m63 .section1 .img-box .img-list .list-item_center {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
transform: translate(-50%, -50%);
z-index: 2;
clip-path: inset(50% 50% 50% 50%);
}

.m63 .section1 .img-box .img-list .list-item_center img {
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(0.5);
transform-origin: center center;
}

.m63 .section1 .img-box .img-list .list-item img {
}

.m63 .section1 .img-box .img-list .list-item:nth-child(2){
top:0;
left:0;
}

.m63 .section1 .img-box .img-list .list-item:nth-child(3){
top:100px;
right: 0;
}

.m63 .section1 .img-box .img-list .list-item:nth-child(4){
bottom: -20%;
left: 140px;
}

.m63 .section1 .img-box .img-list .list-item:nth-child(5){
bottom: -20%;
right: 140px;
}

.m63 .section2{
margin-top: 160px;
}

.m63 .section2 .content1{
width: 100%;
display: grid;
grid-template-columns: repeat(3, 1fr);
justify-items: center;
border-top: 1px solid #000;
}

.m63 .section2 .content1 .box {
width: 100%;
}

.m63 .section2 .content1 .box {
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
padding: 60px  0;
}

.m63 .section2 .content1 .box-wrap {
padding: 0 40px;
position: relative;
}

.m63 .section2 .content1 .box:nth-child(3n-1) .box-wrap{
border-left: 1px solid rgba(0, 0, 0, 0.2);
border-right: 1px solid rgba(0, 0, 0, 0.2);

}

.m63 .section2 .content1 .box-text strong{
font-size: var(--font-size-34);
font-weight: 600;
}

.m63 .section2 .content1 .benefits-list {
margin-top: 30px;
}

.m63 .section2 .content1 .benefits-list .list-item{
font-size: var(--font-size-18);
color: #666;
line-height: 32px;
padding-left: 18px;
position: relative;
}

.m63 .section2 .content1 .benefits-list .list-item::before {
position: absolute;
content: '';
width: 6px;
height: 6px;
border-radius: 50%;
box-sizing: border-box;
border: 2px solid var(--main-color);
left: 0;
top: calc(32px / 2 - 3px);
}

.m63 .section2 .content1 .box-wrap img {
position: absolute;
top:0;
right: 40px;
}

.m64{}
.m64 .section1{
	padding: 0 0 200px;
}
.m64 .section1 .list{
	margin-top: 40px;
	border-top: 2px solid #000;
}
.m64 .section1 .list li{
	width: 100%;
	border-bottom: 1px solid #ccc;
	transition: all 1s;
}
.m64 .section1 .list li a{
	display: block;
	width: 100%;
	padding: 40px;
}
.m64 .section1 .list li a .status{
	display: inline-block;
	padding: 10px 20px;
	border-radius: 10px;
	background: #266EF0;
	font-size: 16px;
	color: #fff;
}
.m64 .section1 .list li.end a .status{
	background: #f1f1f1;
	color: #555;
}
.m64 .section1 .list li a .tit{
	width: fit-content;
	margin: 15px 0;
	font-size: 26px;
	font-weight: 500;
	color: #000;
	background-image: linear-gradient(to right, #000 0%, #000 100%);
	background-size: 0% 2px;
	background-repeat: no-repeat;
	background-position: left bottom;
	transition: background-size 0.5s ease;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}
.m64 .section1 .list li a:hover .tit{
	background-size: 100% 2px;
}
.m64 .section1 .list li a .date{
	font-size: 20px;
	color: #666;
}


.m64_view .section1 .titwrap .status{
	display: inline-block;
	padding: 10px 20px;
	border-radius: 10px;
	background: #266EF0;
	font-size: 16px;
	color: #fff;
	margin-bottom: 20px;
}
.m64_view .section1 .titwrap .status.end{
	background: #f1f1f1;
	color: #555;
}

.videoPage{}
.videoPage .section1{
	padding: 0 0 200px;
}
.videoPage .section1 ul{
	margin-top: 40px;
	display: flex;
	flex-wrap: wrap;
	column-gap: 30px;
	row-gap: 80px;
}
.videoPage .section1 li{
	width: calc((100% - 60px) / 3);
}
.videoPage .section1 li a{
	display: block;
	width: 100%;
}
.videoPage .section1 li a .thumb{
	position: relative;
	width: 100%;
	aspect-ratio: 527 / 320;
	border-radius: 13px;
	overflow: hidden;
}
.videoPage .section1 li a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 1s;
}
.videoPage .section1 li a:hover .thumb img{
	transform: scale(1.1);
}
.videoPage .section1 li a .thumb:after{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 84px;
	aspect-ratio: 1;
	background: url(/images/page/m52_play_icon.png) no-repeat center / contain;
}
.videoPage .section1 li a .txtwrap{
	margin-top: 20px;
}
.videoPage .section1 li a .txtwrap .tit{
	font-size: var(--font-size-26);
	font-weight: 500;
	color: #000;
}
.videoPage .section1 li a .txtwrap .date{
	font-size: var(--font-size-20);
	color: #666;
	margin-top: 15px;
}

/* 유튜브 팝업 */
.video_pop{
	position: fixed;
	display: none;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	max-width: 900px;
	width: 92%;
	margin: 0 auto;
	z-index: 10000;
	
}
.video_pop .btn_x {
	position: absolute;
	right: 0;
	bottom: calc(100% + 10px);
	width: 37px;
	height: 37px;
	background: url(/images/page/x_btn_wh.png) no-repeat center / contain;
}
.video_pop .conwrap {
	position: relative;
	padding-bottom: 56.25%;
	height: 0; overflow: hidden;
	border-radius: 12px;
}
.video_pop .conwrap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}




/* 모션 */
/* .ani {
opacity: 0;
transition: all 1s;
} */

.ani.top {
transform: translateY(50px);
}

.ani.left {
transform: translateX(-50px);
}

.ani.right {
transform: translateX(50px);
}

/* .ani.in-view {
opacity: 1;
} */

.ani.top.in-view {
transform: translateY(0px);
}

.ani.left.in-view {
transform: translateX(0px);
}

.ani.right.in-view {
transform: translateX(0px);
}
/* 
.m63 .section1 .img-box{
opacity: 0;
transform: translateY(50px);
transition: all 0.5s 0.5s;			
}

.m63 .section1 .img-box.in-view{ opacity: 1; transform: translateY(0px); }

 */

@-webkit-keyframes showImg{
0%{ clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); }
animation-delay: 1s;
}
@-webkit-keyframes showImg2{
0%{ clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
0%{ clip-path: polygon(0 0, 28% 0, 58% 100%, 0 100%);}
100%{clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); }
}
@-webkit-keyframes showImg3{
0%{ clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); }
animation-delay: 1s;
}
@-webkit-keyframes opacityAni{
0%{opacity:0;}
100%{opacity:1;}
}
@-webkit-keyframes scaleAni{
0%{opacity:0;transform:scale(1.3);}
100%{opacity:1;transform:scale(1);}
}
@-webkit-keyframes scaleAni2{
0%{opacity:0.5;transform:scale(1.3);}
100%{opacity:1;transform:scale(1);}
}
@-webkit-keyframes fadeUpAni{
0%{opacity:0; transform:translateY(30px);}
100%{opacity:1;transform:translateY(0);}
}
@-webkit-keyframes fadeLeftAni{
0%{opacity:0; transform:translateX(-50px);}
100%{opacity:1;transform:translateX(0);}
}
@-webkit-keyframes fadeRightAni{
0%{opacity:0; transform:translateX(50px);}
100%{opacity:1;transform:translateX(0);}
}
@-webkit-keyframes imgMotion{
	0% { clip-path: inset(50%);opacity:0; }
	100% {clip-path: inset(0);opacity:1;}
}

.fadeUp{opacity: 0;}
.fadeLeft{opacity: 0;}
.fadeRight{opacity: 0;}
.showImg{opacity: 0;}
.clipImg{opacity: 0;}

.showImg.in-view{animation-name: showImg;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.4s; opacity: 1;}
.showImg2.in-view{animation-name: showImg2;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 2s; opacity: 1;}
.showImg3.in-view{animation-name: showImg3;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1s; opacity: 1;}
.opacity.in-view{animation-name: opacityAni;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 2s;}
.fadeUp.in-view{animation-name: fadeUpAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.2s; opacity: 1;}
.fadeLeft.in-view{animation-name: fadeLeftAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.2s; opacity: 1;}
.fadeRight.in-view{animation-name: fadeRightAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.2s; opacity: 1;}
.scaleAni.in-view{animation-name: scaleAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 2s; }
.scaleAni2.in-view{animation-name: scaleAni2; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.5s; }
.clipImg.in-view{animation-name: imgMotion;animation-duration: 1s;animation-fill-mode: forwards;animation-timing-function: ease-in-out;animation-delay: 0.1s;opacity: 0;}



.page_top .bg{transform: scale(1.1);}
.page_top.in-view .bg{transform: scale(1); transition: all 2s;}

.page_top .inner .txtwrap .line{width: 0;}
.page_top.in-view .inner .txtwrap .line{width: 100%; transition: all 2s;}

.page_top .inner .txtwrap h2{opacity: 0; transform: translateY(30px);}
.page_top.in-view .inner .txtwrap h2{opacity: 1; transform: translateY(0); transition: all 1.2s 0.1s;}
.page_top .inner .txtwrap .slogan_en{opacity: 0; transform: translateY(30px);}
.page_top.in-view .inner .txtwrap .slogan_en{opacity: 1; transform: translateY(0); transition: all 1.2s 0.1s;}
.page_top .inner .txtwrap .slogan_kr{opacity: 0; transform: translateY(-20px);}
.page_top.in-view .inner .txtwrap .slogan_kr{opacity: 1; transform: translateY(0); transition: all 1.2s 0.1s;}



.m11 .section2 .bg{transform: scale(1.1);}
.m11 .section2.in-view .bg{transform: scale(1); transition: all 2s;}

.m14 .section3 .list > div{opacity: 0; transform: translateX(-30px);}
.m14 .section3 .list.in-view > div{opacity: 1; transform: translateX(0);}
.m14 .section3 .list > div:nth-child(1){transition: all 1.4s 0.1s;}
.m14 .section3 .list > div:nth-child(2){transition: all 1.4s 0.3s;}
.m14 .section3 .list > div:nth-child(3){transition: all 1.4s 0.5s;}
.m14 .section3 .list > div:nth-child(4){transition: all 1.4s 0.7s;}


.m16 .section1 .tabconwrap .tabcon.on .main_img{
	animation-name: showImg;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 2s; opacity: 1;
}


.m31 .section1 .boxwrap .box .bg{transform: scale(1.2);transition: filter 0.4s, transform 1.4s;}
.m31 .section1 .boxwrap .box.in-view .bg{transform: scale(1);}

.m33 .section2 .bg{transform: scale(1.2);}
.m33 .section2.in-view .bg{transform: scale(1); transition: all 2s 0.4s;}


.m41 .section1 .ccwrap .cc{transform: scale(0.8); opacity: 0;}
.m41 .section1 .ccwrap.in-view .cc{transform: scale(1); opacity: 1;}
.m41 .section1 .ccwrap .cc1{transition: all 1.2s 0.1s;}
.m41 .section1 .ccwrap .cc2{transition: all 1.2s 0.2s;}

.m41 .section1 .ccwrap .cc2:after{width: 0;}
.m41 .section1 .ccwrap.in-view .cc2:after{width: 100%; transition: all 1s 0.5s;}
.m41 .section1 .ccwrap .cc3{transition: all 1.2s 0.7s;}


.m41 .section2 .cont{opacity: 0;}
.m41 .section2 .cont.on{opacity: 1; transition: all 1s;}
.m41 .section2 .cont.in-view{opacity: 1; transition: all 1s;}

.m41 .section3 .slgwrap .bg{transform: scale(1.2);}
.m41 .section3 .slgwrap.in-view .bg{transform: scale(1); transition: all 2s;}


.m42 .section1 .conwrap .con:before{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 50%;
	background: #fff;
	z-index: 10;
}
.m42 .section1 .conwrap .con:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 50%;
	background: #fff;
	z-index: 10;
}

.m42 .section1 .conwrap .con.in-view:before{
	top: -50%;
	transition: all 1.2s 0.4s ease;
}
.m42 .section1 .conwrap .con.in-view:after{
	bottom: -50%;
	transition: all 1.2s 0.4s ease;
}
.m42 .section1 .conwrap .con .bg{transform: scale(1.1);}
.m42 .section1 .conwrap .con.in-view .bg{transform: scale(1); transition: all 1.6s 0.4s;}

.m42 .section1 .conwrap .con .txtwrap .tit{transform: translateX(-40px); opacity: 0; transition: all 1.2s 1.1s;}
.m42 .section1 .conwrap .con .txtwrap ul{transform: translateX(-40px); opacity: 0; transition: all 1.2s 1.3s;}
.m42 .section1 .conwrap .con.in-view .txtwrap .tit,
.m42 .section1 .conwrap .con.in-view .txtwrap ul{transform: translateX(0); opacity: 1;}





.m63 .section2 .content1 .box-wrap img{opacity: 0; transform: scale(0.8); transform-origin: center;}
.m63 .section2 .content1 .box-wrap img.in-view{opacity: 1; transform: scale(1); transition: all 1.4s 0.2s;}