@charset "utf-8";
/* CSS Document */

.header{ height:139px; width:100%; position:fixed; display:block;  background:url(../images/head-bg.png) left top repeat-x; z-index:1; top:0px;}
.logopart{ margin:12px 0 0 7px; float:left; }
.button-bar{ float:right; margin:34px 0 0 0;}
.banner-part{ margin:102px 0 0 0; background:url(../images/bg1.jpg) center -10px no-repeat; }
.banner-part2{ margin:102px 0 0 0; background:url(../images/bg2.jpg) center -14px no-repeat; }
.title01{ width:100%; text-align:center; font-size:40px; font-family: 'colabthin', Arial, Helvetica, sans-serif; color:#FFF; letter-spacing:-1px; margin:88px 0 0 0;}
.title02{ width:100%; text-align:left; font-size:30px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#222222; letter-spacing:-1px; margin:45px 0 20px 0;}
.sad-01{ width:100%; background:url(../images/back01.png) left 1px repeat-x;}

.text01{ text-align: justify; font-size:16px; font-family: 'sourcesans', Arial, Helvetica, sans-serif; color:#222222; line-height:20px; margin-bottom:20px; }
.border01{ border-bottom:1px solid #cccccc; padding-bottom:30px} 
.border02{ border-bottom:1px solid #cccccc; padding-bottom:30px; margin-bottom:30px;} 

.sr-1{ background:url(../images/sr-01.png) left bottom repeat-x #30d5f3; width:100%; display:block; height:160px;  -webkit-border-radius:7px; border-radius:7px; -webkit-box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); }

.sr-2{ background:url(../images/sr-02.png) left bottom repeat-x #fbc357; width:100%; display:block; height:160px;  -webkit-border-radius:7px; border-radius:7px; -webkit-box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); }

.sr-3{ background:url(../images/sr-03.png) left bottom repeat-x #e12e2e; width:100%; display:block; height:160px;  -webkit-border-radius:7px; border-radius:7px; -webkit-box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); }

.sr-4{ background:url(../images/sr-04.png) left bottom repeat-x #b5d32f; width:100%; display:block; height:160px;  -webkit-border-radius:7px; border-radius:7px; -webkit-box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); }

.sr-5{ background:url(../images/sr-05.png) left bottom repeat-x #b03b79; width:100%; display:block; height:160px;  -webkit-border-radius:7px; border-radius:7px; -webkit-box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.2); }

/*.sr-1:hover .sr-ico1, .sr-2:hover .sr-ico2, .sr-3:hover .sr-ico3, .sr-4:hover .sr-ico4, .sr-5:hover .sr-ico5{ margin-top:19px}
*/
.orange{ color:#ff6c00;}

.sr-ico1{ width:116px; height:108px; float:left; background:url(../images/srico-1.png) left top no-repeat; margin:24px 0 0 0;}
.sr-ico2{ width:116px; height:108px; float:left; background:url(../images/srico-2.png) left top no-repeat; margin:24px 0 0 0;}
.sr-ico3{ width:116px; height:108px; float:left; background:url(../images/srico-3.png) left top no-repeat; margin:24px 0 0 0;}
.sr-ico4{ width:116px; height:108px; float:left; background:url(../images/srico-4.png) left top no-repeat; margin:24px 0 0 0;}
.sr-ico5{ width:116px; height:108px; float:left; background:url(../images/srico-5.png) left top no-repeat; margin:24px 0 0 0;}
.sr-title1{ margin:35px 15px 0 0; width:200px; float:left; }
.sr-title1 .text{font-size:13px; line-height:19px; font-family: 'sourcesans' , Arial, Helvetica, sans-serif; color:#FFF; text-align:justify; width:100%; white-space: normal !important;}
.sr-title1 .title{ font-size:24px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#FFF; display:block; letter-spacing:-1px; margin-bottom:5px;  }

.company-box01{ background-color:#f3f3f3; padding:35px 20px; }
.company-box02{ float:left; width:16%; margin:0; text-align:center;}
.company-box02:first-child{ margin-left:32px;}
.company-box02 img{ width:200px; margin:0 auto;}

.fotter-part{ border-top:5px solid #dcdcdc; margin-top:25px; padding:20px 0;}
.small-logo{ float:left; margin:0 65px 0 0;}
.fotter-link{ float:left; display:block; padding:33px 0 0 0; }
.fotter-link a{ padding:50px 40px 0 0; font-size:15px;}
.copyright-text{ float:right; width:215px; padding:18px 0 0 0; color:#555555; line-height:22px; }



.middle-banner1{ height:231px; background:url(../images/inner-banner1.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.solu-banner{ height:231px; background:url(../images/solutions-banner.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.cus-app-banner{ height:231px; background:url(../images/custom-app-banner.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.erp-banner{ height:231px; background:url(../images/erp-banner.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.web-banner{ height:231px; background:url(../images/web-design.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.pro-confi-banner{ height:231px; background:url(../images/pro-confi-banner.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.crm-banner{ height:231px; background:url(../images/crm-banner.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }




.middle-banner2{ height:231px; background:url(../images/inner-banner2.jpg) left top no-repeat; margin:40px 0 0 0; border-bottom:1px solid #fff; }
.title03{  text-align:left; font-size:30px; font-family: 'colabthin', Arial, Helvetica, sans-serif; color:#222222; letter-spacing:-1px; margin:99px 0 0px 21px; }
.title04{  text-align:left; font-size:30px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#222222; letter-spacing:-1px; margin:30px 0 20px 0;}

.brad-come{ font-size:13px; padding:21px 0 8px 21px; background:url(../images/back-sad2.png) left top no-repeat; background-size:cover; }
.brad-come span{ padding:0 16px;}

.services-box01{ width:29%; float:left; margin-right:2.0%; margin-left:2.0%; margin-bottom:2.5%;}
.services-box02{ background-color:#ededed;  min-height:296px; margin-bottom:1px; }
.srs-title{font-size:26px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#FFF; letter-spacing:-1px; padding:29px 0 0 0;}
.srs-text{ font-size:13px; padding:23px; line-height:22px; text-align:justify; color:#000000 !important;}

/*.services-box01:hover .srs-1, .services-box01:hover .srs-2, .services-box01:hover .srs-3, .services-box01:hover .srs-4, .services-box01:hover .srs-5 { margin-top:2px;}*/

.sr-box1{ height:93px; width:100%; display:block; background:url(../images/sr-01.png) left bottom repeat-x;}
.srs-1{ width:80px; margin:7px 18px 0 0; height:80px; float:left; background:url(../images/srico-1.png) left top no-repeat; background-size:cover;}

.sr-box2{ height:93px; width:100%; display:block; background:url(../images/sr-02.png) left bottom repeat-x;}
.srs-2{ width:80px; margin:7px 18px 0 0; height:80px; float:left; background:url(../images/srico-2.png) left top no-repeat; background-size:cover;}

.sr-box3{ height:93px; width:100%; display:block; background:url(../images/sr-03.png) left bottom repeat-x;}
.srs-3{ width:80px; margin:7px 18px 0 0; height:80px; float:left; background:url(../images/srico-3.png) left top no-repeat; background-size:cover; }

.sr-box4{ height:93px; width:100%; display:block; background:url(../images/sr-04.png) left bottom repeat-x;}
.srs-4{ width:80px; margin:7px 18px 0 0; height:80px; float:left; background:url(../images/srico-4.png) left top no-repeat; background-size:cover; }

.sr-box5{ height:93px; width:100%; display:block; background:url(../images/sr-05.png) left bottom repeat-x;}
.srs-5{ width:80px; margin:7px 18px 0 0; height:80px; float:left; background:url(../images/srico-5.png) left top no-repeat; background-size:cover;}

.stratagi-box1{ padding:25px 0 0 0; }
.stratagi-box2{ width:25%; float:left; text-align:center; background:url(../images/br-1.png) 0px 38% repeat-x;}
.stratagi-box2 span{ display:block; font-size:24px; font-family: 'colablig', Arial, Helvetica, sans-serif; display:block; letter-spacing:-1px; margin:25px 0 0 0;}

.text02{ text-align: justify; font-size:22px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#737373; letter-spacing:-1px; line-height:20px; margin-bottom:20px; }

.sd-box1{ float:left; width:60%; padding:2% 6% 0 0; }
.sd-box2{ float:left; width:100%; }

.img-box01{ float:right; width:40%;}
.title05{  text-align:left; font-size:25px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#222222; letter-spacing:-1px; margin:25px 0 20px 0;}
.text03{ text-align: justify; font-size:16px; font-family: 'sourcesans', Arial, Helvetica, sans-serif; color:#222222; line-height:20px; }
.img-box02{ display:block; padding:40px 0 0px 0;}

.liststyle-01{ width:60%;}
.liststyle-01 ul{ list-style-type:none; padding-top:15px;}
.liststyle-01 ul li{ float:left; width:50%; padding-left:30px; background:url(../images/right-sign.png) 2px 14px no-repeat; line-height:40px;}

.liststyle-02{ width:100%;}
.liststyle-02 ul{ list-style-type:none; padding-top:15px;}
.liststyle-02 ul li{ float:left; width:50%; padding-left:30px; background:url(../images/right-sign.png) 2px 14px no-repeat; line-height:40px;}

.liststyle-03{ width:100%;}
.liststyle-03 ul{ list-style-type:none; padding-top:15px;}
.liststyle-03 ul li{ float:left; width:95%; padding-left:30px; background:url(../images/right-sign.png) 2px 10px no-repeat; line-height:32px;}




.contact-box{ width:100%; max-width:760px; margin:0 auto; min-width:300px;}
.contact-title1{ background:url(../images/sad1.png) left bottom repeat-x #3f3f3f; font-size:25px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#fff; line-height:50px; padding:0 0 0 12px; letter-spacing:-1px; min-height:50px;}

.contact-box2{ width:100%; max-width:760px; min-width:290px; padding:50px 30px 30px 30px;}
.contact-box3{ float:left; width:30%; padding:0 3% 0 9%; text-align:left; font-size:13px; color:222222; line-height:35px; margin-bottom:20px;}
.contact-box4{ float:left; width:60%; padding:0 3% 0 2%; margin-bottom:20px; }
.contact-box4 input[type="text"]{ border:1px solid #c2c2c2;  -webkit-border-radius: 3px; border-radius: 3px; width:100%; height:35px; -webkit-box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1); font-size:13px; }
.contact-box4 textarea{ border:1px solid #c2c2c2;  -webkit-border-radius: 3px; border-radius: 3px; width:100%; height:130px; -webkit-box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1); font-size:13px; padding-top:7px; }
.sub-button{ background:url(../images/buttonback-2.png) left bottom repeat-x; border:none; font-size:15px; color:#fff; text-align:center; display:block; height:33px; float:left; margin-right:15px; padding:0 16px; text-transform:uppercase; -webkit-border-radius:4px; border-radius:4px; text-indent:0; line-height:33px; }
.sub-button:hover{ background:url(../images/buttonback-2-hover.png) left bottom repeat-x;  }
.sub-button2{ background: url(../images/buttonback-1-hover.png) left bottom repeat-x; border:none; font-size:15px; color:#222; text-align:center; display:block; height:33px; float:left; margin-right:15px; padding:0 16px; text-transform:uppercase; -webkit-border-radius:4px; border-radius:4px; text-indent:0; line-height:33px; }
.sub-button2:hover{ background: url(../images/buttonback-1-hover2.png) left bottom repeat-x; }
.contact-box4 span{ float:left; width:30%; padding:1px 0 0 0;}



.login-box1{ width:100%; max-width:510px; min-width:290px; padding:35px 30px 0px 30px; margin:0 auto;}
.login-box2{ width:100%; padding:0 3% 0 3%; text-align:left; font-size:14px; color:222222; line-height:35px; margin-bottom:20px;}
.login-box2 input[type="text"], .login-box2 input[type="password"], .login-box2 select{ border:1px solid #c2c2c2;  -webkit-border-radius: 3px; border-radius: 3px; width:100%; height:35px; -webkit-box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1); font-size:14px; }
.login-box1 textarea{ border:1px solid #c2c2c2;  -webkit-border-radius: 3px; border-radius: 3px; width:100%; height:130px; -webkit-box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 2px 2px 4px 2px rgba(0, 0, 0, 0.1); font-size:14px; padding-top:7px; }

.login-box3{ width:50%; float:left; padding:0;}
.login-box4{ width:48%; float:left; padding:0;}
.login-box4+.login-box4{ width:48%; float:right; padding:0;}
.sub-button3{ background:url(../images/buttonback-2.png) left bottom repeat-x; border:none; font-size:15px; color:#fff; text-align:center; display:block; height:33px; float:right; margin-right:0px; padding:0 20px; text-transform:uppercase; -webkit-border-radius:4px; border-radius:4px; text-indent:0; line-height:33px; }
.sub-button3:hover{background:url(../images/buttonback-2-hover.png) left bottom repeat-x;}

.login-box2 input[type="checkbox"]{ border:1px solid #c2c2c2;  -webkit-border-radius: 3px; border-radius: 3px; width:25px; height:35px; font-size:14px; float:left; line-height:35px; padding:0px; margin:0px; }
.login-title1{ background:url(../images/br-1.png) left 50% repeat-x; font-size:20px; width:100%; color:#b0b0b0; display:block; height:35px; text-align:center; margin:20px 0;}
.login-title1 span{ width:auto; padding:0px 7px; background-color:#fff; margin:0 auto; text-align:center; line-height:35px;}

.text05{ font-size:13px; color:#b0b0b0; line-height:15px;}

.about-box1{ width:28%; float:left; margin-right:8%; padding-bottom:20px; border-bottom:4px solid #4cb0e2;}
.about-box2{ width:28%; float:left; margin-right:8%; padding-bottom:20px; border-bottom:4px solid #f16702;}
.about-box3{ width:28%; float:right; 	padding-bottom:20px; border-bottom:4px solid #88be48;}
.abouttext1{ text-align: justify; font-size:14px; font-family: 'sourcesans', Arial, Helvetica, sans-serif; color:#222222; line-height:20px; margin:25px 0 15px 0; }


.erp-box1{ display:block; min-height:115px; border-bottom:1px dotted #9b9b9b;}
.erp-title1{ float:left; width:23%;  font-family: 'colablig', Arial, Helvetica, sans-serif; color:#737373; font-size:22px; margin-top:3.5%; line-height:25px;}
.erp-icon{ float:left; width:7%; height:80px; background:url(../images/arrow_01.png) left top no-repeat; margin-top:2%; margin-right:3%;  background-size:cover; min-width:80px; display:block; }
.erp-title2{ float:left; width:60%; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#e55304; font-size:18px; margin-top:4.5%; line-height:25px; }

.title06{  text-align:left; font-size:25px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#e55304; letter-spacing:-1px; margin:25px 0 20px 0;}
.title07{ width:100%; text-align:left; font-size:30px; font-family: 'colablig', Arial, Helvetica, sans-serif; color:#222222; letter-spacing:-1px; margin:15px 0 20px 0;}

.float-img{ float:right; padding:0 0 3% 4%;}
.crm-text{ margin-top:5%;}

.pc-icon{ float:left; width:7%; height:80px; background:url(../images/arrow_02.png) left top no-repeat; margin-top:2%; margin-right:3%;  background-size:cover; min-width:80px; display:block; }
.pc-box1{ float:left; width:85%; padding:0 15px; margin-top:2.5%;}
.pc-title1{ font-family: 'sourcesans', Arial, Helvetica, sans-serif; color:#e55304; font-size:18px; line-height:25px;}
.pc-title2{ font-family: 'sourcesans', Arial, Helvetica, sans-serif; color:#222222; font-size:16px; line-height:20px; padding-bottom:20px;}




