.bg1 img {

    width: 100%;
    height: auto;
    opacity: 0%;

}

.bg1 {
    background: url("images/home1-1.png") no-repeat;
    /* 固定背景 */
    background-attachment: fixed;
    background-size: 100% auto;


}

.all {
    width:100%;
    max-width:1920px;
    margin: 0 auto;
    background-color:#fff;
    display: block;
}



.all H1 {
    font-size: 40px;
    text-align: center;

}

#webcontent {
  width:100%;
  max-width:1920px;
  margin: 0 auto;
  background-color:#fff;
}

header {
    width:100%;
    margin:0 auto;
    display:block;
    background-color: #fff;
    z-index: 1;
    /* 固定選單 */
    position: sticky;
    top: 0;
     
}


#logo {
  width:33.3%;
  margin:0 auto;
  padding:0;
  display:block;
  float:left;
}

#logo_img {
 width:35%;
 margin:0;
 padding:1% 0 0 0;
 display:block;
 float:left;

}

nav {
  width:42.7%;
  margin:0;
  padding:1% 0 0 0;
  display:block;
  float:left;
}
nav ul{
  width:100px
  margin:0 auto;
  padding:0;
  display:block;
}
nav li{
    position: relative;
    float: left;
    color:#000;
    text-align:center;
    font-size:2vm;
    margin:0;
    padding:0;
    list-style: none;
}
nav li a {
    display: block;        
    padding: 0;
    text-decoration: none;
}
 
nav li:hover {
    color:#ffffff;
    text-decoration:none;
}
nav li ul {
    background-color: #F2EEEF;opacity:0.9;
    display: none;
    position: absolute;
    top: 0;
    width:100%;
    margin:0 auto;
}
nav li:hover ul{
    display: block;
    right: 0;
    left: 0;
    top: 100%;
   /* border: #000000 1px solid; */
    z-index:6;
    
}
nav li ul li {
   width:100%;
   margin:0 auto;
   padding:0;
   color:#ffffff;
  /* font-weight:bold; */
  font-weight:bold;
   font-size:1vm;
   text-align:center;
}
nav li ul li:hover {
   width:100%;
   margin:0 auto;
   padding:0;
   color:#ffffff;
   font-weight:bold;
   font-size:1vm;
   text-align:center;
   background-color: #ff0000;opacity:0.9;
}
nav li ul li a {
   color:#2C2B2B;
   font-weight:bold;
   font-size:1vm;
   text-decoration:none;
}
nav li ul li a:hover {
   color:#ffffff;
   font-weight:bold;
   font-size:1vm;
   text-decoration:none;
}



#icon {
  width:22%;
  margin:0;
  padding:0.5% 0 0.5% 0;
  display:block;
  float:left;
}

#querier {
  width:100%;
  margin:0 auto;
  padding:0;
  background-color: #ffffff;
  display:block;
}
#menu1{
  width:100%;
  margin:3% 0 0 0;
  padding:0;
  background-color: #ffffff;
  display:none;
}
#nav_mobile {
    width:100%;
    margin:0 auto;
    padding:0;
    display:none;
}
#nav_mobile ul {
  width:100%;
  margin:0;
  padding:0;
  background-color: #e6d9ce;
  display:block;
}
#nav_mobile ul li {
  margin:0;
  padding:2px 0;
  width:100%;
  font-size:14px;
  color:#FFF;
  background-color: #e6d9ce;
  list-style-type: none;
  display:block; 
}

#nav_mobile ul li>a {
  font-size:14px;
  color:#333;
  background-color: #e6d9ce;
  list-style-type: none;
  display:block;
  width:100%;
  border:1px dotted #c5a992;
}

#nav_mobile ul li>a:hover {
  font-size:1em;
  color:#FFF;
  font-weight:bold;
  background-color: #070707;
  list-style-type: none;
  display:block;
  width:100%;
  text-decoration: none;
}

#nav_mobile ul li ul {
  font-size:1em;
  color:#333;
  background-color: #c4cbf3;
  list-style-type: none;
  display:block;
  margin:0 auto;
  padding:2px 0;
  width:100%;
}

#nav_mobile ul li ul li {
  font-size:1em;
  color:#333;
  list-style-type: none;
  display:block;
  margin:0 auto;
  width:100%;
}

#nav_mobile ul li ul li>a {
  font-size:1em;
  color:#333;
  background-color: #c4cbf3;
  list-style-type: none;
  display:block;
  margin:0 auto;
  width:100%;
}
#nav_mobile ul li ul li>a:hover {
  font-size:1em;
  color:#ddd;
  font-weight:bold;
  background-color: black;
  text-decoration: none;
  display:block;
  margin:0 auto;
  width:100%;
}

