@media screen and (max-width:767px) {
    #cat_main_title{
        width: clamp(15em, 85%, 35em);
        text-align: center;
        margin-top: 1em;
        font-size: 7rem;
        font-weight: 800;
        color: #0A0044;
    }

    #cat_sub_title{
        width: clamp(15em, 85%, 35em);
        margin-top: 1em;
        font-size: 4rem;
        text-align: center;
    }

    #cat_introduce{
        margin-top: 3em;
        width: clamp(57em, 85%, 100em);
        display: grid;
        grid-template-columns: 100%;
        grid-row-gap: 10em;
        place-items:center;
    }

    .cat_introduce_div{
        width: 100%;
        height:clamp(37em, 90%, 100em);
        background-color: #fff;
        display: grid;
        grid-template-columns: clamp(25em, 40%, 37em) auto;
        grid-template-rows: 100%;
        border-radius: 4em;
        overflow: hidden;
        transform: scale(1);
        transition: .2s;
    }


    .cat_introduce_div_div{
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: 1em;
        aspect-ratio: 16/9;
    }

    .cat_introduce_div_div2{
        width: 90%;
        height: 90%;
        overflow: hidden;
        margin: 5%;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 20% 70% 10%;
    }

    .cat_introduce_div_div2_div{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0A0044;
        font-size: 5em;
        font-weight: 800;
    }

    .cat_introduce_div_div2_div2{
        width: 100%;
        height: 100%;
        font-size: 3rem;
        text-align: center;
    }

    .cat_introduce_div_div2_div3{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .cat_introduce_div_div2_div3_div{
        width: 100%;
        border-radius: .5em;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: end;
        font-size: 2.5rem;
    }

    #load_more_button{
        margin-top: 3em;
        border-radius: .5em;
        width: 70%;
        height: 2em;
        color: #0A0044;
        /* border: #0A0044 solid .15em; */
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        font-size: 3rem;
        transition: .2s;
    }


    #product_title{
        margin-top: 5em;
        width: clamp(15em, 85%, 35em);
        font-weight: 800;
        font-size: 7rem;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0A0044;
    }

    #product_sub_title{
        width: clamp(15em, 85%, 35em);
        font-size: 4rem;
    }

    #product_search{
        width: 90%;
        height: 10em;
        background-color:#fff;
        border-radius: 2em;
        overflow: hidden;
        display: grid;
        grid-template-columns: clamp(23em, 40%, 36em)  auto;
        grid-column-gap: 1em;
        grid-template-rows: 100%;
        text-align: center;
        /* border: #0A0044 solid .1em; */
    }

    #product_search div{
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 3rem;
    }

    #product_search_gongneng{
        width: 100%;
        height: 100%;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
    }

    #product_search_svg{
        background-color: #fff;
        color: #4255ff;
        width: 100%;
        height: 100%;
    }

    #product_search_svg_input{
        background-color: #fff;
        width: 100%;
        height: 100%;
    }

    #product_search_svg_input_input{
        width: 100%;
        height: 100%;
        background-color: transparent;
        border: none;
        outline: none;
        font-size: 3rem;
    }

    #product_sort{
        margin-top: 10em;
        width: clamp(57em, 85%, 137em);
        height: 50em;
        /* border: #0A0044 solid .1em; */
        border-radius: 1rem;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 25% 25% 25% 25%;
        /* border: #0A0044 solid .1em; */
        background-color: #fff;
        overflow: hidden;
        text-align: center;
    }

    .product_sort_choice{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        font-size: 4rem;
    }

    .product_sort_dontchoice{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 4rem;
    }


    #display_number{
        margin-top: 3em;
        width: clamp(57em, 85%, 137em);
        text-align: center;
        font-size: 2.5rem;

    }

    #display_product{
        margin-top: 1.5em;
        width: clamp(57em, 85%, 100em);
        height: auto;
        display: grid;
        grid-template-columns: 100%;
        grid-column-gap: 10%;
        grid-row-gap: 10em;
    }

    .display_product_frame{
        margin-top: 1em;
        width: 96%;
        background-color: #fff;
        border-radius: 4em;
        padding: 2%;
        display: grid;
        grid-template-rows: 35em 15em auto 10em;
        grid-template-columns: auto;
        transform: scale(1);
        transition: .2s;
    }


    .display_product_frame_img{
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5%;
    }

    .display_product_frame_title{
        padding-left: 4%;
        padding-right: 4%;
        font-size: 5rem;
        font-weight: 800;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .display_product_frame_submain{
        margin-top: 4%;
        display: flex;
        justify-content: center;
        font-size: 3rem;
        text-align: center;
    }

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

    .display_product_frame_button_button{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 70%;
        border-radius: .5em;
        font-size: 3rem;
    }

    #display_product_page{
        align-items: center;
        justify-content: center;
        margin-top: 4em;
        width: clamp(20em, 80%, 40em);
        height: 3em;
        display: grid;
        grid-template-columns: 20% 55% 20%;
        grid-column-gap: 3%;
        font-size: 3rem;
    }

    #display_product_page_last , #display_product_page_next{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        /* border: #0A0044 solid .1em; */
        border-radius: .3em;
        text-align: center;
        /* background-color: #fff; */
        transition: .2s;
    }


    .display_product_page_number{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_page_number_div{
        border-radius: .3em;
        width: 20%;
        height: 100%;
        margin-right: 5%;
        /* border: #0A0044 solid .1em; */
        display: flex;
        align-items: center;
        justify-content: center;
        /* background-color: #fff; */
        transition: .2s;
    }


    .display_product_page_number_div_currect{
        border-radius: .3em;
        width: 20%;
        height: 100%;
        margin-right: 5%;
        border: #0A0044 solid .1em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        transition: .2s;
    }

    #display_product_sort_frame{
        margin-top: 3em;
        width: clamp(57em, 80%, 100em);
        display: grid;
        grid-template-columns: minmax(25rem, 47em) minmax(25rem, 47em);
        grid-template-rows: auto;
        grid-column-gap: 6em;
        grid-row-gap: 5em;
    }

    .display_product_sort_frame_div{
        width: 100%;
        height: 40em;
        background-color: #fff;
        border-radius: 1em;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 60% 40%;

    }

    .display_product_sort_frame_div_div2_1{
        font-size: 4rem;
        color: #0A0044;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .display_product_sort_frame_div_div2_2{

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_sort_frame_div_div2_2_div{
        width: 90%;
        height: 50%;
        border: #0A0044 solid .1em;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .5em;
        font-size: 3rem;
    }


    #display_product_sort_frame_none,#display_product_sort_frame_none2{
        width: 70%;
        height: 10em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #fff;
        border-radius: 1em;
        font-size: 4rem;
        font-weight: 800;
        letter-spacing: .1rem;
        color: #0A0044;
        grid-column-start: 1;
        grid-column-end: 8;
        grid-row-start: 1;
        grid-row-end: 6;
        text-align: center;
    }





    .product_content_frame_all_top_nav{
        margin-top: 3em;
        width: clamp(29em, 80%, 65em);
        font-size: 2.1rem;
    }

    #product_content_frame_all{
        margin-top: 1em;
        background-color: #fff;
        padding: 2em;
        border-radius: 1.5em;
        width: clamp(29em, 80%, 125em);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    #product_content_frame_img{
        width: 100%;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: minmax(30em, 40em) auto auto;
    }

    #product_content_frame_img_div{
        /* background-color: #4255ff; */
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #product_content_frame_img_name{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 15em auto 10em 10em 10em;
        align-items: center;
        justify-content: center;
        grid-row-gap: 3em;
    }

    .product_content_frame_img_name_div{
        display: flex;
        height: 100%;
        width: 100%;
        align-items: center;
        justify-content: center;
        font-size: 3.5rem;
    }

    #product_content_frame_img_name_div_font1{
        width: 100%;
        font-weight: 800;
        font-size: 5rem;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    #product_content_frame_img_name_div_font2{
        width: 100%;
        font-size: 3rem;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #product_content_frame_img_name_div_font3{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 50% 50%;
    }

    #product_content_frame_img_name_div_font3_1{
        font-size: 3.5rem;
        color: #E1000F;
        text-align: center;
    }
    #product_content_frame_img_name_div_font3_2{
        font-size: 3.5rem;
        color: #4255ff;
        text-align: center;
    }

    #product_content_frame_img_name_div_font4{
        height: 100%;
        width: clamp(10em, 50%, 40em);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .6em;
        border: #0A0044 solid .2rem;
    }

    #product_content_frame_img_name_div_font5{
        font-size: 3rem;
    }

    #product_content_frame_content_ares_ul{
        font-size: 3.5rem;
        color: #0A0044;
        font-weight: 800;
    }

    #product_content_frame_content_ares_ul_div{
        width: 100%;
        height: 10em;
        font-size: 4rem;
        display: flex;
        align-items: center;
        justify-content: center;

    }

    #product_content_frame_content{
        margin-top: 10em;
        width: 100%;
        height: auto;
    }

    #product_content_frame_content_ares,#product_content_frame_content2_content_title{
        width: 80%;
        display: flex;
        align-items: center;
        font-size: 4rem;
        font-weight: 800;
        color: #0A0044;
        border-bottom: #E1000F solid .2rem;
    }

    #product_content_frame_content2_content_content{
        margin-top: 1em;
        width: 100%;
        font-size: 3.5rem;
    }

    #product_content_frame_content2{
        margin-top: 2em;
        width: 100%;
        height: auto;
        /* background-color: #f4f8ff; */
    }




    #product_sort_frame_all{
        margin-top: 5em;
        width: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction:column;

    }

    #product_sort_frame_all_main{
        font-size: 4rem;
        color: #E1000F;
    }

    #product_sort_frame_all_sub{
        font-size: 6rem;
        color: #0A0044;
        font-weight: 800;
        text-align: center;
    }

    #product_sort_frame_all_grid{
        margin-top: 10em;
        width: clamp(57em, 85%, 137em);
        height: auto;
        display: grid;
        grid-template-columns: 94% ;
        /* grid-column-gap: 10%; */
        grid-row-gap: 10em;
        /* background-color: #0A0044; */
    }

    .product_sort_frame_all_grid_div{
        width: 100%;
        padding: 3%;
        background-color: #fff;
        border-radius: 4em;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 35em 15em auto 10em;
        grid-row-gap: 2em;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .product_sort_frame_all_grid_div_img{
        width: 100%;
        height: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .product_sort_frame_all_grid_div_title{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 800;
        font-size: 4.5rem;
        color: #0A0044;
    }

    .product_sort_frame_all_grid_div_sub_title{
        width: 100%;
        height: 100%;
        font-size: 3.5rem;
        text-align: center;
    }

    .product_sort_frame_all_grid_div_sub_button{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .product_sort_frame_all_grid_div_sub_button_div{
        width: 100%;
        height: 60%;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .5em;
        font-size: 3rem;
        text-align: center;
    }
}




@media (min-width:768px) and (max-width:1023px) {
    #cat_main_title{
        width: clamp(15em, 85%, 35em);
        text-align: center;
        margin-top: 1em;
        font-size: 7rem;
        font-weight: 800;
        color: #0A0044;
    }

    #cat_sub_title{
        width: clamp(15em, 85%, 35em);
        margin-top: 1em;
        font-size: 4rem;
        text-align: center;
    }

    #cat_introduce{
        margin-top: 3em;
        width: clamp(57em, 85%, 100em);
        display: grid;
        grid-template-columns: 100%;
        grid-row-gap: 10em;
        place-items:center;
    }

    .cat_introduce_div{
        width: 100%;
        height:clamp(37em, 90%, 100em);
        background-color: #fff;
        display: grid;
        grid-template-columns: clamp(25em, 40%, 37em) auto;
        grid-template-rows: 100%;
        border-radius: 4em;
        overflow: hidden;
        transform: scale(1);
        transition: .2s;
    }


    .cat_introduce_div_div{
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: 1em;
        aspect-ratio: 16/9;
    }

    .cat_introduce_div_div2{
        width: 90%;
        height: 90%;
        overflow: hidden;
        margin: 5%;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 20% 70% 10%;
    }

    .cat_introduce_div_div2_div{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0A0044;
        font-size: 5em;
        font-weight: 800;
    }

    .cat_introduce_div_div2_div2{
        width: 100%;
        height: 100%;
        font-size: 3rem;
        text-align: center;
    }

    .cat_introduce_div_div2_div3{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .cat_introduce_div_div2_div3_div{
        width: 100%;
        border-radius: .5em;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: end;
        font-size: 2.5rem;
    }

    #load_more_button{
        margin-top: 3em;
        border-radius: .5em;
        width: 70%;
        height: 2em;
        color: #0A0044;
        /* border: #0A0044 solid .15em; */
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        font-size: 3rem;
        transition: .2s;
    }


    #product_title{
        margin-top: 5em;
        width: clamp(15em, 85%, 35em);
        font-weight: 800;
        font-size: 7rem;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0A0044;
    }

    #product_sub_title{
        width: clamp(15em, 85%, 35em);
        font-size: 4rem;
    }

    #product_search{
        width: 90%;
        height: 10em;
        background-color:#fff;
        border-radius: 2em;
        overflow: hidden;
        display: grid;
        grid-template-columns: clamp(23em, 40%, 36em)  auto;
        grid-column-gap: 1em;
        grid-template-rows: 100%;
        text-align: center;
        /* border: #0A0044 solid .1em; */
    }

    #product_search div{
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 3rem;
    }

    #product_search_gongneng{
        width: 100%;
        height: 100%;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
    }

    #product_search_svg{
        background-color: #fff;
        color: #4255ff;
        width: 100%;
        height: 100%;
    }

    #product_search_svg_input{
        background-color: #fff;
        width: 100%;
        height: 100%;
    }

    #product_search_svg_input_input{
        width: 100%;
        height: 100%;
        background-color: transparent;
        border: none;
        outline: none;
        font-size: 3rem;
    }

    #product_sort{
        margin-top: 10em;
        width: clamp(57em, 85%, 137em);
        height: 50em;
        /* border: #0A0044 solid .1em; */
        border-radius: 1rem;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 25% 25% 25% 25%;
        /* border: #0A0044 solid .1em; */
        background-color: #fff;
        overflow: hidden;
        text-align: center;
    }

    .product_sort_choice{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        font-size: 4rem;
    }

    .product_sort_dontchoice{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 4rem;
    }


    #display_number{
        margin-top: 3em;
        width: clamp(57em, 85%, 137em);
        text-align: center;
        font-size: 2.5rem;

    }

    #display_product{
        margin-top: 1.5em;
        width: clamp(57em, 85%, 100em);
        height: auto;
        display: grid;
        grid-template-columns: 100%;
        grid-column-gap: 10%;
        grid-row-gap: 10em;
    }

    .display_product_frame{
        margin-top: 1em;
        width: 96%;
        background-color: #fff;
        border-radius: 4em;
        padding: 2%;
        display: grid;
        grid-template-rows: 35em 15em auto 10em;
        grid-template-columns: auto;
        transform: scale(1);
        transition: .2s;
    }


    .display_product_frame_img{
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5%;
    }

    .display_product_frame_title{
        padding-left: 4%;
        padding-right: 4%;
        font-size: 5rem;
        font-weight: 800;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .display_product_frame_submain{
        margin-top: 4%;
        display: flex;
        justify-content: center;
        font-size: 3rem;
        text-align: center;
    }

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

    .display_product_frame_button_button{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 70%;
        border-radius: .5em;
        font-size: 3rem;
    }

    #display_product_page{
        align-items: center;
        justify-content: center;
        margin-top: 4em;
        width: clamp(20em, 80%, 40em);
        height: 3em;
        display: grid;
        grid-template-columns: 20% 55% 20%;
        grid-column-gap: 3%;
        font-size: 3rem;
    }

    #display_product_page_last , #display_product_page_next{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        /* border: #0A0044 solid .1em; */
        border-radius: .3em;
        text-align: center;
        /* background-color: #fff; */
        transition: .2s;
    }


    .display_product_page_number{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_page_number_div{
        border-radius: .3em;
        width: 20%;
        height: 100%;
        margin-right: 5%;
        /* border: #0A0044 solid .1em; */
        display: flex;
        align-items: center;
        justify-content: center;
        /* background-color: #fff; */
        transition: .2s;
    }


    .display_product_page_number_div_currect{
        border-radius: .3em;
        width: 20%;
        height: 100%;
        margin-right: 5%;
        border: #0A0044 solid .1em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        transition: .2s;
    }

    #display_product_sort_frame{
        margin-top: 3em;
        width: clamp(57em, 80%, 100em);
        display: grid;
        grid-template-columns: minmax(25rem, 47em) minmax(25rem, 47em);
        grid-template-rows: auto;
        grid-column-gap: 6em;
        grid-row-gap: 5em;
    }

    .display_product_sort_frame_div{
        width: 100%;
        height: 40em;
        background-color: #fff;
        border-radius: 1em;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 60% 40%;

    }

    .display_product_sort_frame_div_div2_1{
        font-size: 4rem;
        color: #0A0044;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .display_product_sort_frame_div_div2_2{

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_sort_frame_div_div2_2_div{
        width: 90%;
        height: 50%;
        border: #0A0044 solid .1em;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .5em;
        font-size: 3rem;
    }


    #display_product_sort_frame_none,#display_product_sort_frame_none2{
        width: 70%;
        height: 10em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #fff;
        border-radius: 1em;
        font-size: 4rem;
        font-weight: 800;
        letter-spacing: .1rem;
        color: #0A0044;
        grid-column-start: 1;
        grid-column-end: 8;
        grid-row-start: 1;
        grid-row-end: 6;
        text-align: center;
    }





    .product_content_frame_all_top_nav{
        margin-top: 3em;
        width: clamp(29em, 80%, 65em);
        font-size: 2.1rem;
    }

    #product_content_frame_all{
        margin-top: 1em;
        background-color: #fff;
        padding: 2em;
        border-radius: 1.5em;
        width: clamp(29em, 80%, 125em);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    #product_content_frame_img{
        width: 100%;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: minmax(30em, 40em) auto auto;
    }

    #product_content_frame_img_div{
        /* background-color: #4255ff; */
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #product_content_frame_img_name{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 15em auto 10em 10em 10em;
        align-items: center;
        justify-content: center;
        grid-row-gap: 3em;
    }

    .product_content_frame_img_name_div{
        display: flex;
        height: 100%;
        width: 100%;
        align-items: center;
        justify-content: center;
        font-size: 3.5rem;
    }

    #product_content_frame_img_name_div_font1{
        width: 100%;
        font-weight: 800;
        font-size: 5rem;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    #product_content_frame_img_name_div_font2{
        width: 100%;
        font-size: 3rem;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #product_content_frame_img_name_div_font3{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 50% 50%;
    }

    #product_content_frame_img_name_div_font3_1{
        font-size: 3.5rem;
        color: #E1000F;
        text-align: center;
    }
    #product_content_frame_img_name_div_font3_2{
        font-size: 3.5rem;
        color: #4255ff;
        text-align: center;
    }

    #product_content_frame_img_name_div_font4{
        height: 100%;
        width: clamp(10em, 50%, 40em);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .6em;
        border: #0A0044 solid .2rem;
    }

    #product_content_frame_img_name_div_font5{
        font-size: 3rem;
    }

    #product_content_frame_content_ares_ul{
        font-size: 3.5rem;
        color: #0A0044;
        font-weight: 800;
    }

    #product_content_frame_content_ares_ul_div{
        width: 100%;
        height: 10em;
        font-size: 4rem;
        display: flex;
        align-items: center;
        justify-content: center;

    }

    #product_content_frame_content{
        margin-top: 10em;
        width: 100%;
        height: auto;
    }

    #product_content_frame_content_ares,#product_content_frame_content2_content_title{
        width: 80%;
        display: flex;
        align-items: center;
        font-size: 4rem;
        font-weight: 800;
        color: #0A0044;
        border-bottom: #E1000F solid .2rem;
    }

    #product_content_frame_content2_content_content{
        margin-top: 1em;
        width: 100%;
        font-size: 3.5rem;
    }

    #product_content_frame_content2{
        margin-top: 2em;
        width: 100%;
        height: auto;
        /* background-color: #f4f8ff; */
    }




    #product_sort_frame_all{
        margin-top: 5em;
        width: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction:column;

    }

    #product_sort_frame_all_main{
        font-size: 4rem;
        color: #E1000F;
    }

    #product_sort_frame_all_sub{
        font-size: 6rem;
        color: #0A0044;
        font-weight: 800;
        text-align: center;
    }

    #product_sort_frame_all_grid{
        margin-top: 10em;
        width: clamp(57em, 85%, 137em);
        height: auto;
        display: grid;
        grid-template-columns: 94% ;
        /* grid-column-gap: 10%; */
        grid-row-gap: 10em;
        /* background-color: #0A0044; */
    }

    .product_sort_frame_all_grid_div{
        width: 100%;
        padding: 3%;
        background-color: #fff;
        border-radius: 4em;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 35em 15em auto 10em;
        grid-row-gap: 2em;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .product_sort_frame_all_grid_div_img{
        width: 100%;
        height: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .product_sort_frame_all_grid_div_title{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 800;
        font-size: 4.5rem;
        color: #0A0044;
    }

    .product_sort_frame_all_grid_div_sub_title{
        width: 100%;
        height: 100%;
        font-size: 3.5rem;
        text-align: center;
    }

    .product_sort_frame_all_grid_div_sub_button{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .product_sort_frame_all_grid_div_sub_button_div{
        width: 100%;
        height: 60%;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .5em;
        font-size: 3rem;
        text-align: center;
    }
}




@media screen and (min-width:1024px) {
    #cat_main_title{
        width: 80%;
        text-align: center;
        margin-top: 1em;
        font-size: 3rem;
        font-weight: 800;
        color: #0A0044;
    }

    #cat_sub_title{
        width: 80%;
        margin-top: 1em;
        font-size: 1.2rem;
        text-align: center;
    }

    #cat_introduce{
        margin-top: 1.5em;
        width: 85%;
        display: grid;
        grid-template-columns: minmax(19rem, 25rem) minmax(19rem, 25rem) minmax(19rem, 25rem);
        grid-column-gap: 5%;
        grid-row-gap: 3em;
        place-content:center;
    }

    .cat_introduce_div{
        width: 100%;
        height: 15em;
        background-color: #fff;
        display: grid;
        grid-template-columns: minmax(10rem, 0fr) auto;
        grid-template-rows: 100%;
        border-radius: 1em;
        overflow: hidden;
        transform: scale(1);
        transition: .2s;
    }

    .cat_introduce_div:hover{
        box-shadow:#0A0044 0 0 .8em .1em;
        transform: scale(1.05);
        transition: .2s;
        cursor: pointer;
    }

    .cat_introduce_div_div{
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: 1em;
    }

    .cat_introduce_div_div2{
        width: 90%;
        height: 90%;
        overflow: hidden;
        margin: 5%;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 20% 60% 10%;
        grid-row-gap: 5%;
    }

    .cat_introduce_div_div2_div{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0A0044;
        font-size: 1.5em;
        font-weight: 800;
    }

    .cat_introduce_div_div2_div2{
        width: 100%;
        height: 100%;
        font-size: 1rem;
        text-align: center;
    }

    .cat_introduce_div_div2_div3{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .cat_introduce_div_div2_div3_div{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: end;
        font-size: .9rem;
    }


    #load_more_button{
        margin-top: 5em;
        border-radius: .5em;
        width: 10em;
        height: 2.2em;
        color: #0A0044;
        /* border: #0A0044 solid .15em; */
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        font-size: 1rem;
    }

    #load_more_button:hover{
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        transition: .2s;
    }

    #product_title{
        margin-top: 3em;
        width: 75%;
        font-weight: 800;
        font-size: 3rem;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0A0044;
    }

    #product_sub_title{
        width: auto;
        font-size: 1rem;
    }

    #product_search{
        width: 35rem;
        height: 2em;
        background-color:#fff;
        border-radius: .5em;
        overflow: hidden;
        display: grid;
        grid-template-columns: minmax(9rem, 0fr) auto;
        grid-column-gap: 1em;
        grid-template-rows: 100%;
        letter-spacing: .1rem;
    }

    #product_search div{
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
    }

    #product_search_gongneng{
        width: 100%;
        height: 100%;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
    }

    #product_search_svg{
        background-color: #fff;
        color: #4255ff;
        width: 100%;
        height: 100%;
    }

    #product_search_svg_input{
        background-color: #fff;
        width: 100%;
        height: 100%;
    }

    #product_search_svg_input_input{
        width: 100%;
        height: 100%;
        background-color: transparent;
        border: none;
        outline: none;
        font-size: 1rem;
    }

    #product_sort{
        margin-top: 2em;
        width: 40rem;
        height: 3em;
        /* border: #0A0044 solid .1em; */
        border-radius: .5rem;
        display: grid;
        grid-template-columns: 25% 25% 25% 25%;
        grid-template-rows: 100%;
        /* border: #0A0044 solid .1em; */
        overflow: hidden;
        background-color: #fff;
    }

    #product_sort div{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
        text-align: center;
    }

    .product_sort_choice{
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
    }

    .product_sort_dontchoice:hover{
        background-color: #0A0044;
        color: #f4f8ff;
        transition: .2s;
        cursor: pointer;
        text-align: center;
    }

    #display_number{
        margin-top: 3em;
        width: 100%;
        text-align: center;

    }

    #display_product{
        margin-top: 1.5em;
        height: auto;
        width:80%;
        display: grid;
        grid-template-columns: minmax(13rem, 18rem) minmax(13rem, 18rem) minmax(13rem, 18rem) minmax(13rem, 18rem);
        grid-column-gap: 5%;
        grid-row-gap: 3em;
        place-content:center;
    }

    .display_product_frame{
        width: 100%;
        height: 25em;
        background-color: #fff;
        border-radius: 1em;
        padding: 2%;
        display: grid;
        grid-template-rows: 30% 20% 40% 10%;
        grid-template-columns: auto;
        text-align: center;
        transform: scale(1);
        transition: .2s;
    }

    .display_product_frame:hover{
        box-shadow:#0A0044 0 0 .8em .1em;
        transform: scale(1.05);
        transition: .2s;
        cursor: pointer;
    }

    .display_product_frame_img{
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5%;
    }

    .display_product_frame_title{
        padding-left: 4%;
        padding-right: 4%;
        font-size: 1.5rem;
        font-weight: 800;
        color: #0A0044;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_frame_submain{
        display: flex;
        justify-content: center;
        font-size: 1rem;
        text-align: center;
    }

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

    .display_product_frame_button_button{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    #display_product_page{
        align-items: center;
        justify-content: center;
        margin-top: 4em;
        width: 30rem;
        height: 1.8em;
        display: grid;
        grid-template-columns: 20% 55% 20%;
        grid-column-gap: 3%;
        -moz-user-select: none; /*火狐*/
        -webkit-user-select: none; /*webkit浏览器*/
        -ms-user-select: none; /*IE10*/
        -khtml-user-select: none; /*早期浏览器*/
        user-select: none;
    }

    #display_product_page_last , #display_product_page_next{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        /* border: #0A0044 solid .1em; */
        border-radius: .3em;
        text-align: center;
        /* background-color: #fff; */
        transition: .2s;
    }

    #display_product_page_last:hover , #display_product_page_next:hover{
        background-color: #0A0044;
        cursor: pointer;
        color: #f4f8ff;
        font-weight: 800;
        transition: .2s;
    }

    .display_product_page_number{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_page_number_div{
        border-radius: .3em;
        width: 20%;
        height: 100%;
        margin-right: 5%;
        /* border: #0A0044 solid .1em; */
        display: flex;
        align-items: center;
        justify-content: center;
        /* background-color: #fff; */
        transition: .2s;
    }

    .display_product_page_number_div:hover{
        background-color: #0A0044;
        cursor: pointer;
        color: #f4f8ff;
        font-weight: 800;
        transition: .2s;
    }

    .display_product_page_number_div_currect{
        border-radius: .3em;
        width: 20%;
        height: 100%;
        margin-right: 5%;
        border: #0A0044 solid .1em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        transition: .2s;
    }

    #display_product_sort_frame{
        margin-top: 1em;
        width: 70%;
        /* height: auto; */
        display: grid;
        grid-template-columns: 23% 23% 23% 23%;
        grid-template-rows: auto;
        grid-column-gap: 2.5%;
        grid-row-gap: 1em;
    }

    .display_product_sort_frame_div{
        width: 100%;
        height: 10em;
        background-color: #fff;
        border-radius: 1em;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 60% 40%;

    }

    .display_product_sort_frame_div_div2_1{

        font-size: 1.5rem;
        color: #0A0044;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .display_product_sort_frame_div_div2_2{

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .display_product_sort_frame_div_div2_2_div{
        width: 50%;
        height: 50%;
        border: #0A0044 solid .1em;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .5em;
    }

    .display_product_sort_frame_div_div2_2_div:hover{
        background-color: #0A0044;
        color: #f4f8ff;
        font-weight: 800;
        cursor: pointer;
        transition: .2s;
    }

    #display_product_sort_frame_none,#display_product_sort_frame_none2{
        width: 70%;
        height: 10em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #fff;
        border-radius: 1em;
        font-size: 2rem;
        font-weight: 800;
        letter-spacing: .1rem;
        color: #0A0044;
        grid-column-start: 1;
        grid-column-end: 20;
        grid-row-start: 1;
        grid-row-end: 6;
        text-align: center;
    }

















    .product_content_frame_all_top_nav{
        margin-top: 3em;
        width: 80%;
        font-size: .9rem;
    }

    #product_content_frame_all{
        margin-top: 1em;
        background-color: #fff;
        padding: 2em;
        border-radius: 1.5em;
        width: 80%;
    }

    #product_content_frame_img{
        width: 100%;
        height: 20em;
        /* background-color: #0A0044; */
        display: grid;
        grid-template-columns: 40% 57%;
        grid-column-gap: 3%;
        grid-template-rows: 100%;
    }

    #product_content_frame_img_div{
        /* background-color: #4255ff; */
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #product_content_frame_img_name{
        /* background-color: #4255ff; */
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 15% 35% 20% 20% 10%;
        align-items: center;
        justify-content: center;
    }

    .product_content_frame_img_name_div{
        display: flex;
        align-content: center;
        height: 100%;
        align-items: center;
        /* justify-content: center; */
    }

    #product_content_frame_img_name_div_font1{
        font-weight: 800;
        font-size: 2rem;
        color: #0A0044;
    }

    #product_content_frame_img_name_div_font2{
        color: #0A0044;
    }

    #product_content_frame_img_name_div_font3{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 50% 50%;
    }

    #product_content_frame_img_name_div_font3_1{
        font-size: 1rem;
        color: #E1000F;
    }
    #product_content_frame_img_name_div_font3_2{
        font-size: .8rem;
        color: #4255ff;
    }

    #product_content_frame_img_name_div_font4{
        /* background-color: #0A0044; */
        height: 60%;
        width: 20%;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .6em;
        border: #0A0044 solid .2rem;
    }

    #product_content_frame_img_name_div_font5{
        font-size: .8rem;
    }

    #product_content_frame_content_ares_ul{
        font-size: 1.2rem;
        color: #0A0044;
        font-weight: 800;
    }

    #product_content_frame_content_ares_ul_div{
        width: 100%;
        height: 10em;
        font-size: 2rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #product_content_frame_img_name_div_font4:hover{
        color: #f4f8ff;
        font-weight: 800;
        background-color: #0A0044;
        cursor: pointer;
        transition: .3s;
    }

    #product_content_frame_content{
        margin-top: 2em;
        width: 100%;
        height: auto;
        /* background-color: #f4f8ff; */
    }

    #product_content_frame_content_ares,#product_content_frame_content2_content_title{
        width: 35%;
        display: flex;
        align-items: center;
        font-size: 1.5rem;
        font-weight: 800;
        color: #0A0044;
        border-bottom: #E1000F solid .2rem;
    }

    #product_content_frame_content2_content_content{
        margin-top: 1em;
        width: 100%;
    }

    #product_content_frame_content2{
        margin-top: 2em;
        width: 100%;
        height: auto;
        /* background-color: #f4f8ff; */
    }















    #product_sort_frame_all{
        margin-top: 3em;
        width: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction:column;

    }

    #product_sort_frame_all_main{
        font-size: 1rem;
        color: #E1000F;
    }

    #product_sort_frame_all_sub{
        font-size: 2.5rem;
        color: #0A0044;
        font-weight: 800;
        letter-spacing: .1em;
        text-align: center;
    }

    #product_sort_frame_all_grid{
        margin-top: 3em;
        width: 100%;
        height: auto;
        display: grid;
        grid-template-columns: minmax(11rem, 18rem) minmax(11rem, 18rem) minmax(11rem, 18rem) minmax(11rem, 18rem);
        grid-column-gap: 3em;
        grid-row-gap: 3em;
        place-content:center;
    }

    .product_sort_frame_all_grid_div{
        height: 25em;
        width: 100%;
        padding: 3%;
        background-color: #fff;
        border-radius: 1em;
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: 30% 20% 40% 10%;
        align-items: center;
        justify-content: center;
        text-align: center;
        transform: scale(1);
        transition: .2s;
        overflow:hidden;
    }

    .product_sort_frame_all_grid_div:hover{
        box-shadow:#0A0044 0 0 1em .1em;
        transform: scale(1.05);
        transition: .2s;
        cursor: pointer;
    }

    .product_sort_frame_all_grid_div_img{
        width: 100%;
        height: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .product_sort_frame_all_grid_div_title{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 800;
        font-size: 1.4rem;
        color: #0A0044;
    }

    .product_sort_frame_all_grid_div_sub_title{
        width: 100%;
        height: 100%;
        font-size: 1rem;
        text-align: center;
        overflow:hidden;
    }

    .product_sort_frame_all_grid_div_sub_button{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .product_sort_frame_all_grid_div_sub_button_div{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: .5em;
        text-align: center;
    }



}