@charset "utf-8";

.product p:last-child span, .talent span{display: none;}

/*
0. 모바일&태블릿 공통 조건부css
- History, 홍보,  제품(도료), 고객지원, 로그인, 회원가입
※ 모바일 환경과 태블릿 환경에서 분리(css)가 필요한 서브페이지
- 기업소개, CEO인사말, R&D(연구소), 인재상
*/
@media screen and (max-width:1100px){
     #sub_container aside{width:100%;}
     #sub_container aside h2{ 
          height:80px;
          color:#fff; background: #0c4da2; 
          font-size:20px;
          text-align: center;
          line-height:80px; }

     .lnb a{ 
          display:block;
          height:40px;
          border-bottom: 1px solid #d9d9d9;
          line-height:40px;
          text-align: center;
          color:#333;}
     .lnb a:hover{ background:#0c4da2; color:#fff;}

     .sub_content{margin-bottom:80px;}
     .sub_content h3{
          font-size:25px;
          margin: 40px 0 40px 20px;}
     .sub_content strong{ font-size:20px;}
     .sub_content p{ line-height:25px;}
     
          /*background: url()   repeat   position/size */
     .business li:nth-child(1){ background: url(../images/business_cont_01.jpg);  }
     .business li:nth-child(2){ background: url(../images/business_cont_02.jpg);  }
     .business li:nth-child(3){ background: url(../images/business_cont_03.jpg);  }
     .business li:nth-child(4){ background: url(../images/business_cont_04.jpg);  }
     .business li:nth-child(5){ background: url(../images/business_cont_05.jpg);  }
     .business li:nth-child(6){ background: url(../images/business_cont_06.jpg);  }
     .business p:first-child{ margin:20px 0 10px 20px; /* top   right   bottom  left*/}
     .business p:last-child{ margin-left:20px; }
     
     .history{padding:20px;}
     .history>li li{
          border-bottom: 1px solid #d9d9d9;
          padding-bottom: 20px;
          margin-bottom: 20px;}
     
     .product p:last-child{
          height:720px;
          background:url(../images/img_paint_build1_m.jpg) no-repeat center/280px auto;}
     
     /*sub4개별스타일*/
     .media{padding:20px;}
     .media *{ border:0; width:100%; }
     
     /*sub5개별스타일*/
     .talent{height:1020px; background:url(../images/img_talent_m.gif) no-repeat center;}
     
     /*sub6개별스타일*/
     .find iframe{
          border:0;
          width:100%; height:500px;
          margin-bottom:20px; }
     .find address{ font-style:normal; }
     .find>div{ padding:20px; }
     .find_info1{background: #f9f9f9;}
     .find_info2{	overflow: hidden;	background:#eff6fc;	}
     .find_info2 div{ float:left; margin-right:40px; }

     .login table{ width: 100%; margin:0 auto; padding:20px;}
     .login input{ 
          width:100%; height:40px; margin:10px 0;
          border-radius: 20px; border:1px solid #999; 
          box-sizing: border-box; }
     .login tr:not(:last-child) input{ text-indent:20px;}
     .login tr:last-child input{background: #0c4da2; color:#fff; }

     .join table{ width:100%; margin:0 auto; padding:20px; }
     .join td{ 
          padding:10px 0;
          border-bottom:1px solid #d9d9d9;}
     .join tr:not(:last-child) p:first-child{
          color:#0c4da2; 	margin:10px 0;}
     .join tr p>*{
          width:100%; height:40px; 
          border:1px solid #999;
          box-sizing: border-box; 
          text-indent:10px;}
     .join tr:nth-child(5) p>*{ width:100%; }/*5.생년월일*/
     .join tr:nth-child(8) p:nth-child(2){ margin: 10px 0; }/*8.휴대전화*/
     .join tr:nth-child(8) p:nth-child(3) input{ margin:10px 0; width:100%;  }
     .join tr:nth-child(8) p:nth-child(3) a{ 
          display:inline-block;  
          width:145px; height:42px;	
          border: 0;
          color:#fff; 
          background: #0c4da2;  
          line-height:42px;
          text-align:center;
          text-indent:0;	 }
     .join tr:nth-child(9) input{  /*9.문자수신*/
          width:16px; height:16px; margin: 5px 15px 0 0; } 
     .join tr:nth-child(10) textarea{  /*10.기타*/
          height:150px; }
     .join tr:nth-child(11) input{  /*11.회원가입*/
          background: #0c4da2; color:#fff; }

}

/*1.모바일 미디어 조건부css(미디어 쿼리)*/
@media screen and (max-width:450px){

     /*sub1개별스타일*/
     .business li{ width:100%; height:145px; margin-bottom:20px;}

     .ceo_message>p:first-child{
          border-bottom: 1px solid #d9d9d9;
          padding-bottom:40px; margin-bottom:40px;}
     .ceo_message>p img{display:block; width:100%}
     .ceo_message>p:nth-of-type(2){
          height: 230px; 
          padding:20px;
          margin-bottom: 40px;
          font-size:20px;
          line-height:25px;
          background: url(../images/bg_ceo_logo.jpg) no-repeat center bottom/280px auto; }
     .ceo_message span{ font-weight: bold; color: #0c4da2; }
     .ceo_message div {padding:20px;}
     .ceo_message div p{ margin-bottom:20px; }
     .ceo_message div p br{display:none; }/*줄내림 마지막 줄까지 가서 자동처리*/
     .ceo_message mark{  background: none; font-weight: bold; font-size:18px;}

     /*sub2개별스타일*/
     .product{padding:20px;}
     .product img{width:100%;}
     .product p{ margin-bottom:20px; }
     .product p:last-child{
          border-top:1px solid #d9d9d9;
          border-bottom:1px solid #d9d9d9;
          padding-top:20px; }

     /*sub3개별스타일*/
     .rnd{padding:20px;}
     .rnd p{margin-bottom: 20px;}
     .rnd img{width:100%}
     .rnd li li{
          border-bottom: 1px solid #d9d9d9;
          padding-bottom:10px;
          margin-bottom:10px;
          text-indent: 20px;}

     /*sub5개별스타일*/
     .talent{padding:20px;}
     .talent img{ width:100%; }

}

/*2.태블릿 미디어 조건부css(미디어 쿼리)*/
@media screen and (min-width:450px) and (max-width:1100px){

     /*sub1개별스타일*/
     .business li{width:50%;  height:145px; float:left; margin-bottom:20px;}

     .ceo_message p{text-align: center;}
     .ceo_message>p:first-child{
          border-bottom: 1px solid #d9d9d9;
          padding-bottom:40px; margin-bottom:40px;
          background:#3a4257; }
     .ceo_message>p img{display:block; margin:0 auto;}
     .ceo_message>p:nth-of-type(2){
          height: 230px; 
          padding:20px;
          margin-bottom: 40px;
          font-size:20px;
          line-height:25px;
          background: url(../images/bg_ceo_logo.jpg) no-repeat center bottom/280px auto; }
     .ceo_message span{ font-weight: bold; color: #0c4da2; }
     .ceo_message div {padding:20px;}
     .ceo_message div p{ margin-bottom:20px; }
     .ceo_message mark{  background: none; font-weight: bold; font-size:18px;}

     /*sub2개별스타일*/
     .product{padding:20px;}
     .product img{width:100%;}
     .product p{ margin-bottom:20px; }
     .product p:last-child{
          border-top:1px solid #d9d9d9;
          border-bottom:1px solid #d9d9d9;
          padding-top:20px; }

     /*sub3개별스타일*/
     .rnd{padding:20px;}
     .rnd div:nth-child(1){width:48%; float:left; margin-right: 2%;}
     .rnd ul{clear: both;}
     .rnd div>ul>li{width:48%; float:left; margin-right: 2%;}
     .rnd img{width:100%;}
     
     .rnd p{margin-bottom: 20px;}
     .rnd li li{
          border-bottom: 1px solid #d9d9d9;
          padding-bottom:10px;
          margin-bottom:10px;
          text-indent: 20px;}

     /*sub5개별스타일*/
     .talent{padding:20px;}
     .talent img{ width:100%; }
   
}

/*3.PC 미디어 조건부css(미디어 쿼리)*/
@media screen and (min-width:1100px){
     #sub_container{ width:1200px; margin:80px auto 0 auto; }
     #sub_container aside{width:180px; margin-right:20px; float:left; }
     #sub_container aside h2{ 
          height:180px;
          color:#fff; background: #0c4da2; 
          font-size:30px;
          text-align: center;
          line-height:180px; }

     .lnb a{ 
          display:block;
          height:40px;
          border-bottom: 1px solid #d9d9d9;
          line-height:40px;
          text-indent: 20px;
          color:#333;}
     .lnb a:hover{border-bottom:2px solid #0c4da2; color:#0c4da2;}
     /* 서브콘텐츠와 푸터영역 사이의 공통 간격80px 설정*/
     .sub_content{ width:1000px;	float:left;  margin-bottom:80px;}
     .sub_content h3{
          font-size:40px;
          margin: 68px 0 80px 0; }
     .sub_content strong{ font-size:20px; }
     .sub_content p{ line-height:25px; }


     /*sub1개별스타일*/
     .business li{ width:490px; height:145px; float:left; margin-bottom:20px;}
     .business li:nth-child(odd){ margin-right:20px; }
     /*background: url()   repeat   position/size */
     .business li:nth-child(1){ background: url(../images/business_cont_01.jpg);  }
     .business li:nth-child(2){ background: url(../images/business_cont_02.jpg);  }
     .business li:nth-child(3){ background: url(../images/business_cont_03.jpg);  }
     .business li:nth-child(4){ background: url(../images/business_cont_04.jpg);  }
     .business li:nth-child(5){ background: url(../images/business_cont_05.jpg);  }
     .business li:nth-child(6){ background: url(../images/business_cont_06.jpg);  }
     .business p:first-child{ margin:20px 0 10px 20px; /* top   right   bottom  left*/}
     .business p:last-child{ margin-left:20px; }

     .ceo_message>p:first-child{
          border-bottom: 1px solid #d9d9d9;
          padding-bottom:40px; margin-bottom:40px;}
     .ceo_message>p:nth-of-type(2){
          width:355px; height: 350px; float:left;
          margin-right:40px;
          font-size:25px;
          line-height:35px;
          background: url(../images/bg_ceo_logo.jpg) no-repeat center bottom; }
     .ceo_message span{ font-weight: bold; color: #0c4da2; }
     .ceo_message div{ float:right; width: 605px;  /*1000 -395 = 605px */}
     .ceo_message div p{ margin-bottom:20px; }
     .ceo_message mark{  background: none; font-weight: bold; font-size:18px;}
     
     .history>li { margin-bottom: 40px;}
     .history p strong{
          display:block;
          font-size:40px;
          margin-bottom:40px; }
     .history ol{ margin-left:40px; }
     .history ol li{  
        clear:both;
        /*★*/overflow: hidden;
          margin-bottom:20px; }
     .history ol p{ float:left;}
     .history ol p:first-child{	margin-right:40px;}
     .history ol p:nth-child(2)~p{
          clear:both;
          margin-left:62px; }
     
     /*sub2개별스타일*/
     .product p{ margin-bottom:20px; }
     .product p:last-child{
          height:260px;
          border-top:1px solid #d9d9d9;
          border-bottom:1px solid #d9d9d9;
          padding:20px 0;
          background:url(../images/img_paint_build1.jpg) no-repeat center;}

     /*sub3개별스타일*/
     .rnd p{ margin-bottom:20px; }
     .rnd>div:nth-of-type(1){ margin-bottom:40px; }
     .rnd>div:nth-of-type(1) p:last-child{ position: absolute;	margin: -190px 0 0 695px; }

     .rnd div:nth-of-type(2)>ul>li{	width:320px; float:left; }
     .rnd div:nth-of-type(2)>ul>li:nth-child(2){ margin:0 20px; }
     .rnd li p:nth-of-type(1){ position: absolute; margin-top: 220px; }
     .rnd li p:nth-of-type(2){ margin-bottom:60px; }
     .rnd div:nth-of-type(2) img{ width:320px; }
     .rnd li li{ margin-left:20px; line-height:30px; list-style-image: url(../images/rnd_list_icon.gif); }

     /*sub4개별스타일*/
     .media *{ border:0; width:1000px; height:570px; }

     /*sub5개별스타일*/
     .talent{height: 690px; background: url(../images/img_talent.gif) no-repeat center;}

     /*sub6개별스타일*/

     .find iframe{
          border:0;
          width:1000px; height:500px;
          margin-bottom:20px; }

     .find address{ font-style:normal; }

     .find>div{ padding:20px; }
     .find_info1{background: #f9f9f9;}
     .find_info2{	overflow: hidden;	background:#eff6fc;	}
     .find_info2 div{ float:left; margin-right:40px; }


     .login table{ width: 700px; margin:0 auto;}
     .login input{ 
          width:700px; height:40px; 	margin:10px 0;
          border-radius: 20px; border:1px solid #999; 
          box-sizing: border-box; }
     .login tr:not(:last-child) input{ text-indent:20px;}
     .login tr:last-child input{background: #0c4da2; color:#fff; }

     .join table{width:700px; margin:0 auto;}
     .join td{
          padding: 10px 0;
          border-bottom:1px solid #d9d9d9;}
     .join tr:not(:last-child) p:first-child{
          color:#0c4da2;
          margin: 10px 0;}
     .join tr p>*{
          width:700px; height:40px;
          border: 1px solid #999;
          box-sizing:border-box;
          text-indent:10px;}
     .join tr:nth-child(5) p>*{width:230px;}/*5. 생년월일*/
     .join tr:nth-child(8) p:nth-child(3){margin:10px 0;}
     .join tr:nth-child(8) p:nth-child(3) input{width:550px;}
     .join tr:nth-child(8) p:nth-child(3) a{
          display:block;
          width:140px; height:42px;
          background:#0c4da2; color:#fff; 
          text-align:center;
          line-height: 42px;
          text-indent: 0;
          border:0;
          box-sizing: border-box;}
     .join tr:nth-child(9) input/*문자수신*/{
          width:16px; height:16px;
          margin:5px 15px 0 0;}
     .join tr:nth-child(10) textarea{
          height: 150px;}
     .join tr:nth-child(11) input{
          background:#0c4da2;
          color:#fff;}

}