
.CustomPage {
  background-color: #fff !important;
}

@media (max-width: 768px) {
  .CustomPage {
    background-color: #1a1a1a !important;
  }
} 
.main-l {
  width: calc( 100% - 400px);
  float: left;
  background-color: #1a1a1c;
}

@media (max-width: 768px) {
  .main-l {
    width: 100%;
  }
}

.main-r {
  width: 400px;
  float: right;
}

@media (max-width: 768px) {
  .main-r {
    width: 100%;
  }
}

.con {
  max-width: 70%;
  margin: auto;
  font-size: 1.2em;
  line-height: 1.6em;
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .con {
    max-width: 90%;
    font-size: 1em;
  }
}



/* ------------ SETTINGS ------------ */
/* ------------ CARD ------------ */
/* ------------ CARD ------------ */
.card {
  width: 100%;
  height: calc(9/12 * 40vw);
  max-width: calc(16/9 * 70vh);
  max-height: 70vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  border-radius: 6px;
  margin-bottom: 30px;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  background: url("https://img.shoplineapp.com/media/image_clips/63030ead119ff465e000cb80/original.jpg?1661144748") center center/cover;
  overflow: hidden;
}

.card-play {
  width: 48px;
  height: 48px;
  position: relative;
  z-index: 1;
  margin: auto;
  opacity: 0.5;
  background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/1613479/play.svg") center center/cover;
  cursor: pointer;
  -webkit-transition: opacity .3s ease-out;
  transition: opacity .3s ease-out;
}

.card-play:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  border-radius: 50%;
  background: #000;
  -webkit-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.card-video {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 2;
  background: #000;
}

.card-video iframe {
  width: 100%;
  height: 100%;
}

.card:after {
  content: '';
  width: 250%;
  height: 250%;
  position: absolute;
  top: var(--y);
  left: var(--x);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  opacity: 0;
  background: radial-gradient(circle closest-side, rgba(255, 255, 255, 0.3), transparent);
  -webkit-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}

/* ------------ STATES ------------ */
.card:hover:after,
.card:hover .card-play {
  opacity: 1;
}

.video-is-open:after {
  display: none;
}

.video-is-open .card-play {
  opacity: 1;
}

.video-is-open .card-play:after {
  width: 2vh;
  height: 2vh;
  -webkit-transform: translate(-50%, -50%) scale(88.88889);
          transform: translate(-50%, -50%) scale(88.88889);
  -webkit-transition: -webkit-transform .5s ease-out;
  transition: -webkit-transform .5s ease-out;
  transition: transform .5s ease-out;
  transition: transform .5s ease-out, -webkit-transform .5s ease-out;
}

/* ------------ Header ------------ */
header.forvoca {
  max-width: 1400px;
  width: 100%;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
  position: -webkit-sticky;
  position: sticky;
  bottom: 0px;
  z-index: 30;
  top: 80px;
}

