#container{padding: 0;}
#wib_Header{background: transparent;}
#wib_Header .hearder_inner .logo_box a:last-child{display: block;}
#wib_Header .hearder_inner .logo_box a:first-child{display: none;}
#wib_Header .hearder_inner .cate_box>ul>li>a{color: #fff;}

/*메인비쥬얼*/
#mcon01{position: relative;}
#mcon01 .slider-banner-1164687915,#mcon01 .slider-banner-1164687915 img{width: 100% !important;height:auto !important}
#mcon01 .slider-banner-1164687915 .slick-arrow{background: none !important;width: 106px;transition: all 0.3s;}
#mcon01 .slider-banner-1164687915 .slick-arrow:after{content:"";display:inline-block;background: rgba(255,255,255,0.6);width: 50px;height: 2px;transition: all 0.3s;position: absolute;}
#mcon01 .slider-banner-1164687915 .slick-prev{left:5.2vw}
#mcon01 .slider-banner-1164687915 .slick-prev::after{left: 0;}
#mcon01 .slider-banner-1164687915 .slick-prev::before{content: "PREV";display: inline-block;font-size: 15px;color:#fff;position: absolute;right:0;}
#mcon01 .slider-banner-1164687915 .slick-arrow:hover{width: 130px;}
#mcon01 .slider-banner-1164687915 .slick-arrow:hover:after{width:85px ;}
#mcon01 .slider-banner-1164687915 .slick-next{right:5.2vw}
#mcon01 .slider-banner-1164687915 .slick-next::after{transform: rotate(180deg);right: 0;}
#mcon01 .slider-banner-1164687915 .slick-next::before{content: "NEXT";display: inline-block;font-size: 15px;color:#fff;position: absolute;left:0;}
#mcon01 .circle{position: absolute; width: 0px; height: 0px; border-radius: 50%; background-color:rgba(255,255,255,0.4); transition: all 0.5s;pointer-events: none;}
#mcon01 .circle.zum{width: 100px;height: 100px;}
#mcon01 .slider-banner-1164687915 .slick-dots{height: 20px;}
#mcon01 .slider-banner-1164687915 .slick-dots li{margin: 0 10px;}
#mcon01 .slider-banner-1164687915 .slick-dots li button{width: 10px;height:10px;background: rgba(255,255,255,0.5);position: relative;}
#mcon01 .slider-banner-1164687915 .slick-dots li.slick-active{margin: 0 15px;}
#mcon01 .slider-banner-1164687915 .slick-dots li.slick-active button{background: #fff;}
#mcon01 .slider-banner-1164687915 .slick-dots li::before{content: "";display: block;position: absolute;top:50%;left: 50%;transform: translate(-50%,-50%);width:0px;height: 0px;background: rgba(255,255,255,0.5);border-radius: 50%;transition: width 0.5s, height 0.5s;}
#mcon01 .slider-banner-1164687915 .slick-dots li.slick-active::before{width:20px;height: 20px;}

