@import url('common.css'); 
@import url('sub.css'); 



/* AI/HPC Computing */
.product_top{width: calc(100% - 30px); height:100vh; border-radius:var(--borderR); overflow: hidden; position: relative; margin: 15px auto; background:#000;}
.product_top .radius{display: inline-block; z-index: 9; width: 20px; height: 20px; background:url('/img/radius.png') no-repeat center/100% auto; position: absolute;}
.product_top .radius1{left: -1px; top: -1px; transform:rotate(-90deg);}
.product_top .radius2{right: -1px; top: -1px;}
.product_top .radius3{left: -1px; bottom: 99px; transform:rotate(180deg);}
.product_top .radius4{right: -1px; bottom: 99px; transform:rotate(90deg);}
.product_top:after{content:''; display:block; width: calc(100% + 5px); height: 100px; background:url('/img/v_deco.png') no-repeat center/auto 100%; position: absolute; left: 50%; bottom: 0; transform:translateX(-50%); margin-left: -1px; z-index: 3;}
.product_top .bg{position: absolute; left: 0; top:0; width: 100%; height: 100%; background-repeat:no-repeat; background-position:center; background-size:cover; transform: scale(1); animation: m_vsImg 1.8s;}
.product_top .productTop_in{display: flex; align-items:center; height: 100vh; position: relative; z-index: 2;}
.product_top .productTop_in > div{box-sizing:border-box; width: 50%;} 
.product_top .productTop_in .imgArea{} 
.product_top .productTop_in .imgArea img{max-width:100%; width: 100%; background-repeat:no-repeat; background-size:auto 100%; background-position:center;} 
.product_top .productTop_in .txtArea{margin-top: -50px;} 
.product_top .productTop_in .txtArea h3{font-size:50px; font-weight: 500; font-family:var(--korFont); line-height: 120%; color:#fff;} 
.product_top .productTop_in .txtArea .num_list{padding:35px 0 0;}
.product_top .scr{display:inline-block; font-size:12px; font-weight:700; color:#fff; line-height:120%; position:absolute; left:50%; transform:translateX(-50%); bottom:72px; z-index:12; transition:all .3s linear;}
.product_top .scr:hover{opacity: 0.5;}
.product_top .scr span{display:block; margin: 16px auto 0; width: 20px;}
.product_top .scr svg{width: 100%; height: auto;}

.product_info{}
.product_info .conTit{padding:0 150px 0 0;}

.product_roll{width: calc(100% + 30px); margin: 0 -15px;}
.product_roll .roll{padding: 0 15px;}
.product_roll .roll a{display: block;}
.product_roll .roll dt{border-radius:var(--borderR20); overflow: hidden;}
.product_roll .roll dt img{width: 100%; background-repeat:no-repeat; background-position:center; background-size:cover; transition:all .3s linear;}
.product_roll .roll a:hover dt img{transform:scale(1.1);}
.product_roll .roll dd{padding: 20px 0 0;}

.product_roll .slick-arrow{padding:0; width:60px; height:60px; border-radius:50%; font-size:0; outline:none; cursor:pointer; border:1px solid var(--border); background:#fff; position:absolute; top:-105px; right:15px; display: inline-block; transition:all .3s linear;}
.product_roll .slick-arrow:hover{background:var(--main); border-color:var(--main);}
.product_roll .slick-arrow:after{font-weight:400; color:#BBBBBB; font-size:32px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-family: "Material Symbols Outlined"; transition:all .3s linear;}
.product_roll .slick-arrow:hover:after{color:#fff;}
.product_roll .slick-prev{margin-right: 70px;}
.product_roll .slick-prev:after{content:'\e5de';}
.product_roll .slick-next:after{content:'\e5df';}


/* 제품 서브탑 */
.product_top2{position:relative;}
.product_top2 .bg_box{width: calc(100% - 30px); height:800px; border-radius:var(--borderR20); overflow: hidden; position:absolute; left:50%; top:15px; transform:translateX(-50%);}
.product_top2 .bg{background-repeat:no-repeat; background-position:center; background-size:cover; width:100%; height:100%; position:absolute; left:0; top:0; transform: scale(1); animation: m_vsImg 1.8s;}
.product_top2 .txtArea{position: relative; z-index: 2; padding:220px 5% 80px; box-sizing:border-box; text-align:center;}
.product_top2 .txtArea h3{font-size:50px; font-weight:500; font-family:var(--korFont); color:#fff; line-height:120%; letter-spacing:0;}
.product_top2 .txtArea h3 .point{display:block; font-size:20px; font-weight:500; font-family:var(--korFont); color:var(--sub); line-height:120%; letter-spacing:0; padding:0 0 8px;}
.product_top2 .txtArea .aipub{width: 300px; margin: 0 auto;}
.product_top2 .txtArea .aipub img{width: 100%;}
.product_top2 .txtArea .txt{color:#fff; padding: 30px 0 0;}
.product_top2 .imgArea{position: relative; z-index: 2;}
.product_top2 .imgArea .monitor{position:relative; width: 700px; margin:0 auto;}
.product_top2 .imgArea .monitor iframe{width: 674px; height:394px; position: absolute; left:50%; transform:translateX(-50%); top:15px;}
.product_top2 .imgArea .monitor .monitor_img{width: 100%;}
.product_top2 .imgArea .monitor .img{width: 674px; height:394px; position: absolute; left:50%; transform:translateX(-50%); top:15px;}
.product_top2 .imgArea .monitor .img img{width: 100%;}




/* 이미지 롤링 */
.proStyle_wrap{overflow: hidden;}
.pro_style{display:flex; align-items:center;}
.pro_style > div{box-sizing:border-box;}
.pro_style .txtArea{padding: 0 50px 0 0; width: calc(100% - 675px);} 
.pro_style .imgArea{width:675px; height: 400px; overflow: hidden;}
.pro_style .imgArea .imgRoll{position: relative;}
/* .pro_style .imgArea .imgRoll .roll{width:415px; height:100%; position:absolute; display: flex; align-items:center; transition:all ease 0.7s; z-index:1; left:0;  right:0; margin:0 auto;}
.pro_style .imgArea .imgRoll .roll.active{z-index:2; width:490px;}
.pro_style .imgArea .imgRoll .roll img{border-radius:var(--borderR50); overflow: hidden; background-repeat:no-repeat; background-position:center; background-size:cover; width: 100%;}
 */
.pro_style .imgArea .imgRoll .swiper-container{position: absolute; left: 0; top:0; box-sizing:border-box;}
.pro_style .imgArea .imgRoll .swiper-wrapper{align-items: center;}
.pro_style .imgArea .imgRoll .roll{max-width:480px; opacity: 0;}
.pro_style .imgArea .imgRoll .roll.swiper-slide-prev,
.pro_style .imgArea .imgRoll .roll.swiper-slide-active,
.pro_style .imgArea .imgRoll .roll.swiper-slide-next{z-index:1 !important; opacity: 1;}
.pro_style .imgArea .imgRoll .roll.swiper-slide-prev,
.pro_style .imgArea .imgRoll .roll.swiper-slide-next{}
.pro_style .imgArea .imgRoll .roll.swiper-slide-active{z-index:2 !important;}
.pro_style .imgArea .imgRoll .roll img{border-radius:var(--borderR50); overflow: hidden; background-repeat:no-repeat; background-position:center; background-size:cover; width: 100%;}

.pro_style .imgArea .imgRoll .roll.swiper-slide-prev img,
.pro_style .imgArea .imgRoll .roll.swiper-slide-next img{transform:scale(0.8);}




.blueBox{background:var(--grayBg); border-radius:var(--borderR20); overflow:hidden; box-sizing:border-box;}


/* 탭메뉴 */
.sub_tab{}
.sub_tab ul{display: flex; justify-content: center; width: 100%; margin: 0 auto; padding:10px; border-radius:80px; background:var(--main); box-sizing:border-box;}
.sub_tab.three ul{max-width:800px;}
.sub_tab.two ul{max-width:540px;}
.sub_tab ul li{display:block; flex:1; height:60px; line-height:60px; text-align:center; border-radius:60px; font-size:1rem; font-weight:700; color:rgba(255,255,255,.5); transition:all .3s linear; cursor:pointer;}
.sub_tab ul li.focus{background:#fff !important; color:var(--main) !important;}
.sub_tab ul li:hover{color:#fff;}

.tab_box{display: none;}
.tab_box.focus{display: block;}



/* 하단 배너 */
.product_banner{position:relative; overflow:hidden;}
.product_banner .bg{position:absolute; left:0; top:0; width:100%; height:100%; }
.product_banner.action .bg{transform: scale(1); animation: m_vsImg 1.8s;}
.product_banner .basic_in{position: relative; z-index: 2; display: flex; align-items:center; justify-content:space-between; }
.product_banner .basic_in h3{color:#fff; padding:0 50px 0 0; width: calc(100% - 410px); box-sizing:border-box;}
.product_banner .basic_in .btnArea{display: flex;}
.product_banner .basic_in .btnArea .moreBtn{background:none; border-color:rgba(255,255,255,.2); margin:0 10px 0 0;}
.product_banner .basic_in .btnArea .moreBtn:last-child{margin:0;}
.product_banner .basic_in .btnArea .moreBtn:hover{border-color:var(--main);}
.product_banner .basic_in .btnArea .moreBtn font{color:#fff;}
.product_banner .basic_in .btnArea .moreBtn .icon{background:#fff; color:var(--main);}
.product_banner .basic_in .btnArea .moreBtn:after{background:#fff;}



/* 병렬파일시스템 */
.lustre_num{display:flex; flex-wrap:wrap;}
.lustre_num dl{margin: 0 30px 0 0; width:calc((100% - 60px)/3);}
.lustre_num dl:last-child{margin-right: 0;}
.lustre_num dl dt{position:relative;}
.lustre_num dl dt img{width:100%; border-radius:var(--borderR20); overflow:hidden;}
.lustre_num dl dd{padding:40px 0 0; text-align:center;}
.lustre_num dl dt .num{position: absolute; left: 50%; bottom: -17px; margin-left: -17px; z-index:1;}



/* EXA */
.exa_cont{}
.exa_cont .borderBox{display: flex;}
.exa_cont .borderBox .check_list{width:50%; box-sizing:border-box;}
.exa_cont .borderBox .check_list:first-child{padding: 0 40px 0 0;}
.exa_cont .borderBox .check_list:last-child{padding:0 0 0 40px; border-left:1px solid var(--border);}


/* Storage */
.storage_family{display: flex;}
.storage_family dl{margin: 0 30px 0 0; width: calc((100% - 60px)/3); overflow: hidden; box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR20);}
.storage_family dl:nth-child(3n){margin-right:0;}
.storage_family dl dt{}
.storage_family dl dt img{width: 100%;}
.storage_family dl dd{padding: 30px 40px 40px; box-sizing:border-box;}
.storage_family dl dd .fs22{text-align:center; margin:0 0 12px;}

.best_list{}
.best_list dl{display: flex; justify-content: space-between; margin: 0 0 100px;}
.best_list dl:last-child{margin: 0;}
.best_list dl:nth-child(even){flex-direction: row-reverse;}
.best_list dl dt,
.best_list dl dd{width: calc(50% - 30px);}
.best_list dl dt img{width: 100%; border-radius:var(--borderR20); overflow:hidden;}
.best_list dl dd{display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
.best_list dl dd .check_list{padding: 25px 0 0; margin: 25px 0 0; border-top: 1px solid var(--border); width: 100%;}


/* Insight */
.insight_process{}
.insight_process .blueBox{padding: 80px 90px; display: flex; justify-content: space-between; flex-wrap:wrap;}
.insight_process .blueBox img{width: calc(50% - 15px); border-radius:var(--borderR20); overflow: hidden; box-shadow: var(--shadow);}
.insight_process ul{display: flex; flex-wrap:wrap; justify-content: center; padding: 40px 0; border-bottom: 1px solid var(--border);}
.insight_process ul li{padding:10px 50px 10px 67px; position:relative;}
.insight_process ul li:last-child{padding-right: 0 !important;}
.insight_process ul li span{display: inline-block; width: 50px; height:50px; line-height:50px; text-align:center; border-radius:50%; background:var(--main); color:#fff; font-size:20px; font-weight:700; position:absolute; left:0; top:0;}

.basic_style{}
.basic_style article{display: flex; flex-wrap:wrap; padding: 60px 0; border-bottom:1px dashed var(--border);}
.basic_style article:last-child{border:0;}
.basic_style article > div{box-sizing:border-box;}
.basic_style article .titArea{width:340px; padding:0 50px 0 0;}
.basic_style article .contArea{width:calc(100% - 340px);}
.basic_style article.long .titArea{width: 100%; padding:0 0 20px;}
.basic_style article.long .contArea{width:100%;}

.icon_list{display: flex; flex-wrap:wrap;}
.icon_list li{box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR20); padding: 40px 30px; margin: 0 30px 30px 0; width: calc((100% - 90px)/4);}
.icon_list li:nth-child(4n){margin-right: 0;}
.icon_list li .icon{width:60px; margin:0 auto 40px;}
.icon_list li .icon img{width: 100%;}
.icon_list li .fs22{margin:0 0 10px;}




/* NVIDIA DGX POD™ */
.nvidia_top{padding:156px 80px; box-sizing:border-box; border-radius:var(--borderR20); overflow:hidden; background:url('/product/img/nvidia_Bg.jpg') no-repeat center/cover;}
.nvidia_top .subTit{color:#fff;}
.nvidia_top .txt{color:#fff;}

.nvidia_performance_list{display:flex; flex-wrap:wrap;}
.nvidia_performance_list dl{margin: 0 30px 0 0; width: calc((100% - 60px)/3);}
.nvidia_performance_list dl:nth-child(3n){margin-right: 0;}
.nvidia_performance_list dl dt{overflow: hidden; border-radius:var(--borderR20);}
.nvidia_performance_list dl dt img{width:100%;}
.nvidia_performance_list dl dd{text-align:center; padding:20px 0 0;}

.nvidia_superpod_box{box-sizing:border-box; background:#76B900; border-radius:20px; padding:40px; display: flex; flex-wrap:wrap; text-align:center;}
.nvidia_superpod_box .one,
.nvidia_superpod_box .box{background:rgba(255,255,255,.2); padding:28px; box-sizing:border-box; border-radius:10px; display: flex; justify-content: center;}
.nvidia_superpod_box .one{align-items:center;}
.nvidia_superpod_box .box{margin: 0 0 20px;}
.nvidia_superpod_box .box:last-child{margin: 0;}
.nvidia_superpod_box .box.last{display: flex; padding: 15px;}
.nvidia_superpod_box .box.last .fs19{background:rgba(255,255,255,.2); border-radius:5px; padding:12px; box-sizing:border-box; margin:0 15px 0 0; width:calc((100% - 30px)/3); display: flex; align-items: center; justify-content: center;}
.nvidia_superpod_box .box.last .fs19:last-child{margin:0;}
.nvidia_superpod_box .box.last .fs19 span{padding:0 34px 0 0; position:relative;}
.nvidia_superpod_box .box.last .fs19 span:after{content:''; display:block; width:1px; height:10px; background:rgba(255,255,255,.5); position:absolute; right:17px; top:50%; margin-top: -5px;}
.nvidia_superpod_box .box.last .fs19 span:last-child{padding:0;}
.nvidia_superpod_box .box.last .fs19 span:last-child:after{display: none;}
.nvidia_superpod_box .fs22,
.nvidia_superpod_box .fs19{color:#fff; margin: 0; line-height:150%;}
.nvidia_superpod_box dd.one{width: 300px; margin-right: 25px;}
.nvidia_superpod_box dd.two{width: calc(100% - 325px);}



/* DGX/HGX Platform */
.dgx_cont{overflow:hidden;}

.dgx_dia{position: relative; display: flex; flex-wrap:wrap; justify-content:space-between;}
.dgx_dia .dia{width:462px; z-index: 2; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.dgx_dia .dia img{width:100%;}
.dgx_dia .box{box-sizing:border-box; border:1px solid var(--border); border-radius:var(--border); width:calc(50% - 70px); min-height:270px; margin:0 0 157px; border-radius:var(--borderR20);}
.dgx_dia .box.box1,
.dgx_dia .box.box3{padding: 40px 80px 40px 40px;}
.dgx_dia .box.box2,
.dgx_dia .box.box4{text-align:right; padding: 40px 40px 40px 150px;}
.dgx_dia .box.box3,
.dgx_dia .box.box4{margin:0;}
.dgx_dia .box .icon{width: 50px; margin: 0 0 14px; display: inline-block;}
.dgx_dia .box .icon img{width: 100%;}


.dgx_h100_box{padding:60px 0; box-sizing:border-box; background:#000; border-radius:var(--borderR20); text-align:center; position: relative;}
.dgx_h100_box_in{position:relative; width: 850px; margin:0 auto;}
.dgx_h100_box img{width: 600px; margin:0 auto;}
.dgx_h100_box .box{text-align:left; display: flex; position: absolute;}
.dgx_h100_box .box.one{flex-direction: row-reverse; left:10px; top:170px;}
.dgx_h100_box .box.two{flex-direction: row-reverse; left:0; top:260px;}
.dgx_h100_box .box.three{left:480px; top:90px;}
.dgx_h100_box .box.four{left:510px; top:150px;}
.dgx_h100_box .box.five{left:330px; top:380px;}
.dgx_h100_box .box dt{}
.dgx_h100_box .box.one dt,
.dgx_h100_box .box.two dt{margin-left: 20px;}
.dgx_h100_box .box.three dt,
.dgx_h100_box .box.four dt,
.dgx_h100_box .box.five dt{margin-right: 20px;}
.dgx_h100_box .box dt .num_btn{display: block; width: 35px; height: 35px; line-height: 35px; text-align:center; border-radius:50%; background:var(--main); color:#fff; font-size:16px; font-weight: 700; cursor:pointer;}
.dgx_h100_box .box dd{position: relative; padding:30px; border-radius:10px; width:100%; max-width:320px; background:rgba(255,255,255,.9); box-sizing:border-box; opacity: 0; visibility:hidden; z-index: 2;}
.dgx_h100_box .box.show dd{opacity: 1; visibility:visible;}
.dgx_h100_box .box dd .fs22{margin:0 0 5px;}
.dgx_h100_box .box dd .close{font-weight: 400; font-size:24px; color:var(--black); position: absolute; right: 20px; top:20px; cursor:pointer;}


/* AI Pub */
.pub_cont .aipub_logo{height: 51px;}
.pub_cont .aipub_logo img{width: auto; height:100%;}
.pub_cont{}
.pub_cont .blueBox{padding: 60px;}


/* Data analytics */
.analytics_vertica{}
.analytics_vertica ul{display:flex; flex-wrap:wrap; padding:60px 0;}
.analytics_vertica ul li{width:33.33%; box-sizing:border-box; text-align:center; padding:0 20px; border-right: 1px solid var(--border);}
.analytics_vertica ul li:last-child{border:0;}
.analytics_vertica ul li img{max-width:100%;}
.analytics_vertica ul li .fs22{margin: 30px 0 10px;}

.analytics_technical{}
.analytics_technical ul{display:flex; flex-wrap:wrap;}
.analytics_technical ul li{box-sizing:border-box; border-radius:var(--borderR20); border:1px solid var(--border); margin:0 30px 30px 0; padding: 65px 65px 65px 150px; position: relative; width:calc((100% - 30px)/2);}
.analytics_technical ul li:nth-child(2n){margin-right:0;}
.analytics_technical ul li img{width:60px; position: absolute; left: 44px; top:50%; margin-top: -30px;}
.analytics_technical ul li .fs22{margin:0 0 10px;}

.analytics_scalability{}
.analytics_scalability ul{display:flex; justify-content:space-between;}
.analytics_scalability ul li{width:calc(50% - 50px); text-align:center;}
.analytics_scalability ul li img{max-width:100%;}



/* AI 이상징후 탐지시스템 */
.alops_feature{}
.alops_feature dl{display:flex; flex-wrap:wrap; justify-content:space-between;}
.alops_feature dl dt{width:calc(50% - 15px); }
.alops_feature dl dt img{width: 100%;}
.alops_feature dl dd{width:calc(50% - 15px); box-sizing:border-box; padding: 0 0 0 20px; display:flex; justify-content: center; flex-direction: column;}
.alops_feature dl dd ul{display:flex; flex-wrap:wrap;}
.alops_feature dl dd ul li{margin: 0 25px 0 0; width:calc((100% - 25px)/2);}
.alops_feature dl dd ul li:last-child{margin:0;}
.alops_feature dl dd ul li img{width: 100%;}

.alopsOccupation_list{}
.alopsOccupation_list article{margin: 0 0 80px;}
.alopsOccupation_list article:last-child{margin: 0;}
.alopsOccupation_list article .titArea{background:var(--main); padding:20px; position: relative; box-sizing:border-box; border-radius:var(--borderR20); text-align:center; margin:0 0 34px;}
.alopsOccupation_list article .titArea:after{content:''; display:block; width:50px; height:20px; background:url('/product/img/alopsOccupation_arrow.svg') no-repeat center/100% auto; position: absolute; left:50%; margin-left: -25px; bottom: -14px;}
.alopsOccupation_list article .titArea .fs26{color:#fff; margin: 0; line-height:100%;}
.alopsOccupation_list article .vs_cont{display:flex; flex-wrap:wrap; justify-content:space-between;}
.alopsOccupation_list article .vs_cont dl{width: calc(50% - 15px); padding:40px; box-sizing:border-box; background:#fff; border-radius:var(--borderR20); box-shadow:var(--shadow); position: relative;}
.alopsOccupation_list article .vs_cont dl.grayBg{box-shadow:none;}
.alopsOccupation_list article .vs_cont dl:after{content:'vs'; display:block; width:80px; height:80px; line-height:80px; text-align:center; color:#fff; font-family:var(--korFont); font-size:26px; font-weight:700; border-radius:50%; background:var(--sub); position:absolute; top:50%; margin-top:-40px; right:-55px; z-index: 2;}
.alopsOccupation_list article .vs_cont dl:last-child:after{display: none;}
.alopsOccupation_list article .vs_cont dl dt{border-radius:var(--borderR10); overflow:hidden;}
.alopsOccupation_list article .vs_cont dl dt img{width: 100%;}
.alopsOccupation_list article .vs_cont dl dd{padding: 30px 0 0;}
.alopsOccupation_list article .vs_cont dl dd .tit{color:var(--black); font-weight:600;}
.alopsOccupation_list article .vs_cont dl dd .event_line{width:100%; height:30px; border-radius:30px; overflow:hidden; position:relative; background:rgba(34,34,34,.1);}
.alopsOccupation_list article .vs_cont dl dd .event_line:before{content:''; display:block; width:0; height:100%; position:absolute; left:0; top:0; border-radius:30px;}
.alopsOccupation_list article .vs_cont dl dd .event_line1:before{background:var(--blue);}
.alopsOccupation_list article .vs_cont dl dd .event_line2:before{background:var(--black);}
.alopsOccupation_list article .vs_cont dl dd .event_line span{display:block; font-weight: 600; font-size:15px; height: 30px; line-height: 30px; border-radius:30px; text-align:left; color:#fff;  box-sizing:border-box; padding:0 24px; position:relative; z-index:2;}

.alopsOccupation_list article .vs_cont.aos-animate dl dd .event_line1:before{animation:event_line1 1s 2s linear forwards;}
.alopsOccupation_list article .vs_cont.aos-animate dl dd .event_line2:before{animation:event_line2 0.5s 2s linear forwards;}

@keyframes event_line1 {
  0% {width:0;}
  100% {width:100%;}
}
@keyframes event_line2 {
  0% {width:0;}
  100% {width:80px;}
}





/* AI Ops - 기대효과 */
.alopsEff_list{}
.alopsEff_list dl{display:flex; flex-wrap:wrap; justify-content:space-between;}
.alopsEff_list dl dt{width:calc(50% - 15px); height:430px; border-radius:var(--borderR20); overflow:hidden; box-shadow: var(--shadow);}
.alopsEff_list dl dt img{width:100%;}
.alopsEff_list dl dt.aos-animate img{animation: img_slide linear 15s infinite;}
.alopsEff_list dl dd{width:calc(50% - 15px); box-sizing:border-box; padding: 0 0 0 20px; display:flex; justify-content: center; flex-direction: column;}

@keyframes img_slide {
  0% {transform: translateY(0);}
  5% {transform: translateY(0);}
  50% {transform: translateY(-35%);}
  100% {transform: translateY(0);}
}


/* Quantum Computer */
.computer_info{}
.computer_info dl{display:flex; flex-wrap:wrap; margin:0 0 20px;}
.computer_info dl:last-child{margin:0;}
.computer_info dl dt{width:300px; margin:0 20px 0 0; background:var(--main); box-sizing:border-box; border-radius:var(--borderR20); padding:22px 35px;  text-align:center; display:flex; align-items:center; justify-content: center; position:relative; z-index:2;}
.computer_info dl dt .fs26{color:#fff; margin:0; line-height:120%;}
.computer_info dl dd{width: calc(100% - 320px); padding:22px 35px; box-sizing:border-box; background:#fff; box-shadow:var(--shadow); border-radius:var(--borderR20);}

.computer_principle_list{display:flex; flex-wrap:wrap;}
.computer_principle_list dl{margin:0 30px 0 0; width:calc((100% - 30px)/2); background:#fff;border-radius:var(--borderR20); box-shadow:var(--shadow); overflow: hidden;}
.computer_principle_list dl:last-child{margin:0;}
.computer_principle_list dl dt{padding:17px 20px 14px; background:#777777; text-align:center; box-sizing:border-box;}
.computer_principle_list dl:last-child dt{background:var(--main);}
.computer_principle_list dl dt .fs26{color:#fff; margin:0; line-height:120%;}
.computer_principle_list dl dd{text-align:center;}
.computer_principle_list dl dd .txt{padding:30px; box-sizing:border-box;}
.computer_principle_list dl dd img{max-width:100%;}

.computer_change{}
.computer_change .computerChange_list{display:flex;}
.computer_change .computerChange_list dl{margin: 0 80px 0 0; width: calc((100% - 490px)/2);}
.computer_change .computerChange_list dl.first{width:330px;}
.computer_change .computerChange_list dl:last-child{margin: 0;}
.computer_change .computerChange_list dl dt{height:60px; margin: 0 0 10px; border-radius:var(--borderR20); text-align:center; background:#777; display:flex; align-items:center; justify-content:center;}
.computer_change .computerChange_list dl.first dt{background:none;}
.computer_change .computerChange_list dl.last dt{background:var(--main);}
.computer_change .computerChange_list dl dt .fs20{color:#fff; margin:0; line-height:1.2;}
.computer_change .computerChange_list dl dd{background:rgba(119,119,119,.1); height:482px;  border-radius:var(--borderR20);}
.computer_change .computerChange_list dl.first dd,
.computer_change .computerChange_list dl.last dd{background:var(--grayBg);}
.computer_change .computerChange_list dl dd ul{display:flex; flex-direction: column; padding:20px; box-sizing:border-box; }
.computer_change .computerChange_list dl dd ul li{background:#fff; height: 134px; border-radius:5px; margin:0 0 20px; box-sizing:border-box; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align:center; padding: 0 20px; position:relative;}
.computer_change .computerChange_list dl dd ul li:last-child{margin:0;}
.computer_change .computerChange_list dl dd ul li .cate_tit{margin: 0 0 8px; background:var(--main); color:#fff;}
.computer_change .computerChange_list dl dd ul li:after{content:''; display:block; width:37px; height:20px; background:url('/product/img/computer_arrow.svg') no-repeat center/100% auto; position:absolute; right:-78px; top:50%; margin-top:-10px;}
.computer_change .computerChange_list dl.last dd ul li:after{display:none;}
.computer_change .computerChange_list dl dd ul li .txt { font-size:0.9rem; line-height:1.4; }
.computer_change .computerChange_list dl.first dd ul li{padding:0 0 0 130px; position: relative;  align-items: flex-start;}
.computer_change .computerChange_list dl.first dd ul li h4 { text-align:left !important; }
.computer_change .computerChange_list dl.first dd ul li img{width:100px; position:absolute; left:20px; top:20px;}


.photo_basic{display:flex; flex-wrap:wrap;}
.photo_basic dl{background:#fff; border-radius:var(--borderR20); overflow:hidden; margin:0 30px 30px 0; width:calc((100% - 60px)/3);}
.photo_basic dl:nth-child(3n){margin-right:0;}
.photo_basic dl dt{}
.photo_basic dl dt img{width:100%;}
.photo_basic dl dd{padding:30px; box-sizing:border-box;}





/**** 양자내성암호(PQC) ****/
.pqc_cont{overflow:hidden;}

/* 양자 위협에 대응하는 차세대 암호 기술 */
.pqc_technology{box-sizing:border-box; overflow:hidden; border:1px solid var(--border); border-radius:var(--borderR20);}
.pqc_technology .contArea{padding:60px; box-sizing:border-box;}
.pqc_technology .pqc_technology_box{width:798px; height:397px; border-left:1px solid var(--black); border-bottom:1px solid var(--black); margin:0 auto; position:relative;}
.pqc_technology .pqc_technology_box:before{content:''; display:block; width:15px; height:15px; background:url('/product/img/pqc_arrow2.svg') no-repeat center/100%; transform:rotate(-90deg); position:absolute; left:-7px; top:-5px;}
.pqc_technology .pqc_technology_box:after{content:''; display:block; width:15px; height:15px; background:url('/product/img/pqc_arrow2.svg') no-repeat center/100%;  position:absolute; right:-5px; bottom:-7px;}
.pqc_technology .pqc_technology_box .pqc_img{border-radius:var(--borderR20); overflow:hidden; width:200px; position: absolute; left:60px; top:40px;}
.pqc_technology .pqc_technology_box .pqc_img img{width:100%;}
.pqc_technology .pqc_technology_box h4{position: absolute; left: 470px; top:190px; font-size:20px; font-weight:700; color:var(--black); line-height:130%; letter-spacing:0;}
.pqc_technology .pqc_technology_box .bar{width:800px; height:50px; position:absolute; left:0;}
.pqc_technology .pqc_technology_box .bar1{top:270px;}
.pqc_technology .pqc_technology_box .bar2{top:325px;}
.pqc_technology .pqc_technology_box .bar .fs22{color:#fff; margin:0; line-height:120%; position:relative; z-index: 5;}
.pqc_technology .pqc_technology_box .bar .line{position:absolute; left:0; top:0; text-align:center; width: 100%; height:100%; display:flex; align-items:center; justify-content: center;}
.pqc_technology .pqc_technology_box .bar .line.x{left:50%; width:50%;}
.pqc_technology .pqc_technology_box .bar .line.y{width:50%;}
.pqc_technology .pqc_technology_box .bar .line.z{width:calc(100% - 200px);}
.pqc_technology .pqc_technology_box .bar .line:before{content:''; width:0; height:100%; position:absolute; left:0; top:0; display:block;}
.pqc_technology .pqc_technology_box .bar .line.y:before{background:var(--main);}
.pqc_technology .pqc_technology_box .bar .line.x:before{background:var(--blue);}
.pqc_technology .pqc_technology_box .bar .line.z:before{background:var(--sub);}
.pqc_technology .pqc_technology_box .bar .key{position:absolute; right:0; top:0; width:200px; height: 100%; font-size:1rem; font-weight:700; color:var(--black); line-height:120%; letter-spacing:0; padding:25px 0 0; box-sizing:border-box; opacity: 0;}
.pqc_technology .pqc_technology_box .bar .key:before{content:''; width:100%; height:100%; display:block; position:absolute; left:0; top:0; background:url('/product/img/pqc_stroke.svg') no-repeat center top/192px auto;}
.pqc_technology .pqc_technology_box .bar .key:after{content:''; width:40px; height:27px; display:block; position:absolute; left:50%; top:2px; margin-left:-20px; background:url('/product/img/pqc_arrow.svg') no-repeat center/100% auto;}

.img_pic.aos-animate .pqc_technology .pqc_technology_box .bar .line.y:before{animation:widthEff 1s 1s linear forwards;}
.img_pic.aos-animate .pqc_technology .pqc_technology_box .bar .line.x:before{animation:widthEff 1s 2s linear forwards;}
.img_pic.aos-animate .pqc_technology .pqc_technology_box .bar .line.z:before{animation:widthEff 1s 3s linear forwards;}
.img_pic.aos-animate .pqc_technology .pqc_technology_box .bar .key{animation:opacityEff 0.3s 4s linear forwards;}

@keyframes widthEff {
	from { width:0; }
	to { width:100%; }
}

@keyframes opacityEff {
	from { opacity: 0; transform:translateY(20px);}
	to { opacity: 1; transform:translateY(0px);}
}

.pqc_technology .txtArea{background:var(--grayBg); padding:35px 35px 25px; display: flex; flex-wrap:wrap; box-sizing:border-box;}
.pqc_technology .txtArea dl{display:flex; align-items:center; padding:0 0 10px;}
.pqc_technology .txtArea dl dt{font-size:15px; font-weight:700; text-align:center; border-radius:30px; line-height:30px; height:30px; box-sizing:border-box; color:#fff; width:120px; box-sizing:border-box; white-space: nowrap;}
.pqc_technology .txtArea dl:nth-child(1) dt{background:var(--blue);}
.pqc_technology .txtArea dl:nth-child(2) dt{background:var(--main); width:140px;}
.pqc_technology .txtArea dl:nth-child(3) dt{background:var(--sub);}
.pqc_technology .txtArea dl dd{font-size:1rem; letter-spacing:0; line-height:150%; padding:0 20px 0 10px;}
.pqc_technology .txtArea dl:last-child dd{padding-right:0;}


/* 양자내성 보안 체계 구축 */
.pqc_security_list{display:flex; flex-wrap:wrap;}
.pqc_security_list dl{border-radius:var(--borderR20); background:#fff; overflow:hidden; margin:0 30px 0 0; width:calc((100% - 30px)/2);}
.pqc_security_list dl:last-child{margin:0;}
.pqc_security_list dl dt{text-align:center; padding:16px; box-sizing:border-box; background:var(--main); }
.pqc_security_list dl dt .fs22{color:#fff; margin: 0; line-height: 120%;}
.pqc_security_list dl dd{}
.pqc_security_list dl dd img{width:100%;}

/* 양자내성 전자서명 알고리즘 */
.pqc_algorithm{}
.pqc_algorithm ul{display:flex;}
.pqc_algorithm ul li{width:33.33%; padding:0 20px; box-sizing:border-box;}
.pqc_algorithm ul li .box{margin:0 0 26px;}
.pqc_algorithm ul li .box dl{width: 300px; height:300px; margin:0 auto; position:relative; display: flex; flex-direction: column; align-items:center; justify-content: center;}
.pqc_algorithm ul li .box dl:before{content:''; display:block; width:264px; height:264px; border-radius:50%; background:#fff; box-shadow:var(--shadow); position:absolute; left:50%; top:50%; margin-left: -132px; margin-top:-132px;}
.pqc_algorithm ul li .box dl:after{content:''; display:block; width:100%; height:100%; border-radius:50%; background:url('/product/img/pqc_line.svg') no-repeat center/100% auto; position:absolute; left:50%; top:50%; margin-left: -150px; margin-top:-150px; animation:rotate 5s linear infinite;}
.pqc_algorithm ul li:nth-child(1) .box dl:after{}
.pqc_algorithm ul li:nth-child(2) .box dl:after{background:url('/product/img/pqc_line3.svg') no-repeat center/100% auto;}
.pqc_algorithm ul li:nth-child(3) .box dl:after{background:url('/product/img/pqc_line2.svg') no-repeat center/100% auto;}
.pqc_algorithm ul li .box dl dt{width:100px; height:100px; position:relative; z-index:2;}
.pqc_algorithm ul li .box dl dt img{width:100%;}
.pqc_algorithm ul li .box dl dd{ position:relative; z-index:2; text-align: center; box-sizing: border-box; padding: 0 30px;}
.pqc_algorithm ul li .dot_list{max-width:380px;}


@keyframes rotate {
	0{ transform:rotate(0); }
	100% { transform:rotate(360deg); }
}

/* IoT 보안을 위한 양자내성암호 PKI 인증 솔루션 */
.pqc_solution{}
.pqc_solution ul{display: flex; flex-wrap:wrap;}
.pqc_solution ul li{background:#fff; border-radius:var(--borderR20); position:relative; box-shadow:var(--shadow); padding:50px 40px 40px; box-sizing:border-box; text-align:center; margin:0 30px 0 0; width: calc((100% - 60px)/3);}
.pqc_solution ul li:last-child{margin-right:0;}
.pqc_solution ul li .num{position: absolute; left: 50%; top: -17px; margin-left: -17px; z-index:1;}




/*******************************************************************************
    @media 1460px
*******************************************************************************/
@media all and (max-width:1460px){


/* 이미지 롤링 */
.pro_style .txtArea{padding: 0 50px 0 0; width: calc(100% - 580px);} 
.pro_style .imgArea{width:580px;}
/* .pro_style .imgArea .imgRoll .roll{width:320px;}
.pro_style .imgArea .imgRoll .roll.active{width:400px;}
 */
.pro_style .imgArea .imgRoll .roll{max-width:430px;}
.pro_style .imgArea .imgRoll .roll.swiper-slide-prev img, .pro_style .imgArea .imgRoll .roll.swiper-slide-next img{transform:scale(0.9);}


/* NVIDIA DGX POD™ */
.nvidia_superpod_box .box.last .fs19{flex-wrap:wrap;}
.nvidia_superpod_box .box.last .fs19 span{padding:0 0 10px; width: 100%;}
.nvidia_superpod_box .box.last .fs19 span:after{height:1px; width: 10px; margin-right: -5px; right:50%; margin-top: 0; top:auto; bottom: 5px;}


}

/*******************************************************************************
    @media ~1280px
*******************************************************************************/
@media all and (max-width:1280px){


/* 이미지 롤링 */
.pro_style .txtArea{padding: 0 30px 0 0; width: calc(100% - 500px);} 
.pro_style .imgArea{width:500px;}
/* .pro_style .imgArea .imgRoll{width:500px; height:280px;}
.pro_style .imgArea .imgRoll .roll{width:240px;}
.pro_style .imgArea .imgRoll .roll.active{width:350px;} */

.pro_style .imgArea .imgRoll .roll{max-width:400px;}



/* Insight */
.insight_process{}
.insight_process .blueBox{padding: 60px 70px;}
.insight_process .blueBox img{width: calc(50% - 15px);}
.insight_process ul li{padding:10px 30px 10px 55px;}
.insight_process ul li span{width: 40px; height:40px; line-height:40px; font-size:18px;}

.icon_list{}
.icon_list li{padding: 30px 20px;}


/* DGX/HGX Platform */
.dgx_dia{}
.dgx_dia .dia{width:380px;}
.dgx_dia .box{padding:40px;}
.dgx_dia .box.box1,
.dgx_dia .box.box3{padding: 40px 80px 40px 40px;}
.dgx_dia .box.box2,
.dgx_dia .box.box4{padding: 40px 40px 40px 80px;}


/* AI Ops - 기대효과 */
.alopsEff_list{}
.alopsEff_list dl{}
.alopsEff_list dl dt{height:300px;}


/* Quantum Computer */
.computer_change{}
.computer_change .computerChange_list{}
.computer_change .computerChange_list dl{margin: 0 50px 0 0; width: calc((100% - 400px)/2);}
.computer_change .computerChange_list dl.first{width:300px;}
.computer_change .computerChange_list dl dt .fs26{font-size:20px;}
.computer_change .computerChange_list dl dd{height:562px;}
.computer_change .computerChange_list dl dd ul li{height: 160px;}
.computer_change .computerChange_list dl dd ul li .cate_tit{margin: 0 0 8px;}
.computer_change .computerChange_list dl dd ul li:after{right:-63px;}
.computer_change .computerChange_list dl dd ul li .fs26{font-size:20px;}
.computer_change .computerChange_list dl.first dd ul li{padding:0 0 0 120px;}
.computer_change .computerChange_list dl.first dd ul li img{width:80px; top:50%; margin-top: -40px;}



/**** 양자내성암호(PQC) ****/



/* 양자내성 전자서명 알고리즘 */
.pqc_algorithm{}
.pqc_algorithm ul li .box dl{width: 250px; height:250px;}
.pqc_algorithm ul li .box dl:before{width:220px; height:220px; margin-left: -110px; margin-top:-110px;}
.pqc_algorithm ul li .box dl:after{margin-left: -125px; margin-top:-125px;}
.pqc_algorithm ul li .box dl dt{width:80px; height:80px;}



}

/*******************************************************************************
    @media  ~980px                body,html{font-size:14px; }     3%
*******************************************************************************/
@media all and (max-width:980px){

/* AI/HPC Computing */
.product_top{width: calc(100% - 20px); margin: 10px auto;}
.product_top .radius{width: 20px; height: 20px;}
.product_top .radius3{bottom: 79px;}
.product_top .radius4{bottom: 79px;}
.product_top:after{height: 80px;}
.product_top .productTop_in{}
.product_top .productTop_in > div{}  
.product_top .productTop_in .txtArea{margin-top: -50px;} 
.product_top .productTop_in .txtArea h3{font-size:35px;} 
.product_top .productTop_in .txtArea .num_list{padding:25px 0 0;}
.product_top .scr{font-size:11px; bottom:62px;}
.product_top .scr span{margin: 10px auto 0; width: 15px;}

.product_info{}
.product_info .conTit{padding:0 120px 0 0;}

.product_roll{width: calc(100% + 20px); margin: 0 -10px;}
.product_roll .roll{padding: 0 10px;}
.product_roll .roll dd{padding: 15px 0 0;}

.product_roll .slick-arrow{width:50px; height:50px; top:-85px; right:10px;}
.product_roll .slick-arrow:after{font-size:24px;}
.product_roll .slick-prev{margin-right: 55px;}



/* 제품 서브탑 */
.product_top2 .bg_box{width: calc(100% - 20px); height:500px; top:10px;}
.product_top2 .txtArea{padding:160px 5% 40px;}
.product_top2 .txtArea h3{font-size:35px;}
.product_top2 .txtArea h3 .point{font-size:16px; padding:0 0 6px;}
.product_top2 .txtArea .aipub{width:250px;}
.product_top2 .txtArea .txt{padding: 20px 0 0;}
.product_top2 .imgArea{}
.product_top2 .imgArea .monitor{width: 500px;}
.product_top2 .imgArea .monitor iframe{width: 477px; height:279px; top:10px;}
.product_top2 .imgArea .monitor .img{width: 477px; height:279px; top:10px;}



/* 탭메뉴 */
.sub_tab{}
.sub_tab ul{padding:5px;}
.sub_tab ul li{height:50px; line-height:50px;}



/* 병렬파일시스템 */
.lustre_num{}
.lustre_num dl{margin: 0 20px 0 0; width:calc((100% - 40px)/3);}
.lustre_num dl:last-child{margin-right: 0;}
.lustre_num dl dt .num{bottom: -15px; margin-left: -15px;}
.lustre_num dl dd{padding:30px 0 0;}


/* 이미지 롤링 */
.pro_style{flex-wrap:wrap;}
.pro_style .txtArea{padding: 0 0 30px; width: 100%;} 
.pro_style .imgArea{width:100%; height:400px;}
.pro_style .imgArea .imgRoll .roll{max-width:490px;}
.pro_style .imgArea .imgRoll .roll.swiper-slide-prev img, .pro_style .imgArea .imgRoll .roll.swiper-slide-next img{transform:scale(0.8);}

/* 하단 배너 */
.product_banner .basic_in h3{padding:0 30px 0 0; width: calc(100% - 365px);}
.product_banner .basic_in .btnArea{}
.product_banner .basic_in .btnArea .moreBtn{margin:0 5px 0 0;}




/* EXA */
.exa_cont{}
.exa_cont .borderBox .check_list:first-child{padding: 0 30px 0 0;}
.exa_cont .borderBox .check_list:last-child{padding:0 0 0 30px;}


/* Storage */
.storage_family{}
.storage_family dl{margin: 0 20px 0 0; width: calc((100% - 40px)/3);}
.storage_family dl:nth-child(3n){margin-right:0;}
.storage_family dl dd{padding: 20px 30px 30px;}
.storage_family dl dd .fs22{margin:0 0 8px;}

.best_list{}
.best_list dl{margin: 0 0 80px;}
.best_list dl dt,
.best_list dl dd{width: calc(50% - 20px);}
.best_list dl dd .check_list{padding: 15px 0 0; margin: 15px 0 0;}



/* Insight */
.insight_process{}
.insight_process .blueBox{padding: 30px 40px;}
.insight_process .blueBox img{width: calc(50% - 10px);}
.insight_process ul{padding: 20px 0;}
.insight_process ul li{padding:5px 20px 10px 38px;}
.insight_process ul li span{width: 30px; height:30px; line-height:30px; font-size:16px;}

.basic_style{}
.basic_style article{padding: 40px 0;}
.basic_style article .titArea{width:250px; padding:0 30px 0 0;}
.basic_style article .contArea{width:calc(100% - 250px);}
.basic_style article.long .titArea{padding:0 0 15px;}

.icon_list{}
.icon_list li{margin: 0 20px 20px 0; width: calc((100% - 20px)/2);}
.icon_list li:nth-child(4n){margin-right: 20px;}
.icon_list li:nth-child(2n){margin-right: 0;}
.icon_list li .icon{width:50px; margin:0 auto 30px;}
.icon_list li .fs22{margin:0 0 8px;}



/* NVIDIA DGX POD™ */
.nvidia_top{padding:120px 40px;}

.nvidia_performance_list{}
.nvidia_performance_list dl{margin: 0 20px 0 0; width: calc((100% - 40px)/3);}
.nvidia_performance_list dl:nth-child(3n){margin-right: 0;}
.nvidia_performance_list dl dd{padding:20px 0 0;}

.nvidia_superpod_box{padding:20px;}
.nvidia_superpod_box .one,
.nvidia_superpod_box .box{padding:20px;}
.nvidia_superpod_box .box{margin: 0 0 10px;}
.nvidia_superpod_box .box.last{padding: 10px;}
.nvidia_superpod_box .box.last .fs19{padding:12px; margin:0 10px 0 0; width:calc((100% - 20px)/3);}
.nvidia_superpod_box dd.one{width: 200px; margin-right: 10px;}
.nvidia_superpod_box dd.two{width: calc(100% - 210px);}



/* DGX/HGX Platform */
.dgx_dia{}
.dgx_dia .dia{width:300px;}
.dgx_dia .box{width:calc(50% - 50px); margin:0 0 100px;}
.dgx_dia .box.box1,
.dgx_dia .box.box3{padding: 30px 60px 30px 30px;}
.dgx_dia .box.box2,
.dgx_dia .box.box4{padding: 30px 30px 30px 60px;}
.dgx_dia .box .icon{width: 40px;}

.pic_wrap{position: relative; overflow-x:auto;}
.pic_wrap .dgx_h100_box{width:920px;}
.pic_wrap .responsive-dim{display:block;}


.dgx_h100_box{padding:40px 0;}
.dgx_h100_box_in{width: 660px;}
.dgx_h100_box img{width: 400px;}
.dgx_h100_box .box.one{left:10px; top:110px;}
.dgx_h100_box .box.two{left:0; top:160px;}
.dgx_h100_box .box.three{left:365px; top:60px;}
.dgx_h100_box .box.four{left:390px; top:100px;}
.dgx_h100_box .box.five{left:260px; top:250px;}
.dgx_h100_box .box dt{}
.dgx_h100_box .box.one dt,
.dgx_h100_box .box.two dt{margin-left: 20px;}
.dgx_h100_box .box.three dt,
.dgx_h100_box .box.four dt,
.dgx_h100_box .box.five dt{margin-right: 20px;}
.dgx_h100_box .box dt .num_btn{width: 26px; height: 26px; line-height: 26px; font-size:13px;}
.dgx_h100_box .box dd{padding:15px 25px 15px 15px; max-width:200px;}
.dgx_h100_box .box dd .fs22{font-size:16px;}
.dgx_h100_box .box dd .close{font-size:20px; right: 10px; top:10px;}



/* AI Pub DEV */
.pub_cont .aipub_logo{height: 41px;}
.pub_cont{}
.pub_cont .blueBox{padding: 30px;}





/* Data analytics */
.analytics_vertica{}
.analytics_vertica ul{padding:30px 0;}
.analytics_vertica ul li{width:33.33%; padding:0 20px;}
.analytics_vertica ul li .fs22{margin: 20px 0 6px;}

.analytics_technical{}
.analytics_technical ul{}
.analytics_technical ul li{margin:0 20px 20px 0; padding: 40px 40px 40px 100px; width:calc((100% - 20px)/2);}
.analytics_technical ul li:nth-child(2n){margin-right:0;}
.analytics_technical ul li img{width:50px; left: 30px; top:50%; margin-top: -25px;}
.analytics_technical ul li .fs22{margin:0 0 8px;}

.analytics_scalability{}
.analytics_scalability ul{}
.analytics_scalability ul li{width:calc(50% - 20px);}



/* AI 이상징후 탐지시스템 */
.alops_feature{}
.alops_feature dl{}
.alops_feature dl dt{width:calc(50% - 10px);}
.alops_feature dl dd{width:calc(50% - 10px); padding: 0 0 0 10px;}
.alops_feature dl dd ul li{margin: 0 10px 0 0; width:calc((100% - 10px)/2);}

.alopsOccupation_list{}
.alopsOccupation_list article{margin: 0 0 60px;}
.alopsOccupation_list article .titArea{padding:15px; margin:0 0 24px;}
.alopsOccupation_list article .titArea:after{width:30px; height:12px; margin-left: -20px; bottom: -11px;}
.alopsOccupation_list article .vs_cont{}
.alopsOccupation_list article .vs_cont dl{width: calc(50% - 10px); padding:20px;}
.alopsOccupation_list article .vs_cont dl:after{width:60px; height:60px; line-height:60px; font-size:20px; margin-top:-30px; right:-40px;}
.alopsOccupation_list article .vs_cont dl dd{padding: 20px 0 0;}
.alopsOccupation_list article .vs_cont dl dd .event_line{height:24px;}
.alopsOccupation_list article .vs_cont dl dd .event_line span{font-size:13px; height: 24px; line-height: 24px; padding:0 15px;}


@keyframes event_line2 {
  0% {width:0;}
  100% {width:60px;}
}

/* AI Ops - 기대효과 */
.alopsEff_list{}
.alopsEff_list dl{}
.alopsEff_list dl dt{width:calc(50% - 10px); height:220px;}
.alopsEff_list dl dd{width:calc(50% - 10px); padding: 0 0 0 10px;}



/* Quantum Computer */
.computer_info{}
.computer_info dl{margin:0 0 10px;}
.computer_info dl dt{width:250px; margin:0 10px 0 0; padding:15px 20px;}
.computer_info dl dd{width: calc(100% - 270px); padding:15px 20px;}

.computer_principle_list{}
.computer_principle_list dl{margin:0 20px 0 0; width:calc((100% - 20px)/2);}
.computer_principle_list dl dt{padding:12px 20px 10px;}
.computer_principle_list dl dd .txt{padding:20px;}


.computer_change{}
.computer_change .computerChange_list dl{margin: 0 30px 0 0; width: calc((100% - 310px)/2);}
.computer_change .computerChange_list dl.first{width:250px;}
.computer_change .computerChange_list dl dt{height:50px; margin: 0 0 5px;}
.computer_change .computerChange_list dl dt .fs22{line-height:50px; font-size:16px;}
.computer_change .computerChange_list dl dd{height:432px;}
.computer_change .computerChange_list dl dd ul{padding:10px;}
.computer_change .computerChange_list dl dd ul li{height: 130px; margin:0 0 10px; padding: 0 5px;}
.computer_change .computerChange_list dl dd ul li .cate_tit{margin: 0 0 6px;}
.computer_change .computerChange_list dl dd ul li:after{width:25px; height:11px; right:-37px; margin-top:-5px;}
.computer_change .computerChange_list dl dd ul li .fs26{font-size:16px;}
.computer_change .computerChange_list dl.first dd ul li{padding:0 0 0 100px;}
.computer_change .computerChange_list dl.first dd ul li img{width:70px; left:15px; top:50%; margin-top: -35px;}


.photo_basic{}
.photo_basic dl{margin:0 20px 20px 0; width:calc((100% - 40px)/3);}
.photo_basic dl:nth-child(3n){margin-right:0;}
.photo_basic dl dd{padding:20px;}



/**** 양자내성암호(PQC) ****/

/* 양자 위협에 대응하는 차세대 암호 기술 */
.pqc_technology{}
.pqc_technology .contArea{padding:30px 20px;}
.pqc_technology .pqc_technology_box{width:600px; height:300px;}
.pqc_technology .pqc_technology_box .pqc_img{width:150px; left:30px; top:20px;}
.pqc_technology .pqc_technology_box h4{left: 210px; top:130px; font-size:16px;}
.pqc_technology .pqc_technology_box .bar{width:400px; height:40px;}
.pqc_technology .pqc_technology_box .bar1{top:190px;}
.pqc_technology .pqc_technology_box .bar2{top:235px;}
.pqc_technology .pqc_technology_box .bar .line.z{width:calc(100% - 150px);}
.pqc_technology .pqc_technology_box .bar .key{width:150px; padding:25px 0 0;}
.pqc_technology .pqc_technology_box .bar .key:before{background-size:140px auto;}
.pqc_technology .pqc_technology_box .bar .key:after{width:30px; height:20px; top:2px; margin-left:-15px;}

.pqc_technology .txtArea{padding:20px; display:block;}
.pqc_technology .txtArea dl{padding:0 0 10px;}
.pqc_technology .txtArea dl:last-child{padding:0;}
.pqc_technology .txtArea dl dt{font-size:13px; line-height:25px; height:25px; width:130px;}
.pqc_technology .txtArea dl:nth-child(2) dt{width:130px;}
.pqc_technology .txtArea dl dd{padding:0 0 0 10px;}


/* 양자내성 보안 체계 구축 */
.pqc_security_list{}
.pqc_security_list dl{margin:0 20px 0 0; width:calc((100% - 20px)/2);}
.pqc_security_list dl dt{padding:12px;}

/* 양자내성 전자서명 알고리즘 */
.pqc_algorithm{}
.pqc_algorithm ul{}
.pqc_algorithm ul li{padding:0 10px;}
.pqc_algorithm ul li .box{margin:0 0 20px;}
.pqc_algorithm ul li .box dl{width: 180px; height:180px;}
.pqc_algorithm ul li .box dl:before{width:160px; height:160px; margin-left: -80px; margin-top:-80px;}
.pqc_algorithm ul li .box dl:after{margin-left: -90px; margin-top:-90px;}
.pqc_algorithm ul li .box dl dt{width:60px; height:60px;}

/* IoT 보안을 위한 양자내성암호 PKI 인증 솔루션 */
.pqc_solution{}
.pqc_solution .imgBox{}
.pqc_solution .imgBox img{max-width:70%;}
.pqc_solution ul{}
.pqc_solution ul li{padding:30px 20px 20px; margin:0 20px 0 0; width: calc((100% - 40px)/3);}
.pqc_solution ul li .num{top:-13px;}





}

/*******************************************************************************
    @media 768px
*******************************************************************************/
@media all and (max-width:768px){

/* Quantum Computer */
.computer_change{}
.computer_change .computerChange_list{width:850px;}
.computer_change .computerChange_list dl dd{height:342px;}
.computer_change .computerChange_list dl dd ul li{height: 100px;}


/**** 양자내성암호(PQC) ****/

/* 양자 위협에 대응하는 차세대 암호 기술 */
.pqc_technology{width:780px;}


}

/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){


/* AI/HPC Computing */
.product_top{height: calc(var(--vh, 1vh) * 100) !important;}
.product_top .radius{width: 15px; height: 15px;}
.product_top .radius3{bottom: 59px;}
.product_top .radius4{bottom: 59px;}
.product_top:after{height: 60px;}
.product_top .productTop_in{display: block; height: calc(var(--vh, 1vh) * 100) !important;}
.product_top .productTop_in > div{width: 100%;}  
.product_top .productTop_in .txtArea{margin-top: 0; padding: 100px 0 20px;} 
.product_top .productTop_in .txtArea h3{font-size:26px;} 
.product_top .productTop_in .txtArea .num_list{padding:15px 0 0;}
.product_top .productTop_in .imgArea{width: 80%; margin: 0 auto;}
.product_top .scr{bottom:42px;}

.product_info{}
.product_info .conTit{padding:0 100px 0 0;}

.product_roll{width: calc(100% + 16px); margin: 0 -8px;}
.product_roll .roll{padding: 0 8px;}

.product_roll .slick-arrow{width:40px; height:40px; top:-65px; right:8px;}
.product_roll .slick-arrow:after{font-size:20px;}
.product_roll .slick-prev{margin-right: 45px;}


/* 제품 서브탑 */
.product_top2 .bg_box{height:350px;}
.product_top2 .txtArea{padding:120px 5% 30px;}
.product_top2 .txtArea h3{font-size:26px;}
.product_top2 .txtArea h3 .point{font-size:14px;}
.product_top2 .txtArea .aipub{width:200px;}
.product_top2 .txtArea .txt{padding: 10px 0 0;}
.product_top2 .imgArea{}
.product_top2 .imgArea .monitor{width: 280px;}
.product_top2 .imgArea .monitor iframe{width: 267px; height:156px; top:5px;}
.product_top2 .imgArea .monitor .img{width: 267px; height:156px; top:5px;}

/* 탭메뉴 */
.sub_tab{}
.sub_tab ul li{height:40px; line-height:40px;}



/* 이미지 롤링 */
/* .pro_style .imgArea .imgRoll{width:460px; height:240px;}
.pro_style .imgArea .imgRoll .roll{width:200px;}
.pro_style .imgArea .imgRoll .roll.active{width:300px;}
 */
.pro_style .imgArea{height: 340px;}
.pro_style .imgArea .imgRoll .roll{max-width:420px;}



/* 하단 배너 */
.product_banner .basic_in{flex-wrap:wrap;}
.product_banner .basic_in h3{padding:0 0 20px; width:100%;}
.product_banner .basic_in .btnArea{}
.product_banner .basic_in .btnArea .moreBtn{margin:0 5px 0 0; width: 140px;}



/* 병렬파일시스템 */
.lustre_num{}
.lustre_num dl{margin: 0 20px 20px 0; width:calc((100% - 20px)/2);}
.lustre_num dl:nth-child(2n){margin-right: 0;}
.lustre_num dl:last-child{margin-right: 0;}
.lustre_num dl dt .num{bottom: -13px; margin-left: -13px;}
.lustre_num dl dd{padding:20px 0 0;}




/* EXA */
.exa_cont{}
.exa_cont .borderBox{flex-wrap:wrap;}
.exa_cont .borderBox .check_list{width:100%;}
.exa_cont .borderBox .check_list:first-child{padding: 0 0 20px;}
.exa_cont .borderBox .check_list:last-child{padding:20px 0 0; border-left:0; border-top:1px solid var(--border);}


/* Storage */
.storage_family{flex-wrap:wrap;}
.storage_family dl{margin: 0 0 10px; width: 100%;}
.storage_family dl:last-child{margin:0;}
.storage_family dl dd{padding: 15px 20px 20px;}

.best_list{}
.best_list dl{margin: 0 0 40px; flex-wrap:wrap;}
.best_list dl dt,
.best_list dl dd{width: 100%; padding: 20px 0 0;}
.best_list dl dd .check_list{padding: 10px 0 0; margin: 10px 0 0;}



/* Insight */
.insight_process{}
.insight_process .blueBox{padding: 20px;}
.insight_process .blueBox img{width:100%; margin: 0 0 10px;}
.insight_process .blueBox img:last-child{margin:0;}
.insight_process ul{padding: 15px 0; display: block;}
.insight_process ul li{padding:2px 0 8px 30px;}
.insight_process ul li span{width: 25px; height:25px; line-height:25px; font-size:14px;}

.basic_style{}
.basic_style article{padding: 30px 0;}
.basic_style article .titArea{width:100%; padding:0 0 12px;}
.basic_style article .contArea{width:100%;}
.basic_style article.long .titArea{padding:0 0 12px;}

.icon_list{}
.icon_list li{padding: 20px; margin: 0 10px 10px 0; width: calc((100% - 10px)/2);}
.icon_list li:nth-child(4n){margin-right: 10px;}
.icon_list li:nth-child(2n){margin-right: 0;}
.icon_list li .icon{width:40px; margin:0 auto 20px;}
.icon_list li .fs22{margin:0 0 6px;}



/* NVIDIA DGX POD™ */
.nvidia_top{padding:80px 100px 80px 30px;}
.nvidia_top .subTit br{display: none;}
.nvidia_top .txt br{display: none;}

.nvidia_performance_list{}
.nvidia_performance_list dl{margin: 0 0 20px; width:100%;}
.nvidia_performance_list dl:last-child{margin: 0;}
.nvidia_performance_list dl dd{padding:15px 0 0;}

.nvidia_superpod_box{border-radius:10px; padding:10px;}
.nvidia_superpod_box .one,
.nvidia_superpod_box .box{padding:15px;}
.nvidia_superpod_box .box{margin: 0 0 5px;}
.nvidia_superpod_box .box.last{padding: 8px;}
.nvidia_superpod_box .box.last .fs19{padding:8px; margin:0 5px 0 0; width:calc((100% - 10px)/3);}
.nvidia_superpod_box .box.last .fs19 span{padding:0 0 8px;}
.nvidia_superpod_box .box.last .fs19 span:after{bottom: 4px;}
.nvidia_superpod_box dd.one{width: 100%; margin:0 0 5px;}
.nvidia_superpod_box dd.one br{display: none;}
.nvidia_superpod_box dd.two{width: 100%;}



/* DGX/HGX Platform */
.dgx_dia{}
.dgx_dia .dia{width:220px; margin: 0 auto 20px; position:relative; left:auto; top:auto; transform:translate(0);}
.dgx_dia .box{width:100%; min-height:auto; margin:0 0 10px !important;}
.dgx_dia .box.box4{margin:0 !important;}
.dgx_dia .box.box1,
.dgx_dia .box.box3{padding: 20px;}
.dgx_dia .box.box2,
.dgx_dia .box.box4{padding: 20px; text-align:left;}
.dgx_dia .box .icon{width: 35px; margin: 0 0 12px;}


/* AI Pub DEV */
.pub_cont .aipub_logo{height: 31px;}
.pub_cont{}
.pub_cont .blueBox{padding: 15px;}

/* Data analytics */
.analytics_vertica{}
.analytics_vertica ul{padding:20px; flex-wrap:wrap;}
.analytics_vertica ul li{width:100%; padding:0 0 15px; margin:0 0 15px; border:0; border-bottom:1px solid var(--border);}
.analytics_vertica ul li:last-child{padding:0; margin:0;}
.analytics_vertica ul li .fs22{margin: 10px 0 6px;}
.analytics_vertica ul li img{max-width:70%;}

.analytics_technical{}
.analytics_technical ul{}
.analytics_technical ul li{margin:0 0 10px; padding: 20px 20px 20px 80px; width:100%;}
.analytics_technical ul li:last-child{margin:0;}
.analytics_technical ul li img{width:40px; left: 20px; margin-top: -20px;}
.analytics_technical ul li .fs22{margin:0 0 6px;}

.analytics_scalability{}
.analytics_scalability ul{flex-wrap:wrap; padding:20px !important;}
.analytics_scalability ul li{width:100%; padding:0 0 10px;}
.analytics_scalability ul li img{max-width:70%;}
.analytics_scalability ul li:last-child{padding:0;}


/* AI 이상징후 탐지시스템 */
.alops_feature{}
.alops_feature dl{}
.alops_feature dl dt{width:100%;}
.alops_feature dl dd{width:100%; padding: 20px 0 0;}

.alopsOccupation_list{}
.alopsOccupation_list article{margin: 0 0 40px;}
.alopsOccupation_list article .titArea{padding:12px; margin:0 0 20px;}
.alopsOccupation_list article .titArea:after{width:20px; height:8px; margin-left: -15px; bottom: -6px;}
.alopsOccupation_list article .vs_cont{}
.alopsOccupation_list article .vs_cont dl{width:100%; padding:15px; margin:0 0 20px;}
.alopsOccupation_list article .vs_cont dl:after{width:40px; height:40px; line-height:40px; font-size:16px; margin-top:0; right:auto; top:auto; bottom: -30px; left: 50%; margin-left: -20px;}
.alopsOccupation_list article .vs_cont dl:last-child{margin:0;}
.alopsOccupation_list article .vs_cont dl dd{padding: 15px 0 0;}


/* AI Ops - 기대효과 */
.alopsEff_list{}
.alopsEff_list dl{}
.alopsEff_list dl dt{width:100%; height:220px;}
.alopsEff_list dl dd{width:100%; padding:15px 0 0;}




/* Quantum Computer */
.computer_info{}
.computer_info dl dt{width:100%; margin:0 0 5px; padding:12px 15px;}
.computer_info dl dd{width:100%; padding:12px 15px;}

.computer_change .computerChange_list{width:820px;}
.computer_principle_list dl{margin:0 0 20px; width:100%;}
.computer_principle_list dl dt{padding:10px 15px 8px;}
.computer_principle_list dl dd .txt{padding:15px;}

.photo_basic{}
.photo_basic dl{margin:0 20px 20px 0; width:calc((100% - 20px)/2);}
.photo_basic dl:nth-child(3n){margin-right:20px;}
.photo_basic dl:nth-child(2n){margin-right:0;}
.photo_basic dl dd{padding:15px;}




/* 양자내성 보안 체계 구축 */
.pqc_security_list{}
.pqc_security_list dl{margin:0 0 20px; width:100%;}
.pqc_security_list dl dt{padding:10px;}

/* 양자내성 전자서명 알고리즘 */
.pqc_algorithm{}
.pqc_algorithm ul{flex-wrap:wrap;}
.pqc_algorithm ul li{width:100%; padding:0 10px; margin:0 0 20px;}
.pqc_algorithm ul li:last-child{margin:0;}
.pqc_algorithm ul li .box{margin:0 0 20px;}
.pqc_algorithm ul li .box dl{width: 180px; height:180px;}
.pqc_algorithm ul li .box dl:before{width:160px; height:160px; margin-left: -80px; margin-top:-80px;}
.pqc_algorithm ul li .box dl:after{margin-left: -90px; margin-top:-90px;}
.pqc_algorithm ul li .box dl dt{width:60px; height:60px;}
.pqc_algorithm ul li .dot_list{max-width:300px; margin:0 auto;}

/* IoT 보안을 위한 양자내성암호 PKI 인증 솔루션 */
.pqc_solution{}
.pqc_solution ul{}
.pqc_solution ul li{padding:20px 20px 15px; margin:0 0 20px; width:100%;}


}
/*******************************************************************************
    @media ~480px                body,html{font-size:13px; }
*******************************************************************************/
@media all and (max-width:480px){


/* 병렬파일시스템 */
.lustre_num{}
.lustre_num dl{margin: 0 0 20px; width:100%;}
.lustre_num dl:nth-child(2n){margin-right: 0;}
.lustre_num dl:last-child{margin-bottom: 0;}


/* Insight */
.icon_list{}
.icon_list li{margin: 0 0 10px; width:100%;}
.icon_list li:nth-child(4n){margin-right: 0;}


/* AI 이상징후 탐지시스템 */
.alops_feature{}
.alops_feature dl dd ul li{margin: 0 0 10px; width:100%;}

/* Quantum Computer */
.photo_basic{}
.photo_basic dl{margin:0 0 20px; width:100%;}
.photo_basic dl:nth-child(3n){margin-right:0;}
.photo_basic dl:nth-child(2n){margin-right:0;}



}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:360px){




}






