/* common */
#sv .subVisual{ position: relative; height: 580px; z-index: 5; }
#sv .subVisual .bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; }
#sv .subVisual > div{ display: flex; flex-direction: column; justify-content: flex-end; height: 100%; padding-bottom: 60px;}
#sv .subVisual > div .title{ color:#fff; font-family: var(--pre); font-weight: bold; margin-bottom: 20px; }
#sv .subVisual #lnb{ display:flex; align-items:center; }
#sv .subVisual #lnb a{ display:flex; justify-content:center; align-items:center; }
#sv .subVisual #lnb li{ color:rgba(255,255,255,0.5); font-family:var(--pre); font-weight: bold; display:flex; align-items:center; }
#sv .subVisual #lnb li:not(:first-child):before{ content:''; display:block; width: 3px; height: 3px; border-radius:50%; background: rgba(217,217,217,0.5); margin: 0 15px;}
#sv .subVisual #lnb li .path{ color:#fff; }
#sv .subVisual #lnb li.subTitle{ display:none; }

#sv.sv01 .subVisual .bg{ background: url("/img/sub/subVisual01.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv02 .subVisual .bg{ background: url("/img/sub/subVisual02.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv03 .subVisual .bg{ background: url("/img/sub/subVisual03.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv04 .subVisual .bg{ background: url("/img/sub/subVisual04.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv05 .subVisual .bg{ background: url("/img/sub/subVisual05.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv06 .subVisual .bg{ background: url("/img/sub/subVisual06.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv07 .subVisual .bg{ background: url("/img/sub/subVisual07.png") no-repeat 50% 50%; background-size:cover;  }
#sv.sv08 .subVisual .bg{ background: url("/img/sub/subVisual07.png") no-repeat 50% 50%; background-size:cover;  }

#sv.sv01 .subVisual #lnb li.subTitle,
#sv.sv02 .subVisual #lnb li.subTitle,
#sv.sv04 .subVisual #lnb li.subTitle{ display:flex; }

#subContents{ padding: 150px 0 180px;}

#titleBox{ text-align: center; margin-bottom: 150px;}
#titleBox .title{ font-weight: 600; color:#111; font-family: var(--pre);}
#titleBox .txt{ color:#333; font-weight: 300; margin-top: 20px;}

