
.content {
    margin: 0 auto;
}

.content-box {
    background: black;
    color: white;
}

.line-through {
    position: relative;
    font-style: normal;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
}

.line-through::after {
    content: '';
    display: inline-block;
    height: 0.31vw;
    width: 100%;
    background: #38ffa3;
    margin-left: -100%;
    margin-top: 0.1vw;
}

.content__title {
    font-size: 3.13vw;
    font-family: Montserrat-Black;
}

.content--1 {
    width: 56.67vw;
    padding-top: 5.94vw;
}

.content--1 .content__detail {
    font-size: 1.56vw;
    line-height: 1.98vw;
    margin-top: 4.17vw;
    font-family: Montserrat-Medium;
    font-weight: 500;
}

.content--2 {
    width: 71.04vw;
    margin-top: 13.09vw;
}

.bubble-list {
    margin-top: 4.17vw;
    height: 48.44vw;
}

.bubble-box+.bubble-box {
    margin-left: -3.02vw;
}

.bubble {
    width: 25.42vw;
    height: 25.42vw;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    transition: all 1.5s ease;
}

.bubble+.bubble {
    margin-top: -100%;
    z-index: 0;
}

.bubble--show .bubble+.bubble {
    margin-top: -2.4vw;
}

.bubble--black {
    background: #e2e2e2;
    color: black;
}

.bubble--gray {
    background: #aaaaaa;
    color: black;
}

.bubble--green {
    background: #38ffa3;
    color: black;
}

.bubble__title,
.bubble__content {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.bubble__title {
    text-align: center;
    font-family: Montserrat-Black;
    font-size: 2.4vw;
    width: 16.96vw;
}

.bubble__content {
    font-size: 0.94vw;
    font-family: Montserrat-Medium;
    width: 19.32vw;
    text-align: center;
    line-height: 1.3vw;
}

.content--3 {
    width: 84.58vw;
    height: 70.1vw;
    margin-top: 13.65vw;
    position: relative;
}

.content--3 .content__title span{
    display: block;
}

.content--3 .content__detail {
    width: 29.48vw;
    margin-top: 2.34vw;
    font-size: 1.56vw;
    font-family: Montserrat-SemiBold;
    font-weight: 600;
}

.balloon-box {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.balloon {
    border-radius: 50%;
    background: white;
    color: black;
    font-weight: bold;
    transition: none;
    cursor: pointer;
    position: absolute;
}

.balloon p {
    font-size: inherit;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-family: Montserrat-Bold;
}

.balloon:nth-of-type(1) {
    width: 12.76vw;
    height: 12.76vw;
    font-size: 1.93vw;
    top: 0.36vw;
    left: 37.34vw;
    text-align: center;
}

.balloon:nth-of-type(2) {
    width: 21.82vw;
    height: 21.82vw;
    font-size: 2.34vw;
    left: 13.75vw;
    top: 2.97vw;
    text-align: center;
}

.balloon:nth-of-type(3) {
    width: 15.63vw;
    height: 15.63vw;
    font-size: 1.93vw;
    left: 30.21vw;
    top: 17.5vw;
    text-align: center;
}

.balloon:nth-of-type(4) {
    width: 15.63vw;
    height: 15.63vw;
    font-size: 1.93vw;
    left: 0;
    top: 26.04vw;
    text-align: center;
}

.balloon:nth-of-type(5) {
    width: 21.82vw;
    height: 21.82vw;
    font-size: 2.92vw;
    left: 52.81vw;
    top: 24.53vw;
}

.balloon:nth-of-type(6) {
    width: 21.82vw;
    height: 21.82vw;
    font-size: 2.97vw;
    left: 14.27vw;
    top: 29.27vw;
}

.balloon:nth-of-type(7) {
    width: 15.63vw;
    height: 15.63vw;
    font-size: 1.93vw;
    left: 33.75vw;
    top: 41.35vw;
    text-align: center;
}

.balloon:nth-of-type(8) {
    width: 11.88vw;
    height: 11.88vw;
    font-size: 1.93vw;
    left: 14.27vw;
    top: 56.15vw;
}

.balloon--green {
    background: #38FFA3;
}

.balloon--gray {
    background: #AAAAAA;
}

.balloon--white {
    background: #ffffff;
}

@keyframes float-ani {
    0% {
        margin-top: -2.08vw;
    }

    50% {
        margin-top: 2.08vw;
    }

    100% {
        margin-top: -2.08vw;
    }
}

.content--4 {
    margin-top: 6.04vw;
    width: 87.08vw;
    padding-bottom: 15.63vw;
    padding-left: 22vw;
    box-sizing: border-box;
}

.content--4 .content__title {
    align-self: flex-start;
}

.logo-box {
    margin-top: 10.21vw;
}

.logo-box .logo {
    width: 10.71vw;
    height: 6.56vw;
    /* border: 0.05vw solid black; */
    margin-right: 4.3vw;
}

.logo-box .logo img {
  object-fit: contain;
}

.logo-box .logo::before {
    content: 'logo';
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.56vw;
    font-family: Montserrat-SemiBold;
    color: rgba(0, 0, 0, .5);
}

.logo--hide{
    height: 0 !important;
    opacity: 0;
}