@charset "utf-8";

#video {
  position: relative;
  background: #000;
  width: 640px;
  margin: 20px auto;
}

#video img,
#video iframe { display: block; }

#play {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
/*  background: url('../../images/play-button.png') no-repeat 50% 50%;*/
  background-size: auto, cover;
  z-index: 9999;
    transition: .4s
}
#play:hover { background-color: rgba(0,0,0,0.2) !important;  transition: .4s}

/*사운드컨덕터 영상*/
#soundConductorVideo {    width: 394px;
    height: 291px;
    margin: 0 auto;} 
#soundConductorVideo img {width: 100%; height: auto;}
#soundConductorVideo #play {width: 394px;
    height: 291px;
    left: auto;
    top: 165px;
}


.topInfo .txtImg {width: 100%; float: left; position: relative;}
.topInfo .txtImg .c60 {width: 55%;} 
.topInfo .txtImg .c60 span:nth-child(1) {}
.topInfo .txtImg .c60 .txtImgTitle .font-s {font-size: 0.55em;}
.topInfo .txtImg .c60 .txtImgTitle { width: 90%; line-height: 1.6em;
    float: left;
}
.topInfo .txtImg .c60 p.noticeTxt {margin-bottom: 20px;margin-top: 50px;font-size: 0.85em;float: left;}
.topInfo .txtImg .c40 {}
.topInfo .txtImg .c40 img {}

