@media screen and (max-width: 1200px) {
    /* common */
    /* .bgimg-wrap {
        width: 100%;
        height: 100vh;
        background-image: url(/hwabaek/img/sub-banner01.png);
        background-repeat: no-repeat;
        background-size: cover;
    }

    .introduce {
        padding-top: 200px;
    }

    .main-title-text {
        font-size: var(--mdtitle-media);
    }

    .sub-title-text>p {
        font-size: var(--textfont-20-media);
    } */

    .circle-color {
        width: 180px;
        height: 180px;
    }

    .circle-color-line,
    .circle-color-line2 {
        width: 180px;
        height: 180px;
    }

    /* ------------------------------- 1_1_2 ------------------------------- */
    /* .bg-white-partners {
        width: 100%;
        height: auto;
        padding: 40px 50px;
    }

    .partners>h1 {
        font-size: var(--mdtitle-media);
    }

    .partners>p {
        font-size: var(--textfont-20-media);
    }

    .partners-logo {
        height: 750px;
        grid-template-columns: repeat(3, 1fr);
        margin-top: 80px;
    }

    .logo-name-bg {
        font-size: 18px;
    } */

    /* ------------------------------- 1_1_3 ------------------------------- */
    /* .global-bgimg-wrap {
        background-position: center center;
    }

    .bg-white8 {
        width: 100%;
        height: 100vh;
        padding: 0 50px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .total-title-wrap {
        width: 100%;
        height: 470px;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

    .viet-title-wrap p {
        font-size: var(--main-sub-font);
    }

    .viet-title-wrap span {
        font-size: var(--sub-title-media);
    }

    .product-title-box>p {
        font-size: var(--textfont-20-media);
    }

    .viet-text-wrap {
        width: 90%;
    }

    .viet-text-wrap>p {
        font-size: var(--textfont-20-media);
    }

    .viet-text-wrap>span {
        font-size: var(--textfont-18-media);
    }

    .viet-icon-wrap {
        margin-top: 150px;
        gap: 40px;
    }

    .icon-cont-wrap {
        width: 25%;
        height: 124px;
        text-align: center;
    }

    .icon-cont-wrap p {
        font-size: var(--textfont-18-media);
    } */

    /* 2랩 시작 */
    /* .bg-white9 {
        height: auto;
        padding: 0 50px;
    }

    .title-box {
        font-size: var(--textfont-20-media);
    } */

    /* 공장 및 실험 이미지 시작 */
    /* .manufacturing-cont-wrap {
        width: 100%;
        font-size: var(--textfont-18-media);
        font-weight: var(--font-light-weight);
    }

    .manufacturing-cont-wrap table tr {
        width: 100%;
        height: 80px;
    }

    .manufacturing-cont-wrap table td img {
        height: 20%;
        width: 100%;
    } */

    /** 3 랩 시작 **/
    /* .bg-white11 {
        width: 100%;
        height: auto;
        padding: 0 50px;
        margin-top: 100px;
    }

    .title-system-wrap p {
        font-size: var(--textfont-20-media);
        margin-bottom: 50px;
    }

    .icon-system-wrap {
        height: 300px;
        justify-content: space-between;
        margin-top: 50px;
    }

    .icon-text-wrap2 {
        width: 22%;
        max-width: 1520px;
        height: 166px;
        text-align: center;
    }

    .icon-text-wrap2>p {
        font-size: var(--textfont-18-media);
    }

    .icon-text-wrap2>img {
        width: 35%;                         
    } */
    .icon-text-wrap2 img {
        width: 30%;
    }

    /*** 4랩 시작 ***/
    /* .bg-white10 {
        width: 100%;
        height: auto;
        padding: 0 50px;
    }

    .collaboration-title-wrap>p {
        font-size: var(--textfont-20-media);
    }

    .collaboration-title-wrap>span {
        font-size: var(--textfont-18-media);
    }

    .collaboration-cont-wrap {
        width: 100%;
        height: auto;
        margin-top: 50px;
    }

    .collaboration-cont-wrap>div:nth-child(1) {
        height: 400px;
        background-position: center center;
    }

    .company-intro {
        width: 55%;
        max-width: 500px;
        height: 200px;
        left: 50px;
        line-height: 30px;
        font-size: var(--textfont-18-media);
        padding: 10px;
    } */

    /*** 5랩 시작 ***/
    /* .bg-white12 {
        height: auto;
        padding: 0 50px;
    }

    .export-title-wrap>p {
        font-size: var(--textfont-20-media);
    }

    .export-title-wrap>span {
        font-size: var(--textfont-18-media);
        margin-top: 50px;
    }

    .title-box2 {
        width: 60%;
        font-size: var(--textfont-20-media);
        margin-bottom: 50px;
    }

    .global-map-img {
        width: 100%;
        height: auto;
    }

    .global-map-img>img {
        object-fit: contain;
        width: 100%;
        margin-top: 100px;
    } */

    /*** 6랩 시작 ***/
    /* .factory-info-total-wrap {
        width: 100%;
        height: 820px;
        display: flex;
        justify-content: space-around;
        flex-direction: column;
        margin-bottom: 100px;
    }

    .factory-info-wrap {
        width: 100%;
        height: 338px;
        flex-direction: column;
        gap: 30px;
    }

    .title-box-wrap>p {
        font-size: var(--textfont-18-media);
        font-weight: var(--font-light-weight);
    }

    .factory-img {
        width: 100%;
    }

    .factory-img>img {
        width: 100%;
    }

    .factory-text-wrap {
        width: 100%;
        height: 177px;
        font-size: var(--textfont-18-media);
        font-weight: var(--font-light-weight);
        padding-left: 30px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    } */

    /** sub 1_1_3끝 **/
    /* ------------------------------- 2_1_3------------------------------- */

    .lifting-point-table-wrap,
    .dfr-table-wrap,
    .dfr-table-wrap {
        overflow-x: auto;
    }
}

