@media only screen and (max-width: 750px) {
    html {
        font-size: 2.55vw;
    }

    main {
        padding-top: 5rem;
    }

    .container {
        padding: 0 2.4rem;
        width: auto;
    }

    .sp-only {
        display: block;
    }

    .main-contents {
        padding-top: 4rem;
    }

    header {
        padding: 0;
    }

    .header-inner {
        padding: 1.6rem 2.4rem;
    }

    header .logo {
        width: 24rem;
    }

    header .navi-btn-wrap {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 3.4rem;
        height: 3.2rem;
        position: absolute;
        right: 1.6rem;
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .navi-btn {
        width: 2.6rem;
        position: relative;
        cursor: pointer;
        display: inline-block;
        z-index: 1;
        height: 1.6rem;
    }

    .navi-btn span {
        position: absolute;
        display: block;
        width: 100%;
        height: 2px;
        background: #000;
        border-radius: 5px;
        transition: .3s;
    }

    .navi-btn span:nth-of-type(2) {
        top: 0.8rem;
        opacity: 1;
    }

    .navi-btn span:last-of-type {
        top: 1.6rem;
    }

    .navi-btn-on span {
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
        transition: .3s;
        background: #fff;
    }

    .navi-btn-on span:first-of-type {
        transform: rotate(-45deg);
        width: 100%;
    }

    .navi-btn-on span:nth-of-type(2) {
        transform: translateX(0);
        opacity: 0;
    }

    .navi-btn-on span:last-of-type {
        transform: rotate(45deg);
        width: 100%;
        top: 0;
    }

    .gnav {
        display: none;
        background-color: #000;
        position: fixed;
        width: 100%;
        top: 0;
        left: 0;
        height: 100vh;
        height: 100dvh;
        height: 100svh;
    }

    .gnav-head {
        padding: 1.6rem 2.4rem;
        display: block;
    }

    .gnav ul {
        flex-wrap: wrap;
        gap: 4rem;
        padding: 4rem 2.4rem;
    }

    .gnav ul li {
        width: 100%;
    }

    .gnav ul li a {
        color: #fff;
        font-size: 2.4rem;
    }

    footer {
        padding-top: 3.2rem;
        padding-bottom: 1.6rem;
    }

    footer .contact-area {
        flex-direction: column;
        padding: 2rem;
        gap: 1.6rem;
        margin-bottom: 3.2rem;
    }

    footer .contact-img {
        margin-right: 0;
    }

    footer .contact-msg {
        font-size: 1.5rem;
    }

    footer .contact-btn {
        width: 100%;
    }

    .footer-contents {
        padding-top: 2.8rem;
        text-align: center;
    }

    footer .logo {
        margin-bottom: 2.8rem;
    }

    footer .logo img {
        width: 24rem;
    }

    .foot-nav {
        margin-bottom: 2.8rem;
    }

    .foot-nav ul {
        flex-direction: column;
        gap: 0.4rem;
    }

    footer .copyright {
        position: static;
        font-size: 1.2rem;
    }

    .kv {
        margin-bottom: 4rem;
    }

    .kv .bg {
        height: 44rem;
        margin-left: 10rem;
    }

    .kv-inner {
        flex-wrap: wrap;
        width: 100%;
        padding: 0 2.4rem;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        gap: 4rem;
    }

    .kv-swiper {
        width: 100%;
    }

    .kv-swiper .swiper-slide {
        border-radius: 1rem;
    }

    .kv h1 {
        font-size: 2.6rem;
    }

    .kv-txt {
        margin-bottom: 0;
    }

    .kv-dots {
        margin-top: 2.4rem;
        gap: 0.8rem;
    }

    .kv-dots .swiper-pagination-bullet {
        width: 4rem;
        height: 0.2rem;
    }

    .top-works {
        margin-bottom: 8rem;
    }

    .top-works .swiper-slide.work-item {
        width: 100%;
    }

    .top-works .work-title {
        width: 100%;
    }

    .top-works .works-contents {
        margin-right: 0;
    }

    .top-about {
        margin-bottom: 8rem;
    }

    .top-about .wave-line {
        top: 6rem;
    }

    .top-about .about-contents {
        flex-wrap: wrap;
        margin-top: 2.8rem;
    }

    .top-about .about-msg {
        width: auto;
        font-size: 1.6rem;
        line-height: 3.2rem;
    }

    .top-about .detail-area .btn-wrap {
        margin-top: 2rem;
    }

    .top-link ul {
        flex-wrap: wrap;
    }

    .top-link ul li a {
        height: 14rem;
        padding: 2rem;
        font-size: 2.2rem;
    }

    .top-link ul li a::before {
        right: 2rem;
        bottom: 2.7rem;
        width: 6rem;
    }

    .top-link ul li a::after {
        right: 1.8rem;
        bottom: 3.2rem;
        width: 1.8rem;
    }

    .work-grid {
        grid-template-columns: repeat(1, 1fr);
        gap: 4.4rem;
    }

    .work-title {
        width: 100%;
    }

    .work-page-btn {
        width: 3.2rem;
        height: 3.2rem;
    }

    .work-pagination {
        margin-top: 6rem;
    }

    #works .cat-title {
        margin-bottom: 3.2rem;
    }

    #work-detail .main-contents {
        padding-bottom: 8rem;
    }

    #work-detail .container {
        width: auto;
    }

    .work-detail-title {
        font-size: 2.2rem;
        line-height: 3.6rem;
        margin-bottom: 1.2rem;
    }

    .work-detail-thumbnail {
        margin-bottom: 4rem;
    }

    .work-detail-footer {
        margin-top: 6rem;
    }

    .work-detail-body h1 {
        font-size: 2.2rem;
    }

    .work-detail-body h2 {
        font-size: 1.8rem;
        line-height: 3.2rem;
        margin-bottom: 2.8rem;
    }

    .work-detail-body h3 {
        font-size: 1.6rem;
    }

    #about .main-contents {
        padding-bottom: 8rem;
    }

    .sec-about {
        margin-bottom: 6rem;
    }

    .sec-about .wave-line {
        top: 10rem;
    }

    .sec-about .about-contents {
        flex-direction: column;
        margin-top: 2.8rem;
    }

    .sec-about .detail-area {
        width: 100%;
        font-size: 1.6rem;
        line-height: 3.2rem;
    }

    .solution-kv {
        margin: 2.8rem 0 4rem;
    }

    .solution-figure {
        width: auto;
    }

    .solution-grid {
        width: auto;
    }

    .activation-list {
        flex-wrap: wrap;
    }

    .activation-item:not(:last-child) {
        border-radius: 0;
    }

    .solution-kv {
        margin-bottom: 2.8rem;
    }

    .solution-catch {
        font-size: 2.4rem;
        margin-bottom: 2rem;
    }

    .activation-wrap {
        margin-top: 2rem;
    }

    .activation-wrap h3 {
        font-size: 2.2rem;
    }

    .activation-guide {
        font-size: 1.4rem;
        line-height: 1.5;
    }

    .team-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .team-desc {
        width: 100%;
    }

    .solution-desc {
        line-height: 2.4rem;
    }

    .solution-category {
        margin-bottom: 0.2rem;
    }

    .solution-title {
        font-size: 2.2rem;
    }

    .solution-grid {
        display: flex;
        flex-direction: column;
        margin-top: 4.8rem;
    }

    .solution-grid .btn-wrap {
        margin-top: 1.2rem;
    }

    .solution-thumbnail {
        order: 2;
    }

    .inner-branding {
        gap: 2rem;
    }

    .inner-branding .solution-title {
        font-size: 2.2rem;
    }

    .reach-influence {
        gap: 2rem;
    }

    .reach-influence .solution-category {
        margin-bottom: 0.2rem;
    }

    .creative-media {
        flex-direction: column;
        gap: 2rem;
    }

    .creative-media .solution-thumbnail {
        width: 100%;
    }

    .building-loyalty,
    .live-experienes {
        gap: 2rem;
    }

    .solution-area {
        margin-bottom: 6rem;
    }

    .team-area {
        margin-top: 6rem;
    }

    .team-grid {
        margin-top: 4rem;
    }

    .team-title {
        font-size: 2.2rem;
    }

    .team-item {
        gap: 2rem;
    }

    .team-info {
        gap: 2rem;
    }

    #company .main-contents {
        padding-bottom: 8rem;
    }

    .company-contents {
        margin-top: 2.8rem;
    }

    .company-contents table {
        font-size: 1.6rem;
        width: 100%;
    }

    .company-contents th {
        line-height: normal;
        white-space: nowrap;
        vertical-align: top;
    }

    .company-contents td {
        line-height: normal;
        padding-bottom: 1.6rem;
    }

    #company .sec-map {
        margin-top: 4rem;
    }

    .map-wrapper {
        margin-top: 2.8rem;
    }

    .map-wrapper iframe {
        height: 24rem;
    }

    #privacypolicy .main-contents {
        padding-bottom: 8rem;
    }

    #privacypolicy .container {
        width: 100%;
    }

    #privacypolicy .cat-title {
        margin-bottom: 4rem;
    }

    #privacypolicy h1 {
        font-size: 2rem;
        margin-bottom: 2rem;
        line-height: normal;
    }

    .intro {
        line-height: 3.2rem;
    }

    #privacypolicy dl {
        line-height: 3.2rem;
    }

    #privacypolicy dd {
        margin-bottom: 3.2rem;
    }

    .policy-sign {
        line-height: 3.2rem;
        margin-top: 6rem;
    }

    #error .main-contents {
        padding-bottom: 6rem;
    }

    #error .error-message {
        margin-top: 2.4rem;
    }
}