#nav_mobile ul li ul li ul {
  font-size:1em;
  color:#333;
  background-color: #f8ca9f;
  list-style-type: none;
  display:block;
  margin:0;
  padding:0;
  width:100%;  
}
#nav_mobile ul li ul li ul li {
  font-size:1em;
  color:#333;
  display:block;
  width:100%;
  padding:2px 0;
}
#nav_mobile ul li ul li ul li:hover {
  color:#FFF;
  background-color: #000;
  display:block;
}
#nav_mobile ul li ul li ul li>a {
  font-size:1em;
  color:#333;
  background-color: #f8ca9f;
  display:block;
}
#nav_mobile ul li ul li ul li>a:hover {
  font-size:1em;
  color:#FFF;
  background-color: #000;
  display:block;
}

#breadcrumbs{
    margin: 0;
}
#home_news {
  width:100%;
  margin:0 auto;
  padding:2% 0;
  background-color: #f7f7f7;
  display: block;
  float:left;
}
.font2 {
  font-family: "Arial"; 
  font-size: 12px;
  line-height: 15px;
  color: #b8b8b8;
  text-align: center;
  letter-spacing: normal;
}
.font3 {
  font-family: "微軟正黑體", "新細明體", "標楷體";
  font-size: 35px;
  line-height: 37px;
  text-align: center;
  color: #000000;
  letter-spacing: normal;
}

.font10 {
  font-family: "微軟正黑體"; 
  font-size: 15px;
  line-height: 25px;
  color: #f4f4f4;
  letter-spacing: normal;
}

A.e01 {
  font-family : 微軟正黑體, sans-serif; font-size : 15px;
  color: #adadad;
  line-height: 20px;
  text-decoration: none;
  }
a:hover.e01 {
  font-family : 微軟正黑體, Arial, sans-serif; font-size : 15px;
  color: #ffffff;
  line-height: 20px;
  text-decoration: none;
}

.info {
  width:100%;
  height:auto;
  padding:0;
  display:block;
}
.c {
    clear:both;
}
#breadcrumbs {

}

#webcenter{
  width:100%;
  margin:0 auto;
  padding: 0;
  display:block;
}



#content{
  
  width: 100%;
  padding: 0 1%;
  display:block;
}

.products1 {
  width:32%;
  height:auto;
  margin: 0 0.5% 10px 0.5%;
  padding:0;
  text-align:center;
  display:block;
  overflow:hidden;
  float:left;
  border:2px dotted #ccc;
}



#main_slide {
  width:100%;
  margin:0 auto;
  padding:1% 0;
  display:block;
  float:left;
  z-index: 0;
}

.carousel2 img {
    width: 100%;
    height: auto;


}

.all h1 {
    font-size: 30px;

}

.product {
    width: 100%;
    display: flex;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;

}

/*.product img {
    margin: 0 15px 0 15px;

}

.product p {
    text-align: center;

    margin: 0 0 15px 0;
}
*/
#home_news {
  width:100%;
  margin:0 auto;
  padding:1% 0 0 0;
  display:block;
  float:left;
}

#footer1{
  width:100%;
  margin:0 auto;
  padding:1% 0;
  background-color:#222;
}
#footer1_left {
  width:35%;
  margin:0 auto;
  padding: 2.5% 0.5%;
  float:left;
}

#footer1_center {
  width:22%;
  margin:0 auto;
  padding:2% 1%;
  float:left;
}

#footer1_right {
  width:43%;
  margin:0 auto;
  padding:0.375%;
  float:right;
}







.connect {
    width: 20%;
    display: flex;
    flex-direction: column;


}

.connect h3 {
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 20px;
    margin: 20px 15px 10px 15px;
}

.connect p {
    color: aliceblue;
    font-size: 16px;
    margin: 0 15px 10px 15px;

}






.opentime {
    width: 20%;
    display: flex;
    flex-direction: column;


}

.opentime h3 {
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 20px;
    margin: 20px 15px 10px 15px;
}

.opentime p {
    color: aliceblue;
    font-size: 16px;
    margin: 0 15px 10px 15px;
}





.location {
    display: flex;
    width: 30%;
    flex-direction: column;


}

.location h3 {
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 20px;
    margin: 20px 15px 10px 15px;
}

.location iframe {
    width: 95%;
    margin: 0 0 0 15px;
}


.qrcode {
    display: flex;
    width: 20%;

    flex-direction: column;


}

.qrcode h3 {
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 20px;
    margin: 20px 15px 10px 15px;
}

.qrcode img {
    width: 50%;
    margin: 0 0 0 15px;



}

@media only screen and (max-width:1000px) {
  .all {
    width:100%;
    margin:0 auto;
    padding:1px;
    overflow:hidden;
  }

  .logo{
    width:50%;
  }

  #logo_img {
 width:65%;
  }

  nav {
    display:none;;
  }

  #icon {
    width:50%;
    float:right;
  }

  #menu1 {
    display:block;
  }

  .products {
    width:98%;
    height:auto;
    margin: 0 1% 10px 1%;
    padding:0;
    text-align:center;
    display:block;
    overflow:hidden;
    float:left;
    border:2px dotted #ccc;
  } 
