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

/*Layer*/
body{width:100%}
#wrap{width:100%}
#header{}
#container{width:100%}
#contents{background: #0f1d40;}
#footer{width:100%;}

.pcbr{display:none;}
.ptbr{display: none;}
.tbbr{display:none;}
.tmbr{display: block;}
.mbbr{display:block;}
.pc_view{display: none !important;}
.pt_view{display: none !important;}
.t_view{display: none !important;}
.tm_view{display: block !important;}
.m_view{display: block !important;}
.dn{display:none;}
* {font-family:"Avenir LT Pro","Noto Sans KR","돋움",dotum,sans-serif;box-sizing:border-box;}
button{background: inherit ; border:none; box-shadow:none; border-radius:0; padding:0; overflow:visible; cursor:pointer;}
.head{
max-width: 1640px;
padding: 38px 0;
margin: 0 auto;
width: 94%;
background: #0f1d40;
}
.innerwrap{
max-width: 1640px;
margin: 0 auto;
width: 94%;
}

.subTop .pageTitleArea{padding-top: 160px;display: flex;position: relative;
flex-wrap:wrap;
padding-bottom: 50px;margin-bottom: 50px;border-bottom: 1px solid rgba(255,255,255,0.3);}
.subTop .pageTitleArea:before{
	position: absolute;content:'';
	width:100%;height:1px;
	bottom:0;left:0;
	background: rgba(255,255,255,0.3);
}
.subTop .pageTitleArea h3{width:100%;padding-top: 10px;margin-bottom: 50px;}
.subTop .pageTitleArea h3>span{
overflow: hidden;
display: inline-block;
position: relative;
font-size: 26px;
font-weight: 600;
line-height: 1.2em;
}
.subTop .pageTitleArea h3>span:before{
	position: absolute;left:0;top: 0;
	content:'About Us';
	width: 100%;height: 100%;
	background: linear-gradient(
        to right,
        #48d2fe 0%,
        #5adfed 16%,
        #6ce9dc 32%,
        #7ccae1 48%,
        #7db4eb 64%,
        #7d99f8 80%,
        #48d2fe 100%);
		background-size: 200% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
	animation: textGradient1 2s linear infinite;
}
@keyframes textGradient1 {
	0% {
		background-position: 0% center;
	}
	100% {
		background-position: -200% center;
	}
}
.subTop .pageTitleArea.pn2 h3>span:before{content:'R&D';}
.subTop .pageTitleArea.pn3 h3>span:before{content:'News & Events';}
.subTop .pageTitleArea.pn4 h3>span:before{content:'Join Us';}
.subTop .pageTitleArea.pn5 h3>span:before{content:'Contact';}
.subTop .pageTitleArea p{width:100%;
color:#fff;font-size: min(7vw, 36px);font-weight: 700;text-align: left;
}
.subTop .pageTitleArea p strong{font:inherit;}
.subTop .pageTitleArea p strong span{font:inherit;color:#00a3d9;display: unset;}
.subTop .botarea{
margin-bottom: 120px;
display: flex;flex-direction:column-reverse;
align-items:start;
}
.subTop .botarea .tabArea{width:100%;}
.subTop .botarea .tabArea ul{
display: flex;align-items:center;gap:10px;width:100%;
}
.subTop .botarea .tabArea ul.w1>li{width:100%;}
.subTop .botarea .tabArea ul.w2>li{
width:calc((100% - 10px) / 2);
}
.subTop .botarea .tabArea ul>li>a{
display: flex;align-items:center;justify-content:center;
width:100%;height:50px;border-radius:25px;
background: #050810;font-size:14px;color:#fff;font-weight: 400;
padding:0 1vw;max-width:100%;
}
.subTop .botarea .tabArea ul>li.on>a{
background: linear-gradient(to right, #48d2fe 0%, #5adfed 16%, #6ce9dc 32%, #7ccae1 48%, #7db4eb 64%, #7d99f8 80%, #48d2fe 100%);
    background-size: 140% auto;color:#000;font-weight: 550;
}
.subTop .botarea .tabArea ul>li>a>span{font:inherit;}
.subTop .botarea .locations{position: relative;z-index:100;margin-bottom: 40px;display: none;}
.subTop .botarea .locations>ul{display: flex;align-items:center;justify-content:center;}
.subTop .botarea .locations>ul>li{position: relative;}
.subTop .botarea .locations>ul>li:first-child{padding-left: 0;}
.subTop .botarea .locations>ul>li:last-child{padding-right: 0;}
.subTop .botarea .locations>ul>li:before{
	position: absolute;content:'';
	background: url(/images/page/location_arr.png)no-repeat center / contain;
	width:6px;height:8px;
	top:50%;right:-2px;transform:translateY(-50%);
}
.subTop .botarea .locations>ul>li:last-child:before{display: none;}
.subTop .botarea .locations>ul>li>a{position: relative;display: block;width:100%;font-size:15px;font-weight: 300;color:#fff;padding:0 16px;font-weight: 400;
letter-spacing:0.2px;}
.subTop .botarea .locations>ul>li.home>a{padding-left: 24px;}
.subTop .botarea .locations>ul>li.home>a:after{
	position: absolute;content:'';
	background: url(/images/page/location_home.png)no-repeat center;
	width:14px;height:14px;
	left:0;;top:50%;transform:translateY(-50%);
}
.m00 .pgTitle>span{
overflow: hidden;
display: inline-block;
position: relative;
font-size: 32px;
font-weight: 600;
line-height: 1.2em;
}
.m00 .pgTitle>span:before{
	position: absolute;left:0;top: 0;
	content:'About Us';
	width: 100%;height: 100%;
	background: linear-gradient(
        to right,
        #48d2fe 0%,
        #5adfed 16%,
        #6ce9dc 32%,
        #7ccae1 48%,
        #7db4eb 64%,
        #7d99f8 80%,
        #48d2fe 100%);
		background-size: 200% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
	animation: textGradient1 2s linear infinite;
}
.m00 .pgDesc{
font-size:16px;color:#fff;line-height: 1.5em;
}

.view_btn, .view_btn:hover{
display: flex;align-items:center;justify-content:center;
border:2px solid #00a3d9;box-sizing:border-box;
width:260px;height:70px;border-radius:35px;
color:#00a3d9;font-size:15px;opacity:0.9;
max-width:100%;margin:0 auto;
}
.view_btn.wht, .view_btn.wht:hover{color:#fff;border:2px solid #fff;}
.view_btn>span{font:inherit;}
.bbs_view .view_btn.wht{width:240px;}

/*m11*/
.m11 .pgTitle>span:before{content:'Mission';}
.m11 .pageTxt{
margin-top: 50px;
margin-bottom: 100px;
color:#fff;font-size:16px;font-weight: 400;
}
.m11 .sec2{background: #0e152b;padding-top: 160px;}
.m11 section .area{padding-bottom: 180px;display: flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:7%;}
.m11 section .area.rev{flex-direction:row-reverse;}
.m11 .sec2 .area{padding-bottom: 100px;}
.m11 .area .txtwrap{width:100%;}
.m11 .area .txtwrap h5{font-size:26px;color:var(--text-color);font-weight: bold;margin-bottom: 40px;}
.m11 .area .txtwrap p{
font-size:15px;color:rgba(255,255,255,0.7);font-weight:400;
line-height: 1.5em;
}
.m11 .area .img{width:100%;margin-top: 50px;}
.m11 .area .img img{border-radius:10px;}

/*m12*/
.m12{padding-bottom: 160px;}
.m12 .pgTitle>span:before{content:'Leadership';}
.m12 .pgDesc{margin:30px auto 60px;}

/* 탭 메뉴 기본 스타일 */
.m12 .cateWrap{margin-bottom: 120px;}
.m12 .cateTab {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;

  border-radius:10px;
  border:1px solid #57617a;
}

.m12 .cateTab li {
  flex: 1;
  text-align: center;
  position: relative;
  height:76px;
}

.m12 .cateTab li a {
  display: block;
  height: 100%;
  padding: 15px 0;
  color: #ffffff;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  display: flex;align-items:center;justify-content:center;
  font-weight: 600;
  border-radius: 10px;
}

.m12 .cateTab li a span {
  position: relative;
  z-index: 2;
  font-size:15px;color:#fff;font-weight: 400;
}

/* 활성화된 탭(on 클래스) 스타일 */
.m12 .cateTab li.on a span{
  background: linear-gradient(to right, #36D1DC, #5B86E5);
  -webkit-background-clip: text;
  color: transparent;
  font-weight: 700;
}



.m12 .cateTab li.on a {
  position: relative;
  z-index: 1;
}

.m12 .cateTab li.on a::before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background: linear-gradient(to right, #36D1DC, #5B86E5);
  border-radius: 12px;
  z-index: -1;
}

.m12 .cateTab li.on a::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #0f1d40; /* 배경색과 동일한 색상 */
  border-radius: 10px;
  z-index: -1;
}


.m12 .cate-tit{
font-size:24px;color:#fff;font-weight: 700;margin-bottom: 40px;
}
.m12 .leaders{
	display:flex;flex-wrap:wrap;gap:80px 2.08vw;
}
.m12 .leaders li{
	overflow:hidden;
	width:100%;
	border-radius:10px;
	background:#050810;transition:all 0.24s;
}
.m12 .leaders li .pht{position: relative;text-align:center;}
.m12 .leaders li .pht:after{
	display:block;content:"";
	width:40px;height:40px;
	border-radius:50%;
	background:#000000 url(/images/page/m12_more.png) no-repeat center;
	position:absolute;right:0;top:50%;
	top:max(1.04vw, 20px);right:max(1.04vw, 20px);
	transition:all 0.24s;
}
.m12 .leaders li .pht img{width:100%;object-fit:cover;aspect-ratio:38 / 39;transition:all 0.24s;}
.m12 .leaders li:hover .pht img{}
.m12 .leaders li:hover .pht:after{background:#00a3d9 url(/images/page/m12_more.png) no-repeat center;}
.m12 .leaders li .infowrap{
min-height:170px;background: #050810;
padding:40px 1.56vw 20px;
}
.m12 .leaders li .name{
	box-sizing:border-box;
	position:relative;
	font-size:20px;color:#fff;
	width: 100%;
	border-bottom:1px solid rgba(255,255,255,0.3);
	margin-bottom: 16px;padding-bottom: 16px;
}
.m12 .leaders li .pos{
	font-size:15px;color:#fff;
	width: 100%;
}
.m12 .leaders li:hover .infowrap{background: #00a3d9;}

@media screen and (max-width:1024px){
.m12 .leaders li{width:calc((100% - 2.08vw) / 2);}
}
@media screen and (max-width:600px){
.m12 .leaders li{width:100%;}
}
/*paging*/
.paging{margin-top:85px;text-align:center;}
.paging a{display:inline-block;vertical-align:top;box-sizing:border-box;
width:40px;height:40px;color:#656565;font-size:14px;line-height:40px;font-weight:400;}

.paging .prev{width:40px;height:40px;background: url(/images/page/page_prev.png) no-repeat center;border: 0;margin-right: 10px;}
.paging .next{width:40px;height:40px;background: url(/images/page/page_next.png) no-repeat center;border: 0;margin-left: 10px;}

.paging strong{display:inline-block;vertical-align:top;box-sizing:border-box;width:40px;height:40px;font-weight: 600;
color:#fff;font-size:14px;line-height:40px;background: #00a3d9;border-radius:50%;}
.paging .page_begin{
	width:40px;height:40px;
	background:url(/images/page/page_begin.png) no-repeat center;
	border:0;
}
.paging .page_prev{
	width:40px;height:40px;
	background:url(/images/page/page_prev.png) no-repeat center;
	border:0;margin-right:10px;
}
.paging .page_next{
	width:40px;height:40px;
	background:url(/images/page/page_next.png) no-repeat center;
	border:0;margin-left:10px;
}
.paging .page_end{
	width:40px;height:40px;
	background:url(/images/page/page_end.png) no-repeat center;
	border:0;
}

/*m21*/
.m21 .pgTitle>span:before{content:'Science';}
.m21 .pgDesc{
margin-top: 30px;padding-right: 2vw;
margin-bottom: 100px;
}
.m21 .sec1{padding:120px 0;position: relative;display: flex;flex-direction:column-reverse;background: #0a1531;align-items:center;}
.m21 .sec1 .img{
/* position: absolute;
top:50%;left:0;
transform:translateY(-50%);
width:100%;height:100%;z-index:1; */
margin-top: 60px;
}
.m21 .sec1 .area{position: relative;z-index:10;padding-bottom: 0;}

.m21 section .area{padding-bottom: 120px;display: flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:7%;}

.m21 section .area.rev{padding-bottom: 0;}
.m21 .sec2{padding-top: 120px;}
.m21 .area .txtwrap{width:100%;padding-right: 0vw;}
.m21 .area .txtwrap h5{font-size:26px;color:var(--text-color);font-weight: bold;margin-bottom: 30px;}
.m21 .area .txtwrap p{
font-size:15px;color:rgba(255,255,255,0.7);font-weight:400;
line-height: 1.55em;
}
.m21 .area .img{width:100%;margin-top: 60px;}
.m21 .area .img img{border-radius:10px;}
.m21 .sec3{overflow:hidden;position: relative;overflow:hidden;padding: 120px 0 0;}
.m21 .sec3>img{max-width:100vw;width:100vw;}
.m21 .sec3 .area{padding-bottom: 0;}
.m21 .sec3 .area img{}
.m21 .sec3 .img{
position: absolute;
bottom:0;right:0;
width:100%;z-index:1;height: 100%;
}
.m21 .sec3 .img img{
	width: 100%;
	height: 100%;
	object-fit: contain;;
	object-position:right bottom;
}
.m21 .sec3 .txtwrap{
position: relative;z-index:10;
}

/*m22*/
.m22{padding-bottom: 143px;}
.m22 .pgTitle>span:before{content:'Pipeline';}
.m22 .pgDesc{
margin-top: 30px;padding-right: 2vw;
margin-bottom: 80px;
}
.m22 .pipeline{width:100%;
overflow:hidden;overflow-x:auto;
padding-bottom: 40px;
margin: 0 auto;}
.m22 .pipeline::-webkit-scrollbar {height: 4px;  /* 스크롤바의 너비 */}
.m22 .pipeline::-webkit-scrollbar-track {background:#000;}
.m22 .pipeline::-webkit-scrollbar-thumb {background: #f8f8f8;cursor:pointer;}
.m22 .pipeline .desc{
display: flex;margin-top: 30px;
}
.m22 .pipeline .desc p{font-size:15px;color:rgba(255,255,255,0.5);}
.m22 table {
    width: 990px;
    border-bottom: 1px solid #ccc;
	border-collapse: collapse;
}
.m22 table th {
   padding:0 1vw;
    font-size: 15px;
	color:#00a3d9;
	height:30px;
    text-align: center;
	position: relative;
	text-transform: uppercase;
}
.m22 table th:before,
.m22 table th:last-child:after{
	position: absolute;content:'';
	width:1px;height: 100%;max-height:30px;
	background: rgba(255,255,255,0.3);
	top:0;left:0;
}
.m22 table th:last-child:after{left:auto;right:0;}

.m22 table td {
    text-align: center;
	font-size: 15px;
    border:1px solid rgba(255,255,255,0.3);
    color: #fff;
	padding: 20px 1vw;
}
.m22 table td.program{padding:50px 1vw;}

.m22 table td.tit span{
	display:block;
	color: var(--text-color);
	font-size:16px;font-weight: 600;
	line-height: 1.4em;

}
.m22 table td.program,
.m22 table td.target{}
.m22 table td.indic{line-height: 1.5em;}
.m22 table td.notes{color:rgba(255,255,255,0.5);}
.m22 table td.program span{display: block;font-size:14px; color: #5e6c91;font-weight: 400;margin-top: 4px;}
.m22 table td.tit span.gr{background-color: #13883b;}
.m22 table td button{color: #fff;position: relative; font-size:15px;font-weight: 400;outline:none;border:none;background: transparent;
padding-right: 20px;}
.m22 table td button:after{
	content:"";
	position: absolute;
	right:0;
	top:50%;
	transform:translateY(-50%);
	width: 9px;
	height: 9px;
	background: url('/images/page/m22_more.png') no-repeat center;
}
.m22 table td button.nonepop:after{width:0;}
.m22 table td button.nonepop:hover{text-decoration:none;}
.m22 table td.pipewrap{padding: 0;}
.m22 table td .pipe{
	position: relative;
    display: flex;
    width: 100%;
	height:100%;
	min-height: 140px;
}
.m22 table td .pipe .line {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: flex;
}
.m22 table td .pipe .line>div{
	position: relative;
	width: 25%;
    box-sizing: border-box;
    border-right: 1px solid rgba(255,255,255,0.3);
}
.m22 table td .pipe .line>div:last-child{border-right: none;}

.m22 table td .pipe .percent{
	position: absolute;
    left: 0;
    top:50%;
	transform:translateY(-50%);
    height: 40px;
    background: linear-gradient(to right, #48d2fe, #74e9d7, #7d9bf7);
	border-radius:20px;
	width:var(--pipe-width);
}

/* m22 popup */
.pop{
position: fixed;
    left: 50%;
    top: 50%;
    z-index:6000;
    background: #fff;
    max-width: 700px;
    width: 94%;
    transform: translate(-50%, -50%);
	border-radius:10px;
	display: none;
}
.pop .conwrap{
    overflow: hidden;
    overflow-y: auto;
    min-height: 85vh;
    box-sizing: border-box;
    padding: 30px 4vw;
}
.pop .conwrap .titlearea{font-size:24px;color:#111111;font-weight: bold;padding-bottom: 2vh;margin-bottom: 2vh;
border-bottom: 2px solid #cccccc;
}
.pop .conwrap .conarea .tit1{
display: flex;align-items:center;color:#00a3d9;font-size:22px;font-weight: bold;margin-bottom: 2vh;

}
.pop .conwrap .conarea .tit1 .icon{margin-right: 12px;}
.pop .conwrap .conarea .txtwrap{
border-radius:10px;background: #f3f3f3;padding:40px 1.56vw;
}
.pop .conwrap .conarea .txtwrap li{
position: relative;
padding-left: 16px;color:#555555;font-size:15px;font-weight: 400;line-height: 1.5em;
font-family: "Pretendard";
}
.pop .conwrap .conarea .txtwrap li + li{margin-top: 10px;}
.pop .conwrap .conarea .txtwrap li:before{
	position: absolute;content:'';
	width: 6px;height: 6px;border-radius:50%;
	top:8px;left:0;
	background: #00a3d9;
}


.pop .conwrap::-webkit-scrollbar {
    width: 8px;/* 스크롤바의 너비 */
}


.pop .conwrap::-webkit-scrollbar-thumb {
    height: 30%;/* 스크롤바의 길이 */
    background: #595959;/* 스크롤바의 색상 */
    border-radius: 10px;
}

.pop .conwrap::-webkit-scrollbar-track {
    background: #d4d4d4;/*스크롤바 뒷 배경 색상*/
}
.pop .btn_x {
    position: absolute;
    top: 0;
    right:3.13vw;
    margin-left: 10px;
    width: 35px;
	top:20px;
    aspect-ratio: 1 / 1;
}

.m31 .pgTitle>span:before {
  content: attr(data-text);
}
.bbs_list{padding-bottom: 120px;}
.bbs_list .pgDesc{
position: relative;margin-top: 30px;
}
.bbs_list .pgDesc .view_btn{
position: absolute;bottom:0;right:0;width:200px;font-size:14px;height: 60px;
max-width:100%;
}
.bbs_list .list{
margin-top: 80px;
display: flex;flex-wrap:wrap;
gap:40px 2.08vw;
}
.bbs_list .list>li{
	width:100%;aspect-ratio: 2 / 1;
	border-top: 1px solid #00a3d9;
}
.bbs_list .list>li a{display: block;}
.bbs_list .list>li  .date{
color:#00a3d9;font-size:16px;font-weight: 550;text-transform: uppercase;margin-bottom: 30px;
padding-top: 20px;
}
.bbs_list .list>li  .tit{
color:#ffffff;font-size:20px;font-weight: 550;line-height: 1.4em;
}

.bbs_view{padding-bottom: 120px;}
.bbs_view .viewarea{
border:1px solid #00a3d9;
border-left:0;border-right:0;
margin-top: 80px;
}
.bbs_view .viewarea .titlearea{
border-bottom:1px solid #00a3d9;
padding:30px 0;
}
.bbs_view .viewarea .titlearea .title{
color:#fff;font-size:22px;font-weight: 600;margin-top: 10px;
}
.bbs_view .viewarea .titlearea .date{color:#00a3d9;font-size:16px;font-weight: 550;text-transform: uppercase;}
.bbs_view .viewarea .conarea{
padding-top: 40px;
color:#fff;font-size:15px;font-weight: 400;line-height: 1.6em;
padding-bottom: 40px;
}
.bbs_view .btn{display: flex;justify-content:flex-end;margin-top: 50px;}

.m41{padding-bottom: 120px;}
.m41 .pgTitle{margin-bottom: 30px;}
.m41 .pgTitle>span:before{content:'Careers';}
.m41 .btn{margin:40px 0 100px;}
.m41 .title{display: flex;align-items:Center;margin-bottom: 60px;}
.m41 .title .bar{
width: 7px;min-height:36px;height:100%;
background: #00a3d9;
margin-right: 20px;
}
.m41 .title h4{font-size:30px;color:#fff;font-weight: bold;}
.m41 .area{display: flex;flex-wrap:wrap;align-items:center;justify-content:space-between;}
.m41 .area.rev{margin-top: 130px;}
.m41 .area .info_list{
width:100%;
}
.m41 .area .info_list li{display: flex;align-items:center;}
.m41 .area .info_list li + li{margin-top: 60px;}
.m41 .area .info_list li .icon{
width: 110px;aspect-ratio: 1 / 1;
background: url(/images/page/m41_icon1.png)no-repeat center / cover;
}
.m41 .area .info_list li:nth-child(2) .icon{background: url(/images/page/m41_icon2.png)no-repeat center / cover;}
.m41 .area.rev .info_list li:nth-child(1) .icon{background: url(/images/page/m41_icon4.png)no-repeat center / cover;}
.m41 .area.rev .info_list li:nth-child(2) .icon{background: url(/images/page/m41_icon3.png)no-repeat center / cover;}
.m41 .area .info_list li dl{width:calc(100% - 110px);padding-left: 4vw;}
.m41 .area .info_list li dl>dt{font-size:22px;color:var(--text-color);font-weight: bold;}
.m41 .area .info_list li dl>dd{font-size:15px;line-height: 1.5em;font-weight: 400;color:#fff;margin-top: 12px;}
.m41 .area .img{border-radius:10px;overflow:hidden;margin-top: 50px;}
.m41 .area .img img{width:100%;object-fit:cover;aspect-ratio: 76 / 52 ;}

/*m51*/
.m51{padding-bottom: 120px;}
.m51 .pgTitle>span:before{content:'Inquiries';}
.m51 .listwrap{
display: flex;flex-wrap:wrap;gap:40px 2.08vw;margin-top: 60px;
}
.m51 .listwrap>dl{width:100%;padding:45px 3.13vw;border-radius:10px;border:1px solid rgba(255,255,255,0.5);
min-height:280px;
}
.m51 .listwrap>dl>dt{
display: flex;align-items:center;margin-bottom: 30px;
}
.m51 .listwrap>dl>dt .bar{
width: 6px;min-height:34px;height:100%;
background: #00a3d9;
margin-right: 20px;
}
.m51 .listwrap>dl>dt h4{
font-size:26px;color:#fff;font-weight: bold;
}
.m51 .listwrap>dl>dd>div{display: flex;align-items:center;}
.m51 .listwrap>dl>dd>div + div{margin-top: 10px;}
.m51 .listwrap>dl>dd>div i{
display: block;
width: 40px;aspect-ratio: 1 / 1;
margin-right: 1.56vw;
background: url(/images/page/m51_email_icon.png)no-repeat center / cover;
}
.m51 .listwrap>dl>dd>div i.tel{background: url(/images/page/m51_tel_icon.png)no-repeat center / cover;}
.m51 .listwrap>dl>dd>div i.tel2{background: url(/images/page/m51_tel_icon2.png)no-repeat center / cover;}
.m51 .listwrap>dl>dd>div i.linkedin{background: url(/images/page/m51_linkedin_icon.png)no-repeat center / cover;}
.m51 .listwrap>dl>dd>div p, .m51 .listwrap>dl>dd>div a{
font-size:15px;color:rgba(255,255,255,0.7);font-weight:400;
width:calc(100% - 40px - 1.56vw);word-wrap:normal;word-break:break-all;
}
 .m51 .listwrap>dl>dd>div a:hover{text-decoration:underline;text-underline-offset:4px;}

.m51 .bottom{margin-top: 80px;}
.m51 .bottom>dl + dl{margin-top: 100px;}
.m51 .bottom>dl>dt{
  font-size:26px;color:#fff;font-weight:550;margin-bottom:40px;
  }
 .m51 .bottom>dl>dd>div{display: flex;align-items:center;}
 .m51 .bottom>dl>dd>div + div{margin-top: 10px;}
 .m51 .bottom>dl>dd>div p{
font-size:15px;color:rgba(255,255,255,0.7);font-weight:400;width:calc(100% - 40px - 1.56vw);word-wrap:normal;word-break:break-all;
}
 .m51 .bottom>dl>dd>div i{
display: block;
width: 40px;aspect-ratio: 1 / 1;
margin-right: 1.56vw;
}
 .m51 .bottom>dl>dd>div i.address{background: url(/images/page/m51_address_icon.png)no-repeat center / cover;}
 
/*MOTION*/
.fadeLeft, .fadeRight, .fadeUp, .fadeIn, .fadeImgRight, .rotateTxtUp, .iconRotate{opacity:0;}
.imgAni{clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
.imgAni.in-view{animation-name: imgAni; animation-duration:1.25s;animation-fill-mode:forwards;}
.fadeLeft.in-view{animation-name: fadeLeft;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeRight.in-view{animation-name: fadeRight;animation-duration: 0.8s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeUp.in-view{animation-name: fadeUp;animation-duration: 1s;animation-fill-mode:forwards;animation-timing-function: ease;}
.iconRotate.in-view{animation-name: iconRotate;animation-duration: 1s;animation-fill-mode:forwards;animation-timing-function: ease;}
.fadeIn.in-view{animation-name: fadeIn;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeImgRight.in-view{animation-name: fadeImgRight;animation-duration: 1.2s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeImgLeft.in-view{animation-name: fadeImgLeft;animation-duration: 1.2s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.rotateTxtUp.in-view{animation-name: rotateTxtUp;animation-duration: 1s;animation-fill-mode:forwards;animation-timing-function: ease;}
  
@keyframes bgScale{
0%{transform:scale(1.15);}
100%{transform:scale(1);}
}
@keyframes fadeLeft{
 0%{transform:translate3d(-100px, 0, 0);opacity:0;}
  100%{transform:translate3d(0px, 0, 0);opacity:1;}
}
@keyframes fadeRight{
 0%{transform:translate3d(120px, 0, 0);opacity:0;}
  100%{transform:translate3d(0%, 0, 0);opacity:1;}
}
@keyframes iconRotate{
0%{opacity:0;transform:rotateY(90deg);}
100%{opacity:1;transform:rotateY(0deg);}
}
@keyframes fadeUp{
0%{transform:translate3d(0%, 100px, 0);opacity:0;}
  100%{transform:translate3d(0%, 0, 0);opacity:1;}
}
@keyframes rotateTxtUp{
0%{transform:translateY(100px) rotate(2deg);}
  100%{opacity:1;transform:translateY(0px) rotate(0deg);}
}
@keyframes fadeIn{
0%{opacity:0;}
  100%{opacity:1;}
}
@keyframes imgAni{
0%{clip-path:polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{clip-path:polygon(100% 0, 0 0, 0 100%, 100% 100%);}

}
@keyframes fadeImgRight{
0%{opacity:0;clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
100%{opacity:1;clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}
@keyframes fadeImgLeft{
0%{opacity:0;clip-path:polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{opacity:1;clip-path:polygon(100% 0, 0 0, 0 100%, 100% 100%);}
}

.subTop .pageTitleArea h3,
.subTop .pageTitleArea p{overflow:hidden;}
.subTop .pageTitleArea h3>span,
.subTop .pageTitleArea p strong{
	transform:translateY(100%) rotate(3deg);opacity:0;
}
.subTop .pageTitleArea.in-view h3>span{
opacity:1;transform:translateY(0%) rotate(0deg);transition:all 0.9s;filter:blur(0px);
}
.subTop .pageTitleArea.in-view p strong{
display: inline-block;
opacity:1;transform:translateY(0%) rotate(0deg);transition:all 1s;transition-delay:0.1s;filter:blur(0px);
}

.subTop .pageTitleArea:before{width:0;}
.subTop .pageTitleArea.in-view:before{width:100%;transition:width 1.3s 0.15s;}
.subTop .botarea .tabArea,
.subTop .botarea .locations{opacity:0;transform:translateY(100px);}
.subTop .botarea.in-view .tabArea,
.subTop .botarea.in-view .locations{opacity:1;transform:translateY(0px);transition:all 1s 0.3s;}

.m00 .pgTitle,
.m00 .pageTxt,
.m00 .pgDesc{
opacity:0;transform:translateY(100px) rotate(2deg);
}
.m00 .pgTitle.in-view,
.m00 .pageTxt.in-view,
.m00 .pgDesc.in-view{
opacity:1;transform:translateY(0px) rotate(0deg);transition:all 0.8s 0s;
}
.m00 .pageTxt.in-view,
.m00 .pgDesc.in-view{transition-delay:0.2s;}
.m11 .area .txtwrap h5,
.m11 .area .txtwrap p{opacity:0;transform:translateY(100px) rotate(2deg);}
.m11 .area .txtwrap.in-view h5,
.m11 .area .txtwrap.in-view p{opacity:1;transform:translateY(0px) rotate(0deg);transition:all 0.8s 0s;}
.m11 .area .txtwrap.in-view p{transition-delay:0.1s;}
.m11 .area .img{opacity:0;transform:scale(0.6) translateX(30px);filter:blur(6px);}
.m11 .area .img.in-view{
opacity:1;transform:scale(1) translateX(0px);filter:blur(0px);transition:all 1s 0.1s;
}
.m12 .leaders li{opacity:0;transform:translateY(100px);}
.m12 .leaders li.in-view{opacity:1;transform:translateY(0px);transition:all 1s 0.1s;}



.m21 .area .txtwrap h5,
.m21 .area .txtwrap p{opacity:0;transform:translateY(100px) rotate(2deg);}
.m21 .area .txtwrap.in-view h5,
.m21 .area .txtwrap.in-view p{opacity:1;transform:translateY(0px) rotate(0deg);transition:all 0.8s 0s;}
.m21 .area .txtwrap.in-view p{transition-delay:0.1s;}
.m21 .area .img{opacity:0;transform:scale(0.6) translateX(30px);filter:blur(6px);}
.m21 .area .img.in-view{
opacity:1;transform:scale(1) translateX(0px);filter:blur(0px);transition:all 1s 0.1s;
}
.m21 .sec1 .img{opacity:0;transform:scale(0.6) translateX(-120px);filter:blur(6px);}
.m21 .sec1 .img.in-view{
opacity:1;transform:scale(1) translateX(0px);filter:blur(0px);transition:all 1s 0.1s;
}

.m22 .pipeline table td .pipe .percent{width:0;}
.m22 .pipeline table td .pipe .percent.in-view{width:var(--pipe-width);transition:width 0.8s ease;}

.m41 .area .img{opacity:0;transform:scale(0.6) translateX(30px);filter:blur(6px);}
.m41 .area .img.in-view{
opacity:1;transform:scale(1) translateX(0px);filter:blur(0px);transition:all 1s 0.1s;
}



.m51 .listwrap>dl.in-view:nth-child(2){animation-delay:0.1s;}
.m51 .listwrap>dl.in-view:nth-child(3){animation-delay:0.2s;}
.m51 .listwrap>dl.in-view:nth-child(4){animation-delay:0.3s;}