@charset "utf-8";

/* RWD INDEX CSS */

  .mobile_banner_wrapper,
  .index_product_nav_mobile,
  .index_product_more_mobile,
  .float_btn_wrapper,
  .footer_blank{display: none;}

  @media (max-width:1080px){
    .view_lg{ display:none; }

    #header_bg{ position:fixed; top:0; z-index: 5000; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
    #header_top{ width: 100%; height:72px; }
    #dk_text,#dk_logo{ display:none; }

    .iconbar{float:right; width:48px; height:36px; margin:-45px 15px 0 15px; border:2px solid #565656; border-radius:4px; cursor:pointer; background-position:center; background-repeat:no-repeat;}

    .iconbar_open{background-image:url(../images/iconbar.png);}
    .iconbar_close{background-image:url(../images/iconbar2.png); float: none; display: block; margin:15px 15px 0 auto; border:2px solid #fff; position: relative;}
    .iconbar_close::before{ position: absolute; top:3px; left:-140px; content:"MENU"; font-size: 24px; font-weight: 900; color:#fff; font-family:Verdana, Geneva, sans-serif;}

    #header_nav{ width:240px; height:100vh; position: fixed; z-index: 4999; top:0; right:-240px; background-image:none; background-color: #161616; -webkit-transition: all 0.3s; transition: all 0.3s;}
    #header_nav ul{ width:240px; margin:15px 0 0 0; overflow: hidden; height: auto;}
    #header_nav ul li{
      float:none;
      background-image:none; 
      height:48px;
      display: block; 
      border-top:1px solid #555;
    }
    #header_nav.header_nav_open{right:0px;}
    #header_nav ul li.view_lg{ display:none; }

    #index_banner_bg{display: none;}



    .mobile_banner_wrapper{display: block; margin-top: 72px;}
    .prev-alt{ background-color:transparent; color:#fff; position:absolute; z-index:555; cursor:pointer; top:50%; left:0%; padding:14px 15px 16px 15px; transform:translate(0,-50%); opacity:0.75;text-shadow: 0px 0px 5px #000, 0px 0px 10px #333, 0px 0px 15px #555;}
    .prev-alt:hover{ opacity:1;}
    .next-alt{ background-color:transparent; color:#fff; position:absolute; z-index:555; cursor:pointer; top:50%; left:100%; padding:14px 15px 16px 15px; transform:translate(-100%,-50%); opacity:0.75;text-shadow: 0px 0px 5px #000, 0px 0px 10px #333, 0px 0px 15px #555;}
    .next-alt:hover{ opacity:1;}


    #news_box{ width:auto; padding-left: 0px;}
    #news_box table{ width:auto; }
    #abgne_marquee { width:auto; }


    #index_center{ width:100%; }

    #index_product_more{ position:static; }
    #index_product_box_nav{ display: none;}
    /*#index_product_box_nav ul{background-image:none; height: auto;}
    #index_product_box_nav ul li{ float:none; display:block; border:1px solid #333;}*/

    .index_product_nav_mobile{ display:block; padding:15px; }
    .index_product_nav_mobile ul{ padding:0; list-style:none; position: relative;}
    .index_product_nav_mobile ul li{ float:left; width:calc(50% - 2px); border:1px solid #ccc; border-top:8px solid #333; padding:15px 0; margin: 0; text-align: center; cursor: pointer;}
    .index_product_nav_mobile ul li.active{border-top:8px solid #b80000; color:#b80000}

    .product_box{background-image:none;}
    .product_box ul li{ float:none; border-bottom:1px solid #ccc; width: 100%; height: auto; text-align: center; margin: 0; padding: 15px 0;}

    .product_pic{ margin:0 auto;}

    .index_product_more_mobile{text-align: center; display: block;}
    .index_product_more_mobile img{ width:93px; height:auto; margin: 30px auto;}

    #footer_bg{background-image:none; background-color: #161616;}
    #footer{ width:100%;}
    #footer_life{ padding:20px;}

    #counter{ position:static; background-image:none;}

    .footer_blank{ height:60px; display:block;}
    .float_btn_wrapper{ position:fixed; z-index: 4500; bottom:0; left:0; width:100%; height:60px; background-color:#161616; background-image: url(../images/nav_bg.png); background-repeat: repeat-x; display:block;}
    .float_btn_item{float: left; width: 33%; font-size: 1.3rem; text-align: center;}
    .float_btn_item a{color:#ccc; display: block; padding: 10px; text-decoration: none;}
    .float_btn_item a:hover{ color:#fff; }
    .float_btn_item a span{ display:block; font-size:0.8rem; padding: 5px 0;}

    .float_btn_item_center{ border-left:1px solid #555; border-right:1px solid #555; width:calc(34% - 2px);}

  }


/* RWD ABOUT */
	
  .mobile_page_banner_wrapper,
  .left_title_text{ display: none;}

  @media (max-width:1080px){
  	#index_center_bg div{ box-sizing: border-box;}
    #index_center_bg2{ background-image:none;  margin:0; padding:0;}

    #index_center_box{ width:100%; padding:15px; margin: 0;}

    #index_center{ width:100%;}

    #index_center_left{ width:100%; background-image:none;}
    #left_nav_box{ width:100%; background-color: #161616;}
    #left_title{ padding:0; text-align: center; border-bottom: 1px solid #777; background-image: url(../images/nav_bg.png); background-repeat: repeat-x;}
    #left_title img{ display: none;}
    .left_title_text{ display: block; padding:15px; font-size: 24px; font-weight: 900; color:#fff;}
    .left_title_text span{ font-size: 12px; color:#ccc; margin-left: 10px;}
    #left_nav_box ul{ padding:0; background-image:none;}
    #left_nav_box ul li{ width:100%; padding: 0 15px; border-bottom: 1px solid #777; box-sizing: border-box;}
    #left_nav_box ul li a{ width:100%; background-image:none;}
    #left_nav_box ul li ul{ width:100%;}
    #left_nav_box ul li ul li{ width:100%;}
    #left_bottom{ width:100%; background-image:none; display: none;}


    #link_box{ display:none; }

    #index_center_right{ width:100%; padding-top: 15px;}
    #center_right_title{ }

    #about_box{padding-left: 0;}
    #about_text1{width:100%; height: auto; padding:15px 0 300px 0; background-position: bottom center; background-size: 360px auto;}
    #about_text2{width:100%; height: auto; padding:30px 0 320px 0; background-position: bottom center; background-size: 360px auto; background-image: url(../images/about_pic2s.jpg)}

    .mobile_page_banner_wrapper{ margin-top:72px; display: block;}

  }

 /* RWD LOCATION */

   @media (max-width:1080px){

   	#location_pic{ height:auto; padding-left:0; padding-top: 60px; background-image: url(../images/contact_pic1s.jpg);}
   	#location_pic2{ height:auto; padding-left:0; padding-top: 60px; background-image: url(../images/contact_pic2s.jpg);}
   	#location_box iframe.map{ width:100%; margin: 15px 0 45px 0; padding: 0;}

  }

  /* RWD CONTACT */

   @media (max-width:1080px){

   	#contact_form{ padding-left:0; }
   	#contact_form form .form_out table{ width:100%; }
   	.contact_ps{ width:100%; padding-left:0; }


  }


  /* RWD KNOWLEDGE */

   @media (max-width:1080px){

	#k_box{padding-left:0px;}
	#kn_pic{padding-left:0px;}
	#kn_pic img{ width:100%; height:auto; }
	#knowledge_box{background-image:none; padding-left:0px;}

	#knowledge_top img,
	#knowledge_down img{ width:100%; height:auto; }

	.know_title{ width:100%; height: 48px;}
	.know_stitle{ width:100%; height: 32px; box-sizing: border-box;}
	.know_text{ width:100%;  box-sizing: border-box;}

	.know_icon{ top:20px; left:100%; transform:translate(-100%,0); margin-left:-10px; }
	.know_icon img{ width:60px; height:auto; }

	.taale2{ width:100%; }


  }

  /* RWD NEWS */

   @media (max-width:1080px){

	#news_box_pic img{ width:100%; height:auto; }

	.news_content{ width:100%; }
	.news_content_back{ width:100%; margin-left: 0;}

  }


  /* RWD PRODUCT */

  @media (max-width:1080px){

  	#product_logo_text{width: 100%;}
  	#prodcut_sp_text{ padding-right:30px; }

  	#product_box{ padding-left:0; }
  	#product_logo{ background-image:none; }
  	#product_list ul li{float: none; width: 100%; margin: 15px 0; box-sizing: border-box; text-align: center;}

  	.TabbedPanelsContent{ overflow-x:scroll; }
  	.taale1{ width:100%; }

  }

  /* RWD PRODUCT DETAIL */
  
  .product_detail_intro{ position:relative; background-image: url(../images/product_list_bg.png); background-repeat: no-repeat; background-position: top left; background-size: contain;}

  .product_detail_pic{width: 285px; background:url(../images/prodcut_logo_bg.jpg) no-repeat right;}
  .product_detail_pic img{ width:100%; height:auto; min-height:160px; }

  .product_detail_spec{
    line-height: 23px;
    color: #525252;
    width: 380px;

    position: absolute;
    top:50%;
    left:300px;
    transform: translate(0,-50%);
    font-size: 15px;
  }

  .product_detail_subtitle{ font-size: 16px; font-weight: bold; border-bottom:1px dotted #ccc; padding-bottom: 10px; margin-bottom: 10px;}

  @media (max-width:1080px){
    .product_detail_pic{background-image:none;}
    .product_detail_spec{ position:static; width:100%; }
  }

