/* Tomb Raider 3D style widget only. Do not include the full main.31ddd4.css on the article page, because it contains global/basic-screen rules. */

.three-d-style.overlay-gradient-portal .rich-edge-gradient {
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 2
}

.default-tooltip-src {
    display: none
}

.default-tooltip-overlay-shown {
    overflow: hidden;
    padding-right: var(--scrollbar-width)
}

.default-tooltip {
    font-family: Roboto Condensed,Arial Narrow,Arial,sans-serif
}

.default-tooltip:lang(zh-cn),.default-tooltip:lang(zh-sg) {
    font-family: Noto Sans SC,sans-serif
}

.default-tooltip:lang(zh-tw) {
    font-family: Noto Sans TC,Meiryo,?? ??,Malgun Gothic,??,Gulim,Helvetica,sans-serif
}

.default-tooltip:lang(ko) {
    font-family: Noto Sans KR,sans-serif
}

.default-tooltip:lang(ja) {
    font-family: Noto Sans JP,sans-serif
}

.default-tooltip {
    background: #393836;
    border: 1px solid hsla(0,0%,88%,.15);
    border-radius: 4px;
    color: #f9f5e1;
    font-size: 14px;
    line-height: 1.3;
    max-width: 240px;
    min-width: 75px;
    opacity: 0;
    padding: 15px 20px;
    position: absolute;
    text-align: left;
    top: 0;
    -webkit-transition: opacity .2s ease,visibility .2s ease;
    transition: opacity .2s ease,visibility .2s ease;
    visibility: hidden;
    z-index: 3085
}

.default-tooltip__active {
    opacity: 1;
    visibility: visible
}

.default-tooltip__overlay {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    backdrop-filter: blur(8px);
    background: rgba(0,0,0,.8);
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 16px;
    justify-content: center;
    left: 0;
    max-width: unset;
    overflow: hidden;
    padding: 24px;
    position: fixed;
    right: 0;
    top: 0
}

.default-tooltip_content {
    height: 100%;
    width: 100%
}

.default-tooltip__overlay .default-tooltip_content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    max-width: 600px;
    text-align: center
}

.default-tooltip_img {
    aspect-ratio: 4/3;
    display: none;
    max-width: 100%;
    position: relative
}

.default-tooltip_img:not(:last-child) {
    margin-bottom: .8em
}

.default-tooltip_img__align-center {
    margin-left: auto;
    margin-right: auto
}

.default-tooltip_img__show-in-tooltip {
    display: block;
    width: 200px
}

.default-tooltip_img__show-in-tooltip-100 {
    width: 100px
}

.default-tooltip_img__show-in-tooltip-150 {
    width: 150px
}

.default-tooltip_img__show-in-tooltip-200 {
    width: 200px
}

.default-tooltip_img__show-in-tooltip-250 {
    width: 250px
}

.default-tooltip_img__show-in-tooltip-300 {
    width: 300px
}

.default-tooltip_img__show-in-tooltip-350 {
    width: 350px
}

.default-tooltip_img__show-in-tooltip-400 {
    width: 400px
}

.default-tooltip_img__show-in-tooltip-450 {
    width: 450px
}

.default-tooltip_img__show-in-tooltip-500 {
    width: 500px
}

