﻿@charset "utf-8";
/* 設計師用 RWD版CSS檔 style_rwd.css */
/* 說明：
    可提供設計師在此檔，針對RWD版面進行設計；非RWD版面則不需載此CSS檔。*/

@media (min-width:1400px) {
    .wid-home-news .slick-btn .slick-prev, .wid-home-news .slick-btn .slick-prev:focus, .wid-home-news .slick-btn  .slick-prev:hover{

        left: 0;
    
    }

    .wid-home-news .slick-btn  .slick-next, .wid-home-news .slick-btn  .slick-next:focus , .wid-home-news .slick-btn  .slick-next:hover{
        right: 0;
    }

}
@media (min-width:1199px) {
    /* .sec-series .series-info{
        width: 85%;    
    } */
    .news-search-area> ul{
        display: flex;
        justify-content: space-between;    
    }    

    .news-search-area li select{
        min-width: 200px;
    }
    .btn-forum{
        position: absolute;
        right: 15px;
        top: 9px;
        z-index: 20;        
    }      
	.news-search-area ul {
		display: flex;
		align-items: center;
		
    }

    body.class .side .btn-forum {
        position: static;
        margin-top: 10px;
        width: 100%;
    }
    

}
@media (min-width:991px) {
    .footer .sitemap .link-area{
        text-align: right;
    }

    .slider-area-normal .slick-prev, .slider-area-normal .slick-prev:focus, .slider-area-normal .slick-prev:hover{
        position: absolute;
        left: 5%;
        top: 88%;
        transform: translate(-50%, 0);    
        background: url(../_images/all/icon_prev5.png) no-repeat  0 0;
        width: 30px;
        height: 30px;   
        transition:all .5s;
        border:none;
    }


.slider-area-normal .slick-prev:hover{
    background: url(../_images/all/icon_prev5.png) no-repeat -30px 0;
    transition:all .5s;
    
}
.slider-area-normal .slick-next, .slider-area-normal .slick-next:focus, .slider-area-normal .slick-next:hover{
    position: absolute;
    left: 95%;
    bottom: 7%;
    top:auto;
    transform: translate(-50%, 0);  
    background: url(../_images/all/icon_next5.png) no-repeat -30px 0;
    width: 30px;
    height: 30px;   
    transition:all .5s;
    border:none;
    
      
}
.slider-area-normal .slick-next:hover{
    background: url(../_images/all/icon_next5.png) no-repeat  0 0;
    transition:all .5s;
    
}   
    .simg-slider {
        /*padding: 30px 0;  
        
        position: relative;
        top: 50%;
        transform: translateY(-50%);*/
    } 


    #sidecollapse {
        display: block !important;
        height: auto !important;
    }
     .btn-pro-series li{
        width:calc( 100% /3 );
        float:left;
        margin-bottom: 10px;
    }
    .btn-pro-series li a.hvr-rectangle-out{
        font-size: 18px;
        color: #000;
        font-weight: bold;
        border: 1px solid #a5a3a1;
        display: block;
        margin: 0 10px;
        text-align: center;
        padding: 10px 20px;
        background:#fff;
    }

    .btn-pro-series li a.hvr-rectangle-out:before {
        background: #ee7400;

    }
    .btn-pro-series li a:hover{
        border:1px solid #ee7400;
        color:#fff;
    }

    .footer .sitemap .epaper{
        max-width: 374px;
    }
    .side .sub-menu{
        border: 1px solid #d7d7d7;
    }
    .tb-cart td a.link{
        display: flex;
        flex: 1;
        align-items: center;
    }
    .tb-cart td a.link .pic{
        margin: 0 10px 0 0;
    }   
    .sub-menu.sub-csr  li{
        position: relative;
        padding: 0 10px;    
    }
    .sub-menu.sub-csr  li a{
        padding: 5px 20px;    
        color:#000;
        background:none;
    }
    .sub-menu.sub-csr  li+li:before{
        content: "|";
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: 50%;
        right: 100%;
        transform: translateY(-50%);
    }
    .sub-menu.sub-csr a.hvr-shutter-out-horizontal:before {
        background: none;
        border-radius: 20px;
        border: 1px solid #000;
    }
    body.csr.show .content h3.st2 {
        border: 1px solid #fff;
        padding: 10px;

    }
    
    .footer .sitemap .link-area .sitemap-link{
        max-width: 400px;
        float: right;
    }

}
@media (min-width:785px) {
    table.table.tb-forum tr td:not(:nth-child(1)), table.table.tb-forum tr th:not(:nth-child(1)){
        border-left:1px solid #ddd;
    } 
}
@media (min-width:767px) {
    .content .wid-home-news>.container, body.home .event-area>.container, body.home .news-area >.container{
        padding: 0 80px;
    }
    .navbar .navbar-collapse{
        padding:0;
    }
    .header .navbar .top-link {
        margin: 20px -10px 0 auto;
    }
    .header .navbar .nav-search-box.top-link {
        margin: 20px 0 0 auto;
    }

    .slider-area{
        position: relative;

    }    
    .slider-area.styleB{
        padding: 0 55px;
    }     
    body.home .wid-home-solution .solution-list{
        padding:0 80px;
    }
    .m-menu{
        display: none;
    }
    .footer .sitemap .link-area .sitemap-link{
        margin-top:20px;
        max-width: 400px;
    }
.footer .foo_link_sec{
    text-align: center;
}
.footer .sitemap .link-area{
    display: inline-block;
}

    
    table.tb-pseries.tablesaw th, table.tb-pseries.tablesaw td{
        text-align: center;
    }
    .resp-tabs-list.pro-tabs{
        display: flex;
        margin-bottom: 4px;
    }

    .resp-tabs-list.pro-tabs li{
        flex: 1;
        text-align: center;
    }

    table.table.tb-pseries.tb-pnumber th:nth-last-child(2), table.table.tb-pseries.tb-pnumber th:nth-last-child(3){
        /*width:130px;*/
    }
    .news-search-area li a.btn {
        width:100px;
    }    


    body.product.search table.table.tb-normal, body.forum.publish table.table.tb-normal{
        width:90%;
        margin-left:auto;
        margin-right: auto;
    }
    .author{
        display: flex;
        justify-content: space-between;
        align-items: center;   
    }   
    .navbar .dropdown-menu{
        opacity:0;
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-animation-fill-mode: forwards;  
        animation-fill-mode: forwards; 
        -webkit-transform: scale(1, 0);
        display: block; 
        transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        pointer-events: none;
        
    }
    .yamm .dropdown.pronav ul{
        margin-top: -2px;
    }
    .navbar .open>.dropdown-menu{
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);  
        opacity:1;
        pointer-events: fill;
    }   
    .tb-inquiry td .pic, .tb-cart td .pic{
        max-width:100px;
        min-width: 100px;
        margin: 0 auto;
    }     

    .form-inline .form-group+.form-group{
        margin-left: 10px;
    }      
    table.table.tb-nobg tr:last-child th, table.table.tb-nobg tr:last-child td{
        border-bottom: 1px solid #ddd;
    }
    table.table.tb-ir tr td li div[class*="col"]:nth-child(2){
        border-left: 1px solid #ddd;
    }
    table.table.tb-ir tr td li div[class*="col"] {
        border-bottom: 1px solid #ddd;
    }
    table.table.tb-ir tr td li:last-child div[class*="col"] {
        border-bottom: none;
    }
    .csr-list div[class*="col"] .pic:before{
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.47058823529411764);
        z-index: 1;
        transform: scale(1);    
        transition: all .5s;    
    }

    .csr-list div[class*="col"]:hover .pic:before{
        opacity: 0;
        transform: scale(1.2);    
        transition: all .5s;    
        
    }
    .csr-category-list .pic:before{
        position: absolute;
        content:"";
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.4196078431372549);
        color: #fff;
        transition: all .3s;
        transform:scale(1);
        opacity:1;
    }
    .csr-category-list a:hover .pic:before{
        background:none;
        transition: all .3s;
        transform:scale(1.2);
        opacity: 0;
        
    }  
    .csr-category-list .info h4{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) scale(1);
        transform-origin: center;
        transition: all .5s;
        color:#fff;
        opacity: 1;
        
    }

    .csr-category-list a:hover h4 {
        transform: translate(-50%, -50%) scale(5);
        transform-origin: center;
        transition: all .5s;
        opacity: 0;
    }
	body.unsubscribe td.minW{
		width: 142px;
		border-right:none!important;
	}
	body.unsubscribe td.minW+td{
		border-left:none!important;
		
	}
	.header .navbar .top-link li{
	    vertical-align: middle;
	    max-height: 28px;
	}
	.google-search input#gsc-i-id1, .top-link .search-area input{
		   /* max-width: 130px;*/
	}
    .header .navbar .navbar-nav > li .pro-menu > ul{
        width: calc(100% / 4);
        float: left; 
        position: relative; 
    }
    .content .wid-home-news .slick-slider .slick-track{
        display: flex;
        align-items: center;
    }
    table.table.tb-normal.tb-location th, body.product.search table.table.tb-normal th, body.forum.publish table.table.tb-normal th, body.forum.show table.table.tb-normal th, .contact-form table.table.tb-normal th, table.table.tb-sign th, table.table.tb-inquiry-form th, body.cart.p02 table.table.tb-normal th, table.table.tb-member > tbody > tr > th, body.modify table.table.tb-normal > tbody > tr > th  {
        width: 25%;
    }

    body.solution  .tabs-area .resp-tabs-container {
        padding: 10px 0;
    }
    
    body.download.show  table.table.tb-newSt.tb-forum td.txt-md-right{
        text-align: right;   
    }
    body.download.show  table.table.tb-newSt.tb-forum td.txt-md-center{
        text-align: center;   
    }
    body.download.show  table.table.tb-newSt.tb-forum th.tb-title.w-1 {
        width: 15%;
    }
}
@media (max-width: 1199px) and (min-width: 991px){
    .header .navbar >.container{
       width:100%;
    }
}
@media (max-width: 991px) and (min-width: 767px){
    body.member.login .tb-member .btn-box a{
        margin-bottom:5px;
    }
}
@media (max-width: 991px) and (min-width: 767px){
    .header .navbar .navbar-nav > li > a {
        font-size: 15px;
        padding: 15px 7px 22px;
    }
    .content .btn-box .pager li > a{
        margin-bottom: 10px;
    }
    .form-inline.invoice-area .form-group{
        margin-left: 0;
        margin-bottom: 10px;
    }
    

}
@media (min-width: 600px){
    .footer .copyright li:nth-child(2) {
        float: right;
    } 
}
@media (min-width: 481px){
    table.bt.responsive-tb tbody td::before{
        border-right: 1px solid #ccc;
    }
}
@media (max-width: 1400px) {
    body.home .news-slider, body.home .event-slider{
        padding: 0 70px;
    }
}

