html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
  font-family: "Microsoft JhengHei", sans-serif;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

::selection {
  background-color: rgba(0,0,0,0.3);
  color: white;
}


#header {
  position: fixed;
  z-index: 10;
  right: 0;
  left: 0;
  top: 0;
  background-color: white;
  z-index:120;
}


#preloader {/*   這是整個會蓋住畫面的底色色塊  */
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0%;
  top: 0%;
  background-color:#E46713;
  z-index: 999;
}
/* div{
  border:1px #505050 dashed;
} */
.rwd_display{
  display:none!important;
}
.rwd_flex{
  display:none!important;
}
@media (max-width: 1150px){
  .rwd_none{
    display:none!important;
  }
  .rwd_display{
    display:block!important;
  }
  .rwd_flex{
    display:flex!important;
  }
}
.mobile_list{
  height:100vh;
  width:100vw;
  background:#E46713;
  position:fixed;
  left:0px;
  top:0px;
  padding:0 0 0 20px;
}

.mobile_list p{
  font-size:20px;
  font-weight:900;
  padding:20px 5px;
  color:white;
  transition: all .2s linear;
}
.mobile_list p:hover{
  background-color:white;
  color:#E46713;
}


.language_list{
  position:absolute;
  right:0px;
}

.product_list{
  position: absolute;
    right: -30%;
    background-color: white;
    /* width: 150%; */
}
.header_list p{
  padding:20px;
  margin:0 10px;
  cursor:pointer;
  transition: all .2s linear;
  height:100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight:900;
  text-align: center;
  width: max-content;
}

.header_list p:hover{
  border-bottom:1px #E46713 solid;
  color:#E46713;
}

/*----------------------------- */

.logo{
  background-color:#E46713;
  padding: 15px 10px 15px 30px;
}
.logo img{
  height:100%;
  max-width:100%;
}
.logo img:hover{
  cursor:pointer;
}
.language_bt{
  height:100%;
  background-color:#E46713;
  margin:0!important;
}
.language_bt p{
  color:white;
}
.language_bt p:hover{
  color:rgba(0,0,0,0.8);
}

.index_banner{
  padding-top:90px;
  background-color:#E46713;
}



.index_banner_pic img{
  width:100%;
}

.index_banner_block1 .p1{
  color:white;
  font-weight:900;
  font-size:60px;
  width:150%;
  position:relative;
  padding:30px ;
  text-shadow: rgba(0,0,0,0.6) 0.1em 0.1em 0.2em;
  line-height:1.3;
  z-index:100;
}

.index_banner_block1 .p2{
  color:white;
  font-size:16px;
  line-height:1.5;
  max-width:150%;
  padding:20px 30px;
}


.index_banner_block1 .b1{
  color:#E46713;
  background-color:white;
  font-size:16px;
  font-weight:900;
  margin:20px 30px;
  padding:15px 30px;
  width: fit-content;
  cursor:pointer;
  transition: all .2s linear;
}

.index_banner_block1 .b1:hover{
  box-shadow: 10px 10px rgba(255,255,255,0.6);
}

.banner_st p{
  color:white;
  padding:10px 40px;
  font-weight:900;
  letter-spacing:2px;
}
.banner_st span{
  padding:40px;
  background-color:#E46713;
}

.banner_st{
  position:absolute;
  right:0px;
  bottom:40px;
  cursor:pointer;
  transition: all .2s linear;
}
.banner_st:hover{
background-color:rgba(0,0,0,0.5);
}

.Product_Category_l .p1{
  font-size:20px;
  padding-bottom:5px;
  font-weight:900;
}

.Product_Category_l .p2{
  font-size:14px;
  color:rgba(0,0,0,0.4);
}
.Product_Category_l{
  border-left:#E46713 15px solid;
  padding:5px 15px;
}

.Product_Category_r p{
  color:#E46713;
  padding:0px 15px;
}
.Product_Category_r{
  transition: all .2s linear;
  padding:15px;
  width:fit-content;
}
.Product_Category_r:hover{
  cursor:pointer;
  background-color:rgba(228,103,19,0.2);s
}

.Product_Category{
  padding: 100px 0;
}

.Product_Category_2{
  padding:20px;
}

.Product_Category_2_card p{
  height:50px;
  padding-bottom:5px;
  line-height:1.3;
  font-weight:900;
}
.Product_Category_2_card img{
  width:100%;
  padding:20px 15px 40px;
  border:rgba(0,0,0,0.2) 1px solid;
  transition: all .2s linear;
}
.Product_Category_2_card {
  padding:20px;
}

.Product_Category_2_card:hover img{
  background-color:#E46713;
  cursor:pointer;
  box-shadow: 10px 10px #F4A169;
}

.bbanner{
  width:100%;
  height:400px;
  background-image:url('../img/bbanner.png');
  margin:50px 0
}


.news_b_title {
  border-left:#E46713 15px solid;
  padding:5px 15px;
}

.news_b_title .p1{
  font-size:20px;
  padding-bottom:5px;
  font-weight:900;
}