.default-tooltip__overlay .default-tooltip_img__show-in-tooltip {
    display: none
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay {
    display: block;
    width: 300px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-200 {
    width: 200px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-250 {
    width: 250px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-300 {
    width: 300px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-350 {
    width: 350px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-400 {
    width: 400px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-450 {
    width: 450px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-500 {
    width: 500px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-550 {
    width: 550px
}

.default-tooltip__overlay .default-tooltip_img__show-in-overlay-600 {
    width: 600px
}

.default-tooltip_title {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.1
}

.default-tooltip_title:not(:last-child) {
    margin-bottom: .6em
}

.default-tooltip_title__align-center {
    text-align: center
}

.default-tooltip_text:not(:last-child) {
    margin-bottom: .7em
}

.default-tooltip_list:not(:last-child) {
    margin-bottom: .7em
}

[dir=ltr] .default-tooltip_list-item {
    text-align: left
}

[dir=rtl] .default-tooltip_list-item {
    text-align: right
}

.default-tooltip_list-item {
    line-height: 1.3;
    padding: 0 0 .4em .9em;
    position: relative
}

.default-tooltip_list-item:last-child {
    padding: 0 0 0 .9em
}

.default-tooltip_list-item:after {
    background: #b8b8a2;
    border-radius: 50%;
    content: "";
    height: .2em;
    left: .14em;
    position: absolute;
    top: .57em;
    width: .2em
}

.default-tooltip_list__no-bullet .default-tooltip_list-item:after {
    display: none
}

.default-tooltip_close {
    background-color: #454540;
    border-radius: 4px;
    display: none;
    font-size: 0;
    height: 32px;
    line-height: 0;
    position: absolute;
    right: 24px;
    top: 24px;
    -webkit-transition: background-color .15s ease-out;
    transition: background-color .15s ease-out;
    width: 32px
}

.default-tooltip__overlay .default-tooltip_close {
    display: block
}

.default-tooltip_close:hover {
    background-color: #333335;
    cursor: pointer
}

.default-tooltip_close:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTQuNTM2IDUuOTUuMjkzIDEwLjE5M2ExIDEgMCAwIDAgMS40MTQgMS40MTRMNS45NSA3LjM2NGw0LjI0MyA0LjI0M2ExIDEgMCAwIDAgMS40MTQtMS40MTRMNy4zNjQgNS45NWw0LjI0My00LjI0M0ExIDEgMCAwIDAgMTAuMTkzLjI5M0w1Ljk1IDQuNTM2IDEuNzA3LjI5M0ExIDEgMCAwIDAgLjI5MyAxLjcwN0w0LjUzNiA1Ljk1eiIgZmlsbD0iI0I4QjM5NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: auto 16px;
    bottom: 0;
    content: "";
    height: 16px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 16px
}

.three-d-style-slider {
    position: relative
}

.three-d-style-slider__outside-arrows .three-d-style-slider_wrapper {
    margin: 0
}

.three-d-style-slider_item {
    position: absolute;
    -webkit-transition: transform .8s ease-in-out,opacity .8s ease-in-out,visibility .8s ease-in-out;
    -webkit-transition: opacity .8s ease-in-out,visibility .8s ease-in-out,-webkit-transform .8s ease-in-out;
    transition: opacity .8s ease-in-out,visibility .8s ease-in-out,-webkit-transform .8s ease-in-out;
    transition: transform .8s ease-in-out,opacity .8s ease-in-out,visibility .8s ease-in-out;
    transition: transform .8s ease-in-out,opacity .8s ease-in-out,visibility .8s ease-in-out,-webkit-transform .8s ease-in-out;
    width: 100%;
    will-change: transform;
    z-index: 1
}

.three-d-style-slider__outside-arrows .three-d-style-slider_item {
    width: 100%
}

.three-d-style-slider_item__outside-left {
    opacity: 0;
    -webkit-transform: translateX(90%);
    -ms-transform: translateX(90%);
    transform: translateX(90%);
    visibility: hidden;
    z-index: 1
}

.three-d-style-slider_item__outside-right {
    opacity: 0;
    -webkit-transform: translateX(-90%);
    -ms-transform: translateX(-90%);
    transform: translateX(-90%);
    visibility: hidden;
    z-index: 1
}

.three-d-style-slider-arrows {
    bottom: 41px;
    position: absolute;
    width: 100%
}

.three-d-style-slider__outside-arrows .three-d-style-slider-arrows {
    bottom: auto;
    padding-top: 23%;
    top: 0
}

.three-d-style-slider-arrows_item {
    background: rgba(0,0,0,0) no-repeat 50%;
    cursor: pointer;
    height: 32px;
    opacity: .7;
    position: absolute;
    -webkit-transition: background-color .15s ease-out,opacity .15s ease-out;
    transition: background-color .15s ease-out,opacity .15s ease-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 24px;
    z-index: 2
}

@media(any-pointer: fine) {
    .three-d-style-slider-arrows_item:hover {
            opacity:1
        }
}

.three-d-style-slider__outside-arrows .three-d-style-slider-arrows_item {
    height: 32px;
    width: 32px
}

@media(min-width: 720px) {
    .three-d-style-slider__outside-arrows .three-d-style-slider-arrows_item {
            backdrop-filter:blur(2.5px);
            background-color: rgba(40,40,40,.7);
            border: 1px solid hsla(0,0%,100%,.1);
            border-radius: 4px
        }
}

.three-d-style-slider-arrows_item__hidden {
    opacity: 0;
    pointer-events: none
}

.three-d-style-slider-arrows_item__left {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='10' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4.064 7.998 5.753-5.665a.6.6 0 0 0 0-.862L8.504.178a.627.627 0 0 0-.876 0L.183 7.508a.6.6 0 0 0-.18.49.6.6 0 0 0 .18.49l7.445 7.33a.627.627 0 0 0 .876 0l1.313-1.294a.6.6 0 0 0 0-.862L4.064 7.998Z' fill='%23F9F5E1' fill-rule='evenodd'/%3E%3C/svg%3E");
    left: 1px
}

.three-d-style-slider-arrows_item__right {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='10' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.936 7.998.183 2.333a.6.6 0 0 1 0-.862L1.496.178a.627.627 0 0 1 .876 0l7.445 7.33a.6.6 0 0 1 .18.49.6.6 0 0 1-.18.49l-7.445 7.33a.627.627 0 0 1-.876 0L.183 14.523a.6.6 0 0 1 0-.862l5.753-5.664Z' fill='%23F9F5E1' fill-rule='evenodd'/%3E%3C/svg%3E");
    right: 1px
}

.three-d-style-slider-nav {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    backdrop-filter: blur(2.5px);
    background-color: rgba(40,40,40,.7);
    border: 1px solid hsla(0,0%,100%,.1);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    margin: 16px auto 0;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    padding: 16px;
    text-align: center
}

@media(min-width: 720px) {
    .three-d-style-slider-nav {
            grid-gap:14px;
            gap: 14px;
            margin-top: 24px
        }
}

.three-d-style-slider-nav_progress {
    display: none;
    font-family: Roboto Condensed,Arial Narrow,Arial,sans-serif
}

.three-d-style-slider-nav_progress:lang(zh-cn),.three-d-style-slider-nav_progress:lang(zh-sg) {
    font-family: Noto Sans SC,sans-serif
}

.three-d-style-slider-nav_progress:lang(zh-tw) {
    font-family: Noto Sans TC,Meiryo,?? ??,Malgun Gothic,??,Gulim,Helvetica,sans-serif
}

.three-d-style-slider-nav_progress:lang(ko) {
    font-family: Noto Sans KR,sans-serif
}

.three-d-style-slider-nav_progress:lang(ja) {
    font-family: Noto Sans JP,sans-serif
}

.three-d-style-slider-nav_progress {
    background: hsla(0,0%,100%,.35);
    border-radius: 4px;
    color: #1c1b16;
    font-size: 16px;
    font-weight: 700;
    margin: 0 auto;
    padding: 2px 8px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 2
}

@media(max-width: 720px) {
    .three-d-style-slider[data-nav-progress-mob=true] .three-d-style-slider-nav_progress {
            display:table
        }
}

@media(min-width: 720px) {
    .three-d-style-slider[data-nav-progress-pc=true] .three-d-style-slider-nav_progress {
            display:table
        }
}

.three-d-style-slider-nav_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 15px;
    overflow: hidden
}

.three-d-style-slider__outside-arrows .three-d-style-slider-nav_inner {
    margin: 0
}

.three-d-style-slider-nav_inner__left-overlay:not(.three-d-style-slider-nav_inner__right-overlay) {
    mask-image: -webkit-gradient(linear,right top,left top,color-stop(70%,#000),to(transparent));
    mask-image: linear-gradient(270deg,#000 70%,transparent);
    -webkit-mask-image: -webkit-gradient(linear,right top,left top,color-stop(70%,#000),to(transparent));
    -webkit-mask-image: linear-gradient(270deg,#000 70%,transparent)
}

.three-d-style-slider-nav_inner__right-overlay:not(.three-d-style-slider-nav_inner__left-overlay) {
    mask-image: -webkit-gradient(linear,left top,right top,color-stop(70%,#000),to(transparent));
    mask-image: linear-gradient(90deg,#000 70%,transparent);
    -webkit-mask-image: -webkit-gradient(linear,left top,right top,color-stop(70%,#000),to(transparent));
    -webkit-mask-image: linear-gradient(90deg,#000 70%,transparent)
}

.three-d-style-slider-nav_inner__right-overlay.three-d-style-slider-nav_inner__left-overlay {
    mask-image: -webkit-gradient(linear,left top,right top,from(transparent),color-stop(30%,#000),color-stop(70%,#000),to(transparent));
    mask-image: linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent);
    -webkit-mask-image: -webkit-gradient(linear,left top,right top,from(transparent),color-stop(30%,#000),color-stop(70%,#000),to(transparent));
    -webkit-mask-image: linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent)
}

.three-d-style-slider-nav_inner .iScrollHorizontalScrollbar {
    display: none
}

.three-d-style-slider-nav_item {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    background-color: #f9f5e1;
    border-radius: 50%;
    color: #000;
    cursor: pointer;
    height: 18px;
    min-width: 18px;
    opacity: .5;
    position: relative;
    text-align: center;
    -webkit-transition: opacity .15s ease-out;
    transition: opacity .15s ease-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 18px
}

.three-d-style-slider-nav_item:hover:not(.three-d-style-slider-nav_item__active) {
    opacity: .7
}

.three-d-style-slider-nav_item__active {
    cursor: default;
    opacity: 1
}

.three-d-style-slider-nav_item-wrapper {
    grid-gap: 8px;
    counter-reset: item;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px
}

@media(min-width: 720px) {
    .three-d-style-slider-nav_item-wrapper {
            grid-gap:14px;
            gap: 14px
        }
}

@-webkit-keyframes sonar-3d-style {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(184,217,238,.9);
        box-shadow: 0 0 0 0 rgba(184,217,238,.9);
        height: 100%;
        width: 100%
    }

    to {
        -webkit-box-shadow: 0 0 0 20px rgba(184,217,238,0);
        box-shadow: 0 0 0 20px rgba(184,217,238,0);
        height: 100%;
        width: 100%
    }
}

@keyframes sonar-3d-style {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(184,217,238,.9);
        box-shadow: 0 0 0 0 rgba(184,217,238,.9);
        height: 100%;
        width: 100%
    }

    to {
        -webkit-box-shadow: 0 0 0 20px rgba(184,217,238,0);
        box-shadow: 0 0 0 20px rgba(184,217,238,0);
        height: 100%;
        width: 100%
    }
}

.style-background {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 0
}

.style-background_outer-container {
    border: 0 solid #57f900;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 50%;
    position: absolute;
    top: 0;
    width: 100%
}

.style-background_img {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.style-background_img__art {
    display: none
}

.style-background__art-background .style-background_img__art {
    display: block;
    min-width: 100vw;
    width: 200vw
}

.user-generated .style-background__art-background .style-background_img__art {
    max-width: unset
}

@media(min-width: 1400px) {
    .style-background__art-background .style-background_img__art {
            width:150vw
        }
}

@media(min-width: 1920px) {
    .style-background__art-background .style-background_img__art {
            width:125vw
        }
}

@media(min-width: 2200px) {
    .style-background__art-background .style-background_img__art {
            width:100vw
        }
}

.style-background_img__ground {
    width: 100%
}

.style-background__art-background .style-background_img__ground {
    display: none
}

.style-background__mask-10 .style-background_img {
    -webkit-mask-image: -webkit-gradient(linear,right top,left top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,right top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left bottom,left top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(90%,#000),to(rgba(0,0,0,0)));
    -webkit-mask-image: linear-gradient(270deg,#000 90%,rgba(0,0,0,0)),linear-gradient(90deg,#000 90%,rgba(0,0,0,0)),linear-gradient(0deg,#000 90%,rgba(0,0,0,0)),linear-gradient(180deg,#000 90%,rgba(0,0,0,0));
    mask-image: -webkit-gradient(linear,right top,left top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,right top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left bottom,left top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(90%,#000),to(rgba(0,0,0,0)));
    mask-image: linear-gradient(270deg,#000 90%,rgba(0,0,0,0)),linear-gradient(90deg,#000 90%,rgba(0,0,0,0)),linear-gradient(0deg,#000 90%,rgba(0,0,0,0)),linear-gradient(180deg,#000 90%,rgba(0,0,0,0))
}

.style-background__mask-10 .style-background_img,.style-background__mask-20 .style-background_img {
    -webkit-mask-composite: source-in,xor;
    mask-composite: intersect;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

.style-background__mask-20 .style-background_img {
    -webkit-mask-image: -webkit-gradient(linear,right top,left top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,right top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left bottom,left top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(80%,#000),to(rgba(0,0,0,0)));
    -webkit-mask-image: linear-gradient(270deg,#000 80%,rgba(0,0,0,0)),linear-gradient(90deg,#000 80%,rgba(0,0,0,0)),linear-gradient(0deg,#000 80%,rgba(0,0,0,0)),linear-gradient(180deg,#000 80%,rgba(0,0,0,0));
    mask-image: -webkit-gradient(linear,right top,left top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,right top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left bottom,left top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(80%,#000),to(rgba(0,0,0,0)));
    mask-image: linear-gradient(270deg,#000 80%,rgba(0,0,0,0)),linear-gradient(90deg,#000 80%,rgba(0,0,0,0)),linear-gradient(0deg,#000 80%,rgba(0,0,0,0)),linear-gradient(180deg,#000 80%,rgba(0,0,0,0))
}

.style-background__mask-top-bottom-10 .style-background_img {
    -webkit-mask-composite: source-in,xor;
    mask-composite: intersect;
    -webkit-mask-image: -webkit-gradient(linear,left bottom,left top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(90%,#000),to(rgba(0,0,0,0)));
    -webkit-mask-image: linear-gradient(0deg,#000 90%,rgba(0,0,0,0)),linear-gradient(180deg,#000 90%,rgba(0,0,0,0));
    mask-image: -webkit-gradient(linear,left bottom,left top,color-stop(90%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(90%,#000),to(rgba(0,0,0,0)));
    mask-image: linear-gradient(0deg,#000 90%,rgba(0,0,0,0)),linear-gradient(180deg,#000 90%,rgba(0,0,0,0));
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

.style-background__mask-top-bottom-20 .style-background_img {
    -webkit-mask-composite: source-in,xor;
    mask-composite: intersect;
    -webkit-mask-image: -webkit-gradient(linear,left bottom,left top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(80%,#000),to(rgba(0,0,0,0)));
    -webkit-mask-image: linear-gradient(0deg,#000 80%,rgba(0,0,0,0)),linear-gradient(180deg,#000 80%,rgba(0,0,0,0));
    mask-image: -webkit-gradient(linear,left bottom,left top,color-stop(80%,#000),to(rgba(0,0,0,0))),-webkit-gradient(linear,left top,left bottom,color-stop(80%,#000),to(rgba(0,0,0,0)));
    mask-image: linear-gradient(0deg,#000 80%,rgba(0,0,0,0)),linear-gradient(180deg,#000 80%,rgba(0,0,0,0));
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

.three-d-style {
    border: 0 solid #fff;
    font-family: Roboto Condensed,Arial Narrow,Arial,sans-serif
}

.three-d-style:lang(zh-cn),.three-d-style:lang(zh-sg) {
    font-family: Noto Sans SC,sans-serif
}

.three-d-style:lang(zh-tw) {
    font-family: Noto Sans TC,Meiryo,?? ??,Malgun Gothic,??,Gulim,Helvetica,sans-serif
}

.three-d-style:lang(ko) {
    font-family: Noto Sans KR,sans-serif
}

.three-d-style:lang(ja) {
    font-family: Noto Sans JP,sans-serif
}

.three-d-style {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    padding: 42px 0;
    position: relative;
    text-align: center
}

.release-wrapper .three-d-style {
    background-position: 50%;
    background-size: cover;
    padding: 42px 20px
}

@media(min-width: 520px) {
    .release-wrapper .three-d-style {
            padding:42px 60px
        }
}

@media(min-width: 720px) {
    .release-wrapper .three-d-style {
            padding:52px 60px
        }
}

@media(min-width: 1100px) {
    .release-wrapper .three-d-style {
            padding:11vh 60px
        }
}

.three-d-style_inner {
    border: 0 solid red;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
    max-width: 1440px;
    position: relative;
    width: 100%
}

.user-generated .three-d-style_title {
    border: 0 solid #fff;
    margin: 0 auto 1em;
    max-width: 910px;
    position: relative;
    z-index: 2
}

.user-generated .three-d-style_title__no-margin-top:not(:first-child) {
    margin-top: 0
}

.user-generated .three-d-style_title__no-margin-bottom {
    margin-bottom: 0
}

.three-d-style_text {
    border: 0 solid #fff;
    margin: 0 auto 20px;
    max-width: 910px;
    position: relative;
    z-index: 2
}

.three-d-style_button-holder {
    padding-top: 25px;
    position: relative;
    z-index: 2
}

.three-d-style_style-background {
    border: 0 solid orange;
    position: relative;
    width: 100%
}

.three-d-style_slider {
    position: relative;
    z-index: 2
}

.three-d-style_vehicle {
    border: 0 solid #f0f;
    position: relative
}

.three-d-style_pin {
    position: absolute
}

.three-d-style .three-d-style_description-text,.three-d-style .three-d-style_description-title {
    color: #f9f5e1;
    margin: 0 auto;
    max-width: 910px
}

.three-d-style .three-d-style_description-text:not(:last-child),.three-d-style .three-d-style_description-title:not(:last-child) {
    margin-bottom: 16px
}

.three-d-style_description-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center
}

@media(min-width: 1100px) {
    .three-d-style_description-title {
            font-size:24px
        }
}

.three-d-style_description-text {
    font-family: Roboto,Arial Narrow,Arial,sans-serif
}

.three-d-style_description-text:lang(zh-cn),.three-d-style_description-text:lang(zh-sg) {
    font-family: Noto Sans SC,sans-serif
}

.three-d-style_description-text:lang(zh-tw) {
    font-family: Noto Sans TC,Meiryo,?? ??,Malgun Gothic,??,Gulim,Helvetica,sans-serif
}

.three-d-style_description-text:lang(ko) {
    font-family: Noto Sans KR,sans-serif
}

.three-d-style_description-text:lang(ja) {
    font-family: Noto Sans JP,sans-serif
}

.three-d-style_description-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5
}

.three-d-style_ico {
    background: #b8d9ee;
    border-radius: 100%;
    cursor: pointer;
    height: 14px;
    position: relative;
    width: 14px
}

@media(min-width: 720px) {
    .three-d-style_ico {
            height:14px;
            width: 14px
        }
}

@media(min-width: 800px) {
    .three-d-style_ico {
            cursor:default
        }
}

@media(min-width: 1100px) {
    .three-d-style_ico {
            height:20px;
            width: 20px
        }
}

.three-d-style_ico:after {
    background: rgba(184,217,238,.5);
    border-radius: 100%;
    content: "";
    height: 22px;
    left: -4px;
    position: absolute;
    top: -4px;
    width: 22px
}

@media(min-width: 720px) {
    .three-d-style_ico:after {
            height:22px;
            left: -4px;
            top: -4px;
            width: 22px
        }
}

@media(min-width: 1100px) {
    .three-d-style_ico:after {
            height:32px;
            left: -6px;
            top: -6px;
            width: 32px
        }
}

.three-d-style_pin__shadow .three-d-style_ico:before {
    -webkit-animation: sonar-3d-style 1.3s ease-out infinite;
    animation: sonar-3d-style 1.3s ease-out infinite;
    border-radius: 100%;
    content: "";
    left: 0;
    position: absolute
}

.three-d-style_higlight {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.three-d-style_h-img {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: opacity .2s ease,visibility .2s ease;
    transition: opacity .2s ease,visibility .2s ease;
    visibility: hidden
}

.three-d-style_h-img__active {
    opacity: 1;
    visibility: visible
}