@media (max-width: 1199px) {
    body.product.search.result2 .pro-series.new-st .lists a{
        margin: 0 5px;
    }
    .header .banner .bxslider li {
        height: auto;
    }

    .header .banner .bxslider li img {
        display: block;
    }


    .header .navbar .navbar-nav > li {
        float: none;
        display: inline-block;
    }


    .banner .bxslider li img.big-img {
        display: none;
    }
    
    .banner .bxslider li img.small-img {
        display: block;
    }

    #floating {
        margin-top: -90px;
    }
    .news-search-area li{
        margin-bottom: 10px;
    }
    .news-search-area li:not(:nth-child(2)):not(:nth-child(3)){
        display: block;
    }
    .news-search-area li:nth-child(2), .news-search-area li:nth-child(3){
        width:50%;
        float:left;
    }
    .news-search-area li:nth-child(2) .input-group, .news-search-area li:nth-child(3) .input-group{
        width:100%;
    }
    .btn-forum{
        margin-bottom: 30px;
    }    
    .footer .sitemap .sitemap-link li {
        width: 179px;
    }
    
    .footer .foo_logo_area {
        margin-bottom: 20px;
    }

    body.class .side .btn-forum {
        margin-top: 10px;
        margin-bottom: 0;
    }
    body.class .side .btn_sec {
        text-align: right;
    }
    .newtempTable.stp table 
    tr td:nth-child(1),
    .newtempTable.stp table 
    tr td:nth-child(2) {
        width: 200px;
        white-space: nowrap;
    }
}

