@media screen and (max-width: 1680px) {
    .InnerGIGABYTEContent h4 {
        margin: 0;
        padding: 0;
        font-family: "Titillium Web", 'Arial', "微軟正黑體", Microsoft JhengHei, "微軟雅黑體", Microsoft YaHei, SimHei, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "新細明體", Arial, Verdana, Helvetica, sans-serif;
        font-weight: bold;
        font-size: 1.0rem;
        text-align: left;
        line-height: 1;
        letter-spacing: 0;
        word-spacing: 0;
        color: #ddd;
    }
}

@media screen and (max-width: 1366px) {
    .InnerGIGABYTEContent h3 {
        letter-spacing: 4px;
    }

    .InnerGIGABYTEContent h4 {
        letter-spacing: 1px;
    }

    .InnerGIGABYTEContent h5 {
        letter-spacing: 1px;
        line-height: 1.2;
    }

    #keyf,
    .keyf {
        padding: 3rem;
    }

    .keyf>div {
        flex-direction: column;
        gap: 3rem;
    }

    .keyf>div .text h3,
    .keyf>div .text p {
        text-align: center;
    }

    .keyf>div .text {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #gamingrobot,
    .gamingrobot {
        display: none;
    }

    #overview,
    .overview {
        padding: 3rem;
        gap: 2rem;
    }

    .overview>div {
        flex-direction: column;
        gap: 2rem;
    }

    .diagram .spectext {
        display: none;
        pointer-events: none;
        opacity: 0;
    }

    :root {
        --pointsize: 20px;
    }

    .diagram .specpoint span {
        max-width: var(--pointsize);
        max-height: var(--pointsize);
        color: var(--linecolor);
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: 900;
        z-index: 2;
        clip-path: unset;
    }

    .diagram .specpoint::after {
        width: var(--pointsize);
        height: var(--pointsize);
        background-color: transparent;
    }

    .diagram .specpoint span.topright {
        border-top: unset;
        border-right: unset;
        right: unset;
        bottom: unset;
    }

    .diagram .specpoint span.topleft {
        border-top: unset;
        border-left: unset;
        left: unset;
        bottom: unset;
    }

    .diagram .specpoint span.bottomright {
        border-bottom: unset;
        border-right: unset;
        right: unset;
        top: unset;
    }

    .diagram .specpoint span.bottomleft {
        border-bottom: unset;
        border-left: unset;
        left: unset;
        top: unset;
    }

    .overview ul.diagram-list {
        list-style-type: decimal;
        width: 90%;
        display: flex;
        flex-direction: column;
        gap: .4rem;
    }

    .overview ul.diagram-list li {
        cursor: unset;
    }

    .overview ul.diagram-list li ul li {
        font-size: .9rem;
    }

    .overview ul.diagram-list h4 {
        font-weight: normal;
        font-size: 1rem;
        letter-spacing: 2px;
    }

    #ud,
    .ud {
        padding: 0 3rem;
    }

    .ud section>div {
        display: flex;
        flex-direction: column-reverse;
        justify-content: flex-end;
    }

    .ud .cols>div.col .text {
        position: relative;
        padding: 5rem 2rem 0;
    }

    .ud .cols>div {
        width: 100%;
    }

    .ud section>div svg {
        display: none;
    }

    .ud section>div p,
    .ud section>div ul {
        opacity: 1;
    }

    .ud .cols>div>div.pgsbar {
        width: 100%;
        padding: 0;
        bottom: unset;
        top: 1rem;
    }

    #slidecard,
    .slidecard {
        padding: 0 3rem;
    }

    .slidecard .spacers {
        display: none;
    }

    .slidecard .camera {
        gap: 5vw;
        height: unset;
        position: relative;
        overflow: unset;
        padding: 10vw 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .slidecard .camera>img {
        margin: unset;
        inset: unset;
        object-fit: cover;
    }

    .slidecard .sliders {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    .slidecard .slider {
        width: 100%;
        padding: 2rem 2rem 0;
    }

    .slidecard .text {
        padding: 0;
        min-width: unset;
    }

    .slidecard .text h4,
    .slidecard .text p {
        max-width: 100%;
    }

    .slidecard .text span {
        display: none;
    }

    .slidecard .imgs {
        height: 50%;
        bottom: 0;
    }

    .slidecard .audio .imgs img {
        opacity: .2;
    }

    #easy,
    .easy {
        padding: 0 3rem;
    }

    .easy .main .text h3,
    .easy .main .text h5 {
        text-align: center;
    }

    .easybg {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .easybg img {
        width: unset;
        height: 100%;
        top: unset;
        left: unset;
    }

    .easy .cols {
        display: flex;
        flex-direction: column;
    }

    .easy .cols>div {
        width: 100%;
    }

    .easy .col:not(.gcc):not(.smartfan):nth-child(even),
    .easy .col:not(.gcc):not(.smartfan):nth-child(odd) {
        transform: translateX(0);
    }

    .easy .cols>div.smartfan {
        flex-direction: column;
    }

    .easy .cols>div.gcc img {
        width: 190%;
    }

    .brandslide {
        padding: 3rem;
    }

    .brandslide .spacers {
        display: none;
    }

    .brandslide .camera {
        position: relative;
        height: unset;
    }

    .brandslide .camera>img {
        display: none;
    }

    .brandslide .sliders {
        width: 100%;
        flex-direction: column;
    }

    .brandslide .slider {
        width: 100%;
        height: unset;
        border-radius: unset;
    }

    .brandslide .imgs {
        position: relative;
    }

    div.dots {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .keyf>div .text aside {
        gap: 1rem;
    }

    .keyf>div .text aside p {
        letter-spacing: 0;
    }

    .easy .cols>div.gcc .text,
    .easy .cols>div.gcc .text .title,
    .easy .cols>div.gcc .text ul {
        align-items: flex-start;
    }

    .easy .cols>div.gcc .text p {
        text-align: left;
    }
}