@font-face {
    font-family: 'CenturyGothic';
    src: url('https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC.woff') format("woff"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC.TTF') format("truetype"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC.eot') format("embedded-opentype");
}
@font-face {
    font-family: 'CenturyGothic-B';
    src: url('https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHICB.woff') format("woff"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHICB.TTF') format("truetype"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHICB.eot') format("embedded-opentype");
}
@font-face {
    font-family: 'CenturyGothic-BI';
    src: url('https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC-BI.woff') format("woff"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC-BI.TTF') format("truetype"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC-BI.eot') format("embedded-opentype");
}
@font-face {
    font-family: 'CenturyGothic-I';
    src: url('https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC-I.woff') format("woff"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC-I.TTF') format("truetype"), url('.https://storage-asset.msi.com/global/picture/image/feature/nb/gs/GS76-TigerLake/fonts/GOTHIC-I.eot') format("embedded-opentype");
}


#msi_custom_page
{
     width:100%;
     margin:0 auto;
     min-width:300px;
     max-width:2560px;
     font-family: "CenturyGothic", sans-serif;
     font-weight:normal;
     font-size:15px;
     line-height: 1.25;
     overflow:hidden;
     position: relative;
     background:#fff;
     color:#0a0a0a;
}
     #msi_custom_page *
     {
          box-sizing: border-box;
     }
     @media (min-width:801px)
     {
          #msi_custom_page
          {
               font-size:18px;
          }
     }
     #msi_custom_page sup
     {
          font-size:.5em;
     }
.section-outer
{
     width:100%;
     margin:0 auto;
     background-repeat:no-repeat;
     background-position: top center;
     background-size: cover;
     position:relative;
}
.section-inner
{
     width:100%;
     max-width:1440px;
     margin:0 auto;
     position:relative;
}



/* text */




/* Helper */
.clearfix:after
{
     display: block;
     content: "";
     clear: both;
}
.sr-only
{
     position: absolute;
     margin: -1px 0 0 -1px;
     padding: 0;
     display: block;
     width: 1px;
     height: 1px;
     font-size: 1px;
     line-height: 1px;
     overflow: hidden;
     clip: rect(0,0,0,0);
     border: 0;
     outline: 0;
}
.rtl
{
     direction: rtl;
}

/* text */
.text-center
{
     text-align: center;
}
.text-line-through
{
      text-decoration: line-through;
}
.gradient-line
{
     width:100%;
     height:6px;
     background: linear-gradient(90deg, rgba(242,226,149,1) 0%, rgba(214,175,96,1) 100%);
}




/* section-intro */
#section-intro
{
     padding:0 0 3em;
     margin:0 auto;
     text-align: center;
}
     #section-intro h1
     {
          width:calc(100% - 40px);
          margin:0 auto .5em;

          font-family: 'CenturyGothic-B', sans-serif;
          font-weight:bold;
          font-size:3.5em;
          line-height: 1;
     }
     #section-intro h2
     {
          margin:0 auto .75em;
          font-weight:normal;
          font-size:1.5em;
     }
          @media(min-width: 801px)
          {
               #section-intro h2
               {
                    margin:0 auto 1em;
               }
          }
     #section-intro p
     {
          width:calc(100% - 40px);
          max-width:640px;
          margin:0 auto 2.5em;
          padding:0 20px;

          font-weight:normal;
     }
          @media(min-width: 801px)
          {
               #section-intro p
               {
                    max-width:800px;
               }
          }
     #section-intro .main-kv-wrap
     {
          margin:0 auto;
          padding:0 20px;
     }
          #section-intro .main-kv-wrap .main-kv
          {
               display:block;

               max-width:100%;
               margin:2em auto 3em;
          }
          @media(min-width:801px)
          {
               #section-intro .main-kv-wrap .main-kv
               {
                    margin:4em auto;
               }
          }
          @media(min-width:1281px)
          {
               #section-intro .main-kv-wrap .main-kv
               {
                    margin:4.5em auto;
               }
          }


/* page_tab_nav */
.page_tab_wrap ul
{
     padding: 0;
     margin: 0 20px;


}
.page_tab_wrap ul li
{
     display: block;

     padding:0;
     margin:6px auto;
     max-width: 640px;

     border:3px solid transparent;
     border-radius:12px;
     background:none;


     list-style: none;
     list-style-position: inside;
}
.page_tab
{
     display:block;

     width:100%;
     padding:.75em 20px;
     background:#fff;
     outline:none;
     border:1px solid #ccc;
     border-radius:10px;
     cursor:pointer;

     font-family: "CenturyGothic", arial, sans-serif;
     font-size:1.25em;
     color:#111;



}
     @media(min-width: 801px)
     {
          .page_tab_wrap ul li
          {
               display: inline-block;

               max-width:none;
               margin:4px;
          }
          .page_tab
          {
               width:200px;
               padding:1.25em 20px;
               box-shadow:0 8px 8px -8px rgba(0,0,0,0.2);

               font-size:1em;

          }
     }


     .page_tab_wrap ul li.page_tab_wrap-on,
     .page_tab_wrap ul li.page_tab_wrap-on:hover
     {
          background:#ccc;
          border:3px solid #ccc;

     }
     .page_tab_wrap ul li:hover
     {
          background:#ccc;
     }

     .page_tab img
     {
          display:none;
          margin:0 auto .625em;
          width:60px;

     }

     @media(min-width: 801px)
     {
          .page_tab img
          {
               display:block;
          }
     }



/* pages */

.page-kv-wrap
{
     position: relative;
}
     .page-kv-wrap h2
     {
          margin:0;
          padding:0 0 .5em;

          font-family: 'CenturyGothic-B', sans-serif;
          font-size:1.75em;
     }
     .page-kv-wrap p
     {
          margin:0;
          padding:0;

          font-size:1em;
     }

     .page-kv-info
     {
          padding:30px 20px;

          background:#efefef;
     }
     @media (min-width:801px)
     {
          .page-kv-info
          {
               position:absolute;
               top:50%;
               left:calc(50% + 40px);
               transform: translate(0%, -50%);

               width:40%;
               min-width:360px;
               max-width:540px;
               padding:30px;
               border-radius:10px;
               box-shadow:0 10px 8px -10px rgba(0,0,0,0.4);

               background:#fff;
          }
     }



/* swiper */

.section-swiper
{
     padding:.5em 0 1em;
}
     #swiper-wrap
     {
          position: relative;

          margin:3em auto;
          max-width:800px;


     }

     html:root
     {
          --swiper-navigation-size: 24px;
          --swiper-theme-color: #999999;
          --swiper-pagination-bullet-horizontal-gap: 6px;
     }
     .swiper
     {
          width:100%;
          max-width:720px;
     }
          .swiper h3
          {
               font-family: 'CenturyGothic-B', sans-serif;
               font-size:1.75em;
               text-align: center;

               padding:0;
               margin:0 auto .75em;
          }
          .swiper p
          {
               text-align: center;
               font-size:1em;

               padding: 0 40px 2em;
               margin:0 auto;
          }
          .swiper img
          {
               display:block;
               margin:0 auto;
               max-width:calc(100% - 80px);
          }



     .swiper-pagination
     {
          margin-bottom:-35px;
     }
     .feature_tab.swiper-pagination-bullet
     {
          font-size:0;
     }

     @media(min-width:801px)
     {
          .swiper-wrapper
          {
               padding-top:100px;
               bottom:0;
          }
          .swiper-pagination
          {
               top:0;

               padding:0 20px;
               text-align: center;

          }
          .feature_tab.swiper-pagination-bullet
          {
               display:inline-block;

               width:160px;
               margin:6px;
               padding:1em 20px 2em;

               background:#fff;
               outline:none;
               border:1px solid #ccc;
               border-radius:10px;
               cursor:pointer;
               opacity:1;
               box-shadow:0 8px 8px -8px rgba(0,0,0,0.2);

               font-family: 'CenturyGothic', sans-serif;
               font-weight:bold;
               font-size:1em;
               color:#111;
          }


          .feature_tab.swiper-pagination-bullet.swiper-pagination-bullet-active,
          .feature_tab.swiper-pagination-bullet.swiper-pagination-bullet-active:hover
          {
               position:relative;

               background:#fff;
               border:4px solid #ccc;
          }
          .feature_tab.swiper-pagination-bullet:hover
          {
               position:relative;



               border:2px solid #ccc;
          }
     }



     .swiper-button-next,
     .swiper-button-prev
     {
          z-index:100;
     }



/* section-specs */
.section-specs
{
     padding:3.5em 20px;
     background:#f0f0f0;

     text-align: center;
}
     .section-specs h2
     {
          display: block;

          margin:0 auto 2em;

          font-family: 'CenturyGothic-B', sans-serif;
          font-size:1.75em;


     }
     .section-specs ul, .section-specs li
     {
          list-style: disc;
     }
     .shop-wrap
     {
          display: flex;
          flex-wrap: wrap;
          justify-content:center;
     }
          .product-wrap
          {
               display: inline-block;
               width:360px;
               padding:0 20px 1em;
               margin:10px;

               background:#ffffff;
               border-radius:10px;
               box-shadow:0 10px 8px -10px rgba(0,0,0,0.4);

               text-align: left;

          }
               .product-img img
               {
                    display:block;
                    width:100%;
               }
               .product-wrap h4
               {
                    font-family: 'CenturyGothic-B', sans-serif;

                    padding:0;
                    margin:0 0 .75em;
               }
               .product-wrap ul.product-specs
               {
                    font-size:.85em;
                    list-style-type: disc;

                    padding:0 0 0 20px;

               }
               .product-wrap a
               {

                    display: block;

                    padding:.75em 20px;
                    margin:2em 0 0;
                    border-radius:5px;
                    background: #ed1c24;

                    font-family: 'CenturyGothic-B', sans-serif;
                    color:#fff;
                    text-align: center;
                    text-decoration: none;
                    font-size:.85em;


               }




/* section-intro */
#section-footer
{
     padding:5em 0 5em;
     margin:0 auto;
     text-align: center;
}
     #section-footer h2
     {
          margin:0 auto 1em;
          font-weight:normal;
          font-size:1.5em;
     }
