/* ?? */

.xe_content .row {  }

.boardView {   }
.boardView h1 { margin: 0 0 0; border-bottom: 1px solid #666; padding-bottom: 20px;  font-size: 20px; }
.boardView .subInfo {  overflow: hidden; line-height: 30px; border-bottom: 1px solid #ddd; }
.boardView .subInfo span { font-size: 16px;  font-family: 'roboto', sans-serif; color: #666; line-height: 40px; float: left; display: inline-block; margin-left: 15px; }
.boardView .subInfo span:first-child { margin-left: 0; }
.boardView .subInfo span i { color: #999; vertical-align: -1px; font-size: 18px; margin-right: 5px; margin-left: 10px; }
.boardView .subInfo .sns { float: right; list-style: none; display: block; padding: 0; margin:  0; border-right: 1px solid #ddd;  }
.boardView .subInfo .sns li { float: left;   }
.boardView .subInfo .sns li a { float: left;  display: block; font-size: 20px; line-height: 40px; height: 40px; width: 40px; text-align: center; color: #999; border-left: 1px solid #ddd; }
.boardView .subInfo .sns li a.facebook:hover { color: #3B5998;  }
.boardView .subInfo .sns li a.google {  }
.boardView .subInfo .sns li a.twitter:hover { color: #55ACEE; }

.boardView .headImgWrap { text-align: center; }
.boardView .headImgWrap img { max-width: 360px; width: 100%; }

.boardView  .keyFeature { text-align: center; margin: 0 auto; max-width: 600px; }
.boardView  .keyFeature > img { display: inline-block; border:1px solid #ddd; width: 72px; border-radius: 2px;  margin: 10px 5px 0;}

.boardView .documentBody { padding: 20px 0; }
 

.boardView .documentNavigation { border-top:1px solid #ddd; height: 40px; overflow: hidden; position: relative; text-align: center; border-bottom: 1px solid #ddd; }
.boardView .documentNavigation a { line-height:40px; font-size: 16px; color: #666; text-decoration: none; }
.boardView .documentNavigation a i { vertical-align: -1px; margin-right: 5px;}

.boardView .documentNavigation a:hover,
.boardView .documentNavigation a:focus { background: #f4f4f4; }

.boardView .documentNavigation a.list { border-left: 1px solid #ddd;  border-right: 1px solid #ddd; display: inline-block; padding: 0 15px;}

.boardView .documentNavigation #prevDocBtn,
.boardView .documentNavigation #nextDocBtn { position: absolute; display: block; }

.boardView .documentNavigation #prevDocBtn { left: 0px; top:0px; border-right: 1px solid #ddd; padding-right: 15px; }
.boardView .documentNavigation #nextDocBtn { right: 0px; top:0px; border-left: 1px solid #ddd; padding-left: 15px;  }

.product_overview .contentHeader { display: none; }


.boardView.productDetail h2  { font-weight: 600; color: #000; font-size: 36px; margin-top: 0px; text-align: center; font-weight: 100; margin-bottom:20px; font-family: roboto, sans-serif; }
.boardView.productDetail h2 img { height: 60px; width: auto; }
.boardView.productDetail h2:before  { content: ""; display: block; margin: 0 auto; border-top:2px solid #d90000; width: 40px; margin-bottom: 15px;  }

.boardView  .productBody .row .col { margin-bottom: 20px; }
.boardView  .productBody .imgWrap { margin-bottom: 20px;  }
.boardView  .productBody .imgWrap img { width: 100%; }
.boardView  .productBody p { margin-bottom: 20px;color: #666;  }

.boardView  .tabs  li { width: 15% !important;  }
 
.boardView.productDetail .desc { margin-bottom: 40px; text-align: center; }
.boardView.productDetail .desc p { margin: 0; text-align: center; }
.boardView.productDetail .desc .sub1 { font-size: 18px;   line-height: 1.4em; margin-bottom: 10px; color: #666 }
.boardView.productDetail .desc .sub2 { font-size: 12px; color: #999; }

.boardView .productBodyWrap { position: relative; padding-top: 80px; }

.boardView .productBody { padding: 0px 20px 0; color: #666; }
.boardView .productBody h3 { font-size: 20px; font-weight: bold; margin-bottom: 10px; color: #d90000; }
.boardView .productBody h4 { font-size: 18px; font-weight: bold; margin-bottom: 10px; color: #333;margin-top: 16px; }
.boardView .productBody  ol li { position: relative;  margin-top: 7px;  line-height: 21px; margin-bottom: 20px; font-size: 14px;}
.boardView .productBody li ul, .boardView .productBody li ol { margin-top: 10px; margin-left: 10px; }
.boardView .productBody  ul li { position: relative; padding-left: 9px;  margin-top: 7px;  line-height: 21px; margin-bottom: 20px; font-size: 14px;}
.boardView .productBody  ul li:first-child { margin: 0; }
.boardView .productBody  ul li:before { content: " "; display: block; left: 0px; top:9px; background: #d90000;  width: 3px; height: 3px; position: absolute; border-radius: 2px; }
.boardView .productBody  ul.listType2 li:before {     content: ""; position: relative;    display: block;    background: #d90000;    width: 3px;    height: 3px;    border-radius: 2px;    margin: 10px auto; top:auto; left:auto}


 

.boardView .productBody table  {   border-top:1px solid #666; margin-bottom: 10px; }
.boardView .productBody table th { font-weight: bold; padding: 10px;  line-height: 20px; border-bottom: 1px solid #ccc; background: #eee;  text-align: center; vertical-align: middle; font-size: 13px; }
.boardView .productBody table tbody th { text-align: left; border-left:1px solid #ccc;  }
.boardView .productBody table td { padding:  10px;  border-bottom: 1px solid #ccc;  font-size: 13px; text-align: center; vertical-align: middle; border-left:1px solid #ccc;}

.boardView .productBody table td:first-child, .boardView .productBody table th:first-child { border-left: none; }

.boardView .productBody .caution {    color: #666;  font-size: 13px;  }
.boardView .productBody .caution:before { content: ""; font-family: xeicon; vertical-align: -1px; color: #d90000; display: inline; margin-right: 5px; }



.boardView  .productBody ul.footerNotice { margin-top: 30px; border:1px solid #eee; padding: 14px 19px; background: #fafafa; margin-bottom: 0; }
.boardView  .productBody ul.footerNotice li { font-size: 13px; }

.boardView.productDetail .functionWrap { margin-top: 40px; padding-top: 10px; border-top:1px solid #eee; }
.boardView.productDetail .functionWrap  ul { display: block; overflow: hidden; }
.boardView.productDetail .functionWrap  ul li { padding: 0 0 0 8px; margin: 0; font-size: 12px; line-height: 20px; margin-bottom: 5px; position: relative;  width: 30%; box-sizing: border-box; float: left;  font-weight: bold; color: #666; }
.boardView.productDetail .functionWrap  ul li:before { content: "";  display: block; position: absolute; width: 3px; height: 3px; background: #d90000; margin-right: 10px; vertical-align: middle; top:9px; left: 0px; }


/* 슬라이드 */

/* slider container */
.productImgs {
    position: relative;
}
#iosslider {
	position: relative;
	top: 0;
	left: 0;
	overflow: hidden;

	width: 100%;
	height: 0;
    padding: 0 0 67% 0;
}

/* slider */
#iosslider .slider {
	width: 100%;
	height: 100%;
}

/* slide */
#iosslider .slider .slide {
	float: left;

	width: 100%;
}

#iosslider img {
	/*max-height: 100%;*/
	/*max-width: 100%;*/
	/*width: auto;*/
}

#slideNav ul {
    margin-top: 20px;
	text-align: center
}

#slideNav ul li {
	width: 100px;
	display: inline-block;
	box-sizing: border-box;
	margin: 0 5px;
}
#slideNav ul li a {
    width: 100px;
    height: 70px;
	display: block;
	outline: 1px solid #ddd;
	overflow: hidden; display: block;
}
#slideNav ul li.selected a {
	outline: 1px solid #d90000;
}

#slideNav ul li a img {
	width: 100%;
    height: auto;
}

.sliderWrapper {
  position: relative;
    margin: 0 auto !important;
    max-width: 600px;
}
.slider-btn a {
  position: absolute;
  top: 50%;
  margin-top: -105px;
  display: inline-block;
  width: 40px;
  background-position: center;
  background-repeat: no-repeat;
  background: #fff;
  text-align: center; line-height: 35px;
  height: 40px;
  color: #999;
  border:1px solid #ccc;

  z-index: 100;
}

.slider-btn a:hover, .slider-btn a:focus { background: #d90000; color: #fff; border:1px solid #d90000; }

.slider-btn a.prev{
  left: 0;
}
.slider-btn a.next{
  right: 0;
}


 
 
/*  채창훈 추가 css  */
 
.boardView  .divider {margin: 60px 0 !important} 
.boardView .productBody h3 {margin-bottom: 30px; position: relative; padding-top: 30px} 
.boardView .productBody h3  b.pName {font-size: 1.4em;}
/* .boardView .productBody h3:before {content:"";  height: 1px; top: 15px; left: 50%; margin-left: -15px; background: #d90000; display:block; width: 30px; position: absolute;}  */

.boardView .productBody h4 {margin-top: 0 !important; }

.subTitle {max-width: 700px; display: block; text-align: center !important; margin: 0 auto 20px !important; font-weight: 300 !important; font-size: 20px !important; color: #666;}


.boardView .productBody  p {color: #333 !important; font-size: 14px !important; }
 
.boardView .productBody ul.listT2, .boardView .productBody ul {margin-left: 10px; margin-bottom: 20px;} 
.boardView .productBody ul.listT2 li, .boardView ul li {margin-top: 0 !important; margin-bottom: 5px !important;}

.boardView .imgThum {padding: 10px 10px 0; box-sizing: border-box; border: 1px solid #ccc;  margin-bottom: 20px; }
.boardView .imgThum h5 {font-size: 16px; font-weight: bold; /* padding-left: 20px;  */margin-bottom: 20px; position: relative; display: block; color: #000}
.boardView .imgThum h5:before {content: ""; display: inline-block; position: absolute; height: 12px; width: 2px; left: -11px; top: 8px; margin-top: -1px; background: #d90000}
.boardView h2 { font-size: 32px !important; display: block; max-width: 860px; margin: 0 auto 20px; text-align: center}
.boardView h3 {text-align: center; font-size: 26px !important}
.boardView h4 {font-size: 24px !important; color: #333; font-weight: 300 !important; padding-left: 10px; position: relative}
.boardView h4:before {content: ""; display: inline-block; position: absolute; top: 8px; left: 0; height: 22px; width: 2px; background: #d90000}
.boardView h5 {font-size: 16px !important; color: #333; font-weight: 500 !important;  position: relative; margin-bottom: 20px;}

.boardView .productBody table thead th {text-align: center; border-right: 1px solid #ccc; }
.boardView .productBody table thead th:last-child {border-right: 0;}
 
 
 
.boardView .pT100 {padding: 5px; background: #fff; text-align: center; display: inline-block; font-size: 12px;}
 
 
 
 .movBox {position: relative; width: 100%; height: 446px; margin-bottom: 20px}

 .movBox iframe {position: absolute; top: 0; left: 50%; margin-left: -320px; width: 640px; height: 400px; }
 
 
 .product_info_box { /* border: 1px solid #ccc !important;  */    padding: 20px  !important;  padding-bottom: 5px  !important; box-sizing: border-box !important; background: #efefef !important;/*  border-radius: 10px !important; */}
 
 .boardView .product_scroll_wrap { border-bottom:1px solid #ccc;    position: absolute; top:0px; left:0px; right:0px; background: #fff;  z-index: 999;}
.boardView .product_scroll  {   height: 40px; text-align: center;}
.boardView .product_scroll  a {  display: inline-block; margin: 0 10px; line-height: 40px; font-size: 16px; color: #333; text-align: center; white-space: nowrap;  transition: all 0.3s; min-width: 120px; }
.boardView .product_scroll   a:hover, .tabs   a:focus {   border-bottom: 1px solid #d90000;  color: #d90000; }
.boardView .product_scroll  a.on { border-bottom: 1px solid #d90000;  font-weight: bold; color: #d90000;}

@media all and (max-width: 1024px) { 
	.boardView .product_scroll  li  a { min-width: auto;   }
	} 
 
@media all and (max-width: 720px) {

.boardView .product_scroll_wrap { height: 40px; border-bottom: none;  left: -15px; right:-15px; }
 
.boardView .product_scroll   {   border-top:1px solid #ccc;   margin: 0;  background: #fff; padding-top: 41px; height: 0px; overflow: hidden; z-index: 999; position: relative; z-index: 999; } 
 .boardView .product_scroll  li { display: block;  margin: 0; padding: 0; margin-bottom: 0 !important; }
.boardView .product_scroll:hover  { height: auto; }
.boardView .product_scroll  li  a { display: block; line-height: 40px; font-size: 16px;  color: #333; text-align: left; white-space: nowrap;  transition: all 0.3s; min-width: 120px; border-bottom: 1px solid #ccc !important; padding: 0 15px; }
.boardView .product_scroll  li  a:hover, .tabs  li  a:focus {   border-bottom: none; color: #d90000;  background: #fafafa;}
.boardView .product_scroll  li.on {  position: absolute; top:0px; left:0; right:0px;   }
.boardView .product_scroll  li.on a { border-bottom: none;  padding: 0 15px; 	}
.boardView .product_scroll  li.on a:after { font-family: xeicon; content: "\e936"; display: block; float: right; color: #999;  font-size: 0.9em; }
	
	
	
 .movBox {position: relative; width: 100%; padding: 56.6% 0 6px !important; height: auto; }
 .movBox iframe {position: absolute; top: 0; left: 0; margin-left: 0 !important; width: 100%; height: 100%; }
	.slider-btn a { display: none; }
    #slideNav ul:after {
        content: '';
        display: block;
        clear: both;
    }
    #slideNav ul {
        margin: 20px 0 0 -10px;
    }
    #slideNav ul li {
        float: left;
        display: block;
        margin: 0;
        padding-left: 10px;
        width: 20%;
    }
    #slideNav ul li a {
        max-width: 100%;
        width: auto;
        height: auto;
    }
.boardView  .keyFeature > img {  width: 64px; }

.boardView .imgThum {}


.boardView .pT100 {    font-size: 8px !important;
    padding: 0 4px !important;
    text-align: left !important;
    white-space: nowrap;
    margin-left: -20px;
    position: relative;
    top: -5px;}


}
.boardView .subInfo .sns li{margin-bottom: 0!important;}
@media all and (max-width: 768px) {
	.boardView h1{font-size: 16px;}
	.boardView .subInfo span{font-size: 14px;}
	.boardView .subInfo span{line-height: 30px;}
	.boardView .subInfo .sns li a{width: 30px; height: 30px; line-height: 30px;}
	.boardView .subInfo .sns li{margin-bottom: 0!important;}
}
@media all and (max-width: 500px) {
	.boardView h1{font-size: 14px;}
	.boardView .subInfo span{font-size: 12px;}
}

@media all and (max-width: 479px) {

 

    .boardView .productBody table {
        font-size: 12px;
    }
    .boardView .productBody table th {
        width: 70px;
        white-space: normal;
    }

    .boardView h1 {
        font-size: 16px;
    }

}

@media all and (max-width: 360px) {





}
