:root {
        --primary: #003D33;
        --border-radius: 12px;
        --eng-font: "adobe-garamond-pro", serif;
        --w1280: 1280px;
        --w1440: 1440px;
        --w1660: 1660px;
    }

    /* sub section anim */
    .sub_content > .section {
        opacity: 0;
        transform: translateY(20px);
        transition: opacity 0.8s, transform 0.6s;
    }


    .sub_content {
        overflow: hidden !important;
    }

    @media (max-width:768px) {
        .sub_content {
            padding: 0 0 60px;
        }
    }

    @media (min-width:767px) {
        .mbr {
            display: none;
        }

        .pbr {
            display: block;
        }
    }

    @media (max-width:768px) {
        .mbr {
            display: block;
        }

        .pbr {
            display: none;
        }
    }

    .mark1 {
        color: var(--primary);
    }

    /* cmm */
    a.under {
        display: inline-block;
        overflow: hidden;
        padding-bottom: 3px;
        position: relative;
        transition: opacity 0.5s;
        font-size: 16px;
        text-transform: uppercase;
    }

    a.under:after {
        position: absolute;
        display: block;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 2px;
        background: #000000;
        content: "";
    }

    a.under:hover:after {
        -webkit-animation: underline 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
        animation: underline 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s;
    }

    @-webkit-keyframes underline {
        0% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(100%);
        }

        50.001% {
            transform: translateX(-100%);
        }

        to {
            transform: translateX(0);
        }
    }

    @keyframes underline {
        0% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(100%);
        }

        50.001% {
            transform: translateX(-100%);
        }

        to {
            transform: translateX(0);
        }
    }

    .cm_sec_tit {
        position: relative;
        max-width: 1660px;
        margin: 0 auto 40px;
        border-bottom: 3px solid transparent;
        --border-width: 0%;
    }

    .cm_sec_tit::before {
        content: "";
        position: absolute;
        top: -20px;
        left: 0;
        width: var(--border-width);
        height: 2px;
        background-color: #111;
    }

    .cm_sec_tit h2 {
        font-size: 60px;
        line-height: 1;
        color: #111;
        font-family: var(--eng-font);
        font-weight: 400;
    }


    @media (max-width:1700px) {
        .brand_sec1 {
            padding: 140px 60px !important;
        }

        .brand_sec2 .dflx .right .df {
            padding-left: 190px !important;
        }
    }

    @media (max-width:1660px) {
        /*
        .cm_sec_tit {
            margin: 0 60px 40px;
        }
*/




    }

    @media (max-width:1400px) {
        .brand_sec2 .dflx .right .df {
            padding-left: 100px !important;
        }

        .brand_sec3 .dflx ul li .over img {
            max-width: 60% !important;
        }
    }

    @media (max-width:1280px) {
        .brand_sec2 .dflx .right .df {
            padding-left: 60px !important;
        }

        .cm_sec_tit h2 {
            font-size: 36px;
        }

        .brand_sec2 .dflx2 .prd_item h2 {
            font-size: 20px !important;
        }

        .brand_sec3 .dflx ul {
            flex-wrap: wrap !important;
        }
    }

    @media (max-width:1200px) {
        .brand_sec3 .dflx ul li {
            width: 50% !important;
            margin-bottom: 32px;
        }
    }

    @media (min-width:1009px) {
        .m_prd_img {
            display: none;
        }
    }

    @media (max-width:1100px) {
        .brand_sec2 .dflx .right .df h2 {
            font-size: 24px !important;
        }



        .m_prd_img {
            display: block;
        }

        .m_prd_img span img {
            max-width: 70%;
        }

        .brand_sec2 .prd_img {
            display: none !important;
        }

        .brand_sec2 .dflx {
            display: block !important;

            height: auto !important;
        }

        .brand_sec2 .dflx .left,
        .brand_sec2 .dflx .right {
            width: 100% !important;
        }

        .brand_sec2 .dflx .left {
            margin-bottom: 160px;
        }
    }

    @media (max-width:1024px) {
        .brand_sec1 .dflx {
            flex-direction: column !important;
        }

        .brand_sec1 .dflx .right {
            margin-top: 32px !important;
        }
    }

    @media (max-width:768px) {
        .brand_sec2 .dflx .left h2 {
            font-size: 28px !important;
        }

        .brand_sec2 .dflx .right {
            display: block !important;
        }

        .brand_sec1 .dflx .left h2 {
            font-size: 36px !important;
        }


        .brand_sec2 .dflx .left {
            margin-bottom: 50px;
        }

        .brand_sec1 .dflx .right p {
            font-size: 16px !important;
        }

        .m_prd_img {
            text-align: center;
        }

        .m_prd_img span img {
            max-width: 40%;
        }

        .brand_sec2 .dflx .right .df {
            padding-left: 0 !important;
        }

        .brand_sec2 .dflx .right .df {
            margin-top: 50px !important;
        }

        .brand_sec1 {
            padding: 80px 20px !important;
        }

        .cm_sec_tit {
            margin: 0 0 40px;
        }

        .cm_sec_tit h2 {
            font-size: 32px;
        }

        .brand_sec3 .stit h2 {
            font-size: 17px !important;
        }

        .brand_sec3 .dflx ul li {
            width: 100% !important;
            padding: 0 !important;
        }

        .brand_sec2 .dflx2 .prd_item h2 {
            line-height: 1.3 !important;
            font-size: 15px !important;
        }
    }