/* @charset "UTF-8";
@-webkit-keyframes shine {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes shine {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes AniFloat {
  0% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
  50% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
  100% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
}

@keyframes AniFloat {
  0% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
  50% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
  100% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
}

:root {
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI",'Microsoft JhengHei',"Noto Sans TC", "微軟正黑體", "Meiryo UI", Roboto, Helvetica, Arial, sans-serif;
  --mainTitle: 22px;
  --mainTxt: 18px;
  --mainPrice: 20px;
  --mainNote: 15px;
  --font-color-dark: #fff;
  --font-color-light: #111;
}

@media (min-width: 768px) {
  :root {
    --mainTitle: 32px;
    --mainTxt: 20px;
    --mainPrice: 20px;
    --mainNote: 15px;
  }
}

:root html:lang(ja-JP) *:not(.material-icons):not(.fa):not(.buttonicons) {
  --font: -apple-system, BlinkMacSystemFont,"Meiryo UI", Arial, sans-serif;
}

img {
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.common__btn {
  text-align: center;
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
  color: #c6c6c6;
  padding: 20px 10px;
  margin: 0 0px;
  display: block;
  border-image-source: linear-gradient(to left, #292929, #ae821b, #292929);
  border-image-slice: 1;
  border-width: 2px;
  text-shadow: none;
  font-size: 18px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  font-weight: normal;
}

{
  background-color: #0e0e0e;
}

.menu {
  background: #292929;
  background: -webkit-gradient(linear, left top, right top, from(#504124), color-stop(50%, #ffeec8d8), to(#504124));
  background: linear-gradient(90deg, #504124 0%, #ffeec8d8 50%, #504124 100%);
}

.menu__tabBox {
  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;
}

.menu__tab {
  color: #222;
  text-align: center;
  width: 100%;
  margin: 0 auto;
  padding: 20px 10px;
  border-right: 2px solid #fff0ce;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  text-transform: uppercase;
  cursor: pointer;
  font-weight: bold;
}

.menu__tab:nth-child(3) {
  border: none;
}

.menu__tab:hover {
  background: #ffeec8;
  color: #222;
}

.menu__tab:hover:nth-child(1) {
  background: #f1cea0;
  background: -webkit-gradient(linear, left top, right top, from(#22222200), to(#ffefca));
  background: linear-gradient(90deg, #22222200 0%, #ffefca 100%);
}

.menu__tab:hover:nth-child(3) {
  background: #f1cea0;
  background: -webkit-gradient(linear, left top, right top, from(#ffefca), to(#22222200));
  background: linear-gradient(90deg, #ffefca 0%, #22222200 100%);
}

.menu__tab--active {
  background: #ffeec8;
  color: #222;
}

.menu__tab--active:nth-child(1) {
  background: #f1cea0;
  background: -webkit-gradient(linear, left top, right top, from(#22222200), to(#ffefca));
  background: linear-gradient(90deg, #22222200 0%, #ffefca 100%);
}

.menu__tab--active:nth-child(3) {
  background: #f1cea0;
  background: -webkit-gradient(linear, left top, right top, from(#ffefca), to(#22222200));
  background: linear-gradient(90deg, #ffefca 0%, #22222200 100%);
} */

.content {
  /* display: none; */
}

.content--active {
  display: block;
}

.overview__tabBox {
  padding: 20px 0;
}

.overview__tab {
  /* padding: 20px 10px;
  cursor: pointer; */
}

/* .overview__tab p {
  text-align: center;
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
  color: #c6c6c6;
  padding: 20px 10px;
  margin: 0 0px;
  display: block;
  border-image-source: linear-gradient(to left, #292929, #ae821b, #292929);
  border-image-slice: 1;
  text-shadow: none;
  font-size: 18px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  font-weight: normal;
}

.overview__tab:hover p {
  border-image-source: linear-gradient(to left, #292929, #ffeec8, #292929);
  color: #ffeec8;
}

.overview .slick-current .overview__tab > p {
  border-image-source: linear-gradient(to left, #292929, #ffeec8, #292929);
  color: #ffeec8;
} */

.overview__item {
  /* padding: 20px 20px; */
  height: auto;
}

.overview__item--active {
  display: block;
}

.overview__item--1 {
  /* background-image: url("/images/SMOOTH-GAMEPLAY-dark.jpg");
  background-position: cemter center;
  background-repeat: no-repeat; */
  background-color: #000;
  /* background-size: cover; */
}

.overview__item--2 {
  /* background-image: url("/images/QUANTUM-DOT-DISPLAY-dark.png");
  background-position: cemter top;
  background-repeat: no-repeat; */
  background-color: #000;
  /* background-size: cover; */
}

.overview__item--3 {
  /* background-image: url("/images/HDR-dark.png");
  background-position: cemter top;
  background-repeat: no-repeat; */
  background-color: #000;
  /* background-size: cover; */
}

.overview__item--4 {
  /* background-image: url("https://storage-asset.msi.com/global/picture/image/feature/monitor/MAG321QR-QD/images/gamingIntelligence-bg.jpg");
  background-position: cemter top;
  background-repeat: no-repeat; */
  background-color: #000;
  /* background-size: cover; */
}

.overview__item--5 {
  padding: 0;
}

.overview__item-pic {
  width: 100%;
  margin: 0 auto;
}

.overview__item-txt {
  width: 100%;
  margin: 0 auto;
}

.overview__itemBox .item-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 30px 0 20px;
}

.overview__itemBox .item-icon img {
  height: 35px;
  margin-right: 25px;
}

.overview__itemBox h2 {
  margin-bottom: 10px;
}

.overview__itemBox .download-btn {
  background-color: #fff;
  padding: 10px 15px;
  margin-bottom: 20px;
  display: inline-block;
  color: #000;
}

.overview__itemBox .text--note {
  font-size: var(--note-lg);
  color: #ababab;
}

@media (min-width: 996px) {
  .overview__itemFlex {
    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;
  }
  .overview__item {
    /* padding: 80px 20px; */
  }
  .overview__item-pic {
    width: 60%;
    margin: 0 20px;
    text-align: center;
  }
  .overview__item-txt {
    width: 40%;
    margin: 0 20px;
  }
  .overview__itemBox .item-icon {
    margin-bottom: 20px;
  }
  .overview__itemBox .item-icon img {
    height: 50px;
    margin-right: 30px;
  }
}



