@charset "UTF-8";
@-webkit-keyframes gradient { 0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; } }
@keyframes gradient { 0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; } }

@-webkit-keyframes light { 0% { opacity: 1; }
  50% { opacity: .8; }
  100% { opacity: 1; } }

@keyframes light { 0% { opacity: 1; }
  50% { opacity: .8; }
  100% { opacity: 1; } }

@-webkit-keyframes loading { 100% { background-position: -288px; } }

@keyframes loading { 100% { background-position: -288px; } }

@-webkit-keyframes zoomIn { to { -webkit-transform: scale(1); transform: scale(1); } }

@keyframes zoomIn { to { -webkit-transform: scale(1); transform: scale(1); } }

@font-face { font-family: 'Gill Sans MT'; src: url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-BoldItalic.woff2") format("woff2"), url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-BoldItalic.woff") format("woff"); font-weight: bold; font-style: italic; font-display: swap; }

@font-face { font-family: 'Gill Sans MT'; src: url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT.woff2") format("woff2"), url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; }

@font-face { font-family: 'Gill Sans MT'; src: url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-Bold.woff2") format("woff2"), url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-Bold.woff") format("woff"); font-weight: bold; font-style: normal; font-display: swap; }

@font-face { font-family: 'Gill Sans MT Condensed'; src: url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-Condensed.woff2") format("woff2"), url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-Condensed.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; }

@font-face { font-family: 'Gill Sans MT Ext Condensed'; src: url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-ExtraCondensedBold.woff2") format("woff2"), url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-ExtraCondensedBold.woff") format("woff"); font-weight: bold; font-style: normal; font-display: swap; }

