.pro_btn button[type=button]{ 
    border: 1px solid #d4d4d4; 
    line-height: 15px!important; 
    color: #000;   
    background: #fff;}

.pro_btn{ 
    /* width: 0px!important; height: 0px!important; 20181106이영제 수정 */

}

.pro_btn button[type=button]:hover, .btn_active{
    background: #015faf!important;
    color: #fff!important;
    font-weight: bold;
    /* border: 1px solid #000; */
}
.product_c{
    /* display: inline-block; */
    float: left;
    padding: 3px 3px;
}
.view_img{
    display: inline-block;
    vertical-align: top;
}
.view_product{    
    width: 384px;
    display: none;  
    /* border: 1px solid #d6d6d6;   */
}
.view_product_show{
    display: inline-block!important;
}

.image_area{
    display: inline-block;
}

.product_text .title1{
    font-size: 24px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.fuel_item{
    position: absolute;
    display: block;
    z-index: 100;
    margin-top: 50px;
}
.fuel_item .fuel_position{
    margin-bottom: 10px;

}
.fuel_item1{
    position: relative;
   
    display: block;
}
.fuel_item1 .fuel_position1{
    position: absolute;
    right:10px;
    top: -360px;
}
.fuel_item1 .fuel_position2{
    position: absolute;
    right:10px;
    top: -250px;
}
.fuel_item1 .fuel_position3{
    position: absolute;
    right:10px;
    top: -140px;
}

.egr_item{
    position: relative;
    height: 300px;
    z-index: 10;
}
.image_area1{
    position: absolute;
    display: inline-block;
    width: 256px;
    margin-top: 10px;
    top: -100px;
    right: 0;
}
.image_area2{
    position: absolute;
    display: inline-block;
    width: 256px;
    margin-top: 10px;
    top: -300px;
    
}
.image_area3{
    position: absolute;
    display: inline-block;
    width: 256px;
    top: -400px;
    right: 0;
}
.image_area1 .egr_name{
    color: #fff;
    width: 90px; 
    height: 0; 
    border: 20px solid #015faf;
    border-top-width: 0;
    border-right-color: transparent;
    margin: 10px;
   
    
}
.image_area2 .egr_name{
    color: #fff;
    width: 80px; 
    height: 0; 
    border: 20px solid #015faf;
    border-top-width: 0;  
    border-right-color: transparent;
    margin: 10px;
    
}
.image_area3 .egr_name{
    color: #fff;
    width: 210px; 
    height: 0; 
    border: 20px solid #015faf;
    border-top-width: 0;
    border-right-color: transparent;
    margin: 10px;


}
.egr_img{
    display: block;
    position: relative;
    width: 1024px;
}
.egr_position{
    position: relative;
    margin: 0 auto;
    width: 600px;
}

.egr_img img{
   
    width:632px; margin-top:15px;    
}


/* 제품소개 박스이미지 */
.box_position{
    position: relative;
    margin-top: 10px;
}

.pro_box{
    background-image: url(../img/probox.png);
    background-size: cover;
    height: 80px;
    position: absolute;
    width: 109px;
    background-repeat: no-repeat;
    top: 140px;
    left: 442px;
    border-radius: 50px;
    z-index: 150;
    -webkit-animation-name: pro_box;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;      
}

/* Safari 4.0 - 8.0 */
@keyframes pro_box {
    to {
      opacity: 0;
    }
  }



.box_position1{
    position: relative;
    margin-top: 10px;
}

.pro_box1{
    background-image: url(../img/probox1.png);
    background-size: cover;
    height: 148px;
    position: absolute;
    width: 156px;
    background-repeat: no-repeat;
    top: 71px;
    left: 185px;
    border-radius: 50px;
    z-index: 150;
    -webkit-animation-name: pro_box1;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box1;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;            
}

/* Safari 4.0 - 8.0 */
@keyframes pro_box1 {
    to {
      opacity: 0;
    }
  }



.pro_box2{
    background-image: url(../img/probox1.png);
    background-size: cover;
    height: 80px;
    position: absolute;
    width: 109px;
    background-repeat: no-repeat;
    top: 60px;
    left: 372px;
    border-radius: 50px;
    z-index: 150;
    -webkit-animation-name: pro_box2;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box2;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;         
    
}

/* Safari 4.0 - 8.0 */
@keyframes pro_box2{
    to {
      opacity: 0;
    }
  }


  .pro_box3{
    background-image: url(../img/probox2.png);
    background-size: cover;
    height: 80px;
    position: absolute;
    width: 109px;
    background-repeat: no-repeat;
    top: 185px;
    left: 150px;
    border-radius: 50px;
    z-index: 150;
    -webkit-animation-name: pro_box3;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box3;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;         

}

/* Safari 4.0 - 8.0 */
@keyframes pro_box3{
    to {
      opacity: 0;
    }
  }

  .pro_box4{
    background-image: url(../img/probox2.png);
    background-size: cover;
    height: 80px;
    position: absolute;
    width: 109px;
    background-repeat: no-repeat;
    top: 43px;
    left: 438px;
    border-radius: 50px;
    z-index: 150;
    -webkit-animation-name: pro_box4;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box4;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;         
    
}


/* Safari 4.0 - 8.0 */
@keyframes pro_box4{
    to {
      opacity: 0;
    }
  }
  
@keyframes pro_box7{
    to {
      opacity: 0;
    }
  }

  .pro_box7{
    background-image: url(../img/probox8.png);
    background-size: cover;
    height: 80px;
    position: absolute;
    width: 109px;
    background-repeat: no-repeat;
    top: 43px;
    left: 438px;
    border-radius: 50px;
    z-index: 150;
    -webkit-animation-name: pro_box4;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box4;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;         
    
}
	.view_img .fuel_img
	{
	width:632px;
	margin-top:15px;	
	}


@keyframes pro_box4{
    to {
      opacity: 0;
    }
  }
  
@keyframes box_position img{
    to {
      opacity: 0;
    }
  }

  .box_position img{
    background-size: cover;

    position: absolute;

    background-repeat: no-repeat;
    top: 60px;
    border-radius: 50px;
    
    z-index: 150;
    -webkit-animation-name: pro_box4;
    -webkit-animation-duration: 0.5s;
    animation-name: pro_box4;
    animation-duration: 0.8s;
    animation-iteration-count: 100;
    animation-direction: alternate;         
    
}

@media screen and (max-width:1024px){
    #memo{width: 100% !important;}
    /*게시판 와이드값 */
	.view_product{    
    width: 768px;
    display: none;  
    /* border: 1px solid #d6d6d6;   */
	}
	.view_img{
    display: block;
    vertical-align: top;
	width:100%;
	}
    .pro_btn{width: 100%;  height: 150px;  top: 380px; left: 0; position: absolute;}
    .pro1{width: 33.3%;  float: left; top: 0; left:0;}
    .pro2{top: 0; width: 33.3%; left:66.6%;}
    .pro3{top: 0; width: 33.3%;left:33.3%; }
    .pro4{top: 34px; width: 33.3%;left:0;}
    .pro5{top: 34px; width: 33.3%;left:33.3%;}
    .pro6{top: 34px; width: 33.3%;left:66.6%;}
    .pdut_f{margin-top: 30px;}
	.view_img .fuel_img{
	width:632px;
	margin:0 auto;
	display:block;
	}	
	}