:root {
    --main-color: #ff7600;
    --mb-fb-17: 2.2368421052632vw;
    --mb-fs-18: 2.3684210526316vw;
    --mb-fs-24: 3.1578947368421vw;
    --mb-fs-30: 3.9473684210526vw;
    --mb-fs-36: 4.7368421052632vw;
    --mb-fs-59: 7.7631578947368vw;
    --mb-fs-35: 4.6052631578947vw;
    --mb-lh-22: 2.8947368421053vw;
    --mb-lh-32: 4.2105263157895vw;
    --mb-lh-35: 4.6052631578947vw;
    --mb-lh-36: 4.7368421052632vw;
    --mb-lh-47: 6.1842105263158vw;
    --mb-lh-70: 9.2105263157895vw;
    --mb-lh-79: 10.394736842105vw;
    --mb-text-color-ff7600: #ff7600;
    --mb-text-color--000000: #000000;
    --border-5px: 0.2683843263553409vw;

}

@media (max-width: 760px) {
    :root {
        --border-5px: 0.65789473684211vw;  
    }
}

body {
    font-family: 'Noto Sans JP' !important;
}


#primary {
    overflow: hidden;
    background: #ede9e2;
}

.background-works {
    position: relative;
    background-image: url('../img/works/banner-work-01.png');
    width: 100vw;
    height: 21.82vw;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: black;
}

.title-works {
    position: absolute;
    top: 80%;
    left: -3%;
    margin-right: 64.7%;
    z-index: 3;
}

.works-content {
    background-image: var(--background-image);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
}

.works-content-all {
    background-position: top !important;
    background-size: 100% auto !important;
}

.background-content section {
    padding-top: unset;
}

.works-content {
    padding-top: 7.6041666666667vw;
    padding-bottom: 10.677083333333vw;
}

.works-content__text1 {
    background-color: #ff7600;
    font-size: 0.9375vw;
    font-weight: 600;
    color: #000;
    padding: 0.9375vw 0px;
}

a {
    text-decoration: none;
    color: #000;
}

a:hover {
    color: #ff7600;
}

.container-fluid {
    padding-left: 0px;
    padding-right: 0px;
}

.r-service {
    justify-content:center;
    align-items: center;
}

.comming-soon {
    width: 56.354166666667vw;
    height: 4.53125vw;
    margin-bottom: 28.28125vw;
    margin-top: 2vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.d-inline-table {
    display: inline-table;
}

.service .service-item-detail {
    border-radius: unset;
    transform: skew(-9deg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: -42%;
    right: 3%;
    width: 19.80133vw;
    height: 10.46875vw;
    position: absolute;
}

.service-items {
    margin-bottom: 14.0625vw;
    position: relative;
    width: 28.791667vw;
    padding-left: 0px;
    padding-right: 0px;
}

.service-items .wrapper {
    transform-origin: 0 100%;
    width: fit-content;
    border: var(--border-5px) solid #000000;
}

.service .service-item-detail .item-title {
    color: #000000;
    font-size: 0.83333333333333vw;
    /* font-weight: bold; */
    /* line-height: 1.6145833333333vw; */
    /*background: var(--main-color);*/
    text-align: left;
    padding: 0.7vw;
    border: var(--border-5px) solid #000000;
    border-bottom: unset;
    min-height: 4.026667vw;
    /* overflow: scroll; */
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;
}
.service .service-item-detail .work_copyright {
    padding-top: 1.0vw;
    font-size: 0.45vw;
    line-height: 0.5vw;
}

.service .service-item-detail .item-title::-webkit-scrollbar {
    display: none;
}

.service .service-item-detail .item-content {
    position: absolute;
    min-height: 6.25vw;
    height: 6.25vw;
    width: 100%;
    color: black;
    font-size: 0.83333333333333vw;
    font-weight: bold;
    /*background: var(--main-color);*/
    text-align: left;
    line-height: 1.4vw;
    border: var(--border-5px) solid #000000;
    display: table-cell;
    vertical-align: middle;
    /* overflow-y: scroll; */
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;
}

.service .service-item-detail .item-content::-webkit-scrollbar {
    display: none;
}

.unskew p {
    margin: 0;
    padding: 0;
}

.work_copyright p {
    margin: 0;
    padding: 0;
}

.service .service-item-detail .unskew-content {
    height: fit-content;
    text-align: left;
    width: 17.8vw;
    vertical-align: middle;
    margin: auto;
    padding-top: 0vw;
    letter-spacing: -0.4px;
}


.wrapper {
    padding: 0px;
    margin: 0px;
}

.wrapper .si-image {
    display: block;
    position: relative;
    width: 26.366666666667vw;
    height: 14.84277389vw;
    overflow: hidden;
}


.wrapper .si-image:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: var(--si-image-url);
    background-size: 100% 100%;
    background-position: center;
    transform-origin: center;
    -webkit-transition: 0.4s ease;
    transition: 0.4s ease;
}

.wrapper .si-image:hover:before {
    -webkit-transform: scale(1.08);
    transform: scale(1.08);
    filter: brightness(0.5) contrast(0.9) blur(0.09px);
}


.brand-next-work-page {
    position: relative;
    display: inline-block;
    padding: 0px 24px;
    background: #000;
    color: #fff;
    clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 0% 100%);
    font-size: 29px;
    font-weight: 600;
}

