
/* sub page*/
.sCenter{width:100%;}

#subWrap{width:100%; float:left; background:#fff; position:relative; z-index:1; padding:80px 0 60px 0; border-top:1px solid #f1f1f1;}
.subContWrap{width:96%; max-width:1200px; margin:0 auto;}

.subTitWrap{width:96%; max-width:1200px;  margin:0 auto; padding-bottom:60px;}
.subTitWrap .subTit{float:left; font-size:30px; font-weight:bold; color:#161616; text-transform:uppercase; padding-bottom:60px;}
.subTitWrap .subLoca{float:right; font-size:14px; color:#292929; padding-top:10px; line-height:20px; display:none;}
.subTitWrap .subLoca span{font-weight:bold;}
.subTitWrap .subLoca span.home{display:inline-block; font-weight:normal; width:20px; height:20px; background:url(../images/bletHome.png) no-repeat center center; float:left;}

.subCont{width:100%; float:left; font-size:16px;}



/* renew style*/
/* login*/
.loginWrap{width:100%; float:left; padding:20px 0;}
.loginWrap .left{width:55%; float:left;}
.loginWrap .left .box{width:90%; float:left; border:1px solid #cccccc; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a;}
.loginWrap .left .box ul{width:100%; float:left;}


.loginWrap .right{width:45%; float:right;}
.loginWrap .right .box{width:90%; float:left; border:1px solid #cccccc; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a;}
.loginWrap .right .box ul{width:100%; float:left;}
.loginWrap .right .box li{width:100%; float:left; margin-bottom:15px; text-align:left;}
.loginWrap .right .box li.port{ width:100%; margin-bottom:10px;}
.loginWrap .right .box li.port input{width:100%; font-size:16px; color:#a7a7a7;  background:#ffffff; font-weight:normal;  
                                     border-radius:4px; padding:16px 10px; height:20px; line-height:20px; border:1px solid #f1f1f1; box-sizing:border-box;}

.loginWrap .right .box2{width:384px; float:left; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a; line-height:180%; text-align:left;}


/* login*/
.login{width:100%; float:left; padding:20px 0;}
.login .left{width:55%; float:left;}
.login .left .box{width:90%; float:left; border:1px solid #cccccc; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a;}
/*.login .left .box ul{width:100%; float:left;}
.login .left .box li{width:100%; float:left; margin-bottom:15px; text-align:left;}
.login .left .box li.idpw{border:1px solid #f1f1f1; width:512px; height:28px; padding:16px 10px; margin-bottom:10px;}
.login .left .box li.idpw input{width:100%; border:none; font-size:16px; color:#a7a7a7;  font-family: 'Open Sans', 'Naum Gothic', serif; background:#ffffff; font-weight:normal;}
.login .left .box li.confirm{font-size:12px; color:#a7a7a7;  font-family: 'Open Sans', 'Naum Gothic', serif; text-align:right !important;}
.login .left .box li.confirm a{color:#a7a7a7;}
.login .left .box li.confirm a:hover{color:#cccccc;}*/

.login .right{width:45%; float:right;}
.login .right .box{width:90%; float:left; border:1px solid #cccccc; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a;}
/*.login .right .box ul{width:100%; float:left;}
.login .right .box li{width:100%; float:left; margin-bottom:15px; text-align:left;}
.login .right .box li.port{border:1px solid #f1f1f1; width:415px; height:28px; padding:16px 10px; margin-bottom:10px;}
.login .right .box li.port input{width:100%; border:none; font-size:16px; color:#a7a7a7;  font-family: 'Open Sans', 'Naum Gothic', serif; background:#ffffff; font-weight:normal;  height:20px; line-height:20px;}*/

.login .right .box2{width:384px; float:left; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a; line-height:180%; text-align:left;}


/*idpw*/

.idpw{width:100%; float:left; padding:20px 0;}
.idpw .left{width:470px; float:left;}
.idpw .left .box{width:400x; float:left; border:1px solid #cccccc; padding:30px 20px 15px 20px;  font-size:12px; color:#5a5a5a;}
.idpw .left .box ul{width:100%; float:left;}
.idpw .left .box li{width:100%; float:left; margin-bottom:15px; text-align:left; font-size:18px;}
.idpw .left .box li.idpw{width:364px; height:28px; padding:16px 10px; margin-bottom:10px; border:1px solid #c2c2c2;}
.idpw .left .box li.idpw input{width:100%; border:none; font-size:16px; color:#a7a7a7;  background:#ffffff; font-weight:normal;}
.idpw .left .box li.confirm{font-size:12px; color:#a7a7a7; }
.idpw .left .box li.confirm a{color:#a7a7a7;}
.idpw .left .box li.confirm a:hover{color:#cccccc;}

.idpw .right{width:470px; float:right;}
.idpw .right .box{width:400px; float:left; border:1px solid #cccccc; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a;}
.idpw .right .box ul{width:100%; float:left;}
.idpw .right .box li{width:100%; float:left; margin-bottom:15px; text-align:left; font-size:18px;}

.idpw .right .box li.idpw{border:1px solid #c2c2c2; width:364px; height:28px; padding:16px 10px; margin-bottom:10px;}
.idpw .right .box li.idpw input{width:100%; border:none; font-size:16px; color:#a7a7a7;  background:#ffffff; font-weight:normal;}
.idpw .right .box li.confirm{font-size:12px; color:#a7a7a7; }
.idpw .right .box li.confirm a{color:#a7a7a7;}
.idpw .right .box li.confirm a:hover{color:#cccccc;}

.idpw .right .box2{width:384px; float:left; padding:30px 20px 15px 20px; font-size:12px; color:#5a5a5a; line-height:180%; text-align:left;}


/* font common*/
.fBold{font-weight:bold;}
.fBold600{font-weight:600;}
.fBold700{font-weight:700;}

/* about > introduction */
.about01{width:100%; display:flex; justify-content:space-between;}
.aboutTxt01{width:30%; padding-right:60px; color:#161616; font-size:1.5rem; line-height:160%;}
.aboutTxt02{width:70%; color:#000; font-size:1rem; line-height:160%;}

.about02{width:100%; display:flex; justify-content:space-between; padding:50px 0;}
.aboutBox{width:31%; float:left; padding:5rem 0; text-align:center; background:#454545;}
.aboutBox .aBoxTxt01{width:100%; color:#a8a8a8; font-size:3rem; font-weight:bold;}
.aboutBox .aBoxTxt02{width:100%; color:#a8a8a8; font-size:1rem; line-height:160%;}
.aboutBox .aBoxLine{width:20%; height:1px; margin:20px 40%; background:#a8a8a8;}

.aboutBox:hover{background:#c71313;}
.aboutBox:hover .aBoxTxt01{color:#fff;}
.aboutBox:hover .aBoxTxt02{color:#fff;}
.aboutBox:hover .aBoxLine{background:#fff;}

.aboutBoxOn{background:#c71313;}
.aboutBoxOn .aBoxTxt01{color:#fff;}
.aboutBoxOn .aBoxTxt02{color:#fff;}
.aboutBoxOn .aBoxLine{background:#fff;}

.about03{width:100%; display:flex; justify-content:space-between; padding-bottom:40px;}
.aboutTxt03{width:31%; color:#161616; font-weight:bold; font-size:1.8rem; line-height:160%; position:relative;}
.aboutTxt03::after{content:''; display:inline-block; width:50%; max-width:210px; height:10px; position:absolute; right:0; background:url(../images/line_01.png) no-repeat 0 0; top:0;}
.aboutTxt04{width:65%; color:#000; font-size:1rem; line-height:160%; padding-top:10px;}
.aboutTxt04 .aTxt01{width:100%; padding-bottom:20px; font-size:1.25rem; font-weight:600; color:#c71313;}


/* Direct Order */
.requestTop{width:100%; float:left; margin:0px; padding-bottom:10px;}
.requestTop ul{width:100%; float:left;}
.requestTop ul li{width:100%; background:#f1f1f1; text-align:center; color:#666666; line-height:180%; padding:25px 20px; border-radius:10px;}
.requestTop ul li p{padding-bottom:10px;padding-top:10px;}
.requestTop ul li p span{color:#9a324d; font-weight:bold;}
.requestTop ul li .tit{font-size:1.2rem; font-weight:bold; color:#393939; font-weight:bold; }
.requestTop ul li .vat{text-decoration:underline;}
.requestTop ul li .bgtxt{background:#3c3c3c; padding:0 10px; color:#ffffff;}
.requestTop ul li .bgtxt a{color:#ffffff;}
/*.requestTop ul li:first-child{width:100%; height:23px; background:url(../images/sub/box_top.png) no-repeat;}
.requestTop ul li:last-child{width:100%; height:23px; background:url(../images/sub/box_bottom.png) no-repeat;}*/

.requestBottom{width:100%; float:left; margin-top:30px; text-align:center;}
.requestBottom .cont{width:100%; float:left;}

.requestBottom .inputForm{width:48%; float:left;}
.requestBottom .inputForm ul{width:100%;}
.requestBottom .inputForm li{line-height:180%; display:flex; width:100%; line-height:24px;}
.requestBottom .inputForm li.item{width:20%; float:left; color:#676767; font-weight:bold; font-size:1rem; clear:both; padding-bottom:10px; text-align:left;}
.requestBottom .inputForm li.item1{width:20%; float:left; color:#9b334c; font-weight:bold; font-size:1.1rem; clear:both; padding-bottom:10px; text-align:left;}
.requestBottom .inputForm li.inp{width:80%; padding-bottom:10px; text-align:left;}

.requestBottom .inputForm li.inp span{display:inline-block; padding:0 10px;}

.requestBottom .btn{width:100%; text-align:center; float:left; clear:both; padding:20px 0;}

.requestHosting {width:820px; margin:0 auto;}
.requestHosting .info{width:100%; float:left; text-align:center;}

.requestBottom .inputForm .radioBox{display:flex;}
.requestBottom .inputForm .radioBox input{width:20px; height:20px;}
.requestBottom .inputForm .radioBox label{display:inline-block; padding:0 2px;}

.requestBottom .inputForm .paymentMethod{width:100%;}
.requestBottom .inputForm .paymentMethod .pMethod{width:100%;}
.requestBottom .inputForm .paymentMethod .pMethod02{width:100%; padding-left:5%; box-sizing:border-box;}
.requestBottom .inputForm .paymentMethod .pMethod02 .payAccount{width:100%; display:flex; padding:5px 0 0 0; justify-content:space-between;}
.requestBottom .inputForm .paymentMethod .pMethod02 span{font-weight:600; width:20%; font-size:0.9rem;}
.requestBottom .inputForm .paymentMethod .pMethod02 input{width:75%;}
.requestBottom .inputForm .paymentMethod .pMethod02 select.input_txt{width:75%;}

.requestBottom .inputForm li.inp .hpone02{width:30%; max-width:120px;} 
.requestBottom .inputForm li.inp .hpone03{width:30%; max-width:120px;} 


/* input */
  .input_txt{border:1px solid #cccccc;
        background:#f9f9f9;
		padding:5px;}
		
		
/* contact us */
.subMap{width:100%; height:450px; float:left;}
.subMapTxtBox{width:100%; display:flex; justify-content:space-between; padding:10px 5%; flex-wrap:wrap;}
.subMapTxt{padding:5px 0; line-height:140%; color:#161616; font-size:1rem; position:relative; display:flex; align-items:center;}
.subMapTxt .subMapIcon{width:80px;}
.subMapTxt .subMapDesp{width:auto; font-size:1rem;}
.subMapTxt .subMapDesp span{font-weight:600; display:inline-block; padding-right:10px;}

.subMapTxt00 br.moPC{display:none;}

.subMapTxt00{width:60%;}
.subMapTxt01{width:30%;}
.subMapTxt02{width:30%;}



.projectList{border:1px solid #c2c2c2; border-radius:5px; padding:5px;}

/*project Board*/
.projectName{width:100%; color:#999; font-size:0.9rem; padding-left:20px; box-sizing:border-box; 
             background-repeat:no-repeat; background-position:2px 2px; line-height:160%; background-image:url(/admin/manage/image/ic_tit.gif);}
.projectName span{font-size:1rem; font-weight:600; color:#993750;}

.projectTop{width:100%; display:flex; flex-wrap:wrap; justify-content:space-between;}
.projectTop .projectBbsListAll{width:40%;}
.projectTop .projectBbsList{width:50%;}
.projectBbs{width:100%; padding:0;}



@media screen and (max-width:1024px){
	
br.onlyPC{display:none;}
	
/* about > introduction */
.about01{flex-wrap:wrap;}
.aboutTxt01{width:40%; padding-right:30px;font-size:1.5rem;}
.aboutTxt02{width:60%;}

.about02{ padding:40px 0;}
.aboutBox{width:32%;}
.aboutBox .aBoxTxt01{font-size:2rem;}


.about03{flex-wrap:wrap;padding-bottom:30px;}
.aboutTxt03{width:32%; font-size:1.5rem;}
.aboutTxt04{width:65%;}
	
	
}



@media screen and (max-width:850px){

#subWrap{padding-top:60px;}	
	
/* about > introduction */
.about01{flex-wrap:wrap;}
.aboutTxt01{width:100%; padding-right:0;font-size:1.5rem;}
.aboutTxt02{width:100%; padding-top:30px;}

.about02{ padding:40px 0;}

.aboutBox{width:32%; padding:5rem 2%; background:#c71313;}
.aboutBox .aBoxLine{background:#ffffff;}
.aboutBox .aBoxTxt01{font-size:1.5rem; color:#ffffff;}
.aboutBox .aBoxTxt02{font-size:1rem; color:#ffffff;}


.about03{flex-wrap:wrap;padding-bottom:30px;}
.aboutTxt03{width:100%; font-size:1.5rem;}
.aboutTxt04{width:100%;}
	
	
}


@media screen and (max-width:640px){
	

	
/* about > introduction */

.about02{ padding:30px 0; flex-wrap:wrap;}
.aboutBox{width:100%; padding:2rem 5%; margin:5px 0;}


/* Project Board */
.projectTop .projectBbsListAll{width:100%;}
.projectTop .projectBbsList{width:100%; padding-top:10px;}

	
	
}

