/*
 * Nanum Gothic (Korean) http://www.google.com/fonts/earlyaccess
 */
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot);
  src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.ttf) format('truetype');
}

/*
* Noto Sans KR (korean) http://www.google.com/fonts/earlyaccess
 */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 400;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 700;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 900;
   src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');
 }


*{font-family: 'Nanum Gothic','Noto Sans KR', sans-serif;
 /* -webkit-text-size-adjust:none;
 -ms-text-size-adjust:none;
 -moz-text-size-adjust:none;
 text-size-adjust:none;*/
 font-size:14px;  line-height:1.7; }
body, ul, li {
margin:0; padding:0
}
li{list-style:none}
a, a:hover, a:active, a:link{text-decoration:none; color:#000}
.moreBtn{color:#52bdef; text-align:center; margin:8px 0; font-weight:700}
.title{font-weight:900; font-size:20px; display:block; line-height:1.7; word-break:keep-all;}
.title a{font-size:20px}
.text{font-size: 14px; padding: 8px 0; display:inline-block; box-sizing:border-box; /*word-break:keep-all;*/}
.AllWhite{color:#fff}
.AllBlack{color:#000}
.AllCenter{text-align:center}
.textleft{text-align:left}
.decoUnderline{text-decoration:underline}
.NotoSansKR{font-family: 'Noto Sans KR', sans-serif;}
.Font400{font-weight:400}
.Font700{font-weight:700}
.ContentMore{display:inline-block; background:#b7c7cf; padding:0 2px; vertical-align:middle; border-radius:3px; position:relative}/*background:#bbb*/
.minus, .plus{display:inline-block; margin-left:5px; position:absolute; top:-1px; bottom:-1px; border-radius:0 3px 3px 0; border:1px solid #bbb; background:#6f8aa8;  background-position:center; background-repeat:no-repeat; background-size:16px auto; width:20px;}
.plus{background-image:url(../images/plus.png);}
.minus{background-image:url(../images/minus.png);}
.newservicemark{color:#ce003a; font-weight:bold; font-size:12px; margin-top:-12px; background:#fff600; display:inline-block}
.BackImage{position:relative; overflow:hidden; height:130px; margin-top:20px;background-size:cover; background-position:center}
.ButtonRequestAuth{position:absolute; top:12px; right:10px; border:1px solid #999; font-size:12px; padding:2px 3px 4px; background:#fff; font-weight:bold;}
 .RadioStyle input[type='radio'] {
    display: none;
}

.RadioStyle input[type='radio']:checked + label {
    background: #fff;
    background-image: url(../images/radio-check.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 16px;
}
.RadioStyle input[type='radio'] + label {
    display: inline-block;
    cursor: pointer;
    border: 1px solid #696969;
    border-radius:50px;
    background: #fff;
    width: 20px;
    height: 20px;
    vertical-align: middle;
    padding: 0;
    vertical-align: middle;
}
.TableDeisgn{display:table; width:100%}
.TableDeisgn .tr{display:table-row}
.TableDeisgn .th, .TableDeisgn .td{display:table-cell;}
.TableDeisgn .th{font-size:18px}
.TableDeisgn textarea, .TableDeisgn input[type="text"], input[type="tel"], input[type="email"]{border-radius:1px; padding:11px 5px 13px 15px; width:100%; box-sizing:border-box; font-size:14px; min-height:30px; vertical-align:middle; 
                                                       margin-bottom:6px; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; border:1px solid #ddd; background:#fff; -webkit-appearance:none; -moz-appearance:none; appearance:none}
.TableDeisgn textarea{min-height:100px;}
.TableDeisgn input::-webkit-input-placeholder, .TableDeisgn textarea::-webkit-input-placeholder { color:#666 }
.TableDeisgn input::-moz-placeholder, .TableDeisgn textarea::-moz-placeholder { color:#666 }



.header{width:100%;}
.header-top{min-height:57px;  box-sizing:border-box; padding:10px 15px; position:relative; display:table; width:100%; border-bottom:1px solid #dbdbdb; background:#fff; }
.header-top#sliderHeader{z-index:10}
.header-list {background:rgba(0,0,0,.08); border-bottom:1px solid #dbdbdb; }
.header-list ul{display:table; width:100%; padding:9px 0}
.header-list li{display:table-cell; width:24%; text-align:center; font-size:14px; white-space:nowrap; font-weight:900; color:#007cce;}

.header .menu{display:table-cell; height:37px;; text-align:right}
.header .menu img{height:27px; vertical-align:middle}
.header .menu .Main-Menu{display:inline-block; background:#fff600; font-size:12px; line-height:normal; vertical-align:middle; text-align:center}
.header .logo{display:table-cell}
.header .logo img{height:37px; vertical-align:middle}


/*메인 슬라이드*/
.MainBox{ background-size:cover; background-position:center; background-repeat:no-repeat; text-align:center; padding:15px; min-height:550px; display:table; width:100%; box-sizing:border-box; padding-top:60px; padding-bottom:60px}
.MainBoxMiddle{display:table-cell; vertical-align:middle}
.mentBox{padding:10px; font-size:20px; font-weight:bold; text-align:center; color:#fff}
.ERP_ad{background-image:url(../images/back04.png);}
.GW_ad{background-image:url(../images/back-img2.png);}
.main_function{margin:15px 0; font-weight:700;}
.main_function div{border:2px solid #000; border-radius:15px; display:inline-block; padding:3px 5px; margin-bottom:3px; background:rgba(255,255,255,0.3)}
.OnlineDemo-table{display:table; margin:30px auto 0; width:205px; table-layout:fixed;}
.OnlineDemo-td{border-radius:100px;  display:table-cell; width:100px; height:100px; vertical-align:middle; color:#fff; line-height:normal}
.Demo-td{background:#adadad;}
.Online-td{background:#2282c1;}


.NewService .service-block{border:1px solid #fff; background:rgba(255,255,255,.7); border-radius:3px; padding:15px 10px; text-align:center}
.NewService .ContentMore{background:#ededed}
/*
.mySlides {display:none; background-position:top center; background-repeat:no-repeat; width:100%; height:100%;}
.slideshow-container {width:100%;position: relative;margin: auto; box-sizing:border-box; height:300px; overflow:hidden}
.mySlides .text {font-size: 14px; padding: 8px 0; display:inline-block; position:absolute; top:70px; width:180px}
.numbertext {color: #f2f2f2; font-size: 12px; padding: 8px 12px; position: absolute; top: 0; display:none;}
.dot {height: 10px; width: 10px; margin-left:2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease;}
.active {background-color: #6aa7cc;}
.fade { -webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s;}
        @-webkit-keyframes fade {
          from {opacity: .4} 
          to {opacity: 1}
        }

        @keyframes fade {
          from {opacity: .4} 
          to {opacity: 1}
        }

        /* On smaller screens, decrease text size 
        @media only screen and (max-width: 300px) {
          .text {font-size: 11px}
        }
.slideImage1{background:url(../images/back-img1.png); }
.slideImage2{background:url(../images/back-img2.png); }
.ImagePosition{padding:50px 0; width:550px; margin:0 auto; position:relative; line-height:1.4; left:-180px}
.ImagePosition img{width:360px; display:inline-block}
.ImagePosition .title{font-weight:600; margin-bottom:10px; line-height:1.4; font-size:23px}
*/
/*메뉴*/
.menu-box{position:fixed; top:0; left:0; bottom:0; width:100%; min-height:100%; display:none; z-index:100}
.menu-blind{position:fixed; background:rgba(0,0,0,.55); width:100%; min-height:100%}
.menu-list{width:263px; background:#f4f4f4; position:absolute; top:0; right:0; bottom:0; overflow-y:scroll}
.menu-list li{display:block; box-sizing:border-box; border-bottom:1px solid #d5d5d5; position:relative}
.menu-list ul>li>ul>li{ background:#fff; font-family:'Noto Sans KR', sans-serif;}
.menu-list ul>li>ul>li>a{font-family:'Noto Sans KR', sans-serif;}
.menu-list ul>li>ul>li:last-child{border-bottom:0px;}
.menu-list ul>li>ul>li>ul>li{padding-left:35px; color:#333}
.menu-list ul>li>ul>li, .menu-list .title{line-height:1.7; min-height:50px; padding:10px 10px 10px 20px; box-sizing:border-box;}
.menu-list .title, .menu-list .title a{ font-size:18px}
.arrow-low{background:url(../images/arrow-low.png) center; background-size:29px 29px; background-repeat:no-repeat; width:29px; height:29px; display:block; position:absolute; right:10px; top:10px}
.NewMark{background:url(../images/new-mark.png) center; background-size:20px 20px; background-repeat:no-repeat; width:20px; height:20px; display:inline-block; vertical-align:middle; margin-left:3px}
.close-menu{position:absolute; right:263px; height:50px; width:50px; padding:10px; background:#bfbfbf; background-image:url(../images/close.png); background-position:center; background-size:40px 40px; box-sizing:border-box}

/*footer*/
.footer{position:relative; color:#fff;}
.footer01, .footer02{background:rgba(0,0,0,.3); width:100%; padding:10px; box-sizing:border-box; position:relative;}
.footer02{background:#444}
.footerBack{background-image:url(../images/footer-img.jpg); background-size:auto 100%; background-position:center; background-repeat:no-repeat}
.FooterText{text-align:center; line-height:1.7; font-size:18px; margin:8px 0 25px}
.FooterBtnBox{width:300px; margin:0 auto; display:table}
.FooterBtnBox div{display:table-cell; width:33%; text-align:center}
.FooterBtnBox div img{width:80%}
.FooterBtnBox div p{font-size:12px; margin:5px 0; color:#fff}
.TopBtn{position:absolute; border:1px solid #fff; border-radius:3px; background:rgba(255,255,255,.15); padding:2px 5px; font-size:11px}
.PCVerBtn{border-radius:50px;}
.PCVerBtn a{color:#fff; font-size:11px}
.FooterAddress{font-size:12px; margin:8px 0}
.FooterAddress img{vertical-align:middle; margin-right:3px}
.Tel{font-weight:700; margin-bottom:15px}
.Tel a{color:#fff; text-decoration:none; font-size:18px}
.Address{font-size:12px}
.Copyright{opacity:.3; font-size:12px}
.QuickBtn{position:fixed; overflow:hidden; z-index:100; right:10px; bottom:0px; display:none;}
.QuickBtn li{width:40px; height:40px; margin-bottom:10px; color:#000; border:1px solid rgba(0,0,0,0.06); /*border:1px solid #8f8f8f;*/ border-radius:100px; background:rgba(255,255,255,.95); background-size:38px 38px; background-position:center; background-repeat:no-repeat; box-shadow:0px 1px 1px rgba(0,0,0,0.2)}
.QuickBtn li.top{background-image:url(../images/top.png);}
.QuickBtn li.app{background:#c02900; background-image:url(../images/app-down.png); background-size:38px 38px; background-position:center; background-repeat:no-repeat;}
.QuickBtn li.demo{background:#898989; background-image:url(../images/demo.png); background-size:38px 38px; background-position:center; background-repeat:no-repeat;}
.QuickBtn li.online{background:#137bbf; background-image:url(../images/online.png); background-size:38px 38px; background-position:center; background-repeat:no-repeat;}
.QuickBtn li.call{background:#ffd800; background-image:url(../images/call-2.png); background-size:38px 38px; background-position:center; background-repeat:no-repeat;}
.QuickBtn li a {
    width: 40px;
    display: block;
    overflow: hidden; 
    height: 40px;
    border-radius: 100px;
    color:rgba(0,0,0,0);
}
.QuickBtn-app li.app{width:60px; height:60px; background-size:50px 50px;}

/*index.aspx*/
 .content-block{box-sizing:border-box; padding:0 20px}
 .erp_content{background:#2282c1; padding:10px; margin:0 auto; text-align:center;}
 .gw_content{background:#085c94; padding:10px; margin:0 auto; text-align:center;}
 .MainContent p{width:300px; margin:10px auto 30px;}
 
 .Service-title{background-image:url(../images/-.png); background-position:center;}
 .Service-title p{padding:2px 4px; display:inline-block; box-sizing:border-box; font-weight:700; font-size:18px; margin:0; width:auto}
 .erp_content .Service-title p{background:#2282c1;}
 .gw_content .Service-title p{background:#085c94;}

/*서브페이지 공통 CSS*/ 
 .TitleBar{background:rgba(0,0,0,.1); padding:10px 10px;}
 .TitleBar-content{position:relative}
 .TitleBar .title{font-weight:400; font-size:18px; margin-right:90px}
 .OlineCounselBtn{position:absolute; right:0; top:0; border:1px solid #003e66; border-radius:5px; padding:2px 8px; background:#137bbf; color:#fff; font-size:12px} 
 .OlineCounselBtn a{color:#fff}
 .JumpBack ul{background:#f6f6f6}
 .JumpBack li{padding:30px 0; border-bottom:1px solid rgba(0,0,0,.13);}
 .JumpBack li:last-child{border-bottom:0px}
 .JumpBack li:nth-child(2n){background:#fff}
 .JumpBack ul li ul, .JumpBack ul li ul li:nth-child(2n){background:transparent}
 .JumpBack ul li ul li {padding:0; border-bottom:0px}
 .JumpBack .service li:nth-child(2n){background:#fff}
 .service ul{margin:15px 0px;}
 .service li{list-style:none; display:inline-block; width:30%; min-height:50px; box-sizing:border-box; margin:4px 2px; text-align:center; vertical-align:middle; padding:7px 0; background:#fff}
 .service.ImageResize li{ width:46%}
 .service li img{width:100%}
 .JumpBack ul li .service li{padding: 7px 0;}
 .JumpBack .padding-re{padding:30px 0 60px}
 
 .ContentList img{width:100%}
 .ContentList .title{padding:0 0 10px; } /*padding: 10px 0*/
 .ContentList .title span{padding-bottom:3px; border-bottom:1px solid #000; font-size:18px; line-height:1.7;}/*title의 서브타이틀로 사용*/
 .contentBox{padding:0 20px 30px; word-break:keep-all; position:relative; box-sizing:border-box}
 .ListBox{width:100%; background:#fff; border:1px solid #cecece; border-radius:5px; padding:10px 20px; margin-top:10px} /*padding:20px 20px 0;*/
 .ListHeader{padding-bottom:10px; font-weight:700}
 .ListHeader.fail{color:#ff005a}
 .ListHeader.success{color:#0063d3;}
 .ListStyle li{margin-left:10px; margin-bottom:8px; text-align:left}
 .ListStyle li::before{content:'- '; margin-left:-10px}
 .MarkTop{padding:5px 0;}
 .BusinessMark{border-radius:3px; color:#fff; background:#2a9e1b; /*border:1px solid #cecece;*/ padding:3px 5px; display:inline-block; text-align:left; font-weight:bold; margin-left:3px; margin-top:3px}/*background:#2a9e1b; background:#4eac99;*/
 .IntroductionMark{border-radius:3px; color:#fff; background:#b40000; padding:3px 5px; display:inline-block; text-align:left; font-weight:bold; margin-top:3px}
 .CustomerLogo{background:#fff; width:200px; margin:0 auto; padding:10px; border-radius:5px}
 
 /* 온라인/방문상담신청, 데모신청 */
 .SelectboxStyle {
    position: relative;
    width: 100%;
    background: url(../images/select_arrow-64.png) right 10px center no-repeat;
    background-size: 16px 16px;
    border-radius:1px; border:1px solid #ddd; padding:11px 5px 13px 15px; box-sizing:border-box;
    margin-bottom: 6px;
    background-color: #fff;
}
.SelectboxStyle label {
    position: absolute;
    font-size:14px;
    top: 12px;
    left: 12px;
    letter-spacing: 1px;
    color:#666;
}
.SelectboxStyle select {
    width: 100%;
    padding: 0 10px;
    opacity: 0;
    filter: alpha(opacity=0);
}
 /*주요구축사례*/
.AcodianList .title div{font-size:18px; padding-right:30px; box-sizing:border-box; position:relative}
.AcodianList .title, .AcodianList .ListStyle{padding:15px 20px; border-bottom:1px solid #cecece;}
.AcodianList .ListStyle{background:#fffbe5;}
.AcodianList .title span{  vertical-align:middle;top:auto;  border-bottom-width:0px; display:inline-block; margin-left:5px; float:right}

@media screen and (min-width:600px)
{
    
    /*폰트사이즈 참고
                         phone          pad
             title       20px          30px
             sub-title   18px          24px
             text        14px          19px
    */
    .title,
    .title a,
    .mentBox
    {font-size:30px}
    .menu-list .title a{font-size:20px}
    .text,
    .main_function div,
    .ContentMore{font-size:19px}
    .newservicemark{margin-top:-20px}
    .OlineCounselBtn{font-size:14px; top:5px}
    .header-list li{font-size:16px}
   
   .MainBox{height:650px}
   .OnlineDemo-table{width:245px;}
   .OnlineDemo-td{width:120px; height:120px}
   .MainContent p{width:100%; margin:20px auto 25px;}
   .Service-title p{font-size:24px; display:inline}
   
   /*서브페이지 공통 CSS*/
   .TitleBar .title{font-size:24px;}
   .ContentList{text-align:center}
   .ContentList img{width:80%}
   .ContentList .title span{font-size:24px}
   .contentBox, .content-block{padding:20px 0 0; width:500px; margin:0 auto 50px;}
   .ListBox{padding:10px 35px}
   .ListHeader{padding-bottom:15px; font-size:19px;}
   .ListStyle li{font-size:19px;}
   .BusinessMark, .IntroductionMark{font-size:19px}
   .CustomerLogo{width:350px}
   .BackImage{position:relative; overflow:hidden; height:300px; margin-top:20px; background-size:cover; background-position:center; background-repeat:no-repeat}
   
   /*주요구축사례*/
   .AcodianList .ListStyle li{font-size:19px; width:500px; margin:0 auto;}
   .AcodianList .title div{font-size:24px; width:500px; margin:0 auto;}
                
   /*footer*/
   .footerBack{background-size:100%;}
   .FooterText{font-size:24px}
   .footer01{padding:30px 10px}
   .footer02{padding:20px 10px}
   .FooterBtnBox{width:400px}
   .FooterBtnBox div p, .Address, .Copyright{font-size:16px}
   .Tel a{font-size:24px}
   
   /*quick 메뉴*/
   
   .QuickBtn li.top,
   .QuickBtn li.app,
   .QuickBtn li.demo,
   .QuickBtn li.online,
   .QuickBtn li.call
   {width:60px; height:60px; background-size:50px 50px}
   
   .QuickBtn-app li.app{width:80px; height:80px; background-size:70px 70px;}
   
    }