.min-height{
  min-height:100vh;
  background: url("../image/bg/index.jpg") no-repeat center center;
}

/*.min-heights:before{
  content:"";
  width: 100%;
  height: 100vh;
  position: fixed;
  background: url("../image/bg/indexbg/padbg.jpg") no-repeat  center  center;
  left: 0;
  top: 0;
  background-size: cover;
}*/


.full-height{
  height:100%;
}

.overtake{
  /*border-radius: 50px;
  border:2px solid #FFF;*/
  padding: 10px 5px;
  margin: 10px 5px;
  background:#818181;
  color: #fff;
  font-size: 1.2em;
  text-align: center;
  border-radius: 3px;
}
.overtake:hover{
  color: #000;
  background: #fff;
}


.requ{
  color: #f35;
}


/*--所有廠商名稱頁面--
.allcompany{
  background:url(../image/bg/cabg.jpg); 
  background-size: 100%;
}

.company{
  float: left;
  position: absolute;
  z-index: 2;
  background: rgba(255,255,255,.75);

  text-align: center;
  
}

.company a{
  color: #121756;
  font-weight: bolder;
  font-size: 20px;
  padding: 10px 15px;
  float: left;
  width: 100%;
}



.company a:hover{
  color: #fff;
  background: #121756;
  font-weight: bolder;
}

.a1{ top: 8% ; left:6%; }
.a2{ top: 26% ; left:22%; }
.a3{ top: 18% ; left:56%; }
.a4{ top: 61% ; left:11%; }
.a5{ top: 49% ; left:38%; }*/

.linkbottom{/*下方區塊*/
  margin: 0% 0 0 0;
}
/*.linkbottom.area1{下方區塊1
  background: #517fa2;
}*/
/*.linkbottom.area2{下方區塊1
  background: #88c3e5;
}*/
/*.linkbottom.area3{下方區塊1
  background: #0c9978;
}*/
.linkbottom a{
  text-align: center;
  color: #121756;
  background: #40b998;
  padding: 25px 10px;
  border-right:0px solid #fff;
  border-bottom:1px solid #fff;
  font-weight: bolder;
  border-bottom:1px solid #fff;
}
.linkbottom a:hover{
  background: #121756;
}

.linkbottom.area2 a:hover,.area2 .company a:hover{
  background: #4b7c98;
}

.linkbottom.area3 a:hover,.area3 .company a:hover{
  background: #09735a;
}

/*.linkbottom .flex .pos-1x{
  height: 100px;
}*/





/*------內容頁-------*/
.suspenarea{
  height:100%;
  background: #0a0a0a;
}

.c1{
  background:rgba(0,0,0,.85); 
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,0a0a0a+100 */
  background: rgb(0,0,0); /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(255,0,0,1) 0%, rgba(10,10,10,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(10,10,10,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(10,10,10,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#0a0a0a',GradientType=0 ); /* IE6-9 */
  z-index: 1;

}
.c1:before{
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left:0;
  background:transparent  url(../image/bg/c1.jpg) center center no-repeat; 
  /*background-size: 100%;*/
  z-index: -1;
  filter: blur(3px);

}

.close{
  /*background: #f00;*/
  float: right;
}

.close:hover{
  cursor: pointer;
}

.cominfo{
  padding: 0 0 0 0px;
}
.compic{
  max-width: 100px;
  margin: 0 auto;
}
.cominfo .h1,.cominfo .h5{
  font-weight: bold;
  line-height: 30px;
  letter-spacing: 0px;
  text-align: center;
}
.cominfo p{
  font-size: 1.08em;
  font-weight: 600;
  letter-spacing: 0px;
  line-height: 1.75em;
}
.sublist{
  margin: 20px 0;
}

.socialarea{
  margin:20px 0 0 0 ;
}

.sociallink{
  width: 60px;
  height: 60px;
  background: #000;
  color: #fff;
  border-radius: 50px;
  text-align: center;
  font-size: 1.5em;
  line-height: 60px;
}

.fb{background: #3b5998;color: #fff;}
.line{background: #63A70A;color: #fff;}
.yt{background: #F13232;color: #fff;}
.fb i,.line i,.yt i{color: #fff;}

.fb:hover{background: #232323;}
.line:hover{background: #232323;}
.yt:hover{background: #232323;}


#five .cominfo{
  padding: 0 0 0 0px;
}

.productpic{
  padding: 0 5px;
}



.productinfo p{
  padding: 3px 0;
  font-size: 1.09em; 
  line-height: 30px;
}

.productinfo li,.productinfo ul{
  float: left;
  width: 100%;
  list-style-type: decimal;
  list-style-position: outside;
}

.productinfo li{
  padding: 5px 0;
  
}

.procon{
  padding: 0 0 0 40px;
}



/*
   *  STYLE 2
   */

  .modal::-webkit-scrollbar-track,.myproduct .swiper-slide::-webkit-scrollbar-track
  {
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);*/
    border-radius: 10px;
    background-color:transparent  ;
  }

  .modal::-webkit-scrollbar,.myproduct .swiper-slide::-webkit-scrollbar
  {
    width: 8px;
    background-color: transparent;
  }

  .modal::-webkit-scrollbar-thumb,.myproduct .swiper-slide::-webkit-scrollbar-thumb
  {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #232323;
  }


@media only screen and (min-width: 600px) {

 
}

@media (min-width: 768px) {
  
}
@media (min-width: 900px) {

}

@media screen and (min-width: 1000px){
  /*--內容頁--*/
  .suspenarea{
    height:calc(100vh - 54px);
  }

  .c1{
    /*background:none; */
  }

  .c1:before{
    filter: blur(0px);
    background-position: center center; 
    z-index: -1;

  }

  .linkbottom a{
    /*border-bottom:0px; 
    border-right:0px solid #fff;*/
  }

  .iframe{
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  .video{
    height: 70vh
  }

  .overtake{
    /*border-radius: 50px;
    border:2px solid #FFF;*/
    padding: 10px 5px;
    margin: 10px 5px;
    background: transparent;
    color: #fff;
    font-size: 1.2em;
  }

  .cominfo{
    padding: 0 0 0 40px;
  }
  .cominfo .h1,.cominfo .h5{  
    text-align: left;
  }
  .compic{
    max-width: 100px;
    margin: 0 15px 0 0;
  }

  .people{
    position: absolute;
    bottom: 25%;  
    left: -5%;
  }

  .people2{
    position: absolute;
    bottom: 25%;
    right: -5%; 
  }

  .linkbottom .flex .pos-1x:before{
    content:"";
    position: absolute;
    right: 0;
    top:0;
    width: 1px;
    background: #fff;
    height: 100px;
    z-index: 1;
    display: block;
  display: block;
  }

  .linkbottom .flex .pos-1x:last-child:before{
    display: none;
  }


  .linkbottom .flex .pos-1x a{
    height:100px;
    display: flex;
    vertical-align: middle;
    align-items: center;
    justify-content:center;
    letter-spacing:   0px;
  }

  .procon{
    padding: 0 0 0 30px;
  }

  
}

@media (min-width: 1300px) {

  .people{
  
    left: 5%;
  }

  .people2{
  
    right: 5%; 
  }

  .linkbottom .flex .pos-1x a{
    height:80px;
  }

  .linkbottom{
    margin:-5% 0 0 0 ;
    overflow: hidden;
  }
 
 
}

@media (min-width: 1200px) and  (max-width: 1500px){
  
}

@media (min-width: 1500px) {
  
  .people{
    left: 15%;
  }

  .people2{
    right: 15%; 
  }
  
}