/* slider content style */
@keyframes titleLine{
  0%{
      left:-50%
  }
  100%{
      left:100%
  }
}
#filterbox h2,.best .common__title{
  font-size:var(--title-xl);
  text-transform:uppercase;
  font-weight:bold;
  background:linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(236, 65, 241, 0.3) 30%, rgba(236, 65, 241, 0.5) 55%, rgba(236, 65, 241, 0.3) 80%, rgba(236, 65, 241, 0) 100%);
  padding:15px 20px;
  border-radius:5px;
  display:block;
  position:relative
}
#filterbox h2::before,.best .common__title::before{
  content:"";
  position:absolute;
  width:90%;
  height:1px;
  top:0px;
  background:linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(236, 65, 241, 0.6) 45%, rgba(236, 65, 241, 0.6) 55%, rgba(255, 51, 51, 0) 100%);
  animation:3s titleLine infinite ease
}
#filterbox h2::after,.best .common__title::after{
  content:"";
  position:absolute;
  width:90%;
  height:1px;
  bottom:0px;
  background:linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(236, 65, 241, 0.6) 45%, rgba(236, 65, 241, 0.6) 55%, rgba(255, 51, 51, 0) 100%);
  animation:3s titleLine .2s infinite ease
}
#filterbox .nosp,#filterbox h4,#filterbox h3{
  font-size:var(--title-lg);
  text-transform:uppercase;
  font-weight:bold;
  padding-bottom:15px;
  margin:45px 0 20px
}
#toolbar{
  background:#222
}
#toolbar ul{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-right:50px
}
#toolbar ul img{
  width:20px;
  margin:0 auto
}
#toolbar ul li{
  flex:1;
  text-align:center
}
#toolbar ul li a{
  display:block;
  padding:10px
}
@media(min-width: 996px){
  #toolbar{
      position:fixed;
      z-index:999;
      right:0;
      bottom:0;
      background:none
  }
  #toolbar ul{
      display:block;
      margin-right:0
  }
  #toolbar ul li{
      margin:2px 0
  }
  #toolbar ul li a{
      background:rgba(34,34,34,.8);
      padding:15px
  }
  #toolbar ul li a:hover{
      background:linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(236, 65, 241, 0.6) 45%, rgba(236, 65, 241, 0.6) 55%, rgba(255, 51, 51, 0) 100%)
  }
}
#gotop{
  position:fixed;
  z-index:999;
  bottom:0;
  right:10px
}
@media(min-width: 996px){
  #gotop{
      position:relative;
      right:0
  }
}
.best{
  background:#000;
  color:#fff;
  overflow-x:hidden;
  line-height:1.7
}
.best img{
  max-width:100%
}
.best .common__container{
  max-width:1200px;
  padding:60px 25px;
  margin:0 auto
}
.best .common__title{
  text-align:center
}
.kv{
  position:relative;
  text-align:center;
  overflow:hidden;
  padding-bottom:1px
}
.kv img{
  width:100%
}
.kv__bg{
  position:absolute;
  width:100%;
  top:0;
  left:0;
  z-index:0
}
.kv__bg--lg{
  display:none
}
.kv__box{
  position:relative;
  z-index:2;
  padding:25px 25px 120px
}
.kv__intel{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  text-align:right;
  font-size:13px;
  line-height:13px
}
.kv__intel img{
  width:45px;
  margin-left:8px
}
.kv__title{
  text-transform:uppercase
}
.kv__title h1{
  font-weight:300;
  font-size:20px;
  letter-spacing:5px;
  line-height:1.4
}
.kv__title h1 strong{
  color:#ec41f1;
  display:block;
  font-weight:bold;
  letter-spacing:0;
  font-size:9vw
}
.kv__title p{
  line-height:1.5;
  opacity:.8;
  padding-top:5px
}
.kv__pd{
  width:100%;
  margin:0 auto;
  max-width:1400px;
  padding-top:25vw
}
.kv__scrollBtn{
  position:absolute;
  z-index:10;
  left:50%;
  bottom:25px;
  transform:translateX(-50%);
  text-align:center;
  font-size:12px;
  color:#fff;
  cursor:pointer;
  transition:all .3s ease-in-out
}
.kv__scrollBtn i{
  width:24px;
  height:40px;
  display:block;
  position:relative;
  margin:0 auto;
  border:#999 1px solid;
  border-radius:12px;
  transition:inherit
}
.kv__scrollBtn i::before{
  content:"";
  width:6px;
  height:6px;
  position:absolute;
  border-radius:6px;
  top:4px;
  left:50%;
  transform:translateX(-50%);
  background:#fff;
  transition:inherit
}
.kv__scrollBtn p{
  position:relative;
  z-index:2;
  opacity:1;
  margin-top:-20px;
  letter-spacing:4px;
  text-transform:uppercase;
  transition:inherit
}
.kv__scrollBtn:hover i{
  background:#222
}
.kv__scrollBtn:hover i::before{
  animation:scrollDown 1s ease infinite;
  background:#999
}
.kv__scrollBtn:hover p{
  opacity:0;
  letter-spacing:12px;
  transform:translateY(-32px)
}
@media(min-width: 996px){
  .kv{
      background:#000;
      /* padding-bottom:30px */
  }
  .kv__bg--xs{
      display:none
  }
  .kv__bg--lg{
      display:block
  }
  .kv__box{
      padding:45px 45px 120px
  }
  .kv__intel img{
      width:80px
  }
  .kv__pd{
      padding-top:5vw
  }
  .kv__title{
      text-align:left;
      position:relative;
      margin-top:-9%;
      margin-left:10%
  }
  .kv__title h1 strong{
      font-size:4vw
  }
  .kv__scrollBtn{
      bottom:40px
  }
}
@keyframes scrollDown{
  from{
      top:4px
  }
  to{
      top:10px
  }
}
#filterbox{
  background:url("../images/bg-filter.webp") center center no-repeat ;
  background-size:cover;
  background-attachment:fixed;
  padding:0px 25px 60px
}
#filterbox .container{
  max-width:1200px;
  margin:0 auto
}
#filterbox h2{
  text-align:center
}
#filterbox h3{
  text-align:center
}
#filterbox h4{
  color:#fff;
  text-align:center;
  font-size:18px
}
#filterbox #show-ad-filter{
  width:40px;
  height:40px;
  border:#ec41f1 1px solid;
  border-radius:40px;
  font-size:30px;
  color:#ec41f1;
  display:flex;
  justify-content:center;
  align-items:center;
  margin:0 auto 20px
}
#filterbox #show-ad-filter span:last-child{
  display:none
}
#filterbox .main-model li{
  border:#fff 1px solid;
  border-radius:10px;
  margin:10px 0;
  transform:skewX(-10deg);
  position:relative;
  background:rgba(0,0,0,.6)
}
#filterbox .main-model label{
  display:flex;
  transform:skewX(10deg);
  position:relative;
  padding:25px;
  background:rgba(0,0,0,.6)
}
#filterbox .main-model label::before{
  content:"";
  display:block;
  width:20px;
  height:20px;
  border-radius:5px;
  border:#fff 1px solid;
  flex:0 0 20px;
  margin-top:8px
}
#filterbox .main-model label span{
  display:block;
  margin-left:8px
}
#filterbox .main-model label b{
  display:block
}
#filterbox .main-model input[type=checkbox]{
  display:none
}
#filterbox .main-model input[type=checkbox]:checked+label{
  color:#ec41f1
}
#filterbox .main-model input[type=checkbox]:checked+label::before{
  background:url("../images/icon-check.png") top center no-repeat ;
  background-size:cover;
  background-color:#ec41f1;
  border-color:#ec41f1
}
#filterbox .main-model input[type=checkbox]:disabled~label{
  color:#999;
  cursor:not-allowed;
  background:rgba(255,255,255,.01)
}
#filterbox .main-model input[type=checkbox]:disabled+label::before{
  color:#999;
  cursor:not-allowed;
  border-color:#999;
  background:url("../images/icon-del.png") top center no-repeat ;
  background-size:cover
}
#filterbox #ad-filter .tr{
  border:#333 1px solid;
  border-radius:10px;
  overflow:hidden;
  margin:5px auto
}
#filterbox #ad-filter .th{
  background:#444;
  text-align:center;
  padding:8px
}
#filterbox #ad-filter .td{
  padding:15px
}
#filterbox #ad-filter .td li{
  padding:8px
}
#filterbox #ad-filter label{
  display:flex;
  position:relative;
  cursor:pointer
}
#filterbox #ad-filter label:hover{
  color:#ec41f1
}
#filterbox #ad-filter label::before{
  content:"";
  display:block;
  width:15px;
  height:15px;
  border-radius:5px;
  border:#fff 1px solid;
  flex:0 0 15px;
  margin-top:8px
}
#filterbox #ad-filter label span{
  display:block;
  margin-left:8px
}
#filterbox #ad-filter input[type=checkbox]{
  display:none
}
#filterbox #ad-filter input[type=checkbox]:checked~label{
  color:#ec41f1
}
#filterbox #ad-filter input[type=checkbox]:checked+label::before{
  background:url("../images/icon-check.png") top center no-repeat ;
  background-size:cover;
  background-color:#ec41f1;
  border-color:#ec41f1
}
#filterbox #ad-filter input[type=checkbox]:disabled~label{
  color:#666;
  cursor:not-allowed;
  opacity:.6
}
#filterbox #ad-filter input[type=checkbox]:disabled+label::before{
  color:#666;
  cursor:not-allowed;
  border-color:#999;
  background:url("../images/icon-del.png") top center no-repeat ;
  background-size:cover
}
#filterbox #ad-filter-bt{
  text-align:center;
  padding-top:25px
}
#filterbox #ad-filter-bt button{
  text-transform:uppercase;
  padding:15px 25px;
  border:#ec41f1 1px solid;
  color:#ec41f1;
  outline:none;
  font-size:100%
}
#filterbox #ad-filter-bt button:hover{
  background:#ec41f1;
  color:#fff
}
#filterbox #result-pd{
  color:#fff
}
#filterbox #result-pd .pd{
  margin:45px auto;
  text-align:center
}
#filterbox #result-pd input[type=checkbox]{
  display:none
}
#filterbox #result-pd .bt{
  display:flex;
  margin:15px auto 0
}
#filterbox #result-pd .bt button{
  color:#fff;
  background:rgba(255,255,255,.3);
  border:none;
  font-size:16px;
  outline:none;
  text-transform:uppercase;
  flex:1 !important;
  text-align:center;
  width:100%
}
#filterbox #result-pd .bt button label{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  cursor:pointer
}
#filterbox #result-pd .bt button label .compare{
  width:10px;
  height:2px;
  margin-right:5px;
  background:#fff;
  position:relative
}
#filterbox #result-pd .bt button label .compare::after{
  content:"";
  display:inline-block;
  position:absolute;
  top:0;
  left:0;
  width:10px;
  height:2px;
  background:#fff;
  transform:rotate(90deg);
  transition:.5s all ease-in-out
}
#filterbox #result-pd .bt button img{
  width:10px;
  margin-right:5px
}
#filterbox #result-pd .bt button:last-child{
  background:rgba(255,255,255,.5)
}
#filterbox #result-pd .bt button input[type=checkbox]{
  display:none
}
#filterbox #result-pd .bt button input[type=checkbox]:checked+label{
  background:#ec41f1
}
#filterbox #result-pd .bt button input[type=checkbox]:checked+label .compare::after{
  transform:rotate(0deg)
}
#filterbox #result-pd .bt button:hover{
  background:#ec41f1
}
#filterbox #bt-more-result button{
  text-transform:uppercase;
  padding:15px 25px;
  border:#ec41f1 1px solid;
  color:#ec41f1;
  outline:none;
  font-size:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  margin:0 auto
}
#filterbox #bt-more-result button:hover{
  background:#ec41f1;
  color:#fff
}
#filterbox #bt-more-result .plus{
  display:inline-block;
  width:10px;
  height:2px;
  margin-right:5px;
  background:#ec41f1;
  position:relative
}
#filterbox #bt-more-result .plus::after{
  content:"";
  display:inline-block;
  position:absolute;
  top:0;
  left:0;
  width:10px;
  height:2px;
  background:#ec41f1;
  transform:rotate(90deg)
}
@media(min-width: 768px){
  #filterbox #result-pd .pd{
      display:inline-block;
      width:calc(50% - 20px);
      margin:25px 10px;
      background:rgba(34,34,34,.8)
  }
  #filterbox #result-pd .pd:hover{
      transform:scale(1.05);
      background:rgba(236,65,241,.1);
      border-color:#ec41f1;
      box-shadow:#ec41f1 0 0 20px
  }
  #filterbox #result-pd .pd:hover .bt button{
      background:rgba(236,65,241,.1)
  }
  #filterbox #result-pd .pd:hover .bt button:last-child{
      background:rgba(236,65,241,.3)
  }
  #filterbox #result-pd .pd:hover .bt button:hover{
      background:rgba(236,65,241,.8)
  }
  #filterbox #result-pd .pd .img{
      padding:15px;
      margin-top:25px
  }
}
@media(min-width: 996px){
  #filterbox #show-ad-filter{
      display:none
  }
  #filterbox .main-model{
      display:flex
  }
  #filterbox .main-model li{
      flex:1;
      margin-right:25px
  }
  #filterbox .main-model li:last-child{
      margin-right:0
  }
  #filterbox #ad-filter .tr{
      display:flex;
      border:none;
      border-radius:0;
      overflow:visible
  }
  #filterbox #ad-filter .th{
      flex:0 0 200px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#111
  }
  #filterbox #ad-filter .td{
      flex:0 0 calc(100% - 200px);
      background:rgba(51,51,51,.9)
  }
  #filterbox #ad-filter .td ul{
      width:100%
  }
  #filterbox #ad-filter .td li{
      display:inline-block;
      width:calc(25% - 10px);
      margin-right:8px
  }
  #filterbox #ad-filter .td li:nth-child(4n){
      margin-right:0
  }
  #filterbox #result-pd .pd{
      width:calc(25% - 40px);
      margin:25px 20px
  }
  #filterbox h3{
      padding:60px 0 10px
  }
  #filterbox #bt-more-result{
      padding-top:30px;
      padding-bottom:70px
  }
}
.modal-dialog{
  width:100% !important;
  padding:25px
}
.modal-open{
  padding-right:0px !important
}
.modal-open .modal{
  background:rgba(0,0,0,.7) !important
}
.modal-content{
  text-align:left;
  line-height:1.8rem;
  display:flow-root;
  background:rgba(0,0,0,.6);
  color:#fff;
  border:0px solid #530001;
  padding:0 15px;
  letter-spacing:normal;
  border-radius:0px !important
}
.modal-content .ok{
  font-size:1em;
  background-color:#ffdc00;
  border-radius:3px;
  color:#000;
  border:0px;
  margin-top:15px
}
.modal-content p{
  padding-bottom:20px;
  font-size:18px
}
.modal-content .mediabox{
  width:100%;
  margin:0 auto;
  text-align:center;
  display:flex;
  justify-content:center
}
.modal-content .item{
  flex:1;
  max-width:350px;
  margin:10px
}
.modal-content .item ul{
  color:#fff;
  text-align:center;
  list-style:none;
  background:rgba(0,0,0,.8);
  border:3px solid rgba(255,0,0,.6);
  opacity:1;
  padding:15px;
  font-size:18px;
  -webkit-box-shadow:0 0 35px rgba(255,0,0,.7);
  box-shadow:0 0 35px rgba(255,0,0,.4);
  min-height:320px
}
.modal-content .item ul li{
  line-height:2em
}
.modal-content .item ul li img{
  padding-bottom:5px
}
.modal-content .item ul li.mntpd{
  color:#c00;
  font-size:110%;
  padding:2px 0px
}
.modal-content .item ul li.mname{
  color:#c00;
  line-height:normal
}
.modal-content .item ul li.introduction{
  font-size:80%;
  line-height:1.5
}
.modal .close{
  background:#880002 !important;
  width:30px;
  height:30px;
  border-radius:50px;
  text-align:center;
  border:none;
  color:#fff;
  opacity:1 !important;
  -webkit-box-shadow:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  padding:0px
}
.modal .close p{
  padding-bottom:5px;
  margin:0px
}
.modal .close:focus,.modal .close:hover{
  text-decoration:none;
  cursor:pointer;
  background:#c90003 !important;
  -webkit-box-shadow:none;
  box-shadow:none;
  text-shadow:none
}
.feature__nav{
  position:relative;
  align-items:stretch
}
.feature__nav li{
  -webkit-filter:grayscale(1);
  border:#222 2px solid;
  cursor:pointer;
  transition:1s all ease-in-out;
  padding:15px
}
.feature__nav li:nth-child(1){
  background:url("../images/tab1.webp") center center no-repeat ;
  background-size:cover;
  background-size:100%
}
.feature__nav li:nth-child(2){
  background:url("../images/tab2.webp") center center no-repeat ;
  background-size:cover;
  background-size:100%
}
.feature__nav li:nth-child(3){
  background:url("../images/tab3.webp") center center no-repeat ;
  background-size:cover;
  background-size:100%
}
.feature__nav li:nth-child(4){
  background:url("../images/tab4.webp") center center no-repeat ;
  background-size:cover;
  background-size:100%
}
.feature__nav li.active{
  -webkit-filter:grayscale(0)
}
.feature__nav li:hover{
  -webkit-filter:grayscale(0.6);
  background-size:120%
}
.feature__subnav{
  position:relative;
  align-items:stretch;
  background:#111;
  padding:50px 0 0
}
.feature__subnav ul{
  width:100%;
  margin:0 auto;
  max-width:1500px
}
.feature__subnav li{
  cursor:pointer;
  text-align:center;
  padding:15px
}
.feature__subnav li:hover{
  color:#ec41f1
}
.feature__subnav .slick-slide{
  position:relative
}
.feature__subnav .slick-current{
  color:#ec41f1
}
.feature__subnav .slick-current::after{
  content:"";
  position:absolute;
  width:100%;
  height:5px;
  left:0;
  bottom:0;
  background:linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(236, 65, 241, 0.6) 45%, rgba(236, 65, 241, 0.6) 55%, rgba(255, 51, 51, 0) 100%)
}
.feature__content{
  width:100%;
  margin:0 auto;
  max-width:1500px;
  text-align:center;
  position:relative
}
.feature__btn{
  color:#fff;
  z-index:9999
}
.feature__btn-next{
  right:-30px
}
.feature__btn-next::after{
  font-size:calc(var(--swiper-navigation-size)*50%)
}
.feature__btn-prev{
  left:-30px
}
.feature__btn-prev::after{
  font-size:calc(var(--swiper-navigation-size)*50%)
}
@media(min-width: 996px){
  .feature__btn{
      display:none
  }
}
.feature__title{
  font-size:var(--title-xl);
  text-transform:uppercase;
  font-weight:bold;
  color:#fff;
  line-height:1.2;
  padding-bottom:15px
}
.feature p{
  line-height:1.4
}
.feature__box{
  display:none
}
.feature__box.active{
  display:block
}
.feature__item a{
  color:#fff;
  text-decoration:none;
  border:#fff 1px solid;
  display:inline-block;
  padding:10px 25px;
  margin-top:25px
}
.feature__item a:hover{
  background:#333
}
@media(min-width: 996px){
  .feature__nav{
      display:flex
  }
  .feature__nav li{
      flex:1;
      height:250px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:26px;
      font-weight:bold;
      text-shadow:#222 1px 0px 2px;
      text-align:center;
      line-height:1.2;
      padding:25px
  }
  .feature__nav li.active{
      border-color:rgba(236,65,241,.6)
  }
  .feature__subnav{
      display:flex
  }
  .feature__title span{
      display:block
  }
}
.slick-arrow{
  position:absolute;
  color:#fff;
  top:50%;
  left:0;
  font-size:0;
  transform:translateY(-50%)
}
.slick-prev{
  left:15px
}
.slick-prev::before{
  content:"";
  font-family:"msi-icons" !important;
  font-size:18px
}
.slick-next{
  right:-82vw
}
.slick-next::before{
  content:"";
  font-family:"msi-icons" !important;
  font-size:18px
}
.nv{
  padding:45px 25px
}
.nv__badge{
  margin:15px auto
}
.nv__badge img{
  max-width:200px;
  margin:0 auto
}
@media(min-width: 996px){
  .nv__badge{
      text-align:right
  }
  .nv__text{
      width:80%;
      margin:0 auto;
      max-width:1000px
  }
  .nv__img{
      text-align:center;
      width:60%;
      margin:0 auto;
      max-width:auto
  }
}
.nvStudio{
  padding:45px 25px;
  text-align:center
}
.nvStudio__badge{
  max-width:350px;
  margin:25px auto
}
.nvStudio__badge img{
  width:100%
}
@media(min-width: 996px){
  .nvStudio__badge{
      margin:50px auto 40px
  }
  .nvStudio__text{
      width:80%;
      margin:0 auto;
      max-width:1000px
  }
}
@keyframes sparkle{
  0%{
      opacity:.6
  }
  100%{
      opacity:1
  }
}
.intel{
  position:relative;
  overflow:hidden;
}
.intel h2, .intel p {
  color: #fff;
}
.intel__img{
  max-width:2200px;
  margin:0 auto;
  position:relative;
}
.intel__img::before{
  content:"";
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  /* background:url("../images/intel-light-lt.png") top left no-repeat ; */
  background-size:cover;
  animation:sparkle 1s infinite ease-in;
}
.intel__img::after{
  content:"";
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  /* background:url("../images/intel-light-rt.png") top right no-repeat ; */
  background-size:cover;
  animation:sparkle 1s infinite .2s ease-in;
}
.intel__imgbox{
  position:absolute;
  width:150%;
  top:0;
  left:-25%;
  z-index:0;
  text-align:center;
}
@media(min-width: 996px){
  .intel {
    padding: 80px;
  }
  .intel__imgbox{
      width:100%;
      left:0;
  }
}
.intel__img img{
  width:100%;
  margin: 0 auto;
}
.intel__text__wrap{
  position:relative;
  z-index:1;
  text-align:center;
}
.intel__text__list{
  background:linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 10%, rgba(0, 0, 0, 0.5) 90%, rgba(0, 0, 0, 0) 100%);
  padding:15px 25px;
  color:#f8d46f;
  font-weight:300;
  text-transform:uppercase;
  font-size:14px;
}
.intel__text__list b{
  font-size:200%;
  color:#fff;
  font-weight:bold;
}
.intel__text__list li{
  border-bottom:#444 1px solid;
}
.intel__text__box{
  padding: 25px 0;
}
.intel__text__box h4{
  color:#aa855c;
}
@media(min-width: 768px){
  .intel__text__list b{
      font-weight:600;
  }
  .intel__text__list li{
      display:inline-block;
      line-height:1.2;
      margin:15px;
      border:none;
  }
  .intel__text__list span{
      display:block;
  }
}
@media(min-width: 996px){
  .intel__img img{
    width:85%;
  }
  .intel__text__wrap .sp{
      padding-bottom:0;
  }
  .intel__text__box{
      width:100%;
      margin:0 auto;
      max-width:1000px;
      padding-top:40px;
  }
  .intel__text__box h2{
      padding:5px 0 25px;
  }
  .intel__text__list b{
      font-size:54px;
  }
  .intel__text__list ul{
      display:flex;
  }
  .intel__text__list li{
      display:block;
      flex:1;
      line-height:1.2;
      margin:0;
      padding:25px;
      border-right:#444 1px solid;
  }
  .intel__text__list span{
      display:block;
  }
}
@keyframes air-in{
  0%{
      left:0;
      opacity:0;
  }
  25%{
      left:50px;
      opacity:1;
  }
  50%{
      left:100px;
      opacity:0;
  }
  100%{
      left:0;
      opacity:0;
  }
}
@keyframes air-in-2{
  0%{
      top:0;
      opacity:0;
  }
  25%{
      top:-25px;
      opacity:1;
  }
  50%{
      top:-50px;
      opacity:0;
  }
  100%{
      top:0;
      opacity:0;
  }
}
@keyframes air-out{
  0%{
      left:0px;
      opacity:0;
      transform:scale(0.8);
  }
  50%{
      left:-20px;
      opacity:0;
      transform:scale(0.8);
  }
  75%{
      left:0px;
      opacity:1;
      transform:scale(1);
  }
  99%{
      left:100px;
      opacity:0;
      transform:scale(1);
  }
  100%{
      left:-100px;
      opacity:0;
      transform:scale(0.8);
  }
}
@keyframes btn{
  0%{
      box-shadow:#e7cf6e 0 0 0px;
  }
  50%{
      box-shadow:#e7cf6e 0 0 20px;
  }
  100%{
      box-shadow:#e7cf6e 0 0 0px;
  }
}
.vd-container{
  position:relative;
  padding-bottom:56.25%;
  height:0;
  overflow:hidden;
}
.vd-container iframe,.vd-container object,.vd-container embed,.vd-container video{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:100%;
}
.cooling{
  position:relative;
  /* overflow:hidden; */
  /* padding: 10% 0; */
}
.cooling p {
  color: #fff;
}
.cooling__bg{
  position:absolute;
  width:100%;
  top:0;
  left:0;
  z-index:0;
  text-align:center;
}
.cooling__main{
  position:relative;
  z-index:2
}
.cooling__main__box{
  position:relative;
  z-index:2;
}
.cooling__main__pd{
  position:relative;
  width:90%;
  margin:0 auto;
  max-width:800px;
}
.cooling__main__pd img{
  width:100%
}
.cooling__main__pd-img{
  position:relative;
  z-index:1;
}
.cooling__main__pd-img--top{
  position:absolute;
  width:100%;
  top:0;
  left:0;
  z-index:3;
}
.cooling__main__pd-air{
  position:absolute;
  width:100%;
  top:0;
  left:0;
  z-index:0;
  opacity:1;
}
.cooling__main__pd-air-in-1{
  z-index:2;
}
.cooling__main__pd-air-in-2{
  z-index:2;
}
.cooling__main__pd-air-out-1{
  z-index:4;
}
.cooling__main__pd-air-out-2{
  z-index:2;
}
.cooling__main__btn{
  position:absolute;
  width:25px;
  height:25px;
  background:#e7cf6e;
  border-radius:25px;
  cursor:pointer;
  animation:2s btn infinite;
  transition:.5s all ease;
  transform:scale(1);
}
.cooling__main__btn-1{
  top:22%;
  right:34%;
  z-index:6;
}
.cooling__main__btn-2{
  top:49%;
  right:33%;
  z-index:6;
}
.cooling__main__btn:hover{
  transform:scale(1.2)
}
.cooling__main__text{
  padding:25px 0;
  text-align:center;
}
@media(min-width: 768px){
  .cooling__main__text{
      margin-top:-50px;
  }
}
@media(min-width: 996px){
  .cooling__main__text{
      max-width:1000px;
      margin:-80px auto 0px;
  }
}
.cooling__sub__item{
  display:none;
}
.cooling__sub__vd{
  width:100%;
  margin:0 auto;
  max-width:1000px;
}
.cooling__sub__text{
  padding:25px;
  text-align:center;
}
.cooling__sub__text h3{
  color:#e7cf6e;
  text-transform:uppercase;
  font-size:22px;
  padding-top:25px;
  padding-bottom:10px;
}
.cooling__sub__text .note{
  font-size:15px;
  opacity:.8;
  text-transform:uppercase;
}
@media(min-width: 996px){
  .cooling__sub__text{
      max-width:1000px;
      margin:0 auto;
  }
}
.easyUpdate {
  padding:  0;
}