/*타이틀*/
.tit{font-size:40px;line-height: 40px;color: #000;font-weight: 500;text-align: center;}
.sub_txt{font-size:18px;line-height: 28px;color: #555;font-weight: 300;text-align: center;margin-top: 25px;}
.more_view{color:#000;font-weight: 500;display: block;background: transparent;border:1px solid #000;color: #000;text-align: center;position: relative;transition: 1s ease-in-out;outline: none;;}
.more_view svg { position: absolute; left: 0; top: 0; fill: none; stroke: #FFE100; stroke-dasharray: 150 480; stroke-dashoffset: 150; transition: 1s ease-in-out; opacity: 1;}
.more_view:hover{transition: 1s ease-in-out; background: #fff;}
.more_view:hover svg { stroke-dashoffset: -480;opacity: 1;}

/*사업분야*/
#mcon02{background: #FAFAFA;padding: 120px 0;position: relative;}
#mcon02 .mcon02_ban{position: absolute;top: 69px;right: 40px;z-index: 99;}
#mcon02 .mcon02_ban.fixed{top:96px;position: fixed;right: 40px;}
#mcon02 .slide_wrap{margin-top: 50px;}
#mcon02 .slide_wrap ul li{transition: all 0.5s;opacity: 0.6;transform: scale(0.85);}
#mcon02 .slide_wrap ul li .img_box img{width: 100%;}
#mcon02 .slide_wrap ul li .img_box a{display: block;}
#mcon02 .slide_wrap ul li .img_box{position: relative;font-size: 0;}
#mcon02 .slide_wrap ul li .img_box::after{content: "";display: block;position: absolute;width: 100%;height: 100%;background: #ababab;opacity: 0.5;top: 0;pointer-events: none;transition: all 0.5s;}
#mcon02 .slide_wrap ul li.swiper-slide-active{transform: scale(1);opacity: 1;transition: all 1s;}
#mcon02 .slide_wrap ul li.swiper-slide-active .img_box::after{opacity: 0;}
#mcon02 .slide_wrap ul li .txt_box{margin-top: 30px;opacity: 0;transform:translateX(200px);transition: all 1s;}
#mcon02 .slide_wrap ul li.swiper-slide-active .txt_box{opacity: 1;transform:translateX(0)}
#mcon02 .slide_wrap ul li .txt_box .txt1{font-size: 32px;color: #000;font-weight: 500;}
#mcon02 .slide_wrap ul li .txt_box .txt2{font-size: 18px;line-height: 28px;color: #555;margin-top: 18px;}
#mcon02 .slide_wrap ul li .txt_box .txt3{font-size: 17px;color:#7FC4DE;font-weight: 400;margin-top: 20px;}
#mcon02 .slide_wrap ul li .txt_box .txt3 span{margin-right: 25px;}
#mcon02 .slide_wrap ul li .txt_box a{font-size:18px;width:180px ;line-height: 55px;margin-top: 27px;}
#mcon02 .slide_wrap .btn_box{width: 62.5vw;position: absolute;margin: 0 auto;pointer-events: none;top: 30%;left: 50%;transform:
translateX(-50%);z-index: 80;height: 77px;}
#mcon02 .slide_wrap .btn_box div{width: 45px;height: 77px;;top: 0;margin: 0;pointer-events:visible}
#mcon02 .slide_wrap .btn_box div.swiper-button-next{background: url('../img/icon/s_next.svg')no-repeat center;right: 30px;;}
#mcon02 .slide_wrap .btn_box div.swiper-button-prev{background: url('../img/icon/s_prev.svg')no-repeat center;left: 30px;}
#mcon02 .slide_wrap .btn_box::after{content: "";display: block;position: absolute;width: calc(100% - 160px);left: 50%;transform: translateX(-50%);height: 77px;top: 0;}

/*제품 및 소프트웨어 개발*/
#mcon03{width: 1200px;margin: 0px auto 0;padding-top: 130px;}
#mcon03 .con{padding-top: 90px;}
#mcon03 .con .con_tit{font-size: 26px;color:#000;font-weight: 500;margin-bottom: 15px;}
#mcon03 .con .con_txt{font-size: 17px;color:#555;line-height: 27px;font-weight: 300;}
#mcon03 .con01 .imgBox{font-size: 0;margin: 35px 0 0 0; }
#mcon03 .con01 .imgBox img,
#mcon03 .con01 .txtBox > div{display: inline-block;width: calc(33.33% - 20px);margin-right: 20px;}
#mcon03 .con02 .imgBox{font-size: 0;margin: 35px 0 0 0; }
#mcon03 .con02 .imgBox img,
#mcon03 .con02 .txtBox > div{display: inline-block;width: calc(33.33% - 20px);margin-right: 20px;}
#mcon03 .con .imgBox a:last-child,
#mcon03 .con .txtBox > div:last-child{margin-right: 0;}
#mcon03 .con .imgBox a img{width: 100%;}
#mcon03 .con .txtBox{font-size: 0;margin-top: 30px;}
#mcon03 .con .txtBox > div{text-align: center;}
#mcon03 .con .txtBox > div .txt1{font-size: 20px;color:#000;font-weight: 400;margin-bottom: 10px;}
#mcon03 .con .txtBox > div .txt2{font-size: 17px;color:#555;font-weight: 400;line-height: 27px;}
#mcon03 .con03 .imgBox{font-size: 0;margin: 35px 0 0 0; }
#mcon03 .con03 .imgBox a,
#mcon03 .con03 .txtBox > div{display: inline-block;width: calc(50% - 15px);margin-right: 20px;}
#mcon03 .more_view{width: 241px;line-height: 60px;font-size: 18px;margin: 90px auto 0;}
#mcon03 .more_view svg { stroke-dasharray: 210 600; stroke-dashoffset: 210;}
#mcon03 .more_view:hover svg { stroke-dashoffset: -600;opacity: 1;}

/*탭*/
#mcon04{position: relative;margin-top: 130px;}
#mcon04 .tab_box ul li{border:1px solid #BEBEBE;font-size: 0;background: #fff;margin-left: -2px;}
#mcon04 .tab_box ul li a{font-size: 0;display:block;}
#mcon04 .tab_box ul li a:last-child{display: none;}
#mcon04 .tab_box ul li a img{width: 100%;}
#mcon04 .tab_box ul li::after{content:"";display:block;border: 1px solid #2E6DF3;position: absolute;top: -1px;left: -1px;width: calc(100% - 0px);height: 100%;opacity: 0;cursor: pointer;z-index: 10;}
#mcon04 .tab_box ul li.swiper-slide-thumb-active a:first-child{display: none;}
#mcon04 .tab_box ul li.swiper-slide-thumb-active::after{display: block;opacity: 1;}
#mcon04 .tab_box ul li.swiper-slide-thumb-active a:last-child{display: block;}
#mcon04 .bottom_box>ul>li{font-size: 0;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div{display: inline-block;width: 50%;vertical-align: top;height: 33vw;overflow: hidden;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.left_box img{width: 100%;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.right_box{background: #111;position: relative;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.right_box .txt_box{position: absolute;left: 5.2vw;top:50%;transform: translateY(-50%);}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.right_box .txt_box h2{font-size:45px;color:#fff;font-weight: 500 ;margin-bottom: 10px;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.right_box .txt_box p{font-size:19px;color:#fff;font-weight: 400 ;line-height: 32px;margin-bottom: 30px;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.right_box .txt_box ul li{font-size:19px;color:#bebebe;font-weight: 400;margin-bottom: 8px;}
#mcon04 .bottom_box>ul>li>.cont_wrap>div.right_box .txt_box a{width:180px;line-height:55px;font-size:18px;color:#fff;font-weight: 400;border:1px solid #fff;margin-top: 40px;background: #111;}
#mcon04 .swiper-button-prev,
#mcon04 .swiper-button-next{background: none !important;width: 106px;transition: all 0.3s;margin-top: 80px;}
#mcon04 .swiper-button-next:after,
#mcon04 .swiper-button-prev:after{content:"";display:inline-block;background: rgba(255,255,255,0.6);width: 50px;height: 2px;transition: all 0.3s;position: absolute;top: 11px;}
#mcon04 .swiper-button-prev{left:5.2vw}
#mcon04 .swiper-button-prev::after{left: 0;}
#mcon04 .swiper-button-prev::before{content: "PREV";display: inline-block;font-size: 15px;color:#fff;position: absolute;right:0;}
#mcon04 .swiper-button-prev:hover,
#mcon04 .swiper-button-next:hover{width: 130px;}
#mcon04 .swiper-button-prev:hover:after,
#mcon04 .swiper-button-next:hover:after{width:85px ;}
#mcon04 .swiper-button-next{right:5.2vw}
#mcon04 .swiper-button-next::after{transform:
rotate(180deg);right: 0;}
#mcon04 .swiper-button-next::before{content: "NEXT";display: inline-block;font-size: 15px;color:#fff;position: absolute;left:0;}

/*함께하는 기업*/
#mcon05{padding-top: 150px;}
:root {--size: clamp(10rem, 1rem + 40vmin, 10rem);--gap: calc(var(--size) / 14);--duration: 60s;--scroll-start: 0;--scroll-end: calc(-100% - var(--gap));}
.marquee {display: flex;overflow: hidden;user-select: none;gap: var(--gap);}
.marquee__group {flex-shrink: 0;display: flex;align-items: center;justify-content: space-around;gap: var(--gap);min-width: 100%;animation: scroll-x var(--duration) linear infinite;}
@media (prefers-reduced-motion: reduce) {
.marquee__group {animation-play-state: paused;}
}
.marquee--vertical {--mask-direction: to bottom;}
.marquee--vertical,
.marquee--vertical .marquee__group {flex-direction: column;}
.marquee--vertical .marquee__group {animation-name: scroll-y;}
.marquee--reverse .marquee__group {animation-direction: reverse;animation-delay: -3s;}
.marquee__group img{opacity: 0.5;transition: all 0.3s;}
.marquee__group img:hover{opacity: 1;}
@keyframes scroll-x {
from {
transform: translateX(var(--scroll-start));
}
to {
transform: translateX(var(--scroll-end));
}
}

@keyframes scroll-y {
from {
transform: translateY(var(--scroll-start));
}
to {
transform: translateY(var(--scroll-end));
}
}
/* Element styles */
.marquee svg {display: grid;place-items: center;width: var(--size);fill: var(--color-text);background: var(--color-bg-accent);aspect-ratio: 16/9;padding: calc(var(--size) / 10);border-radius: 0.5rem;}
.marquee--vertical svg {aspect-ratio: 1;width: calc(var(--size) / 1.5);padding: calc(var(--size) / 6);}
/* Parent wrapper */
.wrapper { display: flex; flex-direction: column; gap: var(--gap); margin: auto; max-width: 100vw;margin-top: 40px; }

/*아코디언*/
#mcon06{width:100%;margin: 0px auto 0;padding-top: 150px;}
.accordion-list .accordion-item{position:relative; overflow:hidden;transition:all 0.3s;display:inline-block;vertical-align:top;height:100%;width:calc(11.9% - 8px);margin-right:8px;}
.accordion-list .accordion-item:last-child{margin-right: 0;}
.accordion-list .accordion-item .accordion-inner{display:block; position:relative; width:100%; height:100%; top:0; left:0;cursor:pointer;}
.accordion-list .accordion-item01 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_01.jpg') no-repeat center;}
.accordion-list .accordion-item02 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_02.jpg') no-repeat center;}
.accordion-list .accordion-item03 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_03.jpg') no-repeat center;}
.accordion-list .accordion-item04 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_04.jpg') no-repeat center;}
.accordion-list .accordion-item05 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_05.jpg') no-repeat center;}
.accordion-list .accordion-item06 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_06.jpg') no-repeat center;}
.accordion-list .accordion-item07 .accordion-inner{ background:url('/data/skin/front/designwib/img/banner/acc_07.jpg') no-repeat center;}
.accordion-list .accordion-item.active .accordion-inner{cursor:default;position: relative;}
.accordion-list .accordion-item.active .accordion-inner::after{content: "";display: block;width: 100%;height: 100%;position: absolute;background:linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%); transform: matrix(1, 0, 0, -1, 0, 0);opacity: 0.7;;}
.accordion-list-box{box-sizing: border-box;}
.accordion-list-box .accordion-list{display: table; width:100%; height: 34.2vw; white-space:nowrap; overflow:hidden; font-size:0;}
.accordion-list .accordion-item.active{width:calc(29.1% - 8px);}
.accordion-list .accordion-item{}

/*아코디언 :: 타이틀 및 내용 */
.accordion-item .accordion-inner .accordion-tit{position:absolute; top:50%; left:50%;color:#fff; font-size:24px; font-weight:500;text-align:center; z-index:1;opacity:1;filter:Alpha(opacity=100);transition:all 0.3s;transform: translate(-50%,-50%);}
.accordion-item .accordion-inner .accordion-tit .sub_txt{color: #fff;}
.accordion-item .accordion-info-box{position:absolute; left:50%; right:0; top:50%;transform: translate(-50%,-50%);width: 100%;z-index: 50;}
.accordion-item .accordion-info-box dl .sub_txt{font-size: 17px;font-weight: 400;color: #fff;margin-bottom: 8px;color: #fff;}
.accordion-item .accordion-info-box dl{position:relative; z-index:1; opacity:0;filter:Alpha(opacity=0); -webkit-transition-delay:0s; -moz-transition-delay:0s; -o-transition-delay:0s; -ms-transition-delay:0s; transition-delay:0s; z-index:1;}
.accordion-item .accordion-info-box dl
dt{font-size:30px; font-weight:600; margin-bottom:15px; color:#fff;text-align: center;}
.accordion-item .accordion-info-box dl dd{font-size:20px;color:#fff ;line-height: 30px;text-align: center;font-weight: 300;}
.accordion-item .accordion-inner::after{content: "";display: block;width: 100%;height: 100%;position: absolute;background:#000;opacity: 0.25;;}
.accordion-item.active .accordion-info-box dl .industry-view-more:after{margin-left:50%;}
.accordion-item.active .accordion-inner .accordion-tit{opacity:0;filter:Alpha(opacity=0);transition:all 0s;}
.accordion-item.active .accordion-inner dl{ opacity:1.0;filter:Alpha(opacity=100); -webkit-transition:all 0.3s 0.2s; -moz-transition:all 0.3s 0.2s; -o-transition:all 0.3s 0.2s; -ms-transition:all 0.3s 0.2s; transition:all 0.3s 0.2s; }

/*우수기업 인증 수상 정보*/
#mcon07{width: 1200px;margin: 0px auto 0;padding-top: 150px;}
#mcon07 ul{font-size: 0;margin-top: 70px;}
#mcon07 ul li{display: inline-block;width:calc(25% - 45px);margin-right: 60px;}
#mcon07 ul li:last-child{margin-right: 0;}
#mcon07 ul li a{display: block;}
#mcon07 ul li a .img_box img{width: 100%;}
#mcon07 ul li .txt_box{text-align: center;margin-top: 25px;}
#mcon07 ul li .txt_box .txt1{font-size: 22px;color:#000;font-weight: 500;margin-bottom: 10px;}
#mcon07 ul li .txt_box .txt2{font-size: 17px;color:#555;font-weight: 300;line-height: 25px;}

/*서포트 & 서비스*/
#mcon08{width: 1200px;margin: 150px auto 0;}
#mcon08 ul{font-size: 0;margin-top: 70px;}
#mcon08 ul li{display: inline-block;width:calc(25% - 23px);margin-right: 30px;border:1px solid #BEBEBE;text-align: center;vertical-align: top;height:277px;box-sizing: border-box;transition: all 0.3s;}
#mcon08 ul li:last-child{margin-right: 0;}
#mcon08 ul li a{display: block;padding: 70px 0 35px;}
#mcon08 ul li:hover{border:1px solid #FFDD00}
#mcon08 ul li .txt_box {margin-top: 15px;}
#mcon08 ul li .txt_box .txt1{font-size: 22px;font-weight: 500;color: #000;}
#mcon08 ul li .txt_box .txt2{font-size: 17px;font-weight: 300;color: #555;line-height: 25px;margin-top: 10px;}

#mcon09{font-size: 0;margin: 150px 0 0 ;position: relative;}
#mcon09 > div.area_box{width: 50%;display: inline-block;height:45vw ;vertical-align: top;}
#mcon09 > div.left_area{background: #FAFAFA;}
#mcon09 > div.right_area{background: #222222;position: relative;}
#mcon09 > div.right_area .top_txt{font-size:17px;color:#FFDD00 ;margin-bottom: 15px;}
#mcon09 > div.right_area h1{font-size:48px;color:#fff ;line-height: 68px;font-weight: 300;}
#mcon09 > div.right_area h1 b{display: block;font-weight: 500;}
#mcon09 > div.right_area .sub_txt{color: #999;font-size: 20px;line-height: 30px;text-align: left;}
#mcon09 > div.right_area .view_go{display: block;font-size: 16px;color: #fff;font-weight: 400;height: 35px;border-bottom: 1px solid #fff;width: 185px;background: url('../img/icon/go_arrow.svg')no-repeat top 2px right;line-height: 1;margin-top: 60px;}
#mcon09 > div.right_area .right_txt{position: absolute;top:50%;transform: translateY(-50%);left:250px}
#mcon09 > div.video__box{position: absolute;left: 5.2vw;top: 50%;transform: translateY(-50%);width: 54.68vw;height:35.41vw;}
#mcon09 > div.video__box img{width: 100%;}

/*게시판*/
#mcon10{margin: 130px auto 0;width: 1200px;}
#mcon10{font-size: 0;}
#mcon10 > div{width: calc(50% - 40px);display: inline-block;margin-right: 80px;vertical-align: top;}
#mcon10 > div:last-child{margin-right: 0;}
#mcon10 > div .board_tit{font-size: 32px;color:#000;font-weight: 500;border-bottom: 1px solid #DADADA;padding-bottom: 25px;}
#mcon10 > div .board_tit::after{display: block;clear: both;content: "";}
#mcon10 > div .board_tit a{font-size: 18px;color:#6b6b6b;font-weight: 400;display:inline-block;background: url('../img/icon/m_board_arrow.svg')no-repeat center right;padding-right: 57px;float: right;margin-top: 14px;transition: all 0.3s;}
#mcon10 > div .board_tit a:hover{color: #FFDD00;background: url('../img/icon/m_board_arrow2.svg')no-repeat center right}
#mcon10 > div .board_list li{border-bottom: 1px solid #dadada;padding: 24px 0;}
#mcon10 > div .board_list li a{display: block;}
#mcon10 > div .board_list li a::after{display: block;content: "";clear: both;}
#mcon10 > div .board_list li a span{font-size: 16px;color:#000;font-weight: 300;transition: all 0.3s;}
#mcon10 > div .board_list li a span.data{color: #555;font-weight: 400;float: right;}

/*동영상*/
.video__pop{display:none;position: fixed;top: 0;right: 0;left: 0;bottom: 0;background: rgba(0,0,0,0.5);z-index: 101;}
.video__pop .video_inner{position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);padding-top: 45px;}
.video__pop .pop_x{position: absolute;top:0;right:0;width: 30px;height: 31px;background: url('../img/icon/pop_x.svg')no-repeat center;cursor: pointer;}