/* COMMON */
.pc-block{display:block;}
.m-block{display:none;}


/* Hamburger */
.hamburger {position:relative;}
.hamburger.active {}
.mob_gnb_wrap{display:;}

.topUtile{position:relative; overflow:hidden; background:#222;}
.topUtile li.ham_bt{float:left; height:; width:; text-align:center; font:500 18px/26px Noto Sans KR; padding:20px 0 20px 22px;}
/*.topUtile li.ham_bt:after{content:"|"; display:inline-block; float:left; margin:0 10px; font:500 18px/22px Noto Sans KR;}*/
.topUtile li.ham_bt:nth-child(2){padding:20px 0;}
.topUtile li.ham_bt:nth-child(2):after{content:""; display:none;}
.topUtile li.ham_bt a{display:inline-block; float:left; color:#000;}
.topUtile li.home{ float:left; height:22px; width:100%; margin-right:0px; text-align:center; }
.topUtile li.lang{ border:1px dashed rgba(255, 255, 255, 0.25); border-width:0 0 0 1px; }
.topUtile img{width:150px; float:left; display:block; }



.mob_gnb_dimm { background:#000; display:none; height:100%; left:0; opacity:0.7; filter:alpha(opaicty=80); position:fixed; top:0; width:100%; z-index:2000; }
.mob_gnb_wrap {display:block; background:#fff; height:100%; padding-bottom:30px; position:fixed; right:-550px; top:0; width:550px; z-index:2001; }
.mob_gnb_wrap_inner { height:100%;  overflow-y:auto; }
.btn_gnb_close {float:right; z-index:100;}
.btn_gnb_close a {background:url(/img/m_close.png)no-repeat center; display:block; overflow:hidden; text-indent:-20000px; width:26px; height:26px; padding:18px; box-sizing:content-box;}
.mob_gnb_search { background:#2d2926; border-bottom:1px solid #222; height:111px; position:relative; width:100%; }
.mob_gnb_search_inner { height:50px; left:50%; margin-left:-150px; position:absolute; top:30px; width:300px; }
.mob_gnb_search_inner input { border:1px solid #e3e1d2; border-radius:3px; float:left; height:48px; width:190px; }
.mob_gnb_search_inner a { background:#666; border-radius:3px; color:#fff; float:right; font-size:18px; font-weight:normal; height:50px; line-height:50px; text-align:center; width:100px; }
.mob_gnb_menus ul li { background:#eaecf0; border-bottom:1px solid #ddd; font-size:18px; font-weight:normal; line-height:55px!important; text-indent:20px; }
.mob_gnb_menus ul li a { color:#555; display:block; height:50px; line-height:50px; position:relative; width:100%; font-size:16px; font-weight:600; font-family:Noto Sans KR;}
.mob_gnb_menus ul li a.sub_first{ border-top:1px solid #777; }
.mob_gnb_menus ul li a span.mob_gnb_arrow_down { background:url(/img/arrow_down.png) no-repeat; display:block; height:12px; margin-top:-6px; right:25px; position:absolute; top:50%; width:21px; }
.mob_gnb_menus ul li a span.mob_gnb_arrow_up { background:url(/img/arrow_up.png) no-repeat; display:block; height:12px; margin-top:-6px; right:25px; position:absolute; top:50%; width:21px; }
.mob_gnb_menus ul li ul li { background:#eaecf0; border-bottom:none; font-size:18px; font-weight:normal; line-height:50px; text-indent:50px; }
.mob_gnb_menus ul li ul li a { color:#4d4d4e; display:block; line-height:34px; height:34px; position:relative; width:84%; margin:0 auto; background:#fff; font-size:14px; text-indent:14px; }
.mob_gnb_menus ul li.mob_gnb_ttl2 { background:#fff; border-bottom:1px solid #e5e5e5; font-size:18px; font-weight:normal; text-indent:20px; }
.mob_gnb_menus ul li.mob_gnb_ttl2 a {color:#333; display:block; height:60px; line-height:60px; position:relative; width:100%; font-weight:bold; font-size:18px; letter-spacing:-1px;}
.mob_gnb_menus ul li.mob_gnb_ttl2 a span.mob_gnb_arrow_down { background:url(/img/arrow_down.png) no-repeat; display:block; height:12px; margin-top:-6px; right:14px; position:absolute; top:50%; width:21px; }
.mob_gnb_menus ul li.mob_gnb_ttl2 a span.mob_gnb_arrow_up { background:url(/img/arrow_up.png) no-repeat; display:block; height:12px; margin-top:-6px; right:14px; position:absolute; top:50%; width:21px; }
.last_inner_menu{ margin-bottom:10px; }

ul.hamburgerBot{background:#f4f4f4; font-size:0; padding:6px 0 2px;}
ul.hamburgerBot li{width:50%; display:inline-block; background:#fff; box-sizing:border-box;}
ul.hamburgerBot li:first-of-type{border-right:2px solid #f4f4f4;}
ul.hamburgerBot li a{display:block; padding:10px 0;}
ul.hamburgerBot li a img{width:28px; display:block; margin:auto;}
ul.hamburgerBot li a p{font:500 14px/14px Noto Sans KR; text-align:center; color:#333; margin:6px auto 0;}


/* MAIN VISUAL */
div.visualBottomWrap{width:100%; height:110px; background:rgba(0, 0, 0, .7); position:absolute; top:100%; left:50%; transform:translate(-50%, -110px); z-index:101;}

div.visualBottom{max-width:1600px; display:flex; justify-content:center; margin:auto;}
div.visualBottom ul{display:flex;}
div.visualBottom ul li{display:inline-block;}
div.visualBottom ul li a{height:110px; padding:12px 0 0; box-sizing:border-box; display:block;}
div.visualBottom ul li a img{display:block; margin:auto;}
div.visualBottom ul li a p{color:#fff; text-align:center; font:400 14px/14px Noto Sans KR; overflow:hidden;}
div.visualBottom ul.visualBottom-L{flex-basis:70%;}
div.visualBottom ul.visualBottom-L li{flex-basis:10%;}
div.visualBottom ul.visualBottom-R{/* display:none; */ flex-basis:14%; background:rgba(0, 0, 0, 0.5);}
div.visualBottom ul.visualBottom-R li{flex-basis:50%;}
div.visualBottom ul.visualBottom-R li p {color:#ff4949; /* color:#000; */ font-weight:600;}
/*
div.visualBottomWrap{width:100%; max-width:1920px; height:110px; position:absolute; top:100%; left:0; transform: matrix(1, 0, 0, 1, 0, -110); z-index:101;}
ul.visualBottom{position:absolute; bottom:0; font-size:0; box-sizing:border-box;}
ul.visualBottom li{display:inline-block;}
ul.visualBottom li a{height:110px; padding:12px 0 0; box-sizing:border-box; display:block;}
ul.visualBottom li a img{display:block; margin:auto;}
ul.visualBottom li a p{color:#fff; text-align:center; font:400 14px/14px Noto Sans KR; overflow:hidden;}

ul.visualBottomL{width:70%; padding:0 0 0 160px; left:0; background:rgba(0, 0, 0, .7);}
ul.visualBottomL li{width:10%;}
ul.visualBottomR{width:30%; padding:0 160px 0 0; right:0; background:rgba(255, 0, 78, .7);}
ul.visualBottomR li{width:33.33%;}
*/


/* MAIN CON01 */
.mainCon01Wrap{width:100%; max-width:1920px; height:682px; position:relative; margin:auto;}
.mainCon01Wrap .mainCon01Bg{width:100%; height:100%; display:flex; justify-content:center; align-items:center;
background:url(/img/mainCon01.jpg)no-repeat center; background-attachment:fixed; position:absolute; top:0; left:0;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text{display:flex; justify-content:center;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-l{margin:0 180px 0 0;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-l h2{font:700 56px/64px Noto Sans KR; color:#fff; text-shadow:0px 0px 4px rgba(0,0,0,0.3);}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-l button{background:#fff; border:none; font:400 14px/1 Noto Sans KR; color:#161616; box-shadow:0px 0px 4px rgba(0,0,0,0.3); padding:15px 50px; margin:48px 0 0; position:relative; cursor:pointer; transition:all 0.5s; z-index:0;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-l button:after{content:""; width:0; height:100%; background:#ff004e; display:block; transition:all 0.5s; position:absolute; top:0; left:0; z-index:-1;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-l button:hover:after{width:100%;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-l button:hover{color:#fff;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-r{}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-r p{font:300 24px/34px Noto Sans KR; color:#fff; text-shadow:0px 0px 4px rgba(0,0,0,0.3);}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-r button{display:none; background:#fff; border:none; font:400 14px/1 Noto Sans KR; color:#161616; box-shadow:0px 0px 4px rgba(0,0,0,0.3); padding:15px 50px; margin:48px 0 0; position:relative; cursor:pointer; transition:all 0.5s; z-index:0;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-r button:after{content:""; width:0; height:100%; background:#ff004e; display:block; transition:all 0.5s; position:absolute; top:0; left:0; z-index:-1;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-r button:hover:after{width:100%;}
.mainCon01Wrap .mainCon01Bg .mainCon01Text .mainCon01Text-r button:hover{color:#fff;}


/* MAIN CON02 */
.mainCon02Wrap{}
.mainCon02Wrap-m{display:none;}

.mainCon02-bt{font-size:14px; font-weight:400; background:#363636; color:#fff; position:relative; padding:15px 50px; z-index:0;}
.mainCon02-bt:after{content:""; width:0; height:100%; background:#ff004e; display:block; transition:all 0.5s; position:absolute; top:0; left:0; z-index:-1;}
.mainCon02-bt:hover:after{width:100%;}

.mainCon02-circle{}
.mainCon02-circle:hover{}
.mainCon02-circle div{width:188px; height:188px; display:flex; justify-content:center; align-items:center; flex-direction:column;
border:1px solid #ff004e; border-radius:50%; transition:all 0.5s!important;}
.mainCon02-circle:hover div{background:#ff004e;}
.mainCon02-circle h3{font-size:18px; font-weight:500; color:#222;}
.mainCon02-circle h4{font-size:10px; font-weight:300; color:#555; margin:6px 0 0;}
.mainCon02-circle:hover div h3{color:#fff;}
.mainCon02-circle:hover div h4{color:rgba(255,255,255,0.7);}




/* WORKS */
div.mainWorks{width:100%; max-width:1600px; margin:80px auto 0;}
div.mainWorks h1{text-align:center; font:600 24px/24px Noto Sans KR; color:#8c8c8c; margin:0 auto 40px;}
div.mainWorks h2{text-align:center; font:600 72px/86px Noto Sans KR; color:#e1e2e7; margin:85px auto 75px;}

.main-content {width:1600px; height:auto; min-height:260px; padding-bottom:50px;  margin:0 auto; overflow:hidden;	}
.main-content .box {position:relative; width:290px; margin:15px; background:#fff; box-sizing:border-box; cursor:pointer;}
.main-content .img-h {position:relative;}
.main-content .img-h .img_gray {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.03)}
.main-content .img-h img {width:100%; box-shadow:2px 2px 6px rgba(0,0,0,0.2);}
.main-content .com_info{display:block; padding:10px 0; font-size:13px;}

/* FOOTER */
div#topBt{ cursor: pointer; position: absolute;  right: 0; top: -40px; display:none;}
div#topBt i{font-size:26px; color:#000;}


/* SUB */
div.Container{width:100%; margin:0 auto; background: no-repeat center right; padding:100px 0; background-position: right bottom; background-repeat: no-repeat;/* height: 880px; */}
div.Container.Container-top{min-height: 880px; }
div.Container.solution{ /*background-image: url( /img/main_b_solution.png); */ background-image: url(/img/main_b_solution_2.png); }
div.Container.group{ /* background-image: url(/img/main_b_group.png); */ background-image: url(/img/main_b_group_2.png); }
div.Container.erp{ /* background-image: url(/img/main_b_erp.png); */ background-image: url(/img/main_b_erp_2.png); }
div.Container.app{ /* background-image: url(/img/main_b_app.png); */ background-image: url(/img/main_b_app_2.png); }
div.Container.img{ /* background-image: url(/img/main_b_img.png); */ background-image: url(/img/main_b_img_2.png); }
div.Container.ebook{ /* background-image: url(/img/main_b_ebook.png); */ background-image: url(/img/main_b_ebook_2.png); }
div.Container.b2b{ /* background-image: url(/img/main_b_b2b.png); */ background-image: url(/img/main_b_b2b_2.png);}
div.Container.shop{ /* background-image: url(/img/main_b_shop.png); */ background-image: url(/img/main_b_shop_2.png); }
div.Container.marketing{ /* background-image: url(/img/main_b_marketing.png); */ background-image: url(/img/main_b_marketing_4.png); }
div.Container.home{ /* background-image: url(/img/main_b_web.png); */ background-image: url(/img/main_b_web_2.png); }
div.Container.develop{ /* background-image: url(/img/main_b_web.png); */ background-image: url(/img/main_b_development_2.png); }


div.Container:after{content:""; display:block; clear:both;}
div.ContainerG{width:100%; margin:auto; background:#f6f6f6;}
div.ContainerG:after{content:""; display:block; clear:both;}
div.subCon{width: 80%; margin: 0 auto; display: block;}
div.subCon.subConG{/* max-width:1600px; */ /* max-width:80%; */  padding:100px 0;}

div.subCon table{width:100%; border-top:1px solid #000;}
div.subCon table tr{}
div.subCon table tr th, div.subCon table tr td{border-collapse:collapse; padding:24px 0; border-bottom:1px solid #aaa; text-align:center;}
div.subCon table tr th{font:400 15px Noto Sans KR; color:#666; vertical-align:middle;}
div.subCon table tr td{font:400 15px Noto Sans KR; color:#222; }

div.Container div.subCon h2.textB{font:700 60px/90px Noto Sans KR; word-break:keep-all;}
div.ContainerG div.subCon h2.textB{font:700 60px/90px Noto Sans KR; word-break:keep-all;}


/* SUB_COMPANY */
div.greeting{width:100%; position:relative;}
div.greeting .greetingL{width:840px; height:85%; color:#fff; z-index:10;position:absolute; top:50%; left:0; transform:translate(0, -50%); padding:40px 40px 40px 0;}
div.greeting .greetingL .greetingLText{position:relative; top:50%; left:20%; transform:translate(0, -50%);}
div.greeting .greetingL .greetingLText h2{font-size:50px;}
div.greeting .greetingL .greetingLText h3{font:700 20px/25px Noto Sans KR; margin:40px 0 20px;}
div.greeting .greetingL .greetingLText p{font:200 16px/22px Noto Sans KR; color:#fff;}
div.greeting .greetingR{position:relative;}
div.greeting .greetingR img{width:100%; min-height:540px;}

div.greeting2 {width:100%; margin: 0 auto;}
div.greeting2 .greeting-box {height:100vh; width:80%; display:flex; margin:0 auto;}
div.greeting2 .greetingL{width:40%; height:100%; color:#000; display:flex; align-items:center;}
div.greeting2 .greetingL .greetingLText {width:100%;}
div.greeting2 .greetingL .greetingLText h2{font-size:50px; line-height:80px;}
div.greeting2 .greetingL .greetingLText h3{font:700 25px/40px Noto Sans KR; margin:40px 0 20px;}
div.greeting2 .greetingR {width:60%; height:100%; position:relative;}
div.greeting2 .greetingR #logo-back {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; z-index:0;}
div.greeting2 .greetingR #logo-back-m {display:none;}
div.greeting2 .greetingR #logo-back .st0{stroke:#c9c9c9;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;/* animation-fill-mode: forwards; */}

div.greeting2 .company_contbox {display:flex; justify-content:space-between; align-items:center; width:80%; margin:0 auto 100px;} 
div.greeting2 .company_contbox > div {width:45%;}
div.greeting2 .company_contbox .contbox_img {height:500px; border-radius:20px;}
div.greeting2 .company_contbox div.contbox_img1 {background:url("/img/company_img01-2.png") no-repeat; background-position: center; /* background-size:cover; */}
div.greeting2 .company_contbox div.contbox_img2 {background:url("/img/company_img02.png") no-repeat center / cover;} 
div.greeting2 .company_contbox div.contbox_img3 {background:url("/img/company_img03.png") no-repeat center / cover;} 
/* div.greeting2 .company_contbox .contbox_img img {width:100%; object-fit:cover; border-radius:20px;} */
div.greeting2 .company_contbox .contbox_txt h3 {font: 700 35px / 50px Noto Sans KR; margin-bottom:30px;}
div.greeting2 .company_contbox .contbox_txt p {font:200 18px/28px Noto Sans KR; letter-spacing:0.6px; width:70%;word-break: keep-all; word-wrap: break-word;}
/*배경애니메이션*/
/* #w{stroke-dasharray: 3502; stroke-dashoffset: -3502; animation: w-anim 0.7s linear 1s forwards;}
#eb{stroke-dasharray: 2344; stroke-dashoffset: -2344; animation: eb-anim 0.7s linear 1.8s forwards;}
#pla{stroke-dasharray: 5134; stroke-dashoffset: -5134; animation: pla-anim 0.7s linear 2.5s forwards;}
#za{stroke-dasharray: 3134; stroke-dashoffset: -3134; animation: za-anim 0.7s linear 3.2s forwards;}
 
@keyframes w-anim {
   from {stroke-dashoffset : 3502px;}
   to {stroke-dashoffset : 0px;}
}
@keyframes eb-anim {
   from {stroke-dashoffset : 2344px;}
   to {stroke-dashoffset : 0px;}
}
@keyframes pla-anim {
   from {stroke-dashoffset : 5134px;}
   to {stroke-dashoffset : 0px;}
}
@keyframes za-anim {
   from {stroke-dashoffset : 3134px;}
   to {stroke-dashoffset : 0px;}
} */

#logo-back {
  animation: text-fill-animation 0.5s ease forwards 4.8s;
}
#w {
  stroke-dasharray: 5430px;
  stroke-dashoffset: 5430px;
  animation: text-animation 0.6s linear forwards 1s;
}
#eb {
  stroke-dasharray: 2238px;
  stroke-dashoffset: 2238px;
  animation: text-animation 0.6s linear forwards 1.6s;
}
#p {
  stroke-dasharray: 1448px;
  stroke-dashoffset: 1448px;
  animation: text-animation 0.6s linear forwards 2.2s;
}
#la {
  stroke-dasharray: 2906px;
  stroke-dashoffset: 2906px;
  animation: text-animation 0.6s linear forwards 2.8s;
}
#z {
  stroke-dasharray: 1374px;
  stroke-dashoffset: 1374px;
  animation: text-animation 0.6s linear forwards 3.4s;
}
#a {
  stroke-dasharray: 1748px;
  stroke-dashoffset: 1748px;
  animation: text-animation 0.6s linear forwards 4s;
}

@keyframes text-animation {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes text-fill-animation {
  from {
    fill: transparent;
  }
  to {
    fill: #c9c9c9;
  }
}

div.greeting3 {width:80%; margin:0 auto 150px;}
div.greeting3 div .gree3-img1 {margin-bottom:20px; background:linear-gradient( rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2) ),url("/img/company_img01-1.png") no-repeat center / cover; height:600px;}
div.greeting3 div .gree3-img2 {background:linear-gradient( rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2) ),url("/img/company_img02-1.png") no-repeat center / cover; height:1000px; width:100%;}
div.greeting3 div .gree3-img3 {margin-bottom:20px; background:linear-gradient( rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2) ),url("/img/company_img03-1.png") no-repeat center / cover; height:500px; width:100%;}
div.greeting3 div div.gree3-flex {display:flex; justify-content:space-between;}
/* div.greeting3 div.greeting3T div.gree3-txt p {margin-left:50px;} */
div.greeting3 div div.gree3-txt h2 {font: 700 35px / 50px Noto Sans KR;}
div.greeting3 div div.gree3-txt p {font:200 18px / 28px Noto Sans KR; width:30%; word-break: normal;}
div.greeting3 div.greeting3B {margin-top:150px; display:flex; justify-content:space-between;}
div.greeting3 div.greeting3B .greeting3B-L {width:38%; position:relative;}
div.greeting3 div.greeting3B .greeting3B-L div.gree3-txt {position:absolute; top:0; left:100%; padding-left:25px; width:100vw;}
div.greeting3 div.greeting3B .greeting3B-L div.gree3-txt h2 {margin-bottom:20px;}
div.greeting3 div.greeting3B .greeting3B-R {width:52%; display:flex; flex-direction: column; justify-content:flex-end;}
/* div.greeting3 div.greeting3B .greeting3B-R div.gree3-flex {justify-content:space-between;} */
div.greeting3 div.greeting3B .greeting3B-R .gree3B-R-b .gree3-txt p {width:55%;}


div.ContainerB {/* margin-top:100px; */ background:linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url("/img/company_bg01.png") no-repeat center / cover; background-attachment: fixed;}
div.ContainerB .subCon {text-align:center; padding: 150px 0; color: #fff;}
div.ContainerB .subCon h1 {font: 700 35px / 50px Noto Sans KR; margin-bottom:30px;}
div.ContainerB .subCon p {font:300 25px/35px Noto Sans KR;}

div.ContainerH {height:80vh; display:flex; align-items:center;}

.com_history {margin-top:100px;}
.com_history ul {display:flex; justify-content:space-between; border-top:1px solid #000;}
.com_history ul li {width:24%; position:relative; padding-left:20px;}
.com_history ul li::before {content:""; display:block; width:15px; height:15px; background-color:#000; border-radius:50%; position:absolute; top:-7.5px; left:0;}
.com_history ul li h1 {font: 900 40px Noto Sans KR; margin:10px 0;}
.com_history ul li h2 {font: 700 25px / 40px Noto Sans KR; margin-bottom:10px;}
.com_history ul li p {font:200 18px/28px Noto Sans KR; margin-bottom:10px;}

div.ContainerA div.company50Wrap {justify-content:space-between;}
div.ContainerA div.company50Wrap > div {width:48%;}

div.company50Wrap{display:flex; align-items:center; font-size:0;}
div.company50Wrap .company50{width:50%; display:inline-block;}
div.company50Wrap .company50L h2{font:700 60px/62px Noto Sans KR;}
div.company50Wrap .company50L p{font:400 18px/22px Noto Sans KR; color:#555; margin:60px 0 0;}

div.company50Wrap .company50his ul{border-left:1px solid #ff004e; position:relative; padding:92px 0 33px;}
div.company50Wrap .company50his ul:before{content:""; width:11px; height:11px; border-radius:20px; background:#ff004e; display:inline-block; position:absolute; top:-11px; left:-6px;}
div.company50Wrap .company50his ul:after{content:""; width:11px; height:11px; border-radius:20px; background:#ff004e; display:inline-block; position:absolute; bottom:-11px; left:-6px;}
div.company50Wrap .company50his ul li{position:relative; padding:0 0 50px 110px;}
div.company50Wrap .company50his ul li:before{content:""; width:15px; height:15px; border-radius:20px; border:1px solid #ff004e; box-sizing:border-box; background:#fff; display:inline-block; position:absolute; left:-8px;}
div.company50Wrap .company50his ul li:after{content:""; width:80px; height:1px; background:#ff004e; display:inline-block; position:absolute; top:7px; left:7px;}
div.company50Wrap .company50his ul li:last-of-type{padding:0 0 0 110px;}
div.company50Wrap .company50his ul li span{font:700 40px/10px Noto Sans KR; display:block; margin:0 0 26px;}
div.company50Wrap .company50his ul li div{}
div.company50Wrap .company50his ul li div h4{font:500 20px/20px Noto Sans KR; margin:0 0 6px;}
div.company50Wrap .company50his ul li div p{font:200 12px/12px Noto Sans KR; color:#555;}
div.subCon div.company50Wrap table tr td{text-align:left;}

div.client{}
div.client h2{font:700 60px/60px Noto Sans KR; text-align:center;}
div.client ul{width:100%; max-width:1200px; margin:85px auto 0; display:flex; justify-content:space-between; flex-wrap:wrap; align-content:space-between;}
div.client ul li{width:22%; margin:0 4% 4% 0; text-align:center;}
div.client ul li:nth-of-type(4n+0){margin:0 0 4% 0;}
div.client ul li img{width:;}


/* SUB_BUSINESS */
ul.busiCate{height:84px; line-height:84px; background:#f2f2f2; border-bottom:1px solid #e0e0e0; text-align:center;}
ul.busiCate li{display:inline-block;}
ul.busiCate li:after{content:"/"; display:inline-block; margin:0 45px; color:#333; font-size:13px; vertical-align:top;}
ul.busiCate li:last-of-type:after{display:none;}
ul.busiCate li a{font:500 18px Noto Sans KR; color:#000;}
ul.busiCate li a.On{color:#ff004e;}


.busiTop{}
.busiTop h5{/*font:300 11px/11px Noto Sans KR; */color:#ccc; margin:40px auto 10px;}
.busiTop p{font:300 25px/35px Noto Sans KR; color:#666; padding-top: 20px; box-sizing: border-box;}

.busiMid{}

.busiMid .busiMidR{width:100%; padding:14% 0; height:700px;  margin:0 0 0 auto; display:flex; align-items:center; justify-content:center;}
.busiMid .busiMidR.solution{ background-image: url(/img/busiSol_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.group{ background-image: url(/img/busiGro_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.erp{ background-image: url(/img/busiErp_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.app{ background-image: url(/img/busiApp_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.img{ background-image: url(/img/busiImg02_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.ebook{ background-image: url(/img/busiEbo_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.b2b{ background-image: url(/img/busiB2b_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.shop{ background-image: url(/img/busiShop01_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.shop2{ background-image: url(/img/busiShop02_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.marketing{ background-image: url(/img/busiMar_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.home{ background-image: url(/img/busiHom02_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.mobile{ background-image: url(/img/busiMb_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.respon{ background-image: url(/img/busiRespon_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.develop{ background-image: url(/img/busiSol_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.esg{ background-image: url(/img/busiEsg_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.crm{ background-image: url(/img/busiCrm_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}
.busiMid .busiMidR.admini{ background-image: url(/img/busiAdmini_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center;}






.busiMid .busiMidR .busiMidRText{display:inline-block; position:relative; text-align: center;}
.busiMid .busiMidR .busiMidRText h3{font:700 50px/50px Noto Sans KR;}
.busiMid .busiMidR .busiMidRText h3 img{ margin: 0 auto; display: block;}

.busiMid .busiMidR .busiMidRText p{font:300 25px/35px Noto Sans KR; color:#fff; text-align:center}
.busiMid .busiMidR .busiMidRText p strong{font-weight:500; color:#000;}
.busiMid .busiMidR .busiMidRText p small{font-size:12px;}
.busiMid .busiMidR .busiMidRText ul{font-size:0; margin:60px 0 0; display:inline-block; background:#363636;}
.busiMid .busiMidR .busiMidRText ul li{display:inline-block;}
.busiMid .busiMidR .busiMidRText ul li a{display:block; font:500 13px/13px Noto Sans KR; color:#fff; padding:10px 20px; position:relative; z-index:0;}
.busiMid .busiMidR .busiMidRText ul li a:after{content:""; width:0; height:33px; background:#ff004e; display:block; transition:all 0.5s; position:absolute; top:0; left:0; z-index:-1;}
.busiMid .busiMidR .busiMidRText ul li a:hover:after{width:100%;}

.busiMid .onehago-bt-wrap{width:100%; height:1px; max-width:1600px; position:absolute; top:0%; left:50%; margin:auto; transform:translateX(-50%); z-index:10;}
.busiMid .onehago-bt{width:216px; height:216px; position:absolute; top:-108px; right:30px; background:#fff; border:1px solid #333; border-radius:50%; overflow:hidden;}
.busiMid .onehago-bt .onehagomall-line{position:absolute; top:calc(50% - 92px); left:calc(50% - 92px);
animation:onehagomall-line 9s linear infinite; transform-origin:50% 50%;}
.busiMid .onehago-bt .onehago-circle{width:142px; height:142px; display:flex; justify-content:center; align-items:center;
 background:#333; border-radius:50%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.busiMid  .onehago-bt .onehago-circle img{display:block;}

@media (max-width:1600px){
.busiMid .onehago-bt{width:160px; height:160px; top:-80px;}
.busiMid .onehago-bt .onehagomall-line{width:138px; height:138px; top:calc(50% - 69px); left:calc(50% - 69px);}
.busiMid .onehago-bt .onehago-circle{width:105px; height:105px;}
.busiMid .onehago-bt .onehago-circle img{width:80%;}
}

@media (max-width:980px){
.busiMid .onehago-bt{top:4%; right:8%; background:none;}
}

@keyframes onehagomall-line{
    100% {
        transform: rotate(360deg);
    }
}

/* .hosting-bottom{background:#f6f6f6; width:100%;padding:100px 0;text-align:center;}
.hosting-bottom .hosting-con{max-width:1600px;margin:0 auto;}
.hosting-bottom .hosting-con h3{font: 700 24px/24px Noto Sans KR; margin:0 0 80px;}
.hosting-bottom .hosting-con .hosting-list{display:flex;    justify-content: space-evenly;}
.hosting-bottom .hosting-con .hosting-list li{display: flex; flex-direction: column; width: 25%; max-width: 180px;  background: #fff; padding: 30px 0;  border-radius: 10px; position:relative;box-shadow:0px 2px 5px rgba(0,0,0,0.15);}
.hosting-bottom .hosting-con .hosting-list li::after{content: '';  width: 30px;  height: 30px;  transform: translateY(-50%) rotate(45deg);  box-sizing: border-box;  position: absolute;  right: -15px;  top: 50%;  background: #fff;}
.hosting-bottom .hosting-con .hosting-list li:last-child::after{display:none;}
.hosting-bottom .hosting-con .hosting-list li .img-box{min-height:80px;}
.hosting-bottom .hosting-con .hosting-list li .txt-box{margin:14px 0 0; text-align:center;}
.hosting-bottom .hosting-con .hosting-list li .txt-box span{display: flex; background: #ff4242; color: #fff; border-radius: 10px; align-items: center; max-width: 100px;  padding: 5px 0;  justify-content: center;  margin: 0 auto 10px;} */

.hosting-bottom{width:100%;max-width:1920px;min-height:800px;position:relative;margin:100px auto 0;}
.hosting-bottom .hosting-wrap{/*background: url(/img/hosting-bg02.jpg) no-repeat center;*/ flex-direction: column; background-attachment: fixed;width:100%; height:100%;display:flex; justify-content:center;align-items:center;/* position:absolute;left:0;top:0; */}
.hosting-bottom .hosting-wrap .hosting-con{width:100%;max-width:1600px;margin:0 auto;}
.hosting-bottom .hosting-wrap .hosting-con h3{;font-size:3rem;text-align:center;}
.hosting-bottom .hosting-wrap .hosting-con > p{font-size:16px;color:#;line-height:normal;text-align:center;margin:40px 0 60px;}
.hosting-box{display:flex;max-width:1110px;margin:0 auto; background: #666; padding: 60px; box-sizing: border-box; border-radius: 50px;}
.hosting-box > div{width:50%;}
.hosting-box .img-box img{max-height:465px;}
.hosting-box .txt-box{padding-left:60px;box-sizing:border-box;}
.hosting-box .txt-box p{margin:20px 0 60px;font-size:20px;color:#fff;;text-align:center;}
.hosting-box .txt-box p span{margin-right: 10px; display: inline-block;width: 10px;height: 10px; background: #ff4242;position:relative;top:-2px;}
.hosting-box .txt-box ul li{border: 1px solid #fff; border-radius: 4px; padding: 20px 10px; margin: 0 0 20px; color: #000;background: rgba(255,255,255,0.85);text-align:center;}
.hosting-box .txt-box ul li:last-child{margin:0;}


.busiList ul{display:flex; justify-content:flex-start; flex-wrap:wrap;}
.busiList ul li{width:20%; margin:0 2% 4% 0; box-shadow: 3px 0px 15px 0px rgba(0, 0, 0, .2); border-radius: 40px;}

.busiList ul li div{width:100%; text-align:center; margin:30px auto;}
.busiList ul li h1{font:500 18px/22px Noto Sans KR; color:#333; margin:0 0 14px;}
.busiList ul li h1 strong{display:block; color:#eb1313;}
.busiList ul li h2{font:700 22px/26px Noto Sans KR; color:#eb1313; margin:18px 0 14px;}
.busiList ul li p{/* font:300 13px/19px Noto Sans KR; */ font:300 16px/23px Noto Sans KR; color:#888; word-break:keep-all; width: 90%; margin: 0 auto;}

.busiList.busiList3 ul{width:60%; margin:auto;}
.busiList.busiList3 ul li{width: 32%; }
.busiList.busiList3 ul li:nth-child(3n){margin-right:0}
.busiList.busiList4 ul li{width:23.5%; }
.busiList.busiList4 ul li:nth-child(4n){margin-right:0}
.busiList.busiList5 ul li{width: 18.4%; }
.busiList.busiList5 ul li:nth-child(5n){margin-right:0}

.busiList.b2bList ul li{box-shadow:none; border-radius:0}

.busiList2{}
.busiList2 ul{display:flex; justify-content:space-between;}
.busiList2 ul li{padding:0 3%; border:1px solid #ccc; border-width:0 0 0 1px;}
.busiList2 ul li:last-of-type{border-width:0 1px 0 1px;}
.busiList2 ul li p{height:80px; text-align:center; font:400 16px/20px Noto Sans KR; word-break:keep-all; display:table-cell; vertical-align:middle;}

ul.ebookList{display:flex; justify-content:space-around; flex-wrap:wrap; font-size:0;}
ul.ebookList li{}
ul.ebookList li img{width:180px; box-shadow:}
ul.ebookList li img.qr{width:80px}
ul.ebookList li h2{font:500 20px/20px Noto Sans KR; text-align:center; display:block; margin:10px auto 0; color:#222;}
ul.ebookList li div{margin:20px auto 0; text-align:center;}

.MarList{display:flex; justify-content:space-between; flex-wrap:wrap;}
.MarList dl{width:47%; margin:0 0 3%;}
.MarList dl:nth-of-type(odd){}
.MarList dl dt{}
.MarList dl dt img{width:100%;}
.MarList dl dd{}
.MarList dl dd h4{font:700 20px/20px Noto Sans KR; margin:18px 0 12px;}
.MarList dl dd p{font:300 16px/22px Noto Sans KR; color:#333;}

.b2bList{}
.b2bList ul li img{width:auto; display:block; margin:auto;}

.busiBot{}
.busiBot h4.busiBotTitle{font:700 24px/24px Noto Sans KR; text-align:center; margin:0 0 40px;}
.busiBot p.busiBotTitleS{font:400 15px Noto Sans KR; margin:0 auto 40px; text-align:center; color:#222;}

.busiBotApp{width:100%; max-width:774px; margin:auto;}

div.busiBotHom{display:flex;}
div.busiBotHom ul{border-left:1px solid #eb1313; position:relative; margin:auto;}
div.busiBotHom ul li{position:relative; padding:0 0 50px 40px;}
div.busiBotHom ul li:before{content:""; width:15px; height:15px; border-radius:20px; border:1px solid #eb1313; box-sizing:border-box; background:#fff; display:inline-block; position:absolute; top:30px; left:-8px;}
div.busiBotHom ul li:nth-of-type(1):after{content:""; width:34px; height:34px; background:url(/img/busiBotHom01.png)no-repeat center/cover; position:absolute; top:22px; left:-70px;}
div.busiBotHom ul li:nth-of-type(2):after{content:""; width:34px; height:34px; background:url(/img/busiBotHom02.png)no-repeat center/cover; position:absolute; top:22px; left:-70px;}
div.busiBotHom ul li:nth-of-type(3):after{content:""; width:34px; height:34px; background:url(/img/busiBotHom03.png)no-repeat center/cover; position:absolute; top:22px; left:-70px;}
div.busiBotHom ul li:nth-of-type(4):after{content:""; width:34px; height:34px; background:url(/img/busiBotHom04.png)no-repeat center/cover; position:absolute; top:22px; left:-70px;}
div.busiBotHom ul li:nth-of-type(5):after{content:""; width:34px; height:34px; background:url(/img/busiBotHom05.png)no-repeat center/cover; position:absolute; top:22px; left:-70px;}
div.busiBotHom ul li:last-of-type{padding:0 0 0 40px;}
div.busiBotHom ul li h1{width:200px; height:70px; background:rgba(255,0,78,0.6); color:#fff; font:500 18px Noto Sans KR; text-align:center; box-sizing:border-box; display:table-cell; vertical-align:middle;}
div.busiBotHom ul li:last-of-type h1{background:rgba(255,0,78,1);}
div.busiBotHom ul li span{display:table-cell; vertical-align:middle; padding:0 0 0 40px; font:400 16px Noto Sans KR; word-break:keep-all;}


/* 쇼핑몰신청 LAYER */
.shop_request{height:500px; overflow-x: hidden; overflow-y: auto;}
.shop_request table.regist{width:98%; border-collapse:collapse;}
.shop_request table.regist th,
.shop_request table.regist td{border-top:1px solid #888; border-bottom:1px solid #888; padding:8px 4px;}
.shop_request table.regist th{font:400 14px/14px Noto Sans KR; vertical-align:middle;}
.shop_request table.regist td{font:400 14px/14px Noto Sans KR;}
.shop_request table.regist td.textareaWrap{padding:12px 0 18px;}
.shop_request table.regist td strong{font:500 15px/15px Noto Sans KR; display:block; margin:6px 0 6px;}
.shop_request table.regist textarea{width:100%; height:100px; font:400 14px/14px Noto Sans KR; border:1px solid #a8a8a8;}
.shop_request table.regist label{font:400 14px/14px Noto Sans KR; color:#222; display:block; margin:4px 0 0;}
.shop_request table.regist input,
.shop_request table.regist select{border:1px solid #a8a8a8; height:30px;}
.shop_request table.regist input[type=checkbox]{width:auto; height:auto; vertical-align:text-top;}
.shop_request table.regist .gray{background-color:#ddd; border:0; padding:5px; vertical-align:top; font:400 14px/20px Noto Sans KR;}


/* SUB_CONTACT */
div.contactWrap{display:flex; align-items:center;}
div.contactWrap .contactL{width:30%;}
div.contactWrap .contactL h1{font:500 42px/48px Noto Sans KR; word-break:keep-all; color:#222;}
div.contactWrap .contactL h1 strong{font:700 42px/48px Noto Sans KR; color:#ff004e;}
div.contactWrap .contactL span{width:40px; height:2px; background:#ff004e; display:inline-block; margin:50px auto;}
div.contactWrap .contactL dl{display:block; /* margin:0 0 14px; */}
div.contactWrap .contactL dl dt{font:600 17px/23px Noto Sans KR; color:#777; margin-bottom:5px;}
div.contactWrap .contactL dl dd{font:400 17px/23px Noto Sans KR; color:#222;}
div.contactWrap .contactL dl dd a{color:#222;}
div.contactWrap .contactR{width:70%; height:730px;}

div.contactWrap .contactL .d-flex {display:flex; align-items:center; margin-bottom:50px;}
div.contactWrap .contactL .d-flex dl {margin-left: 20px;}
div.contactWrap .contactL .d-flex img {vertical-align:middle;}

/* 포토폴리오 PORTFOLIO  */
.portfolio_section{ margin: 50px auto; width: 95%;}
.portfolio_section .btn_set{overflow:hidden}
.portfolio_section .btn_set li a{float:left; padding: 30px 15px; font-size: 20px;}
.portfolio_section .btn_set li a:before{ width: 8px; height: 8px; content:""; display:block;}
.portfolio_section .btn_set li.on a{color:#d71b29}
.portfolio_section .btn_set li.on a:before{ width: 8px; height: 8px; content:""; display:block; background:#d71b29;  transform: rotate(45deg); margin: 0 auto;}
.portfolio_section .btn_set li.on a:before{transition:all 0.5s ease-in 0.2s}
.portfolio_item_wrap{width:100%}
.portfolio_item{width:calc(96%/4); margin:10px 0.5%;}
.portfolio_item img{width:100%; display: block; }
.portfolio_item .img{content: ""; display: block;  border: 0px solid #fff;box-sizing: border-box;transition:border 0.5s; aspect-ratio: 6 / 5; width: 100%;}
.portfolio_item:hover .img{border: 8px solid #fff; }
.portfolio_item .text{ display: block; box-sizing: border-box; height: 100px;}
.portfolio_item .text b{ font-size: 20px;display: block;}
.portfolio_item .text span{}
/*포트폴리오 팝업*/
.p_pop_wrap {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); font-size:0; display:none; z-index:99999999;}
.p_pop_wrap .pop_inner {overflow-y: scroll; display:inline-block;/*  padding:0 0 100px 0; */ background:#fff; width:50vw; height:90vh; vertical-align:middle; font-size:15px; margin:0 auto; position:relative; top:50%; left:50%; transform:translate(-50%,-50%);}
.p_pop_wrap .pop_inner .pop_box {margin:0 auto;}
.p_pop_wrap .pop_inner .pop_box h2 {font-size:45px; font-weight:700; text-align:center; width:100%; margin-bottom:20px;}
.p_pop_wrap .pop_inner .pop_box ul {display:flex; margin:0 auto; width:70%;}
.p_pop_wrap .pop_inner .pop_box ul li {padding: 10px 0; margin: 2px 0;}
.p_pop_wrap .pop_inner .pop_box ul .pop_color {display:flex; align-items:center;}
.p_pop_wrap .pop_inner .pop_box ul .pop_color .pop_circle {width: 18px; height:18px; border-radius:50%;}
.p_pop_wrap .pop_inner .pop_box ul .pop_txt1 {width:30%; font-size:18px; font-weight:600; color:#111;}
.p_pop_wrap .pop_inner .pop_box ul .pop_txt2 {width:70%; font-size:18px; font-weight:200;}
.p_pop_wrap .pop_inner .pop_box ul .pop_txt2 a {color:#5f5f5f;}
.p_pop_wrap .pop_inner .pop_box ul .pop_txt2 a:hover {color:#111;}
.p_pop_wrap .pop_inner .pop_content {margin-top:100px;}
.p_pop_wrap .pop_inner .pop_content .pop_txt3 {font-size:18px; font-weight:200; margin:0 auto 100px; width:85%;} 
.p_pop_wrap .pop_inner .pop_content .pop_txt3 .pop_bar {font-weight:500;}
.p_pop_wrap .pop_inner .pop_content .pop_txt3 .pop_bar::before {content:""; display:inline-block; width: 20px; height:2px; background-color:#111;}
.p_pop_wrap .pop_inner .pop_content .pop_go {padding: 20px; border: 1px solid #111; margin:0 auto 100px; display:block; transition:all 0.3s; width: 200px; text-align:center;}
.p_pop_wrap .pop_inner .pop_content .pop_go:hover {background: transparent; box-shadow: inset 0 -63px 0 0 #111; color:#fff;}
.p_pop_wrap .pop_inner .pop_content .news-btn {display:flex; justify-content:space-between; flex-wrap:wrap; margin:30px 0 100px; width:100%;}
.p_pop_wrap .pop_inner .pop_content .news-btn a {display:inline-block; padding:15px 0; width:150px; margin:0;}
.p_pop_wrap .pop_inner .pop_btn_close {position:absolute; top:50px; right:50px;}
/* .p_pop_wrap .pop_inner .pop_content {margin-top:20px;} */
.p_pop_wrap .pop_inner .pop_img {margin-bottom:20px; width:100%;}
.p_pop_wrap .pop_inner .pop_top_img {margin-bottom:100px; width:100%;}
.p_pop_wrap .pop_inner .pop_top_img .pop_detail_img img {width:100%;}
.p_pop_wrap .pop_inner .pop_img .pop_detail_img {text-align:center;}
.p_pop_wrap .pop_inner .pop_img .pop_detail_img img {width:100%;}
.p_pop_wrap .pop_inner .pop_img .pop_detail_img img.w-85 {width:85%;}
.fw-500 {font-weight:500;}
.mt-10 {margin-top:10px;}
.mt-20 {margin-top:20px;}
.mt-30 {margin-top:30px;}
.mb-20 {margin-bottom:20px;}
.mb-50 {margin-bottom:50px;}
.fs-15 {font-size:15px;}

@media (max-width:768px) {

}
@media (max-width:425px) {
	/* div.Container.solution{background-image: url(/img/m_main_b_solution_2.png); background-size:contain; background-position: right -20px bottom 100px; }
	div.Container.solution div.subCon {margin: 0 auto 180px !important;} */
	
	
	.portfolio_item .text b {font-size:16px;}
	.portfolio_section .btn_set li a {padding:10px; font-size:18px;}

	.p_pop_wrap .pop_inner .pop_box ul .pop_txt1 {width:50% !important;}
	.p_pop_wrap .pop_inner .pop_box ul .pop_txt2 {width:50% !important; padding-left:5px;}
	.p_pop_wrap .pop_inner .pop_box ul .pop_color {padding-left:5px;}

	.Container-top div.subCon {margin:0 auto 150px !important;}
	/* div.Container.solution {background-position:right 0 bottom 30px;} */

}