.threesixty {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
  }
  .threesixty .threesixty_images {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .threesixty .threesixty_images img {
    position: absolute;
    top: 0;
    width: 100%;
    height: auto;
  }
  .threesixty .threesixty_images img.previous-image {
    visibility: hidden;
    width: 0;
  }
  .threesixty .threesixty_images img.current-image {
    visibility: visible;
    width: 100%;
  }
  .threesixty .spinner {
    width: 60px;
    display: block;
    margin: 0 auto;
    height: 30px;
    background: #333;
    background: rgba(0, 0, 0, 0.7);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
  }
  .threesixty .spinner span {
    font-size: 12px;
    font-weight: bolder;
    color: #fff;
    text-align: center;
    line-height: 30px;
    display: block;
  }
  .threesixty .nav_bar {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 11;
  }
  .threesixty .nav_bar a {
    display: block;
    width: 32px;
    height: 32px;
    float: left;
    background: url(/assets/sprites.png) no-repeat;
    text-indent: -99999px;
  }
  .threesixty .nav_bar a.nav_bar_play {
    background-position: 0 0 !important;
  }
  .threesixty .nav_bar a.nav_bar_previous {
    background-position: 0 -73px !important;
  }
  .threesixty .nav_bar a.nav_bar_stop {
    background-position: 0 -37px !important;
  }
  .threesixty .nav_bar a.nav_bar_next {
    background-position: 0 -104px !important;
  }
  /* html */
  .threesixty:-webkit-full-screen {
    background: #ffffff;
    width: 100%;
    height: 100%;
    margin-top: 0;
    padding-top: 200px;
  }
  .threesixty:-moz-full-screen {
    background: #ffffff;
    width: 100%;
    height: 100%;
    margin-top: 0;
    padding-top: 200px;
  }
  
.car_threesixty-name {
    color: white;
}

.car_threesixty-nav__name {
    color: white;
}


#CarThreeSixtyM {
    width: 100vw;
    height: 50vw;
}
.car_threesixty {
    position: relative;
    width: 100vw;
    height: 50vw;
    overflow: hidden;
    user-select: none;
}
.car_threesixty-bg {
    width: 100vw;
    height: 100vh;
    pointer-events: none;
}
.car_threesixty-bg__box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.car_threesixty-bg__img {
    transform: translateZ(0);
    opacity: 0;
}
.car_threesixty-krpano, .car_threesixty-pano {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.car_threesixty-krpano .car_threesixty-nav__item.active .car_threesixty-nav__name, .car_threesixty-pano .car_threesixty-nav__item.active .car_threesixty-nav__name {
    opacity: 1;
}
.car_threesixty-nav__img {
    width: 100%;
}
.car_threesixty-nav__img img {
    width: 100%;
}
.car_threesixty-krpano, .car_threesixty-threeSixty {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s;
}
.car_threesixty-krpano.active, .car_threesixty-threeSixty.active {
    opacity: 1;
    pointer-events: auto;
}
.car_threesixty-threeSixty {
    pointer-events: none;
}
.car_threesixty-threeSixty.active .car_threesixty-car.active {
    pointer-events: auto;
}
.car_threesixty-car {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 89.896vw;
    height: 42.448vw;
    margin-left: -44.948vw;
    margin-top: -21.198vw;
    pointer-events: none;
}
.car_threesixty-car.active .threesixty_images {
    opacity: 1;
}
.car_threesixty-car .spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.car_threesixty-car .threesixty, .car_threesixty-car .threesixty_images, .car_threesixty-car .threesixty_load {
    width: 100%;
    height: 100%;
}
.car_threesixty-car .threesixty {
    position: relative;
}
.car_threesixty-car .threesixty_images, .car_threesixty-car .threesixty_load {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}
.car_threesixty-car .threesixty_load img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    pointer-events: none;
}
.car_threesixty-car.active .threesixty_load {
    opacity: 0;
    pointer-events: none;
}
.car_threesixty-car .threesixty .threesixty_images li {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    pointer-events: none;
    width: 100%;
    height: 100%;
}
.car_threesixty-car .threesixty .threesixty_images img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    pointer-events: none;
}
.car_threesixty-car .threesixty .spinner {
    width: 1.563vw;
    height: 1.563vw;
    border-radius: 0;
    background: none;
}
.car_threesixty-car .threesixty .spinner::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-color: #ffffff4d;
    border-top-color: #fff;
    width: 100%;
    height: 100%;
    border-width: 3px;
    border-style: solid;
    border-radius: 50%;
    animation: rotation 1s ease-in-out infinite;
    will-change: transform;
}
.car_threesixty .car_threesixty-load {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 89.896vw;
    height: 42.448vw;
    margin-left: -44.948vw;
    margin-top: -21.198vw;
}
.car_threesixty .car_threesixty-load.active {
    pointer-events: none;
}
.car_threesixty .car_threesixty-load.active .car_threesixty-load__show {
    visibility: hidden;
}
.car_threesixty .car_threesixty-load img {
    visibility: hidden;
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    pointer-events: none;
    object-fit: fill;
}
.car_threesixty .car_threesixty-load .car_threesixty-load__show {
    visibility: visible;
}
.car_threesixty .car_threesixty-load__spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.563vw;
    height: 1.563vw;
    border-radius: 0;
    background: none;
}
.car_threesixty .car_threesixty-load__spinner::after {
    content:"";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-color: #ffffff4d;
    border-top-color: #fff;
    width: 100%;
    height: 100%;
    border-width: 3px;
    border-style: solid;
    border-radius: 50%;
    animation: rotation 1s ease-in-out infinite;
    will-change: transform;
}
.car_threesixty-anime {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 89.896vw;
    height: 42.448vw;
    margin-left: -44.948vw;
    margin-top: -21.198vw;
    pointer-events: none;
}
.car_threesixty-anime__box {
    position: absolute;
    bottom: 4.479vw;
    left: 50%;
    width: 20.208vw;
    height: 1.198vw;
    margin-left: -10.104vw;
    background: url(../images/icon/icon_360.png) no-repeat;
    background-size: 202.083vw 3.594vw;
}
.car_threesixty-anime__box.active {
    animation: loadAnimation 1s steps(1) forwards;
}
.car_threesixty-anime__progress {
    position: absolute;
    bottom: 4.479vw;
    left: 0;
    width: 100%;
    height: 1.198vw;
    /* margin-left: -10.104vw; */
    color: rgba(255,255,255,0.5);
    font-size: 1.146vw;
    line-height: 1.25vw;
    text-align: center;
    font-family: trim;
}
.car_threesixty-icon {
    display: none;
    position: absolute;
    bottom: 8.542vw;
    left: 50%;
    width: 20.052vw;
    height: 1.25vw;
    margin-left: -10.104vw;
}
.car_threesixty-name {
    position: absolute;
    top: 6.25vw;
    left: 0;
    width: 100%;
    font-size: 2.083vw;
    line-height: 2.604vw;
    letter-spacing: 0.417vw;
    text-indent: 0.417vw;
    text-align: center;
    pointer-events: none;
}
.car_threesixty-nav {
    position: absolute;
    top: 50%;
    right: 7.188vw;
    transform: translateY(-50%);
}
.car_threesixty-nav__item {
    position: relative;
    width: 2.083vw;
    height: 5vw;
    cursor: pointer;
}
.car_threesixty-nav__item.active::after {
    /* content: "";
    position: absolute;
    top: 0;
    left: -0.052vw;
    z-index: 1;
    width: calc(102%);
    height: 100%;
    border: 1px solid #fff; */
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 95%;
    height: 95%;
    border: 1px solid #fff;
}
.car_threesixty-nav__item:hover .car_threesixty-nav__name {
    opacity: 1;
}
.car_threesixty-nav__img {
    width: 100%;
    height: 100%;
}
.car_threesixty-nav__name {
    position: absolute;
    top: 0;
    right: 3.385vw;
    width: 5.208vw;
    font-size: 1.25vw;
    line-height: 5vw;
    text-align: right;
    opacity: 0;
    transition: opacity 0.5s;
}
.car_threesixty-tab {
    flex: 1;
    width: 23.958vw;
    height: calc(50rpx);
    background: rgba(0,0,0,0.1);
    /* font-family: qihei; */
    font-size: 0.938vw;
    line-height: calc(50rpx);
    text-align: center;
    cursor: pointer;
    color: white;
}
.car_threesixty-tabs {
    position: absolute;
    bottom: 3.542vw;
    left: 50%;
    display: flex;
    width: 23.958vw;
    border: 1px solid #fff;
    margin-left: -11.979vw;
}
.car_threesixty-tab.active {
    color: #000;
    background: rgba(255,255,255,0.9);
}
.car_threesixty-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.563vw;
    height: 1.563vw;
    border-radius: 0;
    background: none;
}
.car_threesixty-spinner::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-color: #ffffff4d;
    border-top-color: #fff;
    width: 100%;
    height: 100%;
    border-width: 3px;
    border-style: solid;
    border-radius: 50%;
    animation: rotation 1s ease-in-out infinite;
    will-change: transform;
}
.car_threesixty-select {
    position: absolute;
    bottom: 3.42vw;
    left: 70%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 10.833vw;
    height: 2.708vw;
    margin-left: calc(278rpx);
    background: rgba(0,0,0,0.4);
    /* padding-top: 0.729vw; */
    font-size: 1.042vw;
    line-height: 1.25vw;
    color: white;
}
.car_threesixty-select.hide {
    opacity: 0;
    pointer-events: none;
}
.car_threesixty-select__window {
    position: relative;
    display: inline-flex;
    padding: 0 1.563vw;
    cursor: pointer;
}
.car_threesixty-select__window::before {
    content: "";
    position: absolute;
    top: 0.313vw;
    right: 0.104vw;
    width: 0.885vw;
    height: 0.833vw;
    background: url(../images/icon/icon_xq_zk.png) no-repeat center/100%;
    transform-origin: 50% 50%;
    transform: rotate(-180deg);
    transition: transform 0.5s;
}
.car_threesixty-select__window.active::before {
    transform: rotate(-90deg);
}
.car_threesixty-select__label {
    /* font-family: qihei; */
    letter-spacing: 0.052vw;
}
.car_threesixty-select__open {
    --optionTotal: 1;
    position: absolute;
    bottom: 2.604vw;
    left: 50%;
    width: 10.833vw;
    height: 0;
    max-height: 10.417vw;
    margin-left: -5.417vw;
    background: rgba(0,0,0,0.5);
    overflow-x: hidden;
    overflow-y: hidden;
}
.car_threesixty-select__open.active {
    transition: height 0.3s;
    height: calc(var(--optionTotal) * 50rpx);
}
.car_threesixty-select__open__lyriq {
    width: 15.625vw;
    margin-left: -7.813vw;
}
.car_threesixty-select__option {
    position: relative;
    height: 2.604vw;
    font-size: 1.042vw;
    line-height: 2.604vw;
    letter-spacing: 0.052vw;
    text-indent: 0.052vw;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
}
.car_threesixty-select__option:last-of-type::after {
    display: none;
}
.car_threesixty-select__option.active, .car_threesixty-select__option:hover {
    background: rgba(255,255,255,0.1);
}
.car_threesixty-select__lyriq {
    width: 15.625vw;
}
@-webkit-keyframes loadAnimation {
    0% {
        background-position: 0vw 0vw;
   }
    3.57% {
        background-position: -20.208vw 0vw;
   }
    7.14% {
        background-position: -40.417vw 0vw;
   }
    10.71% {
        background-position: -60.625vw 0vw;
   }
    14.29% {
        background-position: -80.833vw 0vw;
   }
    17.86% {
        background-position: -101.042vw 0vw;
   }
    21.43% {
        background-position: -121.25vw 0vw;
   }
    25% {
        background-position: -141.458vw 0vw;
   }
    28.57% {
        background-position: -161.667vw 0vw;
   }
    32.14% {
        background-position: -181.875vw 0vw;
   }
    35.71% {
        background-position: 0vw -1.198vw;
   }
    39.29% {
        background-position: -20.208vw -1.198vw;
   }
    42.86% {
        background-position: -40.417vw -1.198vw;
   }
    46.43% {
        background-position: -60.625vw -1.198vw;
   }
    50% {
        background-position: -80.833vw -1.198vw;
   }
    53.57% {
        background-position: -101.042vw -1.198vw;
   }
    57.14% {
        background-position: -121.25vw -1.198vw;
   }
    60.71% {
        background-position: -141.458vw -1.198vw;
   }
    64.29% {
        background-position: -161.667vw -1.198vw;
   }
    67.86% {
        background-position: -181.875vw -1.198vw;
   }
    71.43% {
        background-position: 0vw -2.396vw;
   }
    75% {
        background-position: -20.208vw -2.396vw;
   }
    78.57% {
        background-position: -40.417vw -2.396vw;
   }
    82.14% {
        background-position: -60.625vw -2.396vw;
   }
    85.71% {
        background-position: -80.833vw -2.396vw;
   }
    89.29% {
        background-position: -101.042vw -2.396vw;
   }
    92.86% {
        background-position: -121.25vw -2.396vw;
   }
    96.43% {
        background-position: -141.458vw -2.396vw;
   }
    100% {
        background-position: -161.667vw -2.396vw;
   }
}
@keyframes loadAnimation {
    0% {
        background-position: 0vw 0vw;
   }
    3.57% {
        background-position: -20.208vw 0vw;
   }
    7.14% {
        background-position: -40.417vw 0vw;
   }
    10.71% {
        background-position: -60.625vw 0vw;
   }
    14.29% {
        background-position: -80.833vw 0vw;
   }
    17.86% {
        background-position: -101.042vw 0vw;
   }
    21.43% {
        background-position: -121.25vw 0vw;
   }
    25% {
        background-position: -141.458vw 0vw;
   }
    28.57% {
        background-position: -161.667vw 0vw;
   }
    32.14% {
        background-position: -181.875vw 0vw;
   }
    35.71% {
        background-position: 0vw -1.198vw;
   }
    39.29% {
        background-position: -20.208vw -1.198vw;
   }
    42.86% {
        background-position: -40.417vw -1.198vw;
   }
    46.43% {
        background-position: -60.625vw -1.198vw;
   }
    50% {
        background-position: -80.833vw -1.198vw;
   }
    53.57% {
        background-position: -101.042vw -1.198vw;
   }
    57.14% {
        background-position: -121.25vw -1.198vw;
   }
    60.71% {
        background-position: -141.458vw -1.198vw;
   }
    64.29% {
        background-position: -161.667vw -1.198vw;
   }
    67.86% {
        background-position: -181.875vw -1.198vw;
   }
    71.43% {
        background-position: 0vw -2.396vw;
   }
    75% {
        background-position: -20.208vw -2.396vw;
   }
    78.57% {
        background-position: -40.417vw -2.396vw;
   }
    82.14% {
        background-position: -60.625vw -2.396vw;
   }
    85.71% {
        background-position: -80.833vw -2.396vw;
   }
    89.29% {
        background-position: -101.042vw -2.396vw;
   }
    92.86% {
        background-position: -121.25vw -2.396vw;
   }
    96.43% {
        background-position: -141.458vw -2.396vw;
   }
    100% {
        background-position: -161.667vw -2.396vw;
   }
}