/*스티커*/
.sticker{padding: 12px 12px 8px 12px;border-radius: 0 14px 0 14px;background-color: #00aeef;color: #fff;float: left;margin-bottom: 20px;}
.product .sticker {text-align: left}
.sticker p:nth-child(1) {font-size: 14px;}
.sticker p:nth-child(2) {font-size: 17px; line-height: 1.3em} 
.sticker h3{color: #fff;font-size: 24px;line-height: 32px;}

/*제품페이지 내 설명 타이틀*/
.innerTitle h6 {line-height: 3.2em; margin-left:5px; font-size: 0.9em;} 
 
.cf00 {color: #f00022;}
.white{color: #eee;}


/*회색탭*/ 
.tab-content {padding-bottom: 30px;}

.tab-nav{
    display: none;
/*  opacity:0;*/
  transition:all .3s linear;
  -moz-transition:all .3s linear;
  -webkit-transition:all .3s linear;
}
/*
.multipletab:hover .tab-nav{
  opacity:1;
}
*/
.tab-nav>span{
  position:absolute;
  top:50%;
  cursor:pointer;
  display:block; 
}
.tab-nav>span.next{
  right: 50%;
    margin-right: -480px;
}
.tab-nav>span.prev{
 left: 50%;
    margin-left: -480px;
}

.tab-buttons>span.active {    background: #e0e0e0;
    color: #333;
    position: relative;
    border-top: 3px solid #fff;}
.tab-buttons>span {background: #fff;}

#feature table {color: #2f2f2f}

/*soundNav*/
#soundNav p {margin-top: 10px; font-size: 18px;}
#soundNav img {width: 100%; margin-bottom: 30px;}
.soundNavTable {}
.soundNavTable tr {}
.soundNavTable tr th {text-align: center;
    font-weight: 400;
    padding: 10px 0;
    border-bottom: 1px dashed #333;}
.soundNavTable tr th:first-child {text-align: left}
.soundNavTable tbody tr td {padding: 6px 0;
    border-bottom: 1px dashed #333; text-align: center;}
.soundNavTable tbody tr td:first-child {text-align: left;}

/*soundConductor*/
#soundConductor {}
#soundConductor h3 {}
#soundConductor p {margin: 10px 0 60px 0; font-size: 18px;}
#soundConductor img {    margin: 0 auto;
    display: block;}

/*speechZone2*/
#speechZone2 {}
#speechZone2 h3 {}
#speechZone2 p {margin: 10px 0 78px 0; font-size: 18px;}
#speechZone2 img {margin: 0 auto;
    display: block;}

/*speechPro*/
#speechPro {}
#speechPro .c45 {}
#speechPro .c45 span {margin-left: 7px;}
#speechPro .c45 .c666 {margin-top: 22px;}
#speechPro .c45 p {margin-top: 10px;  font-size: 18px;}

#speechProVideo {width: 100%; height: auto;}
#speechProVideo img {width: 100%; height: auto;}
#speechProVideo #play {right: 0; width: 435px; left: 50%;}

/*spatial*/
#spatialVideo {width: 100%; height: auto;}
#spatialVideo img {width: 100%; height: auto;}
#spatialVideo #play {right: 0; width: 435px; left: 50%;}
#spatial .c666 {margin: 20px 0 0 8px;}
#spatial p {margin-top: 10px;  font-size: 18px;}



/*메인 제품 테이블*/
.productTable {width: 100%; float: left; color: #333;}
.productTable th:first-child {padding: 0 0 5px 0} 
.productTable th {padding: 0 0 5px 15px; border-bottom: 1px dashed #666;
    border-spacing: 2px;
    text-align: left;
    font-weight: 400; text-align: center}
.productTable th:first-child {text-align: left;}

.productTable tr {}
.productTable tbody tr td {border-spacing: 2px; border-bottom: 1px dashed #666; padding: 4px 0; text-align: center}
.productTable tbody tr td:first-child {text-align: left}
.productTable td span:first-child {}
.productTable td span:last-child {    font-size: 0.8em;
    margin-left: 5px;} 

#feature h3 {margin-bottom:0; float: left}
#feature .tab-content .c45>p {float: left;}

/*제품 리스트*/
.productList {background: #f8f8f8}
.productList h3 {text-align: center; font-size: 1.8em; font-weight: 400; margin: 50px 0 20px 0}
.productList ul {}
.productList li {float: left;
    width: 32%;
    background: #fff;
    text-align: center;
    border: 1px solid #ddd;
    padding: 30px 0; margin-bottom: 14px; transition: 0.2s}
.productList li:hover {border: 1px solid #00AEEF}
.productList li:nth-child(3n+2) {    margin: 0 14px;}
.productList li a {}
.productList li a img {}
.productList li a p {    color: #666;}
.productList .paging {margin: 50px 0 100px 0}
.productList .paging .active a {color: #fff}

/*상단 탭 제거*/
.product>.tab {display: none;}
.engName {font-size: 0.9em;
    color: #666;
    margin-left: 10px;
    line-height: 4.5em;}

/*하단 세개 배너*/
.gogoBanner {margin: 110px 0 0 0;}

.txtImgTitle .f600 {font-weight: 400}
.product #style {margin-top: 80px;}
.txtImgTitle p {font-size: 1em; font-weight: 400}
.flexGogo {    background: #003b67;
    color: #fff;
    padding: 8px 20px;
    border-radius: 7px;
    font-size: 16px;
    font-weight: 300;}
#style>p {font-size: 18px}


/*1280 이하 모니터 및 태블릿*/
@media (max-width: 1024px) {
    
    .productList {margin-top: 59px;}
    
    /*하단 회색 기능탭*/
    .tab-content {margin-top: 30px;}
    #soundNav .c50 {float: none; margin: 0 auto;}
    .tab-content .c45 {width: 45%;}
    #soundNav .c45 {width: 100%;}
    

}

/*모바일*/
@media (max-width: 800px) {
    div.topInfo {width: 100%; float: left; height: 100%;}
    .topInfo .sns {width: 100%; position: static}
    .topInfo .txtImg .c60 p.txtImgTitle {/*padding-bottom: 20px;*/ font-size: 1.3em; width: 100%;}
    
    /*제품페이지*/
    .topInfo .txtImg .c40 img {margin: 0 auto; display: block;}
    .topInfo .txtImg .c60 {width: 100%; margin-top: 255px;}
    .topInfo .txtImg .c60 h4 {font-size: 1.2em;}
    .topInfo .txtImg .c40 {width: 100%; top:0}
    
    /*회색탭*/ 
    .tab-content {top: 10px; width: 100%; float: left} 
    .tab-content>div {top: 0;}
    .tab-buttons {width:100%; display: block;}
    .tab-buttons span {font-size: 0.8em;}
    .tab-nav {display: none;}
    .engName {line-height: 2em;}
    
    /*soundNav*/
    #soundNav .c50 {width: 100%;}
    .soundNavTable1 {width: 100%;
    float: left;
    overflow-x: auto;}
    .soundNavTable2 {width: 100%;
    overflow-x: auto;}
    .soundNavTable {width: 100%;} 

    /*speechZone2*/ 
    #speechZone2 p {margin: 20px 0 40px 0}
    #speechZone2 img {     width: 50%;
    margin: 0 auto;
    display: block;}
    
    /*soundConductor*/ 
    #soundConductorVideo #play {top: 158px;} 
    
    /*회색탭-기능 테이블*/ 
    .productTable1 {width: 100%; overflow-x: auto;}
    .productTable2 {width: 100%; overflow-x: auto;}
    .ts {width:100%;} 
    
    /*제품리스트*/
    .productList li {width: 100%; }
    .productList li:nth-child(3n+2) {margin: 0 0 14px 0}
    
    #soundNav img {width: 55%;
    margin: 0 auto;
    display: block;}
    
    .tab-content {padding-bottom: 0}
    #benefits .productTable1:last-child {margin-bottom: 0}
    #spec .productTable1:last-child {margin-bottom: 0}
    
}

/*모바일*/
@media (max-width: 420px) {
    div.topInfo {width: 100%; float: left; height: 100%;}
    .topInfo .sns {width: 100%; position: static}
    .topInfo .txtImg .c60 .txtImgTitle {/*padding-bottom: 20px;*/ font-size: 1.3em; width: 100%;}
    
    /*제품페이지*/
    .topInfo .txtImg .c40 img {    width: 80%;
    margin: 0 auto;
    display: block;}
    .topInfo .txtImg .c60 {width: 100%; margin-top: 255px;}
    .topInfo .txtImg .c60 h4 {font-size: 1.2em;}
    .topInfo .txtImg .c40 {width: 100%; top:0}
    
    /*회색탭*/ 
    .tab-content {top: 10px; width: 100%; float: left}
    .tab-content>div {top: 0;}
    .tab-nav {display: none;}
    #feature .tab-content .c45>p {margin-top: 0}
    
    /*soundNav*/
    #soundNav img {width: 100%;}
    #soundNav p {margin: 0 0 50px 0}
    .soundNavTable1 {width: 100%;
    float: left;
    overflow-x: auto;}
    .soundNavTable2 {width: 100%;
    overflow-x: auto;}
    .soundNavTable {width: 100%;}
    
    /*soundConductor*/ 
    #soundConductor p {margin: 0 0 40px 0; float: left}
    #soundConductor img { width: 100%;}
    #soundConductorVideo {width: 100%; height: 213px;}
    #soundConductorVideo #play {width: 100%; height: 213px;}
    #soundConductorVideo iframe {width: 100%; height: 213px;}

    /*speechZone2*/ 
    #speechZone2 p {margin: 0 0 40px 0; float: left}
    #speechZone2 img { width: 100%;}
    
    
    .tab-content .c45 {width: 100%;}
    
    /*speechProVideo*/
    #speechProVideo {width: 100%; height: 213px;}
    #speechProVideo #play {width: 100%; height: 213px;}
    #speechProVideo iframe {width: 100%; height: 213px;}
    
    /*speechProVideo*/
    #spatialVideo {width: 100%; height: 213px;}
    #spatialVideo #play {width: 100%; height: 213px;}
    #spatialVideo iframe {width: 100%; height: 213px;}
     
    #speechPro .c45 .c666, #spatial .c666 {margin-top: 8px;}
    #speechPro .c45 p, #spatial p {margin-top: 10px;}
    
    /*회색탭-기능 테이블*/ 
    .productTable1 {width: 100%; overflow-x: auto; margin-bottom: 20px;}
    .productTable2 {width: 100%; overflow-x: hidden;}
    .ts {width:100%;} 
    
    /*제품리스트*/
    .productList li {width: 100%; }
    .productList li:nth-child(3n+2) {margin: 0 0 14px 0}
    
    .tab-content .c45 {margin-top: 15px;}
    .engName {width: 100%;
    margin: 0;
    float: left;
    line-height: normal; margin-bottom: 20px;}
    
    #feature table {font-size: 0.63em;}
    
    
    
}