@charset "UTF-8";
@import url("scss/plugins/bootstrap.min.css");
@import url("scss/plugins/mCustomScrollbar.css");
@import url("scss/plugins/slick/slick.css");
@import url("scss/plugins/slick/slick-theme.css");
@import url("scss/plugins/fancybox.css");
@import url("scss/plugins/bootstrap-select.min.css");
@import url("font/css/fontello.css");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto");
@import url('https://fonts.googleapis.com/css2?family=Mukta+Vaani:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@font-face { 
    font-family: 'fontello'; 
    src: url("./font/font/fontello.eot?587506f6"); 
    src: url("./font/font/fontello.eot?587506f6#iefix") format("embedded-opentype"), url("./font/font/fontello.woff?587506f6") format("woff"), url("./font/font/fontello.ttf?587506f6") format("truetype"), url("./font/font/fontello.svg?587506f6#fontello") format("svg"); 
    font-weight: normal; font-style: normal; }

/*layouts*/
i label { margin-bottom: 0; }
textarea { -webkit-appearance: none; }
button, input { line-height: normal; outline: 0; background: transparent; border: 0; }
button, select { text-transform: none; }
button, input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], input[disabled] { cursor: default; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; nowhitespace: afterproperty; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
button { border: none; background: none; padding: 0; margin: 0; display: inline-block; }
figure, address { padding: 0; margin: 0; }
* { outline: 0; box-sizing: border-box; }
*:before, *:after { box-sizing: border-box; }
/* ========================================================================== public ========================================================================== */
body { margin: 0; font-family: "Noto Sans TC"; font-size: 16px; -webkit-font-smoothing: antialiased; color: black; overflow-x: hidden; transition: opacity .3s; }
.safari body { -webkit-text-size-adjust: none; }
/* ========================================================================== public ========================================================================== */
/*不顯示外虛線*/
button, a { outline: none !important; }
a, a:active { color: inherit; cursor: pointer; text-decoration: none; }
a:hover { text-decoration: none; color: inherit; }
h1, .h1, h2, .h2, h3, .h3, h4, .h4 { line-height: normal; }
img { height: auto; border: none; -o-user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; image-rendering: -webkit-optimize-contrast; }
.clearfix:after { display: block; content: ''; clear: both; }
.hidden { display: none; }
ul { margin: 0; padding: 0; list-style: none; padding-inline-start: 0px; }
ul > li { list-style: none; }
textarea { resize: none; }
::-webkit-input-placeholder { /* WebKit browsers */ color: #646464; }
::-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #646464; }
::-o-placeholder { /* Mozilla Firefox 19+ */ color: #646464; }
::-ms-placeholder { /* Internet Explorer 10+ */ color: #646464; }
::-ms-input-placeholder { /* Internet Explorer 10+ */ color: #646464; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; /*透明*/ }

.scrollbar, .scrollbarX, .scrollbarY { -webkit-overflow-scrolling: touch; }
.scrollbarX { overflow-x: auto; }
table { -webkit-backface-visibility: visible; }
.table { width: 100%; border-collapse: collapse; }
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }
.modal-content { border: 0; }
.modal-content .modal-dialog { margin: 0; }
.modal-content .close { text-shadow: none; opacity: 1; }
[class^="icon-"]:before, [class*=" icon-"]:before { width: auto; margin: 0; }
.bootstrap-select .dropdown-toggle { box-shadow: none !important; }
@keyframes goTopAni { 0% { top: 0px; opacity: 1; }
  35% { top: -40px; opacity: 0; }
  40% { top: 40px; opacity: 0; }
  70% { top: -0px; opacity: 1; }
  100% { top: -0px; opacity: 1; } }
@keyframes indexNewsMoreAni { 0% { opacity: 0; }
  40% { opacity: 1; }
  60% { opacity: 1; }
  100% { opacity: 0; } }
@keyframes aboutIdeaSliderNextBtnAni { 0% { left: 0px; opacity: 1; }
  58% { left: 100%; opacity: 0; }
  59% { left: 0px; opacity: 0; }
  60% { left: 0px; opacity: 1; }
  100% { left: 0px; opacity: 1; } }
@keyframes aboutIdeaSliderPrevBtnAni { 0% { right: 0px; opacity: 1; }
  58% { right: 100%; opacity: 0; }
  59% { right: 0px; opacity: 0; }
  59% { right: 0px; opacity: 0; }
  60% { right: 0px; opacity: 1; }
  100% { right: 0px; opacity: 1; } }
@keyframes historyTitleDecAni { 0% { width: 10px; height: 10px; opacity: 0.3; }
  25% { width: 15px; height: 15px; opacity: 0.2; }
  50% { width: 18px; height: 18px; opacity: 0.0; }
  75% { width: 7px; height: 7px; opacity: 0.0; }
  100% { width: 10px; height: 10px; opacity: 0.3; } }
@keyframes fuelSaleFourAni { 0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); } }
body { min-height: 100vh; overflow-y: scroll; display: flex; flex-direction: column; transition: opacity 0.4s 0.2s; }
/*Public*/
header, main, footer { flex-shrink: 0; }
@media (min-width: 1500px) { .container { max-width: 1440px; } }
@media (min-width: 1700px) { .container { max-width: 1620px; } }
.hide, .opacity0 { opacity: 0; }


/* --------------- */
/* warehouse
/* --------------- */

.header .search { padding-top: .5em; align-items: center; }
.header .search p { display: inline-block; }
.header .nav_center { display: inline-block; }
@media screen and (max-width: 575px) { 
    header.header .headerTop { height: 50px; }
    header.header .menuContainer { padding: 0 25px; }
    header.header .logo { width: 108px; }
    header.header .iconContainer { width: 98px; }
    header.header .iconContainer .icon { font-size: 19px; }
    header.header .iconContainer .global .globalMenu { top: 41px; }
    header.header .iconContainer .navIcon { width: 21px; height: 15px; }
    header.header .iconContainer .navIcon .iconItem:nth-child(2) { right: -6px; }
    header.header .iconContainer .navIcon:hover .iconItem { right: -6px; background: #D61518; }
    header.header .iconContainer .navIcon:hover .iconItem:nth-child(2) { right: 0px; }
}

main { width: 100%; flex-grow: 1; position: relative; z-index: 1; overflow: hidden; display: flex; flex-direction: column; }

.breadcrumb { padding: 23px 0rem 20px 0; margin-bottom: 0; border-radius: 0rem; list-style: none; background: none; display: flex; justify-content: flex-end; align-items: center; }
.breadcrumb > li { float: none; font: 400 16px 'Noto Sans TC', sans-serif; color: #959595; }
.breadcrumb > li a { color: #959595; }
.breadcrumb > li a:hover { opacity: 0.8; }
.breadcrumb > li + li::before { color: #959595; }
.breadcrumb > .active { color: #959595; }
.breadcrumb .breadcrumb-item + .breadcrumb-item { padding-left: 0; }
.breadcrumb .breadcrumb-item + .breadcrumb-item::before { content: '\e802'; width: 40px; margin-left: 4px; margin-right: 4px; padding-right: 0; font-family: 'fontello'; font-size: 12px; transform: scale(0.4); float: none; display: inline-block; line-height: 5px; position: relative; top: -2px; }
.breadcrumb .breadcrumb-item .icon-home { font-size: 15px; position: relative; top: -2px; }

.cookieContainer { width: 100%; background: #fff; box-shadow: 0px -5px 10px 0 rgba(0, 0, 0, 0.05); position: fixed; bottom: 0; left: 0; z-index: 80; }
.cookieContainer .cookieBox { height: 76px; max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.cookieContainer .text { width: calc(100% - 210px); font: 400 16px 'Noto Sans TC', sans-serif; line-height: 20px; letter-spacing: 0.8px; }
.cookieContainer .text a.colorMain { text-decoration: underline; transition: all 0.4s; }
.cookieContainer .text a.colorMain:hover { color: #D61518; opacity: 0.8; }
.cookieContainer .cookieBtn { width: 183px; }
.cookieContainer .cookieBtn .btnCustomer { width: 100%; height: 40px; line-height: 38px; }

.insidePage .cookieContainer { display: none; }
.insidePage .header { display: none; }
.insidePage main { margin-top: 80px; }
.insidePage main .pageTitleContainer { margin-bottom: 52px; text-align: center; }
.insidePage main .pageTitleContainer .ch { margin-bottom: 14.2px; font: 700 40px 'Noto Sans TC', sans-serif; line-height: 40px; color: #242424; }
.insidePage main .pageTitleContainer .en { font: 600 16px 'Raleway', sans-serif; line-height: 16px; letter-spacing: 0.5px; color: #D61518; text-transform: uppercase; }
.insidePage main .container { padding-left: 0; padding-right: 0; }

.colorMain { color: #D61518; }
.btn.btnCustomer { height: 55px; border: solid 1px transparent; border-radius: 0; padding: 0 10px; font: 300 17px 'Noto Sans TC', sans-serif; line-height: 53px; background: #D61518; color: #fff; text-align: center; transition: all 0.4s; }
.btn.btnCustomer:hover { opacity: 0.6; }
.btn.btnCustomer:focus { outline: none; box-shadow: none; }
.btn.btnCustomer.btnGray { border: solid 1px rgba(204, 204, 204, 0.5); color: #959595; background: transparent; }
.btn.btnCustomer.btnGray:hover { opacity: 1; background: #f5f5f5; }
.overflowVisible { overflow: visible; }

@media screen and (max-width: 1499px) { 
    .cookieContainer .text { width: calc(100% - 175px); letter-spacing: 0px; }
    .cookieContainer .cookieBtn { width: 170px; }
    .insidePage .header { display: block; }
    .insidePage .header .headerTop { height: 80px; border-bottom: solid 1px #ccc; background: #fff; }
    .insidePage .header .iconContainer .icon { color: #242424; }
    .insidePage .header .iconContainer .global .globalMenu { background: #f6f6f6; top: 57px; }
    .insidePage .header .iconContainer .navIcon .iconItem { background: #242424; }
}
@media screen and (max-width: 767px) { 
    .cookieContainer .cookieBox { height: auto; padding: 15px 0; flex-direction: column; }
    .cookieContainer .text { width: 100%; margin-bottom: 12px; line-height: 24px; text-align: justify; }
    .cookieContainer .cookieBtn { width: 200px; } 
}
@media screen and (max-width: 575px) { 
    .breadcrumb { display: none; }
    .insidePage main .pageTitleContainer { margin-top: 67px; }
    .insidePage main .container { padding-left: 15px; padding-right: 15px; }
}


/* --------------- */
/* common
/* --------------- */

.d-none { display: none; }
.d-flex-col { display: flex; flex-direction: column; }
.d-1199-mobile { display: none; }
.d-1199-pc { display: block; }
.d-991-pc { display: block; }
.d-991-mobile { display: none; }

.max532 { max-width: 532px; }
.max1280 { max-width: 1280px; margin: auto; }
.max1336 { max-width: 1336px; margin: auto; }
.max1340 { max-width: 1340px; margin: auto; }
.max1380 { max-width: 1380px; margin: auto; }
.max1440 { max-width: 1440px; margin: auto; }
.max1454 { max-width: 1454px; margin: auto; }
.max1460 { max-width: 1460px; margin: auto; }
.max1480 { max-width: 1480px; margin: auto; }
.max1500 { max-width: 1500px; margin: auto; }
.max1514 { max-width: 1514px; margin: auto; }
.max1540 { max-width: 1540px; margin: auto; }
.max1630 { max-width: 1630px; margin: auto; }
.max1640 { max-width: 1640px; margin: auto; }
.max1654 { max-width: 1654px; margin: auto; }
.max1688 { max-width: 1688px; margin: auto; }
.max1690 { max-width: 1690px; margin: auto; }
.max1700 { max-width: 1700px; margin: auto; }
.max-w100-920 { width: 100%; max-width: 920px;} 
.max-w100-920 iframe { width: 100%; border: 0; } 

.blank { padding-left: 30px; padding-right: 30px; }
.blank50 { padding-left: 50px; padding-right: 50px; }
.flexNowrap { flex-wrap: nowrap; }
.flex-center { display: flex; justify-content: center; align-items: center; }
.finger { cursor: pointer; }
.height150 { height: 225px; }
.object-fit { object-fit: cover; object-position: center; width: 100%; }
.position-fixed { position: fixed !important; }
.line1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.line3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.z-1 { z-index: 1; }
.z-2 { z-index: 2; }

.fs-10 { font-size: 10px; }
.fs-14 { font-size: 14px; }
.fs-16 { font-size: 16px; }
.fs-18 { font-size: 18px; }
.fs-20 { font-size: 20px; }
.fs-22 { font-size: 22px; }
.fs-24 { font-size: 24px; }
.fs-26 { font-size: 26px; }
.fs-28 { font-size: 28px; }
.fs-30 { font-size: 30px; }
.fs-34 { font-size: 34px; }
.fs-40 { font-size: 40px; }
.fs-42 { font-size: 42px; }
.fs-58 { font-size: 58px; }
.fs-70 { font-size: 70px; line-height: 66.8px; }
.fs-85 { font-size: 85px; line-height: 75px; }
.fs-92 { font-size: 92px; line-height: 85px;  }
.fs-140 { font-size: 140px; line-height: 100px; }

.les03 { letter-spacing: .3px; }
.les05 { letter-spacing: 0.5px; }
.les10 { letter-spacing: 1px; }
.les18 { letter-spacing: 1.8px; }
.les25 { letter-spacing: 0.25px; }

.notoSansTC { font-family: 'Noto Sans TC', sans-serif; }
.ff-no { font-family: 'Noto Sans TC', sans-serif; }
.ff-tc { font-family: 'Noto Sans TC', sans-serif; }
.montserrat { font-family: 'Montserrat', sans-serif; }
.ff-mo { font-family: 'Montserrat', sans-serif; }
.muktaVaani { font-family: 'Mukta Vaani', sans-serif; }
.ff-mu { font-family: 'Mukta Vaani', sans-serif; }
.fw-300 { font-weight: 300; }
.fw-500 { font-weight: 500; }
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }
.fw-900 { font-weight: 900; }
.lh-24 { line-height: 24px; }
.lh-30 { line-height: 30px; }
.lh-36 { line-height: 36px; }
.lh-42 { line-height: 42px; }
.lh-44 { line-height: 44px; }
.lh-78 { line-height: 78px; }
.text-000 { color: #000; }
.text-8d8d8d { color: #8d8d8d; }
.text-E41E25 { color: #E41E25; }
.text-E61D25 { color: #E61D25; }
.text-595959 { color: #595959; }
.text-D2D2D2 { color: #D2D2D2; }
.text-black07 { color: rgba(0, 0, 0, 0.7); }
.text-center { text-align: center; }
.tt-up { text-transform: uppercase; }
.a-under { text-decoration: underline; }
.a-border { text-decoration: underline; }
.bg-E41E25 { background: #E41E25 !important; }
.bg-black { background: #000; }
.fill-black { text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; }
.fill-white { text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; }
.msx1630 { max-width: 1630px; margin: 0 auto; }
.text-upp { text-transform: uppercase; }
.blockWhite { background: #fff; }
.blockRed { background: #E61D25; }
.border1 { border: 1px solid #EFEFEF; }

@media screen and (max-width: 1499px) { 
    .fs-30 { font-size: 26px; }
    .fs-58 { font-size: 42px; }
    .fs-85 { font-size: 78px; }
    .fs-140 { font-size: 110px; line-height: 100px; }
}
@media screen and (max-width: 991px) { 
    .blank { padding-left: 20px; padding-right: 20px; }
    .blank50 { padding-left: 30px; padding-right: 30px; }
}
@media screen and (max-width: 767px) { 
    .fs-16 { font-size: 16px; }
    .fs-22 { font-size: 18px; }
    .fs-30 { font-size: 24px; }
    .fs-85 { font-size: 68px; line-height: 68px; }
    .fs-140 { font-size: 100px; line-height: 80px; } 
}
@media screen and (max-width: 575px) { 
    .blank { padding-left: 20px; padding-right: 20px; }
    .line3 { -webkit-line-clamp: 2; }
    .fs-28 { font-size: 20px; }
    .fs-30 { font-size: 22px; line-height: 30px; }  
    .fs-40 { font-size: 32px; } 
    .fs-42 { font-size: 36px; line-height: 38px;  } 
    .fs-58 { font-size: 36px; }
    .fs-70 { font-size: 60px; line-height: 60px; }
    .fs-85 { font-size: 50px; line-height: 52px; }
    .fs-140 { font-size: 18vw; line-height: 15vw; } 
    .lh-42 { line-height: 36px; }
    .lh-78 { line-height: 42px; }
}

.editor::after{
  content: '';
  width: 0;
  height: 0;
  display: block;
  clear: both;
  float: none;
}

@keyframes fadeDown { 
    0% { transform: translateY(-200px); }
    50% { transform: translateY(-50px); }
    100% { transform: translateY(0px); } 
}

@keyframes fadeUp { 
    0% { transform: translateY(0); }
    50% { transform: translateY(-50px); }
    100% { transform: translateY(-200px); } 
}

@keyframes move-arrow {
  0% {
    opacity: 1;
      transform: translate(0px, 0px);
  }
  25% {
    opacity: 0;
     transform: translate(35px, -35px); 
  }
  26% {
    opacity: 0;
    transform: translate(-35px, 35px);
  }
  55% {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}

@keyframes move-arrow2 {
  0% {
    opacity: 1;
      transform: translate(0px, 0px);
  }
  25% {
    opacity: 0;
     transform: translate(5px, -5px); 
  }
  26% {
    opacity: 0;
    transform: translate(-5px, 5px);
  }
  55% {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}

@keyframes goRightAni { 
    0% { right: 60px; opacity: 0; }
    50% { right: 50px; opacity: 1; }
    100% { right: 40px; opacity: 0; } 
}


/* --------------- */
/* pages common
/* --------------- */

.socialIconBlock { text-align: center; }
.socialIconWrap { display: flex; justify-content: center; align-items: center; /* width: 196px; */ margin: auto; flex-wrap: wrap; }
.socialIconBox { background: #000; width: 55px; height: 55px; display: flex; justify-content: center; align-items: center; transition: background .3s; color: #fff; margin: 5px 7px; }
.socialIconBox:hover { background: #E41E25; transition: background .3s; color: #fff; }
.socialIconBox i:before { font-size: 20px; padding-bottom: 2px; }

.borderBtn { border: 5px solid #E41E25; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; color: #E41E25; }
.redBlock { width: 15px; height: 15px; border: 4px solid #000; display: inline-block; margin-right: 20px; }

.redBtn { color: #fff; margin: 0 auto; width: 100%; max-width: 200px; display: block;  padding-top: 18px; padding-bottom: 18px; background: #E41E25; cursor: pointer;  transition: background .3s; text-align: center; }
.redBtn .inner { display:  flex; justify-content: center; align-items: center; font-family: 'Noto Sans TC', sans-serif; font-size: 16px; font-weight: 500; letter-spacing: .3px; }
.redBtn .inner .iconBox {  margin-top: -4px; }
.redBtn .inner i {  display: inline-block;   font-size: 9px; margin-left: 24px; }
.redBtn:hover { background: rgba(228, 30, 37, 0.8); transition: background .3s; color: #fff; }
.redBtn:hover i { animation: move-arrow2 2s infinite; }

.arrowBtn { display: inline-block; }
.arrowBtn .btnInner { display: flex; align-items: center; }
.arrowBtn.white { color: #fff; }
.arrowBtn.black { color: #000; }
.arrowBtn .en { font-family: 'Mukta Vaani', sans-serif; font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: .25px; }
.arrowBtn .cn { font-family: 'Noto Sans TC', sans-serif; font-size: 16px; font-weight: bold; }

.borderArrow { border: 5px solid #E41E25; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; margin-left: 48px; font-size: 13px; padding-left: 2px;  transition: all .3s; } 
.borderArrow.white { border: 5px solid #fff; } 
.borderArrow.black { border: 5px solid #000; } 
.borderArrow.red { border: 5px solid #E41E25; } 
.arrowBtn:hover .borderArrow  { overflow: hidden; }
.arrowBtn:hover .borderArrow  i { animation: move-arrow 2s infinite; }


/* --------------- */
/* container
/* --------------- */

.container-fluid { max-width: 100%; }
.container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1800px; }
@media (max-width: 1680px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1620px; }
}
@media (max-width: 1600px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1530px; }
}
@media (max-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1330px; }
}
@media (max-width: 1320px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1260px; }
}
@media (max-width: 1199px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1139px; }
}
@media (max-width: 1049px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 989px; }
}
@media (max-width: 991px) { /* phone */
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 931px; }
}
@media (max-width: 767px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 707px; }
}
@media (max-width: 575px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 545px; }
}


/* --------------- */
/* swiper
/* --------------- */

@font-face { font-family: 'swiper-icons'; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; }
:root { --swiper-theme-color: #007aff; }

.swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
.swiper-container-vertical > .swiper-wrapper { flex-direction: column; }
.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; }
.swiper-container-android .swiper-slide, .swiper-wrapper { transform: translate3d(0px, 0, 0); }
.swiper-container-multirow > .swiper-wrapper { flex-wrap: wrap; }
.swiper-container-multirow-column > .swiper-wrapper { flex-wrap: wrap; flex-direction: column; }
.swiper-container-free-mode > .swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto; }
.swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; }
.swiper-slide-invisible-blank { visibility: hidden; }
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto; }
.swiper-container-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; }
.swiper-container-3d { perspective: 1200px; }
.swiper-container-3d .swiper-wrapper, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-cube-shadow { transform-style: preserve-3d; }
.swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; }
.swiper-container-3d .swiper-slide-shadow-left { background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
.swiper-container-3d .swiper-slide-shadow-right { background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
.swiper-container-3d .swiper-slide-shadow-top { background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
.swiper-container-3d .swiper-slide-shadow-bottom { background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
.swiper-container-css-mode > .swiper-wrapper { overflow: auto; scrollbar-width: none; -ms-overflow-style: none; }
.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar { display: none; }
.swiper-container-css-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: start start; }
.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper { scroll-snap-type: x mandatory; }
.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper { scroll-snap-type: y mandatory; }
:root { /*
--swiper-pagination-color: var(--swiper-theme-color);
*/ }
.swiper-pagination { position: absolute; text-align: center; transition: 300ms opacity; transform: translate3d(0, 0, 0); z-index: 10; }
.swiper-pagination.swiper-pagination-hidden { opacity: 0; }
/* Common Styles */
.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 10px; left: 0; width: 100%; }
/* Bullets */
.swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0; }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transform: scale(0.33); position: relative; }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active { transform: scale(1); }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { transform: scale(1); }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { transform: scale(0.66); }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { transform: scale(0.33); }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { transform: scale(0.66); }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { transform: scale(0.33); }
.swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 100%; background: #000; opacity: 0.2; }
button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; appearance: none; }
.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; }
.swiper-pagination-bullet-active { opacity: 1; background: var(--swiper-pagination-color, var(--swiper-theme-color)); }
.swiper-container-vertical > .swiper-pagination-bullets { right: 10px; top: 50%; transform: translate3d(0px, -50%, 0); }
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 6px 0; display: block; }
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; transform: translateY(-50%); width: 8px; }
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; transition: 200ms transform, 200ms top; }
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 4px; }
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; transform: translateX(-50%); white-space: nowrap; }
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms left; }
.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms right; }
/* Progress */
.swiper-pagination-progressbar { background: rgba(0, 0, 0, 0.25); position: absolute; }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top; }
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { transform-origin: right top; }
.swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0; }
.swiper-container-vertical > .swiper-pagination-progressbar, .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 4px; height: 100%; left: 0; top: 0; }
.swiper-pagination-blue { --swiper-pagination-color: #0083CA; }
.swiper-pagination-indigo { --swiper-pagination-color: #6610f2; }
.swiper-pagination-purple { --swiper-pagination-color: #6f42c1; }
.swiper-pagination-pink { --swiper-pagination-color: #d63384; }
.swiper-pagination-red { --swiper-pagination-color: #CC5E5E; }
.swiper-pagination-lightRed { --swiper-pagination-color: #DD4663; }
.swiper-pagination-orange { --swiper-pagination-color: #E41E25; }
.swiper-pagination-green { --swiper-pagination-color: #198754; }
.swiper-pagination-teal { --swiper-pagination-color: #20c997; }
.swiper-pagination-cyan { --swiper-pagination-color: #0dcaf0; }
.swiper-pagination-white { --swiper-pagination-color: #fff; }
.swiper-pagination-gray-dark { --swiper-pagination-color: #343a40; }
.swiper-pagination-yellow { --swiper-pagination-color: #FFD530; }
.swiper-pagination-gray32 { --swiper-pagination-color: #323232; }
.swiper-pagination-grayCE { --swiper-pagination-color: #CECECE; }
.swiper-pagination-lock { display: none; }
 /*
:root { --swiper-navigation-size: 44px;
--swiper-navigation-color: var(--swiper-theme-color);
}
*/ 
.swiper-button-prev, .swiper-button-next { /*position: absolute;  top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(-1 * var(--swiper-navigation-size) / 2); */ z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); }
.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.5; cursor: auto; pointer-events: none; }
.swiper-button-prev:after, .swiper-button-next:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; }
.swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: 10px; right: auto; }
.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after { /* content: 'prev'; */ }
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 10px; left: auto; }
.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { /* content: 'next'; */ }
.swiper-button-prev.swiper-button-blue, .swiper-button-next.swiper-button-blue { --swiper-navigation-color: #0083CA; }
.swiper-button-prev.swiper-button-indigo, .swiper-button-next.swiper-button-indigo { --swiper-navigation-color: #6610f2; }
.swiper-button-prev.swiper-button-purple, .swiper-button-next.swiper-button-purple { --swiper-navigation-color: #6f42c1; }
.swiper-button-prev.swiper-button-pink, .swiper-button-next.swiper-button-pink { --swiper-navigation-color: #d63384; }
.swiper-button-prev.swiper-button-red, .swiper-button-next.swiper-button-red { --swiper-navigation-color: #CC5E5E; }
.swiper-button-prev.swiper-button-lightRed, .swiper-button-next.swiper-button-lightRed { --swiper-navigation-color: #DD4663; }
.swiper-button-prev.swiper-button-orange, .swiper-button-next.swiper-button-orange { --swiper-navigation-color: #E41E25; }
.swiper-button-prev.swiper-button-green, .swiper-button-next.swiper-button-green { --swiper-navigation-color: #198754; }
.swiper-button-prev.swiper-button-teal, .swiper-button-next.swiper-button-teal { --swiper-navigation-color: #20c997; }
.swiper-button-prev.swiper-button-cyan, .swiper-button-next.swiper-button-cyan { --swiper-navigation-color: #0dcaf0; }
.swiper-button-prev.swiper-button-white, .swiper-button-next.swiper-button-white { --swiper-navigation-color: #fff; }
.swiper-button-prev.swiper-button-gray-dark, .swiper-button-next.swiper-button-gray-dark { --swiper-navigation-color: #343a40; }
.swiper-button-prev.swiper-button-yellow, .swiper-button-next.swiper-button-yellow { --swiper-navigation-color: #FFD530; }
.swiper-button-prev.swiper-button-gray32, .swiper-button-next.swiper-button-gray32 { --swiper-navigation-color: #323232; }
.swiper-button-prev.swiper-button-grayCE, .swiper-button-next.swiper-button-grayCE { --swiper-navigation-color: #CECECE; }
.swiper-button-lock { display: none; }
.swiper-container-fade.swiper-container-free-mode .swiper-slide { transition-timing-function: ease-out; }
.swiper-container-fade .swiper-slide { pointer-events: none; transition-property: opacity; }
.swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none; }
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; }


/* --------------- */
/* nav menu btn
/* --------------- */

header.header .navIcon_wrap  { cursor: pointer; transition: all .3s ease;  }
header.header .navIcon_wrap:hover  { background: #252525; transition: all .3s ease; }
header.header.scrollDown .navIcon_wrap:hover  { background: #252525; }

header.header .navIcon_wrap .navIcon .iconOuter { display: flex; flex-direction: column; width: 30px; height: 30px; justify-content: space-between; }
header.header.scrollDown .navIcon_wrap .navIcon .iconOuter { display: flex; flex-direction: column; width: 23px; height: 23px; justify-content: space-between; }

header.header .navIcon_wrap .navIcon .iconOuter .iconRow { display: flex; flex-direction: row; justify-content: space-between; }
header.header .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol { width: 7.3px; height: 7.3px; background: #fff;  }
header.header.scrollDown .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol { width: 5.6px; height: 5.6px; background: #fff;  }
header.header .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol.rotate { transition: all .3s;  }
header.header .navIcon_wrap:hover .navIcon .iconOuter .iconRow .iconCol.rotate { transform: rotate(45deg); transition: all .3s;  }

header.header .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol.clear { opacity: 1; transition: all .3s; }
header.header .navIcon_wrap.show .navIcon .iconOuter .iconRow .iconCol.clear { opacity: 0; transition: all .3s; }

@media (max-width: 1299px) {
    header.header .navIcon_wrap .navIcon .iconOuter { width: 23px; height: 23px; }
    header.header .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol { width: 5.6px; height: 5.6px; }
}


/* --------------- */
/* header - Top
/* --------------- */

header.header { 
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 990;
}
header.header .d-index-block { display: inline-block; }
header.header .d-index-none { display: none; }

header ::-webkit-scrollbar { width: 0px; }
header ::-webkit-scrollbar-track { background: #fff; }
header ::-webkit-scrollbar-thumb { background: #fff; }
header ::-webkit-scrollbar-thumb:hover { background: #fff; }

header.header .headerTop {
    position: relative;
    height: 140px;
    color: #fff;
    padding: 0;
    z-index: 990;
    transition: all 0.4s;
    font-family: "Noto Sans TC"; font-weight: 500; letter-spacing: .5px;
}

header.header .navIcon .nav_open { display: block; }
header.header .navIcon .nav_close { display: none; }
header.header .navIcon.show .nav_open { display: none; }
header.header .navIcon.show .nav_close { display: block; }

header.header .navContainer .navWrapIcon .nav_open {  display: none; }
header.header .navContainer .navWrapIcon .nav_close { display: block; }
header.header .navContainer .navWrapIcon.show .nav_open { display: block; }
header.header .navContainer .navWrapIcon.show .nav_close {  display: none; }

header.header .headerTop { z-index: 10; }
header.header .headerTop .nav_logo_wrap  { padding-right: 15px; padding-left: 15px; }
header.header .headerTop .logoWrap  { padding-bottom: 17px; }
header.header .headerTop.mobileScrollDown { background: rgba(0, 0, 0, 0.5); } 

header.header .rowCustom { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; width: 100%; flex-direction: row; }
header.header .nav_left_wrap, header.header .logo_wrap, header.header nav_center_wrap, header.header nav_btn_wrap { position: relative; width: 100%; min-height: 1px; }

header.header .nav_left_wrap { 
    -ms-flex: 0 0 calc(100% - 440px); flex: 0 0 calc(100% - 440px); max-width: calc(100% - 440px);
    display: flex; flex-direction: row; justify-content: space-between; 
     border-bottom: 2px solid rgba(255, 255, 255, 0.2); 
    animation: fadeDown .5s linear; 
}
header.header .nav_left_wrap.dis {
     animation: fadeUp .25s linear; animation-fill-mode: forwards; 
}

header.header .nav_logo_wrap { 
    -ms-flex: 0 0 21.62%; flex: 0 0 21.62%; max-width: 21.62%; 
    display: flex; justify-content: flex-end;
}

header.header .nav_center_wrap { 
    -ms-flex: 0 0 78.38%; flex: 0 0 78.38%; max-width: 78.38%; 
    display: flex; justify-content: flex-end; 
}

header.header a.dropdown_logo_wrap { border-bottom: 0; display: none; }

header.header .nav_btn_wrap { 
    -ms-flex: 0 0 440px; flex: 0 0 440px; max-width: 440px; 
    display: flex; justify-content: flex-end; 
}

header.header .nav_logo_wrap { display: flex; justify-content: flex-end; align-items: center; }
header.header .logoWrap img { width: 180px; height: 62px; }

header.header .nav_center_items { padding-right: 6%;  display: flex; animation: fadeDown .25s linear; }
header.header .nav_center_items li a {
    margin: 0 21px; 
    padding-top: 60px; padding-bottom: 58px;
    line-height: 18px;
    position: relative; 
    font-size: 18px; font-weight: 300; letter-spacing: 1px; 
}
header.header .nav_center_items li a::after { 
    content: '';
    position: absolute; 
    left: 0;
    bottom: -2px; 
    width: 0; 
    height: 4px;
    transition: all .3s; 
    background: #fff;
}
header.header .nav_center_items li a:hover::after { width: 100%; }
header.header .nav_center_items li.active a::after { width: 100%; }


/* nav_search */
.header .search { padding-top: 0; display: flex; align-items: center; } 
header.header .search_wrap { 
    background: #E41E25;
    width: 300px; height: 140px; 
    display: flex; align-items: center; justify-content: center; transition: all .3s ease;
    border-bottom: 1px solid #E41E25;
}
header.header .search_wrap:hover { background: #EB4A51; transition: all .3s ease; }
header.header .search_wrap .iconBox { font-size: 28px; padding-top: 0; display: flex; align-items: center; }

header.header .navIcon_wrap { 
    width: 140px; height: 140px;
    background: #000; cursor: pointer; 
    display: flex; align-items: center; justify-content: center;
    transition: all .3s ease;  border-bottom: 1px solid #000;
}


/* --------------- */
/* header.scrollDown
/* --------------- */

header.header.scrollDown .nav_left_wrap { border-bottom: 0; } 

header.header.scrollDown a.dropdown_logo_wrap {
    display: block; 
    background: #E41E25; height: 100px; 
        -ms-flex: 0 0 54.55%; flex: 0 0 54.55%; max-width: 54.55%;
    display: flex; justify-content: center; align-items: center; transition: all .3s; 
    border-bottom: 2px solid #E41E25;
}
header.header.scrollDown a.dropdown_logo_wrap:hover { background: #EB4A51; transition: all .3s; }
header.header.scrollDown a.dropdown_logo_wrap img { margin-top: -8px; max-width: 120px; }

header.header.scrollDown .rowCustom { justify-content: flex-end; margin-left: auto; max-width: 440px; }
header.header.scrollDown .headerTop .logoWrap {  padding-bottom: 8px; }
header.header.scrollDown .nav_left_wrap { display: none; }
header.header.scrollDown .headerTop .nav_logo_wrap { padding-left: 0;  padding-right: 0;    border-bottom: 2px solid #E41E25; }
header.header.scrollDown .nav_center_wrap { -ms-flex: 0 1 0%; flex: 0 1 0%; max-width: 0%; }
header.header.scrollDown .nav_btn_wrap { -ms-flex: 0 0 45.45%; flex: 0 0 45.45%; max-width: 45.45%; display: flex; justify-content: flex-end; }
header.header.scrollDown .headerTop { 
    position: absolute; top: 0; right: 0; 
    width: 440px; height: 100px; 
    border-bottom: 0; transition: all .3s;
}
header.header.scrollDown .logoWrap img { width: 120px; height: 42px; }

header.header.scrollDown .search_wrap { 
    width: 100px; height: 100px; 
    background: #000; 
    border-right: 1px solid rgba(59, 59, 59, 0.7); 
    border-bottom-color: #000; 
    transition: height .3s ease; 
}
header.header.scrollDown .search_wrap:hover { background: #252525; transition: all .3s ease; } 
header.header.scrollDown .search_wrap .iconBox { font-size: 25px; margin-top: -2px; }
header.header.scrollDown .search_wrap .txt { display: none; }
header.header.scrollDown .navIcon_wrap img { width: 23px; height: 23px; }
header.header.scrollDown .navIcon_wrap { width: 100px; height: 100px; background: #000; }



/* --------------- */
/* header top rwd
/* --------------- */

@media screen and (max-width: 1699px) {
    header.header .headerTop .nav_logo_wrap { padding-left: 60px; }
    header.header.scrollDown .headerTop .nav_logo_wrap { padding-left: 0px; }
    header.header .nav_center_wrap { padding-right: 0; -ms-flex: 0 0 calc(100% - 260px); flex: 0 0 calc(100% - 260px); max-width: calc(100% - 260px); }
    header.header .nav_logo_wrap { -ms-flex: 0 0 260px; flex: 0 0 260px; max-width: 260px; }    
}
@media screen and (max-width: 1499px) {
    header.header .nav_logo_wrap { -ms-flex: 0 0 200px; flex: 0 0 200px; max-width: 200px; }
    header.header .nav_center_wrap { -ms-flex: 0 0 calc(100% - 200px); flex: 0 0 calc(100% - 200px); max-width: calc(100% - 200px); }
    header.header .headerTop .nav_logo_wrap { padding-left: 35px; }
    header.header .nav_center_items { padding-right: 4%; }
    header.header .nav_center_items li a { margin: 0 10px; }
}

@media screen and (max-width: 1299px) {
    header.header .headerTop { height: 84px; }
    header.header .headerTop .logoWrap { padding-bottom: 0; }
    header.header .rowCustom { justify-content: space-between; }
    header.header .nav_center_items { display: none; }
    header.header a.dropdown_logo_wrap { height: 84px; border-bottom: 2px solid #E41E25; }
    header.header .nav_left_wrap { 
        -ms-flex: 0 0 calc(100% - 168px); flex: 0 0 calc(100% - 168px); max-width: calc(100% - 168px); height: 84px; animation: none;
    }
    header.header .nav_logo_wrap { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; justify-content: flex-start; padding-left: 2.7%; height: 84px; }
    header.header .nav_center_wrap { -ms-flex: 0 1 0%; flex: 0 1 0%; max-width: 0%; }
    header.header .nav_btn_wrap { 
        -ms-flex: 0 0 168px; flex: 0 0 168px; max-width: 168px;
        display: flex; justify-content: flex-end; height: 84px; 
    }
    header.header.scrollDown .headerTop .nav_logo_wrap { padding-left: 0; padding-right: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; justify-content: center; }
    header.header.scrollDown .nav_logo_wrap { height: 100px; }
    
    header.header .search_wrap { width: 84px; height: 84px; background: transparent; border-left: 0.5px solid rgba(255, 255, 255, 0.5); border-bottom: 2px solid rgba(255, 255, 255, 0.2); transition: all .3s ease; }
    header.header.scrollDown .search_wrap { height: 100px; border-left: 0; }
    header.header .search_wrap .iconBox { padding-bottom: 2px; }
    header.header .search_wrap .txt { display: none; }

    header.header .navIcon_wrap { width: 84px; height: 84px; background: transparent; border-left: 0.5px solid rgba(255, 255, 255, 0.5); border-bottom: 2px solid rgba(255, 255, 255, 0.2); transition: all .3s ease; }
    header.header.scrollDown .navIcon_wrap { height: 100px; border-bottom-color: #000; }
}

@media screen and (max-width: 768px) {
    header.header .nav_left_wrap { -ms-flex: 0 0 calc(100% - 168px); flex: 0 0 calc(100% - 168px); max-width: calc(100% - 168px); }
    header.header .nav_btn_wrap { -ms-flex: 0 0 168px; flex: 0 0 168px; max-width: 168px; } 
}

@media screen and (max-width: 575px) {
    header.header .nav_logo_wrap { padding-left: 5%; padding-right: 5%; }
}


/* --------------- */
/* header - side menu
/* --------------- */

header.header .navContainer { 
    width: 100%; height: 0;
    position: fixed;
    top: 0; right: 0;
    z-index: -1; overflow: hidden; transition: all 0.01s 0.4s;
}

header.header .navContainer .bg { 
    width: 100%; height: 100%;
    position: absolute; top: 0; left: 0; 
    background: rgba(0, 0, 0, 0.5); opacity: 0;
    transition: all 0.4s 0.1s; 
}

header.header .navContainer .navWrap { 
    width: 100%; max-width: 440px; height: calc(100vh - 100px); 
    background: #fff; 
    position: absolute; right: 0; bottom: 1500px; 
    transition: all 0.4s;
    text-align: center;
    display: block; z-index: 9;
}
header.header.scrollDown .navContainer .navWrap { width: 440px; }

header.header .topNav { 
    height: 100px; position: absolute; top: 0; right: 0;  z-index: 991; display: flex; align-items: center; justify-content: center; background: #E41E25;
}
header.header .topNav .logoBox {
    width: 240px; height: 100px; display: flex; align-items: center; justify-content: center; background: #E41E25; color: #fff; flex-shrink: 1;
    padding-bottom: 5px;
}
header.header .topNav .searchBox, header.header .topNav .openBox { 
    width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background: #000; color: #fff;
}

header.header .topNav .searchBox { font-size: 26px;  border-right: 1px solid rgba(59, 59, 59, 0.7);   padding-bottom: 4px; padding-left: 1px; }


/* --------------- */
/* header - side menu content
/* --------------- */

header.header .navMainContent { position: relative; padding-top: 100px; height: 100%; overflow-y: scroll;  }

header.header .navMain_items {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    position: relative;
    padding-top: 95px; padding-bottom: 35px;
}
header.header .navMain_items li { position: relative; }
header.header .navMain_items li a img { width: 12px; height: 12px; color: #E41E25; }
header.header .navMain_items li a.btns {
    color: #595959;
    display: inline-block;
    padding-bottom: 5px;
    font-weight: 500;
    position: relative;
    padding-right: 12px;
    border-bottom: 2px solid #fff;
    margin-bottom: 40px;
}
header.header .navMain_items li a.btns:before {
    content: '\e804';
    position: absolute;
    right: -20px; top: 10px;
    font-size: 12px;
    color: #595959;
    width: auto; margin: 0;
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: never;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: 0.2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: 0.2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
header.header .navMain_items li a.btns:hover {
    color: #000; display: inline-block; transition: all .4s;
}

header.header .navMain_items li.active a.btns { color: #000; display: inline-block; transition: all .4s; }
header.header .navMain_items li.active a.btns::after { transition: all .4s; width: 100%; }
header.header .navMain_items li.active a.btns::before { color: #E41E25; }

header.header .navMain_items li a.btns::after {
    content: '';
    position: absolute; 
    background: #E41E25;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0;
    transition: all .4s;
}
header.header .navMain_items li a.btns:hover::after { transition: all .4s; width: 100%; }
header.header .navMain_items li a.btns:hover::before { color: #E41E25; }

header.header .navMain_logo_wrap, header.header .navMain_search_wrap, header.header .navMain_close_wrap { display: inline-block; }

header.header .navMain_bottom {
    padding: 40px 34px 30px 40px;
    color: #595959;
    border-top: solid 2px rgba(210, 210, 210, 0.4);
    text-align: left;
    position: relative;
    word-spacing: 1px;
}
header.header .navMain_bottom p {
    font-family: 'Mukta Vaani', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
}

header.header .navMain_bottom .left {
    display: inline-block;
    padding-right: 22px;
    position: relative;
}
header.header .navMain_bottom .left::after {
    content:"";
    position: absolute;
    z-index: 996;
    background: rgba(59, 59, 59, 0.5);
    width: .5px;
    height: 50%;
    right: 0;
    top: 25%; 
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

header.header .navMain_bottom .right {
    display: inline-block;
    padding-left: 18px;
}

/* .navContainer.active */
header.header .navContainer.active { height: 100vh; z-index: 9; transition: none; }
header.header .navContainer.active .bg { opacity: 1; }
header.header .navContainer.active .navWrap { height: 100vh; bottom: 0; }

@media screen and (max-width: 1299px) {
    header.header .navContainer .navWrap { width: 440px; }
    header.header .navMain_bottom .footerRow { display: block; }
    header.header .navMain_bottom .left {
        display: inline-block;
        padding-right: 22px;
        position: relative;
    }
    header.header .navMain_bottom .left::after {
        content:"";
        position: absolute;
        z-index: 996;
        background: rgba(59, 59, 59, 0.5);
        width: .5px;
        height: 50%;
        right: 0;
        top: 25%; 
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    header.header .headerTop .logoWrap img { width: 102px; height: 35px;  }
    header.header .headerTop .nav_logo_wrap { display: flex; justify-content: flex-start; }
    header.header .headerTop .search_wrap .iconBox i { font-size: 22px;  }
    header.header .headerTop .navIcon_wrap img { width: 19.6px; height: 19.6px;  }
}

@media screen and (max-width: 991px) {
    header.header .nav_logo_wrap { padding-left: 4%; }
    header.header .navContainer .main { width: 100%; padding: 0 0px; position: relative; z-index: 5; }
    header.header .navContainer .main .navRow { width: 100%; margin: 0; padding: 0; border-bottom: none; display: flex; flex-wrap: wrap; }
    header.header .navContainer .main .navRow:last-child { border-bottom: none; }
    header.header .navContainer .main .item { width: 100%; padding: 0; }
    header.header .navContainer .main .item:not(:last-child) { margin-right: 0px; }
    header.header .navContainer .main .item:first-child, header.header .navContainer .main .item:nth-child(2) { width: 100%; }
    header.header .navContainer .main .item:nth-child(3), header.header .navContainer .main .item:last-child { width: 100%; }
    header.header .navContainer .main .item.active .title { color: #fff; background: #D61518; }
    header.header .navContainer .main .item.active .title .rwdControlBtn::before, header.header .navContainer .main .item.active .title .rwdControlBtn::after { background: #fff; }
    header.header .navContainer .main .item.active .title .rwdControlBtn::after { transform: rotate(270deg) translate(6px, -6px); }
    header.header .navContainer .main .title { margin-bottom: 0px; padding-left: 42px; padding-right: 10px; line-height: 53px; color: #959595; border-bottom: solid 1px rgba(205, 205, 205, 0.3); background: #fff; display: flex; justify-content: space-between; align-items: center; transition: all 0.4s; }
    header.header .navContainer .main .title::before { display: none; }
    header.header .navContainer .main .title .text { display: block; }
    header.header .navContainer .main .title .rwdControlBtn { width: 53px; height: 53px; display: block; position: relative; }
    header.header .navContainer .main .title .rwdControlBtn::before, header.header .navContainer .main .title .rwdControlBtn::after { content: ''; background: #ccc; position: absolute; top: 50%; left: 50%; transform: translate(-6px, -6px); transition: all 0.4s; }
    header.header .navContainer .main .title .rwdControlBtn::before { width: 12px; height: 2px; margin: 5px 0; }
    header.header .navContainer .main .title .rwdControlBtn::after { width: 2px; height: 12px; margin: 0px 5px; }
    header.header .navContainer .main .content { background: #F8F8F8; transition: all 0.4s; overflow: hidden; }
    header.header .navContainer .main .content ul li { width: 100%; padding-left: 42px; padding-right: 28px; border-bottom: solid 1px rgba(205, 205, 205, 0.5); line-height: 53px; }
    header.header .navContainer .main .content ul li a { display: block; color: #242424; line-height: 53px; }
    header.header .navContainer .main .content ul li a:hover { font: 400 16px 'Noto Sans TC', sans-serif; line-height: 54px; color: #242424; }
}

@media screen and (max-width: 575px) {
    header.header .navMain_items { padding-top: 50px; padding-bottom: 40px; }
    header.header .navMain_items li { margin-left: -10px; }
    header.header .navMain_items li a.btns { margin-top: 10px; margin-bottom: 20px; }
    header.header.scrollDown .navContainer .navWrap { max-width: 440px; width: 100%; }
    header.header .topNav { max-width: 440px; width: 100%; }
    header.header .navMain_bottom { padding: 26px 20px; }
    header.header .headerTop .nav_logo_wrap { justify-content: center; padding-left: 15px; }
}
@media screen and (max-width: 458px) {
    header.header.scrollDown .headerTop { width: 100%; }
    header.header .navContainer .navWrap { width: 100%; background: #fff; display: block; }
    header.header .navContainer .navWrap .bgImg { display: none; }
    header.header .navContainer .navInner { width: 100%; height: calc(100% - 76px); overflow-y: scroll; }
    header.header .navContainer .navInner::-webkit-scrollbar { width: 0px; height: 0px; }
    header.header .navContainer .navInner .mCSB_inside > .mCSB_container { width: 100%; position: absolute; }
    header.header .navContainer .navWrapIcon img { width: 23px; height: 23px; }
    header.header .navMain_bottom p { margin-bottom: 0; }
    header.header .navMain_bottom .left { padding-right: 10px; }
    header.header .navMain_bottom .right { padding-left: 5px; }
}
@media screen and (max-width: 350px) {
    header.header .navMain_bottom .footerRow { display: flex; flex-direction: column; }
    header.header .navMain_bottom .left::after { display: none; }
    header.header .headerTop .nav_logo_wrap { padding-left: 15px; }
    header.header .navMain_bottom .right { padding-left: 0; }
}


/* --------------- */
/* header - product menu
/* --------------- */

header.header .navProductContainer { 
    width: 100%; height: 0;
    position: fixed;
    top: 0; right: 0;
    z-index: -1; overflow: hidden; transition: all 0.01s 0.4s;
    display: block;
}

header.header .navProductContainer .bg { 
    width: 100%; height: 100%;
    position: absolute; top: 0; left: 0; 
    background: rgba(0, 0, 0, 0.5); opacity: 0;
    transition: all 0.4s 0.1s; 
}

header.header .navProductContainer .menuContent { 
    width: 1213px; height: 100%; 
    background: #fff; 
    position: absolute; top: 0; right: -1500px; 
    transition: all 0.4s;
    display: block; 
}

header.header .navProductContainer .menuContent .bgImg { 
    width: 550px; 
    opacity: 0.5; 
    position: absolute; bottom: 0; right: -227.5px; 
    z-index: 1; 
}

header.header .navProductContainer .top { 
    width: 100%; height: 306px; 
    padding: 0;
    display: flex; justify-content: space-between; align-items: center; 
    position: relative; z-index: 5; top: 0; 
}

header.header .navProductContainer .top img { 
    object-fit: cover;
    height: 100%;
}

header.header .navProductContainer .top .logo { width: 150px; }
header.header .navProductContainer .top .closeIcon { 
    width: 50px; height: 50px; 
    font-size: 18px; line-height: 50px; text-align: right; 
    color: #242424; cursor: pointer; transition: all 0.4s; 
}

header.header .navProductContainer .top .closeIcon:hover { color: #D61518; }

header.header .navProductContainer .menuContent { 
    width: 100%; height: calc(100% - 97px);
}

header.header .navProductContainer .main { 
    width: 100%; height: 100%;
    padding: 0 30px; 
    position: relative; z-index: 5;
}


/* --------------- */
/* product menu - content
/* --------------- */

header.header .navProductContainer .main .item:first-child { width: 430px; }
header.header .navProductContainer .main .item:nth-child(2) { width: 772px; }
header.header .navProductContainer .main .navRow {
    width: 100%; 
    padding-top: 60px; 
    padding-bottom: 32px;
    display: flex;
    height: 100%; 
    border-bottom: none;
}

/* pill title */
header.header .navProductContainer .menuContent .nav { display: contents; flex-wrap: nowrap; }
header.header .navProductContainer .menuContent .tab-pane { height: 500px; }
header.header .navProductContainer .menuContent .pill_outer {
    position: relative;
    padding-left: 80px;
    text-align: left;
    height: 500px;
}
header.header .navProductContainer .menuContent .pill_outer::after { 
    content: "";
    position: absolute;
    z-index: 996;
    width: 1px; height: 95%;
    background: rgba(210, 210, 210, 0.5);
    right: 0px; top: 3%;
}
header.header .navProductContainer .menuContent .nav-pills .nav-link {
    color: #000;
    background-color: #fff;
    font-weight: 500;
    padding: 0; letter-spacing: .5px;
}
header.header .navProductContainer .menuContent .nav-pills .nav-link.active,
header.header .navProductContainer .menuContent .nav-pills .show > .nav-link {
    color: #E41E25;
    background-color: #fff;
}
header.header .navProductContainer .menuContent .nav-pills a {
    display: block;
    position: relative;
    font-family: 'Noto Sans TC';
    font-weight: 500;
    letter-spacing: .4px;
    margin-bottom: 0;
    line-height: 50px;
}
header.header .navProductContainer .menuContent .nav-pills a:hover {
    color: #E41E25;
    transition: all .4s;
}
header.header .navProductContainer .menuContent .nav-pills a img { 
    width: 14px; height: 12px;
    position: absolute;
    right: 60px;  top: 20px; 
    opacity: 0;
}
header.header .navProductContainer .menuContent .nav-pills a:hover img { 
    animation: goRightAni 1.5s linear 0s infinite normal; 
}

/* pill - content */
header.header .navProductContainer .menuContent .tab-content { 
    color: #6D6D6D;
    padding-left: 2.75rem;
}
header.header .navProductContainer .menuContent .tab-content a {
    display: inline-block;
    margin-bottom: 0;
    line-height: 50px;
    letter-spacing: .4px;
    font-family: 'Noto Sans TC';
    font-weight: 400;
    color: #6D6D6D; 
}
header.header .navProductContainer .menuContent .tab-content a:hover { 
    text-decoration: underline;
    color: #000;
}

/* navProduct active */
header.header .navProductContainer.active { height: 100vh;  z-index: 5; transition: none; width: 1213px; right: 440px; }
header.header .navProductContainer.active .bg { opacity: 1; }
header.header .navProductContainer.active .menuContent { right: 0px; height: 100%;}

header.header .nav_product_btn { display: block; width: 100%; }

@media screen and (max-width: 1652px) {
    header.header .navProductContainer { display: none; }
}

@media screen and (max-width: 991px) {
    header.header .navProductContainer .menuContent { width: 100%; background: #fff; right: -900px; display: block; }
    header.header .navProductContainer .menuContent .bgImg { display: none; }
    header.header .navProductContainer .top { width: 100%; height: 76px; padding: 0 28px; display: flex; position: sticky; top: 0; }
    header.header .navProductContainer .top .logo { width: 137px; }
    header.header .navProductContainer .top .closeIcon { font-size: 14px; color: #616161; }

    header.header .navProductContainer .menuContent { width: 100%; height: calc(100% - 76px); overflow-y: scroll; }
    header.header .navProductContainer .menuContent::-webkit-scrollbar { width: 0px; height: 0px; }
    header.header .navProductContainer .menuContent .mCSB_inside > .mCSB_container { width: 100%; position: absolute; }

    header.header .navProductContainer .main { width: 100%; padding: 0 0px; position: relative; z-index: 5; }
    header.header .navProductContainer .main .navRow { width: 100%; margin: 0; padding: 0; border-bottom: none; display: flex; flex-wrap: wrap; }
    header.header .navProductContainer .main .navRow:last-child { border-bottom: none; }
    header.header .navProductContainer .main .item { width: 100%; padding: 0; }
    header.header .navProductContainer .main .item:not(:last-child) { margin-right: 0px; }
    header.header .navProductContainer .main .item:first-child, header.header .navProductContainer .main .item:nth-child(2) { width: 100%; }
    header.header .navProductContainer .main .item:nth-child(3), header.header .navProductContainer .main .item:last-child { width: 100%; }
    header.header .navProductContainer .main .item.active .title { color: #fff; background: #D61518; }
    header.header .navProductContainer .main .item.active .title .rwdControlBtn::before, header.header .navProductContainer .main .item.active .title .rwdControlBtn::after { background: #fff; }
    header.header .navProductContainer .main .item.active .title .rwdControlBtn::after { transform: rotate(270deg) translate(6px, -6px); }
    header.header .navProductContainer .main .title { margin-bottom: 0px; padding-left: 42px; padding-right: 10px; line-height: 53px; color: #959595; border-bottom: solid 1px rgba(205, 205, 205, 0.3); background: #fff; display: flex; justify-content: space-between; align-items: center; transition: all 0.4s; }
    header.header .navProductContainer .main .title::before { display: none; }
    header.header .navProductContainer .main .title .text { display: block; }
    header.header .navProductContainer .main .title .rwdControlBtn { width: 53px; height: 53px; display: block; position: relative; }
    header.header .navProductContainer .main .title .rwdControlBtn::before, header.header .navProductContainer .main .title .rwdControlBtn::after { content: ''; background: #ccc; position: absolute; top: 50%; left: 50%; transform: translate(-6px, -6px); transition: all 0.4s; }
    header.header .navProductContainer .main .title .rwdControlBtn::before { width: 12px; height: 2px; margin: 5px 0; }
    header.header .navProductContainer .main .title .rwdControlBtn::after { width: 2px; height: 12px; margin: 0px 5px; }
    header.header .navProductContainer .main .content { background: #F8F8F8; transition: all 0.4s; overflow: hidden; }
    header.header .navProductContainer .main .content ul li { width: 100%; padding-left: 42px; padding-right: 28px; border-bottom: solid 1px rgba(205, 205, 205, 0.5); line-height: 53px; }
    header.header .navProductContainer .main .content ul li a { display: block; color: #242424; line-height: 53px; }
    header.header .navProductContainer .main .content ul li a:hover { font: 400 16px 'Noto Sans TC', sans-serif; line-height: 54px; color: #242424; }
    header.header .navProductContainer .bottom { padding-top: 50px; padding-bottom: 0px; background: #fff; position: relative; right: 0px; bottom: 0px; }
    header.header .navProductContainer .bottom .socialIcons { width: 145px; margin: 0 auto 13px; }
    header.header .navProductContainer .bottom .compInfo { margin-bottom: 68px; font: 400 14px 'Noto Sans TC', sans-serif; letter-spacing: 1px; line-height: 22px; color: #959595; text-align: center; display: block; }
    header.header .navProductContainer .bottom .compInfo p { margin-bottom: 0; }
}



/* --------------- */
/* select - dropDown
/* --------------- */

.custom-select1 {
    position: relative;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 16px;
    font-weight: bold; 
    letter-spacing: .5px;
    width: 100%; 
}
.custom-select1 select { display: none; }

.select-selected { background-color: #EFEFEF; }
.select-selected:after {
    position: absolute;
    content: url(images/public/arrow-down-red.svg);
    width: 11px; height: 7px; 
    top: 7px; 
    right: 1px;
    transition: transform .3s;
}
.select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    transform: translateY(-50%);
    transition: transform .3s;
}

.same-as-selected { color: #fff !important; }
.select-arrow-active { color: #000; }

.select-items div,.select-selected {
    padding-top: 8px;   padding-bottom: 12px;  
    border: 1px solid transparent;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    border-bottom: 1px solid #F3F3F3; 
    cursor: pointer;
}
.select-selected { border-bottom: 1px solid #000; }
.select-items div { color: #000; padding-left: 27px;  font-weight: normal; padding-top: 10px; padding-bottom: 15px; }
.select-items {
    position: absolute;
    background: #fff;
    border-bottom: 0; 
    color: #000; 
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.12); transition: all .3s; 
}

.select-hide { display: none; }
.select-items div:hover, .same-as-selected { color: #fff; background: #E41E25; transition: all .3s; }


/* --------------- */
/* .searchContainer
/* --------------- */

header.header .search_wrap { cursor: pointer; }
header.header .search_wrap:hover { transition: background .3s; }

header.header .searchContainer { 
    width: 100%; position: fixed; top: 0; left: 0; z-index: -1; transition: all 0.4s;
}
header.header .searchContainer .bg {
    width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.4s 0.4s;
}
header.header .searchContainer .nav { 
    width: 100%; max-width: 440px; height: 100vh; 
    background: #fff; 
    position: absolute; right: 0; top: -2000px;
    transition: all 0.4s; 
    text-align: center;
    z-index: 9; 
}

header.header .searchContainer .navMainContent { text-align: left; }
header.header .searchContainer .navMainContent .middle1Block { 
    display: flex; flex-direction: column; justify-content: space-around; align-items: center; 
    margin: auto; position: relative; 
    border-bottom: 1px solid rgba(210, 210, 210, 0.5); 
    padding: 52px 40px 60px;
}

header.header .searchContainer .navMainContent .middle1Block form { width: 100%; }
.bootstrap-select .dropdown-toggle .filter-option { letter-spacing: .5px; }
header.header .selectWrap { padding-bottom: 10px; }
header.header .searchContent .selectWrap:first-child { margin-bottom: 26px; }
header.header .bootstrap-select.type-1 .dropdown-toggle::after { right: 15px; }
header.header .searchContainer .navMainContent .titleWrap { width: 350px; display: flex; flex-direction: column; margin-bottom: 30px; align-self: flex-start; }
header.header .searchContainer .navMainContent .enTitle { margin-bottom: 0;}
header.header .searchContainer .navMainContent .zhTitle { margin-bottom: 20px; }
header.header .searchContainer .navMainContent .dropdownWrap { width: 100%; margin-bottom: 45px; }
header.header .searchContainer .navMainContent .custom-select1 { width: 350px; margin-bottom: 3.63%; margin-left: auto; margin-right: auto; }
header.header .searchContainer .navMainContent .select-selected { background-color: #fff; }
header.header .searchContainer .navMainContent .searchBtn { 
    width: 100%; max-width: 350px; margin-left: auto; margin-right: auto;
    height: 60px; text-align: center; 
    background: #E41E25; color: #fff; 
    transition: background .3s;
    display: flex; justify-content: center; align-items: center;
}
header.header .searchContainer .navMainContent .searchBtn:hover { background: rgba(228, 30, 37, 0.8); transition: background .3s; }
header.header .searchContainer .navMainContent .middle2Block { 
    width: 100%;
    display: flex; justify-content: center; align-items: center;
    padding: 58px 40px;
}

header.header .searchContainer .searchInputForm { width: 100%; max-width: 350px;  text-align: center; display: flex; align-items: flex-end; justify-content: space-between; }

header.header .searchContainer .searchInputBox {
    border: 0;
    border-radius: 0; 
    border-bottom: 1px solid #000; 
    color: #000; 
    padding-bottom: 10px; 
    width: 100%; max-width: 250px; 
    margin-bottom: 8px; margin-right: 10px;
    
}
header.header .searchContainer  .searchInputBox::placeholder { color: #000; font-size: 16px; font-weight: bold; font-family: 'Noto Sans TC', sans-serif; letter-spacing: 0.5px; }
header.header .searchContainer  .searchInputBox:-ms-input-placeholder { color: #000; font-size: 16px; font-weight: bold; font-family: 'Noto Sans TC', sans-serif; letter-spacing: 0.5px; }
header.header .searchContainer  .searchInputBox::-ms-input-placeholder { color: #000; font-size: 16px; font-weight: bold; font-family: 'Noto Sans TC', sans-serif; letter-spacing: 0.5px; }

header.header .searchContainer .navMainContent .middle2Block .circleBox { 
    width: 64px; height: 64px; background: #000; border-radius: 50%; display: flex; justify-content: center; align-items: center; 
    font-size: 20px; transition: all .3s; flex-shrink: 0;
}
header.header .searchContainer .navMainContent .middle2Block .circleBox:hover {
   background: rgba(0, 0, 0, 0.8); transition: all .3s;
}

header.header .searchContainer.active { height: 100vh; z-index: 9; transition: all 0.4s; }
header.header .searchContainer.active .bg { opacity: 1; pointer-events: auto; }
header.header .searchContainer.active .nav { top: 0;  height: 100vh; transition: all 0.4s; }

@media screen and (max-width: 575px) { 
    header.header .searchContainer .navMainContent .enTitle { font-size: 62px; line-height: 62px; white-space: normal;  }
    header.header .searchContainer .navMainContent .titleWrap { width: 100%; max-width: 330px; }
    header.header .searchContainer .navMainContent .custom-select1 { width: 100%; max-width: 330px; }
    header.header .searchContainer .navMainContent .searchBtn { width: 100%; max-width: 350px; }
    
    header.header .searchContainer .navMainContent .middle1Block { padding: 40px 30px; }
    header.header .searchContainer .navMainContent .middle2Block { padding: 40px 30px; }
    header.header .navMain_bottom { padding: 40px 30px; }
}


/* --------------- */
/* footer
/* --------------- */

footer { background: #fff; position: relative; z-index: 1; }
footer .container { padding-right: 0; padding-left: 0; }

.hoverRed {  color: inherit;  transition: all 0.4s; }
.hoverRed:hover { color: #E41E25; }

/* footer - adv */

footer .advContainer {
    text-align: center;
    background: #EFEFEF;
    position: relative;
}

footer .advContainer .advOuter {
    position: relative;
    text-align: center;
    padding-top: 1em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

footer .advContainer .advOuter h6 {
    font-weight: 600;
    margin: 20px 0 9px;
    color: #000;
}

footer .advContainer .advOuter p {
    color: #595959;
    width: 180px;
    text-align: center;
}

/*
footer .advContainer .adv_outer.adv1 img { width: 82px; height: 58px; }
footer .advContainer .adv_outer.adv2 img { width: 85px; height: 70px; }
footer .advContainer .adv_outer.adv3 img { width: 80px; height: 62px; }
*/
footer .advContainer .adv01::after, footer .advContainer .adv02::after {
    content: '';
    position: absolute;
    z-index: 2;
    width: 1px; height: 70%;
    background: rgba(210, 210, 210, .5);
    top: 15%; right: 0;
}

/* footer - row 1 */
footer .row_info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 4.75em;
    padding-bottom: 4.5em;
}
footer .row_info .item_logo {
    flex: 2;
    margin-top: -.25em;
    text-align: left;
}
footer .row_info .item_info { flex: 3; padding-left: 3em; }
footer .row_info .item_info_space { flex: 3; }
footer .row_info .item_Social { flex: 2; }
footer .row_navItem {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    border-top: 1px solid rgba(210, 210, 210, 0.5);
    border-bottom: 1px solid rgba(210, 210, 210, 0.5);
}
footer .info .row:last-child {
    border-bottom: none;
}

/* footer - row 1 inner */
footer .info_inner {
    display: inline-block;
    width: 294px;
    text-align: left; 
}
footer .row_info .item_info .info_inner .name p { 
    font-family: 'Noto Sans TC';
    font-weight: 600;
    margin-bottom: 1.5em;
}
footer .info_inner .add, footer .info_inner .tel, footer .info_inner .mail { 
    color: #000000; font-family: 'Mukta Vaani', sans-serif; font-weight: 500; 
    display: flex; margin-bottom: 5px;
}
footer .info_inner .add .title, footer .info_inner .tel .title, footer .info_inner .mail .title { 
    width: 70px;
    letter-spacing: .5px; font-family: 'Mukta Vaani'; font-weight: 500; 
    padding-top: 3px;
}
footer .info_inner .add .content, footer .info_inner .tel .content, footer .info_inner .mail .content { 
    position: relative; 
    padding-left: 15px;
    font-family: 'Noto Sans TC'; font-weight: 300; 
    color: rgba(59, 59, 59, .8);
    letter-spacing: .5px;
}
footer .info_inner .add .content::before, footer .info_inner .tel .content::before, footer .info_inner .mail .content::before { 
    content: ''; width: 1px; height: 10px; position: absolute; left: -8px; top: calc(50% + 1px); transform: translateY(-50%); 
    background: rgba(59, 59, 59, .5);
}

/* .socialIcons */
footer .social_wrap { text-align: right; }
footer .social_wrap p { 
    text-align: right; font-family: 'Mukta Vaani', sans-serif; font-weight: 500; 
    letter-spacing: .5px; line-height: 18px; margin-bottom: .5rem;
}
footer .social_wrap .socialIcons { display: flex; justify-content: flex-end; align-items: center; }
footer .social_wrap .iconItem { width: 55px; height: 55px; font-size: 18px; line-height: 55px; color: #fff; text-align: center; background: #161616; transition: all 0.4s; margin-left: 15px; }
footer .social_wrap .iconItem a { display: block; }
footer .social_wrap .iconItem:hover { border-color: #E41E25; background: #E41E25; color: #fff; }

/* footer - row 2 */
footer .footer_nav {
    padding: 50px 0;
    display: flex;
}
footer .footer_nav li {
    padding: 0 60px 0 0;
    position: relative;
    font-weight: 400;
    font-size: 18px;
}
footer .footer_nav li::after {
    content: ''; width: 1.5px; height: 12px; background: #000; position: absolute; right: 30px; top: calc(50% + 1px); transform: translateY(-50%); 
}
footer .footer_nav li:last-child::after {
    width: 0;
}
footer .goTop {
    display: inline-block;
    color: #fff; 
    transition: all 0.4s; 
    overflow: hidden;
    color: #000;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
}
footer .goTop:hover {
    color: #E41E25;
}
footer .goTop img {
    width: 35px;
    height: 30px;
    margin-bottom: 6px;
}
footer .goTop p {
    font-family: 'Mukta Vaani', sans-serif;
    font-weight: 700;
    margin-bottom: 0;
}

/* footer - row 3 */
footer .footer-copyright { 
    color: #595959;
    word-spacing: 3px;
    text-transform: uppercase;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    font-family: 'Noto Sans TC'; font-weight: 400;
    padding-bottom: 5px; 
}
footer .footer-copyright .left {
    -ms-flex: 0 0 65%;
    flex: 0 0 65%;
    max-width: 65%;
    text-align: left;
}
footer .footer-copyright .right {
    -ms-flex: 0 0 35%;
    flex: 0 0 35%;
    max-width: 35%;
    text-align: right;
}
footer .footer-copyright .right span { position: relative; margin-right: 32px; }
footer .footer-copyright .right span::after {
    content:"";
    position: absolute;
    z-index: 996;
    background: rgba(59, 59, 59, 0.5);
    width: .5px;
    height: 50%;
    right: -20px;
    top: 25%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

footer .footerMobile { display: none; }
.footer_nav_wrap { padding-left: 0; }

@media screen and (max-width: 1699px) { 
    footer .row_info .item_info_space { flex: 0; }
    footer .row_info, footer .footer-copyright { padding-left: 30px; padding-right: 30px; }
    footer .footer_nav { padding-left: 15px; }  
    .footer_nav_wrap { padding-left: 15px; }
}
@media screen and (max-width: 1200px) { 
    footer .row_info .item_logo {
        flex: none;
        width: 100%;
        margin-top: 0;
        text-align: center;
        margin-bottom: 2.75em;
    }
    footer .row_info .item_info { flex: 3; padding-left: 0; }
    footer .row_info .item_Social { flex: 2; }
    footer .footer-copyright { font-size: 13px; padding-bottom: 10px;  }
}
@media screen and (max-width: 991px) { 
    footer .row_info { padding-top: 3em; padding-bottom: 2em; }
    footer .row_info .item_logo { text-align: center; margin-bottom: 2.75em; }
    footer .row_info .item_info { margin-bottom: 2em; padding-left: 1.5em; padding-right: 1.5em; }
    footer .row_info .item_Social { flex: none; width: 100%; }
    footer .social_wrap { text-align: center; }
    footer .social_wrap .iconItem { margin-right: 15px; }
    footer .social_wrap .socialIcons { justify-content: center; }
    footer .social_wrap p { padding-right: 0; text-align: center; margin-bottom: .75em; }
    footer .footer_nav li { padding-right: 40px; }
    footer .footer_nav li::after { right: 20px; }
    footer .footer-copyright { font-family: 'Mukta Vaani', sans-serif; font-weight: 300; font-size: 15px; }
    footer .footer-copyright .left {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        text-align: center;
    }
    footer .footer-copyright .left p { margin-bottom: .75rem; }
    footer .footer-copyright .right {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        text-align: center;
    }
}


@media screen and (max-width: 767px) { 

    footer .advContainer .advOuter {
        padding-top: 36px; 
        padding-bottom: 36px; 
        position: relative;
    }
    footer .advContainer .adv01::after, footer .advContainer .adv02::after {
        content: '';
        position: absolute;
        z-index: 2;
        width: 80%; height: 1px;
        background: rgba(210, 210, 210, .5);
        top: 95%; left: 10%;
    }
    
    footer .row_info {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: center;
        padding-bottom: 1em;
    
    }

    footer .row_info .item_info { display: flex; justify-content: center; }    
    /* footer .row_info .item_info:nth-child(3) { margin-left: -14px; } */
    footer .row_info .item_info .info_inner .name p { margin-bottom: .6em; }
    footer .row_info .item_info .info_inner .add, footer .info_inner .tel, footer .info_inner .mail { margin-bottom: 3px; }
    footer .row_info .item_info .info_inner .add .content, footer .info_inner .tel .content, footer .info_inner .mail .content { padding-left: 15px; }
    footer .row_info .item_Social { display: none; }
    footer .row_info .item_info_space { display: none; }

    footer .footer_nav_wrap {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    footer .footer_nav {
        text-align: center;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 30px 0;
    }
    
    footer .footer_nav li {
        -ms-flex: 0 0 33.333%;
        flex: 0 0 33.333%;
        max-width: 33.333%;
        padding-right: 0;
        padding-left: 10px;
        padding-right: 10px;
        margin-bottom: 10px; 
        font-weight: 500;
    }
    footer .footer_nav li:nth-child(3)::after { width: 0; display: none; }
    footer .footer_nav li:last-child::after { width: 1px; }
    footer .footer_nav li::after { width: 1px; right: 0px; background: #D2D2D2; }
    
    footer .footer-pc-goTop { display: none; }
   
    footer .footerMobile {
        display: block;
        padding-top: 1.5em;
        padding-bottom: .5em;
        padding-left: 30px; 
        padding-right: 30px;
    }
    footer .footerMobile .right { 
        display: flex; justify-content: flex-end; 
    }
    footer .footerMobile .inner_row { 
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-end;
        
    }
    footer .footerMobile .inner_row .left { 
        -ms-flex: 0 0 66.666%;
        flex: 0 0 66.666%;
        max-width: 66.666%;
        padding-left: 10%;
    }
    footer .footerMobile .inner_row .right { 
        -ms-flex: 0 0 33.333%;
        flex: 0 0 33.333%;
        max-width: 33.333%;
        display: flex;
        justify-content: flex-end;
        padding-right: 12%;
    }
    
    footer .footerMobile .social_wrap .socialIcons { padding-left: 0px; }
    footer .footerMobile .social_wrap p {
        text-align: left;
        margin-bottom: 8px;
        font-family: 'Mukta Vaani', sans-serif; font-weight: 500; font-size: 16px;
    }
  
    footer .footerMobile .goTop {
        text-align: center;
        margin-right: 0;
        margin-bottom: -.25em;
    }
    footer .footerMobile .goTop img {
        max-width: 30px;
        margin-bottom: 8px;
    }
    footer .footerMobile .goTop p {
        margin-bottom: 0;
        line-height: 17px;
        font-size: 17px;
        font-family: 'Mukta Vaani', sans-serif;
        font-weight: 700;
        letter-spacing: .2px;
    }
   
    /* pc + m */
    footer .social_wrap .socialIcons { justify-content: flex-start; }
    footer .social_wrap .iconItem { 
        margin-left: 0;
        width: 40px; height: 40px; line-height: 40px; 
        color: #fff; text-align: center; background: #161616; transition: all 0.4s;
    }
    footer .footer-copyright { /* padding-left: 10%; */ padding-left: 30px; padding-right: 30px;  font-size: 14px; }
    footer .footer-copyright .left, footer .footer-copyright .right { text-align: left; }

}

@media screen and (max-width: 575px) { 
    footer .row_info .item_info:nth-child(3) { margin-left: 0; }
    footer .advContainer .advOuter { padding-top: 18px; padding-bottom: 26px; }
    footer .advContainer .advOuter .imgBox { max-width: 60px; }
    footer .advContainer .advOuter h6 { margin: 10px 0 6px; }
    footer .row_info { padding: 0; padding-top: 39px; }
    footer .row_info .item_logo { margin-bottom: 38px; }
    footer .row_info .item_logo img { max-width: 140px; }
    footer .row_info .item_info { width: 100%; margin-bottom: 38px; padding-left: 10px; padding-right: 10px; }
    footer .row_info .item_info .info_inner .name p { font-size: 16px;  margin-bottom: 5px; }
    footer .row_info .item_info .info_inner .add, footer .info_inner .tel, footer .info_inner .mail { font-size: 16px; margin-bottom: 0; }
    footer .footer_nav { padding: 27px 0; /* border-top: 1px solid rgba(210, 210, 210, 0.5); border-bottom: 1px solid rgba(210, 210, 210, 0.5); */ }
    footer .footer_nav li { font-size: 16px; }
    footer .footerMobile { padding-top: 33px; }
    footer .footerMobile .inner_row .left { padding-left: 7.5%; }
    footer .footerMobile .inner_row .right { /* padding-right: 9%; */ padding-right: 5px; }
    footer .footerMobile .goTop img { margin-bottom: 6px; }
    footer .footer-copyright { /* padding-left: 7.5%; */ padding-left: 30px; padding-right: 30px; word-spacing: 2px; }
}


/* --------------- */
/* .goTopBtn
/* --------------- */

.goTopFloat {
    position: fixed;
    right: -300px; bottom: 50px;
    width: 70px; height: 70px;
    line-height: 70px; border-radius: 70px;
    display: flex; justify-content: center; align-items: center;
    color: #fff; 
    background: #000; z-index: 900; transition: all 0.4s; 
    cursor: pointer;
    transition: all .5s;
}
.goTopFloat.active {
    right: 30px;
    transition: all .5s;
}
.goTopFloat img {
    width: 18px;
    height: 16px;
}
.goTopFloat:hover {
    background: #E41E25;
}


/* --------------- */
/* index - banner
/* --------------- */

#index .pageHeader { display: none; }
#index .bannerwrap { position: relative; }

#index .index-banner-section { position: relative; }
#index .index-banner-section .swiper-btnOuter { position: absolute; left: 7%; bottom: 11%; display: flex; align-items: center; }
#index .index-banner-section .swiper-container { height: 100vh; }
#index .index-banner-section .swiper-container.text .swiper-slide .text-inner {
    transition: none; position: absolute; z-index: 20; left: 7%; bottom: 18%; padding-right: 10px; 
}
#index .index-banner-section .swiper-container.text .swiper-slide .text-inner .content {
    position: relative;  display: block; 
    font-family: 'Noto Sans TC', sans-serif; font-size: 64px; font-weight: 700; line-height: 80px; letter-spacing: 3px; color: #fff; 
    height: auto; 
    transform: translateY(-20px); opacity: 0; transition: none; 
}
#index .index-banner-section .swiper-container.text .swiper-slide.swiper-slide-active .text-inner .content { transform: none; opacity: 1;   transition-property: opacity,visibility,transform,-webkit-transform; transition-duration: .5s; transition-timing-function: ease-out; transition-delay: .5s;   } 
#index .index-banner-section .swiper-container.text .swiper-slide.swiper-slide-active { pointer-events: none; }
#index .index-banner-section .swiper-container.text .swiper-slide.swiper-slide-active .text-inner { transition: none; opacity: 1; }

/* bn number */
#index .index-banner-section .swiper-container.text .swiper-pagination { 
    position: relative; z-index: 20; width: auto;  display: flex; flex-direction: row;
    font-family: 'Montserrat'; font-weight: 700; font-size: 20px; left: -10px; flex-wrap: wrap;
}
#index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet {  
    display: block; border-radius: 0; 
    width: auto; margin: 6px 8px; background: none; padding: 0; 
    font-size: 20px; font-family: 'Montserrat', sans-serif; font-weight: 700; line-height: 20px; color: rgba(255, 255, 255, 1); 
    transition: all 0.4s; padding: 0; 
    display: flex; align-items: center; transition: all 0.4s; 
}
#index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet:hover { color: #fff; }
#index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet::after {
    opacity: 1; top: auto; right: auto; display: block; position: relative;
    content: ''; height: 2px; width: 0px; margin-left: 0px; margin-bottom: 0; background: #fff; transition: all 0.4s; 
}
#index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { color: #fff; }
#index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after { width: 70px; margin-left: 20px; }

#index .index-banner-section .swiper-buttons { position: relative; display: flex; margin-left: 30px; margin-bottom: 2px; }
#index .index-banner-section .swiper-button-prev-unique, #index .index-banner-section .swiper-button-next-unique { 
    display: flex; align-items: center; justify-content: center; z-index: 20; position: relative; 
}
#index .index-banner-section .swiper-button-prev-unique { width: 20px; height: 20px; }
#index .index-banner-section .swiper-button-prev-unique i {  transition: all .4s; -webkit-transition: all .4s; }
#index .index-banner-section .swiper-button-prev-unique:hover i { transform: translateX(-5px); transition: all .4s; -webkit-transition: all .4s; }
#index .index-banner-section .swiper-button-next-unique { left: 20px; width: 20px; height: 20px; }
#index .index-banner-section .swiper-button-next-unique i { transition: all .4s; -webkit-transition: all .4s; }
#index .index-banner-section .swiper-button-next-unique:hover i { transform: translateX(5px); transition: all .4s; -webkit-transition: all .4s; }

#index .bannerTextContainer .slick-dotted.slick-slider { margin-bottom: 0; }
#index .bannerTextContainer .dotSlick .slick-dots { position: absolute; left: 126px; bottom: 106px; z-index: 20; width: auto; }
#index .bannerTextContainer .dotSlick .slick-dots li { width: auto; margin: 0 18px; }
#index .bannerTextContainer .dotSlick .slick-dots li button { 
    width: auto; padding: 0; font-size: 20px; font-weight: 700; 
    font-family: 'Montserrat', sans-serif; font-weight: 700; 
    line-height: 20px; color: #A5A6A8;
    display: flex; align-items: center; transition: all 0.4s; 
}
#index .bannerTextContainer .dotSlick .slick-dots li button:hover, #index .bannerTextContainer .dotSlick .slick-dots li:hover button::before { color: #fff; }
#index .bannerTextContainer .dotSlick .slick-dots li button::before { 
    font-size: 20px; font-weight: 700; font-family: 'Montserrat', sans-serif; font-weight: 700; line-height: 20px; 
    color: #A5A6A8;  position: absolute; left: -18px; top: 0px; 
    content: '0'; display: block; opacity: 1; transition: all 0.4s; 
}
#index .bannerTextContainer .dotSlick .slick-dots li:nth-child(n + 10) button::before { content: none; }
#index .bannerTextContainer .dotSlick .slick-dots li button::after { content: ''; height: 2px; width: 0px; margin-left: 0px; margin-bottom: 3px; background: #fff; transition: all 0.4s; }
#index .bannerTextContainer .dotSlick .slick-dots li.slick-active button, #index .bannerTextContainer .dotSlick .slick-dots li.slick-active button::before { color: #fff; }
#index .bannerTextContainer .dotSlick .slick-dots li.slick-active button::after { width: 70px; margin-left: 20px; }



/* --------------- */
/* index - common
/* --------------- */

#index .net { z-index: 1;  }
#index .net::before { 
    content: ""; position: absolute; top: 0; bottom: 0;
    display: block; pointer-events: none; z-index: 1; 
    border-left: 2px solid rgba(210, 210, 210, 0.3); border-right: 2px solid rgba(210, 210, 210, 0.3); 
    left: calc((53.6% + 2px)); width: calc((23.2% - 0px)); max-width: calc((23.2% + 5px)); 
}


/* --------------- */
/* index - news
/* --------------- */

#index .news-section { position: relative; }
#index .news-section .news-container { color: #fff; position: relative; }
#index .news-section .moreBtn { position: absolute; right: 10%; top: 84px; text-transform: uppercase; font-size: 16px; font-family: 'Mukta Vaani', sans-serif; font-weight: 700; display: block; }
#index .news-section .moreBtn i { color: #fff; font-size: 10px; margin-left: 10px;  position: absolute; top: -2px;  }
#index .news-section .newsCol1 .moreBtn { right: 116px; top: 87px; }
#index .news-section .newsCol2 .moreBtn, #index .news-section .newsCol3 .moreBtn { right: 90px; top: 70px; }
#index .news-section .newsCol1 .moreBtn:hover i, #index .news-section .newsCol2 .item:hover .moreBtn i, #index .news-section .newsCol3 a:hover .moreBtn i   { animation: move-arrow2 2s infinite; }

#index .news-section .news-container .news-row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#index .news-section .news-container .news-row .img-inner { height: 440px; }
#index .news-section .news-container .news-row a img{ transition: all .3s; }
#index .news-section .news-container .news-row a:hover img { transform: scale(1.03); transition: all .3s; }
#index .news-section .news-container .news-row .newsCol1, #index .news-section .news-container .news-row .newsCol2, #index .news-section .news-container .news-row .newsCol3 { position: relative; min-height: 1px; width: 100%; }
#index .news-section .news-container .news-row .newsCol1 { 
    -ms-flex: 0 1 calc(100% - 880px); flex: 0 1 calc(100% - 880px); max-width: calc(100% - 880px);
    max-height: 440px; overflow: hidden;
    padding-right: 5%; padding-bottom: 40px; padding-left: 5%;
    background: #E41E25; position: relative; 
}
#index .news-section .news-container .news-row .newsCol2, #index .news-section .news-container .news-row .newsCol3 { 
    -ms-flex: 0 0 440px; flex: 0 0 440px; max-width: 440px; 
    position: relative; 
}
#index .news-section .news-container .news-row .newsCol1 .title {
    font-family: 'Mukta Vaani', sans-serif;
    font-weight: 800; 
    font-size: 85px;
    line-height: 85px;
    margin-bottom: 45px;
    padding-top: 75px;
    z-index: 3;
}
#index .news-section .news-container .news-row .newsCol1 .title .text-fill { color: #E41E25; text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; z-index: 2; }
#index .news-section .news-container .news-row .newsCol1 .subtitle { font-size: 22px; font-weight: 700; font-family: 'Noto Sans TC', sans-serif;line-height: 40px; margin-bottom: 7px; letter-spacing: .2px; }
#index .news-section .news-container .news-row .newsCol1 .content { font-size: 16px; font-weight: 400; font-family: 'Noto Sans TC', sans-serif; margin-bottom: 30px; line-height: 30px; letter-spacing: .2px;　width: 100%;  max-width: 590px;  }
#index .news-section .news-container .news-row .newsCol1 .date { font-size: 16px; font-weight: 400; font-family: 'Mukta Vaani', sans-serif;display: block; word-spacing: 3px;  margin-bottom: 20px;   } 

#index .news-section .sliderControl { position: absolute; right: 110px;  bottom: 85px; }
#index .news-section .sliderControl .prevBtn { width: 18px; height: 18px; position: absolute; right: 42px; }
#index .news-section .sliderControl .prevBtn .icon { position: absolute; transition: all .3s; }
#index .news-section .sliderControl .prevBtn i { font-size: 16px; } 
#index .news-section .sliderControl .prevBtn .icon::before { transition: all .3s; }
#index .news-section .sliderControl .prevBtn:hover .icon::before { transform: translateX(-5px); transition: all .3s; }
#index .news-section .sliderControl .nextBtn { width: 18px; height: 18px;  }
#index .news-section .sliderControl .nextBtn i { font-size: 16px; }
#index .news-section .sliderControl .nextBtn .icon {  position: absolute; right: 0px; transition: all .3s;  }
#index .news-section .sliderControl .nextBtn .icon::before {  transition: all .3s;  }
#index .news-section .sliderControl .nextBtn:hover .icon::before { transform: translateX(5px); transition: all .3s; }

#index .news-section .news-container .news-row .newsCol2::after {
    content: ''; position: absolute; z-index: 3; background: #E41E25;
    width: 30px; height: 30px; transform: rotate(45deg);
    top: 50%;  left: -15px;
}
#index .news-section .news-container .news-row .newsCol2 .item { position: relative; }
#index .news-section .news-container .news-row .newsCol2 span, #index .news-section .news-container .news-row .newsCol3 span {
    color: #fff; position: absolute; z-index: 3; text-transform: uppercase;
    font-size: 16px; font-family: 'Mukta Vaani', sans-serif; font-weight: 700;
}
#index .news-section .news-container .news-row .newsCol3 span.txt { right: 70px; bottom: 70px; text-align: right; letter-spacing: .25px; }
#index .news-section img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; }


/* --------------- */
/* index - about
/* --------------- */

#index .about-section { position: relative; }
#index .about-section .counterContainer { padding-top: 60px; position: relative; }

#index .about-section .mainTitle { 
    color: #E41E25; font-family: 'Mukta Vaani', sans-serif; font-weight: 800; font-size: 85px; 
    margin-bottom: 60px; padding-top: 50px; z-index: 3;
}
#index .about-section .mainTitle .text-fill, #index .product-section .title .text-fill { 
    color: #fff; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; z-index: 2; 
}
#index .about-section .countContent { 
    color: #000; font-family: 'Noto Sans TC', sans-serif; font-weight: 900; line-height: 44px; z-index: 2; 
}

#index .about-section .counterContainer .counter-row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-bottom: 42px; }
#index .about-section .counterContainer .counterCol1, #index .about-section .counterContainer .counterCol2, #index .about-section .counterContainer .counterCol3 { position: relative; min-height: 1px; width: 100%; }
#index .about-section .counterContainer .counterCol1 { -ms-flex: 0 0 53.6%; flex: 0 0 53.6%; max-width: 53.6%; padding-left: calc(5% + 40px); }
#index .about-section .counterContainer .counterCol2, #index .about-section .counterContainer .counterCol3 { -ms-flex: 0 0 23.2%; flex: 0 0 23.2%; max-width: 23.2%; }

#index .about-section .counterContainer .item { 
    background: #fff; position: relative; 
    padding-top: 60px; padding-left: 30px; margin-bottom: 36px; 
}
#index .about-section .counterContainer .item p { margin-bottom: 2px; }
#index .about-section .counterContainer .red-dec { position: relative; z-index: 3; display: block; }
#index .about-section .counterContainer .red-dec::after { content: ""; display: block; width: 15px; height: 15px; background: #E41E25; position: absolute; top: -30px; left: -42px; z-index: 2; }

#index .about-section .counterContainer .item .counter { 
    font-family: 'Montserrat', sans-serif; font-weight: 700; color: #000; font-size: 70px; line-height: 80px; z-index: 3; padding-top: 30px; }
#index .about-section .counterContainer .item .text { color: #000; font: 700 20px 'Noto Sans TC', sans-serif; z-index: 3; }
#index .about-section .counterContainer .item .red-plus { 
    font-family: 'Montserrat', sans-serif; font-weight: 900; color: #E41E25; font-size: 50px; z-index: 3; vertical-align: super; padding-left: 5px;
}

#index .about-section .counterContainer .counterCol3 .item { padding-left: 35px; }
#index .about-section .counterContainer .counterCol3 .red-dec::after { left: -49px; }

/* about - bottom */
#index .about-section .bottomRow { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; color: #fff; justify-content: center; align-items: center; position: relative; }
#index .about-section .bottomRow .left { -ms-flex: 0 0 58%; flex: 0 0 58%; max-width: 58%; overflow: hidden; }
#index .about-section .bottomRow .right { -ms-flex: 0 0 42%; flex: 0 0 42%; max-width: 42%; }
#index .about-section .bottomRow .right .wrap { 
    background: #E41E25; z-index: 2; position: relative;
    width: 120%; margin-left: -78px; margin-top: 0px; 
    padding: 102px 27% 112px 130px; 
}
#index .about-section .bottomRow .right .title { font-family: 'Noto Sans TC', sans-serif; font-weight: 700; font-size: 22px; color: #fff; margin-bottom: 28px; }
#index .about-section .bottomRow .right .content { font-family: 'Noto Sans TC', sans-serif; font-weight: 400; font-size: 16px; color: #fff; line-height: 40px;margin-bottom: 80px; text-align: justify; }


/* --------------- */
/* index - product
/* --------------- */

#index .product-section { position: relative; }
#index .product-section .product-container { padding-top: 62px; position: relative; padding-bottom: 120px; }
#index .product-section .pl { padding-left: calc(5% + 40px); } 

#index .product-section .moreBtn { color: #000; text-transform: uppercase;  font-family: 'Mukta Vaani', sans-serif; font-weight: 700; font-size: 16px; display: block; } 
#index .product-section .moreBtn span { border: 5px solid #000;  width: 50px; height: 50px; display: inline-block; text-align: center; vertical-align: middle; margin-left: 52px; line-height: 40px; font-size: 11px; } 
#index .product-section .moreBtn:hover span { border-color: #E41E25; transition: all .4s; } 

#index .product-section .product-row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items: flex-end; }
#index .product-section .productCol1, #index .product-section .productCol2 { position: relative; min-height: 1px; width: 100%; }
#index .product-section .productCol1 { -ms-flex: 0 0 53.6%; flex: 0 0 53.6%; max-width: 53.6%; padding-left: calc(5% + 40px); }
#index .product-section .productCol2 { -ms-flex: 0 0 46.4%; flex: 0 0 46.4%; max-width: 46.4%; }
#index .product-section .productCol1 h3 { font-family: 'Noto Sans TC', sans-serif; font-weight: 700; font-size: 28px; line-height: 34px; margin-bottom: 24px; }
#index .product-section .productCol1 h3 span { font-family: 'Mukta Vaani', sans-serif; font-weight: 400; font-size: 20px; text-transform: uppercase; }

/* slider wrap */
#index .product-section .MainSlickWrap { position: relative; margin-left: -160px; margin-top: -200px; height: 100%; margin-bottom: -50px; }
#index .product-section .MainSlickWrap .item { padding-left: 10px; position: relative; display: flex; padding-left: 150px; padding-right: 150px; align-items: flex-end; height: 100%; }
#index .product-section .MainSlickWrap .item img {bottom: 0; right: 0;  }
#index .product-section .productCol1 .subSlickWrap { padding-top: 122px; padding-bottom: 70px;  padding-right: 54px; }  
#index .product-section .productCol1 .textSlickWrap { padding-left: 42px; padding-top: 60px; margin-right: -5px; }  
#index .product-section .productCol1 .textSlickWrap .name { font-size: 28px; font-weight: 700; font-family: 'Noto Sans TC', sans-serif; }  
#index .product-section .productCol1 .textSlickWrap .name span { font-size: 20px; font-family: 'Mukta Vaani', sans-serif; }  
#index .product-section .productCol1 .textSlickWrap .content { 
    font-family: 'Noto Sans TC', sans-serif; font-weight: 400; font-size: 16px; line-height: 36px; text-align:justify; color: #595959; margin-bottom: 70px;
}

#index .product-section .title { color: #E41E25; font-family: 'Mukta Vaani', sans-serif; font-weight: 800; margin-bottom: 6px; padding-top: 50px; z-index: 3; }
#index .product-section .productContent { font-family: 'Noto Sans TC', sans-serif; font-weight: 700; font-size: 22px; line-height: 42px; padding-left: 1px; }

#index .product-section .imgBox { width: 100%; height: 100%; overflow: hidden; display: block; }
#index .product-section .imgBox img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }

#index .product-section .slick-dotted.slick-slider { margin-bottom: 0; }
#index .product-section .indexProductMainSlick { position: relative; text-align: right; z-index: 10; }
#index .product-section .indexProductMainSlick img { max-width: 422px; pointer-events: none; }
#index .product-section .indexProductMainSlick .imgBox img { max-height: 720px; object-fit: contain; }
#index .product-section .indexProductSubSlick .slick-dots li button { font-size: 0; } 
#index .product-section .indexProductSubSlick .imgBox img { max-width: 463px; max-height: 220px; object-fit: contain; } 

#index .product-section .productInnerRow { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; align-items: flex-end; } 
#index .product-section .productInnerRow .col7, #index .product-section .productInnerRow .col5 { position: relative; width: 100%; min-height: 1px; } 
#index .product-section .productInnerRow .col7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%; } 
#index .product-section .productInnerRow .col5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%; } 

#index .product-section .indexProductMainSlick .slickControl {  }
#index .product-section .indexProductMainSlick .slickControl .prev, #index .product-section .indexProductMainSlick .slickControl .next { 
    display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 20; position: absolute; width: 18px; height: 12px;
}
#index .product-section .indexProductMainSlick .slickControl .prev .icon, #index .product-section .indexProductMainSlick .slickControl .next .icon { 
    position: relative; transition: all 0.4s; transform: rotate(90deg); 
}
#index .product-section .indexProductMainSlick .slickControl .prev:hover .icon, #index .product-section .indexProductMainSlick .slickControl .next:hover .icon { opacity: 1; }
#index .product-section .indexProductMainSlick .slickControl .prev .icon::after, #index .product-section .indexProductMainSlick .slickControl .next .icon::after { 
    content: ''; border-top: 4px solid #000; position: absolute; top: 5px;  width: 12px; height: 12px; 
}
#index .product-section .indexProductMainSlick .slickControl .prev .icon { top: 0; }
#index .product-section .indexProductMainSlick .slickControl .prev .icon::after { border-left: 4px solid #000; transform: rotate(-45deg); top: 5px; }
#index .product-section .indexProductMainSlick .slickControl .prev:hover .icon::after { border-top: 4px solid #E41E25; border-left: 4px solid #E41E25; }
#index .product-section .indexProductMainSlick .slickControl .next { top: 53%; }
#index .product-section .indexProductMainSlick .slickControl .next .icon::after { border-right: 4px solid #000; transform: rotate(45deg); bottom: 5px; }
#index .product-section .indexProductMainSlick .slickControl .next:hover .icon::after { border-top: 4px solid #E41E25;  border-right: 4px solid #E41E25; }

#index .product-section .dotslick { position: relative; height: inherit; }
#index .product-section .slick-dots { 
    bottom: 0; position: absolute; z-index: 20; height: inherit; width: auto; display: flex; flex-direction: column; pointer-events: none; 
}
#index .product-section .slick-dots li { pointer-events: auto; height: auto; margin: 20px 0; }
#index .product-section .slick-dots li button { 
    height: auto; padding: 0; font-size: 20px; font-family: 'Montserrat', sans-serif; font-weight: 700; color: #D2D2D2;
    display: flex; flex-direction: column; align-items: center; justify-content: center; transition: all 0.4s; 
}
#index .product-section .slick-dots li:hover button, #index .product-section .slick-dots li:hover button::before { color: #000; }
#index .product-section .slick-dots li button::before { 
    font-size: 20px; font-family: 'Montserrat', sans-serif; font-weight: 700; line-height: 20px; 
    color: #D2D2D2; position: absolute; left: -9px; top: 0px; 
    content: '0'; display: block; opacity: 1; transition: all 0.4s; 
}
#index .product-section .slick-dots li:nth-child(n + 10) button::before { content: none; }
#index .product-section .slick-dots li button::after { content: ''; height: 0px; width: 2px; margin-top: 0px; margin-right: 12px; background: #000; transition: all 0.4s; }
#index .product-section .slick-dots li.slick-active button, #index .product-section .slick-dots li.slick-active button::before { color: #000; }
#index .product-section .slick-dots li.slick-active button::after { height: 70px; margin-top: 30px; }

#index .product-section .number { 
    font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 172px;  color: #E41E25; z-index: 1; 
    position: absolute; right: 160px; bottom: -15px; pointer-events: none; 
}
#index .product-section .slickControl .prev, #index .product-section .slickControl .next { right: 10%; }
#index .product-section .slickControl .prev { top: 17%; }



/* --------------- */
/* index - project
/* --------------- */

#index .project-section { position: relative; }
#index .project-section .project-container { background: url(images/index/project-bg.jpg); background-size: cover; padding-top: 139px; padding-bottom: 180px; }
#index .project-section .title { margin-bottom: 58px; line-height: 78px; }
#index .project-section .projectContent  { font-weight: 900;  }

#index .project-section .pl { padding-left: 0; }
#index .project-section .d-991-pc.pl { padding-top: 95px; }
#index .project-section .moreBtn { text-transform: uppercase;  font-family: 'Mukta Vaani', sans-serif; font-weight: 700; font-size: 16px; color: #fff; }
#index .project-section .moreBtn span { border: 5px solid #fff;  width: 50px; height: 50px; display: inline-block; text-align: center; vertical-align: middle; margin-left: 52px; line-height: 40px;  font-size: 11px; }
#index .project-section .moreBtn:hover span { border-color: #E41E25; transition: all .4s; }

#index .project-section .project-row { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; justify-content: space-between; }
#index .project-section .left, #index .project-section .right { position: relative; width: 100%; min-height: 1px; }
#index .project-section .left { -ms-flex: 0 0 44.27%; flex: 0 0 44.27%; max-width: 44.27%; }
#index .project-section .left .pl { }
#index .project-section .left .content { background: #E41E25; color: #fff; padding-top: 90px; padding-bottom: 100px; margin-right: 24px; margin-left: -290px; padding-left: 285px; }
#index .project-section .right { -ms-flex: 0 0 55.73%; flex: 0 0 55.73%; max-width: 55.73%; position: relative; text-align: center; padding-top: 40px; padding-left: 125px; }
#index .project-section .right { -ms-flex: 0 0 55.73%; flex: 0 0 55.73%; max-width: 55.73%; position: relative; text-align: center; padding-top: 40px; padding-left: 125px; }

#index .project-section .indexProjectSlick { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; position: relative; }
#index .project-section .indexProjectSlick .item { position: relative; width: 100%; min-height: 1px;  -ms-flex: 0 0 33%; flex: 0 0 33%; max-width: 33%; display: flex; justify-content: center; align-items: center; }
#index .project-section .indexProjectSlick .item .img-inner { width: 183px; height: 210px;  display: flex; justify-content: center; align-items: center; }

/* arrow */
#index .project-section .indexProjectSlick .slickControl { color: #fff; margin: 0 auto; }
#index .project-section .indexProjectSlick .slickControl .prev, #index .project-section .indexProjectSlick  .slickControl .next { 
    display: flex; align-items: center; justify-content: center; position: absolute; z-index: 20; 
    height: 44px; top: 43.5%; transform: translateY(-50%); 
}
#index .project-section .indexProjectSlick  .slickControl .prev:hover .icon, #index .project-section .indexProjectSlick  .slickControl .next:hover .icon { opacity: 1; }
#index .project-section .indexProjectSlick  .slickControl .prev .icon, #index .project-section .indexProjectSlick  .slickControl .next .icon {  position: relative; transition: all 0.4s; }
#index .project-section .indexProjectSlick  .slickControl .prev .icon::after, #index .project-section .indexProjectSlick  .slickControl .next .icon::after { 
    content: ''; border-top: 4px solid #fff; 
    position: absolute; top: 5px; width: 12px; height: 12px;
}
#index .project-section .indexProjectSlick .slickControl .prev { left: 22%;  }
#index .project-section .indexProjectSlick .slickControl .prev .icon { left: 0; }
#index .project-section .indexProjectSlick .slickControl .prev .icon::after { border-left: 4px solid #fff; transform: rotate(-45deg); left: 5px; }
#index .project-section .indexProjectSlick .slickControl .next { left: 78%; }
#index .project-section .indexProjectSlick .slickControl .next .icon { right: 0; }
#index .project-section .indexProjectSlick .slickControl .next .icon::after { border-right: 4px solid #fff; transform: rotate(45deg); right: 5px; }


/* --------------- 
/* index - rwd
/* --------------- */

@media screen and (max-width: 1699px) { 
    
    #index .index-banner-section .swiper-container.text .swiper-slide .text-inner .content { font-size: 56px; line-height: 72px; letter-spacing: 2px; }
    
    #index .news-section .news-container .news-row .newsCol1 .title { margin-bottom: 30px; }
    #index .news-section .news-container .news-row .newsCol1 { padding-left: 60px; padding-right: 4%; }
    #index .news-section .newsCol1 .moreBtn { right: 100px; }
    #index .news-section .sliderControl { right: 80px; }
    #index .news-section .news-container .news-row .newsCol1 .content { max-width: 570px; padding-right: 10px; }
    
    #index .about-section .counterContainer .counterCol1 { padding-left: 60px; }
    #index .about-section .bottomRow .right .wrap { padding: 80px 27% 60px 65px; }
    
    #index .product-section .MainSlickWrap { margin-top: -180px; margin-left: 0; }
    #index .product-section .number { right: 60px; }
    #index .product-section .MainSlickWrap .item { padding-left: 0; padding-right: 70px; }
    #index .product-section .productCol1 .textSlickWrap { margin-right: 0px; } 
    #index .product-section .indexProductMainSlick .slickControl .prev, #index .product-section .indexProductMainSlick .slickControl .next { right: -60px; }
    #index .product-section .pl { padding-left: 60px; }
    #index .product-section .productCol1 { padding-left: 60px; }
    #index .product-section .indexProductMainSlick .slickControl .next {  top: 55%; }
    
    #index .project-section .indexProjectSlick .item .img-inner { height: 183px; margin: 0 20px; }
    #index .project-section .pl { padding-left: 30px; }
    #index .project-section .left .content { padding-left: calc(60px + 290px); margin-right: 0; }
    #index .project-section .right {  padding-left: 112px; }
}

@media screen and (max-width: 1499px) { 

    #index .news-section .sliderControl { bottom: 55px; right: 72px; }
    #index .news-section .news-container .news-row .newsCol1 { 
        padding-left: 3%; 
        -ms-flex: 0 0 calc(100% - 720px); flex: 0 0 calc(100% - 720px); max-width: calc(100% - 720px);
        max-height: 360px; padding-bottom: 20px; padding-top: 10px; 
    }
    #index .news-section .newsCol2 .moreBtn, #index .news-section .newsCol3 .moreBtn { right: 80px; top: 50px; } 
    #index .news-section .news-container .news-row .newsCol3 span.txt { right: 60px; bottom: 45px; }
    #index .news-section .news-container .news-row .newsCol1 .title { margin-bottom: 30px; padding-top: 30px; }
    #index .news-section .newsCol1 .moreBtn { top: 60px; right: 90px; }
    #index .news-section .news-container .news-row .newsCol1 .content { margin-bottom: 30px;  -webkit-line-clamp: 2; }
    #index .news-section .news-container .news-row .newsCol2, #index .news-section .news-container .news-row .newsCol3 { 
        -ms-flex: 0 0 360px; flex: 0 0 360px; max-width: 360px; 
    } 
    #index .news-section .news-container .news-row .img-inner { height: 360px; }

    #index .about-section .counterContainer { padding-top: 0; }
    #index .about-section .counterContainer .counter-row { padding-top: 40px; }
    #index .about-section .counterContainer .title { margin-bottom: 40px; }
    #index .about-section .bottomRow .right .wrap { padding: 60px 10% 70px 62px; }
    #index .about-section .bottomRow .right .content { margin-bottom: 60px; }
    #index .about-section::after { height: 200px; bottom: -130px; }
    #index .about-section .max510 { max-width: initial; }
    
    #index .product-section .pl { padding-left: 45px; }
    #index .product-section .productCol1 { padding-left: 45px; }
    #index .product-section .product-container { padding-top: 0; padding-bottom: 120px; }
    #index .product-section .mainTitle { max-width: 540px; } 
    #index .product-section .title { padding-top: 90px; line-height: 64px; }  
    #index .product-section .product-row .productCol2 .MainSlickWrap { padding-right: 15px; padding-left: 15px;  margin-top: -220px; }
    #index .product-section .productCol1 .subSlickWrap { display: none; } 
    #index .product-section .productCol1 .textSlickWrap { padding-left: 0; padding-top: 40px; }
    #index .product-section .productCol1 .textSlickWrap .content { margin-bottom: 50px; }
    #index .product-section .productInnerRow .col7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%; } 
    #index .product-section .productInnerRow .col5 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } 
    #index .product-section .imgBox img { max-width: 480px; margin: 0 auto;  }    
    #index .product-section .product-container { padding-left: 15px; padding-right: 15px; }
    #index .product-section .number { display: none; }
    #index .product-section .indexProductMainSlick .slickControl .next { top: 380px; }
    
    #index .project-section .col-xxl-9 { padding-left: 30px; } 
    #index .project-section .left { -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; }
    #index .project-section .left .content { padding-left: 347px; }
    #index .project-section .right { -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; padding-left: 25px; padding-right: 30px;  }
    #index .project-section .project-container { padding-bottom: 80px; }
    #index .project-section .pl { padding-left: 60px; }
}

@media screen and (max-width: 1399px) { 
    
    #index .product-section .product-container { padding-bottom: 80px; }
    #index .product-section .indexProductMainSlick .slickControl .next { top: calc(58% + 10px); }
    
    #index .product-section .productCol1 .textSlickWrap .name { font-size: 24px; line-height: 32px; margin-bottom: 18px;  }
    #index .product-section .productCol1 .textSlickWrap .content { line-height: 32px; }
    #index .product-section .productContent { line-height: 36px; }
    #index .product-section .MainSlickWrap .item { padding-right: 30px; }
}

@media screen and (max-width: 1299px) { 
    
    #index .product-section .indexProductMainSlick .slickControl .next { top: calc(41% + 120px); }
    #index .product-section .MainSlickWrap .item { padding-right: 50px; }
}

@media screen and (max-width: 1199px) { 
    
    .d-1199-mobile { display: block; }
    .d-1199-pc { display: none; }
    
    #index .net::before, #index .net::after { display: none !important; }

    #index .news-section .news-container .news-row .newsCol1 { 
        padding-top: 10px;
        -ms-flex: 0 0 65%; flex: 0 0 65%; max-width: 65%; 
        padding-right: 5%; padding-bottom: 10px; padding-left: 5%; max-height: 440px;
    }
    #index .news-section .news-container .news-row .newsCol2 { 
        -ms-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%; 
    }
    #index .news-section .news-container .news-row .newsCol3 {
        -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; 
    }

    #index .about-section .counterContainer .mainTitle { margin-bottom: 32px; }
    #index .about-section .counterContainer .counter-row { justify-content: center; }
    #index .about-section .counterContainer .countContent { margin-bottom: 36px; }
    #index .about-section .counterContainer .counterCol1 {
        -ms-flex: 0 0 90%;
        flex: 0 0 90%;
        max-width: 90%;
        padding-left: 10%;
    }
    #index .about-section .counterContainer .counterCol2 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
        padding-left: 5%;
    }
    #index .about-section .counterContainer .counterCol3 {
        -ms-flex: 0 0 58%;
        flex: 0 0 58%;
        max-width: 58%;
        padding-left: 2%;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
    }
    #index .about-section .counterContainer .item { padding-left: 10px; }
    #index .about-section .counterContainer .counterCol3 .item { padding-left: 20px; }
    #index .about-section .bottomRow .right .wrap { padding: 50px 8% 40px 35px; }
    #index .about-section .bottomRow .right .title { font-size: 22px; }
    #index .about-section .bottomRow .right .content { font-size: 15px; line-height: 36px; margin-bottom: 30px; }
    
    #index .product-section .pl { padding-left: 42px; }
    #index .product-section .productCol1 { padding-left: 42px; }
    
    #index .product-section .product-container {  padding-top: 70px; padding-bottom: 70px; }
    #index .product-section .product-row .productCol2 .MainSlickWrap { margin-top: -220px; }
    #index .product-section .title { padding-top: 0; line-height: 64px; }
    #index .product-section .productContent { line-height: 32px; }
    #index .product-section .productCol1 h3 { margin-bottom: 18px; }
    #index .product-section .productCol1 .textSlickWrap { padding-top: 0px; }
    #index .product-section .indexProductMainSlick img { max-width: 350px; }
    #index .product-section .productCol1 { padding-left: 42px; }
    #index .product-section .pl { padding-left: 42px; }
    #index .product-section .mainTitle { padding-top: 0;  } 
    #index .product-section .imgBox { margin-top: 28px; margin-bottom: 28px; }
    #index .product-section .productCol1 .textSlickWrap .content { margin-bottom: 40px; }
    #index .product-section .indexProductMainSlick .slickControl .prev, #index .product-section .indexProductMainSlick .slickControl .next { right: -5%; }
    #index .product-section .indexProductMainSlick .slickControl .next { top: calc(39% + 120px);  }

    #index .project-section .project-container { padding-bottom: 60px; }
    #index .project-section .project-container a {  }
    #index .project-section .indexProjectSlick .item { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
    #index .project-section .indexProjectSlick .item .img-inner { /* max-width: 180px; */ width: 180px;  padding: 0 5px; margin: 0 5px; }
    #index .project-section .left { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; }
    #index .project-section .right { -ms-flex: 0 0 55%; flex: 0 0 55%; max-width: 55%; /* padding-top: 30px; */ padding-top: 0; margin-top: -72px; }

    #index .product-section .slickControl .prev, #index .product-section .slickControl .next { right: -30px; }
    #index .product-section .slickControl .next { top: 72%;  }
    #index .project-section .pl { padding-left: 57px; }
}

@media screen and (max-width: 991px) {
    
    .d-991-mobile { display: block; }
    .d-991-pc { display: none; }
    
    #index .index-banner-section .swiper-container { height: calc(100vh - 64px); }

    #index .newsSlick.slick-list { margin: 0; }
    #index .newsSlick.item { margin: 0 15px; padding-bottom: 52px; } 
    #index .news-section .news-container .news-row .newsCol1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .news-section .news-container .news-row .newsCol2 { 
        -ms-flex: 0 0 0%; flex: 0 0 0%; max-width: 0%;  min-height: 0; 
    }
    #index .about-section .counterContainer .counterCol1 { padding-left: 5%; }
    #index .about-section .counterContainer .counterCol2 { padding-left: 0%;  -ms-flex: 0 0 28%; flex: 0 0 28%; max-width: 28%; }
    #index .about-section .counterContainer .counterCol3 { padding-left: 0%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
    #index .about-section .counterContainer .item { margin-left: 2%;  padding-left: 10px; }
    #index .about-section .bottomRow .left { -ms-flex: 0 0 86%; flex: 0 0 86%; max-width: 86%; z-index: 3; position: relative; }
    #index .about-section .bottomRow .left .img-inner { height: 320px; }
    #index .about-section .bottomRow .right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .about-section .bottomRow .right .wrap { width: 100%; margin-left: 0; margin-top: -65px; padding: 100px 7% 80px 7%; }
    #index .about-section .bottomRow .right .inner { width: 93%; padding-left: 7%; }
    #index .about-section .bottomRow .right .title { font-size: 22px; }
    #index .about-section .bottomRow .right .content { font-size: 16px; }
    #index .about-section .counterContainer .red-dec::after { top: -30px; left: -30px; }
    #index .about-section .counterContainer .counterCol3 .red-dec::after { top: -30px; left: -20px; }
    #index .about-section .counterContainer .counterCol3 .item { padding-left: 20px; margin-right: 25px; }
    
    #index .product-section .product-row .productCol2 .MainSlickWrap { margin-top: 30px; }
    #index .product-section .productCol1 .textSlickWrap { padding-top: 30px; margin-top: 0px; }
    #index .product-section .productCol2, #index .product-section .productCol1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .product-section .productCol1 { padding-right: 66px; }
    #index .product-section .productInnerRow .col7 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .product-section .productInnerRow .col5 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .product-section .indexProductMainSlick img { max-width: 400px; }    
    #index .product-section .title { padding-top: 50px; }
    #index .product-section .product-container { padding-top: 15px; }
    #index .product-section .indexProductMainSlick .slickControl .prev, #index .product-section .indexProductMainSlick .slickControl .next { right: -10%; }
    #index .product-section .indexProductMainSlick .slickControl .next { top: 55.5%; }
    #index .project-section .indexProjectSlick .item .img-inner { height: 190px; margin: 0 10px; }
    #index .project-section .pl a { text-align: center; }
    #index .project-section .left { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .project-section .left .content { margin-right: 28px; margin-bottom: 40px; padding-left: 345px;  }
    #index .project-section .right { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    #index .project-section .right { padding-left: 0; padding-top: 0; margin-top: -10px; }

}

@media screen and (max-width: 767px) { 
    
    #index .index-banner-section .swiper-container { height: 488px; }
    #index .index-banner-section .swiper-container.text .swiper-slide .text-inner .content { font-size: 29px; line-height: 42px; letter-spacing: 0px; }
    #index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after { margin-left: 10px; }

    #index .about-section .mainTitle { font-size: 74px; line-height: 70px; margin-bottom: 20px; }
    #index .about-section .counterContainer .countContent { font-size: 30px; margin-bottom: 26px; }
    #index .about-section .counterContainer .counter-row {  display: flex; flex-wrap: wrap; justify-content: center; }
    #index .about-section .counterContainer .counterCol1 {
        padding-left: 0;
        -ms-flex: 0 0 90%;
        flex: 0 0 90%;
        max-width: 90%;
        padding-left: 5px;
    }
    #index .about-section .counterContainer .counterCol2 {
        padding-left: 0;
        -ms-flex: 0 0 90%;
        flex: 0 0 90%;
        max-width: 90%;
        padding-left: 5%;        
    }
    #index .about-section .counterContainer .counterCol3 {
        padding-left: 0;
        flex-direction: column;
        -ms-flex: 0 0 90%;
        flex: 0 0 90%;
        max-width: 90%;
        padding-left: 5%;
    }
    #index .about-section .counterContainer .item { margin-left: 0; padding-left: 10px; }
    #index .about-section .counterContainer .counterCol3 .item { margin-left: 0; margin-right: 0; padding-left: 10px; }
    #index .about-section .counterContainer .counterCol3 .red-dec::after { left: -30px; }
    #index .about-section .bottomRow .right .wrap { margin-top: -12%; padding: 120px 7% 80px 7%; }
    #index .about-section .bottomRow .right .wrap .scrollbarY { height: 120px; margin-bottom: 50px; }
    #index .about-section .bottomRow .right .wrap .title { margin-bottom: 26px; }
    #index .about-section .bottomRow .right .wrap .content {  }
    
    #index .product-section .pl { padding-left: 30px; }
    #index .product-section .productCol1 { padding-left: 42px; padding-right: 30px; }
    #index .product-section .productCol1 .textSlickWrap { margin-top: 0px; }
    #index .product-section .indexProductMainSlick .slickControl .prev, #index .product-section .indexProductMainSlick .slickControl .next { right: -30px; }
    #index .product-section .indexProductMainSlick img { max-width: 340px; }
    #index .product-section .indexProductMainSlick .slickControl .next { top: 60%; }
    
    #index .project-section .left .content { padding-top: 50px;  padding-bottom: 40px;   }
    #index .project-section .title { margin-bottom: 50px; }
    #index .project-section a { margin-top: 50px; }
}

@media screen and (max-width: 575px) { 
    #index .arrowBtn .btnInner { justify-content: center; }
    #index .index-banner-section .swiper-container { height: 760px; }
    #index .index-banner-section .swiper-container.text .swiper-slide .text-inner { bottom: 15%;  }
    #index .index-banner-section .swiper-container.text .swiper-slide .text-inner .content { font-size: 29px; line-height: 42px; letter-spacing: 0px; }
    #index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet { font-size: 16px; }
    #index .index-banner-section .swiper-container.text .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after { width: 58px; margin-left: 10px; }
    #index .index-banner-section .swiper-buttons { font-size: 12px; margin-left: 0px; }
    #index .index-banner-section .swiper-button-prev-unique .icon::after, #index .index-banner-section .swiper-button-next-unique .icon::after { width: 10px; height: 10px; }
    #index .index-banner-section .swiper-button-prev-unique .icon::after { border-left: 3px solid #fff; }
    #index .index-banner-section .swiper-button-prev-unique .icon::after, #index .index-banner-section .swiper-button-next-unique .icon::after {
        border-top: 3px solid #fff;
    }
    #index .index-banner-section .swiper-button-next-unique .icon::after { border-right: 3px solid #fff; right: 12px; }
    
    #index .news-section .news-container .news-row .newsCol1 { padding-bottom: 32px; padding-left: 26px; padding-right: 15px; }
    #index .news-section .news-container .news-row .newsCol1 .title { font-size: 50px; line-height: 36px; padding-top: 50px; margin-bottom: 32px; margin-top: 0; }
    #index .news-section .news-container .news-row .newsCol1 .subtitle { font-size: 20px; line-height: 30px; padding-right: 5px;  }
    #index .news-section .news-container .news-row .newsCol1 .subtitle.line1 {  white-space: normal; overflow: auto; text-overflow: inherit; }
    #index .news-section .news-container .news-row .newsCol2, #index .news-section .news-container .news-row .newsCol3 { 
        -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; 
    }
    #index .news-section .sliderControl .prevBtn i { font-size: 14px; }  
    #index .news-section .sliderControl .nextBtn i { font-size: 14px; }  
    #index .news-section .news-container .news-row .newsCol1 .content { margin-bottom: 44px; }
    #index .news-section .news-container .news-row .newsCol2 { display: none; }    
    #index .news-section .news-container .news-row .newsCol1 .sliderControl { right: 30px; bottom: 58px; }
    #index .news-section .newsCol1 .moreBtn { top: 56px; right: 50px; }
    #index .news-section .newsCol2 .moreBtn, #index .news-section .newsCol3 .moreBtn { top: 50px; right: 64px; }
    #index .news-section .news-container .news-row .newsCol3 span.txt { right: 38px; bottom: 48px; line-height: 21px; }
    #index .news-section .news-container .news-row .newsCol3 a img { height: 374px; }
    
    #index .about-section .counterContainer .counterCol2, #index .about-section .counterContainer .counterCol3 { padding-left: 3%; }
    #index .about-section  .mainTitle { font-size: 50px; line-height: 40px; margin-bottom: 20px; }
    #index .about-section .title .text-fill, #index .product-section .title .text-fill { margin-bottom: 0px; }
    #index .about-section .counterContainer .countContent { font-size: 22px; line-height: 30px; margin-bottom: 24px; }
    #index .about-section .counterContainer .counter-row { padding-top: 0px; padding-bottom: 10px; }
    #index .about-section .counterContainer .counterCol2 { padding-top: 28px; }
    #index .about-section .counterContainer .red-dec::after { width: 12.8px; height: 12.8px; top: 10%; }
    #index .about-section .counterContainer .counterCol2 .red-dec::after { top: -20px; }
    #index .about-section .counterContainer .counterCol2 .item { margin-top: 8px; padding-top: 20px; padding-left: 24px; }
    #index .about-section .counterContainer .counterCol3 .item { margin-top: 12px; padding-top: 12px; padding-left: 24px; }
    #index .about-section .counterContainer .item .counter { font-size: 60px; line-height: 62px;  }
    #index .about-section .counterContainer .item .text { font-size: 17px; }
    #index .about-section .bottomRow .right .wrap { margin-top: -62px; padding: 112px 6% 47px 7%; }
    #index .about-section .bottomRow .right .wrap .title { margin-bottom: 20px; line-height: 30px; }
    #index .about-section .bottomRow .right .content { line-height: 30px; margin-bottom: 44px; font-size: 16px; }
    #index .about-section .bottomRow .right a { display: block; text-align: center; }
    #index .about-section .borderArrow { margin-left: 44px; }
    
    #index .product-section .product-container { padding-top: 40px; padding-bottom: 57px; }
    #index .product-section .pl { padding-left: 10px; padding-right: 10px; }
    #index .product-section .productCol1 { padding-left: 10px; padding-right: 10px; }
    #index .product-section .productCol1 .textSlickWrap { padding-top: 0; margin-top: 20px; }
    #index .product-section .productCol1 .textSlickWrap .name { font-size: 20px; line-height: 24px; margin-bottom: 18px;}  
    #index .product-section .productCol1 .textSlickWrap .name span { font-size: 18px; }  
    #index .product-section .productCol1 .textSlickWrap .content { font-size: 16px; line-height: 30px; margin-bottom: 32px; }
    #index .product-section .product-row .productCol2 .MainSlickWrap { margin-top: 8px; padding-top: 0px; padding-bottom: 30px; }
    #index .product-section .number { display: none; }
    #index .product-section .title { padding-top: 15px; margin-bottom: 15px; line-height: 47px; }
    #index .product-section .productContent { font-size: 22px; line-height: 30px; }
    #index .product-section .item a { text-align: center;  }
    #index .product-section .product-row .productCol2 .MainSlickWrap { padding-left: 0; padding-right: 0; }
    #index .product-section .imgBox { margin-bottom: 7px; }
   
    /* arrow */
    #index .product-section .indexProductMainSlick .slickControl .prev .icon, #index .product-section .indexProductMainSlick .slickControl .next .icon { transform: rotate(0deg); top: auto; bottom: auto; }
    #index .product-section .indexProductMainSlick .slickControl .prev .icon { top: auto; bottom: auto; right: 25px; }
    #index .product-section .indexProductMainSlick .slickControl .prev, #index .product-section .indexProductMainSlick .slickControl .next { 
        flex-direction: row; left: auto; bottom: 0; top: auto; bottom: -12px; right: -30px;  width: 10px; height: 10px;
    }
    #index .product-section .borderArrow { margin-left: 44px; }
    #index .product-section .indexProductMainSlick .slickControl .prev .icon::after, #index .product-section .indexProductMainSlick .slickControl .next .icon::after { 
        border-top: 3px solid #000; width: 10px; height: 10px;
    }
    #index .product-section .indexProductMainSlick .slickControl .prev .icon::after { border-left: 3px solid #000; }
    #index .product-section .indexProductMainSlick .slickControl .prev:hover .icon::after { border-top: 3px solid #E41E25; border-left: 3px solid #E41E25; }
    #index .product-section .indexProductMainSlick .slickControl .next .icon::after { border-right: 3px solid #000; }
    #index .product-section .indexProductMainSlick .slickControl .next:hover .icon::after { border-top: 3px solid #E41E25; border-right: 3px solid #E41E25; }
    
    /*number*/
    #index .product-section .slick-dots { top: auto; flex-direction: row; bottom: -19px; top: auto; width: auto; height: auto; left: -32px; }
    #index .product-section .slick-dots li { width: auto; margin: 0 9px;  }
    #index .product-section .slick-dots li button { font-size: 16px; width: auto; flex-direction: row; }
    #index .product-section .slick-dots li button::before { font-size: 16px; left: -16px; top: -9px; }
    #index .product-section .slick-dots li button::after { height: 2px; width: 0px; margin-left: 0px; margin-bottom: 0px;}
    #index .product-section .slick-dots li.slick-active button::after {  height: 2px; width: 58px; margin-left: 14px; margin-top: 0; }
    #index .product-section .productContent { font-weight: 900; }
    #index .product-section .item a.arrowBtn { display: block; }
 
    #index .project-section .project-container { padding-top: 54px; padding-bottom: 57px; }
    #index .project-section .title { line-height: 47px; margin-bottom: 14px; }
    #index .project-section .pl { padding-left: 0; }
    #index .project-section .pl a { margin-top: 35px; margin-left: -10px;  }
    #index .project-section .left { width: 90%; }
    #index .project-section .left .content { padding-bottom: 28px; padding-left: 320px; }
    #index .project-section .right { width: 100%; }
    #index .project-section .indexProjectSlick .item { -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; }
    #index .project-section .indexProjectSlick .slick-list { width: 100%; }
    #index .project-section .indexProjectSlick .slickControl .prev, #index .project-section .indexProjectSlick  .slickControl .next { top: 50%; }
    #index .project-section .projectContent  { font-weight: 700;  }
    #index .project-section .borderArrow { margin-left: 44px; }
    #index .project-section .right { padding-right: 0; } 
    #index .project-section .indexProjectSlick .slick-slide { width: 250px; }

    header.header .search_wrap:hover { background: transparent; }
    header.header .navIcon_wrap:hover  { background: transparent; }
    header.header .searchContainer .navMainContent .searchBtn:hover { background: rgba(228, 30, 37, 1); }
    
    #index .index-banner-section .swiper-btnOuter { bottom: 8%; }
    #index .index-banner-section .swiper-container.text .swiper-pagination { left: 0; }
    #index .index-banner-section .swiper-button-next-unique { left: 10px; }
    #index .index-banner-section .swiper-button-prev-unique:hover .icon { transform: translateX(0px); }
    #index .index-banner-section .swiper-button-next-unique:hover .icon { transform: translateX(0px); }
    #index .news-section .sliderControl .prevBtn:hover .icon::before { transform: translateX(0px); }
    #index .news-section .sliderControl .nextBtn:hover .icon::before { transform: translateX(0px); }
} 

@media screen and (max-width: 440px) { 
    #index .project-section .indexProjectSlick .slickControl .prev { left: 15%; }
    #index .project-section .indexProjectSlick .slickControl .next { left: 85%; }
}

/* index plus */
#index .container-fluid { overflow: hidden; max-width: 100%; }
#index .product-section .subSlickNavWrap { position: absolute; top: 100px; right: 13%; }
#index .product-section .subSlickNavWrap .dotBox .slick-dots { position: absolute; bottom: -1px; z-index: 20; width: auto; }
#index .product-section .subSlickNavWrap .dotBox .slick-dots li { margin: 10px 0; transition: all .3s; -webkit-transition: all .3s; }
#index .product-section .subSlickNavWrap {
    display: flex; align-items: center; justify-content: center; flex-direction: column; 
}
#index .product-section .subSlickNavWrap .subSlickBtn {
    margin: auto 0;
    width: 40px;
    height: 40px;
    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;
    z-index: 20;
    cursor: pointer; 
}
#index .product-section .subSlickNavWrap .subSlickBtn:hover {
    color: #E41E25;
    transition: color .3s; 
    -webkit-transition: color .3s;
}
#index .product-section .subSlickNavWrap .subSlickBtn i {
  font-size: 18px; font-weight: 600; transform: rotate(90deg);
}
#index .product-section .subSlickNavWrap .subSlickBtn.right {
  padding-left: 2px;
}
#index .product-section .subSlickNavWrap .dotBox .slick-dots {
  position: relative;
  display: flex; flex-direction: row; align-items: center; flex-direction: column; 
}
#index .product-section .subSlickNavWrap .dotBox .slick-dots li {
  display: block;
  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;
    flex-direction: row; 
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
}
#index .product-section .subSlickNavWrap .dotBox .slick-dots li:hover button { 
    color: #000;
}
#index .product-section .subSlickNavWrap .dotBox .slick-dots li button { 
    width: auto; padding: 0; 
    font-size: 20px; font-weight: 700; font-family: 'Montserrat', sans-serif; line-height: 20px; color: #D2D2D2;
    display: flex; align-items: center; transition: all 0.4s; margin: 0 3px;
}
#index .product-section .subSlickNavWrap .dotBox .slick-dots li button:hover, #index .product-section .subSlickNavWrap .dotBox .slick-dots li:hover button::before { color: #000; }
#index .product-section .subSlickNavWrap .dotBox .slick-dots li button::before { 
    font-size: 20px; font-weight: 700; font-family: 'Montserrat', sans-serif; line-height: 20px; color: #D2D2D2; 
    position: relative; width: auto; position: absolute; 
    content: '0'; display: block; opacity: 1; transition: all 0.4s; 
}
#index .product-section .subSlickNavWrap .dotBox .slick-dots li:nth-child(n + 10) button::before { content: none; }
#index .product-section .subSlickNavWrap .dotBox .slick-dots li button::after { content: ''; height: 0; width: 2px; margin-left: 0px; margin-bottom: 1px; background: #000; transition: all 0.4s; }
#index .product-section .subSlickNavWrap .dotBox .slick-dots li.slick-active button, #index .product-section .subSlickNavWrap .dotBox .slick-dots li.slick-active button::before { color: #000; }
#index .product-section .subSlickNavWrap .dotBox .slick-dots li.slick-active button::after { height: 70px; margin-top: 20px; }
#index .product-section .slick-dots { right: calc(10% - 8px); }

@media screen and (max-width: 1700px) { 
    #index .product-section .subSlickNavWrap { right: 0; top: 10%; }
}

@media screen and (max-width: 1399px) { 
    #index .product-section .subSlickNavWrap { right: -30px; }
}

@media screen and (max-width: 1200px) { 
    #index .product-section .subSlickNavWrap { right: 5%; }
}

@media screen and (max-width: 991px) { 
    #index .product-section .subSlickNavWrap { top: 50%; transform: translateY(-50%); right: -15px; }
}

@media screen and (max-width: 575px) { 
    #index .product-section .subSlickNavWrap { flex-direction: row; font-size: 16px; bottom: 0; top: auto; align-items: flex-end; -ms-flex-align: flex-end; transform: translateY(0); width: 100%; right: auto; }
    #index .product-section .subSlickNavWrap .dotBox .slick-dots { flex-direction: row; }
    #index .product-section .subSlickNavWrap .subSlickBtn { margin: 0 auto; }
    #index .product-section .subSlickNavWrap .subSlickBtn i { transform: rotate(0); }
    #index .product-section .subSlickNavWrap .dotBox .slick-dots li button::after { 
        height: 2px; width: 0px; margin-left: 0px; margin-bottom: 1px; 
    }
    #index .product-section .subSlickNavWrap .dotBox .slick-dots li.slick-active button::after { 
        height: 2px; margin-top: 0; width: 50px; margin-left: 8px; 
    }
    #index .product-section .subSlickNavWrap .dotBox .slick-dots li button::before { position: relative; }
    #index .product-section .slick-dots li button::before { top: 0; left: 0; }
    #index .product-section .slick-dots { left: 0; bottom: -5px; }
    #index .product-section .subSlickNavWrap .subSlickBtn.left { margin-right: 12px; }
    #index .product-section .subSlickNavWrap .dotBox .slick-dots li button { font-size: 16px; }
    #index .product-section .subSlickNavWrap .dotBox .slick-dots li button::before { font-size: 16px; }
    #index .product-section .subSlickNavWrap .subSlickBtn i { font-size: 12px; margin: 0 3px; }
    #index .product-section .productCol2 { padding-bottom: 50px; }
    #index .product-section .MainSlickWrap .item { padding-right: 0px; }
}

@media screen and (max-width: 500px) { 
    #index .product-section .subSlickNavWrap { left: auto; margin: 0 auto; justify-content: center; position: relative; }
    #index .product-section .subSlickNavWrap .dotBox { display: none; }
    #index .product-section .subSlickNavWrap .subSlickBtn { position: relative; margin: 0; }
    #index .product-section .subSlickNavWrap .subSlickBtn.left { right: auto; margin-right: 0; }
    #index .product-section .subSlickNavWrap .subSlickBtn.right { right: auto; }
    #index .product-section .productCol2 { padding-bottom: 40px; }
    #index .product-section .product-row .productCol2 .MainSlickWrap { padding-bottom: 5px; }
    #index .product-section .productCol1 .textSlickWrap { margin-top: 20px; }
}


/* --------------- */
/* cookieContainer
/* --------------- */

.cookieContainer { width: 100%; position: fixed; top: 0; left: 0; z-index: -1; transition: z-index 0.001s 0.8s; background: transparent; }
.cookieContainer a.hoverRed1 { color: #595959; }
.cookieContainer a.hoverRed1:hover { color: #E41E25; text-decoration: underline; }

.cookieContainer.active { z-index: 999; height: 100vh; transition: z-index 0.001s 0s; }
.cookieContainer.active .bg { opacity: 1; transition: all 0.4s 0s; }
.cookieContainer.active .content { margin-top: 0; opacity: 1; transition: all 0.4s 0.4s; }
.cookieContainer .bg { width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.4s 0.4s; }
.cookieContainer .container { height: 100%; }
.cookieContainer .content { max-width: 1000px; margin: 20px auto 0; position: relative; top: 50%; transform: translateY(calc(-50% - 60px / 2)); opacity: 0; transition: all 0.4s 0s; }

.cookieModal { 
    background: #fff; 
    text-align: center;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    outline: 0;
    position: relative;
    width: auto;
    margin: 0.5rem;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - (0.5rem * 2));
    max-width: 780px;
    margin: auto;
}
.cookieModal .modal-header img { margin: 0 auto; }
.cookieModal .modal-footer button { margin: 0 auto; width: 200px; height: 60px; }
.cookieModal .modal-footer button .iconBox i:before { color: #fff; font-size: 10px; margin-top: -15px; }
.cookieModal .modal-header { padding: 35px 0 35px 0; width: 100%; }
.cookieModal .title { margin-bottom: 18px; margin-left: -10px;  }
.cookieModal .modal-body { padding-top: 45px; padding-bottom: 30px; width: 100%; padding-left: 100px; padding-right: 100px; }
.cookieModal .modal-body .des { text-align: justify; color: #595959; }
.cookieModal .modal-footer { padding-top: 30px; padding-bottom: 30px; width: 100%; }

@media screen and (max-width: 575px) { 
    .cookieModal .modal-body { padding-left: 10%; padding-right: 10%; }
}


/* --------------- */
/* video modal
/* --------------- */

.index-video-element2 {height: 100%; }
.index-video-element2.horizontal { width: 100% !important; height: 100%; padding-bottom: 0; top: 0; transform: none; }
.index-video-element2 iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
@media (max-width: 1199px) { .index-video-element2.horizontal { height: 100%; } }

#indexVideoModal { padding-right: 0 !important; }
#indexVideoModal .closeModal { width: 70px; height: 70px; background: #E41E25; display: flex; justify-content: center; align-items: center; position: fixed; top: 0; right: 0; }
@media screen and (max-width: 767px) { #indexVideoModal .closeModal { width: 70px; height: 70px; } }
#indexVideoModal .closeModal:hover .closeLine::before { transform: translate(-50%, -50%) rotate(30deg); }
#indexVideoModal .closeModal:hover .closeLine::after { transform: translate(-50%, -50%) rotate(-30deg); }
#indexVideoModal .closeModal .closeLine { width: 24px; height: 24px; display: block; position: relative; transition: all 0.4s; }
#indexVideoModal .closeModal .closeLine::before, #indexVideoModal .closeModal .closeLine::after { content: ''; width: 32px; height: 2px; background: #fff; position: absolute; top: 50%; left: 50%; transition: all 0.4s; }
#indexVideoModal .closeModal .closeLine::before { transform: translate(-50%, -50%) rotate(45deg); }
#indexVideoModal .closeModal .closeLine::after { transform: translate(-50%, -50%) rotate(-45deg); }
#indexVideoModal .modal-dialog { height: calc(100vh - 3.5rem); width: 79.166%; max-width: none; position: relative; }
@media screen and (max-width: 991px) { #indexVideoModal .modal-dialog { height: auto; margin-top: 1.75rem; margin-bottom: 1.75rem; } }
@media screen and (max-width: 767px) { #indexVideoModal .modal-dialog { width: 100%; margin: 0; } }
#indexVideoModal .modal-dialog .modal-content { height: 100%; background: #000; position: relative; }
@media screen and (max-width: 991px) { #indexVideoModal .modal-dialog .modal-content { height: 600px; } }
@media screen and (max-width: 767px) { #indexVideoModal .modal-dialog .modal-content { height: 435px; } }
#indexVideoModal .modal-dialog .modal-content iframe { width: 100%; height: 100%; border: none; }


/* --------------- */
/* video modal
/* --------------- */

header.header .navProductContainer .nav-pills {   
    display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none; 
    flex-direction: column; 
}
header.header .navProductContainer .d-flex-col { justify-content: flex-start; align-items: flex-start; }
header.header .navProductContainer .d-flex-col a { margin-bottom: 24px; color: #6D6D6D; font-size: 16px; font-weight: 400;  }
header.header .navProductContainer .navInner { height: 100%; border-right: 2px solid rgba(210, 210, 210, .4); } 
header.header .navProductContainer .navInner a { pointer-events: auto; } 
header.header .navProductContainer .navInner .pill_outer a:hover { color: #000; text-decoration: none; } 

header.header .navProductContainer .nav-link { background: #fff; border-radius: 0; display: flex; justify-content: space-between; color: #000; font-weight: 500; font-size: 18px; margin-bottom: 24px; padding: 0;  }
header.header .navProductContainer .nav-pills .nav-link.active, .nav-pills .show>.nav-link { background: #fff; border-radius: 0; color: #E41E25; } 
header.header .navProductContainer .pill_outer { padding-left: 84px; letter-spacing: .4px; font-size: 18px; }
header.header .navProductContainer.nav-item a i { 
    font-size: 12px; opacity: 0; 
    position: absolute;
    right: 0px;  top: 5px; 
}
header.header .navProductContainer .nav-item a:hover i { display: block; animation: goRightAni 1.5s linear 0s infinite normal; color: #E41E25; }


/* --------------- */
/* pages common
/* --------------- */

.commonBlock img { max-width: 100%; }
.backBtn { 
    width: 140px; height: 140px; 
    display: flex; flex-direction: column; justify-content: center; align-items: center; 
    border: 1px solid #EFEFEF; color: #000; background: #fff; transition: background .4s;
}
.backBtn:hover { background: #EFEFEF; transition: background .4s; }
.borderBtn2 { 
    border: 5px solid #E41E25; width: 50px; height: 50px; 
    display: flex; justify-content: center; align-items: center; 
    margin-left: 10px; padding-left: 1px; 
}
@media screen and (max-width: 575px) { 
    .backBtn { width: 75px; height: 75px; }
    .borderArrow { margin-left: 20px; } 
}

.pages .banner-section { position: relative; }
.pages .banner-section { height: calc(100vh - 140px); }
.pages .banner-section img { height: calc(100vh);  } 

.pages .commonBlock .tabsWrap { display: flex; align-items: center; justify-content: flex-start; }
.pages .commonBlock .tabsWrap .tabItem { background: #EFEFEF; color: #000; width: 300px; height: 100px; margin: 0;  transition: all .4s; font-weight: 700;  font-size: 20px; display: flex; justify-content: center; align-items: center; position: relative; }
.pages .commonBlock .tabsWrap .tabItem::after { content: ''; width: 1px; height: 25px; background: #D2D2D2; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.pages .commonBlock .tabsWrap .tabItem:hover { color: #E41E25; transition: all .4s; }
.pages .commonBlock .tabsWrap .tabItem:hover::after { width: 0px; }
.pages .commonBlock .tabsWrap .tabItem.active { background: #E41E25; color: #fff;  transition: all .4s;}
.pages .commonBlock .tabsWrap .tabItem.active::after { width: 0px; }
.pages .commonBlock .txtWrap { position: absolute; bottom: 145px; left: 7.55%; padding-right: 7px; }
.pages .commonBlock .bnTitle {
    text-stroke: 1px #fff; color: transparent; -webkit-text-stroke: 1px #fff; text-stroke: 1px #fff; text-shadow: none; 
    text-transform: uppercase; margin-bottom: 18px; 
}
.pages .commonBlock .bnDoc { letter-spacing: 1.5px; margin-left: 5px; }
.pages .contentBlock { position: relative; background: #fff; }

@media screen and (max-width: 1299px) { 
    .pages .commonBlock .txtWrap { bottom: 100px; left: 4%; }
}
@media screen and (max-width: 768px) { 
    .pages .commonBlock .tabsWrap { flex-direction: column; }
    .pages .commonBlock .tabsWrap .tabItem { width: 100%; height: 50px; font-size: 18px; }
    .pages .projectList .commonBlock .txtWrap { left: 0; }
    .pages .commonBlock .tabsWrap .tabItem::after { width: 0; }
    .pages .commonBlock .txtWrap { bottom: 10%; }
}


/* --------------- */
/* breadcrumb
/* --------------- */

.pages .breadcrumbWrap { position: absolute; top: 143px; right: 140px; z-index: 9;  }
.pages .breadcrumb { padding: 23px 0rem 20px 0; margin-bottom: 0; border-radius: 0rem; list-style: none; background: none; display: flex; justify-content: flex-end; align-items: center; }
.pages .breadcrumb > li { float: none; color: #fff; color: #F3F3F3; font-size: 14px; font-family: 'Noto Sans TC', sans-serif; font-weight: 100; letter-spacing: .5px; vertical-align: middle; }
.pages .breadcrumb > li a { color: #F3F3F3; }
.pages .breadcrumb > li a:hover { opacity: 0.8; }
.pages .breadcrumb > li + li::before { color: #F3F3F3; }
.pages .breadcrumb > .active { color: #595959; text-decoration: underline; letter-spacing: .5px; position: relative; font-weight: 400; }
.pages .breadcrumb .breadcrumb-item + .breadcrumb-item { padding-left: 0; line-height: 18px; }
.pages .breadcrumb .breadcrumb-item + .breadcrumb-item::before { 
    content: '\e803'; 
    position: relative; display: inline-block; float: none;
    font-family: 'fontello'; font-size: 14px;
    width: 23px; line-height: 18px; top: 0px; 
    padding-right: 0; left: 3px; 
}
.pages .breadcrumb .breadcrumb-item .icon-home { font-size: 13px; width: 14.5px; height: 13px; position: relative; top: 0px; left: 2px; }

@media screen and (max-width: 1299px) { 
    .pages .breadcrumbWrap { top: 84px; right: 25px; }   
}
@media screen and (max-width: 575px) {
    .breadcrumb { display: none; }
}


/* --------------- */
/* pagesBgWhite
/* --------------- */

.pagesBgWhite header.header .headerTop { border-bottom: 1px solid rgba(210, 210, 210, 0.5); background: #fff;  }
.pagesBgWhite header.header .nav_center_items { color: #000; }
.pagesBgWhite header.header .nav_center_items li a { font-weight: 400; }
.pagesBgWhite header.header .nav_center_items li a:hover::after { background: #000; bottom: -3px; }
.pagesBgWhite header.header .nav_center_items li.active a::after { background: #000; bottom: -3px; }

.pagesBgWhite header.header .d-index-block { display: none; }
.pagesBgWhite header.header .d-index-none { display: block; }

.pagesBgWhite header.header.scrollDown .headerTop { border-bottom: 0; }
.pagesBgWhite header.header.scrollDown .d-index-block { display: block; }
.pagesBgWhite header.header.scrollDown .d-index-none { display: none; }

.pagesBgWhite .breadcrumb .breadcrumb-item .icon-home { color: #E9E9E9; }
.pagesBgWhite .breadcrumb > li { color: #D7D7D7; }
.pagesBgWhite .breadcrumb > li a { color: #D7D7D7; }
.pagesBgWhite .breadcrumb > li + li::before { color: #EAEAEA; }
.pagesBgWhite .breadcrumb > .active {  color: #595959; }

@media screen and (max-width: 1299px) { 
    .pagesBgWhite header.header .search_wrap { color: #000; transition: all .3s; }
    .pagesBgWhite header.header .search_wrap:hover { background: #fff;  color: #595959; transition: all .3s; }
    .pagesBgWhite header.header .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol { background: #000; }
    .pagesBgWhite header.header .navIcon_wrap:hover { background: #fff; }
    .pagesBgWhite header.header .navIcon_wrap:hover .navIcon .iconOuter .iconRow .iconCol { width: 5.6px; height: 5.6px; background: #595959; }
    .pagesBgWhite header.header.scrollDown .search_wrap { color: #fff; }
    .pagesBgWhite header.header.scrollDown .search_wrap:hover { background: #252525; color: #fff; }
    .pagesBgWhite header.header.scrollDown .navIcon_wrap .navIcon .iconOuter .iconRow .iconCol { background: #fff; }
    .pagesBgWhite header.header.scrollDown .navIcon_wrap:hover { background: #252525; color: #fff; }
    .pagesBgWhite header.header.scrollDown .navIcon_wrap:hover .navIcon .iconOuter .iconRow .iconCol { color: #fff;  }
}


/* --------------- */
/* pages pagination
/* --------------- */

.paginationContainer { padding-bottom: 118px; display: flex; justify-content: space-between; align-items: flex-end; }
.paginationContainer .paginationWrap { margin-bottom: 0; margin-top: 36px; }
.paginationContainer .paginationWrap .paginationWrap .pagination { justify-content: center; align-items: center; }

.paginationContainer .arrowWrap { display: flex; justify-content: flex-end; align-items: center; }
.paginationContainer .arrowWrap .btnOuter { display: flex; align-items: center; justify-content: flex-end;  }
.paginationContainer .arrowWrap .btnOuter .iconBox { width: 50px;  height: 50px; display: flex; justify-content: center; align-items: center; color: #000;  transition: all .3s; }
.paginationContainer .arrowWrap .btnOuter:hover .iconBox { background: #E41E25; color: #fff; transition: all .3s; }
.paginationContainer .arrowWrap .line { background: rgba(210, 210, 210, 0.5); width: 1px; height: 25px; margin: 0 40px; }

.paginationWrap .page-link:hover { border: 5px solid #E41E25; background: #fff; background: transparent; transition: all .3s; }
.paginationWrap .page-item { margin: 0 3px; }
.paginationWrap .page-item .page-item.ellipsis .text { padding-bottom: 5px; }
.paginationWrap .page-item.first, .newsPagination .page-item.last { margin: 0; border-radius: 0; }
.paginationWrap .page-item.prev { margin-right: 10px; }
.paginationWrap .page-item.next { margin-left: 10px; }
.paginationWrap .page-item .page-link { 
    border-radius: 0; color: #000; 
    border: 5px solid #fff; width: 50px; height: 50px; line-height: 50px; padding:0; display: flex; justify-content: center; align-items: center; transition: all .3s; 
    font: 700 16px 'Montserrat', sans-serif;
}
.paginationWrap .page-item .page-link:focus { box-shadow: none; }
.paginationWrap .page-item .page-link:hover { color: #E41E25; transition: all .3s; }
.paginationWrap .page-item.active .page-link { border: 5px solid #E41E25; background: #fff; color: #000; }

.paginationWrap .page-item.first .page-link, .paginationWrap .page-item.prev .page-link, .paginationWrap .page-item.next .page-link, .paginationWrap .page-item.last .page-link { color: #000; }
.paginationWrap .page-item.first .page-link i::before, .paginationWrap .page-item.prev .page-link i::before, .paginationWrap .page-item.next .page-link i::before, .paginationWrap .page-item.last .page-link i::before { transform: scale(0.8); }
.paginationWrap .page-item.first .page-link:hover, .paginationWrap .page-item.prev .page-link:hover, .paginationWrap .page-item.next .page-link:hover, .paginationWrap .page-item.last .page-link:hover { border-color: transparent; color: #E41E25; }
.paginationWrap .page-item.disabled .page-link { border-color: transparent; }

.paginationWrap .d-mobile-pag { display: none; }
.paginationWrap .d-mobile-pag .page-link { color: #000; border: 0;  padding: 0.5rem; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; line-height: 1; }
.paginationWrap .d-mobile-pag .page-link:hover { border: 0; color: #E41E25; }

@media screen and (max-width: 768px) { 
    .paginationContainer { padding-bottom: 100px; }
    .paginationContainer { justify-content: center; }
}
@media screen and (max-width: 575px) {
    .paginationWrap .page-item:not(.active) { display: none; }
}


/* --------------- */
/* contact common 
/* --------------- */

.contactUs.contactUsProducts { padding-top: 105px; }

.contactUsWrap .productBlock { border-bottom: 5px solid #E41E25; padding-bottom: 10px; margin-bottom: 60px;   }
.contactUsWrap .productBlock .title { margin-bottom: 40px;   }
.contactUsProducts .item { position: relative; padding-top: 0px; padding-left: 10px; padding-right: 10px; width: 100%;  max-width: 184px;  }
.contactUsProducts .item img { width: 100%; max-width: 100%; height: auto; }
.contactUsProducts .item .closeBtn img { width: 5px; max-width: 5px; height: 5px; }
.contactUsProducts .item .name { margin-top: 20px; margin-bottom: 25px; line-height: 22px; }
.contactUsWrap .closeBtn { width: 19px; height: 19px; border-radius: 50%; border: 2px solid #E41E25;  display: flex; justify-content: center; align-items: center; text-align: center; padding-bottom: 5px; transition: all .3s; position: absolute; right: 0; top: -20px; cursor: pointer; }
.contactUsWrap .closeBtn .afterHover{ display: none; }
.contactUsWrap .closeBtn .beforeHover{ display: block; }

.contactUsWrap .closeBtn:hover { background: #E41E25; transition: all .3s; }
.contactUsWrap .closeBtn:hover .beforeHover { display: none; }
.contactUsWrap .closeBtn:hover .afterHover { display: inline-block; }

.contactUsWrap .rowCustom { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.contactUsWrap .rowCustom .colLeft, .contactUsWrap .rowCustom .colRight { position: relative; width: 100%; min-height: 1px; }
.contactUsWrap .rowCustom .colLeft { -ms-flex: 0 0 40.58%; flex: 0 0 40.58%; max-width: 40.58%; padding-top: 15px; padding-left: 10px;  }
.contactUsWrap .rowCustom .colLeft .titleContainer { padding-right: 15px;  }
.contactUsWrap .rowCustom .colRight { -ms-flex: 0 0 59.42%; flex: 0 0 59.42%; max-width: 59.42%; }

.contactUsWrap .rightContainer { text-align: left; }
.contactUsWrap .formRow { margin-right: -9px; margin-left: -9px; width: 100%; max-width: 828px; margin-bottom: 65px; }
.contactUsWrap .formCol { padding-right: 9px; padding-left: 9px; }
.contactUsWrap .formCol a { display: block; }
.contactUsWrap .radio02 { margin-left: 59px; }
.contactUsWrap .form-group { margin-bottom: 20px; }
.contactUsWrap .formBox { width: 100%; height: 60px;  border-bottom: solid 1px rgba(210, 210, 210, 0.5); display: flex; align-items: center; position: relative; transition: all 0.4s; }
.contactUsWrap .formBox.contentBox { height: 180px; flex-wrap: wrap; align-items: flex-start;  }
.contactUsWrap .formBox.formBoxTextarea { height: auto; flex-wrap: wrap; }
.contactUsWrap .formBox.boxFocus { position: relative; border-color: #E41E25; }
.contactUsWrap .formBox.boxFocus::before { content: ''; position: absolute; bottom: 0; width: 100%; left: 0; height: 4px; background: #E41E25; }

.contactUsWrap .colLabel { width: 110px; padding: 0;  margin: 15px 0 15px 0; font: 700 20px 'Noto Sans TC', sans-serif; line-height: 25px; color: #242424; }
.contactUsWrap .colInput { width: calc(100% - 110px); }
.contactUsWrap .colInput input.form-control { height: 53px; width: 100%; border: none; padding: 15px 20px 15px 0; font: 400 16px 'Noto Sans TC', sans-serif; line-height: 25px; color: #595959; position: relative; }
.contactUsWrap .colInput input.form-control.focus, .contactUsWrap .colInput input.form-control:focus { box-shadow: none; }
.contactUsWrap .colTextarea { width: 100%; }
.contactUsWrap .colTextarea textarea.form-control { width: 100%; border: none; padding: 0px 20px 6px; font: 400 16px 'Noto Sans TC', sans-serif; line-height: 36px; color: #D2D2D2; }
.contactUsWrap .colTextarea textarea.form-control.focus, .contactUsWrap .colTextarea textarea.form-control:focus { box-shadow: none; }
.contactUsWrap .codeImg { max-width: 150px; height: 55px; margin-top: -10px;  }

.contactUsWrap .btnRow { margin-top: 42px; }
.contactUsWrap .btnRow .formCol { width: 200px; }
.contactUsWrap .btnRow .btn.btnCustomer { height: 50px; font: 500 18px 'Noto Sans TC', sans-serif; line-height: 48px; }

.contactUsWrap .colTextarea textarea.form-control::placeholder { color: #D5D5D5; font: 400 16px 'Noto Sans TC', sans-serif; }
.contactUsWrap .colInput input.form-control::placeholder { color: #D5D5D5; font: 400 16px 'Noto Sans TC', sans-serif; }
.contactUsWrap .placeholderCustom::-webkit-input-placeholder  { color: #D5D5D5; font: 400 16px 'Noto Sans TC', sans-serif; }
.contactUsWrap .placeholderCustom:-ms-input-placeholder { color: #D5D5D5; font: 400 16px 'Noto Sans TC', sans-serif; }
.contactUsWrap .placeholderCustom::placeholder { color: #D5D5D5; font: 400 16px 'Noto Sans TC', sans-serif;}
.contactUsWrap .error-messsage { position: absolute; top: 50%; transform: translateY(-50%); }
.contactUsWrap .colTextarea textarea .error-messsage { position: absolute; top: 15px; }
.contactUsWrap .formBox.formBoxTextarea .error-messsage { position: absolute; top: 50%; transform: translateY(-50%); }

.radioBtnContainer { position: relative; }
.contactUsWrap .radioBox { position: relative; display: flex; margin-bottom: 0; }
.radioBtnContainer .radioBox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.radioBtnContainer .checkmark {
  position: absolute;
  top: 5px; 
  left: 0;
  height: 14px;
  width: 14px;
  background-color: #fff;
  border-radius: 50%;
  border: 2px solid #D2D2D2; 
}
.radioBtnContainer:hover .radioBox input ~ .checkmark {
  border-color: #E41E25;
}
.radioBtnContainer .radioBox input:checked ~ .checkmark {
  border-color: #E41E25;
}
.radioBtnContainer .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.radioBtnContainer .radioBox input:checked ~ .checkmark:after {
  display: block;
}
.radioBtnContainer .checkmark {  border-color: #D2D2D2; }
.radioBtnContainer.active .checkmark {  border-color: #E41E25; }
.radioBtnContainer.active:hover .radioBox input ~ .checkmark { border-color: #E41E25; }
.radioBtnContainer.active .checkmark:after { display: block; }
.radioBtnContainer .checkmark:after { display: none; }
.radioBtnContainer.active .radioBox input ~ .checkmark { border-color: #E41E25; }
.radioBtnContainer .radioBox .checkmark:after {
    top: 3px;
    left: 3px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #E41E25;
}
.contactUsWrap .custom-radio .custom-control-input:checked ~ .custom-control-label::before {
    border: 2px solid #E41E25; 
    box-shadow: none;
}
.contactUsWrap .custom-radio .custom-control-input:checked ~ .custom-control-label::after {
    background-image: url(images/contact/redDot.png); 
}
.contactUsWrap .custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: rgba(228, 30, 37, 1);
}

@media screen and (max-width: 768px) { 
    .radioBtnContainer:hover .radioBox input ~ .checkmark { border-color: #D2D2D2; }
    .radioBtnContainer .radioBox input:checked ~ .checkmark { border-color: #E41E25; }    
}


/* --------------- */
/* contact us
/* --------------- */

.contactUs { padding-top: 95px;  text-align: left; padding-bottom: 120px; }
.contactUsWrap .select-selected { padding-bottom: 10px; }
.contactUsWrap .select-selected:after { width: 14px; height: 9px; }
.contactUsWrap .contentLabel { display: block; width: 3.9em; text-align-last: justify;  }
.contactUsWrap .codeLabel { display: block; width: 3.9em; text-align-last: justify;  }
.contactUsWrap .contactUs .custom-select1 { width: 82%; font-size: 16px; font-weight: 400; font-family: 'Noto Sans TC', sans-serif; color: #595959; }
.contactUsWrap .contactUs .select-selected { background-color: #fff; color: #595959; }
.contactUsWrap .contactUs .select-items div, .contactUsWrap .contactUs .select-selected { border: 0; }
.contactUsWrap .contactUs p.content { margin-top: 60px;  }
.contactUsWrap .contactUs .socialIconBlock { text-align: left; margin-top: 110px; }
.contactUsWrap .contactUs .socialIconBlock .icon-mail:before { font-size: 16px;  }
.contactUsWrap .contactUs .socialIconBlock .icon-twitter:before { font-size: 16px;  }
.contactUsWrap .contactUs .socialIconWrap { justify-content: flex-start; }
.contactUsWrap .contactUs .socialIconWrap .socialIconBox:first-child { margin-left: 0; }
@media screen and (max-width: 991px) { 
   .contactUsWrap .contactUs .socialIconWrap { justify-content: center; }
   .contactUsWrap .contactUs .socialIconWrap .socialIconBox { margin: 5px 7px; }
    
   .contactUsWrap .contactUs .socialIconWrap .socialIconBox:first-child { margin-left: 7px; }
}
.contactUsWrap .redBtn { margin: 0; }


/* --------------- */
/* location
/* --------------- */

.contactUsWrap .contactUsLocation { padding-top: 132px; padding-bottom: 150px; }
.contactUsLocation .rowCustom { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; justify-content: space-between; }
.contactUsLocation .topInfoRow, .contactUsLocation .desRow { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.contactUsLocation .colLeft, .contactUsLocation .colRight, .contactUsLocation .topLeft, .contactUsLocation .topRight, .contactUsLocation .desColLeft, .contactUsLocation .desColRight { position: relative; width: 100%; min-height: 1px; }
.contactUsLocation .colLeft { -ms-flex: 0 0 39.66%; flex: 0 0 39.66%; max-width: 39.66%; }
.contactUsLocation .colRight { -ms-flex: 0 0 60.34%; flex: 0 0 60.34%; max-width: 60.34%; }
.contactUsLocation .leftContainer { padding-top: 40px; }
.contactUsLocation .tabContentContainer { border: 1px solid #EFEFEF;  }

.contactUsLocation .topInfoRow { justify-content: space-between; margin-bottom: 10px; align-items: center; margin-bottom: 24px; }
.contactUsLocation .desRow { justify-content: flex-start; }
.contactUsLocation .topLeft, .contactUsLocation .desColLeft { -ms-flex: 0 0 65.45%; flex: 0 0 65.45%; max-width: 65.45%; }
.contactUsLocation .topRight, .contactUsLocation desColRight{ -ms-flex: 0 0 34.55%; flex: 0 0 34.55%; max-width: 34.55%; }
.contactUsLocation .topRight { display: flex; justify-content: flex-end; }

.contactUsLocation .txtBox {  padding-top: 60px; display: flex; justify-content: center; align-items: center; padding-bottom: 35px; width: 100%; }
.contactUsLocation .txtBox .txtInner { width: 100%; padding-left: 13.63%; padding-right: 14%; }
.contactUsLocation .max548 { max-width: 640px; margin: 0 auto; }
.contactUsLocation .txtBox .txtInner .item { margin-bottom: 32px; padding-right: 10px; }
.contactUsLocation .txtBox .txtInner .item p { margin-bottom: 0; }
.contactUsLocation .txtBox .txtInner .item p.type { line-height: 10px; letter-spacing: .5px; font-size: 20px; line-height: 20px; font-weight: 500; text-transform: uppercase; margin-bottom: 4px; }
.contactUsLocation .content { margin-top: 60px; margin-bottom: 110px; line-height: 44px;  }

.contactUsLocation .topInfo { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; max-width: 548px; margin: 0 auto; margin-left: 15px; }
.contactUsLocation .topInfoRow .title { font-size: 28px; margin-left: -3px; }
.contactUsLocation .topInfoRow .borderBtn { padding-bottom: 1px; background: #E41E25; color: #fff; transform: translateY(-3px); }
.contactUsLocation .topInfoRow .borderBtn img { transition: all .3s;  }
.contactUsLocation .topInfoRow .borderBtn:hover img { transform: scale(1.25, 1.25); transition: all .3s; }

.contactUsLocation .locationNav { display: flex; flex-direction: column; }
.contactUsLocation .locationNav a { position: relative; }
.contactUsLocation .locationNav .nav-link { border-bottom: 1px solid #E9E9E9; margin-bottom: 0; margin-top: 0; padding-top: 27px; padding-bottom: 23px; padding-left: 40px; display: flex; align-items: center; }

.contactUsLocation .locationNav .nav-link::before {
    content: '';
    position: absolute;
    width: 0;
    height: 5px;
    background-color: #E41E25;
    bottom: -5px;
    left: 0;
    transform-origin: right;
    transition: all .3s ease-in-out;
}
.contactUsLocation .locationNav .nav-link:hover::before {
    width: 100%;
    transition: all .3s ease-in-out;
}
.contactUsLocation .locationNav .nav-link.active::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 5px;
    background-color: #E41E25;
    bottom: -5px;
    left: 0;
    transform-origin: right;
    transition: all .3s ease-in-out;
} 
.contactUsLocation .locationNav .nav-link .redBlock { width: 15px; height: 15px; border: 4px solid #000; display: inline-block; margin-right: 27px; margin-top: 0px; }
.contactUsLocation .locationNav .nav-link.active .redBlock { width: 15px; height: 15px; background: #E41E25; border-color: #E41E25; }
.contactUsLocation .locationNav .nav-item { width: 100%; max-width: 400px;  color: #000; font-size: 24px; font-weight: 700; font-family: 'Noto Sans TC', sans-serif; }

.contactUsLocation .tab-pane.container { padding: 0; }
.contactUsLocation .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #000;
    background-color: #fff;
    background-color: transparent;
}
.radioBtnWrap { display: flex; }
.contactUsWrap .codeBox { display: flex; }
.contactUsLocation .txtBox .txtInner .max548 .row { justify-content: space-between; }

@media screen and (max-width: 1499px) { 
    .contactUsLocation .txtBox .txtInner { width: 100%; padding-left: 50px; padding-right: 50px; }
    .contactUsLocation .contactUs { padding-top: 80px; padding-bottom: 75px; }
    .contactUsLocation .leftContainer { padding-top: 0px; padding-right: 50px; }
    .contactUsLocation .content { margin-top: 30px; margin-bottom: 65px; }
}
@media screen and (max-width: 1200px) {
    .contactUsLocation .topInfo { padding-left: 2px; }
    .contactUsLocation .topInfo { max-width: 460px; }
    .contactUsWrap .rightContainer {  padding-left: 0px; }
    .contactUsWrap .contactUs { padding-top: 70px; padding-bottom: 100px; }
    .contactUsLocation .fs-85 { font-size: 72px; line-height: 60px;  }
    .contactUsLocation .txtBox { padding-top: 30px; padding-bottom: 10px; }
    .contactUsLocation .locationNav .nav-link { padding-left: 10px; }
    .contactUsLocation .txtBox .txtInner { padding-left: 35px; padding-right: 35px; }
}
@media screen and (max-width: 991px) { 
    .contactUsWrap .productBlock .title { text-align: center; margin-top: 30px; }
    .contactUsLocation .rowCustom { padding-left: 15px; padding-right: 15px; }
    .contactUsWrap .fs-30 { font-size: 24px; }
    .contactUsWrap .rightContainer { padding-left: 0px; } 
    .contactUsWrap .rowCustom .colLeft .titleContainer { padding-right: 0; }
    .contactUsWrap .rowCustom .colLeft .titleContainer span.fs-85 { line-height: 66px; }
    .contactUsWrap .rowCustom .colLeft, .contactUsWrap .rowCustom .colRight{ -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .contactUsWrap .rowCustom .colLeft { text-align: center; }
    .contactUsWrap .contactUs .socialIconBlock { text-align: center; display: flex; justify-content: center; margin-top: 40px;  }
    .contactUsWrap .contactUs p.content { margin-top: 25px; }    
    .contactUsWrap .contactUsLocation { padding-top: 70px;  padding-bottom: 100px; }
    .contactUsLocation .leftContainer { padding-right: 0; } 
    .contactUsLocation .contactUs { padding-top: 60px; }
    .contactUsLocation .content { margin-top: 20px; margin-bottom: 70px; line-height: 36px; }
    .contactUsLocation .rightContainer { padding-top: 80px; } 
    .contactUsWrap .rightContainer { padding-top: 50px; }
    .contactUsWrap .formRow { margin: auto; margin-bottom: 65px; }
    .contactUsWrap .redBtn { margin: auto; } 
    .contactUsLocation .locationNav { flex-direction: row; justify-content: space-between; border-bottom: 1px solid #E9E9E9; }
    .contactUsLocation .locationNav .nav-link { border-bottom: 0; }
    .contactUsLocation .locationNav .nav-item { /* width: 33.3%; */ width: auto;  max-width: 290px; }
    .contactUsLocation .locationNav .nav-item .nav-link{ font-size: 20px; padding: 1rem 0.25rem 1.25rem 0.5rem;  }
    .contactUsLocation .locationNav .nav-link .redBlock { margin-right: 15px; }
    .contactUsLocation .txtBox { padding-top: 40px; }
    .contactUsLocation .txtBox .txtInner { padding-left: 10%; padding-right: 10%; }
}
@media screen and (max-width: 768px) { 
    .contactUsLocation .txtBox .txtInner { margin-right: 0; display: flex; flex-direction: column; align-items: center; }
    .contactUsLocation .txtBox .txtInner .topInfo { max-width: 380px; }
    .contactUsLocation .txtBox .txtInner .max548 { max-width: none;  display: inline-block; }
    .contactUsProducts .item { padding-top: 10px; padding-right: 15px;  }
    .contactUsWrap .contactUs { padding-top: 60px; padding-bottom: 80px; }
    .contactUsWrap .rowCustom .colLeft, .contactUsWrap .rowCustom .colRight { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .contactUsWrap .contactUs p.content { margin-top: 30px; line-height: 40px; }
    .contactUsWrap .contactUs .socialIconBlock { margin-top: 60px; }
    .contactUsLocation .locationNav .nav-item .nav-link{ font-size: 18px; }
    .contactUsLocation .txtBox .txtInner .max548 .row { justify-content: center; }
    .contactUsLocation .txtBox .txtInner { display: inline-block; margin: 0 auto; }
    .contactUsLocation .desRow { flex-direction: column; }
    .contactUsLocation .desColLeft { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .contactUsLocation .txtBox .txtInner .item { margin-bottom: 28px; }
    .contactUsLocation .topInfoRow { margin-bottom: 32px; } 
}
@media screen and (max-width: 600px) { 
    .contactUsWrap .placeholderCustom::placeholder { color: #fff; }
    .contactUsWrap .placeholderCustom:-ms-input-placeholder { color: #fff;}
    .contactUsWrap .placeholderCustom::-ms-input-placeholder { color: #fff; }
}
@media screen and (max-width: 575px) { 
    .contactUsWrap .radio02 { margin-left: 16px; }
    .contactUsWrap .productBlock { padding-bottom: 0; margin-bottom: 50px; }
    .contactUsProducts .item { margin-bottom: 15px;  }
    .contactUsWrap .closeBtn { top: -10px; }
    .contactUsLocation .topInfo { max-width: 220px; }
    .contactUsLocation .fs-85 { font-size: 56px; }
    .contactUsLocation .rowCustom { padding-left: 0px; padding-right: 0px;  }
    .contactUsWrap .contactUs p.content { margin-top: 20px; line-height: 30px; font-size: 22px; }
    .contactUsWrap .contactUs .socialIconBlock { margin-top: 40px; }
    .radioBtnWrap { width: 100%; padding-bottom: 15px; }
    .contactUsWrap .contactUsLocation { padding-top: 40px; }
    .contactUsWrap .colInput input.form-control.codeHolder { width: 100%; padding-right: 0; position: relative; }
    .contactUsWrap .codeImg { position: absolute; right: 0; margin-top: 0; bottom: -60px; }
    .contactUsWrap .formRow { margin-right: -9px; margin-left: -9px; width: 100%; max-width: 828px; margin-bottom: 80px;  }
    .contactUsLocation .content { margin-top: 20px; margin-bottom: 30px; }
    .contactUsLocation .locationNav .nav-link { padding-top: 15px; padding-bottom: 15px; font-size: 22px;}
    .contactUsLocation .rightContainer { padding-top: 50px; }
    .contactUsWrap .rowCustom .colLeft { padding-top: 0; }
    .contactUsWrap .rowCustom .colLeft .titleContainer span.fs-85 { font-size: 58px; line-height: 52px; }
    .contactUsLocation .locationNav { flex-direction: column; border-bottom: 0; display: inline-block; margin: 0 auto;  }
    .contactUsLocation .locationNav .nav-item .nav-link { border-bottom: 1px solid #E9E9E9; }
    .contactUsLocation .locationNav .nav-item { max-width: 320px; } 
    .contactUsLocation .txtBox .txtInner .item { margin-bottom: 26px; }
    .contactUsLocation .topInfoRow { margin-bottom: 30px; }  
}


.contactUsWrap .colTextarea textarea.form-control { 
    height: 99%;
    padding: 0; 
    border: 0; 
    padding-top: .5rem; 
    padding-bottom: .5rem; 
    /* color: #D2D2D2 !important; */
     color: #595959;
    font-size: 16px; 
    font-family: 'Noto Sans TC', sans-serif; 
}
.contactUsWrap textarea:focus,
.contactUsWrap input[type="text"]:focus,
.contactUsWrap.uneditable-input:focus {   
  border-color: rgba(0, 0, 0, 0);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0) inset, 0 0 8px rgba(0, 0, 0, 0);
  outline: 0 none;
}

.contactUsWrap .placeholderCustom::placeholder { padding-top: .5rem; }
.contactUsWrap .placeholderCustom:-ms-input-placeholder { padding-top: .5rem; }
.contactUsWrap .placeholderCustom::-ms-input-placeholder { padding-top: .5rem; }


/* --------------- */
/* contactUsOk
/* --------------- */

.contactUsOk { text-align: center; padding-top: 275px;  padding-bottom: 142px;  }
.contactUsOk .txtBox { margin-bottom: 92px; }
.contactUsOk .title { margin-bottom: 20px; }
.contactUsOk .subTitle { margin-bottom: 12px; }

@media screen and (max-width: 768px) { 
    .contactUsOk { padding-top: 160px;  padding-bottom: 90px;  }
    .contactUsOk .txtBox { margin-bottom: 50px; }
}


/* --------------- */
/* aboutWrap
/* --------------- */

.aboutWrap .container-fluid { padding: 0; max-width: 100%; }
.aboutWrap .rowCustom { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.aboutWrap .cols { position: relative; width: 100%; min-height: 1px; }
.aboutWrap .leftTitle { margin-bottom: 38px; padding-left: 0; }
.aboutWrap .toggle { background: #E41E25; color: white; align-items: center; }
.aboutWrap .toggle i { font-size: 12px; }

@media screen and (max-width: 1499px) { 
    .aboutWrap .sec1 { padding-top: 70px; }
    .aboutCompany .colLeft { justify-content: flex-start; padding-left: 20px; padding-right: 20px; } 
    .aboutWrap .aboutCompany .sec1 { padding-top: 0px; }
}


/* --------------- */
/* aboutCompany
/* --------------- */

.aboutCompany { position: relative; flex-grow: 1; background: #fff; padding-top: 120px; }
.aboutCompany .rowCustom { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; align-items: center; }
.aboutCompany .rowCustom .colLeft, .aboutCompany .rowCustom .colRight { position: relative; width: 100%; min-height: 1px; display: flex; }
.aboutCompany .rowCustom .colLeft { -ms-flex: 0 0 54.17%; flex: 0 0 54.17%; max-width: 54.17%; }
.aboutCompany .rowCustom .colRight { -ms-flex: 0 0 45.83%; flex: 0 0 45.83%; max-width: 45.83%; justify-content: flex-start; }
.aboutCompany .rowCustom .imgBox img { width: 100%; height: 100%; object-fit: cover; }

.aboutCompany .rowCustom.row1 { background: #fff; }
.aboutCompany .rowCustom.row1 .colLeft {  justify-content: flex-start; align-self: flex-end; margin-bottom: -72px; }
.aboutCompany .rowCustom.row1 .colRight { /* padding-bottom: 100px; */ padding-bottom: 90px; }
.aboutCompany .rowCustom.row1 .imgBox { max-width: 900px;  }
.aboutCompany .rowCustom.row1 .txtBox .title { margin-bottom: 60px; }

.aboutCompany .rowCustom.row2 { background: #E61D25; padding-bottom: 120px; }
.aboutCompany .rowCustom.row2 .colLeft { justify-content: center; padding-top: 162px;  padding-right: 30px; }
.aboutCompany .rowCustom.row2 .colRight {  align-self: flex-start; margin-top: -75px; }
.aboutCompany .rowCustom.row2 .txtBox { max-width: 536px; }
.aboutCompany .rowCustom.row2 .txtBox .title { margin-bottom: 33px;  }
.aboutCompany .rowCustom.row2 .txtBox .doc { word-spacing: 3px; }
.aboutCompany .rowCustom.row2 .imgBox { max-width: 880px;  }

@media screen and (max-width: 1800px) { 
    .aboutCompany { padding-top: 100px; }
    .aboutCompany .rowCustom.row2 { padding-bottom: 100px; }
    .aboutCompany .rowCustom.row1 .colRight, .aboutCompany .rowCustom.row2 .colRight { justify-content: center; padding-left: 40px; padding-right: 40px; }
    .aboutCompany .rowCustom.row1 .colRight { display: flex; align-items: center; }
    .aboutCompany .rowCustom.row2 .imgBox { max-width: 900px; }
    .aboutCompany .rowCustom.row2 .colLeft { padding-top: 140px; }
}
@media screen and (max-width: 1399px) { 
    .aboutCompany { padding-top: 60px; }
    .aboutCompany .rowCustom.row1 { padding-bottom: 60px; }
    .aboutCompany .rowCustom.row1 .txtBox .title { margin-bottom: 50px; }
    .aboutCompany .rowCustom.row1 .colLeft { justify-content: flex-start; align-self: center; margin-bottom: 0px; }
    .aboutCompany .rowCustom.row1 .colRight { padding-bottom: 0; }
    .aboutCompany .rowCustom.row2 { padding-top: 60px; padding-bottom: 60px; }
    .aboutCompany .rowCustom.row2 .colLeft { padding-top: 30px; }
    .aboutCompany .rowCustom.row2 .colRight {  align-self: center; margin-top: 0px; }
    .aboutCompany .rowCustom.row1 .txtBox .doc { line-height: 36px; }
}
@media screen and (max-width: 991px) { 
    .aboutCompany { padding-top: 80px; }
    .aboutCompany .rowCustom.row1 { padding-bottom: 0; }
    .aboutCompany .rowCustom.row1 .colLeft {  justify-content: flex-start; align-self: flex-end; margin-bottom: -72px; }
    .aboutCompany .rowCustom.row1 .colRight { padding-bottom: 70px; }
    .aboutCompany .rowCustom .colLeft, .aboutCompany .rowCustom .colRight { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .aboutCompany .rowCustom.row2 .colLeft { padding-top: 90px; padding-bottom: 70px; }
    .aboutCompany .rowCustom.row2 .colRight {  align-self: flex-start; margin-top: 0; }
}
@media screen and (max-width: 768px) { 
    .aboutCompany { padding-top: 70px; }
    .aboutCompany .rowCustom.row1 .txtBox .title { margin-bottom: 40px; }
    .aboutCompany .rowCustom.row1 .colRight { padding-bottom: 50px; }
    .aboutCompany .rowCustom.row2 { padding-bottom: 80px; }
    .aboutCompany .rowCustom.row2 .colLeft { padding-top: 130px; padding-bottom: 40px; }
}
@media screen and (max-width: 575px) { 
    .aboutCompany { padding-top: 50px; }
    .aboutCompany .rowCustom.row1 .txtBox .title { margin-bottom: 20px; }
    .aboutCompany .rowCustom.row1 .colRight { padding-bottom: 40px; }
    .aboutCompany .rowCustom.row2 .colLeft { padding-top: 60px;  padding-bottom: 20px; }
    .aboutCompany .rowCustom.row2 { padding-bottom: 60px; }
    .aboutCompany .rowCustom.row2 .txtBox .title { margin-bottom: 20px; }
}


/* --------------- */
/* aboutPower
/* --------------- */

.aboutPower { padding-top: 144px; padding-bottom: 160px; }

.aboutPower .colLeft { -ms-flex: 0 0 34.4%; flex: 0 0 34.4%; max-width: 34.4%; padding-left: 7.55%; padding-top: 90px; padding-right: 7.13%; }
.aboutPower .colLeft .txtWrap { flex-direction: column; text-align: left; margin-bottom: 60px; }
.aboutPower .colRight { -ms-flex: 0 0 65.6%; flex: 0 0 65.6%; max-width: 65.6%; }

.aboutPower .block { display: flex; flex-direction: column; text-align: center; padding: 20px 54px 80px 55px; transition: all .3s; height: 100%; }
.aboutPower .block1 { border: 1px solid #EFEFEF;  }
.aboutPower .block2 { background: #E41E25; color: #fff;  }
.aboutPower .block3 { background: #000; color: #fff;  }

.aboutPower .blockWrap { overflow: hidden; height: 100%; }
.aboutPower .blockWrap .imgBox { display: block;  height: 100px; margin-bottom: 130px; margin-top: 130px;  }
.aboutPower .blockWrap .txtBox { text-align: justify; display: block; margin-top: 20px; letter-spacing: .2px; font-weight: 400; }
.aboutPower .blockWrap .txtBox .title { margin-bottom: 14px;  }

@media screen and (max-width: 1699px) { 
    .aboutPower .blockWrap .imgBox { margin-top: 100px; margin-bottom: 100px; }
}
@media screen and (max-width: 1499px) { 
    .aboutWrap .leftTitle { margin-bottom: 30px; }
    .aboutPower .colLeft .txtWrap {text-align: center;}
    .aboutPower .colLeft { padding-top: 60px; }
    .aboutPower { padding-top: 0px;  padding-bottom: 100px; }    
    .aboutPower .colLeft { justify-content: flex-start;  } 
    .aboutPower .colLeft, .aboutPower .colRight { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding-left: 30px; padding-right: 30px; }
    .aboutPower .blockWrap .imgBox { margin-top: 80px;  margin-bottom: 60px; }
}
@media screen and (max-width: 991px) { 
    .aboutPower .block { padding-bottom: 40px; }
    .aboutWrap .leftTitle { margin-bottom: 20px; }
    .aboutPower .block { flex-direction: row; height: auto; padding: 25px 30px; align-items: center; }
    .aboutPower .blockWrap .imgBox { width: 25%; margin: 0;  margin-right: 20px; display: flex; align-items: flex-end; justify-content: center; }
    .aboutPower .blockWrap .txtBox { width: 75%; }
    .aboutPower .colLeft { justify-content: flex-start; padding-left: 30px; }
    .aboutPower .colLeft .txtWrap { margin-bottom: 70px;  }
    .aboutPower .colRight { padding-left: 20px; padding-right: 20px;  } 
}
@media screen and (max-width: 575px) { 
    .aboutPower { padding-bottom: 80px; }
    .aboutPower .leftTitle { margin-bottom: 20px; }
    .aboutPower .leftTitle span { line-height: 50px; }
    .aboutPower .colLeft { padding-top: 60px; }
    .aboutPower .colLeft .txtWrap { margin-bottom: 50px; padding-right: 15px; }
    .aboutPower .colLeft .txtWrap .lh-42 { line-height: 30px;  }
    .aboutPower .block { flex-direction: column; padding: 40px 20px;  }
    .aboutPower .blockWrap .imgBox { width: 100%;  margin-right: 0px; margin-top: 15px; margin-bottom: 20px; align-items: center; }
    .aboutPower .blockWrap .imgBox img { max-width: 60px; }
    .aboutPower .blockWrap .txtBox { text-align: center; }
    .aboutPower .colRight { padding-left: 15px; padding-right: 15px;  }
}


/* --------------- */
/* aboutLogistics
/* --------------- */

.aboutLogistics { padding-top: 113px; padding-bottom: 130px; }
.aboutLogistics .rowCustom  { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; align-items: center; }
.aboutLogistics .colLeft, .aboutLogistics .colRight { position: relative; width: 100%; min-height: 1px; }
.aboutLogistics .colLeft  { 
    -ms-flex: 0 0 47.25%; flex: 0 0 47.25%; max-width: 47.25%; 
    display: flex; flex-direction: column; justify-content: center; align-items: center; 
}
.aboutLogistics .colRight  { -ms-flex: 0 0 52.75%; flex: 0 0 52.75%; max-width: 52.75%; }

.aboutLogistics .leftContainer { background: #E41E25; height: 698px; width: 100%; display: flex; justify-content: center; align-items: center; }
.aboutLogistics .rightContainer { margin-left: -140px; padding-right: 140px; }

.aboutLogistics .mainTitle { margin-bottom: 60px; }
.aboutLogistics .txtWrap { width: 100%; max-width: 636px; margin: auto; padding-right: 140px; }
.aboutLogistics .imgBox { margin: auto; }

@media screen and (max-width: 1499px) { 
    .aboutLogistics { padding-top: 75px; padding-bottom: 80px; }
    .aboutLogistics .leftContainer { padding-left: 30px; padding-right: 30px;  height: 600px; }
    .aboutLogistics .rightContainer { margin-left: -50px; padding-right: 50px; }
}
@media screen and (max-width: 1200px) { 
    .aboutLogistics .leftContainer { height: 560px; }
    .aboutLogistics .colLeft, .aboutLogistics .colRight  { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .aboutLogistics .rightContainer { margin-left: 0px; padding-left: 50px; padding-right: 50px; margin-top: -50px; }
    .aboutLogistics .txtWrap { padding-right: 0; }
    .aboutLogistics .mainTitle {margin-bottom: 30px; }
}
@media screen and (max-width: 991px) { 
    .aboutLogistics .leftContainer { padding-left: 50px; padding-right: 50px; }
}
@media screen and (max-width: 768px) { 
    .aboutLogistics .leftContainer { height: 500px; }
}
@media screen and (max-width: 575px) { 
    .aboutLogistics .mainTitle.fs-85 { font-size: 48px; line-height: 48px; }
    .aboutLogistics .leftContainer { padding-left: 32px; padding-right: 32px;  }
    .aboutLogistics .rightContainer {  padding-left: 30px; padding-right: 30px; }
}


/* --------------- */
/* newsList
/* --------------- */

.newsList .item { margin-bottom: 61px; }
.newsList .middle { padding-top: 150px;  }
.newsList .middle a { display: block; background: #fff; }

.newsList .slick-track { pointer-events: none; }
.newsList .items { cursor: pointer; border: 1px solid #EFEFEF; transition: all .4s;  }
.newsList .items:hover { background: #E41E25; border-color: #fff; transition: all .4s; color: #fff; }
.newsList .imgBox { overflow: hidden; display: block; }
.newsList .imgBox img { transition: all .4s; width: 100%; height: 100%; object-fit: cover; }
.newsList .items:hover .imgBox img { transform: scale(1.05, 1.05); transition: all .4s; }
.newsList .items .arrowBox { display: none; } 
.newsList .items .arrowBox i:before { display: none; } 
.newsList .items:hover .arrowBox { display: inline-block; border: 5px solid #fff; width: 50px; height: 50px; position: absolute; right: 60px; bottom: 40px; display: flex; justify-content: center; align-items: center; }
.newsList .items:hover .arrowBox i:before { display: block; color: #fff; font-size: 14px; }

.newsList .txtBox { display: flex; flex-direction: column; justify-content: space-between; align-items: space-around; height: 100%; width: 100%; }
.newsList .topBlock .txtBox { padding: 56px 39px 56px 46px; pointer-events: auto; }
.newsList .moreBlock .txtBox { padding: 42px 40px 58px 40px; }

.newsList .items .tag { background: #E41E25; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; transition: all .4s;  }
.newsList .items:hover .tag { background: #000; transition: all .4s; }
.newsList .topBlock .tag { width: 110px; height: 40px; font-size: 16px; }
.newsList .moreBlock .tag { width: 90px; height: 35px; font-size: 14px; }

.newsList .topBlock .content { font-size: 28px; font-weight: 700; font-family: 'Noto Sans TC', sans-serif;  margin-bottom: 20px; }
.newsList .moreBlock .content { font-size: 22px; font-weight: 700; font-family: 'Noto Sans TC', sans-serif;  line-height: 32px; letter-spacing: 1px; margin-bottom: 10px; }

.newsList .items .date { font-family: 'Mukta Vaani', sans-serif; font-size: 15px; font-weight: bold; text-transform: uppercase; margin-top: 22px; word-spacing: 2px;}

.newsList .topBlock { position: relative;  margin-bottom: 35px;  }
.newsList .topBlock .rowTop { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; align-items: center; margin-left: 37px; margin-right: -37px; }
.newsList .topBlock .rowTop .colLeft, .newsList .topBlock .rowTop .colRight { position: relative; width: 100%; min-height: 1px; }
.newsList .topBlock .rowTop .colLeft { -ms-flex: 0 0 45.94%; flex: 0 0 45.94%; max-width: 45.94%;  margin-right: -74px; }
.newsList .topBlock .rowTop .colRight { -ms-flex: 0 0 54.06%; flex: 0 0 54.06%; max-width: 54.06%; }
.newsList .topBlock .leftContainer  { pointer-events: none; } 
.newsList .topBlock .rightContainer { position: relative; }

.newsList .moreBlock .row01 { margin-left: -22px; margin-right: -22px; }
.newsList .moreBlock .row01 .col01 { padding-left: 22px; padding-right: 22px; }
.newsList .moreBlock .items { margin-bottom: 42px; }

.newsList .newsListTextSlick  .slick-slide { margin-left: 28px; margin-right: 28px; }
.newsList .newsListTextSlick  .slick-list { margin-left: -28px; margin-right: -28px; }

.newsList .topItem { border: 1px solid #EFEFEF; height: 505px; background: #FFFFFF; position: relative; }
.newsList .items.topItem:hover { border-color: #E41E25; }
.newsList .items.topItem:hover .arrowBox { right: 40px; }
.newsList .topItem .point { font-size: 28px; font-family: 'Noto Sans TC', sans-serif; font-weight: 700; line-height: 39px; margin-bottom: 0px;  }
.newsList .topItem .detail { font-size: 16px; font-family: 'Montserrat', sans-serif; font-weight: 400; line-height: 30px; }

/* slick number */
.newsList .slick-dotted.slick-slider { margin-bottom: 0; }
.newsList .subSlickNavWrap .dotBox .slick-dots { position: absolute; bottom: -1px; z-index: 20; width: auto; }
.newsList .subSlickNavWrap .dotBox .slick-dots li { width: auto;  margin: 0 7px;  transition: all .3s; -webkit-transition: all .3s; }
.newsList .subSlickNavWrap {
    display: flex; align-items: center; justify-content: flex-end;
    margin-top: -130px; margin-bottom: 100px; 
    margin-right: 26px; 
}
.newsList .subSlickNavWrap .subSlickBtn {
    margin: auto 0;
    width: 40px;
    height: 60px;
    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;
    z-index: 20;
}
.newsList .subSlickNavWrap .subSlickBtn:hover {
    color: #E41E25;
    transition: color .3s; 
    -webkit-transition: color .3s;
}
.newsList .subSlickNavWrap .subSlickBtn i {
  font-size: 18px; font-weight: 600;
}
.newsList .subSlickNavWrap .subSlickBtn.right {
  padding-left: 2px;
}
.newsList .subSlickNavWrap .dotBox .slick-dots {
  position: relative;
  display: flex; flex-direction: row; align-items: center;
    max-width: 600px; flex-wrap: wrap;
}
.newsList .subSlickNavWrap .dotBox .slick-dots li {
  display: block;
  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;
    flex-direction: row; 
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
}
.newsList .subSlickNavWrap .dotBox .slick-dots li:hover button { 
    color: #000;
}
.newsList .subSlickNavWrap .dotBox .slick-dots li button { 
    width: auto; padding: 0; 
    font-size: 20px; font-weight: 700; font-family: 'Montserrat', sans-serif; line-height: 20px; color: #D2D2D2;
    display: flex; align-items: center; transition: all 0.4s; margin: 0 3px;
}
.newsList .subSlickNavWrap .dotBox .slick-dots li button:hover, .newsList .subSlickNavWrap .dotBox .slick-dots li:hover button::before { color: #000; }
.newsList .subSlickNavWrap .dotBox .slick-dots li button::before { 
    font-size: 20px; font-weight: 700; font-family: 'Montserrat', sans-serif; line-height: 20px; color: #D2D2D2; 
    position: relative; width: auto; 
    content: '0'; display: block; opacity: 1; transition: all 0.4s; 
}
.newsList .subSlickNavWrap .dotBox .slick-dots li:nth-child(n + 10) button::before { content: none; }
.newsList .subSlickNavWrap .dotBox .slick-dots li button::after { content: ''; height: 2px; width: 0px; margin-left: 0px; margin-bottom: 1px; background: #000; transition: all 0.4s; }
.newsList .subSlickNavWrap .dotBox .slick-dots li.slick-active button, .newsList .subSlickNavWrap .dotBox .slick-dots li.slick-active button::before { color: #000; }
.newsList .subSlickNavWrap .dotBox .slick-dots li.slick-active button::after { width: 70px; margin-left: 20px; }

@media screen and (max-width: 1530px) { 
    .newsList .paginationContainer { padding-left: 60px; padding-right: 60px;  }
}
@media screen and (max-width: 1499px) { 
    .newsList .items:hover .arrowBox { border: 2px solid #fff; width: 25px; height: 25px; top: 10px; right: 10px; font-size: 12px;  }
    .newsList .items.topItem:hover .arrowBox { right: 10px; }
    .newsList .moreBlock .txtBox { padding: 40px 30px 30px 40px; } 
    .newsList .topBlock .rowTop { margin-left: 31px; }
    .newsList .topBlock .rowTop .colLeft {  margin-right: -67px; }
    .newsList .subSlickNavWrap { margin-top: -100px; margin-bottom: 70px; }
}
@media screen and (max-width: 1350px) { 
     .newsList .subSlickNavWrap { margin-top: -50px; margin-bottom: 20px; } 
}
@media screen and (max-width: 1200px) { 
    .newsList .moreBlock { padding-left: 8px; padding-right: 8px; }
    .newsList .topItem { height: 400px; }
    .newsList .topBlock .rowTop { margin-left: 37px; }
    .newsList .topBlock .rowTop .colLeft { margin-right: -74px; }
    .newsList .paginationContainer { padding-left: 65px; padding-right: 65px;  }
}
@media screen and (max-width: 991px) { 
    .newsList .topBlock .txtBox { padding: 20px 30px; }   
    .newsList .topBlock .rowTop { margin-left: 0; margin-right: 0; justify-content: center; }
    .newsList .topBlock .rowTop .colLeft { margin-right: -56px; }
    .newsList .topItem { height: 300px; }
    .newsList .paginationContainer { padding-left: 46px; padding-right: 46px;  }
}
@media screen and (max-width: 768px) { 
    .newsList .middle { padding-top: 100px; }
    .newsList .middle.blank { padding-left: 0px; padding-right: 0; }
    .newsList .topBlock { padding-left: 15px; padding-right: 15px; }
    .newsList .topBlock .rowTop .colLeft, .newsList .topBlock .rowTop .colRight {  -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .newsList .topBlock .rowTop { margin-left: 0; margin-right: 0; margin-bottom: 35px; padding-left: 12px; padding-right: 12px;  }
    .newsList .topBlock .imgBox { height: 400px; }
    .newsList .topBlock .txtBox { padding: 30px; }
    .newsList .topBlock .item { margin-bottom: 0; }
    .newsList .topBlock .rowTop .colLeft { margin-right: 0; }
    .newsList .topItem { height: 300px; }
    .newsList .topItem .point { font-size: 24px; line-height: 32px; }
    .newsList .slickControl { position: static; bottom: auto; width: 100%; }
    .newsList .slickControl .prev { right: auto; bottom: 0; transform: translateY(40px); left: 17%; }
    .newsList .slickControl .next { right: 0; bottom: 0; transform: translateY(40px); right: calc(17% + 10px); }
    .newsList .moreBlock .row01 { margin-left: -15px; margin-right: -15px; }
    .newsList .moreBlock .row01 .col01 { padding-left: 15px; padding-right: 15px; }
    .newsList .moreBlock { padding-top: 30px; }
    .newsList .moreBlock .content { margin-top: 15px; font-size: 20px; }
    .newsList .moreBlock .txtBox { padding: 30px; }
    .newsList .paginationContainer { justify-content: center; }
    .newsList .paginationContainer .arrowWrap { display: none; }
    .newsList .paginationWrap .d-mobile-pag { display: inline-block; }
    
    .newsList .subSlickNavWrap { margin: 0; justify-content: center; }
    .newsList .subSlickNavWrap .dotBox .slick-dots li { margin: 0 4px; }
    .newsList .subSlickNavWrap .dotBox .slick-dots li.slick-active button::after { width: 40px; }
}
@media screen and (max-width: 575px) { 
    .newsList .newsListTextSlick { transition: all .4s; }
    .newsList .newsListTextSlick:hover { background: #E41E25; transition: all .4s; }
    .newsList .newsListTextSlick:hover .items { background: #E41E25; }
    .newsList .newsListTextSlick:hover .items:hover .tag { background: #000; transition: all .4s; }
    .newsList .item { margin-bottom: 30px; }
    .newsList .max1454 { max-width: 1380px; }
    .newsList .topBlock .rowTop { margin-left: 12px; margin-right: 12px; padding-left: 0; padding-right: 0; border: 1px solid #EFEFEF;}
    .newsList .topBlock .rowTop .colLeft { margin-right: 0; }
    .newsList .topBlock .leftContainer { max-width: 100%; }
    .newsList .topBlock .rightContainer  { max-width: 100%; }
    .newsList .topBlock .imgBox { height: 280px; }
    .newsList .topItem { border: 0;  height: 300px;  }
    .newsList .topItem .point { margin-top: 10px; margin-bottom: 10px; }
    .newsList .topItem .detail { line-height: 24px; }
    .newsList .newsListTextSlick .slick-list { margin-left: 0; margin-right: 0; }
    .newsList .newsListTextSlick .slick-slide { margin-left: 0; margin-right: 0; }
    .newsList .txtBox { padding: 20px; }
    .newsList .middle { padding-top: 70px; }
    .newsList .middle .content { font-size: 18px; margin-bottom: 5px; line-height: 28px; }
    .newsList .middle .data { font-size: 12px; }
    .newsList .topBlock .rowTop { margin-bottom: 5px; }
    .newsList .subSlickNavWrap .dotBox .slick-dots { display: none !important; }
}


/* --------------- */
/* newsDetail
/* --------------- */

.pages .newsDetail .breadcrumbWrap { top: 145px; right: 14%;  padding-left: 15px; }
.pages .newsDetail .breadcrumb > li { color: #D2D2D2; }
.pages .newsDetail .breadcrumb > li a { color: #D2D2D2; }
.pages .newsDetail .breadcrumb > li + li::before { color: #D2D2D2; }
.pages .newsDetail .breadcrumb > .active { color: #595959; }

.newsDetail  { padding-top: 140px; }
.newsDetail.blank  { padding-left: 30px; padding-right: 30px; }
.newsDetail .ContentContainer { display: flex; justify-content: space-between; }

.newsDetail .newsMainContainer { width: 915px; position: relative; padding-top: 120px; padding-bottom: 108px; }
.newsDetail .newsMainContainer .top { position: relative; display: flex; justify-content: space-between; margin-bottom: 90px; }
.newsDetail .newsMainContainer .top .tag { color: #fff; font-size: 16px; font-weight: 500; font-family: 'Noto Sans TC', sans-serif; background: #E41E25; width: 112px; text-align: center; height: 40px; display: flex; justify-content: center; align-items: center; }

.newsDetail .arrowBtn { margin-top: -5px; }
.newsDetail .arrowBtn .borderArrow { margin-left: 0; margin-right: 48px; -webkit-transform: scaleX(-1); transform: scaleX(-1); }

.newsDetail .newsSideContainer { width: 330px; position: relative; padding-top: 260px; }
.newsDetail .newsSideContainer .item { margin-top: 40px; }
.newsDetail .newsSideContainer .item .imgBox { margin-bottom: 20px; overflow: hidden; width: 100%; }
.newsDetail .newsSideContainer .item .imgBox img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.newsDetail .newsSideContainer .item:hover .imgBox img { transform: scale(1.05, 1.05); transition: transform .4s; }
.newsDetail .newsSideContainer .item .t01 { color: #000; transition: all .4s; }

.newsDetail .date { font-family: 'Mukta Vaani', sans-serif; font-weight: 400px; font-size: 16px; color: #000; transition: all .4s; }
.newsDetail .newsSideContainer .item:hover .t01 { color: #E41E25; transition: all .4s; }
.newsDetail .des { display: flex; position: relative; margin-top: 25px; margin-bottom: 50px; }
.newsDetail .des p { margin-bottom: 0; }
.newsDetail .des .date { display: flex; font-weight: 700; font-size: 18px; position: relative; text-transform: uppercase; word-spacing: 2px; }
.newsDetail .des .date::after { content: '';  background: #595959; width: 0.7px; height: 16px; margin-left: 36px; position: absolute; right: -36px; top: 49%; transform: translateY(-50%);  }
.newsDetail .des .tags { display: flex; margin-left: 72px; }
.newsDetail .des .tags p { color: #595959; margin-right: 15px; }
.newsDetail .content { border-top: 5px solid #E41E25; padding-top: 52px; }
.newsDetail .content img { max-width: 100%; height: auto !important; margin-bottom: 49px;}
.newsDetail .content p { color: #595959; }
.newsDetail .content .t1 { margin-bottom: 20px; }
.newsDetail .content .t2 { line-height: 36px; margin-bottom: 24px;  }
.newsDetail .content ul { margin-bottom: 79px; }
.newsDetail .content ul li { margin-bottom: 14px;  letter-spacing: .3px; }
.newsDetail .content a { color: #DA291C; text-decoration: underline;  }
.newsDetail .socialIconBlock { margin-top: 80px; }

@media screen and (max-width: 1699px) { 
    .pages .newsDetail .breadcrumbWrap {  right: 120px; }
}

@media screen and (max-width: 1499px) { 
    .pages .newsDetail .breadcrumbWrap {  right: 100px; }
    .newsDetail .newsMainContainer { width: 70%; }
    .newsDetail .newsSideContainer { width: 25%; }
}

@media screen and (max-width: 1299px) { 
    .pages .newsDetail .breadcrumbWrap { top: 100px; right: 30px; }
    .newsDetail .newsMainContainer { padding-top: 70px; }
    .newsDetail .fs-58 { line-height: 60px;  }
    .newsDetail .newsMainContainer { width: 68%; }
    .newsDetail .newsMainContainer .top { margin-bottom: 50px; }
    .newsDetail .newsSideContainer { padding-top: 194px; width: 27%; }
}

@media screen and (max-width: 1200px) { 
    .newsDetail .newsMainContainer .top { margin-bottom: 70px; }
    .newsDetail .newsSideContainer .item { margin-top: 50px; }
    .newsDetail .newsSideContainer .item .imgBox { margin-bottom: 18px; }
}
@media screen and (max-width: 991px) { 
    .newsDetail .newsMainContainer .top { margin-bottom: 50px; }
    .newsDetail .newsMainContainer { width: 100%; }
    .newsDetail .newsSideContainer { display: none; }
}

@media screen and (max-width: 575px) { 
    .pages .newsDetail .breadcrumbWrap { top: 90px; text-align: right; }
    .newsDetail .newsMainContainer { padding-top: 60px; padding-bottom: 90px;  }
    .newsDetail .newsMainContainer .top { margin-bottom: 40px; }
    .newsDetail .newsMainContainer .top .backBtn1 .iconBox { margin-right: 30px; }
    .newsDetail .fs-58 { line-height: 48px;  }
    .newsDetail .des { margin-top: 25px; margin-bottom: 15px; flex-direction: column; }
    .newsDetail .des .date::after { width: 0; }
    .newsDetail .des .tags { margin-left: 0; margin-top: 15px; display: flex; flex-wrap: wrap; }
    .newsDetail .des .tags p { margin-right: 8px; width: 30%; }
    .newsDetail .content { padding-top: 40px;}
}


/* --------------- */
/* productWrap
/* --------------- */

.productWrap .select-selected { background-color: #EFEFEF; padding-bottom: 10px; }
.productWrap .item { margin-bottom: 15px; display: flex; flex-direction: column; justify-content: space-around; align-items: center; }
.productWrap .item .name { word-spacing:  5px; margin-bottom: 14px; line-height: 26px; }
.productWrap .item a {  transition: all .4s; padding-top: 60px; padding-bottom: 40px;  padding-left: 50px; padding-right: 50px; text-align: left;  position: relative; display: block; z-index: 4;}
.productWrap .item a:hover {  box-shadow: 0 0 20px rgba(0, 0, 0, 0.12);  transition: all .4s; }
.productWrap .item a .readMoreBtn { visibility: hidden; background: #E41E25; color: #fff; width: 200px; height: 60px; display: flex; align-items: center; justify-content: center; font-size: 16px; position: absolute; bottom: -60px; opacity: 0; transition: all .4s; right: 0; z-index: 5; }
.productWrap .item a .readMoreBtn i:before { font-size: 12px;}
.productWrap .item a .readMoreBtn .txt { margin-right: 25px; text-align: left; font-family: 'Mukta Vaani', sans-serif; font-weight: bold; margin-bottom: -5px;}
.productWrap .item a:hover .readMoreBtn { visibility: visible; bottom: -30px; opacity: 1;  transition: all .4s;  }
.productWrap .item a .imgBox { margin-bottom: 15px; }

.productWrap .tabWrap { width: 100%; max-width: 1354px; position: relative; }
.productWrap .tabRow {
    display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; 
    display: flex;  width: 100%; max-width: 1354px; 
}
.productWrap .tabRow .colWhite, .productWrap .tabRow .colRed { position: relative; width: 100%; min-height: 1px; }
.productWrap .tabRow .colWhite { background: #EFEFEF; -ms-flex: 0 0 68.39%; flex: 0 0 68.39%; max-width: 68.39%; }
.productWrap .tabRow .colWhite .whiteRow { 
    display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; position: relative; 
    display: flex; justify-content: flex-end; align-items: center; 
    width: 100%;
}
.productWrap .tabRow .colRed { 
    background: #E41E25; display: flex; justify-content: center; align-items: center; height: 100px; position: relative; 
    -ms-flex: 0 0 31%; flex: 0 0 31%; max-width: 31%; 
}
.productWrap .tabRow .colRed i { font-size: 18px; }

.productWrap .tabRow .colWhite .col1, .productWrap .tabRow .colWhite .col2 {
    position: relative; width: 100%; min-height: 1px; 
    -ms-flex: 0 0 32.94%; flex: 0 0 32.94%; max-width: 32.94%;
    margin-top: -6px; 
}
.productWrap .tabRow .colWhite .col3 { 
    -ms-flex: 0 0 22.46%; flex: 0 0 22.46%; max-width: 22.46%; justify-content: flex-start; 
}

.productWrap .tabRow .colWhite .col1 { display: flex; position: relative; }
.productWrap .tabRow .colWhite .col1::after { content: ''; position: absolute; width: 1px; height: 25px; background: #D2D2D2; top: 42%; transform: rotateY(-55%); right: 0px; }

.productWrap .tabRow .colWhite .col2 { display: flex; }
.productWrap .tabRow .colWhite .col2 { position: relative; }

.productWrap .tabRow .colWhite .whiteRow .colInner {  
    position: relative; width: 100%; 
    height: 100px; display: flex; align-items: center; 
}
.productWrap .tabRow .colWhite .whiteRow .col1 .colInner, .productWrap .tabRow .colWhite .whiteRow .col2 .colInner {  
    justify-content: center; align-items: center; 
}
.productWrap .tabRow .colWhite .whiteRow .col3 .colInner {  
    justify-content: start; align-items: center; 
}
.productWrap .tabRow .colWhite .col3 .tabSearchBtn {
    background: #000; text-transform: uppercase; color: #fff; border-radius: 60px; width: 157px; height: 60px;display: flex; align-items: center; justify-content: center; cursor: pointer;  transition: all .3s;
}
.productWrap .tabRow .colWhite .col3 .tabSearchBtn:hover {
   background: rgba(0, 0, 0, 0.8);  transition: all .3s;
}
.productWrap .tabRow .colWhite .col3 .tabSearchBtn i { font-size: 14px;  transform: translateY(-7px); }

.productWrap .tabRow .formBox { display: flex; align-items: center; justify-content: center; position: relative; transition: all 0.4s; width: 100%;  }
.productWrap .formBox { display: block; }

.productWrap .searchInputForm { width: 100%; text-align: center; }
.productWrap .searchInputForm i { transition: all .3s; font-size: 20px; margin-left: -30px;  }
.productWrap .searchInputForm i:hover { text-shadow: 0 2px 5px #595959; transition: all .3s; }
.productWrap .searchInputBox {
    border: 0;
    border-radius: 0; 
    border-bottom: 1px solid #fff; 
    color: #fff; 
    padding-bottom: 10px; 
    width: 297px; 
}
.productWrap .searchInputBox::placeholder { color: #fff; font-size: 16px; font-weight: 500; font-family: 'Noto Sans TC', sans-serif; letter-spacing: 0.5px; }
.productWrap .searchInputBox:-ms-input-placeholder { color: #fff; font-size: 16px; font-weight: 500; font-family: 'Noto Sans TC', sans-serif; letter-spacing: 0.5px; }
.productWrap .searchInputBox::-ms-input-placeholder { color: #fff; font-size: 16px; font-weight: 500; font-family: 'Noto Sans TC', sans-serif; letter-spacing: 0.5px; }

.productWrap .custom-select1 { width: 100%; max-width: 221px; }
.productWrap .item .inner .imgBox { display: block; overflow: hidden; }
.productWrap .item .inner .imgBox img { width: 100%; height: 100%; object-fit: cover; transition: all .4s; }

@media screen and (max-width: 1900px) {
    .productWrap .tabRow .colWhite .col1, .productWrap .tabRow .colWhite .col2 {
        -ms-flex: 0 0 32.94%; flex: 0 0 32.94%; max-width: 32.94%;
    }
    .productWrap .tabRow .colWhite .col3 { -ms-flex: 0 0 32.94%; flex: 0 0 32.94%; max-width: 32.94%; }
    .productWrap .tabRow .colRed { -ms-flex: 0 0 31.61%; flex: 0 0 31.61%; max-width: 31.61%; }
 }

@media screen and (max-width: 1690px) {
   .productWrap .tabRow .colWhite { padding-left: 0px; }
}

@media screen and (max-width: 1399px) {
   .productWrap  .tabRow { width: 100%; }
}

@media screen and (max-width: 1200px) {
    .productWrap .item { margin-bottom: 25px; padding-left: 25px; padding-right: 25px; padding-top: 25px;  }
    .productWrap .item a { padding: 30px; padding-top: 10px;  }
    .productWrap .searchInputBox { width: calc(100% - 19px); }
    .productWrap .tabRow .formBox { width: 100%; }
    .productWrap .tabRow .colWhite .col0 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; }
    .productWrap .tabRow .colWhite .col3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }
    .productWrap .tabRow .colWhite .col3  .colInner { justify-content: flex-start; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow { justify-content: space-between; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col1::after { right: auto; left: 100%; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col1,.productWrap .tabRow .colWhite .col0 .dropdownRow .col2 { justify-content: flex-start; }
    .productWrap .tabRow .colWhite .whiteRow {  width: 100%; margin: auto; justify-content: space-between;  padding-left: 32px; padding-right: 30px; }
    .productWrap .tabRow .colWhite .whiteRow .col1 .colInner { justify-content: flex-start; }
    .productWrap .tabRow .colWhite { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .productWrap .tabRow .colRed { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding-left: 30px; padding-right: 30px; }
    .productWrap .tabRow .colWhite .whiteRow .col0 .colInner { justify-content: flex-start; }
    .productWrap .tabRow .colWhite .whiteRow .col3 .colInner { justify-content: flex-end; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col1::after { right: auto;  left: 84.5%;  }
    .productWrap .searchInputForm { margin-left: -5px; }
}

@media screen and (max-width: 991px) {
    .productWrap .tabRow .colWhite .whiteRow { padding-left: 22px; padding-right: 20px; }
    .productWrap .tabRow .colWhite .whiteRow .colInner { max-width: 95%; }
    .productWrap .tabRow .colWhite .col0 { -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col2 { justify-content: flex-end; }
    .productWrap .tabRow .colWhite .col3 { -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; display: flex; justify-content: flex-end; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col1::after { display: none; }
    .productWrap .tabRow .colRed { padding-left: 20px; padding-right: 20px; }
}

@media screen and (max-width: 900px) {
    .productWrap .tabRow .colWhite .col1::after { display: none; }
}

@media screen and (max-width: 767px) {
    .productWrap .tabRow .colWhite { padding-left: 0; }
    .productWrap .tabRow .colWhite .whiteRow .colInner { max-width: 100%; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow { justify-content: center; }
    .productWrap .tabRow .colWhite .col0 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .productWrap .tabRow .colWhite .col0 .col1,.productWrap .tabRow .colWhite .col0 .dropdownRow .col2 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .productWrap .tabRow .colWhite .col0 .col1::after { width: 0; display: none; }
    .productWrap .tabRow .colWhite .col3 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .productWrap .tabRow .colWhite .whiteRow .col1 .colInner, .productWrap .tabRow .colWhite .whiteRow .col2 .colInner { height: 80px; }
    .productWrap .tabRow .colWhite .whiteRow .col3 .colInner { height: 90px; }
    .productWrap .item { padding: 0; }
    .productWrap .tabRow .colWhite .whiteRow { width: 100%; flex-direction: column; justify-content: center; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col1,.productWrap .tabRow .colWhite .col0 .dropdownRow .col2 { justify-content: center; }
    .productWrap .tabRow .colWhite .whiteRow .col0 .colInner { justify-content: center; }
    .productWrap .tabRow .colWhite .whiteRow .col3 .colInner { justify-content: center; }
    .productWrap .tabRow .colWhite .whiteRow { padding-top: 10px; padding-bottom: 5px; }
    .productWrap .tabRow .colWhite .col0 .dropdownRow .col1, .productWrap .tabRow .colWhite .col0 .dropdownRow .col2 { 
        -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; 
    }
    .productWrap .tabRow .colWhite .whiteRow .col1 .colInner, .productWrap .tabRow .colWhite .whiteRow .col2 .colInner { height: 60px; }
    .productWrap .tabRow .colWhite .whiteRow .col3 .colInner { height: 100px; }
    .productWrap .item .inner .imgBox { max-width: 250px; margin: auto; }
    .productWrap .custom-select1 { max-width: 89%; margin-right: -5px; }
    .productWrap .tabRow .colWhite .whiteRow .col1 .colInner { justify-content: center; }
    .productWrap .tabRow .colWhite .col1, .productWrap .tabRow .colWhite .col2 { max-width: 100%; }
}


/* --------------- */
/* searchResult
/* --------------- */

.searchResult .searchResultTitle { padding-top: 93px; padding-bottom: 80px; }
.searchResult .paginationContainer .arrowWrap { display: flex; justify-content: flex-end; align-items: center; }

@media screen and (max-width: 1200px) {
    .searchResult .paginationContainer { padding-left: 25px; padding-right: 25px; }
}
@media screen and (max-width: 991px) {
    .searchResult .searchResultTitle { padding-top: 60px; padding-bottom: 60px; }
}
@media screen and (max-width: 768px) {
    .searchResult .searchResultTitle { padding-top: 50px; padding-bottom: 10px; }
    .searchResult .item a { padding: 32px; }
    .searchResult .paginationContainer { justify-content: center; }
    .searchResult .paginationContainer .arrowWrap { display: none; }
    .searchResult .paginationWrap .d-mobile-pag { display: inline-block; }
}
@media screen and (max-width: 575px) {
    .searchResult .searchResultTitle { padding-bottom: 30px; }	
}


/* --------------- */
/* productsList
/* --------------- */

.productsList .max7739 { max-width: 77.39%; }
.productsList .wrapRow {  display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.productsList .wrapRow .leftCol, .productsList .wrapRow .rightCol { position: relative; width: 100%; min-height: 1px; }
.productsList .wrapRow .leftCol { -ms-flex: 0 0 22.61%; flex: 0 0 22.61%; max-width: 22.61%; }
.productsList .wrapRow .rightCol { -ms-flex: 0 0 77.39%; flex: 0 0 77.39%; max-width: 77.39%; }

.productsList .leftContainer { padding-top: 82px; width: 100%; max-width: 324px; text-align: left; margin-left: -10px; }
.productsList .leftContainer .mainTitle { margin-bottom: 0; padding-bottom: 28px; border-bottom: 2px solid #000; padding-left: 24px; letter-spacing: 0.75px;  }
.productsList .collapseWrap { display: block; }
.productsList .collapseWrap .typeBox { height: 72px; display: flex; align-items: center; color: #000; padding-left: 24px; border-bottom: 2px solid #F1F1F1; display: flex; justify-content: space-between; padding-right: 21.5px; }

.productsList .collapseWrap .typeBox:hover { color: #E41E25; }
.productsList .collapseWrap .collapseItem .typeBox .iconBox { padding-right: 4px;  transform: rotate(0deg); transition: transform .3s; color: #000; }
.productsList .collapseWrap .collapseItem .typeBox .iconBox i::before { font-size: 6px; }
.productsList .collapseWrap .collapseItem.active .typeBox .txtBox{ color: #E41E25; }
.productsList .collapseWrap .collapseItem.active .typeBox .iconBox { transform: translateX(-4px) rotate(180deg); transition: transform .3s; }

.productsList .collapseWrap .collapseItem .contentInner { display: flex; flex-direction: column; padding-left: 41.4px; padding-top: 46px; padding-bottom: 48px; border-bottom: 2px solid #F1F1F1; }
.productsList .collapseWrap .collapseItem .contentInner a { font-size: 16px; margin-bottom: 20px; letter-spacing: .4px; color: #595959;}
.productsList .collapseWrap .collapseItem .contentInner a:hover { text-decoration: underline; color: #000; }
.productsList .collapseWrap .collapseItem .contentInner a.active { color: #E41E25; }
.productsList .collapseWrap .collapseItem .contentInner a.active:hover { color: #E41E25; }
.productsList .collapseWrap .typeBox .txtBox { font-weight: 700; font-size: 18px; }
.productsList .leftContainer .mainTitle { font-weight: 700; font-size: 20px;  }
.productsList .leftContainer .mainTitle .iconBox { display: none; }

@media screen and (max-width: 1699px) { 
    .productsList .leftContainer { margin-left: 0px; padding-left: 5px; }
}

@media screen and (max-width: 1499px) { 
    .productsList .max7739 { max-width: 73%; }
    .productsList .wrapRow .leftCol { -ms-flex: 0 0 27%; flex: 0 0 27%; max-width: 27%; padding-right: 30px; }
    .productsList .wrapRow .rightCol { -ms-flex: 0 0 73%; flex: 0 0 73%; max-width: 73%; }
    .productsList .leftContainer { margin-left: 0px; }
    .productsList .collapseWrap .typeBox { height: 62px; }
}


@media screen and (max-width: 1200px) { 
    .productsList .wrapRow .leftCol, .productsList .wrapRow .rightCol { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .productsList .wrapRow .leftCol { display: flex; justify-content: center; padding-bottom: 20px; padding-right: 0; }
    .productsList .leftContainer { padding-left: 0; padding-top: 20px; max-width: 100%; }
    .productsList .collapseWrap {  display: none; }
    .productsList .collapseWrap.show {  display: block; }
    .productsList .leftContainer .mainTitle { 
        margin-top: 10px; padding-left: 15px; padding-right: 10px; padding-top: 10px; padding-bottom: 11px; 
        font-size: 16px; font-weight: 600; background: #fff; color: #000; 
        border-bottom: 0; margin-bottom: 4px;  cursor: pointer; 
        display: flex; justify-content: space-between; 
        border: 1px solid #EFEFEF; 
    }
    .productsList .leftContainer .mainTitle .iconBox { display: inline-block;  transform: scale(0.45, 0.45) rotate(0deg); transition: transform .3s;  }
    .productsList .leftContainer .mainTitle.show .iconBox { display: inline-block; transform: scale(0.45, 0.45) translate(-1px, 1px) rotate(180deg); transition: transform .3s;  }
    .productsList .leftContainer .mainTitle:hover .iconBox { color: #E41E25; transition: all .3s; }
    .productsList .collapseWrap .typeBox { height: 47px; padding-left: 17px; border-bottom: 1px solid #F1F1F1; }
    .productsList .collapseWrap .collapseItem .contentInner { padding-top: 16px; padding-bottom: 12px; }
    .productsList .collapseWrap .collapseItem .contentInner a { margin-bottom: 12px; }
    .productsList .rightContainer { padding-left: 30px; padding-right: 30px;  margin: 0 auto; }
    .productsList .max7739 { max-width: 100%; }
    .productsList .paginationContainer { justify-content: center; }
    .productsList .paginationContainer .arrowWrap { display: none; }
    .productsList .paginationWrap .d-mobile-pag { display: block; }
    .productsList .collapseWrap .typeBox .txtBox { font-weight: 500; font-size: 16px; }
    .productsList .collapseWrap .typeBox { padding-right: 15px; }
}
    
@media screen and (max-width: 991px) { 
    .productsList .paginationContainer .arrowWrap { display: none; }
    .productsList .paginationWrap .d-mobile-pag { display: inline-block; }
}

@media screen and (max-width: 768px) { 
    .productsList .rightContainer { padding-left: 0; padding-right: 0; }
}

@media screen and (max-width: 575px) { 
    .productsList .leftContainer { max-width: 100%; }
    .productsList .rightContainer { padding-left: 0px; padding-right: 0px; }
    .productWrap .item { margin-bottom: 30px; }
}


/* --------------- */
/* productsDetail
/* --------------- */

.pages .productsDetail .breadcrumbWrap { right: auto; position: static; } 
.pages .productsDetail .breadcrumb { justify-content: flex-start; } 

.productsDetail  { position: relative; margin-top: 100px;  }
.productsDetail .col001 .title { max-width: 360px; font-family: 'Mukta Vaani', sans-serif; font-size: 70px; font-weight: 800; line-height: 67px; }
.productsDetail .col001 .title span { font-family: 'Noto Sans TC', sans-serif; font-size: 42px; font-weight: 700; display: block; margin-top: 10px; }
.productsDetail .arrowBtn { margin-top: 40px; }

.productsDetail .breadcrumb > li { color: #D2D2D2; }
.productsDetail .breadcrumb > li a { color: #D2D2D2; }
.productsDetail .breadcrumb > li + li::before { color: #D2D2D2; }

.productsDetail .containerCustom { width: 100%; max-width: 1920px; margin: 0 auto; }
.productsDetail .net { z-index: 1; }
.productsDetail .net::before { 
    content: ""; position: absolute; top: 0; bottom: 0;
    display: block; pointer-events: none; z-index: 1; 
    border-left: 2px solid rgba(210, 210, 210, 0.3); border-right: 2px solid rgba(210, 210, 210, 0.3); 
    left: calc((54.16% + 1px)); width: calc((22.92% - 2px)); max-width: calc((22.92% - 2px));
}

.productsDetail .prodetailContainer  { position: relative; z-index: 2; padding-top: 40px; }
.productsDetail .prodetailContainer p { margin-bottom: 0; }
.productsDetail .rowCustom { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; }
.productsDetail .rowCustom .col001 { 
    -ms-flex: 0 0 30.81%; 
    flex: 0 0 30.81%; 
    max-width: 30.81%;
    padding-top: 45px;
    padding-bottom: 150px;
}
.productsDetail .rowCustom .col002 {
    -ms-flex: 0 0 24.73%;
    flex: 0 0 24.73%;
    max-width: 24.73%; 
    padding-top: 45px; 
    padding-bottom: 45px; 
   margin-bottom: 100px;
}
.productsDetail .rowCustom .col003 { 
    -ms-flex: 0 0 44.46%;
    flex: 0 0 44.46%; 
    max-width: 44.46%; 
    position: relative; 
}
.productsDetail .rowCustom .col004 { -ms-flex: 0 0 55.54%; flex: 0 0 55.54%; max-width: 55.54%; margin-top: -100px; }
.productsDetail .prodetailContainer .col002 .item { margin-bottom: 26px; }

.productsDetail p.type1 { font-family: 'Noto Sans TC', sans-serif; font-size: 18px; font-weight: bold; margin-bottom: 40px; padding-top: 3px; }
.productsDetail p.type2 { font-family: 'Noto Sans TC', sans-serif; font-size: 16px; color: #595959; margin-bottom: 2px; }
.productsDetail .content { font-family: 'Noto Sans TC', sans-serif; font-size: 16px; font-weight: bold; }
.productsDetail .content ul li { margin-bottom: 26px; letter-spacing: .3px; }
.productsDetail .iconBox { display: flex; margin-right: 23px; align-items: center; }
.productsDetail .iconBox img { margin-right: 10px; }
.productsDetail .catalogBtn { background: #000; width: 100%; max-width: 184px; height: 39px;  color: #fff; border-radius: 5px; display: flex; justify-content: center; align-items: center; transition: background .3s;}
.productsDetail .catalogBtn:hover { background: rgba(0, 0, 0, 0.6); transition: background .3s; }

.productsDetail .imgContainer { padding-left: 82px; padding-bottom: 140px; }
.productsDetail .imgContainer .imgBox { width: 100%; height: 100%;  }
.productsDetail .imgContainer .imgBox img { width: 100%; height: 100%; object-fit: cover; }
.productsDetail .imgContainer .dlBtn { background: #E41E25; position: absolute; bottom: 0; left: 0; transition: background .3s; }
.productsDetail .imgContainer .dlBtn:hover { background: rgba(228, 30, 37, 0.6); transition: background .3s; }
.productsDetail .imgContainer .dlBtn .inner {  color: #fff; width: 140px; height: 140px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.productsDetail .imgContainer .dlBtn .inner .txt { margin-top: 0.5rem;  }

.productsDetail .bottomContainer { text-align: center; border-top: 1px solid rgba(210, 210, 210, 0.5); padding-top: 115px; padding-bottom: 138px; position: relative; }
.productsDetail .bottomContainer .detail1Container p ~ .imgBox { margin-top: 129px; }
.productsDetail .bottomContainer .detail1Container img { max-width: 100%; height: auto; }
.productsDetail .bottomContainer .tab-content>.active { font-size: 0; }

.productsDetail .bottomContainer .item { position: relative; margin-bottom: 70px;  transition: all .3s;}
.productsDetail .bottomContainer .item .imgInner .mainImg { transition: all .3s; }
.productsDetail .bottomContainer .item:hover .imgInner .mainImg { transform: scale(1.05, 1.05); transition: all .3s; }
.productsDetail .bottomContainer .item .imgInner { width: 474px; max-width: 100%;  height: 266px; display: flex; justify-content: center; align-items: center; border: 1px solid #EFEFEF;  position: relative; margin: auto; margin-bottom: 26px; overflow: hidden; }
.productsDetail .bottomContainer .item .imgInner img {  max-width: 206px; margin: auto; transition: all .3s; }
.productsDetail .bottomContainer .item .iconInner { position: absolute; right: 24px; bottom: 24px; }

.productsDetail .footerContainer { border-top: 1px solid rgba(210, 210, 210, 0.5); }

/* pill */
.productsDetail .pillCustom {  display: flex; justify-content: space-between; align-items: center;  }
.productsDetail .pillCustom .pillRow { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.productsDetail .pillCustom .pillRow .pillCol { 
    position: relative; width: 100%; min-height: 1px; 
    -ms-flex: 0 0 33.33%; flex: 0 0 33.33%; max-width: 33.33%; 
}
.productsDetail .pillCustom li.nav-item { margin-top: 5px; }
.productsDetail .pillCustom li.nav-item a.nav-link { color: #595959; width: 100%; max-width: 190px; border-bottom: 5px solid #EFEFEF; margin-bottom: 0px; padding: 0; padding-bottom: 12px; border-radius: 0; background: #fff; background: transparent; margin-right: 10px;  font-size: 18px; font-family: 'Noto Sans TC', sans-serif; font-weight: bold; transition: all .3s; }
.productsDetail .pillCustom li.nav-item a.nav-link:hover { border-color: #E41E25; color: #000; transition: all .3s; }
.productsDetail .pillCustom li.nav-item a.nav-link.active { border-color: #E41E25; color: #000; }
.footerContainer .footerRow { display: flex; justify-content: space-between; align-items: center; padding-top: 90px; padding-bottom: 90px; padding-left: 15px; padding-right: 15px; }
.productsDetail .pillCustom .nav-pills  { align-items: flex-end; }


/* product modal */
#addProductsModal { padding-right: 0 !important; }
#addProductsModal .modal-content { border-radius: 0;  }
#addProductsModal .modal-dialog { max-width: 650px; }
#addProductsModal .modal-header { border-bottom: 0; }
#addProductsModal .modal-header .close { padding: 21px 20.6px;  }
#addProductsModal .modal-header .close img { transition: transform .3s; vertical-align: super;  }
#addProductsModal .modal-header .close:hover img { transform: rotate(90deg); transition: transform .3s; }
#addProductsModal .modal-body { padding-top: 6px; padding-bottom: 0;  }
#addProductsModal .modal-body .des { padding-top: 26px; margin-bottom: 66px; }
#addProductsModal .modal-footer { 
    justify-content: center; border-top: 1px solid rgba(210, 210, 210, 0.5);
    padding-top: 28px; padding-bottom: 28px; 
}

.productsDetail .pillCustom .nav-pills { flex-direction: row; width: 100%; }


.productsDetail .itemContainer .itemWrap { display: flex; flex-direction: column; }
.productsDetail .itemContainer .itemRow { display: flex; flex-direction: column; }

@media screen and (max-width: 1699px) {
    .productsDetail .net::before { border-left: none; border-right: none; } 
    .productsDetail .txtContainer .main { padding-top: 45px; padding-bottom: 45px; }
    .productsDetail .imgContainer { display: flex; align-items: center; justify-content: center; }
}

@media screen and (max-width: 1499px) { 
    .productsDetail .rowCustom .col001 { padding-bottom: 140px; }
    .productsDetail .rowCustom .col002 { margin-bottom: 50px; }
    .productsDetail .rowCustom .col004 { margin-top: -44px; }
    .productsDetail .bottomContainer { padding-top: 70px; padding-bottom: 90px; }
    .productsDetail .bottomContainer .detail1Container p ~ .imgBox { margin-top: 45px; }
    .productsDetail .pillCustom li.nav-item { margin-top: 0; margin-bottom: 0px; }  
}

@media screen and (max-width: 1299px) { 
    .productsDetail { margin-top: 80px; }
    .productsDetail .prodetailContainer { padding-top: 10px; }
}

@media screen and (max-width: 1200px) { 
    .productsDetail { margin-top: 84px; }    
    .productsDetail .prodetailContainer { padding-top: 0px; padding-left: 10px; }
    .productsDetail .arrowBtn { margin-top: 30px; }
    .productsDetail .rowCustom { position: relative; }
    .productsDetail .rowCustom .col001 { -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; padding-bottom: 0px; }
    .productsDetail .rowCustom .col002 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom: 0px;}
    .productsDetail .rowCustom .col003 { -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; }
    .productsDetail .rowCustom .col004 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    
    .productsDetail p.type1 { margin-bottom: 20px; }
    .productsDetail .imgContainer { padding-left: 0; padding-bottom: 0; padding-right: 140px; }
    .productsDetail .imgContainer .imgBox img { max-width: 100%; }
    .productsDetail .imgContainer .dlBtn { left: auto;  right: 0; }
    .productsDetail .imgContainer .dlBtn .inner {  width: 120px; height: 120px; }
    .productsDetail .pillCustom li.nav-item a.nav-link { max-width: 500px; }
    
    .productsDetail .itemContainer .itemWrap { flex-direction: row; justify-content: space-between; }
    .productsDetail .itemContainer .itemRow { flex-direction: row; justify-content: space-between; }
    .productsDetail .itemContainer .itemRow:first-child { width: 41.66%; }
    .productsDetail .itemContainer .itemRow:nth-child(2) { width: 58.33%; }

    .productsDetail .itemContainer .itemRow:first-child .item:first-child { width: 40%; }
    .productsDetail .itemContainer .itemRow:first-child .item:nth-child(2) { width: 60%; }
    
    .productsDetail .itemContainer .itemRow:nth-child(2) .item:first-child { width: 60%; }
    .productsDetail .itemContainer .itemRow:nth-child(2) .item:nth-child(2) { width: 40%; }
}

@media screen and (max-width: 991px) { 
    .productsDetail .fs-70 { font-size: 64px; line-height: 60px; }
    .productsDetail .rowCustom .col1 { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; }
    .productsDetail .rowCustom .col2 { -ms-flex: 0 0 55%; flex: 0 0 55%; max-width: 55%; }
    .productsDetail .rowCustom .col2 { justify-content: flex-start; }
    .productsDetail p.type1 { margin-bottom: 12px; }
    
    .productsDetail .imgContainer { padding-left: 0; padding-top: 30px; padding-bottom: 0; padding-right: 120px; }
    .productsDetail .imgContainer .dlBtn {  right: 10px; }
    .productsDetail .imgContainer .dlBtn .inner { width: 90px; height: 90px; }  
    
    .productsDetail .itemContainer .itemWrap { flex-direction: column; }
    .productsDetail .itemContainer .itemRow { justify-content: space-between; }
    .productsDetail .itemContainer .itemRow:first-child { width: 100%; }
    .productsDetail .itemContainer .itemRow:nth-child(2) { width: 100%; }
    
    .productsDetail .itemContainer .itemRow:first-child .item:first-child { width: 60%; }
    .productsDetail .itemContainer .itemRow:first-child .item:nth-child(2) {width: 40%; }
    
    .productsDetail .itemContainer .itemRow:nth-child(2) .item:first-child { width: 60%; }
    .productsDetail .itemContainer .itemRow:nth-child(2) .item:nth-child(2) { width: 40%; }
    
    .productsDetail .rowCustom .col004 .pillContainer { padding-top: 35px; }
}


@media screen and (max-width: 768px) { 
    .productsDetail .fs-70 { font-size: 58px; line-height: 54px; margin-bottom: 14px; }
    .productsDetail .fs-42 { font-size: 34px; line-height: 38px;  }
    .productsDetail .borderArrow { margin-left: 16px; }
    
    .productsDetail .imgContainer { padding-top: 30px; padding-bottom: 30px; padding-right: 84px; align-self: center; }
    .productsDetail .imgContainer .dlBtn .inner { width: 74px; height: 74px; }
    .productsDetail .imgContainer .dlBtn .inner .txt { font-size: 14px; margin-top: 0.25rem; }
    
    .productsDetail .rowCustom .col001 { padding-top: 30px; padding-bottom: 0; -ms-flex: 0 0 42%; flex: 0 0 42%; max-width: 42%;  }
    .productsDetail .rowCustom .col002 { padding-top: 40px; }
    .productsDetail .rowCustom .col003 { -ms-flex: 0 0 58%; flex: 0 0 58%; max-width: 58%; display: flex; align-items: center; }
    .productsDetail .prodetailContainer .col002 .item { margin-bottom: 30px; }
}

@media screen and (max-width: 575px) { 
    .pages .productsDetail .breadcrumb { margin-left: 12px; }
    .productsDetail .prodetailContainer { padding-left: 0; }
    .productsDetail .blank { padding-left: 10px; padding-right: 10px; }
    .productsDetail .imgContainer { padding-top: 15px; padding-bottom: 0px; padding-left: 10px; padding-right: 95px; }
    .productsDetail .imgContainer .dlBtn { bottom: 0px; right: 10px; }
    .productsDetail .pillCustom li.nav-item a.nav-link { padding-bottom: 10px; }
    .productsDetail .arrowBtn { margin-top: 20px; }
    .productsDetail .arrowBtn .borderArrow { margin-left: 30px; }
    .footerContainer .footerRow { padding-left: 0; padding-right: 0; }
    .footerContainer .footerRow .arrowBtn {  margin-left: -20px; }
    #addProductsModal .modal-header { padding-bottom: 0; }
    #addProductsModal .modal-body .des { margin-bottom: 30px; }
    #addProductsModal .modal-footer { padding-top: 18px; padding-bottom: 18px; } 
    
    .productsDetail .itemContainer .itemRow { flex-direction: column; }
    .productsDetail .rowCustom .col001 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding-top: 20px; padding-left: 17px; margin-bottom: 20px; }
    .productsDetail .col001 .title { max-width: 340px; font-size: 52px; line-height: 44px; }
    .productsDetail .col001 .title span { font-size: 36px;}
    .productsDetail .rowCustom .col002 { padding-left: 15px; }
    .productsDetail .rowCustom .col003 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; justify-content: flex-start; align-items: flex-end; padding-left: 5px; }
    .productsDetail .rowCustom .col004 .pillContainer { padding-top: 30px; }
    
    .productsDetail .itemContainer .itemRow:first-child .item:first-child { width: 100%; }
    .productsDetail .itemContainer .itemRow:first-child .item:nth-child(2) { width: 100%;}
    
    .productsDetail .itemContainer .itemRow:nth-child(2) .item:first-child { width: 100%; }
    .productsDetail .itemContainer .itemRow:nth-child(2) .item:nth-child(2) { width: 100%; }
    
    .productsDetail .pillCustom li.nav-item a.nav-link { text-align: center; }
    .productsDetail .pillCustom li.nav-item { padding-left: 10px; padding-right: 10px; }
    .productsDetail .pillCustom .nav-pills { margin: 0 auto; }   
}


/* --------------- */
/* project
/* --------------- */

.projectWrap .MainSwiperBtn { position: absolute; left: 80px; bottom: 58px;  display: flex; flex-direction: column; z-index: 5; }
.projectWrap .MainSwiperBtn .swiper-buttons { display: flex; position: absolute; right: -80px; bottom: 0; z-index: 5; }
.projectWrap .MainSwiperBtn .swiper-buttons .swiper-button { border: 0; }

.projectWrap .MainSwiperBtn .btnCustom { width: 80px; height: 81px; color: #fff; }
.projectWrap .MainSwiperBtn .btnCustom.swiper-button-prev { background: #000; transition: all .3s ease; }
.projectWrap .MainSwiperBtn .btnCustom.swiper-button-prev:hover { background: #252525; transition: all .3s; }
.projectWrap .MainSwiperBtn .btnCustom.swiper-button-next { background: #E41E25; }
.projectWrap .MainSwiperBtn .btnCustom.swiper-button-next i { transition: all .3s; }
.projectWrap .MainSwiperBtn .btnCustom.swiper-button-next:hover { background: #EB4A51; transition: all .3s; }

.pages .projectList .commonBlock { position: relative; } 
.pages .projectList .commonBlock .txtWrap { bottom: 80px; } 
.pages .projectList .banner-section { height: calc(100vh - 40px); }
.pages .projectList .commonBlock .txtWrap {  bottom: 245px;  }

.projectList .tags { width: 120px; height: 40px; background: #E41E25; color: #fff; display: flex; justify-content: center; align-items: center; margin-bottom: 20px; font-weight: Medium;  }
.bg-white-mobile { background: transparent; width: 100%; position: absolute; z-index: 110; transform: translateY(-40px);  bottom: 0; left: 0; }

.projectList .linksSection { z-index: 110;  }
.projectList .linksSection .swiper-notification { display: none; }
.projectList .linksSection .linkSwiperBtns { display: flex; flex-direction: column; }
.projectList .linksSection .links-element { margin-top: 0; }
.projectList .linksSection .linksWrap { display: flex; justify-content: space-between; }
.projectList .linksSection .tabItem .iconBox { height: 64px; display: block; }
.projectList .linksSection .tabItem .txt { font-weight: 500; font-weight: Medium; }

.projectList .linksSection .swiper-slide { max-width: 155px; }
.projectList .linksSection .links-swiper {
    width: calc(100% - 78px); /* max-width: 1395px;  */
    margin-left: 0; position: relative; border-bottom: 1px solid #EFEFEF; display: block; 
}
.projectList .linksSection .swiper-wrapper .swiper-slide { padding-top: 15px; } 

.projectList .linksSection .links-element::before { content: ''; position: absolute; right: 0; bottom: 0; background: #FFF; width: 100%; height: 156px; border-top: 0.5px solid #EFEFEF; border-bottom: 0.5px solid #EFEFEF; }
.projectList .linksSection .links-element .toggle { background: #fff; color: #000; align-items: center; border: 1px solid #EFEFEF; }
.projectList .linksSection .links-element .blankBlock { background: #fff; width: 100%; height: 155px; position: absolute; left: 0; bottom: 0; }

.projectList .linksSection .links-element a { 
    transition: all .3s; width: 100%; max-width: 155px;  height: 155px; display: block; padding-top: 30px; 
    border-right: 1px solid #EFEFEF; position: relative; background: #fff; letter-spacing: .5px; 
}
.projectList .linksSection .links-element a:hover { color: #E41E25; transition: all .3s; }
.projectList .linksSection .links-element a.active { color: white; background: #E41E25; font-weight: bold; border-color: #E41E25; border-right: 1px solid #E41E25;  transform: scale(1, 1.25);  transition: all .3s; z-index: 3; }
.projectList .linksSection .links-element a.active img { -webkit-filter: brightness(10); filter: brightness(10); }
.projectList .linksSection .links-element a .tabItem { display: flex; flex-direction: column; justify-content: center; align-items: center; align-self: center; } 
.projectList .linksSection .links-element a.active .tabItem { transform: scale(1, 0.8); font-weight: 400; margin-top: -5px; }
.projectList .linksSection .links-element a.active .tabItem .txt { margin-top: -2px; }

.projectList .linksSection .links-element .swiper-buttons { bottom: 0; right: 0; }
.projectList .linksSection .links-element .swiper-buttons .swiper-button { background: white; width: 78px; height: 78px;color: #000000; border: 1px solid #EFEFEF; }
.projectList .linksSection .links-element .swiper-buttons .swiper-button.swiper-button-disabled { opacity: 1; }
.projectList .linksSection .links-element .swiper-buttons .swiper-button:hover { color: #E41E25; }

.projectList .mainBlock { position: relative; margin-bottom: 130px;  margin-top: -40px; z-index: 3; padding-top: 130px;   }
.projectList .mainBlock .rowCutstom { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap;  align-items: flex-end; justify-content: center; background: transparent; }
.projectList .mainBlock .rowCutstom a:hover .moreBtn { transform: scale(1.1, 1.1); transition: all .3s; }
.projectList .mainBlock .rowCutstom .colLeft, .projectList .mainBlock .rowCutstom .colRight { position: relative; width: 100%; min-height: 1px; }
.projectList .mainBlock .rowCutstom .colLeft { 
    -ms-flex: 0 0 36.85%; flex: 0 0 36.85%; max-width: 36.85%; 
    margin-right: -83px; margin-bottom: 58px; align-items: center;
}
.projectList .mainBlock .rowCutstom .colRight { 
    -ms-flex: 0 0 63.15%; flex: 0 0 63.15%; max-width: 63.15%;  
}
.projectList .mainBlock .rowCutstom .colRight a img { transition: transform .4s; }
.projectList .mainBlock .rowCutstom .colRight a:hover img { transform: scale(1.03, 1.03); transition: transform .4s; }

.projectList .mainBlock .leftContainer { display: flex; align-items: center; }
.projectList .mainBlock .title-inner { display: inline-block; position: absolute; top: 160px;  z-index: 10; right: 65.62%; }
.projectList .mainBlock .fs-85 { line-height: 78px; }
.projectList .mainBlock .text-inner { 
    position: relative;  width: 535px; height: 420px; background: #fff; z-index: 3;
    border: 1px solid #EFEFEF; padding-left: 65px; padding-right: 65px; 
    display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
}
.projectList .mainBlock .text-inner .title { margin-bottom: 18px; } 
.projectList .mainBlock .text-inner .doc .des { margin-bottom: 38px; }
.projectList .mainBlock .img-inner { display: block; height: 700px; overflow: hidden; }
.projectList .mainBlock .img-inner img {width: 100%; height: 100%; object-fit: cover; transition: all .4s; }

.projectList .moreBtn { transition: all .3s; text-transform: uppercase; font-size: 16px; font-family: 'Mukta Vaani', sans-serif; font-weight: 700; color: #000; display: flex; align-items: center; position: relative; }
.projectList .moreBtn:hover { transform: scale(1.1, 1.1); transition: all .3s; }
.projectList .moreBtn .txt { margin-bottom: -20px;}
.projectList .moreBtn i:before { color: #000; font-size: 10px; }
.projectList .borderBtn2 { margin-left: 50px; }

.projectList .moreBlock a { display: block;  } 
.projectList .moreBlock .moreItems { position: relative; margin-bottom: calc(130px + 63px); } 
.projectList .moreBlock .row02 { margin-left: -22px; margin-right: -22px; } 
.projectList .moreBlock .row02 .col02 { padding-left: 22px; padding-right: 22px; } 

.projectList .moreBlock .moreItems .imgBox {  overflow: hidden; transition: all .4s; display: block; height: 400px; } 
.projectList .moreBlock .moreItems .imgBox img { width: 100%; height: 100%; object-fit: cover; max-width: 100%; transition: all .3s; } 
.projectList .moreBlock .moreItems .txtBox {
    width: 500px; height: 220px; 
    background: #fff; color: #000; border: 1px solid #EFEFEF; 
    display: flex; flex-direction: column; justify-content: center; align-items: flex-start; 
    transition: all .3s; padding-left: 60px; padding-right: 60px; 
    position: absolute; bottom: -130px;
} 
.projectList .moreBlock .moreItems .txtBox .tags { width: 90px; height: 35px; background: #E41E25; color: #fff; display: flex; justify-content: center; align-items: center; transition: all .3s; }
.projectList .moreBlock .moreItems .txtBox .topInfo { display: flex; justify-content: space-between; width: 100%;  margin-bottom: -3px;  }
.projectList .moreBlock .moreItems .txtBox .topInfo .title {  }

.projectList .moreBlock .moreItems:hover .imgBox img { transform: scale(1.05, 1.05); transition: all .3s; }
.projectList .moreBlock .moreItems:hover .txtBox { background: #E41E25; border-color: #E41E25;  color: #fff; transition: all .3s; }
.projectList .moreBlock .moreItems:hover .txtBox .tags { background: #000;  transition: all .3s; }


@media (max-width: 1900px) { 
    .projectList .mainBlock .title-inner { right: 68%; }
}
@media (max-width: 1699px) { 
    .projectList .mainBlock .title-inner { right: 70%; }
}
@media (max-width: 1499px) { 
    .projectList .mainBlock .title-inner { right: 72%; }
    .projectList .linksSection .swiper-slide { max-width: 100%; }
}

@media (max-width: 1399px) { 
    .projectList .linksSection .links-element::before { content: ''; width: 0; height: 0; }
    .projectList .linksSection .links-swiper { width: calc(100% - 77.5px); }
    .projectList .linksSection .links-element a { max-width: 100%; }
    .projectList .mainBlock .title-inner { right: 70%; }
}

@media (max-width: 1200px) { 
    .bg-white-mobile { transform: translateY(-0px); } 
    .projectList .mainBlock { padding-top: 90px; }
    .projectList .mainBlock .title-inner { display: none; }
    .projectList .linksSection.blank { padding-left: 0; }
    .projectList .mainBlock {  margin-top: 0px; margin-bottom: 100px; }
    .projectList .mainBlock .img-inner { height: auto; }
    .projectList .mainBlock .rowCutstom .colLeft, .projectList .mainBlock .rowCutstom .colRight { 
        -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding-left: 30px; padding-right: 30px; 
    }
    .projectList .mainBlock .rowCutstom .colLeft { margin-right: 0; margin-bottom: 0; }
    .projectList .mainBlock .title-inner { padding-bottom: 60px; }
    .projectList .mainBlock .text-inner { width: 100%; height: 380px; }
    .projectList .mainBlock .text-inner .title { margin-top: 20px;  margin-bottom: 10px; }
    .projectWrap .MainSwiperBtn { left: auto; right: 0; }
    .projectList .MainSwiperBtn .swiper-buttons { right: 30px; }
    .projectList .mainBlock .MainSwiperBtn { bottom: 1px; }
    .projectList .moreBlock .moreItems { margin-bottom: 63px; } 
    .projectList .moreBlock .moreItems .txtBox { width: 100%; position: static; }
}

@media (max-width: 991px) { 
    .projectList .mainBlock { padding-top: 50px;  margin-bottom: 100px; }
    .projectList .moreBlock .moreItems {  margin-bottom: 52px; } 
    .projectList .moreBlock .moreItems .imgBox { height: 300px; }
    .projectList .moreBlock .moreItems .txtBox { bottom: 0; height: auto; padding-top: 30px; padding-bottom: 40px;  padding-left: 30px; padding-right: 30px; }
    .projectList .paginationContainer { justify-content: center; padding-bottom: 60px; }
    .projectList .paginationContainer .paginationWrap { margin-top: 10px; }
    .projectList .paginationContainer .paginationWrap .d-mobile-pag { display: inline-block; }
    .projectList .paginationContainer .arrowWrap { display: none; }
    .projectList .moreBlock .row02 {  padding-left: 11px; padding-right: 11px;  margin-left: -15px; margin-right: -15px; }
    .projectList .moreBlock .row02 .col02 { padding-left: 15px; padding-right: 15px; }
}

@media (max-width: 767px) {
    .projectList .mainBlock { padding-top: 0px; margin-top: 0; margin-bottom: 90px; }
    .projectList .linksSection { background: #fff; }
    .projectList .txtWrap  { padding-left: 20px; }
    .pages .projectList .commonBlock .txtWrap { bottom: 180px; } 
    .pages .projectList .banner-section { height: calc(100vh - 140px); }
    .projectList .linksSection .blank { padding-left: 30px; padding-right: 30px; }
    .projectList .linksSection .swiper-wrapper { flex-direction: column; text-align: left; }
    .projectList .linksSection .swiper-wrapper .swiper-slide { padding-top: 0; }
    .projectList .linksSection .links-swiper { width: 100%; }
    .projectList .linksSection .linksWrap { display: block; }
    .projectList .linksSection .links-element { margin: 0; margin-bottom: 50px; width: auto; }
    .projectList .linksSection .links-element .links-swiper { width: 100%; position: absolute; margin-left: 0; display: none; border: 1px solid #EFEFEF; background: white; z-index: 2; flex-direction: column; text-align: left; }
    .projectList .linksSection .links-element .links-swiper .swiper-slide { text-align: left; height: auto; max-width: 100%; }
    .projectList .linksSection .links-element .links-swiper .swiper-slide a {max-width: 100%; text-align: left; border-bottom: 1px solid #EFEFEF; color: black !important; padding: 10px 24px; }
    .projectList .linksSection .links-element .links-swiper .swiper-slide a:hover { background: transparent; } 
    .projectList .linksSection .links-element .links-swiper .swiper-slide a.active { background: transparent; font-weight: normal; }
    .projectList .linksSection .links-element a:hover { border-color: #EFEFEF; transform: scale(1, 1);  transition: all .3s; font-weight: 400; font-size: 16px; }
    .projectList .linksSection .links-element a.active { border-color: #EFEFEF; transform: scale(1, 1);  transition: all .3s; font-size: 16px; }
    .projectList .linksSection .links-element a.active .tabItem { transform: scale(1, 1); }
    .projectList .linksSection .links-element a .tabItem { justify-content: flex-start; text-align: left; transform: scale(1, 1); }
    .projectList .linksSection .links-element a .tabItem .iconBox { display: none; }
    .projectList .linksSection .links-element a { height: auto; }
    .projectList .linksSection .linkSwiperBtns { display: none; }
    .projectList .linksSection .links-element .toggle .iconBox { transform: scale(0.5, 0.5); }    
    .projectList .linksSection .tabItem .txt { margin-top: 0; }
    .bg-white-mobile { background: #fff; padding-top: 40px; }
}

@media (max-width: 575px) { 
    .projectList .linksSection .blank { padding-left: 15px; padding-right: 15px; }
    .projectList .mainBlock { padding-top: 0px; margin-bottom: 70px; }
    .projectList .MainSwiperBtn .swiper-buttons { right: 15px; }
    .projectList .mainBlock .text-inner { width: 100%; height: auto; padding: 30px 30px; }
    .projectList .mainBlock .rowCutstom .colLeft, .projectList .mainBlock .rowCutstom .colRight { padding-left: 15px; padding-right: 15px; }
    .projectList .mainBlock .text-inner .doc .des { margin-bottom: 28px; }
    .projectList .moreBlock .blank { padding-left: 0; padding-right: 0; }
    .projectList .moreBlock .row02 { padding-left: 0; padding-right: 0;}
    .projectList .moreBlock .moreItems { margin-bottom: 30px; }
    .projectList .moreBlock .moreItems .imgBox { height: 200px; }
    .projectList .moreBlock .moreItems .txtBox { padding: 25px 25px 30px; } 
    .productsDetail .bottomContainer { padding-top: 50px; padding-bottom: 60px; }
    .productsDetail .bottomContainer .item .imgInner { height: 220px; }
    .projectList .mainBlock .text-inner .title { font-size: 26px; margin-bottom: 10px; }
    .projectList .moreBlock .moreItems .txtBox .topInfo .title { font-size: 24px; }    
}


/* --------------- */
/* projectDetail
/* --------------- */

#projectDetail.pages .breadcrumbWrap { top: 4px; right: 145px; }
#projectDetail.pages .breadcrumb .breadcrumb-item .icon-home { color: #E9E9E9; }
#projectDetail.pages .breadcrumb > li { color: #D7D7D7; }
#projectDetail.pages .breadcrumb > li a { color: #D7D7D7; }
#projectDetail.pages .breadcrumb > li + li::before { color: #EAEAEA; }
#projectDetail.pages .breadcrumb > .active {  color: #595959; }

.projectDetail { margin-top: 140px; }
.projectDetail .container-fluid { max-width: 1920px; }
.projectDetail .leftContainer { height: 100%; }
.projectDetail .rowCustom, .projectDetail .rowCustom .bottomDetail { width: 100%; }
.projectDetail .rowCustom, .projectDetail .rowCustom .bottomDetail .footerRow { display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.projectDetail .rowCustom .col1, .projectDetail .rowCustom .col2, .projectDetail .rowCustom .bottomDetail .footerRow .col0 { position: relative; width: 100%; min-height: 1px; }
.projectDetail .rowCustom .col1 { -ms-flex: 0 0 54.16%; flex: 0 0 54.16%; max-width: 54.16%; }
.projectDetail .rowCustom .col2 { -ms-flex: 0 0 45.83%; flex: 0 0 45.83%; max-width: 45.83%; }
.projectDetail .rowCustom .bottomDetail .footerRow { width: 100%; border-top: 1px solid rgba(210, 210, 210, 0.5); }
.projectDetail .rowCustom .bottomDetail .footerRow .col0 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; display: flex; align-items: center; justify-content: center; height: 160px; border-left: 1px solid rgba(210, 210, 210, 0.5); border-bottom: 1px solid rgba(210, 210, 210, 0.5); padding: auto 10px; }
.projectDetail .rowCustom .bottomDetail .footerRow .col0 .item { display: flex; align-items: center; justify-content: center;  }
.projectDetail .rowCustom .bottomDetail .footerRow .col0 .txtBox { text-align: left; display: flex; flex-direction: column; justify-content: center; margin-left: 20px;  }
.projectDetail .rowCustom .bottomDetail .footerRow .col0 .txtBox p { margin-bottom: 0;  }

.projectDetail .rightContainer  { position: relative;  height: calc(100% - 1px); }
.projectDetail .middle { display: flex; justify-content: center; align-items: center; height: calc(100% - 160px); }
.projectDetail .middle .contentBox  { width: 594px; max-width: 100%; padding-top: 90px; margin-bottom: 70px; }
.projectDetail .item  { padding-left: 15px; padding-right: 15px; }

.projectDetail .borderTop { border-top: 5px solid #E41E25; padding-top: 52px; }
.projectDetail .description { padding-top: 110px; padding-bottom: 120px;  }
.projectDetail .description .content { letter-spacing: 1.8px; }

.projectDetail .footerContainer { border-top: 1px solid rgba(210, 210, 210, 0.5); }
.projectDetail .footerContainer .desTitle { margin-bottom: 54px;  }
.projectDetail .footerContainer .footerRow { display: flex; justify-content: space-between; align-items: center; }

.projectDetail .swiperTitle { padding-top: 10px; padding-bottom: 37px; margin-bottom: 0; }
.projectDetail .MainSwiperBtn { position: absolute; right: 0; bottom: 0; display: flex; flex-direction: column; }
.projectDetail .MainSwiperBtn .swiper-buttons { display: flex; flex-direction: column; position: absolute; right: 0px; bottom: -1px; z-index: 5; }
.projectDetail .projectItem { display: flex; justify-content: center; align-items: flex-end; }
.projectDetail .projectItem .img-inner { width: 100%; }
.projectDetail .projectItem .img-inner img { object-fit: cover; object-position: center; width: 100%; /* height: auto !important; */ }

@media screen and (max-width: 1699px) { 
    #projectDetail.pages .breadcrumbWrap { right: 50px; }
}

@media screen and (max-width: 1499px) { 
    .projectDetail .fs-85 { font-size: 85px; }
    .projectDetail .swiperTitle { padding-bottom: 18px; }
    .projectDetail .borderTop { padding-top: 30px; }
    .projectDetail .middle .contentBox { padding-top: 50px; padding-bottom: 10px; }
    .projectDetail .description { padding-top: 100px;}
}

@media screen and (max-width: 1299px) { 
    #projectDetail.pages .breadcrumbWrap { top: 0px; right: 30px; }
    .projectDetail { margin-top: 84px; }
    .projectDetail .description { padding-top: 70px; padding-bottom: 80px;  }
    .projectDetail .middle { height: calc(100% - 110px); }
    .projectDetail .middle .contentBox { padding-top: 80px; padding-bottom: 60px; }
    .projectDetail .middle .contentBox { width: 90%; }
    .projectDetail .rowCustom .bottomDetail .footerRow .col0 { height: 110px; }
    .projectDetail .rowCustom .bottomDetail .footerRow .col0 .txtBox { margin-left: 10px; }
}

@media screen and (max-width: 1200px) {
    .projectDetail .rowCustom .col1, .projectDetail .rowCustom .col2 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
    .projectDetail .MainSwiperBtn .swiper-buttons { flex-direction: row; }
    .projectWrap .MainSwiperBtn .btnCustom { width: 50px; height: 50px; }
    .projectDetail .projectItem .img-inner img { height: auto !important; }
}

@media screen and (max-width: 767px) { 
    .projectDetail .fs-85 { font-size: 72px; }
    .projectDetail .description { padding-top: 60px; padding-bottom: 50px; }
    .projectDetail .middle .contentBox { padding-top: 90px;  padding-bottom: 50px; }
}

@media screen and (max-width: 575px) { 
    .footerContainer .blank { padding-left: 0; padding-right: 0; }
    .footerContainer .footerRow { flex-direction: column; justify-content: space-between;  height: auto; padding-top: 0; padding-bottom: 0; }
    .footerContainer .footerRow .left { margin-top: 50px; margin-bottom: 50px; text-align: center; }
    .footerContainer .footerRow .right { width: 100%; }
    .footerContainer .footerRow .right .backBtn { width: 100%; display: flex; flex-direction: row; align-items: center; height: 80px; }
    .footerContainer .footerRow .right .backBtn i { margin-right: 30px; }
    .footerContainer .footerRow .right .backBtn:hover { border: 1px solid #fff; }
    .projectDetail .fs-85 { font-size: 60px; line-height: 50px; }
    .projectDetail .middle { height: calc(100% - 220px); }
    .projectDetail .middle .contentBox { width: 100%; padding-top: 100px; padding-bottom: 50px; }
    .projectDetail .rowCustom .bottomDetail .footerRow .col0 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; justify-content: flex-start; padding-left: 7.5%; padding-right: 7.5%; }
    .footerContainer .footerRow .fs-30 { font-size: 26px; line-height: 34px; }
    .projectDetail .footerRow .fs-30 { font-size: 26px; line-height: 34px; }    
    .projectDetail .footerContainer .desTitle { margin-bottom: 40px; }
}

@media screen and (max-width: 430px) { 
    .footerContainer .footerRow .arrowBtn { margin-left: 0px; }
    .footerContainer .footerRow .fs-30 { font-size: 22px; }
    .projectDetail .footerRow .fs-30 { font-size: 22px; }
}


/* --------------- */
/* dropDownContainer
/* --------------- */

.pages  .dropDownContainer .navTitle { display: none; }
.pages  .dropDownContainer .itemRow { display: flex; justify-content: flex-start; align-items: center; }
.pages  .dropDownContainer .item { cursor: pointer; background: #EFEFEF; color: #000; width: 300px; height: 100px; margin: 0; transition: all .4s; font-size: 20px; font-weight: bold; display: flex; justify-content: center; align-items: center; position: relative; }
.pages  .dropDownContainer .item:not(:last-child) .decLine { display: block; }
.pages  .dropDownContainer .item:hover { color: #E41E25; transition: all .4s; }
.pages  .dropDownContainer .item.active { background: #E41E25; color: #fff;  transition: all .4s; }
.pages  .dropDownContainer .item.active .decLine { display: none; }
.pages  .dropDownContainer .item a { display: block; }
.pages  .dropDownContainer .item:not(:last-child) .decLine { width: 1px; height: 25px; background: #D2D2D2; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}

@media screen and (max-width: 768px) { 
    .pages .dropDownContainer .item { font-size: 18px; }
}
 @media screen and (max-width: 575px) { 
  .pages  .dropDownContainer { position: relative; transition: all 0.4s; z-index: 110;  background: #fff; }
  .pages  .dropDownContainer .navTitle { width: 100%; height: 50px; display: flex; align-items: center; background: #D61518; cursor: pointer; }
  .pages  .dropDownContainer .navTitle .title { width: calc(100% - 50px); padding-left: 50px;  font: 600 18px 'Noto Sans TC', 'Raleway', sans-serif;  line-height: 50px; letter-spacing: 1px; text-align: center; color: #fff; }
  .pages  .dropDownContainer .navTitle .icon { width: 16px; height: 16px; margin: 0 17px; position: relative; }
  .pages  .dropDownContainer .navTitle .line { width: 16px; height: 16px; position: absolute; top: 0; left: 0; transition: all 0.4s; }
  .pages  .dropDownContainer .navTitle .line::before { content: ''; width: 16px; height: 2px; background: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .pages  .dropDownContainer .navTitle .line:last-child { transform: rotate(270deg); }
  .pages  .dropDownContainer.active .navTitle .line:last-child { transform: rotate(0deg); }
  .pages  .dropDownContainer .navContent { width: 100%; position: absolute; z-index: 110; transition: all 0.4s; overflow: hidden; }
  .pages  .dropDownContainer .itemRow { width: 100%; padding: 0 20px; display: flex; flex-direction: column; justify-content: center; align-items: center; background: #eee; }
  .pages  .dropDownContainer .item { width: 100%; height: 50px; line-height: 50px; font-size: 18px; }
  .pages  .dropDownContainer .item:not(:last-child) { border-bottom: solid 1px #ddd; }
  .pages  .dropDownContainer .item:not(:last-child) .decLine { display: none; }
  .pages  .dropDownContainer .item.active { background: transparent; color: #D61518; }
}

.pages  .tabsWrap { display: flex; align-items: center; justify-content: flex-start; }
.pages  .tabsWrap .tabItem::after { content: ''; width: 1px; height: 25px; background: #D2D2D2; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.pages  .tabsWrap .tabItem:hover::after { width: 0px; }
.pages  .tabsWrap .tabItem.active::after { width: 0px; }



/* --------------- */
/* privacy
/* --------------- */

.privacyWrap { padding-top: 200px; }
.privacyWrap .mainTitle { margin-bottom: 20px; }
.privacyWrap .privacy { padding-top: 40px; }
.privacyWrap .privacy .fs-85 { font-size: 85px; line-height: 75px; }
.privacyWrap .privacyContent { padding-top: 120px; padding-bottom: 130px; padding-left: 5px; }
.privacyWrap .privacyContent .number { padding-top: 7px;  margin-bottom: 2px; line-height: 32px; }
.privacyWrap .privacyContent .txtContainer { margin-bottom: 110px; }
.privacyWrap .privacyContent .txtContainer p { line-height: 36px; letter-spacing: 0.3px; text-align: justify; margin-bottom: 0;  }
.privacyWrap .privacyContent .txtContainer p.dots { position: relative; padding-left: .9em; margin-bottom: .8rem; }
.privacyWrap .privacyContent .txtContainer p.dots:before { content:''; width: 2px; height: 2px; background: #595959; position: absolute; left: 0;  top: 1.15em; }

@media screen and (max-width: 1499px) { 
    .privacyWrap { padding-top: 160px; }
    .privacyWrap .privacyContent { padding-top: 80px; padding-bottom: 80px; padding-left: 0; }
}
@media screen and (max-width: 1200px) { 
    .privacyWrap { padding-top: 120px; }
    .privacyWrap .privacy .fs-85 { font-size: 72px;  line-height: 62px;  }
    .privacyWrap .privacyContent { padding-top: 60px; }
}
@media screen and (max-width: 768px) { 
    .privacyWrap .privacy .fs-85 { font-size: 62px;  line-height: 58px;  }
    .privacyWrap .privacyContent { padding-top: 50px; }
    .privacyWrap .mainTitle { margin-bottom: 6px; }
}
@media screen and (max-width: 575px) { 
    .privacyWrap { padding-top: 120px; }
    .privacyWrap .privacyContent { padding-top: 30px; padding-bottom: 40px; }
    .privacyWrap .privacyContent .txtContainer { margin-bottom: 30px; }
    .privacyWrap .privacy .fs-85 { font-size: 46px;  line-height: 44px;  }
}


/* --------------- */
/* page404
/* --------------- */

#page404 header.header .headerTop { display: none; }

.page404 {  padding-top: 30px;  max-height: 100%; }
.page404 .hoverRed:hover{ text-decoration: underline; color: #E41E25; }
.page404 .RedBtn { font-size: 12px; }
.page404 .contentBlock { display: flex; flex-direction: column; justify-content: center; align-items: center; padding-top: 50px; }
.page404 .content { text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.page404 .content .t1 { font-size: 110px; margin: 0; margin-bottom: -80px; }
.page404 .content .t2 { font-size: 350px; margin: 0; line-height: 350px; }
.page404 .content .p1 { margin-bottom: 6px; }
.page404 .content .p2 { margin-bottom: 45px; }

@media screen and (max-width: 991px) { 
    .page404 .content .t1 { font-size: 90px;}
    .page404 .content .t2 { font-size: 300px; }
}

@media screen and (max-width: 768px) { 
    .page404 { padding-bottom: 100px; }
    .page404 .content .t1 { font-size: 60px; }
    .page404 .content .t2 { font-size: 220px; line-height: 300px; }
}

@media screen and (max-width: 575px) { 
    .page404 .content .t1 { font-size: 50px; }
    .page404 .content .t2 { font-size: 40vw; }
    .page404 .content .p1 { margin-top: -50px; }
}


/* --------------- */
/* select dropdown
/* --------------- */

.selectWrap {
    border-bottom: 1px solid #000;
    padding-bottom: 12px;
    width: 100%;
    max-width: 350px;
    margin: 0 auto;
}
.selectWrap.firstChild { 
    z-index: 999 !important;
}

.bootstrap-select .dropdown-menu li a span.text { white-space: pre-wrap; }

.bootstrap-select .dropdown-menu::-webkit-scrollbar {
  width: 0px;
}

.bootstrap-select .dropdown-menu::-webkit-scrollbar-track {
  background: #fff;
}

.bootstrap-select .dropdown-menu::-webkit-scrollbar-thumb {
  background: #fff;
}

.bootstrap-select .dropdown-menu::-webkit-scrollbar-thumb:hover {
  background: #fff;
}

.bootstrap-select.type-1.show .dropdown-toggle::after {
  -webkit-transform: translateY(-50%) rotate(180deg);
          transform: translateY(-50%) rotate(180deg);
}

.bootstrap-select.type-1 .dropdown-toggle {
    background: transparent;
    border: none;
    color: black;
    font-weight: bold;
    letter-spacing: .5px;
    outline: none !important;
    -webkit-box-shadow: none;
          box-shadow: none;
    padding: 0;
}

.bootstrap-select.type-1 .dropdown-toggle:hover {
  color: #000;
}

.bootstrap-select.type-1 .dropdown-toggle:focus {
  color: #323232;
}

.bootstrap-select.type-1 .dropdown-toggle:active {
  background: transparent;
}

.bootstrap-select.type-1 .dropdown-toggle::after {
  border: none;
  width: 11px;
  height: 7.6px;
  background: url(images/public/arrow-down-red.svg) center no-repeat;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
  top: 55%;
  right: 0px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  position: absolute;
  margin-top: 0;
}

.bootstrap-select.type-1 .dropdown-menu:not(.inner) {
    border: 0;
    border-radius: 0px;
    padding: 0;
    margin-top: 12px;
    box-shadow: 0 20px 20px rgb(0 0 0 / 12%);
}

.bootstrap-select.type-1 .dropdown-menu:not(.inner) li:not(:last-child) {
  border-bottom: 1px solid #F3F3F3;
}
.bootstrap-select.type-1 .dropdown-menu:not(.inner) li:first-child {
  border: 0;
}

.bootstrap-select.type-1 .dropdown-menu:not(.inner) li .dropdown-item {
  color: #000;
  padding: 13px 15px; 
  text-align: left;
}

.bootstrap-select.type-1 .dropdown-menu:not(.inner) li .dropdown-item.active {
  background: #fff;    
}

.bootstrap-select.type-1 .dropdown-menu:not(.inner) li .dropdown-item:hover {
  background: #fff;
  color: #fff;
  background: #E41E25;
}

.dropdown-menu.open {
  max-height: 314px !important;
  overflow: hidden;
}
.dropdown-menu.inner {
  max-height: 260px !important;
  overflow-y: auto;
}

.productWrap .selectWrap {
    max-width: 220px;
    padding-bottom: 10px;
    margin: 0;
    margin-top: 5px;
}
.productWrap .selectWrap:first-child {
    margin-bottom: 0;
}
.searchContent .selectWrap:first-child { 
    margin-bottom: 20px;
}

.contactUsWrap .selectWrap { max-width: 100%; width: calc(100% - 110px); border-bottom: 0; padding-bottom: 2px; }
.contactUsWrap .bootstrap-select.type-1 .dropdown-toggle { font-weight: 400; color: #595959;  }
.contactUsWrap .bootstrap-select.type-1 .dropdown-toggle::after { width: 14px; height: 9px; right: 36px; }

@media screen and (max-width: 767px) { 
    .productWrap .selectWrap { max-width: 100%; }
    .contactUsWrap .bootstrap-select.type-1 .dropdown-toggle::after { right: 6px; }
}

/*# sourceMappingURL=style.css.map */