/* sub */
#vc{ overflow: hidden;}
#vc section:not(.info){ padding: 180px 0;}
#vc .info .titleBox{ text-align: center; margin-bottom: 150px; }
#vc .info .titleBox .sTxt{ width: 350px; height: 65px; border-radius:50px; background: linear-gradient(90deg, #008868 0%, #176FC0 100%); color:#fff; font-weight: bold; display:flex; justify-content:center; align-items:center; margin: 0 auto 40px;}
#vc .info .titleBox .title{ color:#111; font-weight: 600; }
#vc .info .listBox{ display:flex; justify-content:flex-end; margin-bottom: 30px; }
#vc .info .listBox li{ display:flex; align-items:center; color:#333; font-weight: 500; }
#vc .info .listBox li:not(:last-child){ margin-right: 30px;}
#vc .info .listBox li figure{ width: 50px; height: 50px; display:flex; justify-content:center; align-items:center; border-radius:50%; border:1px solid #e5e5e5; margin-right: 20px; flex-shrink: 0;}
#vc .info .content { border-top:1px solid #E5E5E5; padding: 80px 0 180px; }
#vc .info .content .titleBox{ text-align: left; margin-bottom: 100px;}
#vc .info .content .titleBox .title{ margin-bottom: 40px; display:flex; justify-content:space-between; align-items:center; }
#vc .info .content .titleBox .title a{ display:flex; align-items:center; color:#ccc; }
#vc .info .content .titleBox .title a span{ margin: 0 10px;}
#vc .info .content .titleBox .txt{ line-height: 1.7; font-weight: 300; color:#333; }
#vc .info .content .titleBox .txt.type2{ margin-top: 20px;}
#vc .info .content .titleBox .stxtBox{ margin-top: 30px; color:#555; font-weight: 300; line-height: 1.7;}
#vc .info .content .titleBox .stxtBox ul li{ text-indent: -10px; margin-left: 10px;}
#vc .info .content .ctnBox .itemBox{ display:flex; filter:blur(5px); -webkit-filter: blur(5px); ransition:all 0.5s;}
#vc .info .content .ctnBox .itemBox:not(:last-child){ margin-bottom: 20px;}
#vc .info .content .ctnBox .itemBox dt{ width:350px; margin-right: 100px; flex-shrink:0; background: #F8F8F8; border-radius:20px; display:flex; flex-direction:column; justify-content:center; align-items:center; padding: 30px; transition:all 0.3s; }
#vc .info .content .ctnBox .itemBox dt path{ transition:all 0.3s; }
#vc .info .content .ctnBox .itemBox dt .title{ margin: 30px 0 10px; color:#ccc; font-weight: 600; transition:all 0.3s; text-align: center; }
#vc .info .content .ctnBox .itemBox dt .txt{ color:#ccc; font-family: var(--pre); font-weight: 600; transition:all 0.3s; }
#vc .info .content .ctnBox .itemBox dd{ width: 100%;  }
#vc .info .content .ctnBox .itemBox dd .item{ border:2px solid #E5E5E5; border-radius:20px; width: 100%; padding: 60px 40px; color:#333; }
#vc .info .content .ctnBox .itemBox dd .item:not(:last-child){ margin-bottom: 20px; }
#vc .info .content .ctnBox .itemBox dd .item .title{ display:flex; align-items:center; padding-bottom: 20px; border-bottom:1px solid #E5E5E5; margin-bottom: 40px; font-weight: 600;}
#vc .info .content .ctnBox .itemBox dd .item .title span{ font-family: var(--pre); font-weight: bold; margin-right: 30px; }
#vc .info .content .ctnBox .itemBox dd .item .txt{ font-weight: 300;}
#vc .info .content .ctnBox .itemBox dd .item .txt span{ font-weight: 600;}
#vc .info .content .ctnBox .itemBox dd .item .txt2{ margin-top: 40px; color:#555; font-weight: 300; text-indent:-12px; margin-left: 12px; letter-spacing: -0.4px;}
#vc .info .content .ctnBox .itemBox dd .item .txt2 sup{ font-size:12px; color:#222;  font-weight: 500; }
#vc .info .content .ctnBox .itemBox dd .item .txtBox{ margin-top: 40px; background: #F8F8F8; border-radius:20px; padding: 40px; }
#vc .info .content .ctnBox .itemBox dd .item .txtBox .sTitle{ width: 220px; height: 55px; border-radius:50px; background: var(--mainC); color:#fff; font-weight: bold; display:flex; justify-content: center; align-items:center; margin-bottom: 30px; }
#vc .info .content .ctnBox .itemBox dd .item .txtBox ul li{ display:flex; align-items:center;  font-weight: 300; color:#555; }
#vc .info .content .ctnBox .itemBox dd .item .txtBox ul li:not(:last-child){ margin-bottom: 20px;}
#vc .info .content .ctnBox .itemBox dd .item .txtBox ul li img{ margin-right: 10px;}
#vc .info .content .ctnBox .itemBox.on{ filter:blur(0px); -webkit-filter: blur(0px); }
#vc .info .content .ctnBox .itemBox.on dt{ background: var(--mainC); }
#vc .info .content .ctnBox .itemBox.on dt path{ stroke: #fff;  }
#vc .info .content .ctnBox .itemBox.on dt .title{ color:#fff;  }
#vc .info .content .ctnBox .itemBox.on dt .txt{ color:rgba(255,255,255,0.5); }
#vc .info .content .bTxt{ color:#333; margin-top: 50px;}
#vc .works{ background: #F8F8F8;}
#vc .works .titleBox{ text-align: center; margin-bottom: 120px;}
#vc .works .titleBox .sTxt{ color:var(--mainC); font-weight: 600; }
#vc .works .titleBox .title{ color:#111; font-family: var(--pre); font-weight: 600; margin: 10px 0 30px; }
#vc .works .titleBox .txt{ color:#333; font-weight: 300; line-height: 1.7; }
#vc .works .txt.type2{ text-align: right; color:#333; max-width:1200px; width: 100%; margin: 0 auto 10px;}
#vc .works .tabBox{ display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom: 40px; display:none;}
#vc .works .tabBox li button{ height: 50px; padding: 0 20px; border-radius:50px; font-weight: bold; border: 2px solid #ddd; color: rgba(0, 0, 0, 0.4);}
#vc .works .tabBox li.on button{ background: var(--mainC); color:#fff;  border: 2px solid var(--mainC);}
#vc .works .content{ text-align: center; }
#vc .works .content .bg .item{ opacity: 0; transition:all 0.3s 0.1s; }
#vc .works .content .bg .item .back{ pointer-events:none; }
#vc .works .content .bg .cover{ fill:transparent; transition:all 0.5s; }
@media (hover: hover) {
  #vc .works .content .bg .item:hover{ opacity: 1; }
}
#vc .works .content .bg:hover .cover{ fill: black; }
#vc .works .content .ctnBox{ width: max-content;}
#vc .works .content .ctnBox .itemBox{ position: absolute; top: 0; left: 0; display:inline-block; text-align: left; padding: 30px; border-radius: 20px; border: 2px solid rgba(255, 255, 255, 0.50); background: var(--mainColor, #008868);  width: max-content; pointer-events:none; opacity: 0; transition:opacity 0.5s; }
#vc .works .content .ctnBox .itemBox.on{ opacity: 1; }
#vc .works .content .ctnBox .itemBox .title{ display:inline-block; background: #FFF; border-radius:50px; color:var(--mainC); font-weight: 700; padding: 10px 30px; margin-bottom: 20px; }
#vc .works .content .ctnBox .itemBox .txt{ color:#fff; font-weight: 300;}
#vc .howto h3.title{ text-align: center; font-family: var(--pre); color:#111; font-weight: 600; margin-bottom: 120px; }
#vc .howto .ctnBox{ position: relative; display:flex; justify-content:space-between; margin: 0 170px 250px;}
#vc .howto .ctnBox:before{ content:''; display:block; width: 100%; height: 3px; position: absolute; transform:translateX(-50%); left: 50%; top: 165px; background: linear-gradient(90deg, #176FBF 50%, #9CAEBF 50%);}
#vc .howto .ctnBox .itemBox .txtBox{ position: relative; width: 335px; height: 335px; border-radius:50%; box-shadow: 0 0 0 20px #f8f8f8 inset; display:flex; flex-direction:column; justify-content:center;  align-items:center; background: #fff; margin: 0 auto 90px; text-align: center; }
#vc .howto .ctnBox .itemBox .txtBox:before{ content:''; display:block; width: 2px; height: 40px; background: #e5e5e5; position: absolute; transform:translateX(-50%); left: 50%; top: 80%; 
transition:all 0.8s 0.6s; z-index: -1;}
#vc .howto .ctnBox .itemBox .txtBox:after{ content:''; display:block; width: 10px; height: 10px; border-radius:50%; background: var(--subC); position: absolute; transform:translateX(-50%); left: 50%; 
top: calc(85% + 40px);transition:all 0.8s 0.6s;}
#vc .howto .ctnBox .itemBox .txtBox .sTxt{ color:var(--subC); font-weight: bold; }
#vc .howto .ctnBox .itemBox .txtBox .txt{ color:#333; font-weight: 600; margin:20px 0 10px;}
#vc .howto .ctnBox .itemBox .txtBox .title{ font-weight: 700;}
#vc .howto .ctnBox .itemBox .txtBox figure{ position: absolute; transform:translateY(-50%); top: 50%; left: -9px;}
#vc .howto .ctnBox .itemBox .txtBox figure.right{ left: auto; right: -9px;}
#vc .howto .ctnBox .itemBox.item2 .txtBox figure path{ fill: #eee; }
#vc .howto .ctnBox .itemBox.item3 .txtBox figure path{ fill: #9CAEBF; }
#vc .howto .ctnBox .itemBox .bTxt{ text-align: center; color:#333; font-weight: 300; line-height: 1.6; opacity: 0; transition:all 0.7s 1s; }
#vc .howto .ctnBox .itemBox .bTxt span{ font-weight: 600;}
#vc .howto .btnBox{ text-align: center; color:#555; line-height: -0.3px; }
#vc .howto .btnBox .txt01{ margin: 15px 0; font-weight: bold; }
#vc .howto .ctnBox.aos-animate .itemBox .txtBox:before{ top: 100%; }
#vc .howto .ctnBox.aos-animate .itemBox .txtBox:after{ top: calc(100% + 40px);}
#vc .howto .ctnBox.aos-animate .itemBox .bTxt{ opacity: 1;}
#vc .howto .bTxt{ color:#333; margin-top: 120px; text-align: center; }
#vc .effect{ background: #0C1A29;}
#vc .effect > div > .titleBox{ text-align: center; color:#fff;font-weight: 600; }
#vc .effect > div > .titleBox .title{ margin: 10px 0 30px; font-weight: 600;}
#vc .effect > div > .titleBox .txt{ line-height: 1.7; font-weight: 300; }
#vc .effect ul.txtBox{ color:#ccc; font-weight: 500; margin: 100px 0 0;}
#vc .effect ul.txtBox li:not(:last-child){ margin-bottom: 15px; }
#vc .effect ul.txtBox li p{ margin-top: 50px;}
#vc .effect .content{ margin-bottom: 80px;}
#vc .effect .content .titleBox{ margin-bottom: 120px; text-align: center; color:#fff; }
#vc .effect .content .titleBox .title{ font-family: var(--pre); font-weight: 600; margin-bottom: 30px;}
#vc .effect .content > .title{ width: 200px; height: 65px; border-radius:50px; color:#fff; font-weight: bold; display:flex; justify-content:center; align-items:center; margin: 0 auto 40px;
background: linear-gradient(90deg, #008868 0%, #176FC0 100%); text-align: center; }
#vc .effect .content .innerBox{ padding: 80px 80px 40px; border-radius: 20px; background: #172636;}
#vc .effect .content .innerBox:not(:last-child){ margin-bottom: 40px;}
#vc .effect .content .innerBox > .txtBox{ text-align: center; margin-bottom: 40px;}
#vc .effect .content .innerBox > .txtBox .txt{ color:#fff; font-weight: 600; }
#vc .effect .content .innerBox > .txtBox .title{ color:#fff; font-weight: 600; margin: 5px 0 40px;}
#vc .effect .content .innerBox > .txtBox .txt2{ color:#fff; }
#vc .effect .content .ctnBox{ display:flex; justify-content:flex-end; align-items:flex-end; margin-right: 110px; opacity: 1; }
#vc .effect .content .ctnBox .itemBox{ position: relative; padding: 100px 40px 105px; border-radius: 20px; border: 2px solid #3C4C5C; min-width: 300px; flex-shrink: 0;}
#vc .effect .content .ctnBox .itemBox .wrapBox{ position: relative; display:flex; justify-content: center; padding: 0 30px; border-top:1px dashed rgba(255,255,255,0.15); border-bottom:1px dashed rgba(255,255,255,0.15); }
#vc .effect .content .ctnBox .itemBox .wrapBox:before,
#vc .effect .content .ctnBox .itemBox.type2 .wrapBox:after{ content:''; position: absolute; display:block; width: 100%; height: 1px; border-top:1px dashed rgba(255,255,255,0.15); top: 100px; transform:translateX(-50%); left: 50%; }
#vc .effect .content .ctnBox .itemBox.type2 .wrapBox:after{ top: 200px; }
#vc .effect .content .ctnBox .itemBox .infoTxt{ position: absolute; transform:translateX(-50%); left: 50%; bottom: -32.5px; height: 65px; padding: 0 40px; border-radius: 100px; background: #3C4C5C;
color:#fff; font-weight: 600; display:flex; justify-content:center; align-items:center;  width: max-content; }
#vc .effect .content .ctnBox .itemBox .item{ position: relative; z-index: 5;}
#vc .effect .content .ctnBox .itemBox br.mobile{ display:none; }
#vc .effect .content .ctnBox .itemBox .item:not(:last-of-type){ margin-right: 100px; }
#vc .effect .content .ctnBox .itemBox .item p{ position: absolute; transform:translateX(-50%); left: 50%; color:#ccc; font-family: var(--pre); font-weight: bold; font-variant-numeric: lining-nums proportional-nums;width: max-content; }
#vc .effect .content .ctnBox .itemBox .item p.tTxt{ bottom: calc(100% + 15px);}
#vc .effect .content .ctnBox .itemBox .item p.bTxt{ top: calc(100% + 15px);}
#vc .effect .content .ctnBox .itemBox .item p sup{ font-size:12px; }
#vc .effect .content .ctnBox .itemBox .item .graph{ overflow: hidden;}
#vc .effect .content .ctnBox .itemBox .item .graph span{ display:block; width: 75px; height: 200px; border-radius: 5px; background: #3C4C5C; transition:all 1.7s; transform: translateY(100%); transform-origin: bottom;}
#vc .effect .content .ctnBox .itemBox.type2{ border: 2px solid var(--subC); background: rgba(23, 111, 192, 0.10); }
#vc .effect .content .ctnBox .itemBox.type2 .wrapBox{ padding: 0 135px;}
#vc .effect .content .ctnBox .itemBox.type2 .item .graph span{ height: 300px; background: var(--subC);}
#vc .effect .content .ctnBox .itemBox.type2 .infoTxt{ background: var(--subC);}
#vc .effect .content .ctnBox .arrowBox{ flex-shrink:0; margin: 0 40px 70px; display:flex; flex-direction: column; align-items:center; }
#vc .effect .content .ctnBox .arrowBox figure{ position: relative; left: -10%; transition:all 0.7s ease-in-out; opacity: 0; text-align: center; }
#vc .effect .content .ctnBox .arrowBox .txtBox{ background: var(--mainC); color:#fff; text-align: center; display:inline-block; padding: 20px; border-radius: 20px; width: max-content;
margin: 40px 0 0; opacity: 0; transition:all 1s; }
#vc .effect .content .ctnBox .arrowBox .txtBox .txt2{ color:#fff; font-weight: 700; margin-top: 10px;}
#vc .effect .content .ctnBox .arrowBox .txtBox .txt2 span{ font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums;}
#vc .effect .content .ctnBox.aos-animate .itemBox .item .graph span{ transform: translateY(0%);  }
#vc .effect .content .ctnBox.aos-animate .arrowBox figure{ left: 0; opacity: 1;}
#vc .effect .content .ctnBox.aos-animate .arrowBox .txtBox{ opacity: 1;}
#vc .effect .content .btmTxt{ text-align: right; color:rgba(255,255,255,0.7); margin-top: 100px; }
#vc .effect > div > .btmTxt{ color:#ccc; text-align: center; margin-top: 100px;}