.easyUpdate p {
  color: #fff;
  text-align: center;
}

.easyUpdate figure {
    max-width: 800px;
    margin: 50px auto;
    width: 100%;
}
@media(min-width: 996px){
  .easyUpdate  {
    padding: 5% 0;
  }
}
.exclusive  {
  padding: 0;
  background: #000;
}
.exclusive p {
  color: #fff;
  text-align: center;
}

.exclusive figure {
    max-width: 800px;
    margin: 50px auto;
    width: 100%;
}
@media(min-width: 996px){
  .exclusive  {
    padding: 5% 0;
  }
}
.Performance{
  text-align:center;
  position:relative;

}
.Performance .container {
  position: relative;
}
.Performance p{
  color: #fff;
}
.Performance a{
  color:#fff;
  text-decoration:underline;
}
.Performance a:hover{
  text-decoration:none;
}
.Performance__icon img{
  margin:0 auto;
}
.Performance .note{
  color:#ccc;
}
.Performance__up{
  position:relative;
  max-width:200px;
  margin:0 auto 25px;
}

.Performance__value{
  text-align:left;
  padding-bottom:25px;
}
.Performance__value__item{
  display:flex;
  margin-bottom:10px;
}
.Performance__value__item b{
  text-shadow:#00e3f1 0 0 15px;
  color: #fff;
}
.Performance .value{
  position:relative;
  background:linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(0, 227, 241) 100%);
  transform:skewX(-10deg);
  margin-right:10px;
  color: #fff;
}
.Performance .value1{
  flex:0 0 80%;
}
.Performance .value2{
  flex:0 0 72%;
}
@media(min-width: 996px){
  .Performance{
    padding: 100px 0;
  }
  .Performance__up{
    max-width:500px;
  }
  .Performance__up p{
    position:absolute;
    left:0;
    bottom:0;
  }
  .Performance__img{
      position:relative;
      z-index:0;
      left:0;
      top:0;
      width:100%;
      margin:0 auto;
      max-width:auto;
  }
  .Performance__text{
      position:absolute;
      z-index:1;
      /* top:50px; */
      left:0;
      width:100%;
  }
  .Performance__text .third-title {
    margin: 0 auto 25px;
  }
  .Performance__box{
      position:absolute;
      z-index:1;
      top:30%;
      left:2%;
      width:45%;
      text-align:left;
  }
  .Performance__icon{
      margin-right:5;
      margin:0 25% 0 0;
  }
  .Performance__note{
      position:absolute;
      z-index:1;
      left:0;
      bottom:0;
      width:100%;
  }
}
.tab2__box{
  padding:45px 25px;
}
@media(min-width: 996px){
  .tab2__box{
      display:flex;
      justify-content:space-between;
      align-items:center;
      text-align:left;
  }
  .tab2__img{
      flex:0 0 50%;
      margin-right:35px;
  }
}
:root{
  --mainTitle: 22px;
  --mainTxt: 17px;
  --mainPrice: 20px;
  --mainNote: 15px;
}
.form{
  width:100%;
  margin:0 auto;
  max-width:1000px;
}
.formbg{
  background:url("../images/bg-form.webp") center center no-repeat ;
  background-size:cover;
}
.form__summary{
  text-align:center;
  padding-bottom:25px;
}
.form .star{
  color:var(--color-red-400);
}
.form__title{
  margin-bottom:20px;
  font-size:var(--mainTitle);
}
.form__group{
  margin-bottom:15px;
  color:#fff;
}
.form__group-title{
  font-size:var(--mainTxt);
  margin-bottom:5px;
  font-weight:normal;
}
.form__group-title .star{
  color:#db4a37;
}
.form__group-note{
  font-size:var(--note-sm);
  color:var(--color-gray-600);
  margin-bottom:5px;
}
.form__group-errorNote{
  font-size:var(--note-sm);
  color:var(--color-error);
  margin-bottom:5px;
}
.form__group-control{
  width:100%;
}
.form__group-control,.form__group-required{
  min-height:35px;
}
.form__group-controlLarge{
  min-height:140px;
}
.form__group-box{
  margin-bottom:10px;
  background:none;
  border:1px solid rgba(0,0,0,0);
  border-width:1px;
  border-image:linear-gradient(to right, rgb(113, 78, 176) 0%, rgb(249, 145, 189) 100%);
  border-image-slice:1;
  padding:15px;
  height:auto;
  position:relative;
  backdrop-filter:blur(1px);
  color:#ccc;
}
.form__group-box:focus-visible{
  border:1px solid #91d8ec;
  outline:#91d8ec;
  outline-offset:0;
}
.form__group-linear{
  align-items:flex-end;
}
.form__group-linear li{
  display:flex;
  align-items:center;
  margin:0 10px 0 0;
}
.form__group-error{
  border:1.5px solid var(--color-error)
}
.form .radioSty input[type=radio]{
  display:none;
}
.form .radioSty input[type=radio]:checked+label::before{
  border:4px solid #f991bd;
  border-top-color:#714eb0;
  border-bottom-color:#714eb0;
}
.form .radioSty label{
  margin-right:25px;
  display:inline-flex;
  align-items:center;
}
.form .radioSty label::before{
  content:"";
  display:inline-block;
  width:14px;
  height:14px;
  border:var(--color-gray-300) 1px solid;
  border-radius:50%;
  margin-right:8px;
}
.form .radioSty .radioBtn__new{
  display:none;
}
.form .checkSty input[type=checkbox]{
  display:none;
}
.form .checkSty input[type=checkbox]:checked+label::before{
  background:url("../images/icon-check.png") center center no-repeat ;
  background-size:cover;
  background-color:linear-gradient(to left, rgb(249, 145, 189), rgb(113, 78, 176));
  border:1px solid #f991bd;
  border-top-color:#714eb0;
  border-bottom-color:#714eb0;
}
.form .checkSty label{
  display:flex;
}
.form .checkSty label::before{
  content:"";
  display:inline-block;
  width:14px;
  height:14px;
  border:1px solid var(--color-gray-300);
  background-color:none;
  border-radius:3px;
  margin-right:8px;
  margin-top:5px;
  flex:0 0 14px;
}
.form .checkSty label p{
  padding:0;
}
.form .checkSty p{
  font-size:15px;
  color:#ccc;
  padding-top:8px;
}
.form .checkSty a{
  color:#fff;
  text-decoration:underline;
}
.form .checkSty a:hover{
  text-decoration:none;
}
.form .checkSty .btn-submit{
  background-color:#db4a37;
  padding:10px 35px;
  color:#fff;
}
.form .checkSty .btn-submit:hover{
  background-color:#f14832;
}
.form .checkSty .other{
  order:3;
  display:inline
}
.form .checkSty .other__control{
  min-height:20px;
  min-width:300px;
  margin:0px 10px;
}
.form-send{
  text-align:center;
  padding-top:25px;
}
.form .btn-submit{
  text-transform:uppercase;
  padding:15px 25px;
  border:#ec41f1 1px solid;
  color:#ec41f1;
  outline:none;
  font-size:100%;
  width:60%;
  margin:0 auto;
  display:block;
}
.form .btn-submit:hover{
  background:#ec41f1;
  color:#fff;
}
@media(min-width: 996px){
  .form__group-linear{
      display:flex;
  }
  .form__group-linear li{
      flex-direction:column;
  }
  .form__group .form__group-linear li .radioBtn__txt{
      order:unset;
  }
  .form__group .form__group-linear li .radioBtn__new{
      order:unset;
      margin:10px 10px 0;
  }
  .form .radioSty{
      display:flex;
  }
  .form .radioSty li{
      margin-right:25px;
  }
  .form .checkSty li .checkBtn__new{
      margin:0px 10px 0 0;
  }
}
.lighttbox{
  background:rgba(0,0,0,.8);
  position:fixed;
  width:100%;
  min-height:100vh;
  z-index:50;
  top:0;
  left:0;
  overflow-y:auto;
  display:none
}
.lighttbox .ltwp{
  position:absolute;
  width:100%;
  left:0;
  top:0;
}
.lighttbox .ltbox{
  background:#111;
  width:90%;
  max-width:1000px;
  margin:3% auto;
  padding:40px;
  border:#222 3px solid;
  color:#fff;
  line-height:1.6;
  font-size:18px;
  display:none;
  text-align:center;
}
.lighttbox .ltbox h2{
  text-align:center;
}
.lighttbox .TCbody{
  text-align:left;
}
.lighttbox .btclose{
  text-align:center;
  color:#fff;
  background-color:#3a3a3a;
  margin:10px auto;
  padding:10px 35px;
  display:inline-block;
  cursor:pointer;
  transition:.2s;
}
.lighttbox .btclose:hover{
  background-color:#c92c2c;
}
.lighttbox .btclose button{
  color:#fff;
}
.is-visible{
  display:block;
}
.blog{
  background:url("../images/bg-blog.webp") center center no-repeat ;
  background-size:cover;
  background-attachment:fixed;
}
.blog__box{
  padding:0 25px;
}
.blog__item{
  text-align:center;
  margin-bottom:35px;
}
.blog__item a{
  color:#fff;
  display:block;
}
.blog__item span{
  display:block;
}
.blog__title{
  font-weight:bold;
  font-size:var(--title-md);
}
@media(min-width: 996px){
  .blog__box{
      display:flex;
      width:100%;
      margin:0 auto;
      max-width:1500px;
      padding:80px 0;
  }
  .blog__item{
      flex:1;
      margin-right:20px;
      background:linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.6) 45%, rgba(51, 51, 51, 0.6) 55%, rgba(255, 51, 51, 0) 100%);
      padding:10px 10px 50px;
      transition:1s all ease-in-out;
  }
  .blog__item:last-child{
      margin-right:0;
  }
  .blog__item:hover{
      background:linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(236, 65, 241, 0.6) 45%, rgba(236, 65, 241, 0.6) 55%, rgba(255, 51, 51, 0) 100%);
  }
  .blog__item span{
      padding:15px 15px 5px;
  }
}
.wtb .common__container{
  padding-top:0;
  padding-bottom:0;
  text-align:center;
}
.wtb .common__container img{
  vertical-align:bottom;
}
.wtb__text{
  padding:25px;
}
.wtb__text a{
  text-transform:uppercase;
  padding:15px 25px;
  border:#ec41f1 1px solid;
  color:#ec41f1;
  outline:none;
  font-size:100%;
  width:100%;
  display:block;
}
.wtb__text a:hover{
  background:#ec41f1;
  color:#fff;
}
@media(min-width: 996px){
  .wtb .common__container{
      display:flex;
      align-items:center;
  }
  .wtb__img{
      order:1;
  }
  .wtb__text{
      order:2;
      flex:0 0 40%;
      margin-left:10%;
  }
}