@media (max-width: 991px) {
    body.product.search.result2 .pro-series.new-st .lists .btn{
        padding: 6px 1px;
        font-size: 14px;
    }
    .side-menu .side-toggle {
        display: block; 
        font-size: 15px;
        width: 100%;
        text-align: left;
        background: none;
        border: 1px solid #000;
        border-radius:0;
        margin-top: 10px;
        color: #000;
    }    
    .side-menu .side-toggle .glyphicon-chevron-down,
    .side-menu .side-toggle.collapsed .glyphicon-chevron-up {
        display: none;
    }

    .side-menu .side-toggle .glyphicon-chevron-up,
    .side-menu .side-toggle.collapsed .glyphicon-chevron-down {
        display: inline-block;
    }
    .side-menu .toggle-icon {
        float: right;
    }
    .sub-menu-list{
        margin:0;

        background: none;
    }
    .sub-menu-list li, .sub-menu-list li a{
        display: block;

    }
    .sub-menu-list li{
        padding:0;
    }
    .sub-menu-list li a{
        padding: 5px;
        background: none;        
    }
    .sub-menu-list li a:hover{
        color:#000;
        background:#ee7400;
    }

    .sub-menu-list li .hvr-rectangle-out:before{
        display: none;
    }


    .header .navbar >.container{
        width:100%;
    }


    .content .btn-more {
        top: 12px;
    }

    .side {
        padding-bottom: 20px;
    }
    .side .sub-menu, .side-menu .sub-menu{
        padding: 10px;   
        border: 1px solid #000; 
        border-top: none;        
    }
    .side .nav {
        max-width: none;
        margin: 0;

    }

    .side.menu-open .nav {
        display: block;
    }



    .simg-slider{
        padding:0 65px;
    }
    .author .date{
        display: block;
        margin:0;
    }
    .stakeholders-area div[class*="col"]:nth-child(1){
        margin-bottom: 15px;
    } 
    .sub-csr .sub-menu-list > li > a {
        color: #fff;
        background: #2f2f2f;
        display: block;
        font-size: 18px;
        padding: 10px 20px;
    }
    .sub-csr .sub-menu-list > li+li{
        margin-top:1px;
    }
    .partner-list .pic img.center-block{
        margin-left:0;
        margin-bottom: 20px;
    }   
    body.about .content .sec2 .pic {
        margin: 0 20px;
    }
    body.about .editor .sec1 .pic img {
        max-width: 100%;
        width: 90%;
    }

    body.about .content .sec2 {
        padding-left: 15px;
        padding-right: 15px;
        background: url(../_images/all/bg_about2.jpg) no-repeat center bottom;
        
    }
    body.about .content .sec3 img{
        width:100%;
    }
    .editor .sec2 .xsimg {
        width: 100%;
        margin-bottom: 10px;
    }
    .header .navbar .navbar-brand span{
        display: none;
    }

    body.member.class-record .search_sec .collapse_tit .btn {
        top: -10px;
        right: 16px;
    }
    .loginForm {
        max-width: 80%;
    }

    .footer  .foo_social_area {
        text-align: center;
    }
    
    .footer .foo_social_area .foo_tit {
        margin-bottom: 12px;
    }
    body.product.show .pro-series .pro-item .pic {
        height: 250px;
    }
    
    body.product.show .pro-pic-area .item.mob-posab {
        margin-top: 10px;
    }

}