#searchBox{ display:flex; margin-bottom: 120px; }
#searchBox select,
#searchBox input{ border:2px solid #E5E5E5; border-radius:20px; padding: 0 40px; outline:none; height: 80px; font-family: var(--baseFont); margin-right: 10px; }
#searchBox select,
#searchBox button{ width: 300px; flex-shrink:0; }
#searchBox select{ color:#ccc; background: url(/img/sub/selectArrow.png) no-repeat 90% 50%; }
#searchBox select option{ color:#222; }
#searchBox input{ width: 100%; color:#222; }
#searchBox input::placeholder{ color:#ccc; }
#searchBox button{ background: #333; border-radius:20px; color:#fff; font-weight: 600; }

.boardCtn .tabBox{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin-bottom: 60px; gap:10px 0; }
.boardCtn .tabBox li{ display:flex; align-items:center; }
.boardCtn .tabBox li:not(:last-child):after{ content:''; display:block; width: 2px; height: 15px; background: #ccc; margin: 0 20px;}
.boardCtn .tabBox li a{ color: #ccc; font-weight: 600; transition:all 0.5s; }
.boardCtn .tabBox li:hover a,
.boardCtn .tabBox li.on a{ color:var(--mainC);}
.boardCtn .ctnBox{ border-top:1px solid #222; }
.boardCtn .ctnBox .itemBox{ position: relative; border-bottom:1px solid #ccc; }
.boardCtn .ctnBox .itemBox:after{ content:''; position: absolute; bottom: -1px; left: 0; width: 0; height: 1px; background: var(--mainC); transition:all 0.5s ease-out;  }
.boardCtn .ctnBox .itemBox:hover:after{ width: 100%; }
.boardCtn .ctnBox .itemBox > a{ padding: 40px; display:flex; align-items:flex-end; justify-content: space-between;}
.boardCtn .ctnBox .itemBox .txtBox{ margin-right: 130px;}
.boardCtn .ctnBox .itemBox .txtBox .sTxt{ padding: 5px 20px; display:inline-block; background: var(--mainC); color:#fff; font-weight: bold; border-radius:50px; margin-bottom: 15px; 
margin-left: 10px;}
.boardCtn .ctnBox .itemBox .txtBox .num{ color:#ccc;  display:inline-block; margin-bottom: 15px;}
.boardCtn .ctnBox .itemBox .txtBox .txt{ color:#222; font-weight: 500; text-overflow: ellipsis; overflow: hidden;  display: -webkit-box;  -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-word; }
.boardCtn .ctnBox .itemBox .dayBox,
.boardCtn .ctnBox .itemBox .dayBox li{ display:flex; align-items:center; color:#ccc; font-weight: 500; flex-shrink:0; }
.boardCtn .ctnBox .itemBox .dayBox li:not(:last-child){ margin-right: 20px;}
.boardCtn .ctnBox .itemBox .dayBox li span{ font-weight: 600; margin-right: 10px;}

.boardCtn.img .ctnBox .itemBox > a{ align-items:center; padding: 40px 0; justify-content: flex-start;}
.boardCtn.img .ctnBox .itemBox .fitBox{ width: 480px; height: 280px; border-radius:20px; flex-shrink:0; margin-right: 60px;}
.boardCtn.img .ctnBox .itemBox .txtBox{ margin-right: 0; }
.boardCtn.img .ctnBox .itemBox .txtBox .title{ color:#222; font-weight: 500; line-height: 1.5; text-overflow: ellipsis; overflow: hidden;  display: -webkit-box;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; }
.boardCtn.img .ctnBox .itemBox .txtBox .txt{ -webkit-line-clamp: 2; color:#888; font-weight: 300; line-height: 1.6; margin: 40px 0;}
.boardCtn.img .ctnBox .itemBox .txtBox .day{ font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums; color:#ccc; font-weight: 600; }

.boardImg #titleBox .linkBox{ display:flex; justify-content:flex-end; margin-top: 60px;}
.boardImg #titleBox .linkBox li:not(:last-child){ margin-right: 10px;}
.boardImg #titleBox .linkBox li a{ font-family: var(--pre); font-weight: 600; color:#ccc; border-radius:50px; border:1px solid #E5E5E5; display:flex; justify-content:center; align-items:center; height: 40px; padding: 0 15px; line-height: 1.6; transition:all 0.5s; }
.boardImg #titleBox .linkBox li a img{ filter: invert(20%) sepia(5%) saturate(0%) hue-rotate(69deg) brightness(100%) contrast(94%); margin-right: 10px;}
.boardImg #titleBox .linkBox li:hover a{ background: var(--mainC); border:1px solid var(--mainC); color:#fff;  }
.boardImg #titleBox .linkBox li:hover a img{ filter:none; }
.boardImg .ctnBox{ display:flex; flex-wrap:wrap; gap:120px 50px;  }
.boardImg .ctnBox .itemBox{ width: calc((100% - 100px) / 3);}
.boardImg .ctnBox .itemBox .fitBox{ height: 320px; border-radius:20px; margin-bottom: 30px;}
.boardImg .ctnBox .itemBox .txtBox .day{ font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums; color:#ccc; font-weight: 600; margin-bottom: 20px; }
.boardImg .ctnBox .itemBox .txtBox .day span{ background: var(--mainC); color:#fff; font-weight: 700; border-radius:50px;	padding: 5px 25px; margin-right: 20px;}
.boardImg .ctnBox .itemBox .txtBox .title{ text-overflow: ellipsis; overflow: hidden;  display: -webkit-box;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; 
color:#111; line-height: 1.5; font-weight: 500;}

.boardView .titleBox{ text-align: center; margin-bottom: 40px;}
.boardView .titleBox .title{ color:#111; font-weight: 500; font-family: var(--pre);}
.boardView .titleBox .day{ color:#ccc; font-variant-numeric: lining-nums proportional-nums; font-family: var(--pre); font-weight: 600; margin-top: 20px;}
.boardView .ctnBox{ border-top:1px solid #000; padding: 30px 0; margin-bottom: 80px;}
.boardView .ctnBox a{ display: flex; justify-content:flex-end; align-items:center; color:#888; font-weight: 500; margin-bottom: 30px; }
.boardView .ctnBox a img{ margin-right: 10px;}
.boardView .infoBox{ display:flex; margin-bottom: 40px;}
.boardView .infoBox li{ background: #eee; border-radius:50px; height: 30px; display:flex; justify-content:center; align-items:center; color:#aaa; padding: 0 25px;}
.boardView .infoBox li:not(:last-child){ margin-right: 5px;}
.boardView .arrowBox{ display:flex; gap:40px; }
.boardView .arrowBox .arrow{ width: calc((100% - 40px) / 2); }
.boardView .arrowBox .arrow a{ border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5; padding: 40px 20px; display:block; width: 100%; height: 150px; display: flex; flex-direction: column; justify-content: center;}
.boardView .arrowBox .arrow .sTxt{ color:#ccc; font-weight: 600; margin-bottom:10px ;}
.boardView .arrowBox .arrow .txt{ color:#333; font-weight: 500; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-word;}
.boardView .listBtn{ width: 300px; height: 85px; color:#fff; font-weight: 700; background: var(--mainC); border-radius:50px; display:block; margin: 120px auto 0;}
.boardView .btnBox{ display:flex; align-items:center; justify-content:center; margin-top: 120px;}
.boardView .btnBox .listBtn{ margin: 0;}
.boardView .btnBox .listBtn.type2{ background: #333; margin-left: 10px;}

.contact .content .sTxt{ text-align: right; margin-bottom: 20px; color:#555; font-weight: 300;}
.contact .content .star{ color:#F30D0D; }
.contact .ctnBox{ border-top:2px solid #000; border-bottom:1px solid #E5E5E5; padding: 80px 0; margin-bottom: 120px;}
.contact .ctnBox dl{ display:flex; align-items:center; }
.contact .ctnBox dl:not(:last-child){ margin-bottom: 10px; }
.contact .ctnBox dl dt{ color:#111; font-weight: 500; max-width:190px; width: 100%; margin-right: 10px;}
.contact .ctnBox dl dd{ width: 100%; height: 100%; display:flex; align-items:center;  gap:10px; }
.contact .ctnBox dl dd input,
.contact .ctnBox dl dd select,
.contact .ctnBox dl dd textarea{ border:1px solid #E5E5E5; border-radius:10px; height: 75px; padding: 0 30px;}
.contact .ctnBox dl dd input.ip01{ width: 100%; }
.contact .ctnBox dl dd input.ip02{ width: calc((100% - 20px) / 3); }
.contact .ctnBox dl dd select{ width: calc((100% - 20px) / 3); flex-shrink:0; color:#555; font-weight: 300; background: url(/img/sub/selectArrow.png) no-repeat 93% 50%;}
.contact .ctnBox dl dd .sideTxt{ min-width:20px; text-align: center; color:#000; font-weight: 500; }
.contact .ctnBox dl dd textarea{ resize:none; height: 280px; width: 100%; padding: 30px; color:#555; font-weight: 300; }
.contact .ctnBox dl dd .fileBox{ width: calc((100% - 10px) / 2);}
.contact .ctnBox dl dd .fileBox input{ display:none; }
.contact .ctnBox dl dd .fileBox label{ display:flex; align-items:center; height: 75px; cursor:pointer;}
.contact .ctnBox dl dd .fileBox label .txt{ width: 100%; height: 100%; background: #F8F8F8; border-radius:10px; border:1px solid #E5E5E5; margin-right: 10px; 
display:flex; align-items:center; padding: 0 30px;}
.contact .ctnBox dl dd .fileBox label button{ width: 205px; height: 100%; background: #333; color:#fff; border-radius:10px; font-weight: 600; flex-shrink:0; pointer-events:none; }
.contact .ctnBox dl dd .capBox{ display:flex; align-items:center; width: calc((100% - 10px) / 2); }
.contact .ctnBox dl dd .capBox .imgBox{ display:flex; align-items:center; flex-shrink:0; margin-right: 10px;}
.contact .ctnBox dl dd .capBox .imgBox figure{ width: 180px; height: 75px; position: relative; overflow: hidden; border-radius: 10px 0px 0px 10px; }
.contact .ctnBox dl dd .capBox .imgBox figure img{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; }
.contact .ctnBox dl dd .capBox .imgBox button{ height: 75px; width: 75px; border-radius: 0px 10px 10px 0px; background: #333;}
.contact .policyBox .txtBox{ text-align: center; } 
.contact .policyBox .txtBox input{ display:none; }
.contact .policyBox .txtBox label .txt{ color:#333; display:inline-flex; align-items:center; margin-bottom: 40px; cursor:pointer; }
.contact .policyBox .txtBox label .txt .circle{ position: relative; width: 25px; height: 25px; border-radius:50%; border:1px solid #E5E5E5; display:flex; align-items:center; justify-content:center; margin-right: 15px;}
.contact .policyBox .txtBox input[id="checkBox"]:checked + label .circle{ background: #333; border:1px solid #333; }
.contact .policyBox .txtBox input[id="checkBox"]:checked + label .circle svg path{ fill:#fff; }
.contact .policyBox .txtBox label .txt .line{ cursor:pointer; color:#007DC5; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.contact .policyBox .txtBox button{ width: 300px; height: 85px; color:#fff; font-weight: 700; background: var(--mainC); border-radius:50px; display:inline-block; }
.contact .policyBox .policyPop{ position: fixed; transform:translate(-50%,-50%); top: 50%; left: 50%; width:860px; border-radius:10px; background: #fff; padding: 60px 40px; z-index: 1002;
display:none; }
.contact .policyBox .policyPop .titleBox{ display:flex; align-items:center; justify-content:space-between; padding: 0 20px; padding-bottom: 30px; border-bottom:1px solid #000; 
margin-bottom: 30px; }
.contact .policyBox .policyPop .titleBox .title{ color:#111; font-weight: 500; }
.contact .policyBox .policyPop .inner{ max-height:400px; overflow-y: scroll; }
.contact .policyBox .policyPop .inner::-webkit-scrollbar{ background: #F8F8F8; width: 5px;}
.contact .policyBox .policyPop .inner::-webkit-scrollbar-thumb{ background: #ddd; border-radius:50px; }
.contact .policyBox .policyPop .inner .title{ color:#111; font-weight: 600; margin-bottom: 25px;}
.contact .policyBox .policyPop .inner .privacy{ font-size:16px; line-height: 1.7; color:#555; padding-right: 20px; }
.contact .policyBox .policyPop .inner .privacy *{ font-weight: 300;}
.contact .policyBox .policyPop .inner .privacy strong { font-weight: 700;}
.contact .policyBox .policyPop .inner .privacy > p+dl{ margin-top: 25px;}
.contact .policyBox .policyPop .inner .privacy dt{ color:#555; }
.contact .policyBox .policyPop .inner .privacy table tr *{ font-size:16px; }

#blog .tabBox{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom: 120px;}
#blog .tabBox li{ width: calc((100% - 30px) / 4); }
#blog .tabBox li a{ position: relative; display:flex; justify-content:center; align-items:center; width: 100%; height: 75px; border-radius: 20px; border: 2px solid #E5E5E5; font-weight: 600; font-family: var(--pre); color:#ccc; transition:all 0.3s;}
#blog .tabBox li a span{ position: relative;z-index: 2;}
#blog .tabBox li a:before{ content:''; display:block; position: absolute; top: -1px; left: -1px; width: calc(100% + 2px); height: calc(100% + 2px); background: var(--Gra);border-radius: 20px; opacity: 0;
transition:all 0.5s; } 
#blog .tabBox li.on a,
#blog .tabBox li:hover a{ color:#fff; }
#blog .tabBox li.on a:before,
#blog .tabBox li:hover a:before{ opacity: 1; }
#blog section:not(:last-child){ margin-bottom: 180px;}
#blog section h4.title{ color:#111; font-weight: 500; margin-bottom: 40px;}
#blog section .txtBox .day{ color:#fff;font-variant-numeric: lining-nums proportional-nums; font-family: Raleway; font-weight: 600; display:flex; align-items:center; }
#blog section .txtBox .day span{ display:inline-block; padding: 5px 25px; border-radius:50px; background: var(--mainC); color:#fff; font-weight: bold; margin-right: 20px;}
#blog section .txtBox .title{ text-overflow: ellipsis; overflow: hidden;  display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; word-break: break-word; color:#111; 
font-weight: 500; line-height: 1.5;}
#blog .recommend .ctnBox{ display:flex; }
#blog .recommend .ctnBox .itemBox{ position: relative; width: 100%; border-radius: 20px; overflow: hidden;}
#blog .recommend .ctnBox .itemBox:before{ content:''; display:block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.60) 100%); z-index: 1;}
#blog .recommend .ctnBox .itemBox .fitBox{ width: 100%; height: 100%; }
#blog .recommend .ctnBox .itemBox .txtBox{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 30px 40px; display:flex; flex-direction:column; justify-content:space-between;
z-index: 2;}
#blog .recommend .ctnBox .itemBox .txtBox .title{ -webkit-line-clamp: 1; color:#fff; line-height: 1.3;}
#blog .recommend .ctnBox .wrapBox{ width: 600px; flex-shrink:0; margin-left: 40px; }
#blog .recommend .ctnBox .wrapBox .itemBox:not(:last-child){ margin-bottom: 20px;}
#blog .recommend .ctnBox .wrapBox .itemBox .fitBox{ height: 230px; }
#blog .new .ctnBox{ display:flex; flex-wrap:wrap; gap:120px 50px; }
#blog .new .ctnBox .itemBox{ width: calc((100% - 100px) / 3); }
#blog .new .ctnBox .itemBox .fitBox{ width: 100%; height: 320px; border-radius:20px; margin-bottom: 30px;	}
#blog .new .ctnBox .itemBox .txtBox .day{ color:#ccc; margin-bottom: 20px;}

#mv{ position: relative; }
#mv #titleBox{ margin:150px 0 50px}
#mv .tabWrap{ position: absolute; transform: translate(-50%, 0); top: -120px; left: 50%; display:flex; justify-content:center; align-items:center; z-index: 100; transition:transform 0.7s, opacity 0.5s; }
#mv .tabWrap.fix{ position: fixed; top: 100px; }
#mv .tabWrap .tabBox{ display:inline-flex; justify-content:center; align-items:center; border: 2px solid #E5E5E5; background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(7.5px); padding: 10px; 
border-radius:50px; }
#mv .tabWrap .tabBox li button{ position: relative; padding: 10px 40px; border-radius:50px; height: 45px; font-family: var(--pre); font-weight: 600; color:#ccc; line-height: 1; transition:all 0.5s; }
#mv .tabWrap .tabBox li button:before{ content:''; display:block; width: 100%; height: 100%; background: var(--Gra); position: absolute; top: 0; left: 0; border-radius:50px; z-index: 0; opacity: 0; 
transition:all 0.5s; }
#mv .tabWrap .tabBox li button span{ position: relative; z-index: 2; white-space: nowrap; }
#mv .tabWrap .tabBox li.on button,
#mv .tabWrap .tabBox li:hover button{ color:#fff; }
#mv .tabWrap .tabBox li.on button:before,
#mv .tabWrap .tabBox li:hover button:before{ opacity: 1; }
/*#mv #mission{ position: relative; width: 100%; height: 100vh; clip-path: circle(10% at 50% 50%); filter: brightness(0.5);  }*/
/*#mv #mission .ctnBox{ position: relative; width: 100%; height: 100%; opacity: 1;}*/
/*#mv #mission .ctnBox .bg{ width: 100%; height: 100%; } */
/*#mv #mission .ctnBox .txtBox{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%;  text-align: center; font-family: var(--pre); color:#fff;  width: 100%; }*/
/*#mv #mission .ctnBox .txtBox .txt{ font-weight: bold; margin-bottom: 30px;}*/
/*#mv #mission .ctnBox2{ position: absolute; transform:translateX(-50%); top: 100%; left: 50%; }*/
#mv #mission{ display:flex; }
#mv #mission .ctnBox{ position: relative; width: 50%; height: 940px; overflow: hidden; clip-path: inset(0 100% 0 0); transition:all 1s; }
#mv #mission .ctnBox .bg{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; overflow: hidden;}
#mv #mission .ctnBox .bg:after{ content:''; position: absolute; top: 0; left: 0; display:block; width: 100%; height: 100%; background: rgba(0,0,0,0.4); transition:all 0.7s; opacity: 1; }
#mv #mission .ctnBox .bg img{ transition:all 1s; }
#mv #mission .ctnBox .txtBox{ text-align: center; font-family: var(--pre); color:#fff;  width: 100%; height: 100%; display:flex; justify-content:center; align-items:center; flex-direction:column; 
letter-spacing: -1.24px; }
#mv #mission .ctnBox .txtBox .txt{ padding: 10px 40px; display:flex; justify-content:center; align-items:center; border-radius: 100px; background: rgba(255, 255, 255, 0.10); margin-bottom: 30px;
letter-spacing: -0.4px; font-weight: 700; }
#mv #mission.aos-animate .ctnBox{ clip-path: inset(0 0 0 0);}
#mv #mission .ctnBox2{ margin-left: -1px;}

#mv #mission .ctnBox:hover .bg:after{ opacity: 0;}
#mv #mission .ctnBox:hover .bg img{ transform:translate(-50%,-50%) scale(1.1);}

#mv #history{ padding: 180px 0; background: #0C1A29;}
#mv #history .titleBox{ text-align: center; font-family: var(--pre); font-weight: 600; margin-bottom: 120px; color:#fff;  }
#mv #history .titleBox .sTxt{ color:var(--mainC); margin-bottom: 10px; }
#mv #history .bg{ position: relative; margin-bottom: 240px; width: 100%; height: 500px; background: url(/img/sub/mvHistoryBg.png) no-repeat 70% 50%; background-size:cover; }
/*#mv #history .bg .txtBox{ padding: 60px 40px; border-radius: 10px; background: linear-gradient(97deg, #008868 0%, #13483C 99.62%); position: absolute; left: 60px; bottom: -145px;}*/
/*#mv #history .bg .txtBox .title{ color:#fff; line-height: 1.4; font-weight: 200; margin-bottom: 20px;}*/
/*#mv #history .bg .txtBox .title span{ font-weight: 600; }*/
/*#mv #history .bg .txtBox .listBox{ display:flex; align-items:center; font-variant-numeric: lining-nums proportional-nums;}*/
/*#mv #history .bg .txtBox .listBox li:not(:last-child){ margin-right: 40px;}*/
/*#mv #history .bg .txtBox .listBox li a{ font-family: var(--pre); font-weight: bold; color:rgba(255,255,255,0.2); transition:all 0.5s; }*/
/*#mv #history .bg .txtBox .listBox li.on a,*/
/*#mv #history .bg .txtBox .listBox li:hover a{ color:#fff; }*/
#mv #history .wrapBox{ position: relative; }
#mv #history .wrapBox .yearBox{ position: relative; display:flex; }
#mv #history .wrapBox .yearBox:not(:first-child){ padding-top: 0; }
#mv #history .wrapBox .yearBox .yearTab{ position: relative; position: sticky; top: 120px; left: 0;  height: 150px; margin-top: -50px;}
#mv #history .wrapBox .yearBox .yearTab li{ position: absolute; top: 0; left: 0;}
#mv #history .wrapBox .yearBox .yearTab li button{ font-family: var(--pre); color: #fff; font-variant-numeric: lining-nums proportional-nums; font-weight: 800; font-size:150px; opacity: 0;}
#mv #history .wrapBox .yearBox .yearTab li.on button{ opacity: 1;}
#mv #history .wrapBox .yearBox .ctnBox{ max-width:980px; margin: 0 0 0 auto; width: 100%;}
#mv #history .wrapBox .yearBox .ctnBox .itemBox,
#mv #history .wrapBox .yearBox .ctnBox .itemBox > ul > li{ display:flex; }
#mv #history .wrapBox .yearBox .ctnBox .itemBox{ align-items:flex-start;}
#mv #history .wrapBox .yearBox .ctnBox .itemBox:not(:last-child){ padding-bottom: 200px;}
#mv #history .wrapBox .yearBox .ctnBox .itemBox .year,
#mv #history .wrapBox .yearBox .ctnBox .itemBox .month{ min-width:70px; color:#fff; font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums; font-weight: bold; }
#mv #history .wrapBox .yearBox .ctnBox .itemBox .year{ display:none; }
#mv #history .wrapBox .yearBox .ctnBox .itemBox .month{ min-width:100px; color:var(--mainC); margin-top: -20px; }
#mv #history .wrapBox .yearBox .ctnBox .itemBox > ul{ margin-top: 5px; font-weight: 300; color:rgba(255,255,255,0.7); }
#mv #history .wrapBox .yearBox .ctnBox .itemBox > ul li:not(:last-child){ margin-bottom: 80px; }
#mv #history .wrapBox .yearBox .ctnBox .itemBox figure{ margin-top: 20px;}
#mv #car{  padding: 180px 0 0; }
#mv #car .titleBox{ text-align: center; color:#111; font-family: var(--pre); font-weight: 600; margin-bottom: 80px;}
#mv #car .titleBox .sTxt{ margin-bottom: 10px; }
#mv #car .titleBox .title{ font-weight: 600;}
#mv #car .certi{ padding-bottom: 180px;}
#mv #car .certi .ctnBox{ display:flex; align-items:center; flex-wrap:wrap; gap:20px; }
#mv #car .certi .ctnBox .itemBox{ position: relative; width: calc((100% - 80px) / 5); height: 375px; position: relative; padding: 70px 30px 20px; border-radius: 20px; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; background: #F8F8F8;}
#mv #car .certi .ctnBox .itemBox .sTxt{ position: absolute; top: 0; left: 0; padding: 15px 30px; border-radius:20px 0; color:#fff; font-family: var(--pre); background: var(--mainC);
font-weight: 600;}
#mv #car .certi .ctnBox .itemBox .title{ color:#111; letter-spacing: -0.56px; line-height: 1.5; margin-bottom: 20px; font-weight: 500; }
#mv #car .certi .ctnBox .itemBox .txt{ color:#aaa; font-weight: 600; line-height: 1.5; font-weight: 600;}
#mv #car .certi .ctnBox .itemBox .dayBox{ display:flex; justify-content:space-between; align-items:flex-end; }
#mv #car .certi .ctnBox .itemBox .dayBox figure{ width: 110px; }
#mv #car .certi .ctnBox .itemBox .dayBox .day{ color:#aaa; font-variant-numeric: lining-nums proportional-nums; font-family: var(--pre); font-weight: 600; }
#mv #car .awards{ position: relative; overflow: hidden;}
#mv #car .awards .titleBox{ position: absolute; transform:translateX(-50%); top: 0; left: 50%;  }
#mv #car .awards .titleBox.fix{ position: fixed; top: 160px; }
#mv #car .awards .wrapBox { clear: both; overflow: hidden; margin-top: -190px; }
#mv #car .awards .horizontalCtn{ position: relative; width: 100vw; height: 100vh;}
#mv #car .awards .horizontalCtn .pinWrap{ position: absolute; top: 0; left: 0; height: 100vh; display: flex;  align-items: flex-end; white-space: nowrap; overflow: hidden; margin-right:5.7291666666666664%; padding-bottom: 9.2%;}
#mv #car .awards .horizontalCtn .pinWrap .section{ position: relative; min-width:780px; height: 385px; padding-right: 40px; overflow: hidden; }
#mv #car .awards .horizontalCtn .pinWrap .section.sec01{ margin-left: 3.2%;}
#mv #car .awards .horizontalCtn .pinWrap .section:not(.type2):before{ content:''; position: absolute; top: 6px; left: 0; width: 100%; height:2px; background: rgba(0,0,0,0.2); }
#mv #car .awards .horizontalCtn .pinWrap .section .year{ color:#111; font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums; margin-bottom: 20px; font-weight: 600;}
#mv #car .awards .horizontalCtn .pinWrap .section .year:before{ content:''; width: 6px; height: 6px; border-radius:50%; background: #0C1A29; border:4px solid #fff; display:block; 
margin-bottom: 30px;}
#mv #car .awards .horizontalCtn .pinWrap .section .ctnBox{ }
#mv #car .awards .horizontalCtn .pinWrap .section .ctnBox .itemBox{ display:flex; align-items:center; }
#mv #car .awards .horizontalCtn .pinWrap .section .ctnBox .itemBox:not(:last-child){ margin-bottom: 20px;}
#mv #car .awards .horizontalCtn .pinWrap .section .ctnBox .itemBox .day{ min-width:100px; font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums; font-weight: 600; 
color:rgba(0,0,0,0.7); }
#mv #car .awards .horizontalCtn .pinWrap .section .ctnBox .itemBox .imgBox{ display:flex; align-items:center; color:#111; font-weight: 500; line-height: 1.5;}
#mv #car .awards .horizontalCtn .pinWrap .section .ctnBox .itemBox .imgBox figure{ margin: 0 20px; flex-shrink:0; border-radius: 10px; border: 2px solid rgba(255, 255, 255, 0.05); background: #24303E; display:flex; justify-content:center; align-items:center; width: 250px; height: 70px }
#mv #car .patents{ background: #fff;}
#mv #car .patents .titleBox{ color:#111; }
#mv #car .patents .ctnBox{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px; }
#mv #car .patents .ctnBox .itemBox{ width: calc((100% - 20px) / 2); display:flex; align-items:center; padding: 40px; border-radius: 20px; border: 2px solid #E5E5E5;}
#mv #car .patents .ctnBox .itemBox figure{ margin-right: 40px; flex-shrink:0; ;}
#mv #car .patents .ctnBox .itemBox .txtBox .title{ color:#111; font-weight: 500; margin-bottom: 20px; line-height: 1.5; letter-spacing: -0.48px; white-space: break-spaces;}
#mv #car .patents .ctnBox .itemBox .txtBox .txt{ color:#ccc; font-weight: 600;}

#people h3.title{ margin-bottom: 40px; font-family: var(--pre); font-weight: bold; color:#111; }
#people .ctnBox{ display:flex; flex-wrap:wrap; }
#people .leader{ padding-bottom: 180px;}
#people .leader .ctnBox{ gap: 120px 50px; }
#people .leader .ctnBox .itemBox{ width: calc((100% - 100px) / 3);}
#people .leader .ctnBox .itemBox .img{ position: relative; border-radius:40px; overflow: hidden; margin-bottom: 40px;}
#people .leader .ctnBox .itemBox .img .logo{ position: absolute; transform:translateY(-50%); top: 50%; right: 40px;}
#people .leader .ctnBox .itemBox .txtBox .name{ color:#111; font-weight: 600; padding-bottom: 20px; border-bottom:1px solid #E5E5E5; margin-bottom: 20px;}
#people .leader .ctnBox .itemBox .txtBox .name span{ display:inline-block; color:var(--mainC); font-family: var(--pre); font-weight: 700; margin-left: 10px; }
#people .leader .ctnBox .itemBox .txtBox ul li{ color:#555;font-weight: 300; display:flex; }
#people .leader .ctnBox .itemBox .txtBox ul li:not(:last-child){ margin-bottom: 10px; }
#people .leader .ctnBox .itemBox .txtBox ul li:before{ content:''; display:block; margin-top: 9.5px; margin-right: 10px; flex-shrink:0; width: 4px; height: 4px; background: #ddd; border-radius:50%; }
#people .leader .ctnBox .itemBox:first-child{ width: 100%; display:flex; align-items:center; }
#people .leader .ctnBox .itemBox:first-child .img{ position: relative; margin-right: 100px; margin-bottom: 0; width: 675px; height: 520px; }
#people .leader .ctnBox .itemBox:first-child .img .person{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; width: 100%; height: 100%; }
#people .leader .ctnBox .itemBox:first-child .txtBox .name{ font-size:40px; }
#people .leader .ctnBox .itemBox:first-child .txtBox .name span{ font-size:28px; }
#people .leader .ctnBox .itemBox:first-child .txtBox ul li{ font-size:22px; }
#people .advisors{ padding: 180px 0; background: #0C1A29;}
#people .advisors h3.title{ color:#fff; }
#people .advisors .ctnBox{ gap: 20px;}
#people .advisors .ctnBox .itemBox{ position: relative; width: calc((100% - 60px) / 4); min-height:380px; border-radius: 20px; border: 2px solid rgba(255, 255, 255, 0.05); background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(0, 0, 0, 0.10) 100%); padding: 40px; display:flex; flex-direction:column; }
#people .advisors .ctnBox .itemBox .name{ color:#fff; font-weight: 500; margin-bottom: 30px;}
#people .advisors .ctnBox .itemBox .txtBox .txt{ color:rgba(255,255,255,0.6); font-weight: 500;}
#people .advisors .ctnBox .itemBox .txtBox ul{ margin-top: 10px;}
#people .advisors .ctnBox .itemBox .txtBox ul li{  color:rgba(255,255,255,0.5); display:flex; font-weight: 200; letter-spacing: -0.18px;}
#people .advisors .ctnBox .itemBox .txtBox ul li:not(:last-child){ margin-bottom: 10px; }
#people .advisors .ctnBox .itemBox .txtBox ul li:before{ content:''; display:block; margin-top: 9.5px; margin-right: 10px; flex-shrink:0; width: 4px; height: 4px; background: rgba(255,255,255,0.5); border-radius:50%;}
#people .advisors .ctnBox .itemBox .logo{ position: absolute; transform:translateY(-50%); top: 50%; right: 40px; }


/* COMMUNICATION - AITRICS Magazine */
.image-board{ display: flex; flex-wrap: wrap; margin-bottom: -60px; }
.image-board .item{ width: calc((100% - 120px) / 4); margin-right: 40px; margin-bottom: 60px; }
.image-board .item:nth-of-type(4n){ margin-right: 0; }
.image-board .item .img{ position: relative; }
.image-board .item .img i{ width: 100px; height: 100px; display: flex; flex-direction: column; justify-content: center; background: rgba(0, 0, 0, 0.75); border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); transition: all 0.5s; }
.image-board .item .img i::before{ content: ""; display: block; height: 24px; background: url("/img/sub/image_board_icon.svg") no-repeat center center / contain; }
.image-board .item figure{ display: block; border-radius: 20px; padding-bottom: 141.354%; position: relative; overflow: hidden; }
.image-board .item figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); transition: all 0.5s; }
.image-board .item h2{ font-weight: 500; color: #111; line-height: 1.5; margin-top: 20px; text-align: center; transition: all 0.5s; }

.image-board .item:hover .img i{ transform: translate(-50%, -50%) scale(1); }
.image-board .item:hover figure img{ transform: translate(-50%, -50%) scale(1.07); }
.image-board .item:hover h2{ color: var(--mainC); }