/* //////////////////////////////////////////////////////////////////////////// */
/* JhuangPing v.1.0.1 [12.28.2020]                                              */
/* Github: https://jhuangping.github.io                                         */
/* //////////////////////////////////////////////////////////////////////////// */
/* Basic ======================================================================*/
.main { position: relative; }

.main:before { display: inline-block; content: url("../images/main-bg.png"); position: absolute; top: -10px; left: 150px; z-index: -1; }

.web-title { color: #fff; background: #000; font-size: 25px; font-weight: bold; text-align: center; max-width: 230px; margin: 0 auto; padding: 10px 5px; }

/* Banner =====================================================================*/
.banner .flex-control-nav { z-index: 1; bottom: 0px; }

.banner .flex-control-paging li a { background: rgba(174, 235, 255, 0.5); }

.banner .flex-control-paging li a:hover, .banner .flex-control-paging li a.flex-active { background: rgba(52, 190, 255, 0.9); }

/* About ======================================================================*/
.idx-about { padding-top: 100px; padding-bottom: 7%; position: relative; }

.idx-about:before, .idx-about:after { position: absolute; display: inline-block; z-index: -1; }

.idx-about:before { content: url("../images/idx-left.png"); bottom: -185px; left: 0px; }

.idx-about:after { content: url("../images/idx-right.png"); top: 65px; right: 153px; }

.idx-abt-text { max-width: 720px; margin: 0 auto; font-size: 16px; }

.idx-abt-text a { color: #000; }

.idx-abt-text .title { font-size: 25px; display: block; text-align: center; }

.idx-abt-text .box-btn { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding-top: 50px; }

.idx-abt-text:before, .idx-abt-text:after { display: block; margin: 30px auto; content: ''; width: 1px; height: 75px; background: #666; }

/* Products ===================================================================*/
.idx-products .wrap { padding-bottom: 95px; border-bottom: 15px solid #00A3D9; }

.owl-idxpro { margin: 70px 0; }

.owl-idxpro .owl-item:nth-child(even) .idxpro-list .pro-pic { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }

.owl-idxpro .owl-item:nth-child(even) .idxpro-list .pro-text { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }

.owl-idxpro.owl-theme .owl-nav { margin-top: 0px; width: 100%; position: absolute; top: calc(50% - 10px); }

.owl-idxpro.owl-theme .owl-nav [class*=owl-] { background: transparent; position: absolute; margin: 0px; padding: 0px; -webkit-transition: all 0.2s; transition: all 0.2s; }

.owl-idxpro.owl-theme .owl-nav [class*=owl-]:before { display: inline-block; content: ''; }

.owl-idxpro.owl-theme .owl-nav [class*=owl-]:hover { background: transparent; opacity: .5; }

.owl-idxpro.owl-theme .owl-nav .owl-prev { left: -50px; }

.owl-idxpro.owl-theme .owl-nav .owl-prev:before { content: url("../images/arrow/idx-left.png"); }

.owl-idxpro.owl-theme .owl-nav .owl-next { right: -50px; }

.owl-idxpro.owl-theme .owl-nav .owl-next:before { content: url("../images/arrow/idx-right.png"); }

.idxpro-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: relative; }

.idxpro-list:hover .pro-pic img { -webkit-transform: scale(1.1); transform: scale(1.1); }

.idxpro-list:hover .pro-text { background: #00A3D9; }

.idxpro-list a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }

.idxpro-list .pro-pic { border: 12px solid #00A3D9; overflow: hidden; }

.idxpro-list .pro-pic img { -webkit-transition: all 0.2s; transition: all 0.2s; }

.idxpro-list .pro-text { padding: 12px; color: #fff; background: #00B2B2; -webkit-transition: all 0.2s; transition: all 0.2s; }

.idxpro-list .pro-text .text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; width: 100%; min-height: 260px; max-height: 260px; border: 1px solid #fff; font-size: 25px; }

@media only screen and (max-width: 1440px) { .main:before { left: 50px; }
  .idx-about:before { left: -18%; }
  .idx-about:after { right: -12%; } }

@media only screen and (max-width: 1280px) { .idx-products .wrap { padding: 0 3% 95px 3%; } }

@media only screen and (max-width: 1024px) { .idx-about:before, .idx-about:after { opacity: .3; }
  .idx-products .wrap { padding: 0 10% 95px 10%; }
  .owl-idxpro .owl-item:nth-child(even) .idxpro-list .pro-pic { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
  .owl-idxpro .owl-item:nth-child(even) .idxpro-list .pro-text { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } }

@media only screen and (max-width: 768px) { .main:before { left: -195px; }
  .idx-about:before, .idx-about:after { display: none; }
  .idx-abt-text .box-btn { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

@media only screen and (max-width: 480px) { .idx-products .wrap { padding: 0 20% 95px 20%; } }

/* Add Style [ 2020.02.09 ] --------------------------------------------------- */
/* Index ====================================================================== */
.idx-info { margin-bottom: 80px; }

@media all and (max-width: 480px) { .idx-info { margin-bottom: 40px; } }

.idx-info_ctr { background: rgba(255, 255, 255, 0.5); }

.idx-info_ir { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-left: -1.82292vw; margin-right: -1.82292vw; }

@media all and (max-width: 945px) { .idx-info_ir { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } }

.idx-info_ir > * { padding-left: 1.82292vw; padding-right: 1.82292vw; }

.idx-info .card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: calc(100%/3); }

@media all and (max-width: 945px) { .idx-info .card { max-width: 550px; width: 100%; } }

.idx-info .card--idx-info .card_pic { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; border-bottom: 10px solid #01A2D9; padding-bottom: 14px; margin-bottom: 4px; }

.idx-info .card--idx-info .card_pic [class^="txt-"] { color: #003664; text-align: center; }

.idx-info .card--idx-info .card_pic .txt-title { margin: 0px; font-size: 22px; margin-bottom: 4px; }

.idx-info .card--idx-info .card_pic .txt-subtitle { margin: 0px; font-size: 14px; font-weight: normal; }

.idx-info .card--idx-info .card_txt { color: #1e4154; border: 1px solid #01A2D9; padding: 13px; height: 100%; }

.idx-stats { background: url("../images/index/stats-bg.jpg") no-repeat center; background-size: cover; background-attachment: fixed; color: #fff; padding-top: 5%; padding-bottom: 7%; margin-bottom: 75px; }

@media all and (max-width: 480px) { .idx-stats { margin-bottom: 35px; } }

.idx-stats_headline { margin: 0px; font-size: 25px; font-weight: bold; text-align: center; margin-bottom: 60px; }

.idx-stats_ir { display: -webkit-box; display: -ms-flexbox; display: flex; margin-left: -3px; margin-right: -3px; }

@media all and (max-width: 900px) { .idx-stats_ir { -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

.idx-stats_ir > * { width: calc(100%/5); padding-left: 3px; padding-right: 3px; }

@media all and (max-width: 900px) { .idx-stats_ir > * { width: 50%; margin-bottom: 40px; } }

@media all and (max-width: 480px) { .idx-stats_ir > * { width: 100%; } }

.idx-stats_ir .card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; text-align: center; position: relative; }

@media all and (min-width: 901px) { .idx-stats_ir .card:not(:last-child)::before { content: ''; position: absolute; top: 0px; right: -3px; width: 6px; height: 100%; background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(40%, white), color-stop(60%, white), to(rgba(255, 255, 255, 0))); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 40%, white 60%, rgba(255, 255, 255, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 ); } }

.idx-stats_ir .card--idx-stats .card_name { display: block; margin: 0px; font-weight: bold; line-height: 1; margin-bottom: 25px; }

@media all and (max-width: 900px) { .idx-stats_ir .card--idx-stats .card_name { margin-bottom: 5px; } }

.idx-stats_ir .card--idx-stats .card_pic { margin-bottom: 5px; line-height: 0; }

.idx-stats_ir .card--idx-stats .card_pic img { max-width: 140px; }

.idx-stats_ir .card--idx-stats .card_number { display: block; margin: 0px; line-height: 1; font-size: 40px; font-family: "Oswald", Arial, "Microsoft JhengHei", sans-serif; font-weight: bold; }

@media all and (max-width: 1200px) { .idx-stats_ir .card--idx-stats .card_number { font-size: 25px; } }
/*# sourceMappingURL=index.css.map */