@charset "utf-8";
/*
  danny 201804
  1. $Reset
  2. $body,html
  3. $共用
  4. $Mobile
  5. $Pc
*/





/* $Mobile
--------------------------------------------------------------------------------------*/





/* introvideo-container */
.introvideo-container{  width: 100%; height: 100%; background: rgba(0,0,0,0.9); display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; background: url(../image/index__tmp.jpg); background-size: cover; overflow: hidden;	 }
.videobg-box{ position:absolute; width:100vmax; min-width:178vh; height:56vmax; min-height:100vh; top:50%; left:50%; transform:translate(-50%,-50%); }
.videobg-box video{ width: 100%;  height: 100%; position: absolute; left: 0;  top: 0;  object-fit: cover;   }
.introvideo__txt-box{ position: relative; }
.introvideo__txt__tit{ font-family: 'Arial Black',Helvetica; font-size: 5.25rem; color: #8b1324; line-height: 80px; }
.introvideo__txt{ display: inline-block; font-size: 11px; color: #fff; transform: scale(calc(11 / 12)); }
.icon__play{ text-align: center; margin: 20px auto; }
.icon__play a{ text-decoration: none; }
.icon__play span:after{ content: '\f144'; font-size: 3.125rem; color: rgba(255,255,255,0.3); cursor: pointer; transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.icon__play span:hover:after{ color: rgba(255,255,255,1);  }
.introvideo__txt__subtit{ font-size: 1.6rem; color: #fff; font-weight: 300; text-align: center; border: 1px solid rgba(255,255,255,0.3); border-width: 1px 0; margin: 20px 0 20px 0; padding: 15px 0; }
.icon__scroll{ text-align: center; margin-top: 100px; }
.icon__scroll span:after{ content: '\e888'; font-size: 1.875rem; color: #fff; cursor: pointer; }





.mainnav{ position: fixed; top: 0; }





/* header */
header{ width: 100%;  /* height: 35.5625vw;  */position: relative; overflow: hidden;  }
.header-container{  margin: 0 auto; position: relative; }
.header-container li a{ width: 100%; }
.header-container li img{ width: 100%; }
.header-container .slick-dots{ display: flex; width: 100%; justify-content: center; position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); }
.header-container .slick-dots>li{ width: 12px; height: 12px; max-width: 12px; max-height: 12px; overflow: hidden; line-height: 0; }
.header-container .slick-dots>li+li{ margin: 0 0 0 20px; }
.header-container .slick-dots>li button{ width: 12px; height: 12px; max-width: 12px; max-height: 12px; border-radius: 50%; line-height: 0; overflow: hidden; background: #919191; text-indent: -999px; font-size: 0; }
.header-container .slick-dots>li.slick-active button{ background: #0070c9; }
/* .header-container{  margin: 0 auto; position: relative; } */
/* .header-container>li{ width: 100%; } */
/* .header-container>li img{ width: 100%; } */
/* .header-container>li a{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 999; display: block; } */
header .bx-wrapper{ position: relative; width: 100%; height: 100%; }
header .bx-controls{ width: 100%; height: 20px; position: absolute; bottom: 0px; }
/* bx-controls-direction 箭頭  */
header .bx-controls-direction{ width: 100%; height: 50px; position: absolute; top: -200%; transform: translateY(-50%);  }
header .bx-controls-direction a{ width: 31px; height: 61px;  position: absolute; background: url(../image/recruit__header__tit__arrow.png) no-repeat; text-indent: -9999px; }
header .bx-controls-direction .bx-prev{ background-position: 0 0; }
header .bx-controls-direction .bx-next{ background-position: -31px 0; right: 0;	}
/* bx-pager 點點 */
header .bx-pager { display: flex; justify-content: center; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
header .bx-pager-item a{ width: 10px; height: 10px; border-radius: 50%; margin-right: 20px; background: #919191;  display: block; text-indent: -9999px; }
header .bx-pager-item a.active{ background: #0070c9; }


/* search-box */
.search-box{ margin: 1px auto 0 auto; }





/* category */
.category{}
.category-container{ width: 100vw; display: flex; flex-wrap: wrap;  }
/* .category-container{ width: 100%;  } */
.category-container>li{ width: 50vw; height: 100px;  position: relative; overflow: hidden; }
/* .category-container>li{ width: 100%; height: 150vw;  position: relative; } */
/* .category-container>li:last-child{ height: 180vw; } */
.category-container>li>img{ position: absolute; width: 100%; /* height: 100%; */ top: -90%; }
.category-container>li>a{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
.category-container>li:nth-child(3) .comingsoontxt{ position: absolute; font-size: 0.75rem; left: 50%; bottom: -30%; transform: translate(-50%,0%); opacity: .6;  }
.category__bg{ width: 100%; height: 100%; position: absolute; background: rgba(0,0,0,0.4); }
.category-box{ color: #fff; width: 100%; position: absolute; left: 50%; /* top: 8%; */ top: 45%; transform: translate(-50%,-50%);  text-align: center; transition: all 1s cubic-bezier(.23,1,.32,1);  }
.category__name{ }
.category__name a{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
.category__name__tit{ /* font-size: 1.875rem; */ font-size: 1.125rem; }
.category__name__line{ display: block; width: 62.5%; height: 1px; border-bottom: 1px solid #fff; opacity: 0.3; margin: 5px auto 6px; }
.category__name__en{ /* font-size: 0.9375rem; */ font-size: 0.75rem; }
.category__submenu{ margin: 20px 0 0 0; display: none; }
.category__submenu>li{ height: 30px; line-height: 30px;  }
/* .category__submenu>li{ height: 50px; line-height: 50px;  } */
.category-container>li:hover .category-box{  }
.category__submenu>li>a{ display: block; color: #fff; text-decoration: none; /* font-size: 1.125rem; */ font-size: 0.875rem; width: 100%; height: 100%; transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.category__submenu>li>a:hover{ color: #3499c2; }








/* info__global */
.info__global__header{ width: 100%; min-width: 100%; height: 250px; background: url(../image/info__global__header__bg.jpg); background-size: cover; position: relative; }
.info__global__header .header__tit{ top: 50%; transform: translate(-50%,-50%); }
.info__global{ width: 100%; min-width: 100%; }
.info__global-container{ width: 100%; margin: 0 auto; box-sizing: border-box; padding: 30px 5% 40px 5%; font-size: 0.875rem; color: #252525; line-height: 30px; }
.info__global__txt{ width: 100%; margin: 0 auto; }
.global__map{ display: block;  margin: 20px auto 0 auto; width: 100%; height: auto; }
.info__global-container .video-box{  margin: 30px 0 0 0; }





/* video */
.video{ width: 100%; height: 100%; background: rgba(0,0,0,0.9); position: fixed; left: 0; top: 0; z-index: 9999; display: none; }
.video__closebtn{ display:block; position: fixed; right: 15px; top: 15px;  }
.video__closebtn:after{ content: '\e870'; display: inline-block; color: #fff; font-size: 1.5rem; }
.video-container{ width: 90%; height:0; /*padding-bottom:56.25%;*/ padding-bottom:50.625%; position:relative; top:50%; left: 50%; transform: translate(-50%,-50%); }
.video-container iframe{ width: 100%; height: 100%; position: absolute; left:0; top:0; }





/* gototop */
/* .goto-box>li.gotosearch{ display: none; } */
/* .goto-box>li.gototop{ width: 50px; height: 50px; line-height: 50px; color: #fff; font-size: 1rem; text-align: center;  background: none; background: #dfdfdf; border-radius: 50%; text-indent: 0;}
 */












/* $Pad
--------------------------------------------------------------------------------------*/
@media screen and (min-width:600px) and (max-width:1024px){


 


/* header */
header{ width: 100%; /* height: 35.5625vw; */ position: relative; overflow: hidden;  }







}



/* 橫的版型 */
@media screen and (orientation:landscape){ 




/* header */
header{ min-height: 300px;   }
.header-container button{ top: 95px; }
}





/* $Pc
--------------------------------------------------------------------------------------*/
/* @media screen and (min-width: 768px){ */
@media screen and (min-width: 1025px){





html,body{ min-width: 100%; font-size: 16px; /* overflow: scroll; */ /* overflow-y: hidden; */}




.wrapper{ position: relative; }




/* mainnav */
.mainnav{ top: 0; }





/* introvideo-container */
.introvideo-container{  width: 100%; height: 100%; background: rgba(0,0,0,0.9); display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; /* background: url(../image/index__tmp.jpg); background-size: cover; */ }
.videobg-box{ position:absolute; width:100vmax; min-width:178vh; height:56vmax; min-height:100vh; top:50%; left:50%; transform:translate(-50%,-50%); }
.videobg-box video{ width: 100%;  height: 100%; position: absolute; left: 0;  top: 0;  object-fit: cover;   }
.introvideo__txt-box{}
.introvideo__txt__tit{ font-family: 'Arial Black'; font-size: 5.25rem; color: #8b1324; line-height: 80px; }
.introvideo__txt{ display: inline-block; font-size: 11px; color: #fff; transform: scale(calc(11 / 12)); }
.icon__play{ text-align: center; margin: 20px auto; }
.icon__play a{ text-decoration: none; }
.icon__play span:after{ content: '\f144'; font-size: 3.125rem; color: rgba(255,255,255,0.3); cursor: pointer; transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.icon__play span:hover:after{ color: rgba(255,255,255,1);  }
.introvideo__txt__subtit{ font-size: 1.6rem; color: #fff; font-weight: 300; text-align: center; border: 1px solid rgba(255,255,255,0.3); border-width: 1px 0; margin: 20px 0 20px 0; padding: 20px 0 20px 0; }
/* .introvideo__txt__subtit{ font-size: 3.75rem; color: #fff; font-weight: 300; text-align: center; border: 1px solid rgba(255,255,255,0.3); border-width: 1px 0; margin: 20px 0 20px 0; } */
.icon__scroll{ text-align: center; margin-top: 100px; }
.icon__scroll span:after{ content: '\e888'; font-size: 1.875rem; color: #fff; cursor: pointer; }





/* header__submenu */
.header__submenu>li{ min-width: 33%; }
.header__submenu>li:last-child{ min-width: calc(34% - 2px ); }





/* header */
header{ width: 100%; min-width: 1280px; /* height: 35.5625vw; */ position: relative; overflow: hidden;  }
.header-container{  margin: 0 auto; position: relative; }
.header-container li a{ width: 100%; }
.header-container li img{ width: 100%; }
.header-container .slick-dots{ display: flex; justify-content: center; align-items: center; position: absolute; left: 50%; bottom: 20px ; transform: translateX(-50%); }
.header-container .slick-dots>li{ width: 12px; height: 12px; border-radius: 50%; overflow: hidden;   }
.header-container .slick-dots>li+li{ margin: 0 0 0 20px; }
.header-container .slick-dots>li button{ background: #919191; text-indent: -999px; }
.header-container .slick-dots>li.slick-active button{ background: #0070c9; }

/* .header-container>li{ width: 100%; }
.header-container>li img{ width: 100%; } */
header .bx-wrapper{ position: relative; width: 100%; min-width: 1280px; height: 100%; }
/* header .bx-viewport { height: 100%; } */
header .bx-controls{ width: 100%; height: 20px; position: absolute; bottom: 20px; }
/* bx-controls-direction 箭頭  */
header .bx-controls-direction{ width: 100%; height: 50px; position: absolute; top: -200%; transform: translateY(-50%);  }
header .bx-controls-direction a{ width: 31px; height: 61px;  position: absolute; background: url(../image/recruit__header__tit__arrow.png) no-repeat; text-indent: -9999px; }
header .bx-controls-direction .bx-prev{ background-position: 0 0; }
header .bx-controls-direction .bx-next{ background-position: -31px 0; right: 0;	}
/* bx-pager 點點 */
header .bx-pager { display: flex; justify-content: center; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
header .bx-pager-item a{ width: 10px; height: 10px; border-radius: 50%; margin-right: 20px; background: #919191;  display: block; text-indent: -9999px; }
header .bx-pager-item a.active{ background: #0070c9; }

/* header__tit */
.header__tit{ width: 296px; height: 296px; line-height: 296px; font-size: 1.875rem; color: #fff; text-align: center;  background: url(../image/header__tit__bg.png) no-repeat center center rgba(52,153,194,0.8); border-radius: 50%; position: absolute; left: 50%; top: 240px; transform: translateX(-50%); }
/* search-box */
.search-box{ margin: 1px auto 0 auto; }





/* category */
.category{}
.category-container{ width: 100%; /* min-width: 1280px; */ display: flex; }
.category-container>li{ width: 25%; height: 43.625vw;  position: relative;  }
.category-container>li:last-child{ height: 43.625vw; }
.category-container>li>img{ position: absolute; width: 25vw; height: 43.625vw; top: auto; }
.category-container>li>a{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
.category-container>li:nth-child(3) .comingsoontxt{ display: none; }
.category__bg{ width: 100%; height: 100%; position: absolute; background: rgba(0,0,0,0); transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.category-box{ color: #fff; width: 100%; position: absolute; left: 50%; top: 60%; transform: translate(-50%,0);  /* top: 9%; */ text-align: center; transition: all 1s cubic-bezier(.23,1,.32,1); }
.category__name{  }
.category__name a{ display: none; }
.category__name__tit{ font-size: 1.875rem; }
.category__name__line{ display: block; width: 62.5%; height: 1px; border-bottom: 1px solid #fff; opacity: 0.3; margin: 6px auto; }
.category__name__en{ font-size: 0.9375rem; }
.category__submenu{ /* display: none; */ display: block; margin: -80px 0 0 0; transition: all 0.4s cubic-bezier(.23,1,.32,1); opacity: 0; }
.category__submenu>li{ height: 40px; line-height: 40px; transition: all 1s cubic-bezier(.23,1,.32,1); }
.category__submenu>li:hover{ background: rgba(255,255,255,0.1) }
.category-container>li:hover .category__bg{ background: rgba(0,0,0,0.6); }
.category-container>li:hover .category-box{ top: 30%;  }
.category-container>li:last-child:hover .category-box{ top: 10%; }
.category-container>li:hover .category__submenu{ opacity: 1; margin: 20px 0 0 0;}
.category__submenu>li>a{ display: block; color: #fff; text-decoration: none; font-size: 1.125rem; width: 100%; height: 100%; transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.category__submenu>li>a:hover{ color: #3499c2; }












/* video */
.video{ width: 100%; height: 100%; background: rgba(0,0,0,0.95); position: fixed; left: 0; top: 0; z-index: 9999; display: none; }
.video__closebtn{ display:block; position: fixed; right: 15px; top: 15px; cursor: pointer; color: #fff; font-size: 2rem; }
.video__closebtn:after{ content: '\e870'; display: inline-block; }
.video__closebtn:hover { color: #409bc0; }
.video-container{ width: 80%; height:0;  padding-bottom:45%; position:relative; top:50%; left: 50%; transform: translate(-50%,-50%); }
.video-container iframe{ width: 100%; height: 100%; position: absolute; left:0; top:0; }





/* gototop */
.goto-box>li.gotosearch{ width: 68px; height: 109px; background: url(../../car/image/elite__gotosearch.png); background-position: 0 0;  }
.goto-box>li.gototop{ width: 68px; height: 69px; background: url(../../car/image/elite__gototop.png); background-position: 0 0; }


}











/* $1025~1279
--------------------------------------------------------------------------------------*/
@media screen and (min-width:1025px) and (max-width:1279px){





/* header */
header{ width: 100%; min-width: 1280px; /* height: 35.5625vw; */  position: relative; overflow: hidden; }
.header-container li img{ width: 100%; }






/* category */
.category__submenu>li{ height: 30px; line-height: 30px;}
.category__submenu>li>a{ font-size: 0.9375rem; }

}