.news_b_title .p2{
  font-size:14px;
  color:rgba(0,0,0,0.4);
}

.news_b{
  padding-bottom:50px;
}

.news_b hr{
  border-bottom:1px black solid;
  padding-right:20px;
}

.news_card{
  cursor:pointer;
}

.news_card .number{
  background-color:#E46713;
  color:white;
  display: flex;
  justify-content: center;
  align-items: center;
  padding:15px;
  font-size:24px;
  font-weight:900;
  margin-right:20px;
}

.news_card .t1{
  font-weight:900;
  padding:5px 0 15px 0;
}

.news_card .date{
  font-size:12px;
  color:rgba(0,0,0,0.3);
  padding-left:5px;
}

.foo_title{
  background-color:#E46713;
}

.foo_title p{
  width:fit-content;
  color:#E46713;
  background-color:white;
  padding:0 30px;
  font-size:80px;
  font-weight:900;
}

.foo_infro .d-flex{
  padding:15px 0;
}
.foo_infro  img{
  padding-right:20px;
}

.foo_copy{
  background-color:#E46713;
}
.foo_copy p{
  font-size:12px;
  color:white;
  padding:15px 
}

.fooimg{
  width:20%;
  position:absolute;
  bottom:30px;
  left:30px;
}

@media (max-width: 1150px){
  .foo_title p{
    font-size:24px;
  }
  .index_banner_block1 .p1{
    font-size:24px;
    width:100%;
    padding:10px 30px;
    z-index:0;
  }

  .index_banner_block1 .b1{
    margin:20px 30px 40px 30px;
  }
  .Product_Category{
    padding: 50px 10px 50px 30px;
  }

  .Product_Category_2_card p{
    font-size:14px;
  }

  .bbanner{
    height:100px;
  }
}


/* about */


.about_b1{
  padding:200px 20px 0 20px;

}
.about_b1_stitle{
  font-size:24px;
  font-weight:900;
  visibility: visible;
  letter-spacing:2px;
  z-index:10px;
  border-right:130px rgba(228,103,19,0.6) solid;
  height:200px;
  display: flex;
  align-items: center;
}

.about_b1_t h1{
  font-size:60px;
  font-weight:900;
  padding-bottom:30px;
}

.about_b1_t p{
  font-size:16px;
  line-height:1.3
}


.about_b2 img{
  width: 100%;
  padding-top:50px;
}

.about_b3{
  padding-top:50px;
}
.about_b3 img{
  width: 100%;
}
.about_b3_t{
  padding-right:30px;
}

.about_b3_t h3{
  font-size:24px;
  padding-bottom:20px;
  font-weight:900;
}
.about_b3_t p{
  font-size:16px;
  line-height:1.3;
}

.about_b4{
  padding-top:50px;
}
.about_b4 img{
  width: 100%;
}
.about_b4_t{
  padding-left:30px;
}

.about_b4_t h3{
  font-size:24px;
  padding-bottom:20px;
  font-weight:900;
  line-height:1.5;
}
.about_b4_t p{
  font-size:16px;
  line-height:1.3;
}




.about_b5{
  padding-top:50px;
  padding-bottom:150px;
}
.about_b5 img{
  width: 100%;
}
.about_b5_t{
  padding-left:30px;
}

.about_b5_t h3{
  font-size:24px;
  padding-bottom:20px;
  font-weight:900;
  line-height:1.5;
}
.about_b5_t p{
  font-size:16px;
  line-height:1.3;
}


@media (max-width: 1150px){
  .about_b1 {
    padding: 130px 20px 0 20px;
  }
  .about_b2{
    padding:20px
  }

  .about_b3{padding:20px;}
  .about_b4{padding:20px;}
  .about_b5{padding:20px;}
  .about_b3 img {
    padding-top:20px;
  }


  .about_b3_t{
    padding-right:0px;
  }
  .about_b4_t{
    padding-left:0px;
  }

  .about_b5_t{
    padding-left:0px;
  }

  .about_b4 img {
    padding:20px 0;
  }

  .about_b5 img {
    padding:20px 0;
  }
}


/* service */
.service_title{
  padding-top:150px
}
.service_title h1{
  font-size:60px;
  font-weight:900;
  line-height:1.3;
  letter-spacing:1px;
}

.service_title img{
  width:100%;
}

.service_card_b hr{
  margin:80px 0;
}

.service_card h3{
  font-size:60px;
  font-weight:900;
}
.service_card span{
  width:40%;
  border-bottom:1px rgba(0,0,0,0.3) solid;
  margin-left:30px;
}

.service_card h4{
  font-size:24px;
  font-weight:900;
  padding: 20px 0;
  line-height:1.3;
}

.service_card p{
  letter-spacing:1px;
  line-height:1.3;
}

.service_card{
  padding-bottom:130px;
}
.foo_map iframe{
  height:300px;
}