.brand__btn-next-work-page {
    position: relative;
    margin: 0 12px;
}

.brand__btn-next-work-page::before {
    position: absolute;
    content: "";
    top: -20px;
    left: -14px;
    border-style: solid;
    height: 0;
    width: 12%;
    border-color: #000 transparent transparent transparent;
    border-width: 35px 12px 0 3px;
}

.brand__btn-next-work-page::after {
    position: absolute;
    content: "";
    top: -40px;
    right: -55px;
    border-top: 45px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 45px solid transparent;
    border-left: 30px solid #000;
}

.action-works {
    padding: 50px 0px;
}

.btn-works {
    padding: 15px 0px;
    padding-bottom: 50px;
}

.btn-works .row {
    border-top: 5px solid;
    border-bottom: 5px solid;
    padding-bottom: 80px;
}

.btn-works h3 {
    font-size: 30px;
}

.brand-btn {
    position: relative;
    width: 35%;
    float: left;
}

.brand-btn::before {
    content: "";
    position: absolute;
    --dotSize: 0.08rem;
    --bgSize: 0.4rem;
    --bgPosition: calc(var(--bgSize) / 2);
    background-image: radial-gradient(circle at center, #000 var(--dotSize), transparent 0), radial-gradient(circle at center, #000 var(--dotSize), transparent 0);
    background-size: var(--bgSize) var(--bgSize);
    background-position: 0 0, var(--bgPosition) var(--bgPosition);
    top: 30%;
    left: 2%;
    width: 90%;
    height: 90%;
    border-radius: 5px;
    border: 1px solid transparent;
}

.brand-btn p {
    text-align: center;
    color: #fff;
    font-weight: 600;
}

.brand-btn-link {
    display: inline-block;
    width: 90%;
    padding: 30px 0;
    text-align: center;
    background: #000;
    border-radius: 5px;
}

.brand-btn-link>span {
    display: inline-block;
    line-height: 35px;
    color: #fff;
    font-weight: 600;
    opacity: 0.99;
    font-size: 26px
}

.btn-rhombus {
    position: absolute;
    top: 95%;
    right: 15%;
    width: 60px;
    height: 60px;
    clip-path: polygon(25% 0%, 70% 0%, 62% 23%, 100% 23%, 32% 100%, 54% 39%, 11% 39%);
    background: #000;
}

span.btn-rhombus-bg {
    position: absolute;
    top: 100%;
    right: 10%;
    width: 60px;
    height: 60px;
    clip-path: polygon(25% 0%, 70% 0%, 62% 23%, 100% 23%, 32% 100%, 54% 39%, 11% 39%);
    --dotSize: 0.08rem;
    --bgSize: 0.4rem;
    --bgPosition: calc(var(--bgSize) / 2);
    background-image: radial-gradient(circle at center, #000 var(--dotSize), transparent 0), radial-gradient(circle at center, #000 var(--dotSize), transparent 0);
    background-size: var(--bgSize) var(--bgSize);
    background-position: 0 0, var(--bgPosition) var(--bgPosition);
}

.btn-group-next {
    display: flex;
    justify-content: center;
}

.mt-100 {
    margin-top: 50px;
}

.parallelogram1 {
    clip-path: polygon(3% 0%, 100% 0%, 97% 100%, 0% 100%);
}

.c1 {
    clip-path: polygon(0% 0%, 100% 0%, 97% 100%, 0% 100%);
}

.c2 {
    clip-path: polygon(2% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.ml-100 {
    margin-left: 5.2083333333333vw;
    width: 15.989583333333vw;
    height: 5.4166666666667vw;
    /* margin-top: 2.6041666666667vw !important; */
}

/* work detail */
.work-detail-content__title {
    background-image: var(--background-image);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}

.flex {
    display: flex;
}

.work-detail__box1 {
    width: 41%;
    background-color: #FF7600;
    font-size: 0.9375vw;
    font-weight: 600;
    color: #000;
    padding: 1.5625vw 8vw 1.5625vw 5.2083333333333vw;
    clip-path: polygon(0% 0%, 100% 0%, 97% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 97% 100%, 0% 100%);
    display: flex;
    /* justify-content: center; */
    align-items: center;
}

.work-detail__box2 {
    width: 42%;
    background-color: #fff;
    font-size: 0.9375vw;
    font-weight: 600;
    color: #000;
    padding: 1.5625vw 3.6458333333333vw 1.5625vw 5.2083333333333vw;
    clip-path: polygon(3% 0%, 100% 0%, 97% 100%, 0% 100%);
    -webkit-clip-path:  polygon(3% 0%, 100% 0%, 97% 100%, 0% 100%);
    transform: translateX(-0.78125vw);
}

.work-detail__box1 span.tag {
    background: #000;
    color: #FF7600;
    padding: 1px 10px;
    margin-left: 2vw;
    height: fit-content;
}

.work-detail-video {
    width: 89.583333333333vw;
    height: 44.84375vw;
    background-color: #B2B2B2;
    margin: 5.2083333333333vw 5.2083333333333vw 2.6041666666667vw 5.2083333333333vw;
}

.work-detail-desc {
    font-size: 0.9375vw;
    margin: 2.6041666666667vw 5.2083333333333vw;
    font-style: normal;
    font-variant: normal;
    font-weight: bold;
}

.work-video-container {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    box-shadow: 0px 8px 20px rgba(black, 0.4);
}

.work-video-wrapper {
    width: 100%;
    height: 100%;
}

video {
    width: 100%;
    height: 100%;
}

.play-button-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    pointer-events: none;
}

#circle-play-b {
    cursor: pointer;
    pointer-events: auto;
}

.svg-video {
    width: 100px;
    height: 100px;
    fill: #fff;
    stroke: #fff;
    cursor: pointer;
    background-color: rgba(black, 0.2);
    border-radius: 50%;
    opacity: 0.9;
}

.menu-branding {
    position: relative;
    background: #FF7600;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    /* height: 70px; */
    display: flex;
    justify-content: left;
    align-items: center;
    list-style: none;
    margin-left: 0;
}

.menu-branding .navbar-list, .menu-member .navbar-list {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 5.2083333333333vw;
    height: 3.6458333333333vw;
    text-align: center;
}

.menu-branding .navbar-list > a, .menu-member .navbar-list > a {
    display: inline-block;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/12px var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-000000);
    text-align: left;
    font: normal normal bold 0.9375vw/0.625vw Noto Sans JP;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}

.menu-branding .navbar-link {
    text-decoration: none;
    color: #000;
    font-weight: 600;
}
.navbar-list a {
    text-decoration: none;
}

.navbar-list::after {
    position: absolute;
    background: #000;
    top: 0;
    right: 0;
    content: "";
    height: 100%;
    width: 0.46875vw;
    transform: skew(-16deg);
    z-index: 1;
}

.coming-soon {
    margin-top: 20%;
}

.work-detail-content__title {
    padding-top: 3.6458333333333vw !important;
}

.element-btn-action {
    margin-bottom: 0px;
}

.list-work {
    margin: 5.2083333333333vw;
    margin-bottom: 0px;
}


/*  pachinko    */

.pachinko {
    margin: 6.25vw 5.88541666667vw 0 5.208vw;
    background-color: #FFFFFF;
    border-radius: 10px;
    border: 5px solid #000;
    box-shadow: 10px 10px 0px -5px #fff, 10px 10px 0px 0px #000;
}

.pachinko .text-header {
    text-align: center;
    padding-top: 4.6875vw;
}
.pachinko .text-pachinko {
    font-size: 2.5vw;
    font-weight: bold;
    color: #000000;
}

.pachinko .border-gr {
    border: 2px solid #11C7B2;
    margin: 20px 20vw 20px 21vw;
}
.pachinko .sub-text {
    font-size: 1.5625vw;
    color: #11C7B2;
    font-weight: bold;
}

.pachinko .trapezoid-studio {
    text-align: center;
    margin: 4.1666666666667vw 9.7vw 4.1666666666667vw 10.67vw;
}

.pachinko .cg {
    text-align: center;
    margin: 4.1666666666667vw 15.9vw 8.3333333333333vw 15.8854166667vw;
}

.cg .brand-plan > p {
    margin-left: 0;
}

#div-img-cg p {
    margin-bottom: 20px;
}

