@charset "utf-8";
@import url("common.css");

/*Layer*/
body{width:100%}
#wrap{width:100%; position: relative;}
#header{}
#container{width:100%}
#contents{}
#contents.gray{background: #F8F8F8;}
#footer{width:100%;}

/*header*/


.pcbr{display:block;}
.ptbr{display:block;}
.tbbr{display:none;}
.mbbr{display:none;}
.dn{display:none;}


.t_view{display: none !important;}
.tm_view{display: none !important;}
.m_view{display: none !important;}

.top_btn {
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 57px;
	height: 57px;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.5);
	text-align: center;
	line-height: 55px;
	cursor: pointer;
	z-index: 100;
}
.top_btn img{
	width: 11px;
}

/* paging */
.paging{
	margin-top:80px;
	text-align:center;
}
.paging a{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width:50px;height:50px;
	border-radius:50%;
	color:#666;font-size:var(--font-size-18);line-height:50px;
}
.paging strong{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width:50px;height:50px;
	border-radius:50%;
	background:#111;
	color:#fff;font-size:var(--font-size-18);line-height:50px;font-weight:400;
}
.paging .page_begin{
	width:42px;height:50px;
	background:url(/images/page/page_begin.png) no-repeat center;
	border:0;
}
.paging .page_prev{
	width:42px;height:50px;
	background:url(/images/page/page_prev.png) no-repeat center;
	border:0;margin-right:20px;
}
.paging .page_next{
	width:42px;height:50px;
	background:url(/images/page/page_next.png) no-repeat center;
	border:0;margin-left:20px;
}
.paging .page_end{
	width:42px;height:50px;
	background:url(/images/page/page_end.png) no-repeat center;
	border:0;
}


.innerwrap{
	width: 94%;
	max-width: 1800px;
	margin: 0 auto;
}

.page_top{
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	display: flex;
	align-items: center;
}
.page_top .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.page_top.pn1 .bg{background: url(/images/page/sub_visual1.jpg) no-repeat center / cover;}
.page_top.pn3 .bg{background: url(/images/page/sub_visual3.jpg) no-repeat center / cover;}
.page_top.pn4 .bg{background: url(/images/page/sub_visual4.jpg) no-repeat center / cover;}
.page_top.pn5 .bg{background: url(/images/page/sub_visual5.jpg) no-repeat center / cover;}
.page_top.pn6 .bg{background: url(/images/page/sub_visual6.jpg) no-repeat center / cover;}
.page_top h2{
	position: relative;
	width: 94%;
	margin: 0 auto;
	font-size: var(--font-size-110);
	font-weight: 600;
	color: #fff;
}
.page_top h2:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: -25px;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.6);
}
.page_top .sub_tab{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100px;
	background: rgba(255,255,255,0.05);
	backdrop-filter: blur(20px);
}
.page_top .sub_tab ul{
	width: 94%;
	margin: 0 auto;
	display: flex;
	column-gap: 70px;
}
.page_top .sub_tab li{
	
}
.page_top .sub_tab li a{
	font-family: "Noto Sans KR";
	position: relative;
	padding-left: 20px;
	font-size: 18px;
	color: rgba(255,255,255,0.7);
	line-height: 100px;
}
.page_top .sub_tab li.on a{
	color: rgba(255,255,255,1);
}
.page_top .sub_tab li a:after{
	content: "";
	position: absolute;
	left: 0;
	top: 13px;
	width: 10px;
	height: 1px;
	background: rgba(255,255,255,0.7);
}
.page_top .sub_tab li.on a:after{
	left: 0;
	top: 9px;
	width: 10px;
	height: 10px;
	transform: rotate(45deg);
	background: rgba(255,255,255,1);
}

.sub_title{
	display: flex;
	justify-content: space-between;
	width: 94%;
	max-width: 1800px;
	margin: 150px auto;
	padding-top: 40px;
	border-top: 1px solid #ccc;
}
.sub_title .page_tit{
	font-size: 26px;
	font-weight: 600;
	color: #000;
	text-transform: uppercase;
}
.sub_title .pageLocation{
	display: flex;
}
.sub_title .pageLocation li{
	font-family: "Noto Sans KR";
	display: inline-block;
	position: relative;
	padding-left: 30px;
	font-size: 16px;
	font-weight: 400;
	color: #777;
}
.sub_title .pageLocation li:after{
	content: "";
	position: absolute;
	left: 9px;
	top: 10px;
	width: 6px;
	height: 6px;
	border-bottom: 1px solid #777;
	border-right: 1px solid #777;
	transform: rotate(-45deg);
}
.sub_title .pageLocation li:first-child{
	padding-left: 0;
}
.sub_title .pageLocation li:first-child:after{
	display: none;
}
.sub_title .pageLocation li:first-child a{
	display: inline-block;
	transform: translateY(-2px);
}
.sub_title.pn3 .pageLocation li:last-child{display: none;}





