@media screen and (min-width:1101px) {
    .banner-box .swiper-pagination {
        position:absolute;
        width:100%;
        left:0;
        bottom: 3.5%;
        display:block;
    }
    .banner-box .swiper-pagination-bullet {
        position:relative;
        border:1px solid #fff;
        background-color:transparent;
        margin:0 5px;
        opacity:1;
    }
    .banner-box .swiper-pagination-bullet::before {
        content:'';
        position:absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
        background:#D71E48;
        -webkit-border-radius:50%;
        border-radius:50%;
        -webkit-transform:scale(0.6);
        transform:scale(0.6);
        opacity:0;
    }
    .banner-box .swiper-pagination-bullet-active::before {
        opacity:1;
    }
    .banner::after {
        content:'';
        position:relative;
        display:block;
        width:100%;
        height:10.15625vw;
        background:url(../images/home/mash.png) no-repeat center top;
        background-size:100% auto;
        margin-top:-5vw;
        z-index:1;
    }
    .banner-item::before{
        padding-top:42.666%;
    }
    .banner-pic::before {
        content:'';
        position:absolute;
        right:0;
        top:0;
        width:51%;
        height:100%;
        background: linear-gradient(267.01deg, rgba(0, 0, 0, 0.6) 1.98%, rgba(0, 0, 0, 0) 90.22%);
    }
    .banner-txt {
        align-items:center;
        justify-content:flex-end;
        padding-right:4.6875%;
        text-align:right;
    }
    .txt-outer {
        width:26%;
    }
    .banner-txt h2 {
        font-size:2.08333vw;
        margin-bottom:0.9375vw;
    }
    
    
    
    .manifesto {
        background:#fff;
    }
    .section-inr__manifesto {
        padding:0.6875vw 0 4.6875vw 0;
        background: linear-gradient(180deg, #EFEFF0 0%, rgba(239, 239, 240, 0) 100%);
    }
    .brief__manifesto {
        width:50%;
        margin:0 auto 3.125vw auto;
        text-align:center;
    }
    .manifesto-box {
        width:82.8125%;
        margin:0 auto;
    }
    .brief__manifesto--core{
        width:82.8125%;
        text-align:right;
        margin: 0 auto 1vw auto;
    }


    /* 360 */
    .pic__360{
        width:82.8125%;
        margin:2vw auto 2vw auto;
        overflow: hidden;
        -webkit-border-radius: 1vw;
        border-radius: 1vw;
    }
    
    
    
    .stories {
        padding:4.6875vw 0;
        overflow:hidden;
    }
    .brief__stories {
        width:44%;
        margin:0 auto 3.125vw auto;
        text-align:center;
    }
    .stories-item {
        display:flex;
        flex-wrap:wrap;
        width:100%;
        margin-bottom:10.9375vw;
    }
    .stories-item:last-child {
        margin-bottom:0;
    }
    .stories-video {
        position:relative;
        flex:0 0 43.56%;
        max-width:43.56%;
        z-index:2;
    }
    .stories-video .video-box::before {
        padding-top:56.25%;
    }
    .stories-video .play-icon {
        top:auto;
        bottom:6.25%;
    }
    .stories-info {
        position:relative;
        flex:0 0 56.44%;
        max-width:56.44%;
    }
    .brief__stories--item {
        position:absolute;
        left:0;
        bottom:0;
        font-size:1.0416666vw;
        line-height:1.5;
        z-index:2;
    }
    .stories-thumb {
        position:relative;
        width:100%;
    }
    .stories-thumb::before {
        content:'';
        position:absolute;
        right:0;
        bottom:-7%;
        width:100%;
        height:74.87%;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
        z-index:1;
    }
    .stories-thumb img {
        width:103.6%;
    }
    
    .stories-item:nth-child(odd) {
        padding-left:8.5416666%;
        align-items:flex-end;
    }
    .stories-item:nth-child(odd) .brief__stories--item {
        padding-left:11.1111%;
        padding-right:23%;
        bottom: -13%;
    }
    .stories-item:nth-child(odd) .stories-thumb img{
        -webkit-transform:translate(-6%,6%);
        transform:translate(-6%,6%);
    }
    
    .stories-item:nth-child(even) {
        padding-right:8.5416666%;
        flex-direction:row-reverse;
        align-items:flex-end;
    }
    .stories-item:nth-child(even) .stories-thumb::before {
        transform:translateX(9%);
    }
    .stories-item:nth-child(even) .stories-thumb img {
        -webkit-transform:translate(4%,3%);
        transform:translate(4%,3%);
    }
    .stories-item:nth-child(even)  .brief__stories--item {
        padding-left:16.565%;
        padding-right:16.565%;
        bottom:20%;
    }
    
    .famous {
        background:#F7F7F7;
        padding:5vw 0;
    }
    .famous-box {
        position:relative;
        width:80%;
        margin:0 auto;
    }
    .famous-slider {
        width:100%;
    }
    .famous-box .swiper-slide .famous-item {
        transform:scale(0.4);
    }
    .famous-item {
        width:100%;
        -webkit-transition:transform 0.5s linear;
        transition:transform 0.5s linear;
    }
    .famous-pic {
        position:relative;
        width:100%;
        line-height:0;
    }
    .famous-pic img {
        width:100%;
        height:auto;
    }
    .famous-pic::before {
        content:'';
        position:absolute;
        left:0;
        bottom:0;
        width:100%;
        height:66.12%;
        background: linear-gradient(180deg, rgba(246, 246, 246, 0) 0%, #F6F6F6 100%);
    }
    .famous-txt {
        position:absolute;
        width:100%;
        height:auto;
        left:0;
        bottom:5%;
        text-align:center;
        padding:0 1.5%;
        opacity:0;
        -webkit-transition:opacity 0.5s linear;
        transition:opacity 0.5s linear;
    }
    .brief__famous {
        font-size:1.0416666vw;
        line-height:1.7;
    }
    .famous-box .swiper-slide.swiper-slide-active .famous-item  {
        transform:scale(1);
    }
    .famous-box .swiper-slide.swiper-slide-active .famous-txt{
        opacity:1;
    }
    .famous-box .swiper-button-next, 
    .famous-box .swiper-button-prev {
        top:5vw;
        width:5.26vw;
        height:2.96875vw;
        -webkit-transform:none;
        transform:none;
        margin:0;
    }
    .famous-box .swiper-button-next {
        background:url(../images/next-red.svg) no-repeat center center;
        background-size:100% auto;
        right:20%;
    }
    .famous-box .swiper-button-prev {
        background:url(../images/prev-red.svg) no-repeat center center;
        background-size:100% auto;
        left:20%;
    }
    
    .top3 {
        padding:8.9375vw 0 5.10416666vw 0;
        background:url(../images/home/top3-bg.png) no-repeat center 4vw;
        background-size:100% auto;
    }
    .top3::before {
        content:'';
        position:absolute;
        left:0;
        bottom:0;
        width:100%;
        height:90%;
        background: linear-gradient(0deg, #EFEFF0 0%, rgba(239, 239, 240, 0) 100%);
    }
    .top3 > div  {
        position:relative;
        z-index:1;
    }
    .brief__top3 {
        width:60%;
        margin:0 auto 3.125vw auto;
        text-align:center;
    }
    .top3-box {
        width:81.8125%;
        display:block;
        margin:0 auto 2.6vw auto;
    }
    .top3-slider {
        width:100%;
    }
    .top3-box .swiper-slide {
        flex:0 0 28%;
        max-width:28%;
        margin:0 8% 0 0;
        width:auto !important;
    }
    .top3-box .swiper-slide:last-child {
        margin:0;
    }

    .reward__brief {
        width:40%;
        margin:0 auto 1.041666vw auto;
    }
    .reward-pic {
        width:40%;
        margin:0 auto 4.1666vw auto;
    }
    
}

@media screen and (max-width:1100px) {
    .banner-box .swiper-pagination {
        position:absolute;
        width:100%;
        left:0;
        bottom:5%;
        display:block;
    }
    .banner-box .swiper-pagination-bullet {
        position:relative;
        border:1px solid #fff;
        background-color:transparent;
        margin:0 5px;
        opacity:1;
    }
    .banner-box .swiper-pagination-bullet::before {
        content:'';
        position:absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
        background:#D71E48;
        -webkit-border-radius:50%;
        border-radius:50%;
        -webkit-transform:scale(0.6);
        transform:scale(0.6);
        opacity:0;
    }
    .banner-box .swiper-pagination-bullet-active::before {
        opacity:1;
    }
    .banner::after {
        content:'';
        position:relative;
        display:block;
        width:100%;
        height:10.6666vw;
        background:url(../images/home/mash-sp.png) no-repeat center top;
        background-size:100% auto;
        margin-top:-5vw;
        z-index:1;
    }
    .banner-item::before{
        padding-top:96%;
    }
    .banner-pic::before {
        content:'';
        position:absolute;
        left:0;
        bottom:0;
        width:100%;
        height:66.6666%;
        background: linear-gradient(351.69deg, rgba(0, 0, 0, 0.6) 6.14%, rgba(0, 0, 0, 0) 84.84%);
    }
    .banner-txt {
        align-items:flex-end;
        justify-content:center;
        text-align:left;
    }
    .txt-outer {
        width:88%;
        padding-bottom:18.3333%;
    }
    .banner-txt h2 {
        font-size:15px;
        margin-bottom:5px;
    }
    .banner-txt .brief {
        font-size:13px;
    }
    .banner-txt p {
        margin-bottom:0;
    }
    
    .manifesto {
        background:#fff;
    }
    .section-inr__manifesto {
        padding:34px 0;
        background: linear-gradient(180deg, #EFEFF0 0%, rgba(239, 239, 240, 0) 100%);
    }
    
    .brief__manifesto {
        width:90%;
        margin:0 auto 20px auto;
        text-align:center;
    }
    .manifesto-box {
        width:90%;
        margin:0 auto;
    }
    .brief__manifesto--core{
        width:90%;
        text-align:right;
        margin: 0 auto 2vw auto;
    }

    /* 360 */
    .pic__360{
        width:90%;
        margin:2vw auto 4vw auto;
        overflow: hidden;
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }
    
    
    .stories {
        padding:36px 0 10px 0;
        overflow:hidden;
    }
    .brief__stories {
        width:90%;
        margin:0 auto 30px auto;
        text-align:center;
    }
    
    .stories-item {
        width:90%;
        display:flex;
        flex-wrap:wrap;
        flex-direction:column-reverse;
        align-items:flex-start;
        margin:0 auto 60px auto;
    }
    .stories-video, 
    .stories-info {
        display:block;
        width:100%;
    }
    .stories-thumb {
        position:relative;
        width:100%;
        height:auto;
    }
    .stories-video {
        z-index:2;
    }
    .stories-video .video-box::before {
        padding-top:56.25%;
    }
    .stories-video .play-icon {
        top:auto;
        bottom:6.25%;
    }
    .stories-thumb::before {
        content:'';
        position:absolute;
        right:0;
        bottom:0;
        width:100%;
        height:76%;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
        z-index:1;
    }
    .brief__stories--item {
        position:relative;
        z-index:2;
        margin-top:-20%;
        margin-bottom:40px;
    }

    .famous {
        background:#F7F7F7;
        padding:45px 0;
    }
    .famous-box {
        position:relative;
        width:80%;
        margin:0 auto;
        padding-bottom:64px;
    }
    .famous-slider {
        width:100%;
    }
    .famous-pic {
        position: relative;
        width:100%;
        height:auto;
        line-height:0;
    }
    .famous-pic img {
        width:100%;
        height:auto;
    }
    .famous-pic::before {
        content:'';
        position:absolute;
        left:0;
        bottom:0;
        width:100%;
        height:66%;
        background: linear-gradient(180deg, rgba(246, 246, 246, 0) 0%, #F6F6F6 100%);
    }
    .famous-txt {
        position: relative;
        width:96%;
        margin:-11% auto 0 auto;
        text-align:center;
        z-index:2;
    }
    
    .famous-box .swiper-button-next, 
    .famous-box .swiper-button-prev,
    .top3-box .swiper-button-next, 
    .top3-box .swiper-button-prev {
        top:auto;
        bottom:0;
        width:55px;
        height:30px;
        -webkit-transform:none;
        transform:none;
        margin:0;
    }
    .famous-box .swiper-button-next,
    .top3-box .swiper-button-next {
        background:url(../images/next-red.svg) no-repeat center center;
        background-size:100% auto;
        right:0;
    }
    .famous-box .swiper-button-prev,
    .top3-box .swiper-button-prev {
        background:url(../images/prev-red.svg) no-repeat center center;
        background-size:100% auto;
        left:0;
    }
    
   
    .top3 {
        padding:130px 0 54px 0;
        background:url(../images/home/top3-bg-sp.png) no-repeat center 80px;
        background-size:100% auto;
    }
    .brief__top3 {
        text-align:center;
        width:90%;
        margin:0 auto 36px auto;
    }
    .top3-box {
        position:relative;
        width:85.3333%;
        margin:0 auto 30px auto;
        padding-bottom:64px;
    }
    .top3-slider {
        width:100%;
    }
    .top3-box .card-arrow{
        display: none;
    }

}

@media screen and (max-width:390px) {

    .banner-txt h2 {
        font-size:14px;
    }
    .banner-txt .brief {
        font-size:12px;
    }

}