#div-img-cg .left {
    padding-left: 0;
    padding-right: 30px;
}
#div-img-cg .right {
    padding-left: 30px;
    padding-right: 0px;
}

.trapezoid-technology {
    display: inline-block;
    width: fit-content;
    text-align: center;
    background: #000;
    border: 0.26041666666666663vw  solid #000;
    -webkit-clip-path: polygon(2% 0%, 100% 0%, 98% 100%, 0% 100%);
    clip-path: polygon(2% 0%, 100% 0%, 98% 100%, 0% 100%);
}

.trapezoid-technology > span {
    display: inline-block;
    color: #000;
    width: 25.885416666667vw;
    padding: 1.2vw 0 1.2vw;
    -webkit-clip-path: polygon(2% 0%, 100% -20%, 98% 100%, 0% 100%);
    clip-path: polygon(2% 0%, 100% -20%, 98% 100%, 0% 100%);
    background: #11C7B2;
    font-size: 1.3020833333333vw;
    font-weight: bold;
    line-height: 12px;
}

.contract-scope {
    margin: 3.125vw 0 5.2083333333333vw;
}

.brand-plan > p {
    line-height: 2.34375vw;
    text-align: left;
    font-size: 0.9375vw;
    margin-left: 5.2vw;
    font-weight: bold;
}