@media (max-width: 767px) {
    .header .cookie .txt a.closeBox{
        top:-5px!important;
        right: -5px!important;
        font-size: 20px!important;
    }
    body.product .tags .tags_btn a .btn,
    body.solution .tags .tags_btn a .btn,
    body.news .tags .tags_btn a .btn,
    body.class .tags .tags_btn a .btn,
    body.download .tags .tags_btn a .btn,
    body.qa .ans_box .tags .tags_btn a .btn{
        margin: 5px 8px;
        white-space: normal;
        text-align: left;
    }
    body.product.search.result2 .pro-series.new-st .lists{
        margin: 0;
    }
    body.product.search.result2 .pro-series.new-st .Information {
        margin-top: 20px;
    }
    body.product.search.result2 .pro-series.new-st .Information .items{
        padding: 15px 20px;
    }
    .header .navbar .navbar-brand {
        display: inline-block;
        vertical-align: middle;
        float: none;
        margin:10px 0;
    }
    .header .navbar-toggle {
        float: none;
        display: inline-block;
        vertical-align: middle;
    }
    .header .navbar-header{
        position: relative;
    }
    .header .m-menu{
        margin: 0 0 0 auto;
        position: absolute;
        right:15px;
        top: 50%;
        transform: translateY(-50%);

    }
    .header .m-menu ul{
        margin-bottom: 0;
    }
    .header .m-menu ul li {
        vertical-align: middle;
    }
    .header .navbar .navbar-brand img{
        max-height: 50px;
    }

    .header .navbar .navbar-toggle span{
        display: block;
        width: 25px;
        background-color: #000;
        height: 2px;  
        transition: all .5s;
    }
    .navbar-header .navbar-toggle .icon-bar:nth-of-type(2) {
    /*-webkit-transform: translate3d(0, 6px, 0) rotate(45deg);
    transform: translate3d(0, 6px, 0) rotate(45deg);*/
    }

    .navbar-header .navbar-toggle .icon-bar:nth-of-type(3) {
    opacity: 0;
    filter: alpha(opacity=0);
    }

    .navbar-header .navbar-toggle .icon-bar:nth-of-type(4) {
   /* -webkit-transform: translate3d(0, -6px, 0) rotate(-45deg);
    transform: translate3d(0, -6px, 0) rotate(-45deg);*/
    }

    .navbar-header .navbar-toggle.collapsed .icon-bar:nth-of-type(2),
    .navbar-header .navbar-toggle.collapsed .icon-bar:nth-of-type(3),
    .navbar-header .navbar-toggle.collapsed .icon-bar:nth-of-type(4) {
        -webkit-transform: translate3d(0, 0px, 0) rotate(0deg);
        transform: translate3d(0, 0px, 0) rotate(0eg);
        opacity: 1;
        transition: all .5s;
    }   

    .btn-dl {
       display: flex;
       justify-content: center;
    }
    #floating .btn-floating {
        display: block;
    }

    #floating ul {
        width: 0;
        overflow: hidden;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        position: relative;
        top: -20px;        
    }

    #floating.open ul {
        width: 135px;
    }



    .header .navbar .navbar-toggle {
        font-size: 18px;
        color: #1EB5BE;
        letter-spacing: 2px;
        border: none;
        float: left;
        margin: 18px 10px 0 15px;
        padding: 10px 0;

    }

    .header .navbar .navbar-toggle:hover {
        background: none;
        color: #888;
    }

    .header .navbar .navbar-nav {
        background: none;
        border-top: 2px solid #525252;
        margin: 0 -15px;
        display: block;
    }

    .header .navbar .navbar-nav > li {
        display: block;
    }

    .header .navbar .navbar-nav > li + li:before {
        display: none;
    }

    .header .navbar .navbar-nav > li > a {
        width: auto;
        text-align: center;
        border-bottom: 1px solid #525252;
        padding: 10px;
        color:#fff;
    }
    .header .navbar .navbar-nav > li .pro-menu ul  a{
        text-align: left;
    }
    .header .navbar .navbar-nav li ul li.pro-menu li:hover a.icon-more{
        color:#fff;
    }
    .header .navbar .navbar-nav li ul li a.icon-more{
        position: absolute;
        right:5px;
        top:0;
        z-index: 20;
    }
    .header .navbar .navbar-nav > li ul li a:not(.icon-more){
        display: block;
    }

    .header .navbar .sub-nav {
        text-align: center;
        margin: 10px 0 20px;
        position: static;
    }

    .header .navbar .btn-default {
        color: #333;
    }

    .header .navbar .lang {
        text-align: center;
        display: block;
        position: static;
    }

    .header .navbar .lang .btn {
        width: 100%;
        background: none;
        font-size: 14px;
        border: none;
        float: none;
        display: block;
        padding: 8px;
    }

    .header .navbar .lang .btn,
    .header .navbar .lang .btn:active .header .navbar .lang .btn:focus {
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        color: #fff;
        background: #ee7202;
        /* display: table; */
        /* width: auto; */
        margin: 0 auto;
    }
    .header .navbar .lang  .dropdown-backdrop{
        display: none;
    }

    .header .navbar .lang .dropdown-menu {
        text-align: center;
        box-shadow: none;
        float: none;
        position: static;
        background: #aaa;    
        display: none;    
    }
    .header .navbar .lang.open .dropdown-menu {
        display: block;
    }


    .footer .sitemap .link-area .sitemap-link{
        display: none;
    }

    .footer .copyright,
    .footer .siteinfo,
    .footer .siteinfo ul {
        display: block;
    }

    .footer .siteinfo ul > li {
        display: block;
    }

    .footer .siteinfo ul > li + li:before {
        display: none;
    }

    .main {
        z-index: auto;
    }

 
    .side .nav > li {
        float: none;
        display: block;
        margin: 0;
    }

    .content .list-box .txt-list li.list-header {
        display: none;
    }

    .content .list-box .txt-list li span {
        float: none;
        display: block;
        padding: 0;
    }

    .content .btn-box {
        text-align: center;
    }

    

    .content .btn-box .page-info select {
        width: 100px;
        display: inline-block;
    }

    .content .btn-box .pager,
    .content .btn-box .page-info {
        float: none;
    }

    .content .btn-box .pager {
        display: block;
        margin-bottom:20px;
    }

    .content .btn-box .pager li {
        margin: 0;
        padding: 0;        
    }

    .content .btn-box .pager li > a {
        width: 100%;
        text-align: center;
        margin: 5px 0 0;
        padding-left: 0;
        padding-right: 0;
    }
    .header .navbar .top-link {
        margin: 0 auto;
        display: block;
        text-align: center;
        background: #ccc;
        margin-right: -15px;
        margin-left: -15px;
        padding: 10px;
    }

    .nav-search-box .google-search {
        width: 100%;
        margin-top: 10px;
    }

    .header .navbar .nav-search-box.top-link {
        width: 100%;
        left: 15px;
        display: none;
    }

    .header .navbar .top-link ul>li{
        display: block;
    }
    .header .navbar .top-link ul>li+li{
    	margin-top:10px;
    }
    .header .search-area .form-group{
        display: inline-block;
        margin-bottom: 0;
    }
    .header .navbar .top-link>ul{
        margin-bottom: 0;
        margin-left: 0;
    }
    .header .navbar .top-link .btn-area > li:nth-child(2),.header .navbar .top-link .btn-area > li:nth-child(3){
        display: none;
    }
    .header .navbar-collapse{
        background:#000;
        color:#fff;
        max-height: calc(100vh - 70px);
        z-index: 9999;
        position: relative;
    }
    .header .navbar .top-link .btn-area{
        margin-left: 0;
    }
    .header .navbar .top-link .btn-area li{
    	padding:0;
    }
    .header .navbar .top-link .btn-area > li a{
        padding:10px;
    }
    .header .navbar .top-link .btn-area > li:nth-child(1) a {
	    height: auto;
	    width: auto;
	    background: #000;
	    text-indent: 0;
	    color: #fff;
    }
    body.home .wid-home-solution .solution-list a h3 {
        right: auto;
        top: auto;
        background: #000;
        padding: 3px 10px;
        margin: 0;
        position: relative;
    }
    body.home .wid-home-solution .solution-list a:before{
        display: none;
    }
    body.home .wid-home-solution .solution-list a:hover h3 {
        transform: scale(1);
        transition: all .7s;
    }
    body.home .wid-home-solution .solution-list div[class*="col"]{
        margin-bottom: 0;
    }
    body.home .news-slider, body.home .event-slider {
        padding: 0 15px;
    }
    .wid.wid-home-news {
        padding-top: 10px;
    }
    .slick-btn{
        text-align: center;
    }
    .slick-btn .slick-next, 
    .slick-btn .slick-prev{
        /*position: relative;
        display: inline-block;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;    
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0);  
        margin:10px;*/          
    }

    body.home .slider-area .slick-next, 
    body.home .slider-area .slick-next:focus, 
    body.home .slider-area .slick-next:hover, 
    body.home .slick-btn .slick-next, 
    body.home .slick-btn .slick-next:focus, 
    body.home .slick-btn .slick-next:hover,
    body.home .banner .bx-next {
        background-position: -42px 0;
        width: 40px;
        height: 40px;
        background-size: 80px;
    }
    
    body.home .slider-area .slick-prev, 
    body.home .slider-area .slick-prev:focus, 
    body.home .slider-area .slick-prev:hover, 
    body.home .slick-btn .slick-prev, 
    body.home .slick-btn .slick-prev:focus, 
    body.home .slick-btn .slick-prev:hover,
    body.home .banner .bx-prev {
        background-position: -40px 0;
        background-size: 40px;
        width: 40px;
        height: 40px;
        background-size: 80px;
    }
    .breadcrumb{
        text-align: left;
    }
    .main_content {
        padding: 30px 0 0;
    }
    .tabs-area h2.resp-tab-active{
        border:none!important;
        background:#ee7500!important;

    }
    .tabs-area h2.resp-accordion{
        color:#fff;
    } 
    .tabs-area h2.resp-tab-active span.resp-arrow{
        border-bottom: 12px solid #ffc894;
    }
    .tabs-area .resp-tab-content,.tabPane{
        /*padding:20px 0;*/
    }
    .tabs-area .resp-tab-content > div {
        padding: 20px 0;
    }
    body.product.show .tabs-area .resp-tab-content{
        padding: 0;
    }
    
    table.table > tbody> tr> td{
        padding:10px!important;
        border-bottom: 1px solid #ddd!important;        
    }
    table.table:not(.tb-scroll) tbody tr td{
        text-align: left!important;
    }
    table.table:not(.tb-normal):not(.tb-nobg) tr:nth-child(even) td {
        background: #eee!important;
    }
    table.table:not(.tb-normal) tbody tr+tr{
        border-top:2px solid #919191;
    }
    table.table.tb-normal >thead>tr> th{
        display: none;
    }
    table.table.tb-normal>tbody>tr> th, table.table.tb-normal >tbody>tr> td,
    table.table.tb-nobg tr th, table.table.tb-nobg tr td{
        display: block;
        border:none;
        text-align: left!important;
        padding: 5px;        
        width:100%;
    }
    table.table.tb-normal>tbody>tr> th, table.table.tb-nobg tr th{
        color:#ee7500;

    }


    .simg-slider .slider-nav{
        display: none;
    }



    a.btn-style{
        display: block;
    }
    .news-list .ndate{
        float:none;
        display: block;        
    }
    .author-info{
        margin-bottom: 10px;
    }
    table.table.tb-dl tr td:nth-child(1){
        border-bottom: none!important;
    }
    td .form-group{
        margin-bottom: 10px;
    }
    table.table.tb-pseries th, table.table.tb-normal >tbody>tr> th{
        background: #ededed;   
        color: #6e6e6e;       
        padding: 7px!important;             
    }   
    table.table.tb-pseries.tb-pnumber th, table.table.tb-forum th {
        color: #fff;
    }
    .navbar-nav .open .dropdown-menu{
        background: #343434;       
    } 
    .navbar-nav .open .dropdown-menu li+li{
        border-top:1px solid #585858;
    }
    .navbar-nav .open .dropdown-menu li a{
        color:#fff;
        text-align: center;
    }
    table.table tr td a, .btn-box ul li{
        /*display: block;*/
    }
    .content .pager-num li a {
        padding: 3px;
    }
    
    .content .pager-num li:nth-child(1), 
    .content .pager-num li:last-child {
        margin: 0 5px;
    }

        body.class .content .pager-num li{
            display:inline-block;
        }
            body.class .content .pager-num li a{
                border:1px solid #000;
                border-radius:5px;
                width:50px;
                height:50px;
            }
            body.class .content .pager-num li a:hover {

                background: #ee7400;
                color: #fff;
                border: 1px solid #ee7400;
            }
            body.class .content .pager-num li:not(:nth-child(1)):not(:last-child):not(:nth-child(2)):not(:nth-last-child(2)) {
                display: none;
            }
            body.inquiry .btn-box a + a, body.cart .btn-box a + a, .btn-box ul li + li {
                margin-top: 5px;
            }
    body.class .content .pager-num li:nth-child(1), body.class .content .pager-num li:last-child {
        margin: 0;
    }
    body.inquiry .btn-box a.pullR, body.cart .btn-box a.pullR{
        float:none;
    }
    body.inquiry .qty input, table.tb-cart .qty .input-group{
        margin: 0 ;    
    }   
    .total-area{
        padding: 20px 8px;
        text-align: left;        
    }
   
    .form-inline .zip-code {
        width: 20%;
        min-width: 72px;
    }
    table.table.tb-nobg tr:nth-child(1) th{
        border-top:1px solid #ddd;
    }
    .content .msg-box table.table tr td.leave-msg{
        background:none!important;
    }
    table.table.tb-ir tr td li div[class*="col"] {
        padding:0;
    }
    table.table.tb-ir tr td li +li {
        margin-top:10px;
    }
    table.table.tb-ir tr td li div[class*="col"]:nth-child(1), ul.stakeholders-list li{
        background: url(../_images/all/list_icon4.png) no-repeat 0 3px;
        padding-left: 20px;
    }
    table.table.tb-ir tr td li div[class*="col"]{
        padding-left: 20px;
    }  
    .table-responsive table.table tr td:not(:nth-child(1)), table.table.tb-forum tr th:not(:nth-child(1)){
        border-left:1px solid #ddd;
    } 
    .select-area .form-control, .select-area .input-group-btn {
        width: auto;
    }
    .csr-list .info{
        padding:30px 15px;
    }
    .csr-list div[class*="col"] a{
        margin-left: 15px;
    }
    .content h2.st.alignC{
        text-align: left;
    }
    .csr-btn a, .member-step .step-item {
        text-align: left;
        display: flex;
        background: #ddd;
        align-items: center;
        justify-content: left;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 10px;
    }  
    .csr-btn a:hover .pic, .csr-btn a.active, .csr-btn a:hover,
    .member-step .step-item .pic, .member-step .step-item.active {
        color: #ffffff;
        background: #f28a02;
    }
    .csr-btn a h4, .member-step .step-item h4{
        font-size:15px;
        flex: 1;
    }
    .csr-btn a .pic, .member-step .step-item .pic{
        background: #ddd;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        padding: 5px;
        border: 2px solid #fff;
        margin: 0 10px 0 0;
        transition: all .5s;
    } 
    .member-step div[class*="col"]:not(:nth-last-child(1)):after {
        content: "";
        width: 100%;
        width: 10px;
        position: absolute;
        left: 50%;
        transform:translateX(-50%);
        top: 40%;
        top: 100%;
        height: 10px;
    }    
    .member-step .step-item.finished{
        background: #ffb24e;
        color:#fff;        
    }
    .news-search-area div[class*="col"]+ div[class*="col"]{
        margin-top: 10px;
    }

    .result-list li table.table tr th, .result-list li table.table tr td{
        display: block;
    }
    .result-list li table.table tbody tr+tr, .result-list li table.table.tb-nostyle tbody tr td{
        border:none!important;
        background:none!important; 
    }
    .result-list li table.table.tb-nostyle tbody tr:nth-child(even) td{
        background:none!important; 
    }
    .search-result .title-area .form-control{
        display: inline-block;
        width: auto;
        vertical-align: middle;
    }

    .top_link ul {
        display: block;
    }
    
    .top_link ul li:nth-child(2) {
        margin: 0 0 10px;
    }
    
    .top_link ul li {
        margin: 0 0 10px;
    }
    .top_link ul li a{
        font-size: 16px;
    }
    body.qa table.bt.responsive-tb tbody tr.ans_sec td::before {
        content: "ANSWER";
        display: none;
    }
    body.qa table.table > tbody> tr.ans_sec> td {
        padding: 0 !important;
    }
    
    body.qa table.table > tbody> tr.ans_sec {
        border: none;
    }
    
    body.qa table.table:not(.tb-normal) tbody tr:nth-child(2n) {
        border: none;
    }
    body.qa table.table:not(.tb-normal) tbody tr:nth-child(2n) {
        border: none;
    }

    body.member.class-record table.bt.responsive-tb tbody td::before {
        width: 10.5em;
    }
    body.member.class-record .table-responsive table.table tr td:not(:nth-child(1)){
        border-left: none;
    }
    .loginForm {
        margin-top: 60px;
    }

    .btn_sec.flr {
        float: none;
        margin: 0 0 40px 0;
    }
    .footer .foo_social_area {
        display: inline-block;
    }
    
    .footer .foo_social_sec {
        text-align: center;
        margin-top: 0;
    }
    
    .footer .foo_logo_area {
        margin-bottom: 10px;
    }

    .prod_table.newtempTable.stp .hint_sec{
        text-align: left;
    }
    .prod_table.newtempTable .hint_sec .hint_area ul li:last-child{
        display: block;
    }
    .edtbox.st27 .edtarea .item .pic {
        flex: 0 0 100%;
        margin-bottom: 20px;
    }
    
    .edtbox.st27 .edtarea .item {
        flex-wrap: wrap;
    }
    .edtbox.st27 .edtarea .item .info .btn_sec {
        position: static;
        display: inline-block;
    }
    
    .edtbox.st27 .edtarea .item .info .desc {
        padding-bottom: 15px;
    }
    .chk-area > label{
        width: 45%;
    }
    .pro_st_hint {
        float: none;
    }
    
    .pro_st_hint > ul {
        margin-bottom: 0;
        margin-top: 10px;
        display: inline-block;
    }

    .header .navbar .top-link ul {
        display: block;
    }
    .header .navbar .top-link > ul > li:nth-child(2) {
        width: 100%;
    }
    .top-link .search-area{
        width: 100%;
    }
    .top-link .tag-btn{
        margin-top: 10px;
    }
    .tabs-area ul.resp-tabs-list {
        display: block !important;
    }
    .tabs-area ul.resp-tabs-list.resp-tabs-list.pro-tabs li {
        width: 100%;
        margin-bottom: 5px !important;
    }
    .tabs-area .resp-tabs-container {
        padding-top: 20px;
    }
    body.product.show h3.st > .main_txt {
        padding-right: 220px;
    }
    
    body.product.show h3.st > .pic_sec {
        position: static;
    }
    
    body.product.show h3.st > .main_txt {
        padding: 0;
        margin-bottom: 10px;
    }

    table.table.tb-mobile-block .tn {
        font-size: 15px;
        background: #ea5514;
        width: 110px;
        white-space: normal;
        color: #fff;
    }
    table.table.tb-mobile-block thead{
        display: none;
    }
    table.table.tb-mobile-block tbody td {
        display: block;
        position: relative;
    }
    table.table.tb-mobile-block tbody td {
        display: block;
    }
    
    table.table.tb-mobile-block .tn,table.table.tb-mobile-block .mtxt {
        display: inline-block;
        vertical-align: top;
        padding: 5px;
    }
    table.table.tb-mobile-block td.pno-wrap .tn {
        display: block;
        width: 140px;
    }
    table.table.tb-mobile-block td.qtytd input {
        width: calc(100% - 80px);
    }
    table.table.tb-mobile-block td.inqbtntd{
        border:none !important;
    }
    table.table.tb-mobile-block td.inqbtntd .btnInq{
        position: absolute;
        right: 10px;
        bottom: 30px;
    }
    body.product.search.result .pro-series .pro-item .pic {
        /*height: 310px;*/
    }


    .main_content > .container,
    body.product .main_content > .container {
        padding-top: 20px;
    }
    .main {
        padding-top: 60px;
    padding-bottom: 20px;
    }

    body.home .main {
        padding-top: 0;
    }
    .wid.wid-home-solution {
        padding-top: 30px;
    }
    /** scroll direction **/
    .breadcrumb-area{
        top: 71px;
    }
    body.nav-down .header .navbar {
        top: -71px;
    }
    body.nav-down  .breadcrumb-area {
        top: 0;
    }

    body.product.show .pro-pic-area .mob-posab {
        /*position: absolute;
        width: 100%;
        top: calc(50% - 42px);*/
    }
    
    body.product.show .pro-pic-area .mob-posab .simg-slider {
        padding: 0;
    }
    
    body.product.show .pro-pic-area .mob-posab .slick-btn .slick-prev {
        position: absolute;
        left: -15px;
    }
    
    body.product.show .pro-pic-area .mob-posab .slick-btn .slick-next {
        position: absolute;
        right: -15px;
    }
    .sec1 + .sec1 {
        margin-top: 10px;
    }
    
    .sec1 .show-inner {
        padding: 10px;
    }
    
    h3.st {
        margin-bottom: 10px;
    }
    body.product.show .sec1.order_info_sec .table {
        margin-bottom: 0;
    }
    body.product.show .content .btn-box{
        margin-top: 10px;
    }
    .pro-series.mainKind {
        margin-bottom: 30px;
    }
    table.table.tb-newSt.tb-forum td {
        border: none;
    }
    .pro_title_area .tag_box,.pro_title_area .demo_txt{
        width: 100%;
        margin: 5px 0 0 12px;
    }
    .pro_title_area h2.st {
        margin-bottom: 24px;
    }
    .pro_title_area {
        margin-bottom: 25px;
    }
    .pro_title_area .demo_txt {
        margin-left: 20px;
    }
    .sttdemo{
        margin-top: 10px;
        margin-bottom: 0;
        padding-left: 10px;
    }
    .header .navbar .navbar-nav > li .pro-menu ul ul {
        margin: 0;
    }
    .navbar .navbar-collapse .top-link ul >li>a, .navbar .navbar-collapse .navbar-nav>li>a, .header .navbar .lang .btn{
        font-size: 20px!important;
    }
    .navbar .navbar-collapse .navbar-nav>li>ul>li a{
        font-size: 16px!important;
    }   
    body.home .wid-home-solution .solution-list div[class*="col"]{
        margin-bottom: 10px;
    }
}
@media (max-width: 600px) {
    .footer .sitemap h1{
        margin:10px 0;
    }
    .btn-dl li{
        display: block;
    }
    .btn-dl li a{
        display: block;
    } 
    .news-search-area li:nth-child(2), .news-search-area li:nth-child(3){
        display: block;
        width:100%;
        float:none;
    }    
    .footer .copyright .container> ul>li{
        display: block;
    }
    body.home .social{
        margin-top:20px;
    }
    
}
@media (max-width: 500px) {

    div.tip_sign .btn-box li{
        display: block;
    }   
    div.tip_sign .btn-box li+li{
        margin-top:10px;
    }

    body.member.class-record .table-responsive table.table tr td:not(:nth-child(1)){
        border-left: none;
    }
    .search_sec .form-control.datepicker {
        width: 45%;
    }
    body.member.class-record .search_sec .collapse_tit .btn {
        position: static;
    }
    .loginForm {
        max-width: 95%;
    }
    body.product.search.result .pro-series .pro-item{
        width:100%;
    }
    body.product.search.result .pro-series .pro-item .pic {
        height: auto;
    }
    body.product.search.result .pro-series .pro-item .pic img{
        transform:scale(1);
    }
    .pro-series.new-st .pro-item >a {
        flex-wrap: wrap;
    }
    body.product.search.result .pro-series.new-st .pro-item .pic {
        flex: 0 0 100%;
    }
}

@media (max-width: 480px) {

    table.bt.responsive-tb tbody td{
        display: block;
    }
    table.bt.responsive-tb tbody td::before{
        display: block;
        width: 100%;
        margin-bottom: 5px;
    }
    div.tip_sign{
        padding:20px;
    }

    .qty input {
        margin: 0 ;
    }     

    .chk-area > label{
        width: 100%;
    }
}