header.forvoca a {
  display: inline-block;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: center;
  color: #fff;
  background-color: #d58c60;
  margin: auto;
  padding: 10px;
  min-height: 30px;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media (max-width: 768px) {
  header.forvoca a {
    min-height: 70px;
  }
}

header.forvoca a img {
  width: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  left: 34%;
  top: 4px;
}

@media (max-width: 1400px) {
  header.forvoca a img {
    left: 30%;
  }
}

@media (max-width: 768px) {
  header.forvoca a img {
    position: relative;
    left: unset;
  }
}

header.forvoca .price {
  background-color: #fff;
  color: #333;
  max-width: 400px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media (max-width: 768px) {
  header.forvoca .price {
    background-color: #d58c60;
    width: 100%;
    color: #fff;
    max-width: none;
  }
}

@media (max-width: 768px) {
  header.forvoca {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    position: fixed;
    bottom: 0px;
    top: auto;
    z-index: 1000;
  }
}

.majoricon {
  background-color: #493529;
  padding: 10px;
  border-radius: 100px;
  margin-top: -26px;
  margin-bottom: 6px;
  width: 60px !important;
}

@media (max-width: 768px) {
  .faq-forweb {
    display: none !important;
  }
}

.faq-formob {
  display: none !important;
}

@media (max-width: 768px) {
  .faq-formob {
    display: inline-block !important;
  }
}

.section-title {
  color: #fff;
  text-align: center;
  letter-spacing: 2px;
}
/*

.box {
  height: 500px;
  background-size: cover;
  background-position: center center;
}

@media (max-width: 768px) {
  .box {
    height: 400px;
  }
}

.box .con {
  height: 100%;
}

.box-ad2 {
  background-image: url(https://img.shoplineapp.com/media/image_clips/63458a3e2b1fef0010c082c2/original.jpg?1665501757);
  position: relative;
}

.box-ad2 h3 {
  color: #fff;
  top: 0.6em;
  position: absolute;
  line-height: 1.5em;
  font-size: 1.1em !important;
}

.box-ad2 p {
  position: absolute;
  bottom: 1em;
  width: 72%;
  font-size: 1em;
}

@media (max-width: 768px) {
  .box-ad2 p {
    width: 90vw;
    bottom: 0px;
    max-width: 90%;
  }
}

.box-lite {
  background-color: rgba(0, 0, 0, 0.5);
  padding: 1vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  left: 10%;
  border-radius: 5px;
}

@media (max-width: 768px) {
  .box-lite {
    padding: 5vw;
    background-color: rgba(0, 0, 0, 0.7);
  }
}

.box-rwd {
  position: relative;
}

.box-rwd .foreartip {
  bottom: 0px;
  position: relative;
}

@media (max-width: 768px) {
  .box-rwd .foreartip {
    position: relative;
    padding-top: 10vh;
  }
}

.box-rwd .foreartip p {
  width: 100%;
}

@media (max-width: 768px) {
  .box-rwd .foreartip p {
    width: 100%;
  }
}

.box-rwd .foreartip img {
  width: 100%;
  margin-bottom: 3vh;
}

@media (max-width: 768px) {
  .box-rwd .foreartip img {
    width: 100%;
  }
}

.box-rwd .foreartip p > span {
  color: #d58c60 !important;
}

.lite {
  position: relative;
}

@media (max-width: 768px) {
  .lite {
    padding-bottom: 10vh;
  }
}

.lite .box-lite {
  position: absolute;
  bottom: 0px;
  max-width: 1400px;
  width: 80%;
  text-align: center;
}

@media (max-width: 768px) {
  .lite .box-lite {
    width: 90%;
    left: 5vw;
  }
}

.lite .box-lite h4 {
  margin: 0px;
  color: #fff !important;
  font-size: 1.4em !important;
}

@media (max-width: 768px) {
  .lite .box-lite h4 {
    font-size: 1.1em !important;
  }
}

.lite .box-lite h3 {
  color: #d58c60;
  font-size: 2.4em !important;
  margin: 0px;
  font-weight: normal;
  line-height: 1.5em !important;
}

@media (max-width: 768px) {
  .lite .box-lite h3 {
    font-size: 1.3em !important;
  }
}

.lite .box-lite p {
  color: #fff;
  line-height: 1.6em;
  font-size: 1.2em !important;
}

@media (max-width: 768px) {
  .lite .box-lite p {
    font-size: 1em !important;
  }
}
*/

.sl_iframe_summary {
  height: 180px !important;
}

.bg-w {
  background-color: #fff;
  display: inline-block;
  width: 100%;
}

.bg-w p {
  color: #333;
}

.bg-b {
  background-color: #000 !important;
}

.bg-g {
  background-color: #1a1a1c !important;
}

.m-t1 {
  margin-top: 5vh;
}

.m-t0 {
  margin-top: 3vh;
}

.m-b1 {
  margin-bottom: 5vh !important;
}

.m-b0 {
  margin-bottom: 3vh;
}

.sec-box {
  position: relative;
/*  width: 80%;*/
  margin: auto;
}

.sec-box .con {
  max-width: 90%;
}

@media (max-width: 768px) {
  .sec-box .con {
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .sec-box {
    width: 100%;
  }
}

.sec-box .title-b {
  top: 5em;
  position: absolute;
  width: 90vw;
  left: 3em;
  width: 70%;
  letter-spacing: 3px;
}

@media (max-width: 768px) {
  .sec-box .title-b {
    width: 90%;
    top: 2em;
    left: 5vw;
    letter-spacing: 1px;
  }
}

.sec-box .title-b.b1 {
  bottom: 1em;
  top: auto;
}

.sec-box .title-b h4 {
  font-size: 1.4em !important;
  margin-bottom: 0.4em;
  color: #fff;
}

@media (max-width: 768px) {
  .sec-box .title-b h4 {
    font-size: 1.1em !important;
  }
}

.sec-box .title-b h3 {
  font-size: 2em;
  background-color: rgba(0, 0, 0, 0.7);
  display: inline-block;
  padding: 10px;
  border-left: 7px #d58c60 solid;
  margin: 0px;
  line-height: 1.3em;
  font-weight: normal;
  text-align: left !important;
  color: #Fff
}

@media (max-width: 768px) {
  .sec-box .title-b h3 {
    font-size: 1.3em;
    text-align: left;
  }
}

.sec-box .title-b h3.gray {
  background-color: rgba(53, 53, 53, 0.76);
}

.sec-box .list-connect {
  top: 20em;
  position: absolute;
  width: 80%;
  left: 3em;
}

@media (max-width: 768px) {
  .sec-box .list-connect {
    width: 90vw;
    top: 16em;
    left: 0vw;
  }
}

.sec-box .list-connect li {
  margin-bottom: 1em;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  width: 100%;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
}

@media (max-width: 768px) {
  .sec-box .list-connect li {
    width: 80%;
  }
}

.sec-box .list-connect li img {
  width: 50px;
  float: left;
  margin-right: 10px;
}

.sec-box .list-connect h5 {
  color: #1a1a1a;
  font-size: 1.3em !important;
  margin: 0px;
}

@media (max-width: 768px) {
  .sec-box .list-connect h5 {
    font-size: 1.3em !important;
  }
}

.sec-box .list-connect p {
  margin: 0px !important;
  font-size: 1.1em;
}

@media (max-width: 768px) {
  .sec-box .list-connect p {
    font-size: 1.1em;
  }
}

.sec-box.thunder {
  min-height: 40em;
}

@media (max-width: 768px) {
  .sec-box.thunder {
    min-height: 30em;
  }
}

.qi {
  min-height: 400px;
}

.qi img {
  margin-top: 6em;
}

.connect img {
  margin-top: 4em;
  padding-left: 5vw;
}

.electric {
  height: 600px;
  position: relative;
}

@media (max-width: 768px) {
  .electric {
    height: 400px;
  }
}

.electric img {
  width: 40%;
  position: absolute;
  right: 5vw;
  top: 10vh;
}

@media (max-width: 768px) {
  .electric img {
    width: 50vw;
  }
}

.electric h6 {
  font-size: 1.6em;
  font-weight: lighter;
  margin: 6px;
}

@media (max-width: 768px) {
  .electric h6 {
    font-size: 14pt;
    font-weight: normal;
  }
}

.electric h6.m-t1 {
  margin-top: 5vh !important;
}

.electric h6.all {
  color: #d58c60;
  margin-top: 10vh;
}

.electric h6.all2 {
  color: #d58c60;
  font-size: 3em;
}

.eartip {
  position: relative;
  display: inline-block;
  margin-top: 29%;
  width: 49%;
}

@media (max-width: 768px) {
  .eartip {
    margin-top: 3vh;
    width: 100%;
  }
}

.eartip img {
  width: 100%;
  margin-left: 2%;
}

@media (max-width: 768px) {
  .eartip img {
    width: 96vw;
    margin-left: 2vw;
  }
}

.eartip .title {
  position: absolute;
  top: 20px;
  left: 1vw;
}

@media (max-width: 768px) {
  .eartip .title {
    left: 5vw;
  }
}

.eartip .title h4 {
  font-size: 1.3em !important;
  margin: 0px;
  color: #fff !important;
}

.eartip .title h6 {
  font-size: 1em;
  font-style: italic;
  margin: 10px 0px;
  font-weight: lighter;
}

.eartip p {
  position: absolute;
  bottom: 0px;
  padding: 1vw;
  opacity: 0.8;
}

@media (max-width: 768px) {
  .eartip p {
    padding: 1vw 5vw;
  }
}

.btn-buy {
  background-color: #d58c60 !important;
  width: 100%;
  text-align: center;
  padding: 10px;
  color: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 1.1em !important;
}

@media (max-width: 768px) {
  .btn-buy {
    margin-top: none;
  }
}

.btn-buy:hover {
  background-color: #b06c43;
}

.btn-buy.sp1 {
  color: #fff;
  padding: 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.btn-buy.sp1 .icon {
  top: 20px !important;
  right: 20px !important;
}

.btn-buy.sp1[aria-expanded='true'] {
  color: #f3f0e6;
}

.btn-buy.sp1[aria-expanded='true'] {
  color: #fff;
}

.btn-buy.sp1[aria-expanded='false'] {
  color: #fff;
}

.btn-buy.sp1:hover, .btn-buy.sp1 .accordion button:focus {
  color: #fff;
}

.bmZSoU {
  display: none !important;
}

.dmopMx {
  display: none !important;
}

.box-eq {
  width: 80%;
  margin: auto;
  height: 40vh;
  min-height: 540px;
  background-position: center;
  background-size: cover;
  position: relative;
  background-image: url(https://img.shoplineapp.com/media/image_clips/62fcd471720a120013f514f0/original.jpg?1660736625);
}

@media (max-width: 768px) {
  .box-eq {
    min-height: 300px;
    width: 90vw;
    background-position: bottom;
  }
}

.box-eq div {
  position: absolute;
  width: 60%;
  right: 2vw;
  top: 10vh;
  text-align: right;
  color: #fff !important;
}

@media (max-width: 768px) {
  .box-eq div {
    text-align: left;
    width: 44%;
    right: 3vw;
    top: 0px;
  }
}

.boxoutside-9mm {
  position: relative;
}

.box-9mm {
  background-color: #d58c60;
  width: 40%;
  padding: 20px;
  position: absolute;
  bottom: -3vh;
  font-size: 1em !important;
}

@media (max-width: 768px) {
  .box-9mm {
    width: 70vw;
    bottom: -15vh;
    padding-left: 5vw;
    width: 84%;
  }
}

.bg-gray {
  background-color: #1a1a1c;
}

.counter {
  text-align: center;
  letter-spacing: 1px;
  margin-top: 5vw;
  margin-bottom: 3vh;
  color: #333 !important;
  font-size: 10pt !important;
  font-weight: lighter;
}

@media (max-width: 768px) {
  .counter {
    margin-top: 2vh;
    color: #fff !important;
  }
}

.title-c {
  text-align: center;
  padding-top: 4vh;
}

@media (max-width: 768px) {
  .title-c {
    width: 90%;
    margin: auto;
  }
}

.title-c h3 {
  font-size: 2.4em !important;
  color: #d58c60;
  line-height: 1.4em;
  margin: 0px;
}

@media (max-width: 768px) {
  .title-c h3 {
    font-size: 1.3em !important;
  }
}

.title-c h4 {
  font-size: 1.4em !important;
  margin: 2px;
  color: #fff;
}

@media (max-width: 768px) {
  .title-c h4 {
    font-size: 1.1em !important;
  }
}

.title-c.forle {
  padding-top: 0vh;
}

.major-cover {
  width: 60%;
  float: left;
}

@media (max-width: 768px) {
  .major-cover {
    width: 100%;
  }
}

.box-major {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 1400px;
  width: 100%;
  margin: auto;
  padding-top: 20px;
  background-color: #fff;
}

.box-major img {
  height: auto;
}

@media (max-width: 768px) {
  .box-major {
    max-width: none;
    background-color: #000;
    padding-top: 0px;
  }
}

.box-major .sl_iframe_summary {
  width: 100%;
}

.box-major .box-sl {
  width: 40%;
  margin-top: 0vh;
}

@media (max-width: 768px) {
  .box-major .box-sl {
    width: 100%;
    margin-top: 5vh;
  }
}

.box-major .counter {
  margin-top: 12vh;
}

@media (max-width: 768px) {
  .box-major .counter {
    margin-top: 6vh;
  }
}

.box-major .video-container {
  text-align: center;
}

.blutooth {
  margin-bottom: 18vh;
}

.not {
  margin-top: 7em;
  padding-left: 5vw;
}

.font-m {
  color: #d58c60;
}

.align-center {
  text-align: center;
}

.accordion .accordion-item {
  border-bottom: 1px solid #e5e5e5;
}

.accordion .accordion-item button[aria-expanded='true'] {
  border-bottom: 1px solid #d58c60;
}

.accordion button {
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  padding: 1em 0;
  color: #474747;
  font-size: 1em;
  font-weight: 400;
  border: none;
  background: none;
  outline: none;
}

.accordion button:hover, .accordion button:focus {
  cursor: pointer;
  color: #d58c60;
}

.accordion button:hover::after, .accordion button:focus::after {
  cursor: pointer;
  color: #d58c60;
  border: 1px solid #d58c60;
}

.accordion button .accordion-title {
  padding: 0.5em 2.5em 0.5em 0;
  font-size: 1.1em;
  display: inline-block;
}

@media (max-width: 768px) {
  .accordion button .accordion-title {
    font-size: 1.1em;
  }
}

.accordion button .icon {
  display: inline-block;
  position: absolute;
  top: 18px;
  right: 0;
  width: 22px;
  height: 22px;
  border: 1px solid;
  border-radius: 22px;
}

.accordion button .icon::before {
  display: block;
  position: absolute;
  content: '';
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background: currentColor;
}

.accordion button .icon::after {
  display: block;
  position: absolute;
  content: '';
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background: currentColor;
}

.accordion button[aria-expanded='true'] {
  color: #d58c60;
}

.accordion button[aria-expanded='true'] .icon::after {
  width: 0;
}

.accordion button[aria-expanded='true'] + .accordion-content {
  opacity: 1;
  max-height: 200%;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}

.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  -webkit-transition: opacity 200ms linear, max-height 200ms linear;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}

.accordion .accordion-content p {
  margin: 2em 0;
}

.accordion .accordion-content h3 {
  font-size: 1.3em !important;
}

.accordion .accordion-content h4 {
  font-size: 1.1em !important;
}

.con-1 {
  position: relative;
  margin-bottom: 30px;
  min-height: 300px;
}

.con-1 h3 {
  position: absolute;
  left: 0px;
  top: 1vh;
  font-size: 1.3em;
}

.con-1 h3 span {
  color: #d58c60;
}

.con-1 h4 {
  bottom: -30px;
  position: absolute;
  width: 100%;
  font-size: 1.1em;
}

.con-1 h4 span {
  background-color: #d58c60;
  color: #fff;
  padding: 5px;
}

.mutidevice {
  background-color: #333;
  padding: 10px 10px 20px 10px;
}

.font-w {
  color: #fff !important;
}

.font-b {
  color: #333 !important;
}

.countdown {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 84%;
  padding: 10px 0px;
  margin: 0 auto;
  border: 1px solid #adafb2;
  border-width: 1px 0;
}

.countdown span, .countdown h1 {
  color: #d58c60;
}

.countdown .day, .countdown .hour, .countdown .min, .countdown .sec {
  padding: 1vw 3vw;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: center;
}

.countdown .day .num, .countdown .hour .num, .countdown .min .num, .countdown .sec .num {
  display: block;
  font-size: 8vw;
  line-height: 1em;
}

.countdown .day .word, .countdown .hour .word, .countdown .min .word, .countdown .sec .word {
  display: block;
  font-size: 2vw;
  color: #8a99ab;
}

.wall {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 10px auto 5px;
  -webkit-column-break-inside: avoid;
          break-inside: avoid;
  border-radius: 10px;
  float: left;
  background-size: 105%;
  padding: 10px;
  color: #fff;
  position: relative;
  box-sizing: border-box;
  background-position: center;
}

.wall-big {
  -webkit-column-count: 2;
          column-count: 2;
  max-width: 70%;
  margin: auto;
  /*欄數*/
}

@media (max-width: 768px) {
  .wall-big {
    max-width: none;
    width: 90%;
    -webkit-column-count: 1;
            column-count: 1;
  }
}

.wall-all {
  width: 100%;
  -webkit-column-count: 2;
          column-count: 2;
  max-width: 100%;
  /*欄數*/
  margin-top: 0px;
  -webkit-column-gap: 10px;
          column-gap: 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media (max-width: 768px) {
  .wall-all {
    margin-top: 8px;
    width: 100%;
    -webkit-column-count: 2;
            column-count: 2;
    float: left;
  }
}

.wall-all a {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0 auto 0px;
  -webkit-column-break-inside: avoid;
          break-inside: avoid;
}

.wall-single {
  width: 100%;
  max-width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media (max-width: 768px) {
  .wall-single {
    width: 100%;
    max-width: 100%;
    float: none;
    display: inline-block;
  }
}

.wall p {
  position: absolute;
  top: 1em;
  left: 1em;
  margin: 0px !important;
}

.wall.btuse p {
  bottom: 1em;
  top: auto;
}

.wall-1 {
  height: calc(1/1 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/62fe70a52e84c100199ec870/original.jpg?1660842149);
}

@media (max-width: 1400px) {
  .wall-1 {
    height: calc(1/1 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-1 {
    height: calc(1/1 * 40vw);
  }
}

.wall-2 {
  height: calc(5/4 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/63457a5b12a639241953fbb5/original.jpg?1665497691);
}

@media (max-width: 1400px) {
  .wall-2 {
    height: calc(5/4 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-2 {
    height: calc(4/3 * 40vw);
  }
}

.wall-3 {
  height: calc(5/4 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/62fe6521fafc43001084bed9/original.jpg?1660839201);
}

@media (max-width: 1400px) {
  .wall-3 {
    height: calc(5/4 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-3 {
    height: calc(4/3 * 40vw);
    background-size: 110%;
  }
}

.wall-4 {
  height: calc(1/1 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/62fe65210fa31c0010ccfcfc/original.jpg?1660839201);
}

.wall-4 p span {
  color: #fff;
  font-size: 10pt !important;
}

@media (max-width: 1400px) {
  .wall-4 {
    height: calc(1/1 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-4 {
    height: calc(1/1 * 40vw);
  }
}

.wall-5 {
  background-size: 120%;
  height: calc(1/1 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/63458584dbb9d10028c9fad2/original.jpg?1665500548);
}

@media (max-width: 1400px) {
  .wall-5 {
    height: calc(1/1 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-5 {
    height: calc(1/1 * 40vw);
  }
}

.wall-6 {
  height: calc(1/1 * 190px);
  background-size: 110%;
  background-image: url(https://img.shoplineapp.com/media/image_clips/63458677577c100031b409d4/original.jpg?1665500791);
}

@media (max-width: 1400px) {
  .wall-6 {
    height: calc(1/1 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-6 {
    height: calc(1/1 * 40vw);
  }
}

.wall-7 {
  height: calc(5/4 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/634588722a55c50031c32797/original.jpg?1665501298);
}

@media (max-width: 1400px) {
  .wall-7 {
    height: calc(5/4 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-7 {
    height: calc(4/3 * 40vw);
  }
}

.wall-8 {
  height: calc(5/4 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/634585474c729600220bb0f4/original.jpg?1665500487);
}

@media (max-width: 1400px) {
  .wall-8 {
    height: calc(5/4 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-8 {
    height: calc(4/3 * 40vw);
  }
}

.wall-9 {
  height: calc(1/1 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/62fe65216b01f9002ee41f8b/original.jpg?1660839201);
}

@media (max-width: 1400px) {
  .wall-9 {
    height: calc(1/1 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-9 {
    height: calc(1/1 * 40vw);
  }
}

.wall-10 {
  background-size: 100%;
  background-position: bottom;
  height: calc(2/2 * 190px);
  background-image: url(https://img.shoplineapp.com/media/image_clips/6347e8f231fe0800190af381/original.jpg?1665657074);
}

.wall-10 p {
  bottom: 1em !important;
  right: 1em !important;
  left: auto;
  top: auto;
}

@media (max-width: 1400px) {
  .wall-10 {
    height: calc(2/2 * 140px);
  }
}

@media (max-width: 768px) {
  .wall-10 {
    height: calc(6/2 * 15vw);
  }
}

.main-formob {
  display: none;
}

@media (max-width: 768px) {
  .main-formob {
    display: inline-block;
  }
}

@media (max-width: 768px) {
  .main-forweb {
    display: none !important;
  }
}

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

.holder .get-it-on-github {
  margin-top: 24px;
  margin-bottom: 24px;
  font-family: 'Roboto';
  color: #55606E;
}

.audio.green-audio-player {
  width: 100%;
  min-width: 300px;
  height: 56px;
  -webkit-box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.07);
          box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.07);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-left: 24px;
  padding-right: 24px;
  border-radius: 4px;
  -moz-user-select: none;
   -ms-user-select: none;
       user-select: none;
  -webkit-user-select: none;
  background-color: #fff;
}

.audio.green-audio-player .play-pause-btn {
  display: none;
  cursor: pointer;
}

.audio.green-audio-player .spinner {
  width: 18px;
  height: 18px;
  background-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/355309/loading.png);
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-animation: spin 0.4s linear infinite;
          animation: spin 0.4s linear infinite;
}

.audio.green-audio-player .slider {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background-color: #D8D8D8;
  cursor: pointer;
  position: relative;
}

.audio.green-audio-player .slider .progress {
  background-color: #44BFA3;
  border-radius: inherit;
  position: absolute;
  pointer-events: none;
}

.audio.green-audio-player .slider .progress .pin {
  height: 16px;
  width: 16px;
  border-radius: 8px;
  background-color: #44BFA3;
  position: absolute;
  pointer-events: all;
  -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);
          box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);
}

.audio.green-audio-player .controls {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 18px;
  color: #55606E;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 24px;
  margin-right: 24px;
}

.audio.green-audio-player .controls .slider {
  margin-left: 16px;
  margin-right: 16px;
  border-radius: 2px;
  height: 4px;
}

.audio.green-audio-player .controls .slider .progress {
  width: 0;
  height: 100%;
}

.audio.green-audio-player .controls .slider .progress .pin {
  right: -8px;
  top: -6px;
}

.audio.green-audio-player .controls span {
  cursor: default;
}

.audio.green-audio-player .volume {
  position: relative;
}

.audio.green-audio-player .volume .volume-btn {
  cursor: pointer;
}

.audio.green-audio-player .volume .volume-btn.open path {
  fill: #44BFA3;
}

.audio.green-audio-player .volume .volume-controls {
  width: 30px;
  height: 135px;
  background-color: rgba(0, 0, 0, 0.62);
  border-radius: 7px;
  position: absolute;
  left: -3px;
  bottom: 52px;
  -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;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.audio.green-audio-player .volume .volume-controls.hidden {
  display: none;
}

.audio.green-audio-player .volume .volume-controls .slider {
  margin-top: 12px;
  margin-bottom: 12px;
  width: 6px;
  border-radius: 3px;
}

.audio.green-audio-player .volume .volume-controls .slider .progress {
  bottom: 0;
  height: 100%;
  width: 6px;
}

.audio.green-audio-player .volume .volume-controls .slider .progress .pin {
  left: -5px;
  top: -8px;
}

@-webkit-keyframes spin {
  from {
    -webkit-transform: rotateZ(0);
            transform: rotateZ(0);
  }
  to {
    -webkit-transform: rotateZ(1turn);
            transform: rotateZ(1turn);
  }
}

@keyframes spin {
  from {
    -webkit-transform: rotateZ(0);
            transform: rotateZ(0);
  }
  to {
    -webkit-transform: rotateZ(1turn);
            transform: rotateZ(1turn);
  }
}

.blog-slider {
  width: 100%;
  position: relative;
  max-width: 800px;
  margin: auto;
}

@media (max-width: 768px) {
  .blog-slider {
    height: 400px;
  }
}

.blog-slider__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media screen and (max-width: 768px) {
  .blog-slider__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.blog-slider__item.swiper-slide-active .blog-slider__img img {
  opacity: 1;
  -webkit-transition-delay: .3s;
          transition-delay: .3s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > * {
  opacity: 1;
  -webkit-transform: none;
          transform: none;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(1) {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(2) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(3) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(4) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(5) {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(6) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(7) {
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(8) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(9) {
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(10) {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(11) {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(12) {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(13) {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(14) {
  -webkit-transition-delay: 1.6s;
          transition-delay: 1.6s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(15) {
  -webkit-transition-delay: 1.7s;
          transition-delay: 1.7s;
}

.blog-slider__img {
  width: 100%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  height: 500px;
}

.blog-slider__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  opacity: 0;
}

@media (max-width: 768px) {
  .blog-slider__img {
    height: 100%;
  }
}

.blog-slider__content {
  padding-right: 25px;
  position: absolute;
  bottom: 0px;
  color: #fff;
}

@media screen and (max-width: 576px) {
  .blog-slider__content {
    padding: 0;
  }
}

.blog-slider__content > * {
  opacity: 0;
  -webkit-transform: translateY(25px);
          transform: translateY(25px);
  -webkit-transition: all .4s;
  transition: all .4s;
}

.blog-slider__code {
  color: #7b7992;
  margin-bottom: 15px;
  display: block;
  font-weight: 500;
}

.blog-slider__title {
  font-size: 24px;
  font-weight: normal;
  color: #fff;
  margin-bottom: 20px;
}

.blog-slider__text {
  color: #4e4a67;
  margin-bottom: 30px;
  line-height: 1.5em;
}

.blog-slider .swiper-container-horizontal > .swiper-pagination-bullets, .blog-slider .swiper-pagination-custom, .blog-slider .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}

.blog-slider__pagination {
  position: absolute;
  z-index: 21;
  left: 0px;
  width: 11px !important;
  text-align: center;
  left: auto !important;
  top: 50%;
  bottom: auto !important;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 8px 0;
}

@media screen and (max-width: 768px) {
  .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
  }
}

.blog-slider__pagination .swiper-pagination-bullet {
  border-radius: 0px !important;
  width: 120px;
  height: 140px;
  display: block;
  opacity: 0.7;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.blog-slider__pagination .swiper-pagination-bullet:first-child {
  background-image: url(https://img.shoplineapp.com/media/image_clips/630185fa438db6001c4892e1/original.png?1661044218);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.blog-slider__pagination .swiper-pagination-bullet:nth-child(2) {
  background-image: url(https://img.shoplineapp.com/media/image_clips/630185fa438db60016488f28/original.png?1661044218);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.blog-slider__pagination .swiper-pagination-bullet:nth-child(3) {
  background-image: url(https://img.shoplineapp.com/media/image_clips/630185faee13f600197cc37b/original.png?1661044218);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

@media (max-width: 768px) {
  .blog-slider__pagination .swiper-pagination-bullet {
    width: 80px;
    height: 80px;
  }
}

.blog-slider__pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #d58c60;
  height: 200px;
  -webkit-box-shadow: 0px 0px 20px rgba(252, 56, 56, 0.3);
          box-shadow: 0px 0px 20px rgba(252, 56, 56, 0.3);
}

@media (max-width: 768px) {
  .blog-slider__pagination .swiper-pagination-bullet-active {
    width: 80px;
    height: 80px;
  }
}

#myBtn {
  background-color: #d58c60 !important;
}

.img-gradient {
  position: relative;
}

.img-font {
  z-index: 2;
}

.cover {
  height: 101%;
  width: 100%;
  position: absolute;
  background: black;
  background: -webkit-gradient(linear, left bottom, left top, from(black), color-stop(10%, rgba(0, 0, 0, 0.64554)), to(rgba(0, 0, 0, 0)));
  background: linear-gradient(0deg, black 0%, rgba(0, 0, 0, 0.64554) 10%, rgba(0, 0, 0, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
}

#footer {
  background-color: #fff !important;
}

#footer p > span {
  color: #333;
}

.sp-mainbox {
  max-width: 1400px;
  margin: auto;
  display: block;
  width: 100%;
}

/*
.conweb {
  max-width: 800px;
  margin: auto;
}

@media (max-width: 768px) {
  .conweb {
    max-width: 90% !important;
  }
}
*/

.swiper-wrapper {
  height: 500px;
}

@media (max-width: 768px) {
  .swiper-wrapper {
    height: 100%;
  }
}

.wear {
  margin-top: 13vh;
}

@media (max-width: 768px) {
  .wear {
    margin-top: 20vh;
  }
}

.major-titleuse {
  display: inline-block;
  color: #333 !important;
  margin-left: 30px;
  right: 0px;
}

@media (max-width: 768px) {
  .major-titleuse {
    display: none;
  }
}

.major-titleuse h2 {
  color: #333;
  letter-spacing: 1px;
  font-size: 2.8em !important;
  font-weight: bold !important;
}

.major-titleuse h4 {
  font-weight: normal;
  color: #2f2f2f !important;
  letter-spacing: 1px;
  line-height: 1.4em;
  font-size: 1.1em !important;
}

.vstitle {
  color: #333 !important;
  font-size: 1.3em !important;
  text-align: center;
}

.faquse {
  margin-bottom: 10vh;
  margin-top: 10vh;
  width: calc( 100% - 400px);
  display: inline-block;
}

@media (max-width: 768px) {
  .faquse {
    width: 90%;
    display: block;
    margin: auto;
  }
}

#Footer .row:first-child {
  background-color: #fff !important;
}

#Footer .row:first-child p {
  color: #333;
}

#Footer .row:first-child p span {
  color: #333;
}

#Footer .row:first-child h4 {
  color: #333;
}

.voicetitle {
  color: #fff !important;
}

@media (max-width: 768px) {
  .voicetitle {
    color: #333 !important;
  }
}

@media (max-width: 768px) {
  .tiptitle {
    position: relative !important;
  }
}

.ProductDetail-title {
  background-color: none !important;
}

.ProductDetail-description {
  background-color: #1a1a1c;
}

.ProductDetail-additionalInfo h3 {
  line-height: 1.5em;
  padding: 10px 0px;
  text-align: center;
}

@media (max-width: 768px) {
  .ProductDetail-additionalInfo h3 {
    padding: 10px 0px;
  }
}

.tg tr > td {
  padding: 5px;
}

.tg tr:nth-child(odd) {
  background-color: #efefef;
}

.tg tr > td:nth-child(3) {
  padding: 5px 10px;
}

.tg tr > td:nth-child(3) img {
  max-width: 80px;
}

.img-spec {
  width: 100%;
}

.tg-detail {
  margin: auto;
}

.tg-detail tr > td {
  padding: 5px;
  border-bottom: 1px solid #dadada;
}

.tg-detail tr > td:nth-child(1) {
  background-color: #e3dbd6;
}

.tg-detail tr > td:nth-child(3) {
  padding: 5px 10px;
}

.tg-detail tr > td:nth-child(3) img {
  max-width: 80px;
}

.margin-bottom {
  margin-bottom: 5vh;
}

table {
  font-weight: normal !important;
  width: 100%;
  letter-spacing: 1px;
  line-height: 1.5em;
}

.con {
  max-width: 800px;
  display: block;
  margin: auto;
}

.note {
  font-size: 10pt;
  margin-top: 10px;
  margin-bottom: 5vh;
}

.easy {
  background-color: #d58c60;
  padding: 5px 6px;
  color: #fff !important;
  display: inline-block;
}

.webtop {
  margin-top: 20vh;
}

@media (max-width: 768px) {
  .webtop {
    margin-top: auto;
  }
}

.equse {
  margin-top: 1em;
}

.auto {
  padding: 3em;
}

@media (max-width: 768px) {
  .auto {
    padding: 0px;
  }
}
/*# sourceMappingURL=voca.css.map */