@charset "utf-8";[v-cloak]{display:none}
.compare-grid-component{word-wrap:anywhere;-ms-hyphens:auto;hyphens:auto;-webkit-hyphens:auto}
.compare-grid-component ul{padding:0}
.compare-grid-component li{list-style:none}
.compare-grid-component .compare-grid-title{font-size:3pc;font-weight:700;line-height:84px;padding-bottom:1pc;text-align:center}
@media(max-width:1219px){.compare-grid-component .compare-grid-title{font-size:40px;line-height:66px;margin:auto;max-width:728px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-title{font-size:28px;line-height:42px}
}
.compare-grid-component .compare-grid-link{display:block;font-size:1pc;font-weight:500;line-height:19px;margin:0 auto 60px;max-width:610px;overflow:hidden;padding:9pt;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;width:auto}
.compare-grid-component .compare-grid-link span{overflow:hidden;text-overflow:ellipsis}
@media(max-width:767px){.compare-grid-component .compare-grid-link span{max-width:calc(100vw - 75pt)}
.compare-grid-component .compare-grid-link{margin:0 auto 20px}
}
.compare-grid-component .compare-grid-link:hover{text-decoration:underline}
.compare-grid-component .compare-grid-link:active,.compare-grid-component .compare-grid-link:focus{color:var(--dark-click-btn-color)}
.compare-grid-component .compare-grid-link:active.hide-arrow,.compare-grid-component .compare-grid-link:focus.hide-arrow{display:inline-block !important}
.compare-grid-component .compare-grid-link:active.hide-arrow:after,.compare-grid-component .compare-grid-link:focus.hide-arrow:after{content:"";margin:0}
.compare-grid-component .compare-grid-tab-container .compare-grid-tabs{display:-webkit-box;display:-ms-flexbox;display:flex;gap:2pc;width:100%}
.compare-grid-component .compare-grid-tab-container .compare-grid-tabs:not(.swiper-wrapper){-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow-x:auto}
.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab{-ms-flex-negative:0;color:var(--pastel-gray);cursor:pointer;flex-shrink:0;font-family:Roboto,sans-serif;font-size:18px;font-weight:400;line-height:27px;text-align:center;text-decoration:none;width:164px}
.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab.active,.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab:active,.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab:focus{color:var(--black)}
.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab.active .underline,.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab:active .underline,.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab:focus .underline{background-color:var(--black)}
.compare-grid-component .compare-grid-tab-container .compare-grid-tabs .tab .underline{background-color:var(--white);border-radius:2px;height:4px;margin-top:8px;width:100%}
.compare-grid-component .compare-grid-tab-container .swiper.swiper-tab .compare-grid-tabs{gap:0}
.compare-grid-component .compare-grid-tab-desc{margin-bottom:40px;margin-top:1pc;text-align:center}
.compare-grid-component .compare-grid-tab-desc p{font-family:Roboto,sans-serif;font-size:1pc;font-weight:400;line-height:24px}
.compare-grid-component .compare-grid-content{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;gap:20px;justify-content:center;width:100%}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container{margin:0 auto;padding-left:20px;width:641px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container{padding-left:0;width:267px}
}
@media(min-width:1221px){.compare-grid-component .compare-grid-content .column-container.columns-6{width:70pc}
.compare-grid-component .compare-grid-content .column-container.columns-6 .swiper-wrapper{-webkit-column-gap:30px;-moz-column-gap:30px;column-gap:30px}
.compare-grid-component .compare-grid-content .column-container:not(.columns-6){width:915pt}
}
.compare-grid-component .compare-grid-content .column-container:not(.columns-6) .swiper-wrapper{-webkit-column-gap:55px;-moz-column-gap:55px;column-gap:55px}
@media(min-width:1221px){.compare-grid-component .compare-grid-content .column-container:not(.columns-6) .swiper-wrapper{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container:not(.columns-6) .swiper-wrapper{-webkit-column-gap:20px;-moz-column-gap:20px;column-gap:20px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container:not(.columns-6) .swiper-wrapper{-webkit-column-gap:17px;-moz-column-gap:17px;column-gap:17px}
}
@media(max-width:1220px) and (min-width:768px){.compare-grid-component .compare-grid-content .column-container.columns-1 .swiper-wrapper,.compare-grid-component .compare-grid-content .column-container.columns-2 .swiper-wrapper{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container.columns-1 .swiper-wrapper{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
}
.compare-grid-component .compare-grid-content .column-container .swiper-wrapper{display:grid}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .swiper-wrapper{-webkit-column-gap:55px;-moz-column-gap:55px;column-gap:55px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .swiper-wrapper{-webkit-column-gap:17px;-moz-column-gap:17px;column-gap:17px}
}
.compare-grid-component .compare-grid-content .column-container .sticky-top{background-color:var(--white);display:none;position:sticky;top:50px;z-index:49}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .sticky-top{top:66px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .sticky-top{top:58px}
}
.compare-grid-component .compare-grid-content .column-container .sticky-top.show{display:block}
.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide{max-width:200px;padding-top:20px;text-align:center}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide{max-width:187px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide{max-width:125px}
}
.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide.sticky-title{border-bottom:2px solid var(--light-gray);height:auto;padding-bottom:10px}
@media(min-width:1221px){.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide.sticky-title{line-height:30px;max-height:110px;overflow:hidden}
}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide.sticky-title{font-size:20px;line-height:27px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide.sticky-title{font-size:1pc;line-height:24px}
}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide.sticky-title{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;justify-content:center}
}
.compare-grid-component .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide .divide-line{margin-bottom:0}
.compare-grid-component .compare-grid-content .column-container .prod-slides{display:contents;text-align:center;width:200px}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides{width:125px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .img-container{grid-row:1;margin-bottom:1pc}
.compare-grid-component .compare-grid-content .column-container .prod-slides .img-container img{height:auto;width:200px}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .prod-slides .img-container img{width:187px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .img-container img{width:125px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .color-dots .dot{border-radius:50%;display:inline-block;height:1pc;margin-bottom:1pc;width:1pc}
.compare-grid-component .compare-grid-content .column-container .prod-slides .color-dots .dot:not(:last-child){margin-right:1pc}
.compare-grid-component .compare-grid-content .column-container .prod-slides .tagContainer .tag{color:var(--red);font-family:Roboto,sans-serif;font-size:1pc;grid-row:3;height:24px;line-height:24px;margin-bottom:8px}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .tagContainer .tag{height:auto;max-height:24px;min-height:9pt}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .title{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;grid-row:4;height:auto;justify-content:center;margin-bottom:1pc}
@media(min-width:1221px){.compare-grid-component .compare-grid-content .column-container .prod-slides .title{line-height:30px;max-height:110px;overflow:hidden}
}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .prod-slides .title{font-size:20px;line-height:27px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .title{font-size:1pc;line-height:24px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .desc{color:var(--silver);font-family:Roboto,sans-serif;font-size:1pc;grid-row:5;height:3pc;line-height:24px;margin-bottom:1pc;overflow:hidden}
.compare-grid-component .compare-grid-content .column-container .prod-slides .price-line{font-family:Roboto,sans-serif;font-size:9pt;grid-row:6;line-height:18px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .price-line.hasPrice{height:30px;margin-bottom:22px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .price-line .price-number{font-size:20px;line-height:150%}
.compare-grid-component .compare-grid-content .column-container .prod-slides .price-line .price-number .from{font-family:Roboto,sans-serif;font-size:9pt}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .prod-slides .price-line .price-number{font-size:18px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .button{border-radius:4px;font-size:14px;font-weight:400;grid-row:7;height:33px;line-height:21px;margin:0 auto;min-width:59px;padding:6px 9pt;text-align:center;width:auto !important}
.compare-grid-component .compare-grid-content .column-container .prod-slides .button:hover{background:var(--light-hover-btn-color);border-color:var(--light-hover-btn-color);color:var(--white)}
.compare-grid-component .compare-grid-content .column-container .prod-slides .button:active{background:var(--light-click-btn-color);border-color:var(--light-click-btn-color);color:var(--white)}
.compare-grid-component .compare-grid-content .column-container .prod-slides .link{color:var(--primary-color);display:block;font-family:Roboto,sans-serif;font-size:1pc;font-weight:500;line-height:19px;margin:2pc auto 0;max-width:610px;overflow:hidden;padding:4px;text-align:center;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;width:auto}
.compare-grid-component .compare-grid-content .column-container .prod-slides .link span{margin-left:10px}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .link{margin-top:20px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box{display:contents;margin:0 auto;width:200px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-desc p,.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-title p{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--silver);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:Roboto,sans-serif;font-size:14px;justify-content:center;line-height:21px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-desc p{height:auto;margin-bottom:4px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-title p{margin-top:4px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle{-ms-flex-item-align:center;align-self:center;height:100%;position:relative}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-value{-ms-flex-pack:distribute;-webkit-box-orient:vertical;-webkit-box-direction:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;justify-content:space-around}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-value p{margin:0 auto;width:150px}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-value p{width:138px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-value p{font-size:1pc;line-height:24px;width:93px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;justify-content:center}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons{font-size:0}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons.left-align{text-align:initial}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons .icon{height:54px;width:54px}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons .icon{height:34px;width:34px}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons .icon:not(:last-child){margin-right:2px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons .no-value{font-family:Poppins,sans-serif;font-size:20px;font-weight:600;margin:0 auto;width:150px}
@media(max-width:1219px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons .no-value{width:138px}
}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .spec-icons .no-value{font-size:1pc;line-height:24px;width:93px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .info{cursor:pointer;height:24px;position:absolute;right:0;top:0;width:24px}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .info{height:1pc;width:1pc}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box+.spec-box .spec-desc{margin-top:60px}
@media(max-width:767px){.compare-grid-component .compare-grid-content .column-container .prod-slides .spec-box+.spec-box .spec-desc{margin-top:40px}
}
.compare-grid-component .compare-grid-content .column-container .prod-slides .model-container .model{color:var(--primary-color);font-family:Roboto,sans-serif;font-size:14px;font-weight:500;line-height:21px;text-decoration:none}
.compare-grid-component .popup{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-box-pack:center;-ms-flex-pack:center;background:rgba(0,0,0,.5);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100vh;justify-content:center;left:50%;opacity:0;position:fixed;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);visibility:hidden;width:100vw;z-index:100;z-index:-3}
.compare-grid-component .popup.show{opacity:1;visibility:visible;z-index:100}
.compare-grid-component .popup.show .popup-container{opacity:1;scale:1;-webkit-transition:opacity .3s cubic-bezier(.2,.4,.6,1),visibility .3s cubic-bezier(.2,.4,.6,1),scale .3s cubic-bezier(.2,.4,.6,1);transition:opacity .3s cubic-bezier(.2,.4,.6,1),visibility .3s cubic-bezier(.2,.4,.6,1),scale .3s cubic-bezier(.2,.4,.6,1);visibility:visible;z-index:100}
.compare-grid-component .popup-container{background-color:var(--white);border-radius:2pc;height:auto;margin:auto;max-height:90vh;overflow-y:auto;padding:5pc 60px 60px;position:relative;scale:0;text-align:center;z-index:3}
.compare-grid-component .popup-container::-webkit-scrollbar{width:4px}
.compare-grid-component .popup-container::-webkit-scrollbar-thumb{background:var(--pastel-gray);border-radius:4px}
@media(max-width:1219px){.compare-grid-component .popup-container{border-radius:24px}
}
@media(max-width:767px){.compare-grid-component .popup-container{border-radius:9pt;padding:40px 20px}
}
.compare-grid-component .popup-container .popup-title+.popup-text{margin-top:1pc}
.compare-grid-component .popup-container.rich{width:60pc}
@media(max-width:1219px){.compare-grid-component .popup-container.rich{width:calc(100vw - 10pc)}
}
@media(max-width:767px){.compare-grid-component .popup-container.rich{width:calc(100vw - 40px)}
}
.compare-grid-component .popup-container.rich .text-component{height:auto}
.compare-grid-component .popup-container.rich .text-component .text-desc{color:var(--black) !important}
.compare-grid-component .popup-container.rich .rich-img{height:auto;width:100%}
.compare-grid-component .popup-container.simple{width:500px}
@media(max-width:767px){.compare-grid-component .popup-container.simple{width:15pc}
}
.compare-grid-component .popup-container .close{cursor:pointer;height:40px;position:absolute;right:20px;top:20px;width:40px}
@media(max-width:767px){.compare-grid-component .popup-container .close{height:24px;right:10px;top:10px;width:24px}
}
.compare-grid-component .popup .overlay{height:100%;position:absolute;width:100%;z-index:2}
.compare-grid-component .arrow{border-color:var(--silver);border-radius:50%;border-width:4px;display:inline-block;height:40px;opacity:0;position:absolute;-webkit-transition:opacity .3s;transition:opacity .3s;width:40px}
.compare-grid-component .arrow.show{display:block;opacity:1;-webkit-transition:opacity .3s;transition:opacity .3s}
@media(max-width:1219px){.compare-grid-component .arrow{border-width:2.75px;height:40px;width:40px}
}
@media(max-width:767px){.compare-grid-component .arrow{border-width:2px;height:24px;width:24px}
}
.compare-grid-component .arrow-left{left:calc(50% - 618px)}
.compare-grid-component .arrow-left svg{left:17px;position:absolute;top:13px}
@media(max-width:1219px){.compare-grid-component .arrow-left{left:calc(50% - 361px)}
.compare-grid-component .arrow-left svg{height:1pc;left:15px;top:10px;width:8px}
}
@media(max-width:767px){.compare-grid-component .arrow-left{left:calc(50% - 173.5px)}
.compare-grid-component .arrow-left svg{height:8.8px;left:8px;top:5px;width:4.4px}
}
.compare-grid-component .arrow-right{right:calc(50% - 618px)}
.compare-grid-component .arrow-right svg{position:absolute;right:17px;top:13px}
@media(max-width:1219px){.compare-grid-component .arrow-right{right:calc(50% - 361px)}
.compare-grid-component .arrow-right svg{height:1pc;left:15px;top:10px;width:8px}
}
@media(max-width:767px){.compare-grid-component .arrow-right{right:calc(50% - 173.5px)}
.compare-grid-component .arrow-right svg{height:8.8px;left:8px;top:5px;width:4.4px}
}
.compare-grid-component .arrow circle,.compare-grid-component .arrow path{stroke:var(--silver)}
.compare-grid-component .arrow:active{border-color:var(--dark-gray)}
.compare-grid-component .arrow:active circle,.compare-grid-component .arrow:active path{stroke:var(--dark-gray)}
.compare-grid-component .arrow.swiper-button-disabled{border-color:var(--pastel-gray);cursor:not-allowed}
.compare-grid-component .arrow.swiper-button-disabled circle,.compare-grid-component .arrow.swiper-button-disabled path{stroke:var(--pastel-gray)}
.compare-grid-component .btn_wrap{position:sticky;top:50%;z-index:2}
.compare-grid-component .compare-grid-backToAll-link{display:block;font-family:Roboto,Arial,微軟正黑體,Helmet,Freesans,verdana,sans-serif;font-weight:500;margin:9pt auto;max-width:610px;overflow:hidden;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;width:auto}
.compare-grid-component .compare-grid-backToAll-link span{overflow:hidden;text-overflow:ellipsis}
@media(max-width:767px){.compare-grid-component .compare-grid-backToAll-link span{max-width:calc(100vw - 75pt)}
}
.compare-grid-component .divide-line{background-color:var(--light-gray);height:2px;margin:40px 0;width:100%}
@media(max-width:767px){.compare-grid-component .divide-line{margin:20px 0}
}
.compare-grid-component .swiper-slide:not(:last-child) .divide-line.last{width:calc(100% + 56px)}
@media(max-width:767px){.compare-grid-component .swiper-slide:not(:last-child) .divide-line.last{width:calc(100% + 18px)}
}
.compare-grid-component.darkMode{background-color:var(--black)}
.compare-grid-component.darkMode .compare-grid-title{color:var(--white)}
.compare-grid-component.darkMode .compare-grid-link{color:var(--secondary-color)}
.compare-grid-component.darkMode .compare-grid-link span svg path{fill:var(--secondary-color)}
.compare-grid-component.darkMode .compare-grid-tab-container .compare-grid-tabs .tab{color:var(--silver)}
.compare-grid-component.darkMode .compare-grid-tab-container .compare-grid-tabs .tab .underline{background-color:var(--silver)}
.compare-grid-component.darkMode .compare-grid-tab-container .compare-grid-tabs .tab.active{color:var(--white)}
.compare-grid-component.darkMode .compare-grid-tab-container .compare-grid-tabs .tab.active .underline{background-color:var(--white)}
.compare-grid-component.darkMode .compare-grid-tab-desc{color:var(--white)}
.compare-grid-component.darkMode .compare-grid-content .column-container .sticky-top{background-color:var(--black);color:var(--white)}
.compare-grid-component.darkMode .compare-grid-content .column-container .sticky-top .swiper-wrapper .swiper-slide.sticky-title{border-bottom:2px solid var(--dark-gray)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .title{color:var(--white)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .desc{color:var(--pastel-gray)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .price-line{color:var(--white)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .button{background-color:var(--white);color:var(--black)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .link{color:var(--secondary-color)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .link span svg path{fill:var(--secondary-color)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .spec-box{color:var(--white)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .spec-box .spec-desc p,.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .spec-box .spec-title p{color:var(--pastel-gray)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .spec-box .spec-middle .info{background-image:url(../../../../etc/designs/g6/clientlib-site/img/g6/svg-icon/btn-info-dark-bg.svg)}
.compare-grid-component.darkMode .compare-grid-content .column-container .prod-slides .model-container .model{color:var(--secondary-color)}
.compare-grid-component.darkMode .arrow{border-color:var(--silver);border-radius:50%;border-width:4px;display:inline-block;height:40px;opacity:0;position:absolute;-webkit-transition:opacity .3s;transition:opacity .3s;width:40px}
.compare-grid-component.darkMode .arrow.swiper-button-disabled.show{opacity:.5}
.compare-grid-component.darkMode .arrow.show{display:block;opacity:1;-webkit-transition:opacity .3s;transition:opacity .3s}
@media(max-width:1219px){.compare-grid-component.darkMode .arrow{border-width:2.75px;height:40px;width:40px}
}
@media(max-width:767px){.compare-grid-component.darkMode .arrow{border-width:2px;height:24px;width:24px}
}
.compare-grid-component.darkMode .arrow-left{left:calc(50% - 618px)}
.compare-grid-component.darkMode .arrow-left svg{left:17px;position:absolute;top:13px}
@media(max-width:1219px){.compare-grid-component.darkMode .arrow-left{left:calc(50% - 361px)}
.compare-grid-component.darkMode .arrow-left svg{height:1pc;left:15px;top:10px;width:8px}
}
@media(max-width:767px){.compare-grid-component.darkMode .arrow-left{left:calc(50% - 173.5px)}
.compare-grid-component.darkMode .arrow-left svg{height:8.8px;left:8px;top:5px;width:4.4px}
}
.compare-grid-component.darkMode .arrow-right{right:calc(50% - 618px)}
.compare-grid-component.darkMode .arrow-right svg{position:absolute;right:17px;top:13px}
@media(max-width:1219px){.compare-grid-component.darkMode .arrow-right{right:calc(50% - 361px)}
.compare-grid-component.darkMode .arrow-right svg{height:1pc;left:15px;top:10px;width:8px}
}
@media(max-width:767px){.compare-grid-component.darkMode .arrow-right{right:calc(50% - 173.5px)}
.compare-grid-component.darkMode .arrow-right svg{height:8.8px;left:8px;top:5px;width:4.4px}
}
.compare-grid-component.darkMode .arrow circle,.compare-grid-component.darkMode .arrow path{stroke:var(--silver)}
.compare-grid-component.darkMode .arrow:hover{background-color:var(--dark-gray)}
.compare-grid-component.darkMode .arrow:active{background-color:var(--black);border-color:var(--pastel-gray)}
.compare-grid-component.darkMode .arrow:active circle,.compare-grid-component.darkMode .arrow:active path{stroke:var(--pastel-gray)}
.compare-grid-component.darkMode .divide-line{background-color:var(--dark-gray)}
.compare-grid-component.darkMode .compare-grid-backToAll-link{color:var(--secondary-color)}
.compare-grid-component.darkMode .compare-grid-backToAll-link span svg path{fill:var(--secondary-color)}
div[dir=rtl] .compare-grid-component .compare-grid-link span{margin-left:0;margin-right:10px}
div[dir=rtl] .compare-grid-component .compare-grid-link span svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
div[dir=rtl] .compare-grid-component .compare-grid-backToAll-link span{margin-left:0;margin-right:10px}
div[dir=rtl] .compare-grid-component .compare-grid-backToAll-link span svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}