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

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


.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;}
.pc_view {display:block;}

.innerwrap{
	width: 92%;
	max-width: 1440px;
	margin: 0 auto;
}

.innerwrap2{
	width: 92%;
	max-width: 1760px;
	margin: 0 auto;
}

.paging{
	margin-top:80px;
	text-align:center;
}
.paging a{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width:50px;height:50px;
	font-family:"Wix Madefor Display";color:#999;font-size:18px;line-height:50px; font-weight: 500;
}
.paging strong{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width:50px;height:50px;
	border-radius:50%;
	background:#1c1c1c;
	font-family:"Wix Madefor Display";color:#fff;font-size:18px;line-height:50px;font-weight:400;
}
.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;
	border-radius: 0 0 0 185px;
}
.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.pn2 .bg{background: url(/images/page/sub_visual2.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 .inner{
	position: absolute;
	left: 50%;
	bottom: 160px;
	transform: translateX(-50%);
	width: 92%;
	max-width: 1760px;
	padding-bottom: 80px;
	border-bottom: 1px solid rgba(255,255,255,0.6);
	display: flex;
	justify-content: space-between;
	align-items: center
}
.page_top .inner .titwrap{}
.page_top .inner .titwrap .dep1{
	font-family: "Poppins";
	font-size: 170px;
	font-weight: 500;
	color: #fff;
}
.page_top .inner .pageLocation{
	display: flex;
	align-items: flex-end;
}
.page_top .inner .pageLocation li{
	position: relative;
	padding-left: 26px;
	font-size: 16px;
	color: #fff;
}
.page_top .inner .pageLocation li:after{
	content: "";
	position: absolute;
	left: 6px;
	top: 6px;
	width: 6px;
	height: 6px;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(-45deg);
}
.page_top .inner .pageLocation li:first-child{padding-left: 0;}
.page_top .inner .pageLocation li:first-child:after{
	display: none;
}
.page_top .inner .pageLocation li a.home img{margin: -5px 4px 0px 0;}
.page_top .inner .slogan{
	font-size: 32px;
	font-weight: 600;
	line-height: 1.5em;
	text-align: right;
	color: #fff;
}

#pageTop{
position: absolute;
top: -110px;
width: 100%;
}

.sub_tab{
	width: 92%;
	max-width: 1760px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	margin-top: 60px;
	position: relative;
    z-index: 2;
}
.sub_tab ul{
	display: flex;
	gap: 20px;
	width: fit-content;
	padding: 10px 45px;
	border-radius: 50px;
	background: #f5f5f5;
}
.sub_tab ul li{}
.sub_tab ul li a{
	display: inline-block;
	padding: 16px 20px;
	border-radius: 50px;
	font-size: 19px;
	font-weight: 500;
	color: #666;
}
.sub_tab ul li.on a{
	background: #0081c8;
	color: #fff;
}




.page_tit{
	padding: 200px 0 150px;
	width: 92%;
	max-width: 1440px;
	margin: 0 auto;
	font-size: 50px;
	font-weight: 600;
}


.m00{position: relative; overflow: hidden;}
.m00:after{
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	width: 632px;
	height: 596px;
	background: url(/images/page/page_bgIcon.png) no-repeat center / contain;
	z-index:-1;
}

.section{
	position: relative;
	z-index: 1;
}
.section.gray{background: #f8f8f8;}

/* m10 ~ */
.m10 h6.section1-title {
font-size: 74px;
font-weight: 600;
line-height: 92px;
}

/* m11 */
.m11 .section1 {
padding-bottom:200px;
background: url(/images/page/m11_img1.png) no-repeat  8% bottom / contain;
background-size: min(42vw,836px);
}

.m11 .section1 .content1 {
display: flex;
justify-content: space-between;
}

.m11 .section1 .content1 .section1-title {
width:40%;
}

.m11 .section1 .content1 .section1-title .sig {
overflow: hidden;
font-size: 74px;
font-weight: 600;
line-height: 92px;
}

.m11 .section1 .content1 .content-box {
width:50%;
}

.m11 .section1 .content1 .content-box img {
border-radius: 20px;
overflow: hidden;
}

.m11 .section1 .content1 .content-box p {
font-size: 18px;
color: #666;
line-height: 30px;
margin-top:90px;
}

/* m12 */
.m12 .section1 {
padding-bottom:200px;
}

.m12 .section1 .content1 .con1 {
display: flex;
justify-content: space-between;
}

.m12 .section1 .content1 .con1 .section1-title {
width:45%;
}

.m12 .section1 .content1 .con1 .text-box {
width: 50%
}

.m12 .section1 .content1 .con1 .text-box p {
font-size: 18px;
color: #666;
line-height: 30px;
}

.m12 .section1 .content1 .con1 .text-box p:not(:first-child):not(.text-name) {
margin-top: 50px;
}

.m12 .section1 .content1 .con1 .text-box .text-name {
margin-top: 85px;
}

.m12 .section1 .content1 .con1 .text-box .text-name img {
margin-left:10px;
}

.m12 .section1 .con2 {
margin-top:80px;
background: url(/images/page/m12_img2.png) no-repeat  center / cover;
border-radius: 17px 20px 286px 20px;
height:510px;
position: relative;
}

.m12 .section1 .con2 img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

/* m13 */
.m13 .section1 {
margin-bottom:200px;
}

.m13 .section1 .content1 .content-box {
border-radius: 20px;
display: flex;
flex-direction: column;
height:600px;
color:#fff;
padding: 120px 50px;
}

.m13 .section1 .content1 .content-box strong {
font-size:50px;
}

.m13 .section1 .content1 .content-box span {
font-size:34px;
margin-top: 27px;
}

.m13 .section1 .content1 .content-box .content-box__text{
margin-top: auto;
padding-top:35px;
position: relative;
overflow: hidden;
}

.m13 .section1 .content1 .content-box .content-box__text p {
line-height: 42px;
font-size:30px;
color:#fff;
}

.m13 .section1 .content1 .content-box .content-box__text::before{
content: "";
position: absolute;
left: 0;
top: 0;
width: 0%;
height: 1px;
background: rgba(255, 255, 255, 0.4);;
}

.m13 .section1 .content1 .con1 {
margin-top: 150px;
background: url(/images/page/m13_img1.png) no-repeat  center / cover;
}

.m13 .section1 .content1 .con2 {
margin-top: 60px;
background: url(/images/page/m13_img2.png) no-repeat  center / cover;
}

.m13 .section2 {
background: url(/images/page/m13_img3.png) no-repeat  center / cover;
}

.m13 .section2 .innerwrap {
padding:180px 0 280px;
}

.m13 .section2 .section2-title {
color:#fff;
font-size: 50px;
font-weight: 600;
}

.m13 .section2 .content1 {}

.m13 .section2 .content1 .coreValue-list {
margin-top:60px;
}

.m13 .section2 .content1 .coreValue-list .list-item{
display: flex;
align-items: center;
justify-content: center;
gap:60px;
}

.m13 .section2 .content1 .coreValue-list .list-item:nth-child(odd){
margin-left: calc(270px + 90px);
}

.m13 .section2 .content1 .coreValue-list .list-item:not(:first-child) {
margin-top:80px;
}

.m13 .section2 .content1 .coreValue-list .list-item .item-title{
width:270px;
height: 270px;
border-radius: 20px;
font-size: 28px;
font-weight: 500;
text-align: center;
color:#111;
background-color: rgba(255, 255, 255, 0.5);
display: flex;
align-items: center;
justify-content: center;
position: relative;
flex-shrink: 0;
}

.m13 .section2 .content1 .coreValue-list .list-item:nth-child(odd) .item-title::before {
content:'';
position: absolute;
width: 1px;
height: 120px;
border-left: 1px dashed #fff;
bottom: 0;
left: 0;
transform: rotate(229deg);
transform-origin: bottom;
}

.m13 .section2 .content1 .coreValue-list .list-item:nth-child(even):not(:last-child) .item-title::before {
content: '';
position: absolute;
width: 1px;
height: 120px;
border-left: 1px dashed #fff;
bottom: 0;
right: 0;
transform: rotate(131deg);
transform-origin: bottom;
}

.m13 .section2 .content1 .coreValue-list .list-item .item-text{
flex: 1;
}

.m13 .section2 .content1 .coreValue-list .list-item .item-text__subTitle{
font-size: 28px;
color:#fff;
font-weight: 500;
}

.m13 .section2 .content1 .coreValue-list .list-item .item-text__des{
font-size: 20px;
color:#fff;
margin-top:30px;
display: inline-block;
line-height: 30px;
}

/* m14 */
.m14 .section1 {
margin-bottom:200px;
}

.m14 .section1 .con1 {
margin-top:150px;
}

.m14 .section1 .certificate-list {
display:grid;
grid-template-columns: repeat(3, 1fr);
grid-row-gap: 100px;
justify-items: center;
}

.m14 .section1 .certificate-list .list-item {
width:100%;
}

.m14 .section1 .certificate-list .list-item:nth-child(3n-2) .thumb-box {
  border-left: 1px solid #e3e2e2;
}

.m14 .section1 .certificate-list .list-item:nth-child(3n-1) .thumb-box {
  border-left: 1px solid #e3e2e2;
  border-right: 1px solid #e3e2e2;
}

.m14 .section1 .certificate-list .list-item:nth-child(3n) .thumb-box {
  border-right: 1px solid #e3e2e2;
}

.m14 .section1 .certificate-list .list-item .thumb-wrap {
max-width:300px;
width:100%;
aspect-ratio: 300 / 430;
border-radius: 20px;
overflow: hidden;
border: 1px solid #e3e2e2;
margin: 0 auto;
}

.m14 .section1 .certificate-list .list-item .thumb-box img{
width: 100%;
height: 100%;
object-fit: cover;
}

.m14 .section1 .certificate-list .list-item .thumb-text {
text-align: center;
margin-top:32px;
font-size: 18px;
font-weight: 600;
}

/* m15 */
.m15 .section1 {
margin-bottom:200px;
}

.m15 .section1 .con1 {
margin-top:130px;
}

.m15 .section1 .related-list {
display:grid;
grid-template-columns: repeat(4, 1fr);
grid-column-gap: 25px;
grid-row-gap: 50px;
justify-items: center;
}

.m15 .section1 .related-list .list-item {
width: 100%;
height:170px;
border-radius: 20px;
border: 1px solid #e3e2e2;
background-color: #f9f9f9
}

.m15 .section1 .related-list .list-item .thumb-box {
width: 100%;
height: 100%;
padding: 20px;
display: flex;
justify-content: center;
align-items: center;
}

/* m16 */
.m16 .section1 .content1{
display: flex;
justify-content: space-between;
}

.m16 .section1 .content1 .con{
width: calc(100%/4);
max-width: 280px;
}

.m16 .section1 .content1 .con .con-title {
display: flex;
justify-content: flex-start;
align-items: center;
gap:20px;
}

.m16 .section1 .content1 .con .con-title .icon-wrap {
width: 80px;
height: 80px;
border-radius: 20px; 
background-color:#f4f4f4;
display: flex;
justify-content: center;
align-items: center;
}

.m16 .section1 .content1 .con .con-title strong {
font-size:24px;
}

.m16 .section1 .content1 .con .con-text {
margin-top: 30px;
padding-top: 30px;
border-top: 1px solid #ccc;
font-size:20px;
color:#666;
}

.m16 .section2 {
margin-top: 160px;
}

.m16 .section2 .root_daum_roughmap {
width:100%;
}

.m16 .section2 .root_daum_roughmap .wrap_map {
height: 720px;
}

.m16 .section2 .root_daum_roughmap .wrap_controllers,
.m16 .section2 .root_daum_roughmap .cont{
display: none;
}

/* product 공통 css */
.m20 .con_tit{
	width: 100%;
	padding-bottom: 60px;
	border-bottom: 2px solid #000;
}
.m20 .con_tit.mg{margin-top: 160px;}
.m20 .con_tit h3{
	font-size: 50px;
	font-weight: 600;
}
.m20 .con_tit p{
	font-size: 20px;
	line-height: 1.6em;
	color: #666;
	margin-top: 30px;
}
.m20 .con_p{
	position: relative;
	padding-left: 24px;
	margin-bottom: 40px;
	font-size: 28px;
	font-weight: 600;
}
.m20 .con_p:after{
	content: "";
	position: absolute;
	left: 0;
	top: 10px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 3px solid #0081c8;
	box-sizing: border-box;
}
.m20 .con{
	margin-top: 80px;
}
.cc_p{
	position: relative;
	padding-left: 17px;
	font-size: 18px;
	color: #666;
	line-height: 1.6em;
}
.cc_p + .cc_p{margin-top: 5px;}
.cc_p:after{
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	border: 1px solid #0684c9;
	box-sizing: border-box;
}

.m20 .mobile-img{
display:none;
}

/* m211 */
.m211{}
.m211 .section1{
	padding: 0 0 160px;
}
.m211 .section1 .intro_box{
width: 100%;
height: 468px;
padding: 80px 60px;
border-radius: 20px;
display: flex;
flex-direction: column;
justify-content: space-between;
background: url(/images/page/m211_sec1_intro_bg.jpg) no-repeat center / cover;
position: relative;
}
.m211 .section1 .intro_box::before {
display: block;
content: "";
width: 50%;
height: 100%;
background: #fff;
position: absolute;
left: 0%;
top: 0;
transform-origin: left;
transform: scaleX(1);
}

.m211 .section1 .intro_box::after {
display: block;
content: "";
width: 50%;
height: 100%;
background: #fff;
position: absolute;
right: 0%;
top: 0;
transform-origin: right;
transform: scaleX(1);
}

.m211 .section1 .intro_box h3{
	font-size: 74px;
	font-weight: 600;
	color: #fff;
	opacity:0;
}
.m211 .section1 .intro_box .txts{
	opacity:0;
}

.m211 .section1 .intro_box .txts h4{
	font-size: 28px;
	font-weight: 600;
	color: #fff;
}
.m211 .section1 .intro_box .txts p{
	font-size: 18px;
	line-height: 1.7em;
	color: #fff;
	margin-top: 30px;
}
.m211 .section1 .imgwrap{
	display: flex;
	margin-top: 20px;
	gap: 20px;
}
.m211 .section1 .imgwrap .img{
	width: calc((100% - 20px) / 2);
	text-align:center;
}
.m211 .section1 .imgwrap .img .box{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 412px;
	padding: 50px;
	border-radius: 20px;
	background: #f9f9f9;
}
.m211 .section1 .imgwrap .img .tit{
	display: inline-block;
	margin-top: 20px;
	padding: 10px 35px;
	border-radius: 50px;
	background: #565656;
	font-size: 18px;
	font-weight: 600;
	color: #fff;
}

.m211 .section2{
	padding: 160px 0;
}
.m211 .section2 .con1 .con_p{
display: flex;
justify-content: space-between;
}

.m211 .section2 .con1 .con_span {
font-size: 18px;
color: #666;
line-height: 1.6em;
display: block;
}

.m211 .section2 .con1 .con_p span{
	font-size: 16px;
	font-weight: 400;
}
.m211 .section2 .con1 .list{
margin-top:40px;
}
.m211 .section2 .con1 .list .boxwrap{
	display: flex;
	gap: 20px;
}
.m211 .section2 .con1 .list .boxwrap .box{
	width: calc((100% - 40px) / 3);
}
.m211 .section2 .con1 .list .boxwrap .box .img{
	width: 100%;
	aspect-ratio: 466 / 220;
	border-radius: 20px;
	overflow: hidden;
}
.m211 .section2 .con1 .list .boxwrap .box .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m211 .section2 .con1 .list .boxwrap .box .tit{
	width: 100%;
	margin-top: 20px;
	padding: 12px 0;
	border-radius: 50px;
	border: 2px solid #0081c8;
	font-size: 20px;
	font-weight: 600;
	color: #0081c8;
	text-align: center;
}
.m211 .section2 .con1 .list .boxwrap .box:last-child .tit{
	border: 2px solid #130063;
	color: #130063;
}
.m211 .section2 .con1 .list .box_exp{
	width: 100%;
	margin-top: 20px;
	padding: 12px 0;
	border-radius: 50px;
	background: #ececec;
	font-size: 20px;
	font-weight: 600;
	text-align: center;
}

.m211 .section2 .con1 .swiper-pagination {
display:none;
}

.m211 .section2 .con1 > .arr{
	text-align: center;
	margin: 40px 0;
}
.m211 .section2 .con1 .expwrap{
	margin-top: 50px;
	padding: 40px 50px;
	border-radius: 20px;
	background: #fff;
}

.m211 .section2 .con1 .expwrap strong {
    position: relative;
}

.m211 .section2 .con1 .expwrap strong::before{
content:'';
position: absolute;
left: 0;
bottom: -1px;
width: 100%;
height: 1px;
background: #666;
}

.m211 .section2 .con2 .boxwrap{
	width: 100%;
	padding: 40px;
	border-radius: 20px;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: space-around;
}
.m211 .section2 .con2 .boxwrap .img{
	width: calc((100% - 110px) / 2);
}
.m211 .section2 .con2 .boxwrap .arr{
	width: 110px;
	text-align: center;
	flex-shrink: 0;
}
.m211 .section2 .con2 .boxwrap .expwrap{
	width: calc((100% - 110px) / 2);
	padding: 60px 45px;
	border-radius: 20px;
	border: 1px solid #ccc;
}

.m211 .section3{
	padding: 160px 0 280px;
}
.m211 .section3 .con .conwrap{}
.m211 .section3 .con .conwrap .con_box{
	padding: 40px;
	background: #f8f8f8;
	border-radius: 20px 20px 0 0;
}
.m211 .section3 .con .conwrap .con_box .exp{
	margin-top: 50px;
	font-size: 18px;
}
.m211 .section3 .con .conwrap .con_exp{
	margin-top: 10px;
	padding: 15px 20px;
	border-radius: 0 0 20px 20px;
	background: #0081c8;
	font-size: 20px;
	font-weight: 600;
	color: #fff;
	text-align: center;
}

.m211 .section3 .con3 .conwrap .con_box_wrap{
	display: flex;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap{
	width: 50%;
	padding-right: 140px;
	position: relative;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap:after{
	content: "";
	position: absolute;
	right: 70px;
	top: 0;
	width: 1px;
	height: 100%;
	background: #ccc;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap .tit{
	font-size: 24px;
	font-weight: 600;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap p{
	font-size: 18px;
	line-height: 1.7em;
	color: #666;
	margin: 20px 0 30px;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap ul{
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap li{
	display: block;
	width: calc((100% - 15px) / 2);
	padding: 15px 10px;
	border-radius:50px;
	font-size: 16px;
	color: #fff;
	text-align: center;
}
.m211 .section3 .con3 .conwrap .con_box .txtwrap li:nth-child(1){background: #6c658f;}
.m211 .section3 .con3 .conwrap .con_box .txtwrap li:nth-child(2){background: #796f6f;}
.m211 .section3 .con3 .conwrap .con_box .txtwrap li:nth-child(3){background: #977b7b;}

.m211 .section3 .con4 .boxwrap{
	width: 100%;
	padding: 90px 30px;
	border-radius: 20px;
	background: #f8f8f8;
	display: flex;
	align-items: center;
}
.m211 .section3 .con4 .boxwrap .img{
	width: 40%;
	text-align: center;
	border-right: 1px solid #ccc;
}
.m211 .section3 .con4 .boxwrap .txts{
	width: 60%;
	padding-left: 70px;
	
}

.m211 .section3 .con5 .boxwrap,
.m211 .section3 .con6 .boxwrap{
	width: 100%;
	padding: 60px 30px;
	border-radius: 20px;
	background: #f8f8f8;
}
.m211 .section3 .con6 .boxwrap{
	display: flex;
}
.m211 .section3 .con6 .boxwrap .imgwrap{
	width: calc((100% - 120px) / 2);
	text-align: center;
}
.m211 .section3 .con6 .boxwrap .imgwrap .img{
	width: 100%;
	height: 370px;
	border-radius: 20px;
	background: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}
.m211 .section3 .con6 .boxwrap .arr{
	width: 120px;
	text-align: center;
}
.m211 .section3 .con6 .boxwrap .arr img{margin-top: 150px;}
.m211 .section3 .con6 .boxwrap .imgwrap .tit{
	display: inline-block;
	margin-top: 20px;
	width: 210px;
	height: 46px;
	line-height: 46px;
	border-radius: 50px;
	font-family: "Poppins";
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	background: #737373;
}
.m211 .section3 .con6 .boxwrap .imgwrap:last-child .tit{
	background: #0081c8;
}

.m211 .section3 .qna{}
.m211 .section3 .qna .list{
	width: 100%; box-sizing: border-box;
	border-bottom: 1px solid #ccc;
}
.m211 .section3 .qna .list:first-child{/* border-top: 1px solid #000; */}
.m211 .section3 .qna .list .ask{
	width: 100%;
	display: flex;
	align-items: center;
	padding: 40px;
	cursor: pointer;
	box-sizing: border-box;
}
.m211 .section3 .qna .list .ask .q{
	font-family: "Myriad Pro";
	width: 70px;
	height: 70px;
	line-height: 70px;
	border-radius: 50%;
	font-size: 34px;
	text-align: center;
	font-weight: 300;
	background: #f8f8f8;
	color: #666;
}
.m211 .section3 .qna .list .ask.active .q{
	color: #fff;
	background: #0081c8;
}
.m211 .section3 .qna .list .ask .tit{
	position: relative;
	width: calc(100% - 100px);
	padding-left: 40px;
	font-size: 28px;
	color: #000;
	font-weight: 600;
	line-height: 1.6em;
}
.m211 .section3 .qna .list .ask.active .tit{
	color: #0081c8;
}
.m211 .section3 .qna .list .ask .tit:after{
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%) rotate(-45deg);
	width: 10px;
	height: 10px;
	border-left: 2px solid #777;
	border-bottom: 2px solid #777;
	transition: all 0.4s;
}
.m211 .section3 .qna .list .ask.active .tit:after{
	transform: translateY(-50%) rotate(135deg);
}
.m211 .section3 .qna .list .answer{
	width: 100%;
	padding: 40px;
	box-sizing: border-box;
	background: #fafafa;
	display: none;
}
.m211 .section3 .qna .list .answer>div{
	width: 100%;
	display: flex;
}
.m211 .section3 .qna .list .answer>div .a{
	width: 70px;
	height: 70px;
	line-height: 70px;
	border-radius: 50%;
	font-size: 34px;
	text-align: center;
	font-weight: 300;
	background: #fff;
	color: #0081c8;
}
.m211 .section3 .qna .list .answer>div .con{
	width: calc(100% - 70px);
	padding-left: 40px;
	font-size: 22px;
	line-height: 1.6em;
	margin-top: 20px;
}

.m211 .section3 .con .videowrap{
	position: relative;
}
.m211 .section3 .con .videowrap video{
	width: 100%;
	border-radius: 20px;
}

.play_icon{
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.play_icon .circle {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	width: 126px;
	height: 126px;
	border-radius: 50%;
	border: 1px solid #fff;
}
.play_icon .circle1{animation: wave 2s ease-in infinite 0s;}
.play_icon .circle2{animation: wave 2s ease-in infinite 0.3s;}
.play_icon .circle3{animation: wave 2s ease-in infinite 0.7s;}
@keyframes wave{
0%{opacity:0.8;width:126px;height:126px;}
100%{opacity:0.2;width:180px;height:180px;}
}

/* m212 */
.m212 {}

.m212 .sec1 .content1 {
margin-bottom:160px;
}

.m212 .sec1 .content1 .con1 {
margin-top: 0px;
display: flex;
justify-content: center;
align-items: center;
gap:50px;
}

.m212 .sec1 .content1 .con1-img {
background: #f9f9f9;
border-radius: 20px;
width: 720px;
height: 480px;
display: flex;
justify-content: center;
align-items: center; 
}

.m212 .sec1 .content1 .con-title {
max-width: 670px;
}

.m212 .sec1 .content1 .con-title h3{
font-size: 44px;
font-weight: 600;
}

.m212 .sec1 .content1 .con-title .con1-text__wrap {
padding-top:45px;
margin-top: 40px;
border-top:1px solid #e3e2e2;
}

.m212 .sec1 .content1 .con-title .con1-text{
position: relative;
padding-left: 17px;
font-size: 18px;
color: #666;
line-height: 30px;
}

.m212 .sec1 .content1 .con-title .con1-text::before{
content: "";
position: absolute;
left: 0;
top: 11px;
width: 7px;
height: 7px;
border-radius: 50%;
border: 1px solid #0684c9;
box-sizing: border-box;
}

.m212 .sec1 .content1 .con-title .con1-text + .con1-text{
margin-top: 45px;
}

.m212 .sec1 .content1 .con2 {
margin-top: 130px;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list {
display: flex;
justify-content: flex-start;
align-items: stretch;
flex-wrap: wrap;
row-gap: 20px;
column-gap: 40px;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item {
background: #f9f9f9;
border-radius: 20px;
width: calc((100% - 40px) / 2);
display: flex;
justify-content: flex-start;
align-items: center;
padding: 40px 60px;
position: relative;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item::after {
content:'';
position: absolute;
width:1px;
height:calc(100% - 80px);
background: #e3e2e2;
left:240px;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item .item-title {
color: var(--main-color);
font-size:18px;
font-weight: 500;
width: 180px;
flex-shrink: 0;
}

.m212 .sec1 .con2 .whatAnewgen-list .list-item .item-title span {
display: block;
font-family: 'Poppins';
font-size:16px;
margin-bottom: 14px;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item .item-text {
padding-left:30px;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item .item-text p {
color:#666;
font-size:18px;
line-height: 30px;
word-break: keep-all;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item .item-text p:not(:first-child) {
margin-top:25px;
}

.m212 .sec2 {
background: #f9f9f9;
padding:160px 0;
}

.m212 .sec2 .content1 .con {
background: #fff;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: stretch;
padding: 60px;
}

.m212 .sec2 .content1 .con1 .con-box{
width: 50%;
} 

.m212 .sec2 .content1 .con1 .box1 {
text-align: center;
margin-right: 60px;
}

.m212 .sec2 .content1 .con1 .box1 .box-title {
font-size: 28px;
font-weight: 600;
}

.m212 .sec2 .content1 .con1 .box1 .box-text {
margin:40px auto 0;
font-size: 18px;
color:#666;
line-height: 30px;
max-width:435px;
}

.m212 .sec2 .content1 .con1 .box1 .box-caption {
margin-top:30px;
font-size: 18px;
color:#666;
line-height: 30px;
border: 1px solid #e3e2e2;
border-radius: 20px;
padding: 38px;
}

.m212 .sec2 .content1 .con1 .box2{
background: #f9f9f9;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
padding: 60px 0 30px;
width: 600px;
position: relative;
}

.m212 .sec2 .content1 .con1 .box2::before{
content:'';
position: absolute;
top: 0;
left: -30px;
width: 1px;
height: 100%;
background: #e3e2e2;
}

.m212 .sec2 .content1 .con2 {
gap: 40px;
}

.m212 .sec2 .content1 .con2 .box1 {
max-width: 805px;
flex: 1;
}

.m212 .sec2 .content1 .con2 .box2 {
border: 1px solid #e3e2e2;
border-radius: 20px;
padding: 0px 70px;
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

.m212 .sec2 .content1 .con2 .box2 .box-title {
font-size: 24px;
font-weight: 600;
}

.m212 .sec2 .content1 .con2 .box2 .whyAnewgen-list{
margin-top:38px;
}

.m212 .sec2 .content1 .con3,
.m212 .sec2 .content1 .con4,
.m212 .sec2 .content1 .con5{
gap:120px;
padding: 60px 60px 120px;
} 

.m212 .sec2 .content1 .con3 .box1,
.m212 .sec2 .content1 .con4 .box1,
.m212 .sec2 .content1 .con5 .box1 {
width: calc((100% - 120px)/2);
background: #f8f8f8;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
padding: 0 55px;
aspect-ratio: 1 / 1;
}

.m212 .sec2 .content1 .con3 .box1 .img-caption,
.m212 .sec2 .content1 .con4 .box1 .img-caption,
.m212 .sec2 .content1 .con5 .box1 .img-caption{
position: absolute;
left: 50%;
bottom: -62px;
transform: translateX(-50%);
color:#fff;
padding: 13px 40px;
border-radius: 21px;
background: #565656;
font-size: 17px;
}

.m212 .sec2 .content1 .con3 .box2,
.m212 .sec2 .content1 .con4 .box2,
.m212 .sec2 .content1 .con5 .box2 {
width: calc((100% - 120px)/2);
border: 1px solid #e3e2e2;
border-radius: 20px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}

.m212 .sec2 .content1 .con3 .box2::after,
.m212 .sec2 .content1 .con4 .box2::after,
.m212 .sec2 .content1 .con5 .box2::after {
content:'';
position: absolute;
width:1px;
height:100%;
background-color: #e3e2e2;
top:0;
left: -60px;
}

.m212 .sec2 .content1 .con3 .box2 .box-title,
.m212 .sec2 .content1 .con4 .box2 .box-title,
.m212 .sec2 .content1 .con5 .box2 .box-title {
font-size: 28px;
font-weight: 600;
text-align: center;
}

.m212 .sec3 {
padding:160px 0;
}

.m212 .sec3 .content1 .con1 .con-box_container{
margin-top: 40px;
padding: 60px;
background: #f8f8f8;
border-radius: 20px 20px 0 0;
}

.m212 .sec3 .content1 .con1 .con-text {
font-size: 17px;
color:#666;
line-height: 25px;
display: block;
margin-top: 40px;
}

.m212 .sec3 .content1 .con1 .con-box {
display:flex;
gap:118px;
}

.m212 .sec3 .content1 .con1 .con-box .con-box__img {
background:#fff;
border-radius:20px;
padding: 60px;
display: flex;
justify-content: center;
align-items: center;
width: 50%;
}

.m212 .sec3 .content1 .con1 .con-box__caption {
margin-top: 10px;
padding: 15px 20px;
border-radius: 0 0 20px 20px;
background: #0081c8;
font-size: 20px;
font-weight: 600;
color: #fff;
text-align: center;
}

.m212 .sec3 .content1 .con2 .con-box {
display:flex;
padding: 60px;
background: #f8f8f8;
border-radius: 20px 20px 0 0;
flex-wrap: wrap;
row-gap: 60px;
column-gap: 118px;
}

.m212 .sec3 .content1 .con2 .con-box .con-box__img {
background:#fff;
border-radius:20px;
padding: 60px;
display: flex;
justify-content: center;
align-items: center;
width: calc((100% - 118px)/2);
}

.m212 .sec3 .content1 .con2 .con-box  .con-box__text {
border: 1px solid #e3e2e2;
border-radius: 20px;
padding: 0 45px;
width:calc((100% - 118px)/2);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

.m212 .sec3 .content1 .con2 .con-box  .con-box__text p {
font-size: 28px;
font-weight: 600;
text-align: center;
}

.m212 .sec3 .content1 .con2 .con-box  .con-box__text p:not(:first-child){
margin-top:20px;
}

.m212 .sec3 .content2 {
padding-top: 160px;
} 

.m212 .sec3 .content2 .con1 {
display:flex;
padding: 60px;
background: #f8f8f8;
border-radius: 20px 20px 0 0;
}

.m212 .sec3 .content2 .con1 .con-box  {
width: calc((100% - 120px) / 2);
text-align: center;
}

.m212 .sec3 .content2 .con1 .con-box__img  {
width: 100%;
height: 370px;
border-radius: 20px;
background: #fff;
display: flex;
justify-content: center;
align-items: center;
}

.m212 .sec3 .content2 .con1 .arr {
width: 120px;
text-align: center;
}

.m212 .sec3 .content2 .con1 .arr img {
margin-top: 150px;
}

.m212 .sec3 .content2 .con-box p  {
display: inline-block;
margin-top: 20px;
width: 210px;
height: 46px;
line-height: 46px;
border-radius: 50px;
font-family: "Poppins";
font-size: 16px;
font-weight: 500;
color: #fff;
background: #737373;
}

.m212 .sec3 .content2 .con1 .box1 p {
background: #737373;
}

.m212 .sec3 .content2 .con1 .box2 p  {
background: var(--main-color);
}

/* m213 */
.m213 {}

.m213 .sec1 .content1 {
margin-bottom:160px;
}

.m213 .sec1 .con1 {
margin-top: 0px;
display: flex;
justify-content: center;
align-items: center;
gap:50px;
}

.m213 .sec1 .con1-img {
background: #f9f9f9;
border-radius: 20px;
width: 720px;
height: 480px;
display: flex;
justify-content: center;
align-items: center; 
overflow: hidden;
}

.m213 .sec1 .con1-img img {
height: 100%;
width: 100%;
object-fit: cover;
}

.m213 .sec1 .con-title {
max-width: 670px;
}

.m213 .sec1 .content1 .con-title h3{
font-size: 44px;
font-weight: 600;
}

.m213 .sec1 .con-title .con1-text__wrap {
padding-top:45px;
margin-top: 40px;
border-top:1px solid #e3e2e2;
}

.m213 .sec1 .con-title .con1-text{
position: relative;
padding-left: 17px;
font-size: 18px;
color: #666;
line-height: 30px;
}

.m213 .sec1 .content1 .con-title .con1-text + .con1-text{
margin-top: 45px;
}

.m213 .sec1 .con-title .con1-text::before{
content: "";
position: absolute;
left: 0;
top: 11px;
width: 7px;
height: 7px;
border-radius: 50%;
border: 1px solid #0684c9;
box-sizing: border-box;
}

.m213 .sec1 .con2 .anewderm-list {
margin-top:90px;
border:1px solid #e3e2e2;
border-radius: 20px;
padding: 60px 46px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap:10px;
}

.m213 .sec1 .con2 .anewderm-list .list-item {
background: #f9f9f9;
border-radius: 20px;
text-align: center;
width: calc((100% - 20px) / 3);
padding: 35px 20px;;
}

.m213 .sec1 .con2 .anewderm-list .list-item .item-number {
font-family: 'Poppins';
font-size: 17px;
color: var(--main-color);
font-weight: 500;
position: relative;
}

.m213 .sec1 .con2 .anewderm-list .list-item .item-number::after {
content:'';
position: absolute;
width: 100%;
height: 1px;
background-color: var(--main-color);
left: 0;
bottom: 2px;
}

.m213 .sec1 .con2 .anewderm-list .list-item .item-text {
margin-top: 21px;
color:#666;
font-size: 18px;
}

.m213 .sec1 .con3 .Indication-list{
margin-top:90px;
display:flex;
align-items: center;
justify-content: space-between;
}

.m213 .sec1 .con3 .Indication-list .list-item{
text-align: center;
width: calc(100% / 5);
padding-bottom: 15px;
}

.m213 .sec1 .con3 .Indication-list .list-item:not(:last-child) {
border-right:1px solid #e3e2e2;
}

.m213 .sec1 .con3 .Indication-list .list-item .item-img{
width:100px;
height:100px;
border-radius:50%;
background-color:#f9f9f9;
text-align: center;
line-height: 100px;
margin: 0 auto;
}

.m213 .sec1 .con3 .Indication-list .list-item .item-title{
color:#000;
font-size:24px;
font-weight: 600;
margin-top:34px;
}

.m213 .sec1 .con3 .Indication-list .list-item .item-text{
color:#666;
font-size:18px;
margin-top:34px;
}

/* m214 */
.m214 {}

.m214 .sec1 .content1 {
margin-bottom: 160px;
}

.m214 .sec1 .content1 .con1 {
margin-top: 0px;
display: flex;
justify-content: center;
align-items: center;
gap: 130px;
}

.m214 .sec1 .content1 .con1-img {
background: url(/images/page/m211_cn4_img1.png) no-repeat center /cover;
border-radius: 20px;
width: 720px;
height: 480px;
display: flex;
justify-content: center;
align-items: center;
}

.m214 .sec1 .content1 .con-title {
max-width: 670px;
}

.m214 .sec1 .content1 .con-title h3 {
font-size: 44px;
font-weight: 600;
}

.m214 .sec1 .content1 .con-title .con1-text__wrap {
padding-top: 45px;
margin-top: 40px;
border-top: 1px solid #e3e2e2;
}

.m214 .sec1 .content1 .con-title .cont-subTitle {
font-size: 28px;
font-weight: 600;
margin-bottom: 30px;
}

.m214 .sec1 .content1 .con-title .con1-text {
position: relative;
padding-left: 17px;
font-size: 18px;
color: #666;
line-height: 30px;
}

.m214 .sec1 .content1 .con-title .con1-text::before {
content: "";
position: absolute;
left: 0;
top: 11px;
width: 7px;
height: 7px;
border-radius: 50%;
border: 1px solid #0684c9;
box-sizing: border-box;
}

.m214 .sec1 .content1 .con-title .con1-text + .con1-text {
margin-top: 45px;
}

.m214 .sec1 .content1 .con2 {
margin-top: 130px;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list {
display: flex;
justify-content: flex-start;
align-items: stretch;
flex-wrap: wrap;
row-gap: 20px;
column-gap: 40px;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item {
background: #f9f9f9;
border-radius: 20px;
width: calc((100% - 40px) / 2);
display: flex;
justify-content: flex-start;
align-items: center;
padding: 40px 60px;
position: relative;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item::after {
content:'';
position: absolute;
width:1px;
height:calc(100% - 80px);
background: #e3e2e2;
left:240px;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item .item-title {
color: var(--main-color);
font-size: 18px;
font-weight: 500;
width: 180px;
flex-shrink: 0;
line-height: 30px;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item .item-title span {
display: block;
font-family: 'Poppins';
font-size: 16px;
margin-bottom: 14px;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item .item-text {
padding-left: 30px;
}

.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item .item-text p {
color: #666;
font-size: 18px;
line-height: 30px;
word-break: keep-all;
}

.m214 .sec2 .content1 {
margin-top: 80px;
display: flex;
flex-wrap: wrap;
padding-bottom:180px;
row-gap:60px;
}

.m214 .sec2 .content1 .con {
margin-top:0;
width: calc(100%/3);
}

.m214 .sec2 .content1 .con:nth-child(3n-2) {
padding: 0 60px;
border-left: 1px solid #e3e2e2;
}

.m214 .sec2 .content1 .con:nth-child(3n-1) {
padding: 0 60px;
border-left: 1px solid #e3e2e2;
border-right: 1px solid #e3e2e2;
}

.m214 .sec2 .content1 .con:nth-child(3n) {
padding-left: 60px;
}

.m214 .sec2 .content1 .con img {
display: block;
margin-bottom:35px;
}

.m214 .sec2 .content1 .con .con-title {
color:#000;
font-size:24px;
font-weight: 600;
margin-bottom:28px;
display: block;
}

.m214 .sec2 .content1 .con .con-text {
line-height: 30px;
font-size: 18px;
color: #666;
}

.m214 .sec3 {
background: #f9f9f9;
padding: 160px 0;
}

.m214 .sec3 .content1 .con {
background:#fff;
border-radius: 20px;
padding: 60px 60px;
}

.m214 .sec3 .content1 .con3 {
padding: 60px 60px 122px;
}

.m214 .sec3 .content1 .con-box__container {
display:flex;
align-items:stretch;
justify-content: space-between;
}

.m214 .sec3 .content1 .con-box{
width: calc((100% - 120px) / 2);
background: #f8f8f8;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
padding: 35px 40px;
aspect-ratio: 600 / 410;
}

.m214 .sec3 .content1 .con3 .con-box {
aspect-ratio: 600 / 460;
}

.m214 .sec3 .content1 .con-box.text-box{
background:#fff;
border: 1px solid hwb(0 40% 60% / 34%);
}

.m214 .sec3 .content1 .con1 .box1 .img-caption,
.m214 .sec3 .content1 .con2 .box1 .img-caption,
.m214 .sec3 .content1 .con3 .box1 .img-caption{
position: absolute;
left: 50%;
bottom: -62px;
transform: translateX(-50%);
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: #565656;
width: max-content;
font-size:17px;
}

.m214 .sec3 .content1 .con1 .box2 .img-caption,
.m214 .sec3 .content1 .con2 .box2 .img-caption{
position: absolute;
left: 50%;
bottom: -62px;
transform: translateX(-50%);
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: var(--main-color);
width: max-content;
font-size:17px;
}

.m214 .sec3 .content1 .con1 .box2::after,
.m214 .sec3 .content1 .con2 .box2::after,
.m214 .sec3 .content1 .con3 .box2::after {
content: '';
position: absolute;
width: 1px;
height: 100%;
background-color: #e3e2e2;
top: 0;
left: -60px;
}

.m214 .sec3 .content1 .con .con-text {
margin-top: 120px;
font-size: 24px;
font-weight: 600;
}

.m214 .sec3 .content1 .con .con-caption {
font-size: 18px;
color:#666;
display: inline-block;
margin-top: 25px;
}

.m214 .sec3 .content1 .con3 .box2{
flex-direction: column;
}

.m214 .sec3 .content1 .con3 .box2 .con-text{
margin-top: 0px;
text-align:center;
}

.m214 .sec3 .content1 .con4 .con-box__container {
display: block;
text-align: center;
}

.m214 .sec3 .content1 .con4 .con-box {
width: 100%;
aspect-ratio: auto;
padding: 60px;
display: block;
position: relative;
}

.m214 .sec3 .content1 .con4 .con-box__container .table-cpation {
position: absolute;
right: 60px;
}

.m214 .sec3 .content1 .con4 .con-box .img-box {
display:flex;
gap: 60px;
}

.m214 .sec3 .content1 .con4 .con-box .img-box .swiper-slide{
width: calc((100% - 120px)/3);
}

.m214 .sec3 .content1 .con4 .con-box .text-box{
margin-top:35px;
}

.m214 .sec3 .content1 .con4 .con-box .text-box p{
font-size: 16px;
color:#666;
text-align: left;
line-height: 24px;
}

.m214 .sec3 .content1 .con4 .img-caption {
display: inline-block;
margin-top: 20px;
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: #565656;
font-size:17px;
}

.m214 .sec3 .content1 .con4 .con-text {
margin-top: 60px;
text-align: left;
}

.m214 .sec4 {
padding: 160px 0;
}

.m214 .sec4 .content1 .con1 h6 {
font-size: 28px;
font-weight: 600;
}

.m214 .sec4 .content1 .con1 p {
color:#666;
font-size:18px;
line-height: 30px;
margin-top:40px;
}

.m214 .sec4 .content1 .con1 .con-box {
margin-top:40px;
display:flex;
justify-content: space-between;
}

.m214 .sec4 .content1 .con1 .con-box__img {
padding: 40px;
background: #f8f8f8;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
width: calc((100% - 40px) / 2);
flex-direction: column;
}

.m214 .sec4 .content1 .con1 .con-box__img:first-child img {
border-bottom: 1px solid #e3e2e2;
padding-bottom:40px;
}

.m214 .sec4 .content1 .con1 .con-box__img p {
color:#666;
font-size:16px;
margin-top:40px;
}

.m214 .sec5 {
padding-bottom: 160px;
}

.m214 .sec5 .content1 .con1 {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
row-gap: 60px;
column-gap: 30px;
}

.m214 .sec5 .content1 .con1 .con-box {
width: calc((100% - 30px)/2);
display: flex;
align-items: center;
gap:35px;
}

.m214 .sec5 .content1 .con1 .con-box .con-box__img {
border-radius: 20px;
overflow:hidden;
}

.m214 .sec5 .content1 .con1 .con-box .con-box__text {
flex: 1;
}

.m214 .sec5 .content1 .con1 .con-box .box-title {
font-size: 22px;
color:var(--main-color);
font-weight: 600;
}

.m214 .sec5 .content1 .con1 .con-box .box-text {
margin-top:20px;
line-height: 30px;
font-size: 18px;
color:#666;
}

.m214 .sec5 .content1 .con1 .con-box .recommended-list {
margin-top:14px;
padding-top:20px;
border-top: 1px solid transparent;
display: flex;
align-items: flex-start;
gap: 60px;
}

.m214 .sec5 .content1 .con1 .con-box .recommended-list .list-item {
font-size: 16px;
color:#666;
position: relative;
padding-left: 20px;
}

.m214 .sec5 .content1 .con1 .con-box .recommended-list .list-item::before {
content: "";
position: absolute;
left: 0;
top: 6px;
width: 7px;
height: 7px;
border-radius: 50%;
border: 1px solid #0684c9;
box-sizing: border-box;
}

/* m22 */
.m22 .sec1 {
padding-bottom: 160px;
}

.m22 .sec1 .con1 {
background:url(/images/page/m22_img1.png) no-repeat center / cover;
width: 100%;
aspect-ratio: 721 / 291;
margin-top:0;
}

.m22 .sec2 {
background-color:#f8f8f8;
padding: 160px 0;
}

.m22 .sec2-title{
padding-bottom: 60px;
border-bottom: 1px solid #000;
font-size: 50px;
font-weight: 600;
}

.m22 .sec2 .con1-textContainer {
margin-top:80px;
} 

.m22 .sec2 .con1-textContainer h6 {
font-size: 28px;
font-weight: 600;
position: relative;
padding-left: 30px;
}

.m22 .sec2 .con1-textContainer h6::before {
content:'';
width:8px;
height: 8px;
position: absolute;
border-radius: 50%;
border: 3px solid var(--main-color);
top: 10px;
left:0px;
}

.m22 .sec2 .con1-textContainer p {
color:#666;
font-size: 20px;
margin-top:30px;
line-height: 30px;
}

.m22 .sec2 .con1-textContainer .con1-text2 {
margin-top:40px;
}

.m22 .sec2 .con1-box {
margin-top:40px;
background-color:#fff;
padding:48px;
border-radius: 20px 20px 0 0;
}

.m22 .sec2 .con1-box .box1 {
background-color:#f8f8f8;
border-radius: 20px;
padding:65px;
}

.m22 .sec2 .con1-box .box1 .img-box{
text-align: center;
}

.m22 .sec2 .con1-box .box2 {
margin-top:10px;
border: 1px solid hwb(0 40% 60% / 34%);
border-radius: 20px;
padding: 40px 0;
display: flex;
justify-content: center;
align-items: center;
gap:130px;
}

.m22 .sec2 .con1-box .box2 p {
color:#666;
font-size: 18px;
position: relative;
padding-left: 38px;
}

.m22 .sec2 .con1-box .box2 p::before {
content:'';
width:25px;
height: 3px;
position: absolute;
top: 50%;
left:0px;
transform: translateY(-50%);
}

.m22 .sec2 .con1-box .box2 p:first-child::before {
background-color:#f79a29;
}

.m22 .sec2 .con1-box .box2 p:nth-child(2)::before {
background-color:#ec008c;
}

.m22 .sec2 .con1-box .box2 p:nth-child(3)::before {
background-color:#a7a9ac;
}

.m22 .sec2 .con1-box .box2 p:nth-child(4)::before {
background-color:#8896cc;
}

.m22 .sec2 .con1 .box-caption {
margin-top: 10px;
padding: 15px 20px;
border-radius: 0 0 20px 20px;
background: #f16269;
font-size: 20px;
font-weight: 600;
color: #fff;
text-align: center;
}

.m22 .sec2 .con2-title {
font-size: 28px;
font-weight: 600;
position: relative;
padding-left: 30px;
}

.m22 .sec2 .con2-title:before {
content:'';
width:8px;
height: 8px;
position: absolute;
border-radius: 50%;
border: 3px solid var(--main-color);
top: 10px;
left:0px;
}

.m22 .sec2 .con2 .box1 {
margin-top:40px;
background-color: #fff;
padding: 90px 80px;
border-radius: 20px;
}

.m22 .sec2 .con2 .box1 table {
width:100%;
border-collapse: collapse;
}

.m22 .sec2 .con2 .box1 table col {
width:20%;
}

.m22 .sec2 .con2 .box1 table tr {
height: 67px;
text-align: center;
}

.m22 .sec2 .con2 .box1 table tr:not(:first-child){
border-top: 1px solid #bfbfbf;
}
.m22 .sec2 .con2 .box1 table tr th:not(:first-child),
.m22 .sec2 .con2 .box1 table tr td:not(:first-child){
border-left: 1px solid #bfbfbf;
}

.m22 .sec2 .con2 .box1 table tr:not(:first-child):nth-child(odd){
background:#f8f8f8;
}
.m22 .sec2 .con2 .box1 table tr td:nth-child(1){
color:#000;
}

.m22 .sec2 .con2 .box1 table tr th:not(:first-child):nth-child(2),
.m22 .sec2 .con2 .box1 table tr td:not(:first-child):nth-child(2){
background:#565656;
color:#fff;
}

.m22 .sec2 .con2 .box1 table th {
font-size:20px;
color:#666;
font-weight: 600;
background:#dcddde;
}

.m22 .sec2 .con2 .box1 table td {
font-size:18px;
color:#666;
}

.m22 .sec2 .con2 .box1 .table-caption {
font-size:16px;
color:#666;
display: inline-block;
margin-top: 25px;
}

.m22 .sec2 .con3 .box1{
margin-top: 40px;
background-color: #fff;
padding: 90px 60px;
border-radius: 20px;
}

.m22 .sec2 .con3 .box1 .box-caption {
font-size:16px;
color:#666;
display: inline-block;
margin-top: 25px;
}

.m22 .sec2 .con3 .box1 p {
margin-top:60px;
font-size:24px;
font-weight:600;
}

.m22 .sec2 .con3 .box1 span {
font-size:18px;
color:#666;
display: inline-block;
margin-top: 30px;
}

.m22 .sec3 {
padding: 160px 0;
}

.m22 .sec3 .con-title {
padding-bottom: 60px;
border-bottom: 1px solid #000;
font-size: 50px;
font-weight: 600;
}

.m22 .sec3 .box {
margin-top:80px;
}

.m22 .sec3 .box1 {
position: relative;
}

.m22 .sec3 .con4 .box1::before {
display: block;
content: "";
width: 50%;
height: 100%;
background: #fff;
position: absolute;
left: 0%;
top: 0;
transform-origin: left;
transform: scaleX(1);
z-index: 2;
}

.m22 .sec3 .con4 .box1::after {
display: block;
content: "";
width: 50%;
height: 100%;
background: #fff;
position: absolute;
right: 0%;
top: 0;
transform-origin: right;
transform: scaleX(1);
z-index: 2;
}

.m22 .sec3 .box .swiper {
position: relative;
overflow: hidden;
}

.m22 .sec3 .box .swiper img{
border-radius:20px;
}

.m22 .sec3 .box .swiper .swiper-pagination-bullet {
width: 52px;
height: 6px;
border-radius:3px;
background:#fff;
opacity:1;
}

.m22 .sec3 .box .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
background:#565656;
}

.swiper-button-prev,
.swiper-button-next {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 60px;
  height: 60px;
}

.swiper-button-prev {
background-image: url('/images/page/m22_img_arr_left.png');
left:45px;
}

.swiper-button-next {
background-image: url('/images/page/m22_img_arr_right.png');
right:45px;
}

.swiper-button-prev::after,
.swiper-button-next::after {
  display: none;
}

.m22 .sec3 .con1 .box1 {
background-color: #f8f8f8;
border-radius: 20px;
padding: 85px 0;
display: flex;
align-items: center;
justify-content: center;
}

.m22 .sec3 .con1 .img-box1 {
width: 50%;
text-align: center;
}

.m22 .sec3 .con1 .img-box2 {
width: 50%;
text-align: center;
padding-bottom: 25px;
border-left: 2px solid #bfbfbf;
}

.m22 .sec3 .con1 .box-caption {
margin-top: 10px;
padding: 15px 20px;
border-radius: 0 0 20px 20px;
background: #f79a29;
font-size: 20px;
font-weight: 600;
color: #fff;
text-align: center;
}

.m22 .sec3 .con2{
margin-top: 160px;
}

.m22 .sec3 .con2 .box1 {
background-color: #f8f8f8;
border-radius: 20px;
padding: 60px 0;
display: flex;
gap:50px;
}

.m22 .sec3 .con2 .box1 .img-box1{
width:calc((100% - 50px)/2);
text-align: right;
}

.m22 .sec3 .con2 .box1 .img-box2 {
width:calc((100% - 50px)/2);
text-align: left;
}

.m22 .sec3 .con2 .box-caption {
margin-top: 10px;
padding: 15px 20px;
border-radius: 0 0 20px 20px;
background: #8796cb;
font-size: 20px;
font-weight: 600;
color: #fff;
text-align: center;
}

.m22 .sec3 .con3{
margin-top: 160px;
}

.m22 .sec3 .con3 .box1 {
display: flex;
gap:32px;
align-items: stretch;
}

.m22 .sec3 .con3 .box1-1 {
padding: 60px 60px 35px;
border: 1px solid hwb(0 40% 60% / 34%);
border-radius:20px;
width:calc((100% - 32px)/2);
}

.m22 .sec3 .con3 .box1-2 {
border-radius: 20px;
width:calc((100% - 32px)/2);
background: #f8f8f8;
position: relative;
color:#666;
font-size:24px;
font-weight: 600;
line-height: 34px;
display: flex;
justify-content: center;
align-items: center;
}

.m22 .sec3 .con3 .box1-2::after {
content:'';
background: url(/images/page/m22_logo.png) no-repeat bottom / contain;
position: absolute;
bottom: 0;
width: 100%;
height: 140px;
left: 0;
}

.m22 .sec3 .con4{
margin-top: 160px;
}

/* m23 */
.m23 .con {
margin-top:0;
}

.m23 .con-box {
margin-top:80px;
}

.m23 .content .con > .con-title {
font-size: 50px;
font-weight: 600;
padding-bottom: 60px;
border-bottom: 1px solid #000;
}

.m23 .content .con .con-title__container{
padding-bottom: 60px;
border-bottom: 1px solid #000;
}

.m23 .content .con .con-title__container h3 {
font-size: 50px;
font-weight: 600;
}

.m23 .content .con .con-title__container p {
font-size: 20px;
line-height: 1.6em;
color: #666;
margin-top: 30px;
}

.m23 .sec1 .content1 .con1-img {
background:url(/images/page/m23_img1.png) no-repeat center / contain;
width:100%;
aspect-ratio: 721 / 250;
} 

.m23 .sec1 .content1 .con1-text {
display: flex;
align-items: flex-start;
margin-top:60px;
}

.m23 .sec1 .content1 .con1-text h3 {
font-size: 44px;
font-weight: 600;
width: 50%;
}

.m23 .sec1 .content1 .con1-text .whatExosome-list {
padding: 20px 0;
width: 50%;
padding-left:50px;
border-left: 1px solid #e3e2e2;
}

.m23 .sec1 .content1 .con1-text .whatExosome-list .list-item {
position: relative;
padding-left: 17px;
font-size: 18px;
color: #666;
line-height: 30px;
}

.m23 .sec1 .content1 .con1-text .whatExosome-list .list-item::before{
content: "";
position: absolute;
left: 0;
top: 11px;
width: 7px;
height: 7px;
border-radius: 50%;
border: 1px solid #0684c9;
box-sizing: border-box;
}

.m23 .sec1 .content2,
.m23 .sec1 .content3,
.m23 .sec1 .content4,
.m23 .sec1 .content5{
margin-top:160px;
}

.m23 .sec1 .content2 .con-title span {
color: var(--main-color);
}

.m23 .sec1 .content2 .con-box .box {
background: #f9f9f9;
border-radius: 20px;
display: flex;
justify-content: flex-start;
align-items: center;
padding: 30px 50px;
gap:45px;
}

.m23 .sec1 .content2 .con-box .box:not(:first-child){
margin-top:20px;
}

.m23 .sec1 .content2 .con-box .img-box {
width:100px;
height:100px;
border-radius: 50%;
background:#fff;
text-align: center;
line-height: 100px;
}

.m23 .sec1 .content2 .con-box .box p {
font-size: 20px;
color: #000;
padding: 18px 0px 18px 45px;
border-left:1px solid #e3e2e2;
}

.m23 .sec1 .content3 .con1 .con-box,
.m23 .sec1 .content3 .con2 .con-box{
background: #f9f9f9;
border-radius: 20px;
padding: 85px 80px;
}

.m23 .sec1 .content3 .con1 .img-box {
background:url(/images/page/m23_img2.png) no-repeat center / contain;
width:100%;
aspect-ratio: 1271/311;
}

.m23 .sec1 .content3 .con2 {
margin-top:160px;
}

.m23 .sec1 .content3 .con2 .img-box {
background:url(/images/page/m23_img3.png) no-repeat center / contain;
width:100%;
aspect-ratio: 1271/311;
}

.m23 .sec1 .content4 {
padding-bottom:160px;
}

.m23 .sec1 .content4 .con2,
.m23 .sec1 .content4 .con3{
margin-top:160px;
}

.m23 .sec1 .content4 .con2 .con-box h6{
font-size: 28px;
font-weight: 600;
position: relative;
padding-left: 30px;
}

.m23 .sec1 .content4 .con2 .con-box h6::before{
content: '';
width: 8px;
height: 8px;
position: absolute;
border-radius: 50%;
border: 3px solid var(--main-color);
top: 10px;
left: 0px;
}

.m23 .sec1 .content4 .con2 .box {
margin-top:40px;
display: flex;
gap:50px;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-1 {
background: #f9f9f9;
border-radius: 20px;
padding: 45px;
width: calc((100% - 50px)/2)
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-1 .img-box {
background: #f0f0f0;
border-radius: 20px;
padding: 60px 40px;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-1 .img-caption {
margin-top:18px;
color: #fff;
padding: 12px 20px;
border-radius: 18px;
background: #00aeef;
width: max-content;
margin-left: auto;
font-size:17px;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2 {
width: calc((100% - 50px)/2);
border: 1px solid hwb(0 40% 60% / 34%);
border-radius: 20px;
text-align: center;
padding: 55px 30px 34px;
display: flex;
flex-direction: column;
justify-content: space-between;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2__title {
font-size: 24px;
font-weight: 600;
margin-bottom:20px;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list {
border: 1px solid #e3e2e2; 
border-radius: 20px;
padding: 40px 0;
display: flex;
justify-content: center;
align-items: center;
gap: 65px;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item {
color: #666;
font-size: 18px;
position: relative;
padding-left: 40px;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item::before {
content: '';
width: 25px;
height: 3px;
position: absolute;
top: 50%;
left: 0px;
transform: translateY(-50%);
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item::after{
content: '';
width: 7px;
height: 7px;
position: absolute;
top: 50%;
left: 9px;
transform: translateY(-50%);
border-radius: 50%;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item:nth-child(1)::before,
.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item:nth-child(1)::after{
background-color: #000;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item:nth-child(2)::before,
.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item:nth-child(2)::after{
background-color: #939598;
}

.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item:nth-child(3)::before,
.m23 .sec1 .content4 .con2 .con-box1 .box1-2Titile-list .list-item:nth-child(3)::after{
background-color: #00aeef;
}

.m23 .sec1 .content4 .con2 .con-box2 .box1 {
background: #f9f9f9;
border-radius: 20px;
padding: 60px;
gap:120px;
}

.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-1,
.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-2{
width: calc((100% - 120px) / 2);
position: relative;
}

.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-1::after {
content: '';
position: absolute;
width: 1px;
height: 100%;
background-color: #e3e2e2;
top: 0;
right: -60px;
}

.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-1 .img-box,
.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-2 .img-box{
background: #ffffff;
border-radius: 20px;
padding: 65px 44px;
}

.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-1 .img-caption{
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: #565656;
width: max-content;
margin: 20px auto 0;
font-size: 17px;
}

.m23 .sec1 .content4 .con2 .con-box2 .box1 .box1-2 .img-caption{
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: var(--main-color);
width: max-content;
margin: 20px auto 0;
font-size: 17px;
}

.m23 .sec1 .content4 .con3 .con-box1 {
display: flex;
justify-content: space-between;
background: #f8f8f8;
border-radius: 20px;
padding: 60px;
gap:53px;
}

.m23 .sec1 .content4 .con3 .con-box1 .img-box {
position: relative;
}

.m23 .sec1 .content4 .con3 .con-box1 .box:not(:last-child) .img-box::after {
  content: "";
  width: 35px;
  height: 19px;
background: url(/images/page/m23_icon_arr.png);
position: absolute;
top: 50%;
right: -43px;
transform: translateY(-50%);
}

.m23 .sec2 {
background-color: #f8f8f8;
padding: 160px 0;
}

.m23 .sec2 .content1 .con1 .con-box h6 {
font-size: 28px;
font-weight: 600;
position: relative;
padding-left: 30px;
}

.m23 .sec2 .content1 .con1 .con-box h6::before {
content: '';
width: 8px;
height: 8px;
position: absolute;
border-radius: 50%;
border: 3px solid var(--main-color);
top: 10px;
left: 0px;
}

.m23 .sec2 .content1 .con1 .con-box1 .box {
margin-top: 40px;
display: flex;
background: #ffffff;
border-radius: 20px;
padding: 60px;
gap: 120px;
}

.m23 .sec2 .content1 .con1 .box .box1-1{
width: calc((100% - 120px) / 2);
position: relative;
}

.m23 .sec2 .content1 .con1 .con-box1 .box1-1 .img-box::after {
content: '';
position: absolute;
width: 1px;
height: 100%;
background-color: #e3e2e2;
top: 0;
right: -60px;
}

.m23 .sec2 .content1 .con1 .con-box1 .box1-1 .img-box {
background: #f9f9f9;
border-radius: 20px;
padding: 80px 44px;
}

.m23 .sec2 .content1 .con1 .con-box1 .box1-2 .img-box {
background: #f9f9f9;
border-radius: 20px;
padding: 65px 44px;
}

.m23 .sec2 .content1 .con1 .box .box1-1 .img-caption {
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: #565656;
width: max-content;
margin: 20px auto 0;
font-size: 17px;
}


.m23 .sec2 .content1 .con1 .box .box1-2 .img-caption {
color: #fff;
padding: 13px 40px;
border-radius: 21px;
background: var(--main-color);
width: max-content;
margin: 20px auto 0;
font-size: 17px;
}

.m23 .sec2 .content1 .con1 .con-box3 .con-box__textContainer,
.m23 .sec2 .content1 .con1 .con-box4 .con-box__textContainer {
  display: flex;
  align-items: center; 
  justify-content: space-between;
}

.m23 .sec2 .content1 .con1 .con-box3 .con-box__textContainer p,
.m23 .sec2 .content1 .con1 .con-box4 .con-box__textContainer p{
color:#666;
font-size: 16px;
}

.m23 .sec2 .content1 .con1 .con-box3 .con-box__textContainer span,
.m23 .sec2 .content1 .con1 .con-box4 .con-box__textContainer span {
color:var(--main-color);
}

.m23 .sec2 .content1 .con1 .con-box2 .box,
.m23 .sec2 .content1 .con1 .con-box3 .box,
.m23 .sec2 .content1 .con1 .con-box4 .box{
display: flex;
gap:20px;
margin-top:20px;
} 

.m23 .sec2 .content1 .con1 .con-box2 .box .img-caption,
.m23 .sec2 .content1 .con1 .con-box3 .box .img-caption,
.m23 .sec2 .content1 .con1 .con-box4 .box .img-caption {
  margin-top: 20px;
  padding: 12px 0;
  border-radius: 50px;
  background: #ececec;
  font-size: 17px;
  font-weight: 600;
  color: #000;
  text-align: center;
  height: calc(100% - 220px - 20px);
  display: flex;
  align-items: center; 
  justify-content: center;
}

.m23 .sec3 {
padding: 160px 0;
}

.m23 .sec3 .box-caption {
display: flex;
justify-content: space-around;
margin-left: auto;
width: calc(100% - 400px - 100px);
gap: 120px;
margin-right: 20px;
}

.m23 .sec3 .box-caption .box-caption__1 {
background: #565656;
color: #fff;
padding: 12px 34px;
border-radius: 18px;
width: max-content;
font-size: 13px;
}

.m23 .sec3 .box-caption .box-caption__2 {
background: #00aeef;
color: #fff;
padding: 12px 34px;
border-radius: 18px;
width: max-content;
font-size: 13px;
}

.m23 .sec3 .box {
display: flex;
border: 1px solid #bfbfbf;
border-radius: 20px;
justify-content: space-between;
}

.m23 .sec3 .con-box .box:nth-of-type(2) {
  margin-top: 20px;
}

.m23 .sec3 .con-box .box:nth-of-type(n+3) {
  margin-top: 60px;
}

.m23 .sec3 .box .box-1 {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background:#ececec;
border-radius: 20px;
max-width:400px;
width: 100%;
position: relative;
}

.m23 .sec3 .box .box-1::before{
content:'';
position: absolute;
width: 100%;
height: 100%;
border: 1px solid #ececec;
border-radius: 20px;
}

.m23 .sec3 .box .box-1 span {
font-family: 'Poppins';
font-size: 18px;
color: var(--main-color);
font-weight: 500;
}

.m23 .sec3 .box .box-1 p {
margin-top: 21px;
color: #666;
font-size: 28px;
font-weight: 600;
}

.m23 .sec3 .box .box-2 {
display: flex;
gap:120px;
padding:20px;
border-radius: 20px;
}

.m23 .sec3 .box .box-2 .img-box1{
margin-left:60px;
}

/* m33 */
.m33 .section1 {
padding-bottom: 180px;
}

.m33 .search-box {
width: 100%;
height: 180px;
background-color:#f8f8f8;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
}

.m33 form {
position: relative;
}

.m33 .search-box input {
width: 844px;
padding: 22px 30px;
border: 1px solid #bfbfbf;
border-radius:30px;
font-size:18px;
}

.m33 .search-box input::placeholder{
font-size:18px;
color:#888;
}

.m33 .search-box button {
position: absolute;
width:21px;
height: 21px;
transform: translate(-50%, -50%);
top:50%;
right:20px;
border:none;
background: url(/images/page/m33_icon1.png) no-repeat center / cover;
}

.m33 .notice-text {
margin-top:100px;
font-size: 22px;
font-weight: 600;
}

.m33 .notice-text span {
color: var(--main-color);
}

.m33 .brochure-list {
margin-top:60px;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 60px;
grid-row-gap: 95px;
justify-items: center;
}

.m33 .brochure-list .list-item .thumb {
border-radius:20px;
overflow: hidden;
border: 1px solid rgba(102, 102, 102, 0.34);
}

.m33 .brochure-list .list-item .thumb img {
height: 100%;
width: 100%;
object-fit: cover;
}

.m33 .brochure-list .list-item .txtwrap{
margin:40px 0;
}

.m33 .brochure-list .list-item .tit {
font-family: 'Poppins';
font-size: 22px;
font-weight: 600;
color: #000;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}

.m33 .brochure-list .list-item .date {
font-family: 'Poppins';
font-size: 16px;
color: #666;
margin-top:20px;
}

.m33 .brochure-list .list-item a {
display:block;
background-color: var(--main-color);
border-radius:30px;
color: #fff;
font-size: 18px;
padding:22px 0;
text-align: center;
}


/* bbs */
.bbs{padding: 0 0 180px;}
.bbs .list_type1{border-top: 1px solid #000;}
.bbs .list_type1 li{border-bottom: 1px solid #ccc;}
.bbs .list_type1 li a{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding: 40px 50px;
}
.bbs .list_type1 li a .txtwrap{
	width: calc(100% - 280px);
}
.bbs .list_type1 li a .txtwrap .tit{
	font-size: 28px;
	font-weight: 600;
}
.bbs .list_type1 li a .txtwrap .con{
	margin: 20px 0;
	font-size: 18px;
	color: #555;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bbs .list_type1 li a .txtwrap .date{
	font-size: 16px;
	color: #666;
}
.bbs .list_type1 li a .more_btn{
	width: 280px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.bbs .list_type1 li a .more_btn span{
	font-family: "Poppins";
	font-size: 14px;
}
.bbs .list_type1 li a .more_btn .arr{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 58px;
	height: 58px;
	border: 1px solid #000;
	border-radius: 50%;
	margin-left: 20px;
	transition: all 0.3s;
}
.bbs .list_type1 li a:hover .more_btn .arr{
	background: #0081c8;
	border: 1px solid #0081c8;
}
.bbs .list_type1 li a .more_btn .arr i{
	display: block;
	width: 10px;
	height: 10px;
	background: url(/images/page/bbs_arr.png) no-repeat center / cover;
	transition: all 0.3s;
}
.bbs .list_type1 li a:hover .more_btn .arr i{
	background: url(/images/page/bbs_arr_wh.png) no-repeat center / cover;
}


.bbs .list_type2{
	display: flex;
	flex-wrap: wrap;
	column-gap: 50px;
	row-gap: 100px;
}
.bbs .list_type2 li{
	width: calc((100% - 100px) / 3);
}
.bbs .list_type2 li a{
	display: block;
}
.bbs .list_type2 li a .thumb{
	width: 100%;
	aspect-ratio: 448 / 280;
	border-radius: 20px;
	overflow: hidden;
}
.bbs .list_type2 li a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.7s;
}
.bbs .list_type2 li a:hover .thumb img{
	transform: scale(1.1);
}
.bbs .list_type2 li a .txtwrap{
	margin-top: 35px;
}
.bbs .list_type2 li a .txtwrap .tit{
	font-size: 28px;
	font-weight: 600;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.bbs .list_type2 li a .txtwrap .con{
	margin: 15px 0 25px;
	font-size: 20px;
	color: #555;
	line-height: 1.7em;
	height: 3.4em;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.bbs .list_type2 li a .txtwrap .date{
	font-size: 16px;
	color: #666;
}

.bbs_view{padding: 0 0 180px;}
.bbs_view .titwrap{
	width: 100%;
	padding: 60px 4%;
	border-top: 1px solid #000;
	border-bottom: 1px solid #ccc;
	text-align: center;
}
.bbs_view .titwrap .tit{
	font-size: 36px;
	font-weight: 600;
}
.bbs_view .titwrap .date{
	font-size: 18px;
	margin-top: 30px;
	color: #666;
}
.bbs_view .filewrap{
	width: 100%;
	padding: 30px 4%;
	border-bottom: 1px solid #ccc;
	background: #f9f9f9;
}
.bbs_view .filewrap ul{
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 5px;
}
.bbs_view .filewrap li a{
	font-size: 18px;
	display: flex;
	align-items: center;
}
.bbs_view .filewrap li a i{
	display: block;
	width: 20px;
	height: 18px;
	background: url(/images/page/file_icon.png) no-repeat center / contain;
	margin-left: 10px;
}
.bbs_view .conwrap{
	padding: 100px 4%;
	border-bottom: 1px solid #ccc;
}
.bbs_view .listBtn{
	text-align: center;
	margin-top: 70px;
}
.bbs_view .listBtn a{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 170px;
	height: 70px;
	border-radius: 70px;
	background: #0081c8;
	font-family: "Poppins";
	font-size: 14px;
	color: #fff;
}
.bbs_view .listBtn a img{margin-left: 60px;}


.m41 .section1{padding: 140px 0 220px; background: #f8f8f8;}
.m41 .section1 .formarea > .est{
	font-size: 16px;
	margin-bottom: 80px;
}
.m41 .section1 .formarea > .est span{
	color: #0081c8;
}
.m41 .section1 .formarea .inquirywrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	row-gap: 40px;
}
.m41 .section1 .formarea .inquirywrap dl{width: 100%;}
.m41 .section1 .formarea .inquirywrap dl.w50{width: 48%;}
.m41 .section1 .formarea .inquirywrap dl.blank{height: 0;}
.m41 .section1 .formarea .inquirywrap dl dt{
	font-size: 20px;
	font-weight: 500;
	margin-bottom: 15px;
}
.m41 .section1 .formarea .inquirywrap dl dt .est{
	color: #0081c8;
}
.m41 .section1 .formarea .inquirywrap dl dd{}
.m41 .section1 .formarea .inquirywrap dl dd input{
	box-sizing: border-box;
	height: 60px;
	padding: 0 25px;
	background: #fff;
	border-radius: 8px;
	border: 1px solid #c6c6cb;
	font-size: 18px;
	width: 100%;
	outline: none;
}
.m41 .section1 .formarea .inquirywrap dl dd.tel {
	display: flex;
}
.m41 .section1 .formarea .inquirywrap dl dd.tel .etc{
	width: 20px;
	line-height: 60px;
	text-align: center;
}
.m41 .section1 .formarea .inquirywrap dl dd.tel input[type="tel"]{
	width: calc((100% - 40px) / 3);
}
.m41 .section1 .formarea .inquirywrap dl dd select{
	width: 100%;
	border: 1px solid #c6c6cb;
	height: 60px;
	padding: 0 25px;
	box-sizing: border-box;
	border-radius: 8px;
	font-size: 18px;
	appearance: none;
	background: url(/images/page/m41_select_arr.png) no-repeat right 25px center #fff;
}

.m41 .section1 .formarea .inquirywrap dl dd textarea {
	font-size: 18px;
	width: 100%;
	height: 250px;
	resize: none;
	border: 1px solid #c6c6cb;
	border-radius: 8px;
	overflow-y: auto;
	padding: 25px;
	box-sizing: border-box;
}

.m41 .section1 .formarea .agreewrap{
	margin-top: 90px;
	padding: 90px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.m41 .section1 .formarea .agreewrap > .tit{
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 50px;
}
.m41 .section1 .formarea .agreewrap .txtwrap{
	width: 100%;
	padding: 25px;
	box-sizing: border-box;
	border-radius: 8px;
	background: #fff;
	border: 1px solid #c6c6cb;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts{
	width: 100%;
	height: 250px;
	overflow-y: auto;
	font-size: 16px;
	line-height: 1.7em;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts .con{
	margin-top: 50px;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts .con .tit{
	font-size: 18px;
	font-weight: 600;
	color: #666;
	margin-bottom: 25px;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts .con p{
	font-size: 16px;
	line-height: 1.7em;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts .con .list{
	margin: 20px 0;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts .con .list .exp{
	position: relative;
	padding-left: 23px;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts .con .list .exp:after{
	content: "";
	position: absolute;
	left: 13px;
	top: 12px;
	width: 5px;
	height: 1px;
	background: #666;
}

.m41 .section1 .formarea .agreewrap .txtwrap .txts::-webkit-scrollbar {
	width: 3px;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts::-webkit-scrollbar-thumb {
	background: #000;
}
.m41 .section1 .formarea .agreewrap .txtwrap .txts::-webkit-scrollbar-track {
	background: #ccc;
}

.m41 .section1 .formarea .agreewrap .agree{
	padding-top: 30px;
	display: flex;
	align-items: center;
}
.m41 .section1 .formarea .agreewrap .agree .agree_btn{
	width: 27px;
	height: 27px;
}
.m41 .section1 .formarea .agreewrap .agree label{
	padding-left: 10px;
	font-size: 20px;
	font-weight: 500;
	color: #000;
}

.m41 .section1 .formarea .buttonarea{
	margin-top: 60px;
	text-align: center;
}
.m41 .section1 .formarea .buttonarea button{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 170px;
	height: 70px;
	border-radius: 70px;
	border: none;
	background: #0081c8;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
}
.m41 .section1 .formarea .buttonarea button i{
	display: block;
	width: 10px;
	height: 10px;
	background: url(/images/page/m41_submit_arr.png) no-repeat center / contain;
	margin-left: 20px;
}

/* 모션 */
.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);
}

.hidden{
overflow: hidden;
}

.m11 .section1 .content1 .section1-title .sig span{display: inline-block; transform: translateY(100%);}
.m11 .section1 .content1 .section1-title .sig:nth-child(1).in-view span:nth-child(1){transform: translateY(0); transition: all 0.3s 0.2s;}
.m11 .section1 .content1 .section1-title .sig:nth-child(1).in-view span:nth-child(2){transform: translateY(0); transition: all 0.3s 0.5s;}
.m11 .section1 .content1 .section1-title .sig:nth-child(2).in-view span{transform: translateY(0); transition: all 0.3s 0.8s;}
.m11 .section1 .content1 .section1-title .sig:nth-child(3).in-view span{transform: translateY(0); transition: all 0.3s 1.1s;}
.m11 .section1 .content1 .content-box.in-view {transition-delay: 1.1s;}


.m13 .section1 .content1 .content-box strong,
.m13 .section1 .content1 .content-box span,
.m13 .section1 .content1 .content-box .content-box__text p{display: inline-block; transform: translateY(100%);}

.m13 .section1 .content1 .content-box.in-view .content-box__text::before {width: 100%;transition: all 0.5s 1s;}
.m13 .section1 .content1 .content-box.in-view strong,
.m13 .section1 .content1 .content-box.in-view span{transform: translateY(0); transition: all 0.5s 1.2s;}
.m13 .section1 .content1 .content-box.in-view .content-box__text p{transform: translateY(0); transition: all 0.5s 1.7s;}

.m13 .section2 .content1 .coreValue-list .list-item {
transform: translateY(100%);
opacity: 0;
}

.m13 .section2 .content1 .coreValue-list.in-view .list-item:nth-child(1) {
transform: translateY(0); transition: all 0.4s 0.4s;opacity: 1;
}
.m13 .section2 .content1 .coreValue-list.in-view .list-item:nth-child(2) {
transform: translateY(0); transition: all 0.4s 0.8s;opacity: 1;
}
.m13 .section2 .content1 .coreValue-list.in-view .list-item:nth-child(3) {
transform: translateY(0); transition: all 0.4s 1.2s;opacity: 1;
}
.m13 .section2 .content1 .coreValue-list.in-view .list-item:nth-child(4) {
transform: translateY(0); transition: all 0.4s 1.6s;opacity: 1;
}

.m211 .section1 .intro_box.in-view::before,
.m211 .section1 .intro_box.in-view::after {
transform: scaleX(0);
transition: all 1s;
}
.m211 .section1 .intro_box.in-view h3,
.m211 .section1 .intro_box.in-view .txts {
opacity: 1;
transition: all 0.4s 1s;
}

.m211 .section2 .con1 .list1.in-view {
transition-delay: 0.2s;
}

.m211 .section2 .con1 .arr.in-view {
transition-delay: 0.4s;
}

.m211 .section2 .con1 .list2.in-view {
transition-delay: 0.6s;
}

.m211 .section2 .con1 .expwrap {
transition-delay: 0.8s;
}

.m211 .section2 .con2 {
transition-delay: 1s;
}

.m212 .sec1 .content1 .con1-img {}

.m212 .sec1 .content1 .con-title,
.m213 .sec1 .content1 .con-title,
.m214 .sec1 .content1 .con1-img
{ transition-delay: 0.5s; }


.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item:nth-child(1),
.m213 .sec1 .con2 .anewderm-list .list-item:nth-child(1),
.m213 .sec1 .con3 .Indication-list .list-item:nth-child(1),
.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item:nth-child(1){
transition-delay: 0.2s;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item:nth-child(2),
.m213 .sec1 .con2 .anewderm-list .list-item:nth-child(2),
.m213 .sec1 .con3 .Indication-list .list-item:nth-child(2),
.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item:nth-child(2){
transition-delay: 0.4s;
}

.m212 .sec1 .content1 .con2 .whatAnewgen-list .list-item:nth-child(3),
.m213 .sec1 .con2 .anewderm-list .list-item:nth-child(3),
.m213 .sec1 .con3 .Indication-list .list-item:nth-child(3),
.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item:nth-child(3){
transition-delay: 0.6s;
}

.m213 .sec1 .con2 .anewderm-list .list-item:nth-child(4),
.m213 .sec1 .con3 .Indication-list .list-item:nth-child(4),
.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item:nth-child(4){
transition-delay: 0.8s;
}

.m213 .sec1 .con2 .anewderm-list .list-item:nth-child(5),
.m213 .sec1 .con3 .Indication-list .list-item:nth-child(5),
.m214 .sec1 .content1 .con2 .whatScecmL-list .list-item:nth-child(5){
transition-delay: 1s;
}


.m214 .sec2 .content1 .con.in-view:nth-child(2){
transition-delay: 0.2s;
}

.m214 .sec2 .content1 .con.in-view:nth-child(3){
transition-delay: 0.4s;
}

.m214 .sec2 .content1 .con.in-view:nth-child(4){
transition-delay: 0.6s;
}

.m214 .sec2 .content1 .con.in-view:nth-child(5){
transition-delay: 0.8s;
}

.m214 .sec2 .content1 .con.in-view:nth-child(6){
transition-delay: 1s;
}

.m214 .sec5 .content1 .con1 .con-box .con-box__img{
transform: translateX(-50px);
opacity: 0;
transition: all 1s;
}

.m214 .sec5 .content1 .con1 .con-box.in-view .con-box__img{
transform: translateX(0px);
opacity: 1;
}

.m214 .sec5 .content1 .con1 .con-box .recommended-list .list-item {
transform: translateX(50px);
opacity: 0;
transition: all 1s;
}

.m214 .sec5 .content1 .con1 .con-box.in-view .recommended-list .list-item {
transform: translateX(0px);
opacity: 1;
}

.m214 .sec5 .content1 .con1 .con-box .box-title ,
.m214 .sec5 .content1 .con1 .con-box .box-text {
transform: translateY(100%);
display: inline-block;
}

.m214 .sec5 .content1 .con1 .con-box .box-title{
transition: all 0.5s 1.2s;
}
.m214 .sec5 .content1 .con1 .con-box .box-text {
transition: all 0.5s 1.4s;
}

.m214 .sec5 .content1 .con1 .con-box.in-view .box-title,
.m214 .sec5 .content1 .con1 .con-box.in-view .box-text{
transform: translateY(0);
} 

.m214 .sec5 .content1 .con1 .con-box.in-view .recommended-list {
border-top: 1px solid #e3e2e2;
transition: all 0.2s 2s;
}

.m214 .sec5 .content1 .con1 .con-box.in-view .recommended-list .list-item:nth-child(1){
transition-delay: 2s;
}
.m214 .sec5 .content1 .con1 .con-box.in-view .recommended-list .list-item:nth-child(2){
transition-delay: 2.2s;
}
.m214 .sec5 .content1 .con1 .con-box.in-view .recommended-list .list-item:nth-child(3){
transition-delay: 2.4s;
}

.m22 .sec3 .con4 .box1.in-view::before,
.m22 .sec3 .con4 .box1.in-view::after{
transform: scaleX(0);
transition: all 1s;
}

.m22 .sec3 .con4 .box1 .swiper-pagination,
.m22 .sec3 .con4 .box1 .swiper-button-next,
.m22 .sec3 .con4 .box1 .swiper-button-prev{
opacity: 0;
transition: all 0.5s 1s;
}

.m22 .sec3 .con4 .box1.in-view .swiper-pagination,
.m22 .sec3 .con4 .box1.in-view .swiper-button-next,
.m22 .sec3 .con4 .box1.in-view .swiper-button-prev{
opacity: 1;
}