/* m12 */
.m12{}
.m12 .ceo{
	background:#ebebeb url(/images/page/m12_ceo_bg.png) no-repeat right bottom;
	background-size:;
}
.m12 .ceo>div{
	position:relative;
	display:flex;align-items:center;
	max-width:1420px;height:360px;
}
.m12 .ceo>div .msg{font-size:26px;color:#000;font-weight:600;}
.m12 .ceo>div .msg strong{display:block;margin-bottom:10px;font-size:30px;font-weight:600;}
.m12 .ceo>div .pht{position:absolute;right:0;bottom:0;}
.m12 .txts{padding:60px 0;}
.m12 .txts>div{max-width:1420px;}
.m12 .txts>div .txtwrap{	
	display:flex;flex-wrap:wrap;gap:60px;
	padding-bottom:40px;border-bottom:1px solid #ccc;
}
.m12 .txts>div .txtwrap>div{flex:1;}
.m12 .txts>div .txtwrap p{margin-bottom:30px;font-size:17px;color:#555;line-height:170%;}
.m12 .txts>div .txtwrap p:last-child{margin:0;}
.m12 .txts>div .sign{
	padding-top:40px;
	font-size:22px;color:#000;text-align:right;font-weight:600;
}
.m12 .txts>div .sign .bar{
	display:inline-block;
	width:1px;height:15px;
	background:rgba(0,0,0,0.3);
	margin:0 20px;
}




/* m13 */
.m13{}
.m13 .historyView{margin-bottom:100px;border-top:1px solid #000;border-bottom:1px solid rgba(0,0,0,0.25);}
.m13 .historyView ul{display:flex;padding:30px 0;}
.m13 .historyView ul li{
	flex:1;
	border-right:1px solid rgba(0,0,0,0.25);
	text-align:center;
}
.m13 .historyView ul li:last-child{border:0;}
.m13 .historyView ul li .tit{font-size:17px;color:#555;font-weight:600;}
.m13 .historyView ul li .year{margin-top:20px;font-size:57px;color:#000;font-weight:700;line-height:1em;}
.m13 .historyWrap{
	display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;
	width:100%;height:100vh;
}
.m13 .historyWrap .con{
	box-sizing:border-box;
	position:relative;
	display:flex;align-items:center;
	width:47%;height:100%;
}
.m13 .historyWrap .con .boxWrap{
	display:flex;justify-content:space-between;align-items:center;
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	opacity:0;
}
.m13 .historyWrap .con .boxWrap.on{opacity:1;z-index:10;}
.m13 .historyWrap .con .boxWrap .txtArea{
	box-sizing:border-box;
	width:calc(100% - 80px);
	padding:0 80px 0 10vw;
}
.m13 .historyWrap .con .boxWrap .txtArea .tit{font-size:21px;color:#555;font-weight:600;}
.m13 .historyWrap .con .boxWrap .txtArea .year{margin:10px 0 80px;font-size:100px;color:#000;font-weight:600;line-height:1em;}
.m13 .historyWrap .con .boxWrap .txtArea .history{}
.m13 .historyWrap .con .boxWrap .txtArea .history dl{display:flex;}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dt{position:relative;width:123px;}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dt ul{}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dt ul li{
	position:absolute;left:0;top:0;
	font-size:25px;color:#000;font-weight:600;
	opacity:0;transform:translateY(20px);
	transition:all 0.4s;
}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dt ul li.on{opacity:1;transform:translateY(0px);}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dd{
	position:relative;
	width:calc(100% - 123px);
}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dd ul{}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dd ul li{
	position:absolute;left:0;top:0;
	font-size:21px;color:#555;line-height:150%;
	opacity:0;transform:translateY(20px);
	transition:all 0.4s;
}
.m13 .historyWrap .con .boxWrap .txtArea .history dl dd ul li.on{opacity:1;transform:translateY(0px)}
.m13 .historyWrap .con .boxWrap .yearList{width:80px;}
.m13 .historyWrap .con .boxWrap .yearList ul{
	position:relative;
}
.m13 .historyWrap .con .boxWrap .yearList ul:before{
	display:block;content:"";
	width:1px;height:calc(100% - 14px);
	background:rgba(0,0,0,0.2);
	position:absolute;left:0;top:50%;
	transform:translateY(-50%);
}
.m13 .historyWrap .con .boxWrap .yearList ul li{
	position:relative;
	margin-bottom:40px;padding-left:22px;
	font-size:14px;color:rgba(0,0,0,0.2);font-weight:600;
	transition:all 0.4s;
}
.m13 .historyWrap .con .boxWrap .yearList ul li:last-child{margin:0;}
.m13 .historyWrap .con .boxWrap .yearList ul li:before{
	display:block;content:"";
	width:7px;height:7px;
	background:#ccc;
	border-radius:50%;
	position:absolute;left:-3px;top:50%;z-index:5;
	transform:translateY(-50%);
	transition:all 0.4s;
}
.m13 .historyWrap .con .boxWrap .yearList ul li:after{
	display:block;content:"";
	width:16px;height:16px;
	background:rgba(0,0,0,0.2);
	position:absolute;left:-8px;top:50%;
	border-radius:50%;
	margin:-8px 0 0 0;
	opacity:0;transform:scale(0.7);
	transition:all 0.4s;
}
.m13 .historyWrap .con .boxWrap .yearList ul li span{
	display:block;position:relative;
	width:100%;height:14px;
	transform-style:preserve-3d;perspective:1000px;
	transition: transform 0.6s;
}
.m13 .historyWrap .con .boxWrap .yearList ul li span:after{
	display:block;content:attr(data-text);
	color:#000;
	position:absolute;left:0;top:50%;
	width:100%;height:100%;
	transform:rotateX(90deg) translateY(-50%);
	transform-origin:top;
	backface-visibility: hidden;
	transition: transform 0.6s;
}
.m13 .historyWrap .con .boxWrap .yearList ul li.on{color:#000;}
.m13 .historyWrap .con .boxWrap .yearList ul li.on:before{background:#000;}
.m13 .historyWrap .con .boxWrap .yearList ul li.on:after{opacity:1;transform:scale(1);}

.m13 .historyWrap .con .boxWrap .yearList ul li.on span{transform:rotateX(-90deg) translateY(-10px);}
.m13 .historyWrap .con .boxWrap .yearList ul li.on span:after{transform:rotateX(90deg) translateY(-10px);}




.m13 .historyWrap .imgs{
	position:relative;
	width:45.55%;aspect-ratio:820/780;
}
.m13 .historyWrap .imgs ul{}
.m13 .historyWrap .imgs ul li{
	position:absolute;left:0;top:0;
    transition: none;
}
.m13 .historyWrap .imgs ul li.on{clip-path: inset(0% 0% 0% 0%);z-index: 5;}
.m13 .historyWrap .imgs ul li.animating{z-index: 10;}
.m13 .historyWrap .imgs ul li.on.from-top{animation: slideFromTop 1.2s forwards;}
.m13 .historyWrap .imgs ul li.on.from-bottom{animation: slideFromBottom 1.2s forwards;}


@keyframes slideFromBottom {
    from {
        clip-path: inset(100% 0 0 0);
    }
    to {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes slideFromTop {
    from {
        clip-path: inset(0 0 100% 0);
    }
    to {
        clip-path: inset(0 0 0 0);
    }
}





.m14{}
.m14 .section1{}
.m14 .section1 h3{
	font-family: "Pretendard";
	font-size: 46px;
	font-weight: 600;
	margin-bottom: 80px;
}
.m14 .section1 .top{
	width: 100%;
	text-align: center;
	padding: 140px 0;
	background: linear-gradient(180deg,rgba(235, 235, 235, 1) 0%, rgba(255, 255, 255, 1) 100%);
}
.m14 .section1 .top .tit{
	font-size: var(--font-size-26);
	font-weight: 600;
}
.m14 .section1 .top strong{
	display: block;
	font-size: var(--font-size-56);
	font-weight: 700;
	margin-top: 40px;
}
.m14 .section2{}
.m14 .section2 .conwrap{
	position: relative;
	padding: 150px 180px;
	text-align: center;
	overflow: hidden;
}
.m14 .section2 .conwrap .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/page/m14_sec2_bg.jpg) no-repeat center / cover;
	z-index: -1;
}
.m14 .section2 .conwrap .tit{
	font-size: var(--font-size-26);
	font-weight: 600;
	color: #fff;
}
.m14 .section2 .conwrap strong{
	display: block;
	font-size: var(--font-size-44);
	font-weight: 700;
	color: #fff;
	margin-top: 40px;
}
.m14 .section2 .conwrap .boxwrap{
	margin-top: 80px;
}
.m14 .section2 .conwrap .boxwrap .box{
	display: flex;
	text-align: center;
}
.m14 .section2 .conwrap .boxwrap .box + .box{
	margin-top: 10px;
}
.m14 .section2 .conwrap .boxwrap .box .left{
	font-family: "Pretendard";
	font-weight: 500;
	width: 370px;
	padding: 40px 10px;
	font-size: 28px;
	background: #DEDEDE;
	display: flex;
	align-items: center;
	justify-content: center;
}
.m14 .section2 .conwrap .boxwrap .box .right{
	font-family: "Pretendard";
	font-weight: 500;
	width: calc(100% - 370px);
	padding: 40px 10px;
	font-size: 24px;
	background: #fff;
}

.m14 .section3{
	padding: 100px 0 200px;
	overflow: hidden;
}
.m14 .section3 .conwrap{
	padding-bottom: 200px;
}
.m14 .section3 .conwrap .tit{
	font-size: var(--font-size-26);
	font-weight: 600;
	margin-bottom: 60px;
	text-align: center;
}
.m14 .section3 .conwrap .ccwrap{
	position: relative;
	display: flex;
	justify-content: center;
	gap: 160px;
}
.m14 .section3 .conwrap .ccwrap:after{
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	height: 1px;
	background: #ccc;
}
.m14 .section3 .conwrap .ccwrap .cc{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 370px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: #000;
}
.m14 .section3 .conwrap .ccwrap .cc p{
	font-size: var(--font-size-30);
	font-weight: 500;
	margin: 30px 0 15px;
	color: #fff;
}
.m14 .section3 .conwrap .ccwrap .cc span{
	font-family: "Pretendard";
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: rgba(255,255,255,0.6);
}
.m14 .section3 .conwrap .ccwrap .cc .exp{
	position: absolute;
	left: 50%;
	top: calc(100% + 40px);
	transform: translateX(-50%);
	width: 100%;
	font-size: 16px;
	line-height: 1.7em;
	color: #555;
	text-align: center;
}
.m14 .section3 .boxwrap{
	width: 100%;
	padding: 90px 180px;
	background: #EBEBEB;
}
.m14 .section3 .boxwrap .box{
	display: flex;
	text-align: center;
}
.m14 .section3 .boxwrap .box + .box{
	margin-top: 10px;
}
.m14 .section3 .boxwrap .box .left{
	font-family: "Pretendard";
	font-weight: 500;
	width: 370px;
	padding: 40px 10px;
	font-size: 28px;
	background: #111;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}
.m14 .section3 .boxwrap .box .right{
	font-family: "Pretendard";
	font-weight: 500;
	width: calc(100% - 370px);
	padding: 40px 10px;
	font-size: 24px;
	background: #fff;
}

/* m15 */
.m15{} 
.m15 .section1{padding: 0 0 200px;}
.m15 .section1 .iframe-wrap {
width: 100%;
aspect-ratio: 1440 / 808;
}
.m15 .section1 iframe {
width: 100%;
height: 100%;
}
.m15 .section2{
padding: 0 0 200px;
}
.m15 .section2 .content1 {
padding-top: 100px;
border-top: 1px solid #B3B3B3;
display: flex;
align-items: center;
justify-content: space-between;
gap: 5vw;
}
.m15 .section2 .content-title {
font-size: var(--font-size-28);
font-weight: 600;
color: #000;
}
.m15 .section2 .content1 .content-container1 {
width: 100%;
max-width: 600px;
}
.m15 .section2 .content1 .content-container1 .text-box {
padding-top: 40px;
margin-top: 40px;
border-top: 1px solid #B3B3B3;
}
.m15 .section2 .content1 .content-container1 .text-box b{
font-size: var(--font-size-22);
font-weight: 600;
color: #000;
line-height: 1.4;
}
.m15 .section2 .content1 .content-container1 .text-box p{
font-size: var(--font-size-18);
font-weight: 400;
color: #555;
line-height: 1.4;
margin-top: 15px;
}
.m15 .section2 .content1 .content-container2 {
width: 100%;
max-width: 1037px;
background-color: #EBEBEB;
padding: 4.4vw 4.8vw;
}
.m15 .section2 .content1 .content-container2 .logo-horizontal{	
}
.m15 .section2 .content1 .content-container2 .logo-title {
font-size: 14px;
font-weight: 600;
color: #808080;
position: relative;
padding-left: 39px;
}
.m15 .section2 .content1 .content-container2 .logo-horizontal .logo-title::before{
content:'H';
position: absolute;
background-color: #000;
color: #fff;
font-size: 13px;
width: 29px;
height: 29px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
left: 0;
top:50%;
transform: translateY(-50%);
}
.m15 .section2 .content1 .content-container2 .logo-horizontal .logo-box{
display: flex;
align-items: center;
justify-content: center;
gap:10px;
margin-top: 40px;
width: 100%;
}
.m15 .section2 .content1 .content-container2 .logo-horizontal .logo-box img {
aspect-ratio: 42/17;
width: 50%;
}
.m15 .section2 .content1 .content-container2 .logo-vertical{
margin-top: 82px;
}
.m15 .section2 .content1 .content-container2 .logo-vertical .logo-title::before{
content:'V';
position: absolute;
background-color: #000;
color: #fff;
font-size: 13px;
width: 29px;
height: 29px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
left: 0;
top:50%;
transform: translateY(-50%);
}
.m15 .section2 .content1 .content-container2 .logo-vertical .logo-box{
margin-top: 40px;
display: flex;
align-items: center;
justify-content: center;
gap:10px;
}
.m15 .section2 .content1 .content-container2 .logo-vertical .logo-box img {
aspect-ratio:21/11;
width: 50%;
}
.m15 .section2 .content2{
margin-top: 100px;
}
.m15 .section2 .content2 .content-container1{
margin-top: 60px;
display: flex;
align-items: center;
justify-content: center;
gap:10px;
}
.m15 .section2 .content2 .content-container1 .color-black {
background-color: #000;
flex:1;
display: flex;
align-items: center;
justify-content: space-between;
padding: 4.25vw 40px;
}
.m15 .section2 .content2 .content-container1 .color-black .color-code{
color: #666;
font-size: var(--font-size-18);
font-weight: 600;
}
.m15 .section2 .content2 .content-container1 .color-black .color-name{
color: #fff;
font-size: var(--font-size-18);
font-weight: 600;
}
.m15 .section2 .content2 .content-container1 .color-white {
border:1px solid #DBDBDB;
flex:1;
display: flex;
align-items: center;
justify-content: space-between;
padding: 4.25vw 40px;
}
.m15 .section2 .content2 .content-container1 .color-white .color-code{
color: #999;
font-size: var(--font-size-18);
font-weight: 600;
}
.m15 .section2 .content2 .content-container1 .color-white .color-name{
color: #000;
font-size: var(--font-size-18);
font-weight: 600;
}
.m15 .section2 .content2 .content-container2 {
margin-top: 100px;
}
.m15 .section2 .content2 .content-container2 .down-box {
display: flex;
align-items: center;
justify-content: center;
gap:10px;
}
.m15 .section2 .content2 .content-container2 .down-box a {
display: block;
width: 350px;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
gap:8px;
font-size: var(--font-size-18);
font-weight: 500;
}
.m15 .section2 .content2 .content-container2 .down-box .button-ai{
background-color: #000;
color: #fff;
border:none;
}
.m15 .section2 .content2 .content-container2 .down-box .button-png{
background-color: #fff;
color: #666;
border:1px solid #666;
}

.m16{}
.m16 .section1{padding: 0 0 200px;}
.m16 .section1 .innerwrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	row-gap: 140px;
}
.m16 .section1 .con{
	width: 100%;
}
.m16 .section1 .con.w50{
	width: 49%;
}
.m16 .section1 .con .name{
	font-size: var(--font-size-56);
	font-weight: 600;
}
.m16 .section1 .con .name span{
	font-size: var(--font-size-30);
	font-weight: 500;
	margin-left: 10px;
}
.m16 .section1 .con .infowrap{
	display: flex;
	flex-wrap: nowrap;
	column-gap: 25px;
	padding: 40px 0;
	margin-bottom: 40px;
	border-bottom: 1px solid #ccc;
}
.m16 .section1 .con .infowrap dl{
	display: flex;
	align-items: center;
	gap: 15px;
}
.m16 .section1 .con .infowrap dl dt{
	flex-shrink: 0;
}
.m16 .section1 .con .infowrap dl dd{
	flex-shrink: 1;
	font-size: var(--font-size-18);
	color: #666;
}
.m16 .section1 .con .infowrap dl dd strong{
	font-weight: 600;
	color: #000;
	margin-right: 10px;
}
.m16 .section1 .con .map{
	width: 100%;
	height: 680px;
}


/* m20 */
.m20 {}
.m20 .section{
width: 100%;
height: 100vh;
}
.m21 .section1{background: url(/images/page/m21_sec1_img1.png) no-repeat center / cover;}
.m22 .section1{background: url(/images/page/m22_sec1_img1.png) no-repeat center / cover;}
.m23 .section1{background: url(/images/page/m23_sec1_img1.png) no-repeat center / cover;}
.m24 .section1{background: url(/images/page/m24_sec1_img1.png) no-repeat center / cover;}
.m20 .section1 .innerwrap{
height: 100%;
}
.m20 .section1 .content1 {
height: 100%;
}
.m20 .section1 .container {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
}
.m20 .section1 .page-title {
font-size: var(--font-size-26);
font-weight: 600;
color: #fff;
padding-bottom: 50px;
position: relative;
width: 100%;
text-align: center;
}
.m20 .section1 .page-title::after{
content:'';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background-color: rgba(255, 255, 255, 0.4);
}
.m20 .section1 .sec1-title {
margin-top: 50px;
font-size: var(--font-size-70);
font-weight: 700;
color: #fff;
font-family: "Pretendard";
}
.m21 .section1 .sec1-title{
	font-family: "Montserrat";
	font-weight: 300;
}
.m21 .section1 .sec1-title strong{
	font-weight: 700;
}

.m20 .section1 .sec1-text {
margin-top: 20px;
font-size: var(--font-size-24);
color: #fff;
font-family: "Pretendard";
}
.m20 .section2 {}
.m20 .section2 .innerwrap{
height: 100%;
}
.m20 .section2 .content{
height: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
}
.m20 .section2 .content1 .container{
width: 50%;
height: 100%;
}
.m20 .section2 .content1 .container.w100{
	width: 100% !important;
}
.m21 .section2 .content1 .container1{
background: url(/images/page/m21_sec2_img1.png) no-repeat center / cover;
}
.m22 .section2 .content1 .container1{
background: url(/images/page/m22_sec2_img1.png) no-repeat center / cover;
}
.m23 .section2 .content1 .container1{
background: url(/images/page/m23_sec2_img1.png) no-repeat center / cover;
}
.m23 .section2 .content1 .container2{
background: url(/images/page/m23_sec2_img2.png) no-repeat center / cover;
}
.m24 .section2 .content1 .container1{
background: url(/images/page/m24_sec2_img1.png) no-repeat center / cover;
}
.m24 .section2 .content1 .container2{
background: url(/images/page/m24_sec2_img2.png) no-repeat center / cover;
}

.m20 .section2 .content1 .container .innerwrap {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.m20 .section2 .content1 .container .container-title {
font-size: var(--font-size-54);
font-weight: 500;
color: #fff;
font-family: "Pretendard";
}
.m20 .section2 .content1 .container .container-text {
margin-top: 40px;
font-size: var(--font-size-22);
color: #fff;
font-weight: 300;
font-family: "Pretendard";
line-height: 1.5em;
}
.m20 .section2 .content1 .container .sub-title {
font-size: var(--font-size-30);
color: #fff;
font-family: "Pretendard";
margin-bottom: 20px;
}



/* m20 섹션3는 공통 */
.m20 .section3 {
background-color: #ddd;
}
.m20 .section3 .innerwrap {
height: 100%;
}
.m20 .section3 .content1 {
padding: 95px 0;
height: 100%;
}
.m20 .section3 .container {
height: 100%;
display:grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 150px;
grid-row-gap: 60px;
justify-items: center;
}
.m20 .section3 .container .box{
width: 100%;
text-align: center;
color: #fff;
padding: 50px 25px;
position: relative;
}
.m22 .section3{height:188vh;}
.m24 .section3{height:188vh;}


.m21 .section3 .container .box1{background: url(/images/page/m21_sec3_img1.png) no-repeat center / cover;}
.m21 .section3 .container .box2{background: url(/images/page/m21_sec3_img2.png) no-repeat center / cover;}
.m21 .section3 .container .box3{background: url(/images/page/m21_sec3_img3.png) no-repeat center / cover;}
.m22 .section3 .container .box1{background: url(/images/page/m22_sec3_img1.png) no-repeat center / cover;}
.m22 .section3 .container .box2{background: url(/images/page/m22_sec3_img2.png) no-repeat center / cover;}
.m22 .section3 .container .box3{background: url(/images/page/m22_sec3_img3.png) no-repeat center / cover;}
.m22 .section3 .container .box4{background: url(/images/page/m22_sec3_img4.png) no-repeat center / cover;}
.m22 .section3 .container .box5{background: url(/images/page/m22_sec3_img5.png) no-repeat center / cover;}
.m22 .section3 .container .box6{background: url(/images/page/m22_sec3_img6.png) no-repeat center / cover;}
.m23 .section3 .container .box1{background: url(/images/page/m23_sec3_img1.png) no-repeat center / cover;}
.m23 .section3 .container .box2{background: url(/images/page/m23_sec3_img2.png) no-repeat center / cover;}
.m23 .section3 .container .box3{background: url(/images/page/m23_sec3_img3.png) no-repeat center / cover;}
.m24 .section3 .container .box1{background: url(/images/page/m24_sec3_img1.png) no-repeat center / cover;}
.m24 .section3 .container .box2{background: url(/images/page/m24_sec3_img2.png) no-repeat center / cover;}
.m24 .section3 .container .box3{background: url(/images/page/m24_sec3_img3.png) no-repeat center / cover;}
.m24 .section3 .container .box4{background: url(/images/page/m24_sec3_img4.png) no-repeat center / cover;}
.m24 .section3 .container .box5{background: url(/images/page/m24_sec3_img5.png) no-repeat center / cover;}

.m20 .section3 .container .box::after {
content:'';
position: absolute;
top:0;
bottom:0;
left:0;
right:0;
background-color: rgba(17, 17, 17, 0.9);
z-index: 0;
opacity: 0;
transition: all 0.6s;
}
.m20 .section3 .container .box:hover::after {
opacity: 1;
}
.m20 .section3 .container .box .box-wrap {
display: flex;
justify-content: flex-end;
align-items: center;
flex-direction: column;
width: calc(100% - 40px);
position: relative;
z-index: 1;
position: absolute;
left: 50%;
bottom: 50px;
transform: translateX(-50%);
transition:all 0.6s;
}
.m20 .section3 .container .box .box-subTitle {
font-size: var(--font-size-22);
font-weight: 600;
color: #fff;
font-family: "Pretendard";
}
.m20 .section3 .container .box .box-title {
font-size: var(--font-size-26);
font-weight: 600;
color: #fff;
font-family: "Pretendard";	
padding-top: 30px;
margin-top: 30px;
border-top: 1px solid  rgba(255, 255, 255, 0.5);
width: 100%;
}
.m20 .section3 .container .box .box-descWrap {
overflow: hidden; 
}
.m20 .section3 .container .box .box-desc {
overflow: hidden;
font-size: var(--font-size-18);
font-weight: 400;
color: #fff;
font-family: "Pretendard";	
line-height: 1.4;
margin-top: 50px;
opacity:0;
transition:all 0.6s;
}
.m20 .section3 .container .box .box-desc.active{
opacity:1;
}



.m20 .section4 {
position: relative;
}
.m21 .section4{background: url(/images/page/m21_sec4_img1.png) no-repeat center / cover;}
.m22 .section4{background: url(/images/page/m22_sec4_img1.png) no-repeat center / cover;}
.m23 .section4{background: url(/images/page/m23_sec4_img1.png) no-repeat center / cover;}
.m24 .section4{background: url(/images/page/m24_sec4_img1.png) no-repeat center / cover;}
.m20 .section4 .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
  background: #000;
  opacity: 0;
  z-index: 1;
}
.m20 .section4 .logo-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
  background: url(/data/m20_logo.svg) center/contain no-repeat;
  z-index: 2;
}
.m20 .section4 .sq1{
	position: absolute;
	left: 25%;
	bottom: 0;
	width: 46vw;
	z-index: 2;
}
.m20 .section4 .sq2{
	position: absolute;
	right: 25%;
	top: 0;
	z-index: 2;
	width: 17vw;
}
.m20 .section4 .innerwrap {
  position: relative;
  height: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

.m20 .section4 .content1{
position: relative;
z-index: 3;
}

.m20 .section4 .content-title {
white-space: nowrap;
color: #fff;
font-size: var(--font-size-110);
padding-left: 180px;
display: inline-flex;
align-items: center;
width: max-content;
}
.m20 .section4 .content-title span{
	display: inline-block;
	margin-left: 50px;
	font-size: var(--font-size-34);
	font-weight: 400;
	text-align: left;
}
.m20 .section4 .content-text {
color: #fff;
font-size: var(--font-size-36);
opacity: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width:100%;text-align:center;
}
.m20 .section4 .content-text2 {
color: #fff;
font-size: var(--font-size-36);
opacity: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width:100%;text-align:center;
}




.m31{}
.m31 .section1{padding: 0 0 200px;}
.m30 .section1 .top{
	display: flex;
	justify-content: space-between;
	margin-bottom: 80px;
}
.m30 .section1 .top .catewrap{
	display: flex;
	gap: 40px;
}
.m30 .section1 .top .catewrap li{}
.m30 .section1 .top .catewrap li a{
	font-family: "Pretendard";
	font-size: var(--font-size-26);
	color: #555;
}
.m30 .section1 .top .catewrap li.on a{
	position: relative;
	padding-left: 22px;
	font-weight: 600;
	color: #000;
}
.m30 .section1 .top .catewrap li.on a:after{
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 8px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: #000;
}
.m31 .section1 .top form{}
.m31 .section1 .top form .searchwrap{
	position: relative;
	width: 427px;
	height: 40px;
	padding: 0 12px;
	background: #ededed;
	display: flex;
	align-items: center;
}
.m31 .section1 .top form .searchwrap input{
	width: calc(100% - 24px);
	height: 40px;
	border: none;
	background: none;
	font-size: var(--font-size-17);
}
.m31 .section1 .top form .searchwrap input:focus{
	border: none;
	outline: none;
	box-shadow: none;
}
.m31 .section1 .top form .searchwrap button{
	width: 24px;
	height: 24px;
	border: none;
	background: none;
}

.m31 .section1 .subTabs{margin-bottom:80px;}
.m31 .section1 .subTabs ul{display:flex;gap:10px;}
.m31 .section1 .subTabs ul li{}
.m31 .section1 .subTabs ul li a{
	display:flex;align-items:center;justify-content:center;
	width:70px;height:37px;
	border:1px solid rgba(0,0,0,0.3);
	font-size:17px;color:#555;text-align:center;
}
.m31 .section1 .subTabs ul li.on a{background:#000;color:#fff;}

.m31 .section1 .list{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	column-gap: 30px;
	row-gap: 150px;
}
.m31 .section1 .list li{
	width: calc((100% - 90px) / 4);
}
.m31 .section1 .list li a{
	display: block;
}
.m31 .section1 .list li a .thumb{
	width: 100%;
	position: relative;
}
.m31 .section1 .list li a .thumb::after{
content: url(/images/page/m31_view_more.png);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.5);
position: absolute;
left: 0;
top: 0;
background-image: url('/data/m31_borrom_left.svg'), url('/data/m31_top_right.svg');
background-repeat: no-repeat, no-repeat;
background-position: top right, bottom left;
pointer-events: none;
transform-origin: bottom;
transform: scaleY(0);
transition: all 0.6s;
}
.m31 .section1 .list li:hover a .thumb::after {
	transform: scaleY(1);
}
.m31 .section1 .list li a .thumb img{
	width: 100%;
}
.m31 .section1 .list li a .tit{
	font-family: "Pretendard";
	font-size: var(--font-size-26);
	font-weight: 600;
	margin: 15px 0;
}
.m31 .section1 .list li a .type{
	font-size: var(--font-size-17);
	color: #555;
}


.m31_view{padding: 0 0 200px;}
.m31_view .project{
	width: 100%;
	height: 100vh;
	overflow: hidden;
}
.m31_view .project .swiper-wrapper{
	width: 100%;
	height: 100%;
}
.m31_view .project .swiper-slide{
	width: 100%;
	height: 100%;
	overflow: hidden;  /* 추가 */
}
.m31_view .project .swiper-slide .slide-inner{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.m31_view .project .swiper-slide img{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: inherit;
}
.m31_view .project .swiper-pagination{
	bottom: 40px;
}
.m31_view .project .swiper-pagination .swiper-pagination-bullet{
	width: 42px;
	height: 4px;
	background: #999;
	border-radius: 0;
	opacity: 1;
	margin: 0 4px;
}
.m31_view .project .swiper-pagination .swiper-pagination-bullet-active{
	background: #fff;
}
.m31_view .banner{
	margin-top: 30px;
	overflow: hidden;
}
.m31_view .banner .txt{
	display: inline-flex;      /* inline-flex로 콘텐츠 길이만큼만 너비 가지게 */
	gap: 0;
	white-space: nowrap;
}
.m31_view .banner span{
	display: inline-block;
	font-size: 8.8vw;
	font-weight: 500;
	color: #ebebeb;
	white-space: nowrap;
	padding-right: 2vw;
}
@keyframes textScroll {
	0%{
		transform: translate(0, 0);
	}
	100%{
		transform: translate(-50%, 0);
	}
}

.m31_view .infowrap{
	margin-top: 50px;
	display: flex;
}
.m31_view .infowrap .intro{
	width: 50%;
	padding: 0 5%;
}
.m31_view .infowrap .intro .name{
	font-size: var(--font-size-56);
	font-weight: 700;
}
.m31_view .infowrap .intro p{
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #555;
	margin-top: 15px;
}
.m31_view .infowrap .detail{
	width: 50%;
	padding: 0 3%;
}
.m31_view .infowrap .detail .tit{
	font-family: "Pretendard";
	font-size: var(--font-size-26);
	font-weight: 700;
	padding-bottom: 20px;
	border-bottom: 1px solid #000;
}
.m31_view .infowrap .detail dl{
	display: flex;
	padding: 25px 0;
	border-bottom: 1px solid #ccc;
}
.m31_view .infowrap .detail dl dt{
	font-family: "Pretendard";
	font-size: var(--font-size-22);
	font-weight: 600;
	width: 150px;
}
.m31_view .infowrap .detail dl dd{
	font-family: "Pretendard";
	font-size: var(--font-size-22);
	width: calc(100% - 150px);
	color: #555;
}
.m31_view .btnwrap{
	margin-top: 100px;
	text-align: center;
}
.m31_view .btnwrap a{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 180px;
	height: 55px;
	font-size: var(--font-size-18);
	font-weight: 600;
	color: #fff;
	background: #111;
	gap: 10px;
}
.m31_view .btnwrap a img{transform: translateY(2px);}





/* m41 */
.m41{}
.m41 .section1{}
.m41 .section1 .con1{
	display:flex;justify-content:space-between;align-items:center;
}
.m41 .section1 .con1 .txtarea{width:calc(100% - 57.6%);}
.m41 .section1 .con1 .txtarea h4{font-size:54px;color:#000;font-weight:700;line-height:1.2em;}
.m41 .section1 .con1 .txtarea p{margin-top:40px;font-size:17px;color:#555;line-height:1.7em;}
.m41 .section1 .con1 .imgarea{
	width:57.6%;
	aspect-ratio:1037/776;
	background:url(/images/page/m41_sec1_img1.jpg) no-repeat center / cover;
}
.m41 .section1 .con2{
	display:flex;flex-wrap:wrap;gap:12px;
	margin-top:80px;
}
.m41 .section1 .con2 dl{
	overflow:hidden;
	flex:1;
	position:relative;
	border:1px solid #ccc;
	padding:80px 40px 42px;
}
.m41 .section1 .con2 dl:before{
	display:block;content:"";
	width:100%;height:100%;
	position:absolute;left:0;top:0;
	transition:all 0.4s;
	opacity:0;transform:scale(1.05);
}
.m41 .section1 .con2 dl:nth-child(1):before{background:url(/images/page/m41_sec1_bg1.jpg) no-repeat center / cover;}
.m41 .section1 .con2 dl:nth-child(2):before{background:url(/images/page/m41_sec1_bg2.jpg) no-repeat center / cover;}
.m41 .section1 .con2 dl:nth-child(3):before{background:url(/images/page/m41_sec1_bg3.jpg) no-repeat center / cover;}
.m41 .section1 .con2 dl dt{
	position:relative;z-index:10;font-size:27px;color:#000;font-weight:600;
	transition:all 0.4s;
}
.m41 .section1 .con2 dl dd{
	position:relative;z-index:10;margin-top:100px;font-size:17px;color:#555;line-height:1.7em;
	transition:all 0.4s;
}
.m41 .section1 .con2 dl:hover:before{opacity:1;transform:scale(1);}
.m41 .section1 .con2 dl:hover dt{color:#fff;}
.m41 .section1 .con2 dl:hover dd{color:#fff;}

.m41 .section2{padding-top:280px;}
.m41 .section2 .sub_title{width:100%;margin:0 auto 150px;}
.m41 .section2 .txtarea{display:flex;flex-wrap:wrap;align-items:center;}
.m41 .section2 .txtarea h4{
	width:50%;
	font-size:54px;color:#000;font-weight:700;line-height:1.2em;
	border-right:1px solid #ccc;
}
.m41 .section2 .txtarea p{
	width:50%;
	padding:0 70px;	
	font-size:17px;color:#555;line-height:1.7em;
}
.m41 .section2 .conwrap{
	display:flex;flex-wrap:wrap;
	margin-top:100px;
}
.m41 .section2 .conwrap .img{
	width:640px;
	background:url(/images/page/m41_sec2_img1.jpg) no-repeat center / cover;
}
.m41 .section2 .conwrap .con{
	width:calc(100% - 640px);
	box-shadow:0 1px 0 #ccc inset;
}
.m41 .section2 .conwrap .con dl{
	padding:96px 60px 96px 220px;
	box-shadow:0 -1px 0 #ccc inset;
	transition:all 0.24s;
}
.m41 .section2 .conwrap .con dl:nth-child(1){
	background:url(/images/page/m41_sec2_icon1.png) no-repeat 60px center;
	background-size:100px;
}
.m41 .section2 .conwrap .con dl:nth-child(2){
	background:url(/images/page/m41_sec2_icon2.png) no-repeat 60px center;
	background-size:100px;
}
.m41 .section2 .conwrap .con dl:nth-child(3){
	background:url(/images/page/m41_sec2_icon3.png) no-repeat 60px center;
	background-size:100px;
}
.m41 .section2 .conwrap .con dl dt{font-family:"Montserrat";font-size:27px;color:#000;font-weight:600;}
.m41 .section2 .conwrap .con dl dd{margin-top:40px;font-size:17px;color:#000;line-height:1.7em;}
/*
.m41 .section2 .conwrap .con dl:hover:nth-child(1){
	background:#000 url(/images/page/m41_sec2_icon1.png) no-repeat 60px center;
	background-size:100px;
}
.m41 .section2 .conwrap .con dl:hover:nth-child(2){
	background:#000 url(/images/page/m41_sec2_icon2.png) no-repeat 60px center;
	background-size:100px;
}
.m41 .section2 .conwrap .con dl:hover:nth-child(3){
	background:#000 url(/images/page/m41_sec2_icon3.png) no-repeat 60px center;
	background-size:100px;
}
.m41 .section2 .conwrap .con dl:hover dt{color:#fff;}
.m41 .section2 .conwrap .con dl:hover dd{color:#fff;}
*/

.m41 .section3{padding-top:280px;}
.m41 .section3 .sub_title{width:100%;margin:0 auto 150px;}
.m41 .section3 .conwrap{
	overflow:hidden;
	display:flex;flex-wrap:wrap;align-items:center;
	width:100%;height:100vh;
}
.m41 .section3 .conwrap .leftarea{
	box-sizing:border-box;
	width:50%;
	padding-right:5.5%;
}
.m41 .section3 .conwrap .leftarea h4{font-size:54px;color:#000;font-weight:700;line-height:1.2em;}
.m41 .section3 .conwrap .leftarea p{margin:40px 0 60px;font-size:17px;color:#555;line-height:1.7em;}
.m41 .section3 .conwrap .leftarea .img{}
.m41 .section3 .conwrap .rightarea{
	box-sizing:border-box;
	width:50%;height:100%;
	padding-top:40px;padding-left:5.5%;
	border-left:1px solid #ccc;
}
.m41 .section3 .conwrap .rightarea dl{
	padding:32px 0 40px;
	border-top:2px solid #000;
}
.m41 .section3 .conwrap .rightarea dl dt{font-family:"Montserrat";font-size:27px;color:#000;font-weight:600;}
.m41 .section3 .conwrap .rightarea dl dd{margin-top:20px;font-size:17px;color:#555;line-height:1.7em;}
.m41 .section3 .conwrap .rightarea dl dd ul{}
.m41 .section3 .conwrap .rightarea dl dd ul li{
	display:flex;align-items:center;
	padding:30px 0;
	border-bottom:1px solid #ccc;
}
.m41 .section3 .conwrap .rightarea dl dd ul li:last-child{border:0;}
.m41 .section3 .conwrap .rightarea dl dd ul li .num{
	width:44px;
	font-size:17px;color:#000;font-weight:600;
}
.m41 .section3 .conwrap .rightarea dl dd ul li .txt{
	width:calc(100% - 44px);
	font-size:17px;color:#555;line-height:1.7em;
}

.m41 .section4{padding-top:280px;}
.m41 .section4 .sub_title{width:100%;margin:0 auto 150px;}
.m41 .section4 .txtarea{text-align:center;}
.m41 .section4 .txtarea h4{font-size:54px;color:#000;font-weight:700;line-height:1.2em;}
.m41 .section4 .txtarea p{margin:40px 0 160px;font-size:17px;color:#555;line-height:1.7em;}
.m41 .section4 .conwrap{}
.m41 .section4 .conwrap>ul{
	display:flex;
}
.m41 .section4 .conwrap>ul>li{
	flex:1;
	position:relative;
	width:33.333%;
	aspect-ratio:640/900;
	transition:all 0.6s;
}
.m41 .section4 .conwrap>ul>li .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
}
.m41 .section4 .conwrap>ul>li .bg:after{
	display:block;content:"";
	width:100%;height:100%;
	background:rgba(0,0,0,0.6);
	position:absolute;left:0;top:0;
	opacity:0;
	transition:all 0.4s;
}
.m41 .section4 .conwrap>ul>li:nth-child(1) .bg{
	background:url(/images/page/m41_sec4_bg1.jpg) no-repeat center / cover;
}
.m41 .section4 .conwrap>ul>li:nth-child(2) .bg{
	background:url(/images/page/m41_sec4_bg2.jpg) no-repeat center / cover;
}
.m41 .section4 .conwrap>ul>li:nth-child(3) .bg{
	background:url(/images/page/m41_sec4_bg3.jpg) no-repeat center / cover;
}
.m41 .section4 .conwrap>ul>li .txts{
	position:absolute;left:0;bottom:0px;
	box-sizing:border-box;
	width:100%;height:47px;
	padding:0 60px;
	transition:all 0.4s;
}
.m41 .section4 .conwrap>ul>li .txts .tit{
	padding-bottom:40px;
	font-size:clamp(28px,2.3vw,39px);color:#fff;font-weight:600;line-height:1.2em;
}
.m41 .section4 .conwrap>ul>li .txts .txt{
	opacity:0;
	padding-bottom:40px;
	font-size:17px;color:#fff;line-height:1.7em;
	transition:all 0.24s;
}
.m41 .section4 .conwrap>ul>li .txts ul{border-top:1px solid rgba(255,255,255,0.3);}
.m41 .section4 .conwrap>ul>li .txts ul>li{
	position:relative;
	padding:20px 0 20px 44px;
	border-bottom:1px solid rgba(255,255,255,0.3);
	font-size:17px;color:#fff;line-height:1.7em;
}
.m41 .section4 .conwrap>ul>li .txts ul>li:before{
	display:block;content:"";
	position:absolute;left:0;top:50%;
	transform:translateY(-50%);
	font-weight:600;
}
.m41 .section4 .conwrap>ul>li .txts ul>li:nth-child(1):before{content:"01";}
.m41 .section4 .conwrap>ul>li .txts ul>li:nth-child(2):before{content:"02";}
.m41 .section4 .conwrap>ul>li .txts ul>li:nth-child(3):before{content:"03";}

.m41 .section4 .conwrap>ul>li:hover .bg:after{opacity:1;}
.m41 .section4 .conwrap>ul>li:hover .txts .txt{opacity:1;transition:all 0.24s 0.24s;}






.bbs{padding: 0 0 200px;}
.bbs .list{
	border-top: 1px solid #000;
}
.bbs .list li{}
.bbs .list li a{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 40px 60px;
	border-bottom: 1px solid #ccc;
}
.bbs .list li a .thumb{
	width: 520px;
	aspect-ratio: 520 / 350;
	overflow: hidden;
}
.bbs .list li a .thumb img{
	width: 100%;
	height: 100%;
	object-fit:cover;
	transition: all 0.6s;
}
.bbs .list li a:hover .thumb img{
	transform: scale(1.05);
}
.bbs .list li a .txtwrap{
	width: calc(100% - 520px);
	padding-left: 100px;
}
.bbs .list li a .txtwrap .tit{
	font-size: var(--font-size-26);
	font-weight: 600;
}
.bbs .list li a .txtwrap .con{
	font-size: var(--font-size-18);
	font-weight: 300;
	color: #555;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-height: 1.7em;
	height: 3.4em;
	margin: 20px 0 30px;
}
.bbs .list li a .txtwrap .date{
	font-size: var(--font-size-17);
}

.bbs_view{padding: 0 0 150px;}
.bbs_view .titwrap{
	border-top: 1px solid #000;
	width: 100%;
	padding: 80px 0;
	text-align: center;
}
.bbs_view .titwrap .tit{
	font-size: var(--font-size-36);
	font-weight: 600;
}
.bbs_view .titwrap .date{
	margin-top: 30px;
	font-size: 20px;
}
.bbs_view .filewrap{
	border-top: 1px solid #ccc;
	padding: 20px 0;
	display: flex;
	flex-wrap: wrap;
	column-gap: 15px;
	justify-content: center;
}
.bbs_view .filewrap a{
	position: relative;
	font-family: "Noto Sans KR";
	display: inline-block;
	padding-left: 23px;
	font-size: 16px;
	margin-right: 15px;
	color: #777;
}
.bbs_view .filewrap a:after{
	content: "";
	position: absolute;
	left: 0;
	top: 5px;
	width: 16px;
	height: 16px;
	background: url(/images/page/file_icon.png) no-repeat center / contain;
}
.bbs_view .conwrap{
	width: 100%;
	padding: 100px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.bbs_view .btnwrap{
	margin-top: 80px;
	text-align: center;
}
.bbs_view .btnwrap a{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 180px;
	height: 55px;
	font-size: var(--font-size-18);
	font-weight: 600;
	color: #fff;
	background: #111;
	gap: 10px;
}
.bbs_view .btnwrap a img{transform: translateY(2px);}


.m61{padding: 0 0 200px; background: #F8F8F8;}
.m61 .sec_tit{
	font-size: var(--font-size-40);
	font-weight: 600;
	margin-bottom: 160px;
}
.m61 .conwrap{}
.m61 .conwrap .con + .con{
	margin-top: 120px;
}
.m61 .conwrap .con{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	min-height: 1px;
}
.m61 .conwrap .con:nth-child(even){
	flex-direction: row-reverse;
}

.m61 .conwrap .con .imgwrap{
	width: 32%;
/* 	height: 100%; */
}
.m61 .conwrap .con .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m61 .conwrap .con .txtwrap{
	width: 66%;
	height: 100%;
}
.m61 .conwrap .con .txtwrap .titwrap{
	width: 100%;
	padding: 80px 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #ccc;
}
.m61 .conwrap .con .txtwrap .titwrap .tit{
	font-family: "Pretendard";
	font-size: var(--font-size-40);
	font-weight: 600;
}
.m61 .conwrap .con .txtwrap .titwrap .tit span{
	font-size: var(--font-size-24);
	margin-right: 20px;
	vertical-align: middle;
}
.m61 .conwrap .con .txtwrap .titwrap p{
	margin-top: 20px;
	font-size: var(--font-size-18);
	color: #555;
}
.m61 .conwrap .con .txtwrap .boxwrap{
	margin-top: 80px;
	display: flex;
	flex-wrap: wrap;
	gap: 27px;
}
.m61 .conwrap .con .txtwrap .boxwrap .box{
	width: calc((100% - 54px ) / 3);
	padding: 60px 40px;
	min-height: 420px;
	background: #fff;
}
.m61 .conwrap .con .txtwrap .boxwrap .box .icon{}
.m61 .conwrap .con .txtwrap .boxwrap .box .tit{
	font-family: "Pretendard";
	font-size: var(--font-size-22);
	font-weight: 600;
	margin: 25px 0 10px;
}
.m61 .conwrap .con .txtwrap .boxwrap .box p{
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	font-weight: 300;
	line-height: 1.7em;
	color: #555;
}


.m62{}
.m62 .section1{
	position: relative;
	padding: 0 0 200px;
	background: #F8F8F8;
}
.m62 .section1:after{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width :100%;
	height: 150px;
	background: #fff;
}
.m62 .section1 .innerwrap{
	position: relative;
	z-index: 2
}
.m62 .section1 .con{}
.m62 .section1 .con + .con{
	margin-top: 160px;
}
.m62 .section1 .con .img{
	width: 100%;
	height: 480px;
}
.m62 .section1 .con .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m62 .section1 .con .conwrap{
	margin: 100px auto 0;
	width: 92%;
	max-width: 1680px;
}
.m62 .section1 .con .conwrap .tit{
	font-size: var(--font-size-40);
	font-weight: 600;
}
.m62 .section1 .con .conwrap .boxwrap{
	margin-top: 40px;
	display: flex;
	justify-content: space-between;
}
.m62 .section1 .con .conwrap .boxwrap .box{
	width: 24%;
	height: 340px;
	background: #fff;
	padding: 60px 40px;
}
.m62 .section1 .con .conwrap .boxwrap .box .txt1{
	font-size: var(--font-size-22);
	font-weight: 600;
	margin: 55px 0 10px;
}
.m62 .section1 .con .conwrap .boxwrap .box .txt2{
	font-size: var(--font-size-18);
	font-weight: 300;
	color: #555;
}
.m62 .section1 .con .conwrap .boxwrap .box:hover{
	background: #000;
}
.m62 .section1 .con .conwrap .boxwrap .box:hover svg path{
	stroke: #fff;
}
.m62 .section1 .con .conwrap .boxwrap .box:hover .txt1{
	color: #fff;
}
.m62 .section1 .con .conwrap .boxwrap .box:hover .txt2{
	color: #fff;
}


.m63{padding: 0 0 200px;}
.m63 .list{
	padding-top: 60px;
	border-top: 1px solid #000;
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}
.m63 .list li{
	width: calc((100% - 90px) / 4);
	height: 360px;
}
.m63 .list li a{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 100%;
	height: 100%;
	padding: 40px 20px;
	background: #F8F8F8;
}
.m63 .list li a .txtwrap{}
.m63 .list li a .txtwrap .top{
	display: flex;
	align-items: center;
	padding-bottom: 12px;
	border-bottom: 1px solid #555;
}
.m63 .list li a .txtwrap .top .status{
	flex-shrink: 0;
	display: inline-block;
	padding: 6px 16px;
	background: #111;
	font-size: var(--font-size-18);
	font-weight: 600;
	border-radius: 100px;
	color: #fff;
	margin-right: 12px;
}
.m63 .list li a .txtwrap .top .status.off{
	background: #BCBCBC;
	color: fff;
}
.m63 .list li a .txtwrap .top .info{
	display: flex;
	align-items: center;
}
.m63 .list li a .txtwrap .top .info span{
	font-size: var(--font-size-18);
	font-weight: 600;
	color: #555;
}
.m63 .list li a .txtwrap .top .info span.level{
	position: relative;
	padding-right: 19px;
}
.m63 .list li a .txtwrap .top .info span.level:after{
	content: "";
	position: absolute;
	right: 8px;
	top: 6px;
	width: 1px;
	height: 13px;
	background: #999;
}
.m63 .list li a .txtwrap .con{
	padding-top: 20px;
}
.m63 .list li a .txtwrap .con span{
	display: inline-block;
	font-size: var(--font-size-26);
	font-weight: 600;
	line-height: 1.5em;
	word-break: break-all;
}
.m63 .list li a .txtwrap .con span.bar{
	color: #999;
	font-weight: 300;
	padding: 0 5px;
}
.m63 .list li a .date{
	font-size: var(--font-size-20);
	color: #555;
}
.m63 .list li a .date img{
	margin: 0 10px 4px 0;
}


.m63_view{}
.m63_view .titwrap .status{
	display: inline-block;
	padding: 6px 16px;
	background: #111;
	font-size: var(--font-size-18);
	font-weight: 600;
	border-radius: 100px;
	color: #fff;
	margin-bottom: 20px;
}
.m63_view .titwrap .status.off{
	background: #BCBCBC;
	color: fff;
}


.m64{padding: 0 0 200px;}
.m64 .sec_tit{
	font-size: var(--font-size-40);
	font-weight: 600;
}
.m64 .formwrap{
	margin-top: 80px;
	border-top: 1px solid #000;
}
.m64 .formwrap .inquirywrap{
	padding: 100px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	row-gap: 40px;
}
.m64 .formwrap .inquirywrap dl{width: 48%;}
.m64 .formwrap .inquirywrap dl dt{
	font-size: var(--font-size-20);
	font-weight: 600;
	margin-bottom: 30px;
}
.m64 .formwrap .inquirywrap dl dt span{
	color: #FF3C42;
}
.m64 .formwrap .inquirywrap dl dd input{
    font-size: var(--font-size-18);
	width: 100%;
	border: 1px solid #ccc;
	height: 70px;
	padding: 0 30px;
	box-sizing: border-box;
}
.m64 .formwrap .inquirywrap dl dd input::placeholder{
	color: #555;
}
.m64 .formwrap .inquirywrap dl dd select {
	width: 100%;
	border: 1px solid #ccc;
	height: 70px;
	padding: 0 30px;
	box-sizing: border-box;
	font-size: var(--font-size-18);
	appearance: none;
	background: url(/images/page/m64_select_arr.png) no-repeat right 30px center;
}
.m64 .formwrap .inquirywrap dl dd .email{
	display: flex;
	align-items: center;
	gap: 12px;
}
.m64 .formwrap .inquirywrap dl dd .email .etc {
	flex-shrink: 0;
	font-size: var(--font-size-18);
	color: #555;
}
.m64 .formwrap .inquirywrap dl dd .email select {
	width: 100%;
	border: 1px solid #ccc;
	height: 70px;
	padding: 0 30px;
	box-sizing: border-box;
	font-size: var(--font-size-18);
	appearance: none;
	background: url(/images/page/m64_select_arr.png) no-repeat right 30px center;
}
.m64 .formwrap .inquirywrap dl dd .filebox {
	position: relative;
	display: flex;
	align-items: flex-end;
}
.m64 .formwrap .inquirywrap dl dd .filebox .upload-name {
	display: inline-block;
	box-sizing: border-box;
	width: calc(100% - 180px);
	height: 70px;
	line-height: 70px;
	outline: 0;
	font-size: var(--font-size-18);
	border: 1px solid #ccc;
	background: none;
}

.m64 .formwrap .inquirywrap dl dd .filebox input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
}
.m64 .formwrap .inquirywrap dl dd .filebox label {
	width: 180px;
	height: 70px;
	font-size: var(--font-size-18);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	border: 1px solid #ccc;
	color: #fff;
	background: #000;
}
.m64 .formwrap .agreewrap{
	padding: 100px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.m64 .formwrap .agreewrap .tit{
	font-size: var(--font-size-26);
	font-weight: 600;
}
.m64 .formwrap .agreewrap .txtwrap{
	margin: 30px 0 15px;
	width: 100%;
	border: 1px solid #ccc;
	padding: 30px;
}
.m64 .formwrap .agreewrap .txtwrap .inner{
	width: 100%;
	height: 250px;
	overflow-y: auto;
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #555;
}
.m64 .formwrap .agreewrap .txtwrap .inner::-webkit-scrollbar {
	width: 3px;
}
.m64 .formwrap .agreewrap .txtwrap .inner::-webkit-scrollbar-thumb {
	background: #000;
}
.m64 .formwrap .agreewrap .txtwrap .inner::-webkit-scrollbar-track {
	background: #f1f1f1;
}
.m64 .formwrap .agreewrap .agreebtn{
	display: flex;
	align-items: center;
}
.m64 .formwrap .agreewrap .agreebtn input{
	width: 28px;
	height: 28px;
	cursor: pointer;
}
.m64 .formwrap .agreewrap .agreebtn label{
	padding-left: 12px;
	font-size: var(--font-size-18);
}
.m64 .formwrap button{
	display: block;
	width: 183px;
	height: 51px;
	line-height: 51px;
	text-align: center;
	font-size: var(--font-size-18);
	color: #fff;
	background: #111;
	border: none;
	margin: 80px auto 0;
}


.m64_result{padding: 0 0 300px;}
.m64_result .conwrap{
	padding: 80px 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #ccc;
}
.m64_result .conwrap .con{
	position: relative;
	width: 92%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 120px 0;
	background: #FCFCFC;
}
.m64_result .conwrap .con .txts{
	text-align: center;
}
.m64_result .conwrap .con .txts b{
	display: inline-block;
	font-size: var(--font-size-36);
	font-weight: 600;
	line-height: 1.5em;
	margin: 30px 0;
}
.m64_result .conwrap .con .txts p{
	font-size: var(--font-size-20);
	line-height: 1.5em;
	color: #555;
}
.m64_result .conwrap .con .sq1{
	position: absolute;
	left: 0;
	bottom: 0;
}
.m64_result .conwrap .con .sq2{
	position: absolute;
	top: 0;
	right: 0;
}
.m64_result .link{
	display: block;
	margin: 80px auto 0;
	width: 223px;
	height: 55px;
	line-height: 55px;
	text-align: center;
	background: #111;
	color: #fff;
	font-size: var(--font-size-18);
	font-weight: 600;
}





@-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.2);}
.page_top.in-view .bg{transform: scale(1); transition: all 2s 0.2s;}
.page_top h2{opacity: 0; transform: translateX(-40px);}
.page_top.in-view h2{opacity: 1; transform: translateX(0); transition: all 2s 0.2s;}
.page_top h2:after{width: 0;}
.page_top.in-view h2:after{width: 100%; transition: all 2s;}


.m12 .ceo>div .msg{opacity:0;}
.m12 .ceo>div .pht{opacity:0;transform:translateX(60px);}
.m12 .ceo>div .msg.in-view{opacity:1;transition: all 1.2s 0.6s;}
.m12 .ceo>div .pht.in-view{opacity:1;transform:translateX(0);transition: all 1.2s 0.2s;}



.m14 .section2 .conwrap .bg{transform: scale(1.2);}
.m14 .section2 .conwrap.in-view .bg{transform: scale(1); transition: all 3s;}
.m14 .section3 .conwrap .ccwrap:after{width: 0;}
.m14 .section3 .conwrap .ccwrap.in-view:after{width: 100%; transition: all 2.4s;}
.m14 .section3 .conwrap .ccwrap .cc{opacity: 0; transform: scale(0.8);}
.m14 .section3 .conwrap .ccwrap .cc1{transition: all 1.2s 0.2s;}
.m14 .section3 .conwrap .ccwrap .cc2{transition: all 1.2s 0.5s;}
.m14 .section3 .conwrap .ccwrap .cc3{transition: all 1.2s 0.7s;}
.m14 .section3 .conwrap .ccwrap.in-view .cc{opacity: 1; transform: scale(1);}


.m20 .section1 .page-title{opacity: 0; transform: translateY(30px);}
.m20 .section1.in-view .page-title{opacity: 1; transform: translateY(0); transition: all 1.3s;}
.m20 .section1 .sec1-title{opacity: 0; transform: translateY(30px);}
.m20 .section1.in-view .sec1-title{opacity: 1; transform: translateY(0); transition: all 1.3s 0.1s;}
.m20 .section1 .sec1-text{opacity: 0; transform: translateY(30px);}
.m20 .section1.in-view .sec1-text{opacity: 1; transform: translateY(0); transition: all 1.3s 0.2s;}

.m20 .section1 .page-title::after{width: 0;}
.m20 .section1.in-view .page-title::after{width: 100%; transition: all 1.4s 0.7s;}


.m41 .section4 .conwrap>ul>li{transform: translateY(200px); opacity: 0;}
.m41 .section4 .conwrap>ul>li:nth-child(1){transition: all 1.2s 0.2s;}
.m41 .section4 .conwrap>ul>li:nth-child(2){transition: all 1.2s 0.4s;}
.m41 .section4 .conwrap>ul>li:nth-child(3){transition: all 1.2s 0.6s;}
.m41 .section4 .conwrap>ul>li.in-view{transform: translateY(0); opacity: 1;}

.m41 .section2 .conwrap .con dl dt{opacity: 0; transform: translateX(40px);}
.m41 .section2 .conwrap .con dl.in-view dt{opacity: 1; transform: translateX(0); transition: all 1.2s 0.2s}
.m41 .section2 .conwrap .con dl dd{opacity: 0; transform: translateX(40px);}
.m41 .section2 .conwrap .con dl.in-view dd{opacity: 1; transform: translateX(0); transition: all 1.2s 0.4s}

.m41 .section4 .txtarea h4{opacity: 0; transform: scale(0.8);}
.m41 .section4 .txtarea h4.in-view{opacity: 1; transform: scale(1); transition: all 1.2s 0.2s;}



.m61 .conwrap .con .imgwrap{overflow:hidden;}
.m61 .conwrap .con .imgwrap img{opacity:0;transform:scale(1.1);}
.m61 .conwrap .con .txtwrap .titwrap .tit{opacity:0;transform:translateX(40px);}
.m61 .conwrap .con .txtwrap .titwrap p{opacity:0;transform:translateX(40px);}
.m61 .conwrap .con .txtwrap .boxwrap .box{opacity:0;transform:translateY(40px);}

.m61 .conwrap .con .imgwrap.in-view img{opacity:1;transform:scale(1);transition:all 1.2s;}
.m61 .conwrap .con .txtwrap .titwrap.in-view .tit{opacity:1;transform:translateX(0);transition:all 1s;}
.m61 .conwrap .con .txtwrap .titwrap.in-view p{opacity:1;transform:translateX(0);transition:all 1s 0.2s;}
.m61 .conwrap .con .txtwrap .boxwrap .box.in-view{opacity:1;transform:translateY(0);}
.m61 .conwrap .con .txtwrap .boxwrap .box.in-view:nth-child(1){transition:all 1s 0.2s;}
.m61 .conwrap .con .txtwrap .boxwrap .box.in-view:nth-child(2){transition:all 1s 0.4s;}
.m61 .conwrap .con .txtwrap .boxwrap .box.in-view:nth-child(3){transition:all 1s 0.6s;}


.m62 .section1 .con .img{position:relative;}
.m62 .section1 .con .img:after{
	display:block;content:"";
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	background:rgba(0,0,0,0.3);
	backdrop-filter:blur(5px);
	transform-origin:right;
	transition:all 1.2s;
}
.m62 .section1 .con .conwrap .tit{opacity:0;transform:translateX(40px);transition:all 1.2s;}
.m62 .section1 .con .conwrap .boxwrap .box{opacity:0;transform:translateY(40px);transition:all 1.2s;}

.m62 .section1 .con .img.in-view:after{
	transform:scaleX(0);
	transition:1.6s;
}
.m62 .section1 .con .conwrap .tit.in-view{opacity:1;transform:translateX(0);}
.m62 .section1 .con .conwrap .boxwrap .box.in-view{opacity:1;transform:translateY(0);}