@media only screen and (max-width:798px) {
  .all {
    width:100%;
    margin:0 auto;
    padding:1px;
    overflow:hidden;
  }
  .webcontent {
    width:100%;
    margin: 0 auto;
  }

  .products1 {
    width:48%;
    height:auto;
    margin: 0 0.5% 10px 0.5%;
    padding:0;
    text-align:center;
    display:block;
    overflow:hidden;
    float:left;
    border:2px dotted #ccc;
  }

    #footer1_left {
    width:22%;
    margin:0 auto;
    padding: 2.5% 0.5%;
    float:left;
  }

  .footer1_left_qr{
    display:none;
  }
  #footer1_center {
    width:0%;
    margin:0 auto;
    padding:2% 1%;
    float:left;
  }
  #footer1_right{
    float: left;
  }
  .footer1_right_title {
    display:none;
  }

  #webcenter{
  width:100%;
  max-width:1920px;
  margin:0 auto;
  padding: 0;
  display:block;
  overflow:hidden;
}

.products {
    width:98%;
    height:auto;
    margin: 0 1% 10px 1%;
    padding:0;
    text-align:center;
    display:block;
    overflow:hidden;
    float:left;
    border:2px dotted #ccc;
    }  
@media only screen and (max-width:40em) {
  .all {
    width:100%;
    margin:0 auto;
    padding:1px;
    overflow:hidden;
  }

  header {
    display:block;
    width:100%;
    margin:0 auto;
    
  }

  
  #footer1_left {
    width:100%;
    margin:0 auto;
    padding: 2% 0.5%;
    float:left;
  }
  #footer1_center {
    width:100%;
    margin:0 auto;
    padding:2% 1%;
    float:left;
  }

  .products {
  width:98%;
  height:auto;
  margin: 0 0.5% 10px 0.5%;
  padding:0;
  text-align:center;
  vertical-align:top;
  display:inline-block;
  overflow:hidden;
  border:2px dotted #ccc;
}

  .products1 {
    width:98%;
    height:auto;
    margin: 0 1% 10px 1%;
    padding:0;
    text-align:center;
    display:block;
    overflow:hidden;
    float:left;
    border:2px dotted #ccc;
  }

  
/*@media (max-width: 768px) {

    .bg1 img {

        width: 100%;
        height: auto;   
        opacity: 0%;

    }

    .bg1 {
        align-items: center;
        background: url("../合展Leo/img/home1-1.png") no-repeat;
        /* 固定背景 */
        background-attachment: fixed;
        background-size: 100% auto;


    }

   

    .logo {
        width: 20%;
    }

    .logo img {
        width: 90%;

    }

    .button {
        display: flex;
        width: 65%;
        justify-content: end;

    }

    .bt a {
        text-decoration: none;
        color: black;
        margin: 0 15px 0 0;
        font-size: 12px;
        font-weight: bold;
    }

    .bt :hover {

        color: rgb(109, 108, 108);

    }


    


    .icon img {
        width: 50%;

    }

    .line {
        width: 33%;
    }

    .yt {
        width: 33%;
    }

    .fb {
        width: 33%;
    }

    
    .all h1 {
        font-size: 20px;

    }

    .product {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        font-size: 18px;
        font-weight: bold;

    }

    .product img {
        margin: 0 15px 0 15px;

    }

    .product p {
        text-align: center;

        margin: 0 0 15px 0;
    }

    .news {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        font-size: 18px;
        font-weight: bold;
    }

    .news img {
        margin: 0 15px 0 15px;
    }

    .news p {
        text-align: center;
        margin: 0 0 15px 0;
    }

    .footer {
        display: flex;
        width: 100%;
        background-color: black;
        flex-direction: column;
        align-items: center;
        opacity: 75%;
        color: rgba(255, 255, 255, 0.75);
    }

    
    .connect {
        width: 100%;
        align-items: center;


    }

    .connect h3 {
        color: rgb(255, 255, 255);
        font-weight: bold;
        font-size: 20px;
        margin: 20px 15px 10px 15px;
    }

    .connect p {
        color: aliceblue;
        font-size: 16px;
        margin: 0 15px 10px 15px;

    }






    .opentime {
        align-items: center;
        width: 100%;
        display: flex;
        flex-direction: column;


    }

    .opentime h3 {
        color: rgb(255, 255, 255);
        font-weight: bold;
        font-size: 20px;
        margin: 20px 15px 10px 15px;
    }

    .opentime p {
        color: aliceblue;
        font-size: 16px;
        margin: 0 15px 10px 15px;
    }





    .location {
        align-items: center;
        display: flex;
        width: 80%;
        flex-direction: column;


    }

    .location h3 {
        color: rgb(255, 255, 255);
        font-weight: bold;
        font-size: 20px;
        margin: 20px 15px 10px 15px;
    }

    .location iframe {
        width: 100%;
   
    }


    .qrcode {
        align-items: center;
        display: flex;
        width: 80%;

        flex-direction: column;


    }

    .qrcode h3 {
        color: rgb(255, 255, 255);
        font-weight: bold;
        font-size: 20px;
 
    }

    .qrcode img {
        width: 80%;




    }

    .footer p {
        width: 95%;

       text-align: center;
    }
}