@media screen and (min-width: 401px) and (max-width: 768px) {
    /* ------------------------------- 1_1_1 ------------------------------- */

    /* 토굴 wrap */
    .toggle-navi-wrap {
    }

    .toggle-navi,
    .toggle-navi2,
    .toggle-navi3 {
        width: 90%;
        flex-direction: column;
        height: 100%;
    }

    .toggle-navi > ul,
    .toggle-navi2 > ul,
    .toggle-navi3 > ul {
        width: 100%;
        height: 80%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .toggle-navi > ul > li,
    .toggle-navi2 > ul > li,
    .toggle-navi3 > ul > li {
        width: 80%;
    }

    .toggle-navi2 > ul,
    .toggle-navi3 > ul {
        width: 100%;
    }

    .toggle-navi3 > ul > li {
        width: 80%;
    }

    /****** 2랩 ******/
    .main-cont-wrap {
        height: 100%;
        margin-top: 20px;
        flex-direction: column;
    }

    .left-cont {
        width: 65%;
    }

    .left-cont > img {
        width: 80%;
    }

    .line-gray {
        margin: auto;
        margin-bottom: 30px;
    }

    .right-cont {
        width: 90%;
        height: 100%;
        text-align: center;
        padding: 80px 0;
    }

    /* 1랩 끝 */
    /* 2랩 시작 */

    .main-cont-wrap2 {
    }

    .connection-img {
        width: 100%;
        height: 300px;
    }

    .circle-color {
        width: 150px;
        height: 150px;
    }

    .circle {
        width: 170px;
        height: 170px;
    }

    .circle-wrap {
        width: 100%;
        height: 100%;
    }

    .circle-color-line {
        width: 150px;
        height: 150px;
        left: 10%;
    }

    .circle-color-line2 {
        width: 150px;
        height: 150px;
        left: 92%;
        top: 50%;
    }

    /* 진행 라인 끝*/

    .txt-box {
        width: 100%;
        padding: 30px;
    }

    .txt-cont {
        width: 100%;
        height: 100%;
    }

    .txt-cont > h3 {
    }

    .txt-cont > p {
        margin-top: 20px;
    }

    /* 3랩 시작 */

    /* company profile 표 이미지 시작*/
    .cont-wrap {
        margin-top: 50px;
        width: 100%;
        height: 45%;
    }

    /***** hq-south-korea-wrap  표 시작 *****/
    .hq-south-korea-wrap {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    /* 회사 이름 아래 선 끝 */
    .company-img1 {
        width: 100%;
        height: 300px;
    }

    .company-table1,
    .company-table1-1 {
        width: 100%;
        margin-top: 30px;
        margin-bottom: 50px;
    }

    .MTV-SouthKorea-wrap {
        flex-direction: column-reverse;
        align-items: center;
    }

    .MTV-SouthKorea-wrap > img {
        width: 100%;
    }

    .hq {
        width: 50%;
        height: 85%;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        color: var(--main-color);
        font-size: var(--smalltitle-media);
    }

    .company-table1 > tbody {
        height: 60%;
    }

    .company-table1-1 th,
    .company-table1-1 td .company-table1-1 tr {
        height: 14.2%;
    }

    .company-table1-1 th,
    .company-table1-1 td {
        border: 0;
    }

    .company-table1-1 tr {
        border: 1px solid var(--gray-color-1);
        border-left: none;
        border-right: none;
        text-align: left;
    }

    .company-table1-1 > tbody > tr > td > img,
    .company-table1-1 > tbody > tr > td > img {
        width: 10%;
        padding-right: 1%;
    }

    .company-img2 {
        width: 100%;
    }

    .company-table1-1 tr:nth-child(1) {
        width: 100%;
    }

    /***** hq-south-korea-wrap  표 끝 *****/

    /***** 4랩 시작*****/

    .history-active-wrap {
        width: 100%;
        height: 80%;
        display: flex;
        justify-content: space-between;
    }

    .history-line-animation {
        width: 10%;
        position: absolute;
        left: 45%;
    }

    /*** 연혁 애니메이션 숫자 ***/

    .history-caracter-imgs {
        width: 100%;
        bottom: -17%;
        left: -22%;
        position: absolute;
        z-index: 50;
    }

    .imgs-wrap {
        position: relative;
        width: 100%;
        height: 70%;
        overflow: hidden;
        border-radius: 50px;
    }
    .imgs-wrap > ul {
        width: 100%;
    }
    .imgs-wrap > ul > li > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .history-imgs {
        height: 1777px;
    }
    /*** 연혁 애니메이션 바 끝***/

    /* ------------------------------- 1_1_2 -------------------------------  메인이랑 수정 필요함*/
    .bg-white-partners {
        width: 100%;
        height: auto;
        padding: 40px 50px;
    }

    .partners-box {
        flex-wrap: wrap;
    }

    .partners > h1 {
        font-size: var(--smalltitle-media);
    }

    .partners > p {
        font-size: var(--textfont-18-media);
    }

    .logo-name {
        width: 45%;
        height: 120px;
    }

    /* 로고이름 배경 */

    /* ------------------------------- 1_1_3 ------------------------------- */

    /** 3 랩 시작 **/
    .icon-text-wrap2 img {
        width: 50%;
    }

    /*** 4랩 시작 ***/
    .company-intro {
        left: 30px;
    }

    /*** 5랩 시작 ***/

    /*** 6랩 시작 ***/

    .factory-info-wrap {
        width: 100%;
        height: 100%;
        flex-direction: column;
        gap: 30px;
    }

    .factory-img {
        width: 100%;
    }

    .factory-text-wrap {
        width: 100%;
        height: 177px;
        font-size: var(--textfont-18-media);
        font-weight: var(--font-light-weight);
        padding-left: 30px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }

    /** sub 1_1_3끝 **/
    /* ------------------------------- 2_1_1 ------------------------------- */
    .etching-additive-table-wrap {
        flex-direction: column;
        align-items: center;
    }

    .etching-additive-table-wrap > table {
        width: 100%;
        border-top: 2px solid var(--black-color);
        text-align: center;
        font-size: var(--text-font);
        color: var(--black-color);
    }

    .etching-additive-table-wrap > table td {
        font-weight: var(--font-light-weight);
        border-bottom: 1px solid var(--gray-color-1);
        padding: 20px;
    }

    /* ------------------------------- 2_2_1 ------------------------------- */
    .icon-list-wrap {
        flex-direction: column;
        align-items: center;
    }

    .icon-list {
        width: 100%;
    }

    .icon-list {
        width: 100%;
    }

    .icon-list-wrap img {
        width: 30%;
    }

    /* ------------------------------- 2_3_1 ------------------------------- */
    .material-new-items {
        flex-direction: column;
        align-items: center;
    }

    .material-new-item-desc {
        width: 70%;
    }

    .material-new-item {
        width: 100%;
    }

    .material-new-item img {
        width: 100%;
    }

    .material-polymers-items {
        gap: 10px;
    }

    .material-polymers-item img {
        width: 50%;
    }

    .material-new-polymers-wrap span {
        top: 36%;
    }

    .material-appli-items {
        flex-direction: column;
        align-items: center;
    }

    .material-appli-item {
        width: 100%;
        margin-bottom: 100px;
    }

    .material-appli-img-box {
        width: 100%;
    }

    .material-appli-img-box img {
        width: 70%;
    }

    .material-core-table-wrap {
        flex-direction: column;
        align-items: center;
    }

    .material-core-table {
        width: 100%;
    }

    .material-core-table-wrap img {
        width: 100%;
    }

    .material-core-character-wrap {
        margin-top: 100px;
        flex-direction: column;
        align-items: center;
    }

    .material-core-character-wrap img {
        display: none;
    }

    .material-core-character-table {
        width: 100%;
    }

    .material-core-graph-wrap {
        margin-top: 100px;
        flex-direction: column;
        align-items: center;
    }

    .material-core-graph-img {
        width: 100%;
    }

    /* ------------------------------- 2_1_3------------------------------- */
    .Chlorate-oxidizer-wrap,
    .chlorate-oxidizer-table-wrap {
        flex-direction: column;
        align-items: center;
    }

    .Chlorate-oxidizer-wrap > div,
    .chlorate-oxidizer-table-wrap > table {
        width: 100%;
        margin-bottom: 50px;
    }

    /*2랩 시작*/
    .product-Performance-character-3 {
        position: absolute;
        top: -200px;
        right: 0;
    }

    .Etching-Speed-table {
        overflow-x: auto;
    }

    .bg-gray {
        margin-top: 200px;
        border-radius: 100px;
    }

    .product-etching-condition-wrap {
        flex-direction: column;
        align-items: center;
    }

    .etching-table-wrap {
        width: 100%;
        margin-top: 100px;
    }

    /* ------------------------------- 2_2_1------------------------------- */
    .product-table-wrap2 {
        overflow-x: auto;
    }

    /* ------------------------------- 2_1_2------------------------------- */
    .product-graph-wrap {
        flex-direction: column;
        align-items: center;
    }

    .product-graph-wrap > div {
        width: 100%;
    }
    .stable-wrap,
    .dfr-table-wrap {
        overflow-x: auto;
    }
    .DFR-title {
        padding: 30px 0;
    }

    /* ------------------------------- 2_1_3------------------------------- */
    .glass-stripper-table-wrap {
        flex-direction: column;
        align-items: center;
        margin-top: 100px;
    }
    .glass-stripper-table {
        width: 100%;
        margin-bottom: 50px;
    }
    .lifting-point-table-wrap,
    .dfr-foot-graph {
        overflow-x: auto;
        width: 100%;
    }
    .youtube-link > a,
    img {
        width: 150px;
    }
    .dfr-graph-change img {
        margin-top: 30px;
    }

    /* ------------------------------- 4_1_1------------------------------- */
    .input-box2_2,
    .input-box3_2 {
        flex-direction: column;
    }

    .input-box2-2_2,
    .input-box2-1_2,
    .input-box3-1_2,
    .input-box3-2_2 {
        width: 100%;
    }

    .addfile-wrap {
        width: 13%;
    }

    .file-name {
        width: 73%;
    }

    .file-label {
        width: 20%;
    }
}