@font-face { font-family: 'Gill Sans MT'; src: url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-Italic.woff2") format("woff2"), url("https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/assets/GillSansMT-Italic.woff") format("woff"); font-weight: normal; font-style: italic; font-display: swap; }

body, html { overflow-x: hidden; }

body { padding-top: var(--hh) !important; }

header.component-header { position: absolute !important; top: 0; width: 100%; z-index: 10000 !important; }

header.component-header:hover { z-index: 20000 !important; }

.full { width: 100%; background: #000; }

.bs-wrapper { background: #000; font-family: "Gill Sans MT", Arial, "微軟正黑體", Helmet, Freesans, verdana, sans-serif; width: 100%; margin: 0 auto; }

.bs-wrapper .opacity-0 { opacity: 0; }

.bs-wrapper section { position: relative; width: 100%; height: calc(100vh - var(--hh)); }

.bs-wrapper .IIV::-webkit-media-controls-play-button, .bs-wrapper .IIV::-webkit-media-controls-start-playback-button { opacity: 0; pointer-events: none; width: 5px; }

.bs-wrapper video { position: absolute; left: 0; top: 0; display: block; width: 100%; height: calc(100% + 2px); -o-object-fit: cover; object-fit: cover; }

.bs-wrapper h2, .bs-wrapper p { margin: 0; padding: 0; }

.bs-wrapper h2 { font-size: 24px; font-weight: 700; color: #fff; }

@media (min-width: 992px) { .bs-wrapper h2 { font-size: calc(80 * (calc(var(--vw) / 1920))); } }

.bs-wrapper p, .bs-wrapper p a { font-size: 12px; color: #fff; font-family: "Arial"; letter-spacing: 1px; }

@media (min-width: 992px) { .bs-wrapper p, .bs-wrapper p a { font-size: calc(24 * (calc(var(--vw) / 1920))); } }

.bs-wrapper p a { text-decoration: underline; display: inline-block; }

.bs-wrapper p a:hover { text-decoration: none; }

.bs-wrapper * { outline: none; }

.bs-wrapper a.btn { position: relative; line-height: calc(38 * (calc(100vh - var(--bh)) / 1080)); height: calc(38 * (calc(100vh - var(--bh)) / 1080)); padding: 0 calc(30 * (calc(100vh - var(--bh)) / 1080)); border-radius: calc(19 * (calc(100vh - var(--bh)) / 1080)); border: 1px solid #000; text-align: center; text-decoration: none; font-size: calc(18 * (calc(100vh - var(--bh)) / 1080)); color: #000; text-align: center; display: table; -webkit-transition: background .4s, color .4s; -o-transition: background .4s, color .4s; transition: background .4s, color .4s; z-index: 300; }

.bs-wrapper a.btn:hover { background: #000; color: #fff; }

@media (min-width: 992px) { .bs-wrapper a.btn { line-height: calc(38 * (calc(var(--vw) / 1920))); height: calc(38 * (calc(var(--vw) / 1920))); padding: 0 calc(30 * (calc(var(--vw) / 1920))); border-radius: calc(19 * (calc(var(--vw) / 1920))); font-size: calc(18 * (calc(var(--vw) / 1920))); } }

.bs-wrapper .loading { position: fixed; left: 0; top: var(--hh); width: 100%; height: calc(100vh - var(--hh)); overflow: hidden; background: rgba(0, 0, 0, 0.95); z-index: 20000; }

.bs-wrapper .loading .pic { position: absolute; left: 50%; top: 50%; width: 24px; height: 24px; margin: -12px 0 0 -12px; background-image: url(https://www.benq.com/content/dam/b2c/en-us/campaigns/gv30/img/loading.png); background-size: auto 100%; overflow: hidden; -webkit-animation: loading 0.8s steps(12) infinite; animation: loading 0.8s steps(12) infinite; }

.bs-wrapper .buy { position: fixed; left: 0; top: var(--hh); width: 100%; z-index: 10001; background: #131313; font-family: "Arial"; letter-spacing: 1px; border-bottom: 1px solid #131313; }

.bs-wrapper .buy:after { position: absolute; left: 0; top: 0; width: 100%; height: 100px; content: ""; z-index: 0; }

.bs-wrapper .buy .container { position: relative; z-index: 10; }

.bs-wrapper .buy .hitarea { position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: none; }

.bs-wrapper .buy .hitarea.active { display: block; }

.bs-wrapper .buy h2 { font-weight: normal; font-size: 18px; }

.bs-wrapper .buy span, .bs-wrapper .buy a { font-size: 14px; color: #fff; line-height: 30px; display: block; }

.bs-wrapper .buy span.go-to-buy, .bs-wrapper .buy a.go-to-buy { background: #009EEA; border-radius: 15px; padding: 0 15px; }

.bs-wrapper .buy span.go-to-buy.disable, .bs-wrapper .buy a.go-to-buy.disable { background: #A2A2A2; text-decoration: none; cursor: default; }

.bs-wrapper .buy span.expand, .bs-wrapper .buy a.expand { position: relative; width: 30px; height: 30px; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transition: all .4s; -o-transition: all .4s; transition: all .4s; display: block; }

.bs-wrapper .buy span.expand:after, .bs-wrapper .buy a.expand:after { position: absolute; width: 50%; height: 50%; border-top: 1px solid #fff; border-right: 1px solid #fff; -webkit-transform: rotate(142deg) skewX(15deg) translateY(-50%); -ms-transform: rotate(142deg) skewX(15deg) translateY(-50%); transform: rotate(142deg) skewX(15deg) translateY(-50%); content: ""; }

.bs-wrapper .buy span.expand.active, .bs-wrapper .buy a.expand.active { -webkit-transform: scaleY(-1); -ms-transform: scaleY(-1); transform: scaleY(-1); }

.bs-wrapper .buy span { color: #666; }

.bs-wrapper .buy span.price { color: #fff; }

.bs-wrapper .buy span.regular { color: #A5A5A5; text-decoration: line-through; font-size: 12px; }

.bs-wrapper .buy .dropdown { display: none; }

.bs-wrapper .buy ul { margin: 0; }

.bs-wrapper .buy.deactived { top: 0; z-index: 20001; }

.bs-wrapper section.a { height: calc((100vh - var(--bh)) * 2.5); /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.a .inner { position: absolute; left: 0; top: 0; width: 100%; height: calc(var(--vh) - var(--bh)); }

.bs-wrapper section.a .gv30 { position: absolute; left: 50%; top: 40%; margin: calc(-291 * (100vw / 750)) 0 0 calc(-255 * (100vw / 750)); width: calc(510 * (100vw / 750)); height: calc(582 * (100vw / 750)); }

.bs-wrapper section.a .gv30 .gv30-light { position: absolute; left: -84.16%; top: -9.625%; width: 104.5%; -webkit-transform-origin: 133% 132%; -ms-transform-origin: 133% 132%; transform-origin: 133% 132%; }

.bs-wrapper section.a .gv30 .gv30-light img { -webkit-animation: light .1s linear infinite; animation: light .1s linear infinite; }

.bs-wrapper section.a .gv30 img.bottom, .bs-wrapper section.a .gv30 img.shadow { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.bs-wrapper section.a .gv30 img.body, .bs-wrapper section.a .gv30 img.body-shadow { position: absolute; left: 0; top: 0; width: 97.4%; height: 106.1%; }

.bs-wrapper section.a .gv30 ul { position: absolute; right: calc(-60 * (100vw / 750)); bottom: calc(15 * (100vw / 750)); }

.bs-wrapper section.a .gv30 ul li img { height: calc(20 * (100vw / 750)); }

.bs-wrapper section.a .gv30 ul li:nth-child(2) img { height: calc(27 * (100vw / 750)); }

.bs-wrapper section.a .text h1 { font-size: calc(120 * (100vw / 750)); color: #fff; font-weight: 700; }

.bs-wrapper section.a .text .wording { font-size: calc(90 * (100vw / 750)); font-weight: 700; color: #fff; }

.bs-wrapper section.a .text .wording ul { position: relative; margin: 0; }

.bs-wrapper section.a .text .wording ul li { position: absolute; left: 0; top: 0; white-space: nowrap; width: 100%; }

.bs-wrapper section.a .text .wording ul li:first-child { position: relative; left: auto; top: auto; }

.bs-wrapper section.a .text .wording ul li:nth-child(2) { top: 100%; }

.bs-wrapper section.a .text .wording ul li:nth-child(3) { top: 200%; }

.bs-wrapper section.a .text .wording ul li:nth-child(4) { top: 300%; }

.bs-wrapper section.a .text .wording ul.place li span { background: -webkit-gradient(linear, left top, right top, from(#05fafd), color-stop(24%, #7b97e1), color-stop(62%, #9582dc), to(#f2abd5)); background: -webkit-linear-gradient(left, #05fafd 0%, #7b97e1 24%, #9582dc 62%, #f2abd5 100%); background: -o-linear-gradient(left, #05fafd 0%, #7b97e1 24%, #9582dc 62%, #f2abd5 100%); background: linear-gradient(90deg, #05fafd 0%, #7b97e1 24%, #9582dc 62%, #f2abd5 100%); background-size: 400% 400%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: gradient 4s ease infinite; animation: gradient 4s ease infinite; }

.bs-wrapper section.a .text .wording .place2 { position: absolute; left: 0; top: 0; width: 100%; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); }

.bs-wrapper section.a .text2 { position: absolute; left: 0; bottom: calc(100 * (100vw / 750)); }

.bs-wrapper section.a .text2 p { font-size: calc(32 * (100vw / 750)); color: #fff; padding: 0 20px; }

.bs-wrapper section.a a.btn { position: absolute; left: 50%; bottom: 20%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); color: #fff; border: 1px solid #fff; }

@media (min-width: 768px) { .bs-wrapper section.a .text2 { bottom: calc(25 * (100vw / 750)); }
  .bs-wrapper section.a .text2 p { font-size: calc(28 * (100vw / 750)); } }

@media (min-width: 992px) { .bs-wrapper section.a { height: calc((100vh - var(--bh)) * 3); }
  .bs-wrapper section.a .gv30 { position: absolute; left: 50%; top: 50%; margin: calc(-411 * (calc(100vh - var(--bh)) / 1080)) 0 0 calc(-360 * (calc(100vh - var(--bh)) / 1080)); width: calc(720 * (calc(100vh - var(--bh)) / 1080)); height: calc(822 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .gv30 ul { position: absolute; right: calc(-250 * (calc(100vh - var(--bh)) / 1080)); bottom: calc(80 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .gv30 ul li { float: left; margin-left: calc(30 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .gv30 ul li img { height: calc(30 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .gv30 ul li:nth-child(2) img { height: calc(35 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .text h1 { font-size: calc(165 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .text .overflow-hidden { overflow: visible !important; }
  .bs-wrapper section.a .text .wording { font-size: calc(120 * (calc(100vh - var(--bh)) / 1080)); overflow: hidden; }
  .bs-wrapper section.a .text2 { left: auto; right: 71%; bottom: calc(210 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.a .text2 p { font-size: calc(28 * (calc(var(--vw) / 1920))); width: calc(384 * (calc(var(--vw) / 1920))); padding: 0; }
  .bs-wrapper section.a .p1 { overflow: hidden; }
  .bs-wrapper section.a .p2 { position: absolute; left: 0; top: 100%; width: 100%; }
  .bs-wrapper section.a a.btn { position: absolute; left: 50%; bottom: 20%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); color: #fff; border: 1px solid #fff; font-size: calc(36 * (calc(var(--vw) / 1920))); line-height: calc(76 * (calc(var(--vw) / 1920))); height: calc(76 * (calc(var(--vw) / 1920))); border-radius: calc(38 * (calc(var(--vw) / 1920))); padding: 0 calc(60 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.a a.btn:hover { background: #fff; color: #000; } }

.bs-wrapper section.b { height: calc((100vh - var(--bh)) * 3); /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.b .inner { position: absolute; left: 0; top: 0; width: 100%; height: calc(100vh - var(--bh)); overflow: hidden; }

.bs-wrapper section.b .m-p1 { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.bs-wrapper section.b .pic-all { position: relative; width: 100%; display: block; overflow: hidden; }

.bs-wrapper section.b .pic-all:after { padding-top: 69.33333%; display: block; content: ""; }

.bs-wrapper section.b .pic-all .p { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.bs-wrapper section.b .text { position: absolute; left: 20px; bottom: calc(50 * (100vw / 750)); }

.bs-wrapper section.b .text h2 { font-size: calc(78 * (100vw / 750)); color: #e9e9e9; font-weight: 700; }

.bs-wrapper section.b .text p { font-size: calc(32 * (100vw / 750)); color: #e9e9e9; width: calc(400 * (100vw / 750)); }

.bs-wrapper section.b .text2 { padding-top: calc(50 * (100vh / 1110)); }

.bs-wrapper section.b .text2 small { font-size: calc(34 * (100vw / 750)); color: #ececec; }

.bs-wrapper section.b .text2 ul { position: relative; margin: 0; }

.bs-wrapper section.b .text2 ul li { position: absolute; left: 0; top: 0; white-space: nowrap; width: 100%; font-weight: 700; color: #ececec; }

.bs-wrapper section.b .text2 ul li:first-child { position: relative; left: auto; top: auto; }

.bs-wrapper section.b .text2 ul.size li { font-size: calc(104 * (100vw / 750)); text-align: right; border-right: 1px solid #ececec; }

.bs-wrapper section.b .text2 ul.distance li { font-size: calc(34 * (100vw / 750)); }

@media (min-width: 992px) { .bs-wrapper section.b { height: calc((100vh - var(--bh)) * 3); }
  .bs-wrapper section.b .pic-all { position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: scale(1.5); -ms-transform: scale(1.5); transform: scale(1.5); }
  .bs-wrapper section.b .pic-all:after { display: none; }
  .bs-wrapper section.b .pic-all .p { opacity: 0; -webkit-transition: opacity .4s; -o-transition: opacity .4s; transition: opacity .4s; }
  .bs-wrapper section.b .pic-all .p.p1 { opacity: 1; }
  .bs-wrapper section.b .pic-all.p2 .p2 { opacity: 1; }
  .bs-wrapper section.b .pic-all.p3 .p3 { opacity: 1; }
  .bs-wrapper section.b .text { position: absolute; left: calc(120 * (calc(100vh - var(--bh)) / 1080)); bottom: calc(100 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.b .text h2 { font-size: calc(120 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.b .text p { font-size: calc(28 * (calc(var(--vw) / 1920))); width: auto; }
  .bs-wrapper section.b .text2 { position: absolute; left: calc(190 * (calc(100vh - var(--bh)) / 1080)); top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); padding: 0; }
  .bs-wrapper section.b .text2 small { font-size: calc(36 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.b .text2 ul li { opacity: 0; -webkit-transition: opacity .4s; -o-transition: opacity .4s; transition: opacity .4s; }
  .bs-wrapper section.b .text2 ul.size li { font-size: calc(110 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.b .text2 ul.distance li { font-size: calc(50 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.b .text2 ul.cut1 li:first-child { opacity: 1; }
  .bs-wrapper section.b .text2 ul.cut2 li:nth-child(2) { opacity: 1; }
  .bs-wrapper section.b .text2 ul.cut3 li:nth-child(3) { opacity: 1; } }

.bs-wrapper section.c { height: calc(100vh - var(--bh)); /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.c .inner { position: absolute; left: 0; top: 0; width: 100%; height: calc(100vh - var(--bh)); overflow: hidden; }

.bs-wrapper section.c .pic-all { position: relative; width: 100%; display: block; overflow: hidden; }

.bs-wrapper section.c .pic-all:after { padding-top: 58.33333%; display: block; content: ""; }

.bs-wrapper section.c .pic-all .p { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; display: none; }

.bs-wrapper section.c .pic-all .p img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }

.bs-wrapper section.c .pic-all .p.animate { display: block; }

.bs-wrapper section.c .pic-all .p.animate img { -webkit-animation: zoomIn 10s linear; animation: zoomIn 10s linear; }

.bs-wrapper section.c .pic-all .p.p0 img { -webkit-transform: scale(1.08); -ms-transform: scale(1.08); transform: scale(1.08); }

.bs-wrapper section.c .text { padding-top: calc(50 * (100vh / 1110)); }

.bs-wrapper section.c .text h3 { font-size: calc(45 * (100vw / 750)); color: #b6b6b6; font-weight: 700; }

.bs-wrapper section.c .text ul { position: relative; margin: 0; }

.bs-wrapper section.c .text ul li { position: absolute; left: 0; top: 0; white-space: nowrap; font-size: calc(64 * (100vw / 750)); color: #fff; text-align: center; width: 100%; opacity: 0; -webkit-transition: opacity .4s; -o-transition: opacity .4s; transition: opacity .4s; }

.bs-wrapper section.c .text ul li:first-child { position: relative; left: auto; top: auto; }

.bs-wrapper section.c .text ul.w1 li:first-child { opacity: 1; }

.bs-wrapper section.c .text ul.w2 li:nth-child(2) { opacity: 1; }

.bs-wrapper section.c .text ul.w3 li:nth-child(3) { opacity: 1; }

@media (min-width: 992px) { .bs-wrapper section.c { height: calc(100vh - var(--bh)); }
  .bs-wrapper section.c .text { position: absolute; right: 0; top: 0; width: 33%; height: 100%; }
  .bs-wrapper section.c .text h3 { font-size: calc(45 * (calc(100vh - var(--bh)) / 1080)); color: #b6b6b6; font-weight: 700; }
  .bs-wrapper section.c .text ul { position: relative; margin: 0; }
  .bs-wrapper section.c .text ul li { position: absolute; left: 0; top: 0; white-space: nowrap; font-size: calc(64 * (calc(100vh - var(--bh)) / 1080)); color: #fff; text-align: center; width: 100%; opacity: 0; -webkit-transition: opacity .4s; -o-transition: opacity .4s; transition: opacity .4s; }
  .bs-wrapper section.c .text ul li:first-child { position: relative; left: auto; top: auto; }
  .bs-wrapper section.c .pic-all { position: absolute; left: 35%; top: 50%; width: calc(1248 * (calc(var(--vw) / 1920))); height: calc(728 * (calc(var(--vw) / 1920))); margin: calc(-364 * (calc(var(--vw) / 1920))) 0 0 calc(-624 * (calc(var(--vw) / 1920))); } }

.bs-wrapper section.d { height: calc((100vh - var(--bh)) * 3); background: #fff; overflow: hidden; /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s::::::: ::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.d .mask { position: absolute; left: 0; top: -5px; width: 100%; height: 35%; background: #000; }

.bs-wrapper section.d > .inner { position: absolute; left: 0; top: 0; width: 100%; height: calc((100vh - var(--bh)) * 1); }

.bs-wrapper section.d .pic-all { position: relative; width: 100%; }

.bs-wrapper section.d .pic-all .inner { position: relative; width: 100%; display: block; overflow: hidden; }

.bs-wrapper section.d .pic-all .inner:after { padding-top: 60.34713%; display: block; content: ""; }

.bs-wrapper section.d .pic-all .p { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.bs-wrapper section.d .pic-all .gv30 { position: absolute; left: 50%; bottom: calc(-20 * (100vh / 1110)); margin-left: calc(-42 * (100vh / 1110)); width: calc(84 * (100vh / 1110)); }

.bs-wrapper section.d .pic-all .gv30 > img { position: relative; z-index: 30; display: none; width: 100%; }

.bs-wrapper section.d .pic-all .gv30 .light { position: absolute; left: 50%; top: 0; -webkit-transform: translate(-53%, -75%); -ms-transform: translate(-53%, -75%); transform: translate(-53%, -75%); z-index: 1; width: 100%; }

.bs-wrapper section.d .pic-all .gv30 .light img { width: 100%; display: block; -webkit-animation: light .1s linear infinite; animation: light .1s linear infinite; }

.bs-wrapper section.d .m-text-all { position: relative; padding-top: calc(50 * (100vh / 1110)); }

.bs-wrapper section.d .m-text-all h2 { font-size: calc(60 * (100vw / 750)); color: #000; margin-bottom: calc(15 * (100vh / 1110)); }

.bs-wrapper section.d .m-text-all h2 span { color: #e8bc5b; }

.bs-wrapper section.d .m-text-all p { color: #000; padding: 0 15px; font-size: calc(32 * (100vw / 750)); }

.bs-wrapper section.d .m-text-all .text2 { position: absolute; left: 0; top: calc(50 * (100vh / 1110)); }

@media (min-width: 992px) { .bs-wrapper section.d { height: calc((100vh - var(--bh)) * 5); background: #fff; overflow: hidden; }
  .bs-wrapper section.d > .inner { position: absolute; left: 0; top: 0; width: 100%; height: calc((100vh - var(--bh)) * 1); }
  .bs-wrapper section.d .pic-all { position: absolute; left: 0; top: -1px; width: 100%; height: calc(100vh - var(--bh) - calc(100 * (calc(100vh - var(--bh)) / 1080))); background: #000; overflow: hidden; }
  .bs-wrapper section.d .pic-all .inner { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
  .bs-wrapper section.d .pic-all .inner:after { display: none; }
  .bs-wrapper section.d .pic-all .p { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
  .bs-wrapper section.d .pic-all .p.p1 { display: block; }
  .bs-wrapper section.d .gv30 { position: absolute; left: 49.4%; bottom: 0; width: calc(173 * (calc(var(--vw) / 1920))); margin-left: calc(-86.5 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.d .gv30 > img { position: relative; z-index: 30; display: none; width: 100%; }
  .bs-wrapper section.d .gv30 .light { position: absolute; left: 50%; top: 0; -webkit-transform: translate(-53%, -75%); -ms-transform: translate(-53%, -75%); transform: translate(-53%, -75%); z-index: 1; width: 100%; }
  .bs-wrapper section.d .gv30 .light img { width: 100%; display: block; -webkit-animation: light .1s linear infinite; animation: light .1s linear infinite; }
  .bs-wrapper section.d .angles { position: absolute; right: 58%; bottom: calc(50 * (calc(100vh - var(--bh)) / 1080)); width: calc(173 * (calc(100vh - var(--bh)) / 1080)); height: calc(51 * (calc(100vh - var(--bh)) / 1080)); margin-left: calc(-86.5 * (calc(100vh - var(--bh)) / 1080)); overflow: hidden; }
  .bs-wrapper section.d .angles img { position: absolute; left: 0; top: 100%; }
  .bs-wrapper section.d .text { position: absolute; left: 58%; bottom: calc(50 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.d .text p { font-size: calc(24 * (calc(var(--vw) / 1920))); width: calc(600 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.d .text2 { position: absolute; left: 0; bottom: calc(50 * (calc(100vh - var(--bh)) / 1080)); width: 100%; }
  .bs-wrapper section.d .text2 p { width: calc(1042 * (calc(var(--vw) / 1920))); font-size: calc(24 * (calc(var(--vw) / 1920))); margin: 0 auto; }
  .bs-wrapper section.d h2 { font-size: calc(52 * (calc(100vh - var(--bh)) / 1080)); font-weight: 700; color: #fff; }
  .bs-wrapper section.d h2 span { color: #f0d280; }
  .bs-wrapper section.d p { font-size: calc(18 * (calc(100vh - var(--bh)) / 1080)); font-family: Arial; } }

.bs-wrapper section.e { height: auto; background: #fff; padding-bottom: calc(100 * (100vh / 1110)); overflow: hidden; /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.e h2 { position: absolute; left: 0; top: 0; font-size: calc(72 * (100vw / 750)); color: #000; padding: 0 20px; }

.bs-wrapper section.e p { position: relative; font-size: calc(32 * (100vw / 750)); color: #000; z-index: 30; }

.bs-wrapper section.e p a { color: #000; font-size: calc(32 * (100vw / 750)); }

.bs-wrapper section.e .video { position: relative; width: 100%; display: block; margin-top: calc(200 * (100vw / 750)); margin-bottom: calc(50 * (100vw / 750)); background: #fff; -webkit-transform: scale(1.25); -ms-transform: scale(1.25); transform: scale(1.25); }

.bs-wrapper section.e .video:after { padding-top: 76.38889%; display: block; content: ""; }

@media (min-width: 992px) { .bs-wrapper section.e { padding: 0; height: calc(100vh - var(--bh)); }
  .bs-wrapper section.e .container { max-width: 1920px; }
  .bs-wrapper section.e h2 { left: calc(100 * (calc(var(--vw) / 1920))); top: calc(50 * (calc(var(--vw) / 1920))); font-size: calc(80 * (calc(var(--vw) / 1920))); padding: 0; }
  .bs-wrapper section.e p { position: absolute; right: calc(100 * (calc(var(--vw) / 1920))); bottom: calc(50 * (calc(var(--vw) / 1920))); width: calc(530 * (calc(var(--vw) / 1920))); font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.e p a { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.e .video { position: absolute; left: 48%; top: 50%; width: 70%; -webkit-transform: scale(1) translate(-50%, -50%); -ms-transform: scale(1) translate(-50%, -50%); transform: scale(1) translate(-50%, -50%); margin: 0; }
  .bs-wrapper section.e .video:before { position: absolute; left: 0; bottom: -2.5px; width: 100%; height: 5px; background: #fff; content: ""; z-index: 30; } }

.bs-wrapper section.f { height: auto; background: #fff; /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.f h2 { color: #000; font-size: calc(56 * (100vw / 750)); margin-bottom: calc(50 * (100vh / 1110)); }

.bs-wrapper section.f p { font-size: calc(32 * (100vw / 750)); color: #000; }

.bs-wrapper section.f .f1 { position: relative; }

.bs-wrapper section.f .f1 .list-all { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.bs-wrapper section.f .f1 .list-all .l { width: 1033px; margin-bottom: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }

.bs-wrapper section.f .f1 .list-all .l img { display: block; height: 75px; margin-right: 10px; }

.bs-wrapper section.f .f1 .list-all .l.l2 { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

.bs-wrapper section.f .f1 p { width: 100%; padding: 20px 20px 0; color: #000; }

.bs-wrapper section.f .f1 p a { color: #000; font-size: calc(32 * (100vw / 750)); }

.bs-wrapper section.f .f1 p.notice { font-size: calc(22 * (100vw / 750)); padding-top: 10px; margin-bottom: 25px; }

.bs-wrapper section.f .f1 a { margin: 0 auto 25px; }

.bs-wrapper section.f .f2 { max-width: 1920px; margin: 0 auto calc(50 * (100vh / 1110)); }

.bs-wrapper section.f .f2 .pic { width: 100%; padding-right: calc(50 * (100vh / 1110)); opacity: 0; margin-bottom: calc(50 * (100vh / 1110)); }

.bs-wrapper section.f .f2 .pic img { width: 100%; display: block; }

.bs-wrapper section.f .f2 .text { padding: 0 20px; }

.bs-wrapper section.f .f2 .text h2 { opacity: 0; color: #000; }

.bs-wrapper section.f .f2 .text p { opacity: 0; color: #000; }

.bs-wrapper section.f .f2 .text p a:not(.btn) { color: #000; font-size: calc(32 * (100vw / 750)); }

.bs-wrapper section.f .f2 .text a.btn { margin-top: 25px; }

.bs-wrapper section.f .f3 { padding-bottom: calc(100 * (100vh / 1110)); }

.bs-wrapper section.f .f3 h2 { padding: 0 20px; }

.bs-wrapper section.f .f3 p { padding: 0 20px; }

@media (min-width: 992px) { .bs-wrapper section.f { padding-bottom: calc(100 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f h2 { font-size: calc(80 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.f p { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.f a.btn { font-size: calc(28 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.f .f1 h2 { margin-bottom: calc(50 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f .f1 .list-all { width: 100%; margin-bottom: calc(20 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f .f1 .list-all .l { width: auto; margin-bottom: calc(20 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f .f1 .list-all .l img { height: calc(149 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.f .f1 p { width: calc(1200 * (calc(var(--vw) / 1920))); margin: 0 auto; padding: 0; }
  .bs-wrapper section.f .f1 p.notice { font-size: calc(16 * (calc(var(--vw) / 1920))); margin-bottom: calc(30 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f .f1 p a { font-size: calc(24 * (calc(var(--vw) / 1920))); white-space: nowrap; margin: 0; }
  .bs-wrapper section.f .f1 a { margin: 0 auto calc(100 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f .f2 { position: relative; width: 100%; height: calc((100vh - var(--bh)) * 1); }
  .bs-wrapper section.f .f2 .pic { position: absolute; left: calc(-294 * (calc(var(--vw) / 1920))); top: 50%; width: calc(1317 * (calc(var(--vw) / 1920))); margin: calc(-400.5 * (calc(var(--vw) / 1920))) 0 0 0; padding: 0; }
  .bs-wrapper section.f .f2 .text { position: absolute; bottom: auto; left: calc(1075 * (calc(var(--vw) / 1920))); top: 50%; margin: calc(-300 * (calc(var(--vw) / 1920))) 0 0 0; padding: 0; }
  .bs-wrapper section.f .f2 .text p { width: calc(469 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.f .f2 .text p a:not(.btn) { font-size: calc(24 * (calc(var(--vw) / 1920))); white-space: nowrap; }
  .bs-wrapper section.f .f2 .text a.btn { margin-top: calc(50 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.f .f3 .container { max-width: 1200px; }
  .bs-wrapper section.f .f3 .w-60 { width: calc(1000 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.f .f3 h2 { white-space: nowrap; margin-bottom: calc(60 * (calc(100vh - var(--bh)) / 1080)); } }

.bs-wrapper section.g { height: auto; background: #fff; padding-bottom: calc(100 * (100vh / 1110)); /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.g .container { max-width: 1200px; }

.bs-wrapper section.g .wrap { background: #ebebeb; border-radius: 15px; padding: calc(30 * (100vh / 1110)) 0 calc(50 * (100vh / 1110)); }

.bs-wrapper section.g h2 { font-size: calc(46 * (100vw / 750)); color: #000; margin-bottom: calc(100 * (100vw / 750)); }

.bs-wrapper section.g .item { margin-bottom: calc(50 * (100vw / 750)); }

.bs-wrapper section.g figure img { width: 50%; display: block; margin: 0 auto calc(-30 * (calc(var(--vw) / 1920))); }

.bs-wrapper section.g figure figcaption { text-align: center; font-size: calc(32 * (100vw / 750)); }

.bs-wrapper section.g figure figcaption a.link { display: table; margin: 0 auto; font-size: calc(24 * (100vw / 750)); }

@media (min-width: 992px) { .bs-wrapper section.g { padding-bottom: calc(100 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.g .wrap { padding: calc(100 * (calc(100vh - var(--bh)) / 1080)) calc(160 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.g h2 { font-size: calc(56 * (calc(var(--vw) / 1920))); white-space: nowrap; text-align: center; margin: 0 calc(-100 * (calc(var(--vw) / 1920))) calc(100 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.g .item { margin-bottom: calc(80 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.g figure img { margin: 0 auto calc(15 * (calc(var(--vw) / 1920))); width: 60%; }
  .bs-wrapper section.g figure figcaption { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.g figure figcaption a.link { font-size: calc(13 * (calc(var(--vw) / 1920))); margin: 0 0 0 calc(5 * (calc(var(--vw) / 1920))); display: inline-block; font-weight: 700; } }

.bs-wrapper section.h { height: auto; background: #ebebeb; padding: calc(80 * (100vw / 750)) 0; /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper section.h .container { max-width: 1200px; }

.bs-wrapper section.h h2 { font-size: calc(36 * (100vw / 750)); color: #000; margin-bottom: calc(40 * (calc(100vh - var(--bh)) / 1080)); }

.bs-wrapper section.h .swiper { overflow: visible; }

.bs-wrapper section.h .swiper-slide { background: #fff; width: calc(489 * (100vw / 750)); border-radius: 15px; }

.bs-wrapper section.h .swiper-slide h3 { font-size: calc(36 * (100vw / 750)); color: #000; font-weight: 700; padding: calc(50 * (100vw / 750)) 0 0; height: calc(190 * (100vw / 750)); }

.bs-wrapper section.h .swiper-slide h3 small { font-size: calc(24 * (100vw / 750)); color: #000; padding: calc(30 * (100vw / 750)) 15px 0; }

.bs-wrapper section.h .swiper-slide .img-wrap { position: relative; width: 100%; display: block; }

.bs-wrapper section.h .swiper-slide .img-wrap:after { padding-top: 93.58407%; display: block; content: ""; }

.bs-wrapper section.h .swiper-slide a.btn { display: table; margin: calc(30 * (100vw / 750)) auto; border: 1px solid #000; color: #000; }

.bs-wrapper section.h .swiper-slide a.btn:hover { background: #000; color: #fff; }

.bs-wrapper section.h a.prev img { -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1); }

.bs-wrapper section.h a.prev, .bs-wrapper section.h a.next { width: calc(36 * (100vw / 750)); height: calc(36 * (100vw / 750)); display: block; opacity: 1; -webkit-transition: opacity .4s; -o-transition: opacity .4s; transition: opacity .4s; }

.bs-wrapper section.h a.prev.swiper-button-disabled, .bs-wrapper section.h a.next.swiper-button-disabled { opacity: .5; }

@media (min-width: 768px) { .bs-wrapper section.h { padding: calc(80 * (calc(var(--vw) / 1920))) 0; }
  .bs-wrapper section.h h2 { font-size: calc(56 * (calc(var(--vw) / 1920))); margin-bottom: calc(40 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper section.h .swiper-slide { width: calc(489 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.h .swiper-slide h3 { font-size: calc(36 * (calc(var(--vw) / 1920))); font-weight: 700; padding: calc(50 * (calc(var(--vw) / 1920))) 0 0; height: calc(190 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.h .swiper-slide h3 small { font-size: calc(24 * (calc(var(--vw) / 1920))); padding: calc(30 * (calc(var(--vw) / 1920))) 15px 0; }
  .bs-wrapper section.h .swiper-slide a.btn { margin: calc(30 * (calc(var(--vw) / 1920))) auto; }
  .bs-wrapper section.h a.prev, .bs-wrapper section.h a.next { width: calc(36 * (calc(var(--vw) / 1920))); height: calc(36 * (calc(var(--vw) / 1920))); } }

.bs-wrapper section.j { background: #fff; padding: 50px 0; height: auto; }

.bs-wrapper section.j .container { max-width: 1200px; }

.bs-wrapper section.j h2 { color: #000; font-size: calc(46 * (100vw / 750)); text-align: center; margin-bottom: 25px; }

.bs-wrapper section.j a.link { font-size: calc(32 * (100vw / 750)); display: table; margin: 15px auto; }

.bs-wrapper section.j figure { height: 100%; }

.bs-wrapper section.j figure img { margin-bottom: 25px; }

.bs-wrapper section.j figure figcaption h3 { font-size: calc(36 * (100vw / 750)); font-weight: 700; }

.bs-wrapper section.j figure figcaption h4 { font-size: 12px; color: #000; font-weight: 700; }

.bs-wrapper section.j figure figcaption p { font-size: calc(32 * (100vw / 750)); color: #000; margin-bottom: 15px; }

.bs-wrapper section.j a.compare { display: table; margin: 25px auto 50px; }

@media (min-width: 992px) { .bs-wrapper section.j { padding: calc(100 * (calc(var(--vw) / 1920))) 0; }
  .bs-wrapper section.j h2 { font-size: calc(56 * (calc(var(--vw) / 1920))); margin-bottom: calc(50 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.j .swiper-slide { margin-bottom: calc(50 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.j a.link { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.j figure img { margin-bottom: calc(50 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.j figure figcaption h3 { font-size: calc(36 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.j figure figcaption h4 { font-size: calc(24 * (calc(var(--vw) / 1920))); font-weight: 700; }
  .bs-wrapper section.j figure figcaption p { font-size: calc(24 * (calc(var(--vw) / 1920))); margin-bottom: calc(30 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.j figure figcaption a.link { font-size: calc(24 * (calc(var(--vw) / 1920))); margin: calc(30 * (calc(var(--vw) / 1920))) auto; }
  .bs-wrapper section.j a.compare { display: table; margin: calc(25 * (calc(var(--vw) / 1920))) auto calc(100 * (calc(var(--vw) / 1920))); } }

.bs-wrapper section.k { position: relative; background: #efefef; padding: 50px 0; height: auto; }

.bs-wrapper section.k .container { max-width: 1200px; }

.bs-wrapper section.k h2 { color: #000; font-size: calc(32 * (100vw / 750)); text-align: center; margin-bottom: 40px; }

.bs-wrapper section.k figure img { margin-bottom: 15px; }

.bs-wrapper section.k figure figcaption { font-size: calc(24 * (100vw / 750)); font-weight: 700; }

.bs-wrapper section.k figure figcaption span { font-size: calc(24 * (100vw / 750)); font-weight: normal; display: block; padding: 15px 0; }

.bs-wrapper section.k figure figcaption span b { display: block; font-size: calc(18 * (100vw / 750)); font-weight: normal; }

.bs-wrapper section.k figure figcaption a.link { font-size: calc(18 * (100vw / 750)); font-weight: normal; }

@media (min-width: 992px) { .bs-wrapper section.k { padding: calc(100 * (calc(var(--vw) / 1920))) 0; }
  .bs-wrapper section.k h2 { font-size: calc(50 * (calc(var(--vw) / 1920))); margin-bottom: calc(80 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.k figure img { margin-bottom: calc(30 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.k figure figcaption { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.k figure figcaption span { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.k figure figcaption span b { font-size: calc(18 * (calc(var(--vw) / 1920))); }
  .bs-wrapper section.k figure figcaption a.link { font-size: calc(18 * (calc(var(--vw) / 1920))); } }

.bs-wrapper .pp { position: fixed; left: 0; top: var(--bh); width: 100%; height: calc(100% - var(--bh)); background: rgba(0, 0, 0, 0.8); z-index: 10000; overflow-y: scroll; display: none; /* JJJJJJJJJJJ J:::::::::J J:::::::::J JJ:::::::JJ J:::::J J:::::J J:::::J J:::::j J:::::J JJJJJJJ     J:::::J J:::::J     J:::::J J::::::J   J::::::J J:::::::JJJ:::::::J JJ:::::::::::::JJ JJ:::::::::JJ JJJJJJJJJ */ }

.bs-wrapper .pp .hitarea { position: fixed; left: 0; top: var(--bh); width: calc(100% - 20px); height: calc(100% - var(--bh)); }

.bs-wrapper .pp .pp-fixed { position: fixed; left: 50%; top: var(--bh); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 100%; max-width: 1200px; height: 3px; -webkit-transition: top .4s; -o-transition: top .4s; transition: top .4s; }

.bs-wrapper .pp .pp-fixed.active { top: calc(var(--bh) + 30px); }

.bs-wrapper .pp .pp-fixed a.x { position: absolute; left: calc(1rem + 10px); top: calc(3rem + 10px); width: 21px; }

@media (min-width: 992px) { .bs-wrapper .pp .pp-fixed { left: calc(50% - 10px); }
  .bs-wrapper .pp .pp-fixed a.x { left: 20px; top: calc(3rem + 20px); width: calc(42 * (calc(var(--vw) / 1920))); } }

.bs-wrapper .pp .page { position: relative; background: #fff; max-width: 1200px; margin: 0 auto; border-radius: 15px; overflow: hidden; display: none; }

.bs-wrapper .pp .page .container { max-width: 1200px; }

.bs-wrapper .pp .page .wrap { padding: 30px 15px; }

@media (min-width: 992px) { .bs-wrapper .pp .page .wrap { padding: calc(120 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page h2 { font-size: calc(48 * (calc(var(--vw) / 1920))); padding-bottom: calc(40 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page p span { font-size: calc(14 * (calc(var(--vw) / 1920))); } }

.bs-wrapper .pp .page.f1, .bs-wrapper .pp .page.f2 { /* FFFFFFFFFFFFFFFFFFFFFF F::::::::::::::::::::F F::::::::::::::::::::F FF::::::FFFFFFFFF::::F F:::::F       FFFFFF F:::::F F::::::FFFFFFFFFF F:::::::::::::::F F:::::::::::::::F F::::::FFFFFFFFFF F:::::F F:::::F FF:::::::FF F::::::::FF F::::::::FF FFFFFFFFFFF */ }

.bs-wrapper .pp .page.f1 h2, .bs-wrapper .pp .page.f2 h2 { font-size: calc(24 * (100vw / 750)); color: #000; font-weight: normal; border-bottom: 1px solid #000; padding-bottom: 20px; margin-bottom: 20px; }

.bs-wrapper .pp .page.f1 h3, .bs-wrapper .pp .page.f2 h3 { font-size: 16px; }

.bs-wrapper .pp .page.f1 p, .bs-wrapper .pp .page.f2 p { font-size: 12px; color: #000; margin-bottom: 20px; }

.bs-wrapper .pp .page.f1 p span, .bs-wrapper .pp .page.f2 p span { font-size: 10px; display: block; }

.bs-wrapper .pp .page.f1 .video, .bs-wrapper .pp .page.f2 .video { position: relative; width: 100%; display: block; }

.bs-wrapper .pp .page.f1 .video:after, .bs-wrapper .pp .page.f2 .video:after { padding-top: 56.25%; display: block; content: ""; }

.bs-wrapper .pp .page.f1 .video iframe, .bs-wrapper .pp .page.f2 .video iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.bs-wrapper .pp .page.f1 .line, .bs-wrapper .pp .page.f2 .line { width: 100%; height: 0; border-bottom: 1px solid #000; padding-bottom: 20px; margin-bottom: 20px; }

@media (min-width: 992px) { .bs-wrapper .pp .page.f1 h2, .bs-wrapper .pp .page.f2 h2 { font-size: calc(48 * (calc(var(--vw) / 1920))); padding-bottom: calc(40 * (calc(var(--vw) / 1920))); margin-bottom: calc(40 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.f1 h3, .bs-wrapper .pp .page.f2 h3 { font-size: calc(32 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.f1 p span, .bs-wrapper .pp .page.f2 p span { font-size: calc(14 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.f1 p, .bs-wrapper .pp .page.f2 p { font-size: calc(18 * (calc(var(--vw) / 1920))); margin-bottom: calc(40 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.f1 .line, .bs-wrapper .pp .page.f2 .line { padding-bottom: calc(40 * (calc(var(--vw) / 1920))); margin-bottom: calc(40 * (calc(var(--vw) / 1920))); } }

.bs-wrapper .pp .j-fixed { position: fixed; left: 0; top: var(--bh); width: 100%; background: #fff; opacity: 0; visibility: hidden; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all .4s; -o-transition: all .4s; transition: all .4s; text-align: center; z-index: 1001; border-bottom: 1px solid #afafaf; }

.bs-wrapper .pp .j-fixed h4 { font-size: calc(36 * (100vw / 750)); font-weight: 700; }

.bs-wrapper .pp .j-fixed.active { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media (min-width: 992px) { .bs-wrapper .pp .j-fixed h4 { font-size: calc(36 * (calc(var(--vw) / 1920))); } }

.bs-wrapper .pp .page.j { /* dddddddd d::::::d                 kkkkkkkk d::::::d                 k::::::k d::::::d                 k::::::k d:::::d                  k::::::k ddddddddd:::::d     ssssssssss    k:::::k    kkkkkkk dd::::::::::::::d   ss::::::::::s   k:::::k   k:::::k d::::::::::::::::d ss:::::::::::::s  k:::::k  k:::::k d:::::::ddddd:::::d s::::::ssss:::::s k:::::k k:::::k d::::::d    d:::::d  s:::::s  ssssss  k::::::k:::::k d:::::d     d:::::d    s::::::s       k:::::::::::k d:::::d     d:::::d       s::::::s    k:::::::::::k d:::::d     d:::::d ssssss   s:::::s  k::::::k:::::k d::::::ddddd::::::dds:::::ssss::::::sk::::::k k:::::k d:::::::::::::::::ds::::::::::::::s k::::::k  k:::::k d:::::::::ddd::::d s:::::::::::ss  k::::::k   k:::::k ddddddddd   ddddd  sssssssssss    kkkkkkkk    kkkkkkk ________________________ _::::::::::::::::::::::_ ________________________ */ }

.bs-wrapper .pp .page.j .row { padding: 0 0 calc(40 * (100vw / 750)); }

.bs-wrapper .pp .page.j h2 { font-size: calc(56 * (100vw / 750)); color: #000; text-align: center; padding: 60px 0 40px; border: none; }

.bs-wrapper .pp .page.j h3 { font-size: calc(36 * (100vw / 750)); font-weight: 700; text-align: left; white-space: nowrap; padding-bottom: calc(40 * (100vw / 750)); }

.bs-wrapper .pp .page.j h4 { font-size: calc(36 * (100vw / 750)); font-weight: 700; }

.bs-wrapper .pp .page.j h5 { font-size: calc(24 * (100vw / 750)); font-weight: 700; }

.bs-wrapper .pp .page.j p { font-size: calc(28 * (100vw / 750)); color: #000; font-family: "Gill Sans MT"; }

.bs-wrapper .pp .page.j a.link { display: table; margin: 0 auto; font-size: calc(28 * (100vw / 750)); }

.bs-wrapper .pp .page.j .r1 a.link { position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }

.bs-wrapper .pp .page.j .fixed-top { position: fixed; left: 0; top: 50px; width: 100%; background: #fff; opacity: 0; visibility: hidden; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all .4s; -o-transition: all .4s; transition: all .4s; }

.bs-wrapper .pp .page.j .fixed-top.active { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.bs-wrapper .pp .page.j .fixed-top .container { border-bottom: 1px solid #afafaf; }

.bs-wrapper .pp .page.j figure { text-align: center; }

.bs-wrapper .pp .page.j figure img { width: 80%; display: block; margin: 0 auto calc(30 * (100vw / 750)); }

.bs-wrapper .pp .page.j figure figcaption { font-size: calc(28 * (100vw / 750)); }

.bs-wrapper .pp .page.j figure figcaption span { font-weight: 700; display: block; }

.bs-wrapper .pp .page.j figure figcaption span.spacer { padding-top: 15px; }

.bs-wrapper .pp .page.j .row > .col-12 > p { padding-top: 15px; }

.bs-wrapper .pp .page.j table { width: 100%; margin-bottom: 25px; }

.bs-wrapper .pp .page.j table > tbody > tr > td { width: 33.33%; padding: 15px 10px; font-size: calc(28 * (100vw / 750)); vertical-align: top; }

.bs-wrapper .pp .page.j table > tbody > tr > td span { display: block; font-weight: 700; }

.bs-wrapper .pp .page.j table > tbody > tr > td span.larger { font-size: calc(36 * (100vw / 750)); }

.bs-wrapper .pp .page.j .bottom { background: #efefef; padding-top: calc(40 * (100vw / 750)); text-align: center; }

.bs-wrapper .pp .page.j a.tips { position: relative; display: inline-block; vertical-align: middle; margin: 0 0 calc(5 * (100vw / 750)) calc(5 * (100vw / 750)); }

.bs-wrapper .pp .page.j a.tips img { width: calc(25 * (100vw / 750)); display: block; }

.bs-wrapper .pp .page.j a.tips:hover .tp { visibility: visible; opacity: 1; -webkit-transform: translate(-50%, -100%); -ms-transform: translate(-50%, -100%); transform: translate(-50%, -100%); }

.bs-wrapper .pp .page.j a.tips .tp { position: absolute; left: 50%; top: -10px; -webkit-transform: translate(-50%, calc(-100% + 10px)); -ms-transform: translate(-50%, calc(-100% + 10px)); transform: translate(-50%, calc(-100% + 10px)); background-color: rgba(56, 56, 56, 0.9); padding: 15px; z-index: 30; visibility: hidden; opacity: 0; -webkit-transition: all .4s; -o-transition: all .4s; transition: all .4s; border-radius: 8px; }

.bs-wrapper .pp .page.j a.tips .tp p { font-size: 12px; color: #fff; width: calc(350 * (100vw / 750)); }

.bs-wrapper .pp .page.j a.tips .tp:before { position: absolute; left: 50%; top: calc(100% + 2px); -webkit-transform: translate(-50%, -50%) rotate(270deg); -ms-transform: translate(-50%, -50%) rotate(270deg); transform: translate(-50%, -50%) rotate(270deg); width: 0; height: 0; border-style: solid; border-width: 5px 5px 5px 0; border-color: transparent rgba(56, 56, 56, 0.9) transparent transparent; content: ""; }

.bs-wrapper .pp .page.j .last a.link { font-size: calc(24 * (100vw / 750)); }

@media (min-width: 992px) { .bs-wrapper .pp .page.j .row { position: relative; padding: calc(40 * (calc(var(--vw) / 1920))) 0; }
  .bs-wrapper .pp .page.j .row:after { position: absolute; left: 2.5%; bottom: 0; width: 100%; height: 1px; background: #afafaf; width: 95%; }
  .bs-wrapper .pp .page.j h2 { font-size: calc(56 * (calc(var(--vw) / 1920))); padding: calc(120 * (calc(100vh - var(--bh)) / 1080)) 0 calc(80 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper .pp .page.j h3 { font-size: calc(27 * (calc(var(--vw) / 1920))); padding-top: calc(20 * (calc(100vh - var(--bh)) / 1080)); padding-bottom: 0; border: none !important; text-align: center; }
  .bs-wrapper .pp .page.j h4 { font-size: calc(36 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j h5 { font-size: calc(24 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j p { font-size: calc(22 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j a.link { display: table; margin: 0 auto; font-size: calc(22 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j .r1 a.link { position: relative; left: auto; bottom: auto; -webkit-transform: none; -ms-transform: none; transform: none; }
  .bs-wrapper .pp .page.j a.tips { position: relative; margin: calc(-15 * (calc(var(--vw) / 1920))) 0 0 calc(5 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j a.tips img { width: calc(20 * (calc(var(--vw) / 1920))); display: block; }
  .bs-wrapper .pp .page.j a.tips .tp p { width: calc(350 * (calc(var(--vw) / 1920))); font-size: 15px; }
  .bs-wrapper .pp .page.j figure { margin: 0; }
  .bs-wrapper .pp .page.j figure img { width: 45%; margin: 0 auto calc(15 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper .pp .page.j figure img.androidtv { width: calc(152 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j figure img.w-50 { width: 25% !important; }
  .bs-wrapper .pp .page.j figure figcaption { font-size: calc(20 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j figure figcaption table { width: 70%; }
  .bs-wrapper .pp .page.j figure figcaption span.spacer { padding-top: calc(25 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper .pp .page.j .col-12 > table { width: 100%; margin-bottom: calc(50 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper .pp .page.j .col-12 > table > tbody > tr > td { padding: calc(30 * (calc(var(--vw) / 1920))) 0; font-size: calc(22 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j .col-12 > table > tbody > tr > td span.larger { font-size: calc(36 * (calc(var(--vw) / 1920))); }
  .bs-wrapper .pp .page.j .row > .col-12 > p { padding-top: calc(22 * (calc(100vh - var(--bh)) / 1080)); }
  .bs-wrapper .pp .page.j .bottom { background: #efefef; padding: 0; }
  .bs-wrapper .pp .page.j .last a.link { font-size: calc(22 * (calc(var(--vw) / 1920))); } }