.brand-table {
    padding: 3.33vw 0 2.083vw;
}

.parent-contract {
    display: flex;
    flex-direction: column;
    padding: 0 1.92708333333vw 0 0;
}

.dev-results {
    padding: 0 0 0 1.92708333333vw;
}

.brand-title {
    margin: 0 0 0.3645833333333333vw 0;
    font-size: 1.0416666666667vw;
    line-height: 1.40625vw;
    font-weight: bold !important;
    text-align: center;
    padding: 10px 0;
    background: #000;
    color: #fff;
}

.row2 {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    align-content: flex-start;
}
.brand-year {
    position: relative;
}

.brand-year:not(:last-child):before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    width: 91%;
    height: 1px;
    background: #000;
    z-index: 1;
}

.trapezoid-technology.res {
    margin-top: 3px;
}

.brand-year:last-child {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.brand-year:last-child > div {
    flex-grow: 1;
    display: flex;
}

.bg-year {
    padding: 42px 0;
    text-align: center;
    background: #11C7B2;
}

.bg-year > p {
    line-height: 2.34375vw !important;
    font-size: 0.9375vw;
    font-weight: bold;
}

.bg__year-text {
    padding: 2.1875vw 0 2.1875vw 2.1875vw;
    background: #EDE9E2;
    font-weight: bold !important;
    line-height: 45px;
    text-align: left;
}

.bg__year-text > p {
    margin: 0 !important;
    font-size: 0.9375vw;
    font-weight: bold;
    line-height: 2.34375vw;
}

/*  div-video   */

.play-video {
    margin: 6.7708333333333vw 5.88541666667vw 0 5.208vw;
    background-color: #FFFFFF;
    border-radius: 10px;
    border: 5px solid #000;
    box-shadow: 10px 10px 0px -5px #fff, 10px 10px 0px 0px #000;
}

.text-svg {
    margin: 5.7291666666667vw auto 0 auto;
    text-align: center;
}

.svg {
    width: 54.01vw;
}

.text-svg > p {
    font-size: 1.6666666666666667vw;
    font-weight: 500;
    margin: 1.541667vw 0 0 0;
    line-height: 2.2395833333333335vw;
}

.video {
    position: relative;
    width: 81.25vw;
    /*height: 48.85vw;*/
    height: 48.854166666667vw;
    margin: 3.125vw 3.802vw 7.2916666666667vw 3.59375vw;
    padding-top: 2.08333333333vw;
    text-align: center;
    background-color: #11C7B2;
}

.video p {
    font-size: 2.0833333333333vw;
    font-weight: bold;
    color: #FFFFFF;
    margin-bottom: unset;
    padding-bottom: unset;
}

.iframe {
    position: relative;
    width: 66.6666666667vw;
    height: 37.5vw;
    text-align:center;
    margin: 0 auto;
}

.sp {
    display: none;
}

#div-img-cg p {
    color: #11C7B2;
    font-size: 18px;
    font-weight: bold;
}

