
        @media screen and (min-width: 700px) {
            body > .content_wrapper{top: 122px!important;}
            img{max-width: 100%;}
            .bs-c-container{
                color: #fff;
            }
            .bs-c-wrapper{
                width: 80%;
                max-width: 1040px;
                margin-left: auto;
                margin-right: auto;
            }
            .bs-c-container p{
                font-size: 1.2em;
                color: #cdcdcd;
                line-height: 1.8;
            }
            #bs-c-block-introduction {
                font-size: 1.8em;
                text-align: center;
                max-width: 860px;
                margin: auto;
            }
            
            .bs-c-btn-line-ani{
                position: relative;
                padding-bottom: 2px;
                display: inline-block;
            }
            .bs-c-btn-line-ani::after{
                content: "";
                display: block;
                position: absolute;
                left: 0;
                bottom: 0;
                width: 100%;
                height: 2px;
                background-color: #fff;
                transition: width 300ms;
            }
            .bs-c-btn-line-ani:hover::after{
                width: 10px;
            }
            .bs-c-container .bs-c-block-video{
                position: relative;
            }
            .bs-c-container .bs-c-block-video video{
                display: block;
                height: calc(100vh - 120px);
                background: #000;
            }
            .bs-c-container .bs-c-block-video .bs-c-poster{
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
                z-index: 10;
                background-size: cover;
                background: #000;
                overflow: hidden;
            }
            .bs-c-poster-img{
                width: 100%;
                height: 100%;
                display: block;
            }
            .bs-c-poster-img img{
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            .bs-c-container .bs-c-block-video .bs-c-title-box{
                position: absolute;
                left: 50%;
                top: 50%;
                max-width: 50%;
                z-index: 10;
                transform: translate(-50%, -50%);
                text-align: center;
            }
            .bs-c-container .bs-c-block-video .bs-c-title-box h2{
                font-size: 4em;
            }
            .bs-c-container .bs-c-block-video .bs-c-title-box b{
                font-size: 2em;
                font-weight: normal;
                /* padding-bottom: 1px;
                border-bottom: 2px #fff solid; */
                cursor: pointer;
                margin-top: 2em;
                display: inline-block;
            }
            .bs-c-player-btn{
                position: absolute;
                width: 2vw;
                height: 2vw;
                right: 7vw;
                bottom: 2vw;
                background: url(../image/player.png) no-repeat;
                background-size: contain;
                cursor: pointer;
            }

            .bs-c-container .bs-c-block-introduction {
                background-color: #212121;
                padding: 4em 0;
            }
            .bs-c-tabs-title{
                text-align: center;
                font-size: 3em;
                padding: 1em 0;
            }
            .bs-c-tabs-hd {
                background-color: #212121;
                text-align: center;
                border-bottom: 1px #fff solid;
            }
            .bs-c-tabs-hd>ol {
                display: block;
                position: relative;
                width: 80%;
                max-width: 1040px;
                margin: auto;
            }
            .bs-c-tabs-hd>ol li{
                display: inline-block;
                width: 32%;
                vertical-align: top;
                font-size: 1.8em;
                padding: 1em 0;
                color: #989898;
                font-weight: bold;
                letter-spacing: 0.1em;
                cursor: pointer;
                transition: color 300ms;
            }
            .bs-c-tabs-hd>ol li.active{
                color: #fff;
                cursor: default;
            }
            .bs-c-tabs-hd-line{
                position: absolute;
                left: 0;
                bottom: 0;
                width: 33.333%;
                height: 4px;
                transition: transform 300ms;
            }
            .bs-c-tabs-hd-line--0{
                transform: translate3d(0%,0,0);
            }
            .bs-c-tabs-hd-line--1{
                transform: translate3d(100%,0,0);
            }
            .bs-c-tabs-hd-line--2{
                transform: translate3d(200%,0,0);
            }
            .bs-c-tabs-hd-line::before{
                content: "";
                display: block;
                width: 75%;
                height: 100%;
                margin: auto;
                background-color: #fff;
            }
            .bs-c-tabs-bd{
                position: relative;
                padding-bottom: 120px;
                border-bottom: 1px #555 solid;
                background-color: #212121;
            }
            .bs-c-tab-panel{
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
                background-color: #212121;
                overflow: hidden;
                visibility: hidden;
                pointer-events: none;
            }
            .bs-c-tab-panel.active{
                position: relative;
                width: 100%;
                height: 100%;
                z-index: 10;
                visibility: visible;
                pointer-events:initial;
            }
            .bs-c-swiper-box{
                padding: 1em 18% 0em 12%; 
                overflow: hidden;
                background-color: #000;
            }
            .bs-c-swiper{
                overflow: visible;
            }
            .bs-c-swiper .swiper-slide{
                position: relative;
                overflow: hidden;
            }
            .bs-c-swiper-content{
                position: absolute;
                max-width: 280px;
                height: 90%;
                right: -100%;
                top: 0;
                z-index: 5;
                padding: 5rem 40px 40px;
                box-sizing: border-box;
                background-color: #212121;
                transition: right 1s;
            }
            .bs-c-swiper .swiper-slide:hover .bs-c-swiper-content{
                right: 0;
            }
            .bs-c-swiper-content h3{
                font-size: 22px;
                margin-bottom: 1em;
            }
            .bs-c-swiper-content .bs-c-swiper-btn-buy{
                position: absolute;
                left: 40px;
                bottom: 40px;
                color: #fff;
                font-size: 1.2em;
            }
            .bs-c-swiper .swiper-button-prev{
                width: 4em;
                height: 4em;
                left: 0;
                background-color: #494949;
                margin-left: -2em;
            }
            .bs-c-swiper .swiper-button-next{
                width: 4em;
                height: 4em;
                right: 0;
                background-color: #494949;
                margin-right: -2em;
            }
            .bs-c-swiper .swiper-button-prev::after,
            .bs-c-swiper .swiper-button-next::after{
                font-size: 1.5em;
                color: #fff;
            }
            .bs-c-swiper .swiper-button-prev:hover,
            .bs-c-swiper .swiper-button-next:hover{
                transition: transform 300ms;
                transform: scale(0.9);
            }
            .bs-c-swiper .swiper-pagination{
                display: none;
            }

            .bs-c-color-block{
                overflow-y: hidden;
                overflow-x: auto;
                margin-top: 5em;
            }
            .bs-c-color-title{
                font-size: 1.8em;
                padding: 1em 0;
            }
            .bs-c-color-title a{
                color: #fff;
            }
            .bs-c-color-block ul{
                display: flex;
                flex-wrap: wrap;
            }
            .bs-c-color-block ul li{
                margin: 0 5px 2em 0;
                width: 13.6%;
            }
            .bs-c-color-block ul li img{
                width: 100%;
            }
            .bs-c-color-block ul li p{
                padding: 0.5em 0.5em 0 0;
            }
        }
    
        
        @media screen and (max-width: 700px) {
            img{max-width: 100%;}
            .bs-c-container *{
                color: #fff;
            }
            .bs-c-container p{
                font-size: 1.0em;
                color: #cdcdcd;
                line-height: 1.8;
                text-align: center;
            }
            
            .bs-c-btn-line-ani{
                position: relative;
                padding-bottom: 2px;
                display: inline-block;
            }
            .bs-c-btn-line-ani::after{
                content: "";
                display: block;
                position: absolute;
                left: 0;
                bottom: 0;
                width: 100%;
                height: 2px;
                background-color: #fff;
                transition: width 300ms;
            }
            .bs-c-btn-line-ani:hover::after{
                width: 10px;
            }
            .bs-c-container .bs-c-block-video{
                position: relative;
                height: 123vw;
                display: flex;
                align-items: center;
                background-color: #000;
            }
            .bs-c-container .bs-c-block-video video{
                display: block;
            }
            .bs-c-container .bs-c-block-video .bs-c-poster{
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
                z-index: 10;
                background-size: cover;
            }
            .bs-c-container .bs-c-block-video .bs-c-poster{
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
                z-index: 10;
                background-size: cover;
                background: #000;
                overflow: hidden;
            }
            .bs-c-poster-img{
                width: 100%;
                height: 100%;
                display: block;
            }
            .bs-c-poster-img img{
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: 80% 0;
            }
            .bs-c-container .bs-c-block-video .bs-c-title-box{
                position: absolute;
                left: 50%;
                top: 50%;
                max-width: 80%;
                z-index: 10;
                transform: translate(-50%, -50%);
                text-align: center;
            }
            .bs-c-container .bs-c-block-video .bs-c-title-box h2{
                font-size: 1.5em;
                color: #fff;
            }
            .bs-c-container .bs-c-block-video .bs-c-title-box b{
                font-size: 1.2em;
                color: #fff;
                font-weight: normal;
                /* padding-bottom: 1px;
                border-bottom: 2px #fff solid; */
                cursor: pointer;
                margin-top: 1em;
                display: inline-block;
            }

            .bs-c-container .bs-c-block-introduction {
                background-color: #212121;
                padding: 80px 40px;
            }
            .bs-c-tabs {
                background-color: #212121;
            }
            .bs-c-tabs-hd {
                background-color: #212121;
                text-align: center;
                border-bottom: 1px #fff solid;
                overflow-x: auto;
                width: 100%;
            }
            .bs-c-tabs-title {
                text-align: center;
                padding: 1em;
                font-size: 1.6em;
            }
            .bs-c-tabs-hd::-ms-overflow-style {
                display: none;
            }
            .bs-c-tabs-hd::-webkit-scrollbar {
                display: none;
            }
            .bs-c-tabs-hd>ol {
                display: inline-block;
                position: relative;
                white-space:nowrap;
            }
            .bs-c-tabs-hd>ol li{
                display: inline-block;
                font-size: 1.0em;
                padding: 1em 1em;
                color: #989898;
                font-weight: bold;
                letter-spacing: 0.1em;
                cursor: pointer;
                transition: color 300ms;
            }
            .bs-c-tabs-hd>ol li.active{
                color: #fff;
                cursor: default;
            }
            .bs-c-tabs-hd-line{
                position: absolute;
                left: 0;
                bottom: 0;
                width: 33.333%;
                height: 4px;
                transition: transform 300ms;
            }
            .bs-c-tabs-hd-line--0{
                transform: translate3d(0%,0,0);
            }
            .bs-c-tabs-hd-line--1{
                transform: translate3d(100%,0,0);
            }
            .bs-c-tabs-hd-line--2{
                transform: translate3d(200%,0,0);
            }
            .bs-c-tabs-hd-line::before{
                content: "";
                display: block;
                width: 75%;
                height: 100%;
                margin: auto;
                background-color: #fff;
            }
            .bs-c-tabs-bd{
                position: relative;
                padding-bottom: 120px;
                border-bottom: 1px #555 solid;
                background-color: #212121;
                margin-top: 3em;
            }
            .bs-c-tab-panel{
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
                background-color: #212121;
                overflow: hidden;
                visibility: hidden;
                pointer-events: none;
            }
            .bs-c-tab-panel.active{
                position: relative;
                width: 100%;
                height: 100%;
                z-index: 10;
                visibility: visible;
                pointer-events:initial;
            }
            .bs-c-swiper-box{
                overflow: hidden;
                background-color: #000;
                padding-bottom: 100vw;
            }
            .bs-c-swiper{
                overflow: visible;
            }
            .bs-c-swiper .swiper-slide{
                position: relative;
                height: 123vw;
            }
            .bs-c-swiper .swiper-slide > img{
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            .bs-c-swiper-content{
                position: absolute;
                width: 100%;
                /* height: 100%; */
                top: 100%;
                padding: 110px 40px 0px 40px;
                height: 100vw;
                background-color: #212121;
            }
            .bs-c-swiper-content p{
                text-align: left;
                color: #fff;
            }
            .bs-c-swiper-content h3{
                font-size: 22px;
                margin-bottom: 1em;
            }
            .bs-c-swiper-content .bs-c-swiper-btn-buy{
                color: #fff;
                font-size: 1.2em;
                margin-top: 1em;
                display: inline-block;
            }
            .bs-c-swiper .swiper-button-prev{
                width: 4em;
                height: 80px;
                right: 5em;
                left: auto;
                top: 100%;
                background-color: transparent;
                margin:auto;
            }
            .bs-c-swiper .swiper-button-next{
                width: 4em;
                height: 80px;
                right: 0;
                top: 100%;
                background-color: transparent;
                margin:auto;
            }
            .bs-c-swiper .swiper-button-prev::after,
            .bs-c-swiper .swiper-button-next::after{
                font-size: 1.5em;
                color: #fff;
            }
            .bs-c-swiper .swiper-button-prev:hover,
            .bs-c-swiper .swiper-button-next:hover{
                transition: transform 300ms;
                transform: scale(0.9);
            }
            .bs-c-swiper .swiper-pagination{
                position: absolute;
                left: 40px;
                top: 100%;
                font-size: 2em;
                color: #fff;
                width: auto;
                height: 80px;
                display: flex;
                align-items: center;
            }
            .bs-c-swiper .swiper-pagination::after{
                content: attr(title);
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet{
                display: none;
                width: auto;
                height: auto;
                background: none;
                font-weight: normal;
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet::after{
                content: " /";
                opacity: 0.6;
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet-active{
                display: inline-block;
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(1)::before{
                content: "1";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(2):before{
                content: "2";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(3):before{
                content: "3";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(4):before{
                content: "4";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(5):before{
                content: "5";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(6):before{
                content: "6";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(7):before{
                content: "7";
            }
            .bs-c-swiper .swiper-pagination .swiper-pagination-bullet:nth-child(8):before{
                content: "8";
            }

            .bs-c-color-title{
                font-size: 1.2em;
                padding: 1em 40px;
            }
            .bs-c-color-block ul{
                overflow-y: hidden;
                overflow-x: scroll;
                display: flex;
                flex-wrap: nowrap;
            }
            .bs-c-color-block ul::-webkit-scrollbar{
                width: 5px;
                height: 5px;
                border-radius: 5px;
            }
            .bs-c-color-block ul::-webkit-scrollbar-thumb {
                background-color: rgba(255, 255, 255, 0.3);
                background-clip: padding-box;
                border-radius: 5px;
                min-height: 5px;
            }
              
            .bs-c-color-block ul::-webkit-scrollbar-thumb:hover {
                background-color: rgba(255, 255,255, 0.3);
                border-radius: 5px;
            }
            .bs-c-color-block ul li{
                margin: 0 5px 2em 0;
                min-width: 40vw;
            }
            .bs-c-color-block ul li img{
                width: 100%;
            }
            .bs-c-color-block ul li p{
                padding: 0.5em 0.5em 0 0;
            }
        }
        