/* AI QOS */
.aiqos {
  background: url("https://storage-asset.msi.com/global/picture/image/feature/Router/RadiX-AX6600-WiFi-6-Tri-Band-Gaming-Router/ai-bg.jpg") no-repeat center top;
  background-color: black;
  padding: 4% 0 4%;
  text-align: center;
  background-size: contain;
}

@media (min-width: 1930px) {
  .aiqos {
    background-size: auto;
  }
}
.aiqos p, .aiqos .title--main {
  text-shadow: 0 0 15px black, 0 0 15px black, 0 0 35px black, 0 0 40px black, 0 0 50px black;
}
.aiqos__title {
  width: 30%;
  margin: 5% auto 0;
}
.aiqos__text {
  margin: 0 auto 5%;
}

.aiqos__nav {
  overflow: hidden;
}

@media (min-width: 996px) {
  .aiqos__title {
    width: 10%;
    margin: 0 auto;
  }
  .aiqos__text {
    width: 80%;
  }
}
.aiqos__nav {
  padding: 3% 0 1%;
  width: 60%;
  margin: 0 auto;
}

@media (min-width: 996px) {
  .aiqos .slick-track {
    -webkit-transform: translate3d(0, 0, 0) !important;
            transform: translate3d(0, 0, 0) !important;
  }
}
.aiqos .slick-current .aiqos__btn {
  -webkit-animation: none;
          animation: none;
  cursor: default;
}
.aiqos .slick-current .aiqos__btn:hover .aiqos__btn--bg {
  background-color: none;
}
.aiqos .slick-current .aiqos__btn--bg {
  background-color: rgba(255, 0, 0, 0.3);
  -webkit-animation: none;
          animation: none;
  -webkit-filter: brightness(2);
          filter: brightness(2);
}
.aiqos .slick-current .aiqos__btn--bg:hover {
  background-color: none;
}
.aiqos__btn {
  color: var(--color-red-400);
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  margin: 0 auto 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 60%;
  -webkit-filter: drop-shadow(0px 2px 5px black);
          filter: drop-shadow(0px 2px 5px black);
}
@media (min-width: 1300px) {
  .aiqos__btn {
    width: 48%;
    font-size: var(--title-sm);
  }
}
.aiqos__btn--bg {
  background: url("https://storage-asset.msi.com/global/picture/image/feature/Router/RadiX-AX6600-WiFi-6-Tri-Band-Gaming-Router/ai-btn.png") no-repeat;
  background-size: contain;
  background-position: center;
  margin-bottom: 10px;
}
.aiqos__btn--bg:hover img {
  background-color: rgba(255, 0, 0, 0.1);
  -webkit-transition: 0.1s all;
  transition: 0.1s all;
  -webkit-animation: none;
          animation: none;
}
.aiqos__btn--bg img {
  padding: 0.6em;
}
.aiqos__btn:hover {
  -webkit-filter: contrast(200%);
          filter: contrast(200%);
  cursor: pointer;
}
.aiqos__content {
  max-width: 1920px;
  margin: 0 auto;
}
.aiqos__imgbox {
  /* padding: 0 0 3%; */
}
.aiqos__imgbox figure {
  margin: 0 auto;
}
@media (min-width: 1300px) {
  .aiqos__imgbox figure {
    width: 70%;
  }}
  /* .aiqos__imgbox figure img {
    width: 80%;
    margin: 0 auto;
  } */

