@charset "utf-8";

@import "../initial";
.bigcontent{
      background: #fff;
  @media (min-width: 1350px){
    margin-left: 480px;
  }
  @media (min-width: 1100px){
        margin-left: 430px;
  }
}
.layout-content {
  min-height: 37.5em;

  .container {
    @extend .response-container;
  }
}
.video-banner{
  max-width: 850px;
  margin: auto;
  @media(min-width:1200px){
        margin-top: -20em;
  }
  @media only screen and (max-width: 1200px) and (min-width: 1024px){
        margin-top: -17em;
  }
  @media only screen and (max-width: 1024px) and(min-width:789px){
        margin-top: -9em;
  }
  img{
    border-radius: 20px;
    behavior: url("/assets/ie_support/PIE2/PIE.htc");
  }
  .w-ba-banner{
    box-shadow: 0px 55px 50px -40px #212121;
    border-radius: 20px;
    behavior: url("/assets/ie_support/PIE2/PIE.htc");
  }
.ba-banner-widget-4 .w-ba-banner__wrap img img{
    margin: 0;
  }
}
.fa, .fas{
    font-family: "FontAwesome";
    font-weight: 900;
    font-style: normal;
}
.fab{
    font-family: "Font Awesome 5 Brands";
}
.one{
     width: 50%;
     text-align: end;
     padding: 1em;
     @media(max-width: $screen-xs){
       position: relative;
        width: 100%;
        text-align: center;
        padding: 1em;
        margin-bottom: 2em;
     }
}
.two{
     width: 50%;
     text-align: start;
     padding: 1em;
     @media(max-width: $screen-xs){
       position: relative;
        width: 100%;
        text-align: center;
        padding: 1em;
        margin-bottom: 2em;
     }
}
.topword{
  padding:1.5em 1.5em 1em 1.5em;
}
.subword{
  text-align: center;
  color: #333333;
  font-family: "Barlow", Sans-serif;
  font-size: 36px;
  font-weight: 900;
  text-transform: none;
  line-height: 40px;
}
.colorbox2{
  position: relative;
    padding: 1em;
    @media(max-width: $screen-xs){
      padding: 1em 0;
    }
}
.colorbox{
  background-color: #D1E1D6;
  padding: 1em;
  @media(max-width: $screen-xs){
    padding: 1em 0;
  }
}
.group{
  width: 100%;
  display: flex;
  @media(max-width: $screen-xs){
       flex-wrap: wrap;
  }
}
.box{
  flex: 1;
  color: #666666;
  font-family: "Barlow", Sans-serif;
  font-size: 36px;
  font-weight: 900;
  text-transform: none;
  cursor: pointer;
  overflow: hidden;
  transition: all .25s;
  @media(min-width: 1025px){
    &:hover{
      flex: 0 1 30%;
    }
  }
  @media(max-width: $screen-xs){
    flex: 100%;
    padding-bottom: 0.5em;
  }
}
.layout-content-box3{
 @media(min-width: $screen-xs){
        top: -9em;
 }
}
.score{
  .scorebutton{
    &:hover{
      color:#E4200B!important ;
    }
  }
}

.swiper-banner{
  .ba-banner-widget-1 {
    .ad-overlay{
          background-image: none!important;
    }
    ul.button-mid .next-button{
          color: #E4002B!important;
          background: none!important;
    }
    ul.button-mid .prev-button{
          color: #E4002B!important;
          background: none!important;
    }
  }
}
.kenjohn{
  @media (min-width: 1100px) and (min-width: 1350px){
    width: 480px;
  }
  @media (min-width: 1100px) and (min-width: 1100px){
    width: 430px;
  }
  @media(min-width:1025px){
    position: fixed !important;
    top: 250px;
  }
  .smallphoto{
    padding: 3em 6em;
  }
}
.fa-chevron-up{
  font-size: 10px!important;
}
.topbutton{
  margin-top: -6px;
}
.top{
    text-align: center;
    color: #333;
    font-size: 1em;
    left: 23.5em;
    cursor: pointer;
    &:hover{
      color:#777;
      text-decoration: underline;
    }
    @media(min-width:1025px){
      position: fixed !important;
      top: 4em;
    }
    @media(max-width:1024px){
      display: none!important;
    }
}
//內頁
.sitemenu{
  background-color: #000000;
}
.inner-page{
      padding: 50px 0;
}