.coming-soon-sp {
    display: none;
}

.work-detail__box1 p, .work-detail__box2 p {
    margin: 0px !important;
    padding: 0px !important;
}

.video-content-pachinko-sp {
    display: none;
}

.notHand:hover {
    cursor: context-menu;
 }

.cg-svg-pc {
    display: block;
}

.cg-svg-sp {
    display: none;
}

@media (max-width: 760px) {
     .background-works {
        background-image: url('../img/works/banner-sp-02.png') !important;
        height: 106vw;
    }
    .works-content {
        background-image: var(--mobile-background-image);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: bottom;
        padding-bottom: 17.105263157895vw;
        padding-top: 26vw;
    }

    .title-works {
        top: 112%;
    }

    .menu-branding  {
        flex-wrap: wrap;
        height: 9.2105263157895vw;
    }

    .menu-branding .navbar-list, .menu-member .navbar-list {
        height: 9.2105263157895vw;
    }

    .navbar-link {
        font-size: 3.4210526315789vw !important;
        line-height: 4.605263157894737vw;
    }

    .menu-branding .navbar-list, .menu-member .navbar-list {
        padding: 0px 10.105263vw !important;
        background: #FF7600;
        margin-bottom: 9px;
    }

    ul.menu-branding-mb li:nth-child(3) {
        margin-left: 90px;
    }

    ul.menu-branding-mb li:nth-child(3)::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        left: -100%;
        background: #FF7600;
    }

    ul.menu-branding-mb li:nth-child(3) > a::before {
        position: absolute;
        content: "";
        width: 1.1842105263158vw;
        height: 9.210526315789474vw;
        left: 0;
        top: 0px;
        background: #000;
        z-index: 999;
        transform: skew(-16deg);
    }

    ul.menu-branding-mb li:last-child {
        position: relative;
    }

    ul.menu-branding-mb li:last-child::before {
        position: absolute;
        content: "";
        width: 760px;
        height: 100%;
        left: 90%;
        background: #FF7600;
    }

    ul.menu-branding-mb li:nth-child(2)::after {
        /*        display: none !important;*/
        transform: skew(0deg);
        right: -2px;
        background: #FF7600 !important;
    }

    .navbar-list::after {
        width: 1.1842105263158vw;
    }

    .list-all-work-row {
        height: 21.052631578947vw;
    }

    .service-items {
        width: 75.263157894737vw;
        margin-bottom: 28.715789vw;
    }

    .wrapper .si-image {
        width: 66.710526315789vw;
        height: 37.55382775vw;
    }

    .service .service-item-detail {
        width: 50.028421vw;
        height: 26.447368421053vw;
    }

    .service .service-item-detail .item-title {
        color: #000000;
        font-size: 2.3684210526316vw;
        /* font-weight: bold; */
        line-height: 3.6842105263158vw;
        /*background: var(--main-color);*/
        text-align: left;
        padding: 2.6315789473684vw;
        padding-top: 1.5vw;
        border: var(--border-5px) solid #000000;
        border-bottom: unset;
    }

	.service .service-item-detail .work_copyright {
	    padding-top: 2.0vw;
	    font-size: 1.3vw;
	    line-height: 1.4vw;
	}

    .service .service-item-detail .item-content {
        position: absolute;
        min-height: 58.4%;
        height: 15.394737vw;
        width: 100%;
        color: black;
        font-size: 2.0vw;
        font-weight: bold;
        /*background: var(--main-color);*/
        text-align: left;
        line-height: 3.18947vw;
        border: var(--border-5px) solid #000000;
        display: table-cell;
        vertical-align: middle;
        /* overflow-y: scroll; */
    }

    .service .service-item-detail .unskew-content {
        height: fit-content;
        text-align: left;
        width: 44.58333vw;
        vertical-align: middle;
        margin: auto;
        padding-top: 0.5vw;
        letter-spacing: 0px;
    }

    .ml-100 {
        margin-left: 13.157894736842vw;
        width: 35.526315789474vw;
        height: 10.526315789474vw;
        margin-top: 5.604167vw !important;
    }

    .work-detail-desc {
        margin-left: 6.5789473684211vw;
        font-size: 2.3684210526316vw;
        margin-top: 6vw !important;
        margin-bottom: 6vw;
    }

    .pachinko {
        margin-left: -20px;
        padding-left: 6.5789473684211vw;
    }

    .pachinko .text-header {
        text-align: left;
    }
    .pachinko .text-pachinko {
        font-size: 4.7368421052632vw;
    }

    .pachinko .sub-text {
        font-size: 3.1578947368421vw;
    }

    .pachinko .border-gr {
        border: 2px solid #11C7B2;
        margin: 20px 20vw 20px 0vw;
    }

    .pachinko .trapezoid-studio {
        text-align: center;
        margin: 4.1666666666667vw 4.1666666666667vw 5.166667vw 1.67vw;
    }
    .trapezoid-technology {
        margin-left: -51.315789473684vw;
    }

    .trapezoid-technology > span {
        font-size: 3.2894736842105vw;
        padding-left: 0px;
        line-height: 12px;
        padding: 2.2368421052632vw 0 2.2368421052632vw;
        width: 65.394736842105vw;
    }
    .brand-plan > p {
        margin-left: -1.67vw;
        font-size: 2.3684210526316vw;
        line-height: 5.9210526315789vw;
    }

    .bg-year {
        padding: 2.1875vw 0;
    }
    
    .bg-year > p,.bg__year-text > p {
        margin-bottom: unset;
        padding-bottom: unset;
        font-size: 2.3684210526316vw !important;
        line-height: 5.9210526315789vw !important;
    }
    
    .text-svg {
        margin: 5.2631578947368vw auto 0 auto;
    }
    
    .text-svg > p {
        font-size: 3.1578947368421vw !important;
        line-height:  4.2105263157894735vw  ;
    }
    
    .video {
        margin-top: 4.7368421052632vw;
        margin-bottom: 7.8947368421053vw;
    }
     
    .pachinko .cg {
        margin-left: 0px;
        margin-right: 4.236842vw;
    }
    
    #div-img-cg {
        margin-left: 7.8947368421053vw;
    }
    
    #div-img-cg .right {
        padding-left: 0px;
        padding-right: 30px;
    }
    
    .img-cg {
        margin-bottom: 20px;
    }

    .work-detail-content__title {
        background-image: var(--mobile-background-image);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .work-detail-f {
        display: block;
    }

    .work-detail__box2 {
        width: 105%;
        padding: 3.1578947368421vw 10.631579vw 3.1578947368421vw 7.631579vw;
        margin-left: 6.5789473684211vw;
        font-size: 2.3684210526316vw;
    }
    
    .work-detail__box1 {
        width: 84%;
        padding: 3.1578947368421vw 5.631579vw 3.1578947368421vw 7.631579vw;
        font-size: 2.3684210526316vw;
    }

    .work-detail-video {
        width: 100%;
        margin-left: 0px;
        margin-right: 0px;
    }

    .demo_play_detail {
        margin-left: 6.5789473684211vw;
        width: 32.894736842105vw;
        height: 9.8684210526316vw;
        margin-top: 2vw !important;
    }

    .work-detail-content section {
        padding-top: unset;
    }
    .trapezoid-technology {
        border: 0.6578947368421052vw solid black;
    }
    .brand-title {
        font-size: 2.5vw;
        line-height: 3.421052631578948vw;
        margin-top: 5.7vw;
    } 
    .pac-v-text {
        width: 95%;
    }
    .video-content-pachinko-sp {
        display: block;
    }
    .video-content-pachinko-pc {
        display: none;
    }
    .cg-svg-pc {
        display: none;
    }
    .cg-svg-sp {
        display: block;
    }
    .cg-svg-sp svg {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .dev-results {
        padding: unset;
    }
    /* .brand-title {
        font-size: 2.5vw;
    }  */
}

@media screen and (max-width: 1024px) {
    /* .bg-year > p,.bg__year-text > p {
        line-height: 36px !important;
        font-size: 14px;
    } */

    /* .text-svg > p {
        font-size: 28px;
    } */
}
@media screen and (min-width:761px) and (max-width:768px) {
    .brand-year{
        width: 100%;
    }
    .parent-contract {
        width: 50%;
    }
}

.read-more__link {
    display: none;
    color: #4169e1 !important;
}

.readmore-link {
    text-decoration: none;
    color: #4169e1 !important;
}

.read-more__link-wrap {
    text-align: center;
}