.aiqos__imgbox figcaption {
  padding-top: 15px;
}
/* .aiqos__imgbox-bg1 {
  background: url("https://storage-asset.msi.com/global/picture/image/feature/Router/RadiX-AX6600-WiFi-6-Tri-Band-Gaming-Router/ai-content-bg-1.png") no-repeat;
}
.aiqos__imgbox-bg2 {
  background: url("https://storage-asset.msi.com/global/picture/image/feature/Router/RadiX-AX6600-WiFi-6-Tri-Band-Gaming-Router/ai-content-bg-2.png") no-repeat;
}
.aiqos__imgbox-bg3 {
  background: url("https://storage-asset.msi.com/global/picture/image/feature/Router/RadiX-AX6600-WiFi-6-Tri-Band-Gaming-Router/ai-content-bg-3.png") no-repeat;
}
.aiqos__imgbox-bg4 {
  background: url("https://storage-asset.msi.com/global/picture/image/feature/Router/RadiX-AX6600-WiFi-6-Tri-Band-Gaming-Router/ai-content-bg-4.png") no-repeat;
} */
.aiqos__imgbox-bgwrap {
  background-size: 30%;
  background-position: 90% 80%;
}



/* popout */
/* .popout {
  background: rgba(54, 49, 41, 0.8392156863);
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  opacity: 0;
}
.popout__block {
  position: relative;
  max-width: 760px;
  background: #7e7e7e;
  background-size: 100% 100%;
  position: absolute;
  width: 90%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 10px;
  max-height: 70vh;
  overflow: auto;
}
.popout__block-close {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 40px;
  cursor: pointer;
}
.popout__dm {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: 30vh;
  padding: 70px 40px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.popout__dm a {
  width: 100%;
  background: #ffffff;
  color: #000000;
  text-align: center;
  border-radius: 5px;
  height: 70px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 5px;
}
.popout__dm a img {
  height: 50px;
} */