@media (max-width:425px) {
    .container {
        width: 100%;
        padding: 0 15px;
    }
    video {
        width: 100%;
    }
}
@media (min-width:380px) and (max-width:425px) {
    .container {
        width: 100%;
    }
}
@media (max-width:380px) {
    .container {
        width: 100%;
    }
    .video-bg img {
        left: 0px;
    }
    .slider-box {
        margin: 0px;
    }
    .gallry-design-data {
        margin-top: 15px;
    }
    .first-data-class {
        margin-top: 0px;
    }
    .data-desc {
        justify-content: end;
        padding: 5px;
    }
    .story-date {
        margin-bottom: 5px;
    }
    .story-desc {
        margin-top: 5px;
    }
    .clint-review-box {
        margin: 0 5px;
        padding: 10px
    }
    .mark-data {
        display: none !important;
    }
    .clint-review-box {
        margin: 0px;
    }
    .packages-title {
        font-size: 22px;
    }
    .button-design {
        padding: 5px 0;
    }
    .packages-ul {
        margin-top: 10px;
    }
    .packages-li {
        font-size: 16px;
        line-height: 34px;
    }
    .package-list {
        font-size: 24px;
        line-height: 30px;
    }
    .blog-data {
        padding: 10px;
    }
    .blog-name {
        font-size: 18px;
        line-height: 24px;
        margin-top: 5px;
    }
    .blog-date {
        display: none;
    }
    .popup-box {
        padding: 10px;
    }
    .blog-title {
        font-size: 18px;
        line-height: 26px;
        margin-top: 10px;
    }
    .like p {
        display: none;
    }
    .conment-like {
        gap: 10px;
    }
    .blog-descri {
        font-size: 14px;
        font-weight: normal;
        line-height: normal;
    }
    .second-title {
        font-size: 18px;
        line-height: 22px;
        margin-top: 10px;
    }
    .contact-time-list {
        width: 100%;
    }
    .contact-content p {
        margin-top: 10px;
    }
    .slider-data::after {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 85%;
        display: block;
        z-index: 1;
        content: "";
        transition: opacity .65s cubic-bezier(.05, .2, .1, 1);
        cursor: pointer;
        background: linear-gradient(to bottom, transparent, #000000e8 100%);
        opacity: 1;
        transform: translateY(0px);
        visibility: visible;
    }
    .content a {
        opacity: 1;
        visibility: visible;
        transform: translateY(0px);
    }
    .data-first {
        font-size: 20px;
        line-height: 28px;
        text-align: center;
    }
    .title-font {
        line-height: 30px;
    }
    .groom-name {
        font-size: 20px;
        font-weight: 600;
        line-height: 20px;
        text-align: center;
        color: #141414;
        margin-top: 5px;
    }
    .first-title {
        font-size: 18px;
    }
    .detail {
        font-weight: normal;
        margin-top: 5px;
    }
    .data-radio {
        gap: 10px;
    }
    .form-rsvp {
        margin-top: 15px;
    }
    .image-detail-person {
        max-width: 120px;
    }
    .border-data {
        left: 5px;
        top: 5px;
        width: 110px;
        height: 110px;
    }
    .data-inquirey {
        margin-top: 20px;
    }
    .first-data {
        margin-top: 20px;
    }
    .blog-title-ander {
        font-size: 18px;
        line-height: 26px;
    }
    .fancy {
        padding: 6px 0;
    }
}
@media (min-width:280px) and (max-width:320px) {
    .container {
        width: 100%;
    }
}