@media (max-width: 1150px){
  .service_title{
    padding:130px 20px 0px;
  }

  .service_title h1{
    font-size:40px;
  }

  .service_card{
    padding:20px 20px 100px 20px;
  }
}

@media (max-width: 1300px){
  .header_list p{
    padding:20px 10px;
  }
}


.catalogue_card img{
  width:100%;
  transition: all .2s linear;
}

.catalogue_card p{
  padding:20px 0;
  font-weight:900;
  transition: all .2s linear;
}

.catalogue_card{
  cursor:pointer;
  transition: all .2s linear;
}

.catalogue_card:hover img{
  box-shadow:10px 10px  rgba(228,103,19,0.3);
}

.catalogue_card:hover p{
  color:#E46713;
}


@media (max-width: 1150px){
  .catalogue_card{
    padding:20px;
  }
}


/* product_list */
#product_list h3{
  cursor:pointer;
  transition: all .2s linear;
  background:rgba(80,80,80,0.2);
  font-weight:900;
  font-size:16px;
  display: flex;
  align-items: center;
  letter-spacing:1px;
}

#product_list span{
  background-color:rgba(80,80,80,0.6);
  color:white;
  font-weight:900;
  font-size:20px;
  padding:10px;
  margin-right:15px;
  transition: all .2s linear;
}

#product_1_list, #product_2_list, #product_3_list, #product_4_list{
  padding:10px 0 20px 0;
}
#product_list p{
  font-size:14px;
  padding:10px 0 10px 20px;
  cursor:pointer;
  transition: all .2s linear;
}

#product_list p:hover{
  margin-left:15px;
  color:#E46713;
  border-left: 5px #E46713 solid;
}

#product_list h3:hover{
  background-color:rgba(228,103,19,0.6);
}

#product_list h3:hover span{
  background-color:rgba(228,103,19,1);
}

.product_banner img{
  width:100%;
}

.product_block{
  border:1px rgba(0,0,0,0.3) solid;
  border-top:0;
  padding-top:50px;
  margin-bottom:50px;
}

.product_breadc{
  padding:0 10px;
}


.product_bread_title p{
  background-color:#E46713;
  border-bottom:5px #D6D6D6 solid;
  color:white;
  width:fit-content;
  padding:10px 60px 10px 20px;
}

.product_detail{
  padding:0 30px 30px;
  border-left: 1px rgba(0,0,0,0.2) solid;
}

.product_detail_title{
  background-color:#E46713;
  color:white;
  font-size:24px;
  font-weight:900;
  padding:20px;
}

.des_title{
  padding:0 20px;
}
.des_title h5{
  color:#E46713;
  border-left:5px #E46713 solid;
  padding-left:15px;
  font-size:20px;
  font-weight:900;
}

.des_title p{
  padding-top:20px;
  font-size:16px;
  line-height:1.5;
}

@media (max-width: 1150px){
  .des_title{
    padding:20px 0 ;
  }
  .header {
    max-height: 75px;
  }
}



.product_content_img img{
  width: 100%;
}

.product_content_img{
  padding-bottom: 30px;
}


.bread_t{
  font-size: 12px;
}
.bread_t2{
  font-size: 12px;
}
.bread_t:hover{
  cursor: pointer;
  color: #E46713;
}

.mobile_list_product1, .mobile_list_product2, .mobile_list_product3, .mobile_list_product4{
  height:100vh;
  width:100vw;
  background:white;
  position:fixed;
  left:0px;
  top:0px;
}

.mobile_list_product1 .mobile_pd_list p{
  padding:15px 15px;
  font-weight:900;
  font-size:18px;
}
.mobile_list_product2 .mobile_pd_list p{
  padding:15px 15px;
  font-weight:900;
  font-size:18px;
}
.mobile_list_product3 .mobile_pd_list p{
  padding:15px 15px;
  font-weight:900;
  font-size:18px;
}
.mobile_list_product4 .mobile_pd_list p{
  padding:15px 15px;
  font-weight:900;
  font-size:18px;
}

.mobile_pd_list p:hover{
  background:#E46713;
  color:white;
}

.mobile_b_p1, .mobile_b_p2, .mobile_b_p3, .mobile_b_p4{
  padding:20px;
  font-size:20px;
  font-weight:900;
}


.language_list{
  background-color:white;
}

.product_mainlist .card{
  cursor:pointer;
  padding:15px;
  margin:10px 0;
  border:0;
}
.product_mainlist .card img{
  width:100%;
}
.product_mainlist .card p{
  background-color:#DCDCDC;
  border-left:5px #E46713 solid;
  padding:5px 10px;
  margin-top:10px;
  transition: all .2s linear;
  font-weight:900;
}

.product_mainlist .card:hover p{
  background-color:#E46713;
  color:white;
}


@media (max-width: 1500px){
  .service_title h1{
    font-size:40px;
  }
  .language_bt img{
    width:100%;
  }
  .language_bt{
  padding:5px!important;
  }
}


.force-hover{
    margin-left: 15px;
    color: #E46713;
    border-left: 5px #E46713 solid;
}