img { max-width: 100%; width: auto; height: auto; }


/* ======= 자동차 진단기 ======= */
/*공통영역*/
.csRedText{color: #ff4539;}
.csGrayText{color:#898989;}






/*상품기본정보영역*/
.csNormalInfoBgArea{width:100%;margin-top:60px;}
.csNormalInfoArea{margin: 0 auto; width: 1000px; }
.csNormalInfoPhotoArea{display:inline-block;width:300px;height:300px; border:1px solid #d4d4d4; float:left;}
.csNormalInfoTextArea{display:inline-block;width:698px; padding-left:40px;}

.csNormalInfoName{font-size:24px;font-weight:bold}
.csNormalInfoPriceArea{margin-top: 10px; padding-bottom: 15px; border-bottom: 3px solid #19b6d0;}
.csNormalInfoPrice{font-size:20px; display:inline-block;}
.csNormalInfoPriceBold{font-weight:900; font-size:28px;}
.csNormalInfoItemArea{margin-top: 10px; padding-bottom: 10px; border-bottom: 1px dashed #d4d4d4;}
.csNormalInfoItemTitle{display:inline-block; width:132px;font-weight:bold;font-size:12px; line-height:25px;vertical-align:top;}
.csNormalInfoItemText{display: inline-block; font-size: 12px;line-height:25px;width:500px}
.csDeliverPolicyBtn{border:1px solid #d4d4d4;margin-left:5px; color:#898989;padding:2px;}
.csDeliverPolicyLink:link{text-decoration:none;color:#898989;}
.csDeliverPolicyLink:visited{text-decoration:none;color:#898989;}
.csDeliverPolicyLink:hover{text-decoration:none;color:#898989;}
.csDeliverPolicyLink:active{text-decoration:none;color:#898989;}
/*기존합계일때 css*/
/*.csNormalInfoTotalPrice{padding: 20px 0px 30px 0px; text-align: right;  font-size: 20px; color: #ff4539;}*/
.csNormalInfoTotalPrice{padding: 0px 0px 30px 0px; text-align: right;  font-size: 20px; color: #ff4539;}

/*수량*/
.csNormalInforInput{text-align:center;width:40px; height:22px;  outline: none;border:1px solid #d4d4d4;float:left;line-height:20px;}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
.csNormalInforInputDown{width: 20px; height: 22px; border-left: 1px solid #d4d4d4; border-top: 1px solid #d4d4d4; border-bottom: 1px solid #d4d4d4;float:left;text-align:center;font-size:16px; cursor:pointer}
.csNormalInforInputUp{width: 20px; height: 22px; border-right: 1px solid #d4d4d4; border-top: 1px solid #d4d4d4; border-bottom: 1px solid #d4d4d4;float:left;text-align:center;font-size:14px; cursor:pointer}




/*버튼영역*/
.csBtnArea{position:relative;}
.csInquireBtn{display: inline-block; float: left; width: 320px; margin-right: 0px; border: 1px solid #19b6d0; color: #19b6d0; text-align: center;padding:15px 0px;font-weight:bold; background-color:#ffffff; cursor:pointer;}
.csBuyBtn{display: inline-block; float: right;  width: 320px; background-color: #19b6d0; color: #ffffff; text-align: center; padding: 15px 0px; font-weight: bold; border: 1px solid #19b6d0; cursor:pointer;}
.csNormalInfoEndLine{margin: 0 auto; width: 1000px;border-bottom:1px solid #d4d4d4; }




/*상품상세정보영역*/
.csDetailInfoArea{margin: 0 auto; width: 1000px; }
.csDetailInfoImg{padding-top:40px;}


/*공통하단*/
.csCommonArea{margin: 0 auto; width: 1000px;margin-bottom:30px; }
.csCommonTitle{padding-top: 50px; font-weight: bold; padding-bottom: 15px; border-bottom: 3px solid #19b6d0;}
.csCommonContentArea{ margin: auto;}
.csCommonImgArea{ width:200px;}
.csCommonTextArea{ width:800px;vertical-align:middle;font-size:14px;line-height:20px;}
.csCommonBoldText{font-weight:bold;text-decoration:underline; color:#19b6d0;}
.csCommonItalicText{font-weight:bold;font-style:italic; color:#19b6d0;}
.csPartnerArea{border: 1px solid #d4d4d4; text-align: center; padding: 8px;margin-top:25px;}
.csPartnerAreaImg{vertical-align:middle;}
.csPartnerAreaTitle{margin-right:10px;}
.csPartnerAreaTel{font-weight: 900; font-size: 20px; margin-right: 5px;}






/*-----------------------------------------------------------기존 x431 내용*/
/* x431 커버 */
.csX431TopBg{width: 100%; height: 400px; background: url(/child/img/sub/2/imgX431TopCover.jpg) center 0 no-repeat;background-size:cover;text-align:right; background-color:#000000;}
.csX431TopArea{margin:0 auto; color:#ffffff; padding-right:30px;}
.csX431TopArea h1 { font-size: 30px; color: #fff; margin-bottom: 10px; }
.csX431TopArea p { font-size: 24px; color: #fff; line-height: 26px; }
.csX431TopMainTitle{font-size:26px;padding-top:90px;}
.csX431TopName{font-size:55px; color:#ff0000;font-weight:bold;padding-bottom:40px;}

.csX431TopPlayBtn{width:200px; text-align:center; height:45px; line-height:38px; color:#ffffff; border:3px solid #ff0000;cursor:pointer;display:inline-block;font-weight:bold;font-size:18px;background-color:#ff0000; }
.csX431TopPlayBtn:link{color:#ffffff; border:3px solid #ff0000;background-color:#ff0000; cursor :pointer;display:inline-block;font-weight:bold;}
.csX431TopPlayBtn:visited{color:#ffffff; border:3px solid #ff0000;background-color:#ff0000; cursor :pointer;display:inline-block;font-weight:bold;}
.csX431TopPlayBtn:hover{color:#ff0000; border:3px solid #ff0000;cursor:pointer;display:inline-block;font-weight:bold;background-color: rgba( 255, 255, 255, 0);}
.csX431TopPlayBtn:active{color:#ff0000; border:3px solid #ff0000;cursor:pointer;display:inline-block;font-weight:bold;background-color: rgba( 255, 255, 255, 0);}



/*아이콘 베네핏*/
.mainVisual{ background-color:#f2f4f6; text-align:center; padding:50px 30px 50px 30px; }
.imgContent{ position:relative; }
.imgContent img{ margin-left:100px;}
.imgContent img:first-child{ margin-left:0;}

.iconContent{ max- border:1px #c7c7c7 solid; margin:0 auto; }
.iconContent ul{overflow:hidden; }
.iconContent li{ display: inline-block; vertical-align: top; width:203px; color:#000;}
.iconContent li:first-child{margin-left:0;}
.iconContent li .icon_01{ background:url(/child/img/sub/2/imgIcon1.png) center 0 no-repeat; padding-top:100px;}
.iconContent li .icon_02{ background:url(/child/img/sub/2/imgIcon2.png) center 0 no-repeat; padding-top:100px;}
.iconContent li .icon_03{ background:url(/child/img/sub/2/imgIcon3.png) center 0 no-repeat; padding-top:100px;}
.iconContent li .icon_04{ background:url(/child/img/sub/2/imgIcon4.png) center 0 no-repeat; padding-top:100px;}
.iconContent li p{font-size:1em; color:#000;}
.iconContent li .btn a{ display:block; color:#FFF; font-weight:bold; padding:15px 0; text-align:center; background-color:#1eaaa3;}


/* x431정의 */
.box { position:relative; overflow:hidden;  text-align:center; margin:0 auto; padding:60px 10px; }
.csJusticeTitle{font-size:35px; font-weight:bold;color:#ab2027;line-height:60px;}
.csMarginTop40{margin-top:40px;}


/*제품기능*/
.section_02{background-color:#f2f4f6; position:relative; overflow:hidden; }
.csFunctionArea{ margin:0 auto;padding: 20px 100px;}
.csX431TitleRLine{font-weight: bold; font-size: 25px; text-align: center;  padding-bottom:40px;background: url(/child/img/sub/2/imgTitleRLine.png) center 40px no-repeat;}

/*좌측아이콘*/
.csFunctionLeftArea{ float: left; display:inline-block; width:225px;  text-align:left;vertical-align:top;}
.csFunctionLeftArea > div { padding-right: 56px; }
.csFunctionSubTextLeft{font-size:10.5px;color:#000000;font-weight:normal; margin-top:5px;}
.csFunctionTitleLeftArea1{background: url(/child/img/sub/2/ImgFunctionIcon1.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;}
.csFunctionTitleLeftArea1:link{background: url(/child/img/sub/2/ImgFunctionIcon1.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea1:hover{background: url(/child/img/sub/2/ImgFunctionIcon1Over.png) top 3px right 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea2{background: url(/child/img/sub/2/ImgFunctionIcon2.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;}
.csFunctionTitleLeftArea2:link{background: url(/child/img/sub/2/ImgFunctionIcon2.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea2:hover{background: url(/child/img/sub/2/ImgFunctionIcon2Over.png) top 3px right 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea3{background: url(/child/img/sub/2/ImgFunctionIcon3.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;}
.csFunctionTitleLeftArea3:link{background: url(/child/img/sub/2/ImgFunctionIcon3.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea3:hover{background: url(/child/img/sub/2/ImgFunctionIcon3Over.png) top 3px right 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea4{background: url(/child/img/sub/2/ImgFunctionIcon4.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;}
.csFunctionTitleLeftArea4:link{background: url(/child/img/sub/2/ImgFunctionIcon4.png) top 3px right 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleLeftArea4:hover{background: url(/child/img/sub/2/ImgFunctionIcon4Over.png) top 3px right 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}

/*가운데 패드*/
.csFunctionCenterArea{display:inline-block; vertical-align : top;padding-top:27px;}

/*우측아이콘*/
.csFunctionRigthArea{ float: right; display: inline-block; width: 225px; text-align: left; vertical-align: top;}
.csFunctionSubTextRight{font-size:10.5px;color:#000000;font-weight:normal; margin-top:5px;}
.csFunctionTitleRightArea5{background: url(/child/img/sub/2/ImgFunctionIcon5.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;padding-left:78px;}
.csFunctionTitleRightArea5:link{background: url(/child/img/sub/2/ImgFunctionIcon5.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea5:hover{background: url(/child/img/sub/2/ImgFunctionIcon5Over.png) top 3px left 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea6{background: url(/child/img/sub/2/ImgFunctionIcon6.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;padding-left:78px;}
.csFunctionTitleRightArea6:link{background: url(/child/img/sub/2/ImgFunctionIcon6.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea6:hover{background: url(/child/img/sub/2/ImgFunctionIcon6Over.png) top 3px left 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea7{background: url(/child/img/sub/2/ImgFunctionIcon7.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;padding-left:78px;}
.csFunctionTitleRightArea7:link{background: url(/child/img/sub/2/ImgFunctionIcon7.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea7:hover{background: url(/child/img/sub/2/ImgFunctionIcon7Over.png) top 3px left 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea8{background: url(/child/img/sub/2/ImgFunctionIcon8.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;padding-left:78px;}
.csFunctionTitleRightArea8:link{background: url(/child/img/sub/2/ImgFunctionIcon8.png) top 3px left 15px no-repeat;margin-bottom:25px;font-weight:bold;cursor:pointer;}
.csFunctionTitleRightArea8:hover{background: url(/child/img/sub/2/ImgFunctionIcon8Over.png) top 3px left 15px no-repeat;margin-bottom:25px;color:#ab2027;font-weight:bold;cursor:pointer;}

/* 간편사용 설명서 */
.csX431TitleWLine{font-weight: bold; font-size: 25px; text-align: center;  padding-bottom:40px;color:#ffffff;background: url(/child/img/sub/2/imgTitleWLine.png) center 40px no-repeat;margin-top:20px;}
.section_04{background-color:#ab2027; position:relative; overflow:hidden; }
.section_04 .box .slide{ max-width:810px; margin:0 auto; overflow:hidden; }
.section_04 .box .arrow{ position:absolute; overflow:hidden; top:50%; margin-top:30px;  left:50%; margin-left:-500px;}
.section_04 .box .arrow .l{display:inline-block; float:left;}
.section_04 .box .arrow .r{display:inline-block; float:right;}
.section_04 .slide_img{overflow:hidden; margin-top:80px; text-align:center; }
.section_04 .slide_img li{ display:none; float:left; overflow:hidden; width:705px; height:307px; border:2px #fff solid; padding:50px;}
.section_04 .slide_img li:first-child{margin-left:0;}
.section_04 .slide_img li .txt{ float:left;}
.section_04 .slide_img li .txt  p{text-align:left;}
.section_04 .slide_img li .txt dt{font-weight:bold; color:#000; font-size:25px; margin-top:30px; text-align:left;}
.section_04 .slide_img li .txt dd{background:url(/child/img/sub/2/icon_bl.png) 0 8px no-repeat; padding-left:10px; color:#fff; font-size:15px; margin-top:10px; text-align:left;}
.section_04 .slide_img li .simple{ float:right; margin-left:20px;}

.section_04 .slide .slide_icon{ overflow:hidden; text-align:center; margin:0 auto; padding-top:20px;}
.section_04 .slide .slide_icon li{width:13px; height:13px; display:inline-block; background:url(/Images/Event/201604/icon/icon_circle.png) 0px 0 no-repeat; cursor:pointer;}
.section_04 .slide .slide_icon .on{width:13px; height:13px; display:inline-block; background:url(/Images/Event/201604/icon/icon_circle.png) 0 -14px no-repeat; cursor:pointer;}

.section_04 dt {font-weight:bold; color:#000; font-size:25px; margin-top:30px; text-align:left;}
.section_04 dd {background:url(/Images/Event/201604/icon/icon_bl.png) 0 8px no-repeat; padding-left:10px; color:#fff; font-size:15px; margin-top:10px; text-align:left;}
.idExplainNo   {height:40px; width:350px;padding-left:20px;color:#FFF; font-size:6.0em; margin-top:30px; text-align:left;}

/* 제품사양 */
.section_05{background-color: #f2f4f6; position:relative; overflow:hidden; }
.csSpecBackground{background: url(/child/img/sub/2/imgSpecSize.png) top 30px right 20px no-repeat;padding:20px 0px;}
.section_05 .txt{text-align:left;padding-top:30px; }
.section_05 .txt li{ background:url(/Images/Event/201604/icon/icon_bl1.png) 0 10px no-repeat; padding:0 0 10px 10px; }
.csSpecPreviewArea{text-align:left;margin-top:30px;}
.csSpecPreviewAreaLi{display:inline-block;margin-right:15px;position:relative;}
.plusOver1{display:none;position:absolute; top:0px; left:0px;}
.plusOver2{display:none;position:absolute; top:0px; left:0px;}
.plusOver3{display:none;position:absolute; top:0px; left:0px;}

/*제품구성*/
.section_06{ position:relative; overflow:hidden; padding:20px 0px; }
.csConfigurationDetail{padding: 10px 0px 0px 0px;}


/* 동영상 */
.section_03{ padding:60px 0 70px 0; background:url(/Images/Event/201604/easydiag/bg_movie.png) center center no-repeat; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Images/Event/201604/easydiag/bg_movie.png', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Images/Event/201604/easydiag/bg_movie.png', sizingMethod='scale')"; background-size: cover; text-align:center;}


/* 다운로드 */
.csX431TitleRLine{font-weight: bold; font-size: 25px; text-align: center;  padding-bottom:40px;background: url(/child/img/sub/2/imgTitleRLine.png) center 40px no-repeat;}
.section_08{background-color:#f2f4f6;}
.section_08 ul{margin-top:20px;}
.section_08 li{display:inline-block; color:#000; text-align:center; font-size:18px; vertical-align:top;}
.section_08 li.icon_01{ width:207px; background:url(/child/img/sub/2/imgDownIcon1.png) center 0 no-repeat; padding-top:160px; padding-left:10px; padding-right:10px;}
.section_08 li.icon_02{ width:207px; background:url(/child/img/sub/2/imgDownIcon2.png) center 0 no-repeat; padding-top:160px; padding-left:10px; padding-right:10px;}
.section_08 li.icon_03{ width:207px; background:url(/child/img/sub/2/imgDownIcon3.png) center 0 no-repeat; padding-top:160px; padding-left:10px; padding-right:10px;}
.section_08 li.icon_04{ width:207px; background:url(/child/img/sub/2/imgDownIcon4.png) center 0 no-repeat; padding-top:160px; padding-left:10px; padding-right:10px;}

/* top 버튼 */
/*.btn_top a{display:block; background-color:#000; color:#fff; padding:30px; position:fixed; bottom:0; right:0; font-weight:bold; z-index:10;}*/


.flexslider { max-height: 460px; }
.specification { display: none; }

@media (max-width: 1200px){
  .csFunctionCenterArea{
    display: block;
    margin: 0 auto 50px;
    height: auto;
  }
  .csFunctionLeftArea,
  .csFunctionRigthArea{
    float: none;
    width: 49%;
  }
}
@media (max-width: 1023px){

  .csX431TopArea { padding-right: 0; text-align: center; }
  .csX431TopMainTitle { font-size: 22px; }
  .csX431TopName { font-size: 40px; }
  .csX431TopBg { height: 250px; }

  .iconContent ul { font-size: 0; }
  .iconContent li { display: inline-block; vertical-align: top; padding: 10px; width: 50%; }
  .iconContent li p { font-size: 14px; }

  .csFunctionArea { padding: 20px 15px; }

  .idExplainNo { width: 20%; font-size: 30px; }
  .flexslider .slides img { max-width: 100%; }
  .section_04 dd { margin-left: 0; padding-left: 0; }
  .specification { display: block; }
  .csSpecBackground { background: none; }
  .section_05 .txt { display: inline-block; }
  .csSpecPreviewArea { text-align: center; }


  .section_04 dt { font-size: 18px; margin-top: 0; }
  .section_04 dd { margin-top: 0; font-size: 13px; }

}

@media (max-width: 767px) {
  .csFunctionLeftArea > div { padding-right: 0; padding-top: 50px; background-position: center top !important; text-align: center; }
  .csFunctionTitleRightArea5,
  .csFunctionTitleRightArea6,
  .csFunctionTitleRightArea7,
  .csFunctionTitleRightArea8 { padding-left: 0; padding-top: 50px; background-position: center top !important; text-align: center; }
}