/*--for m91_head--*/
/*--for m91_head--*/
@charset "UTF-8";

.m92-sitetop {width: 100%;height: 35px;background: #000;display: none;}
.m92-sitetop span{width:50px;height:50px;line-height:50px;text-align:center;cursor:pointer;display: none;}
.m92-sitetop span.mo-header-search{margin-right:95px;}
.m92-sitetop span i{color:#333;font-size:24px;}
.m92-mo-leftmenu{background:#F5F5F5;position:fixed;top:0;left:0;bottom:0;overflow-x:hidden;box-sizing:content-box;width:70%;-webkit-overflow-scrolling:touch;z-index:105!important;-webkit-transition:all .4s cubic-bezier(0.7,0,0.2,1);-ms-transition:all .4s cubic-bezier(0.7,0,0.2,1);transition:all .4s cubic-bezier(0.7,0,0.2,1);-webkit-box-shadow:0 0 40px rgba(82,85,90,0.1);box-shadow:0 0 40px rgba(82,85,90,0.1);-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%)}
.m92-mo-leftmenu .tit{height:50px;line-height:50px;background:#353535;}
.m92-mo-leftmenu .tit h6{float:left;color:#fff;padding:0 0 0 20px;font-size:20px;font-weight:bold;font-family: "Times New Roman";}
.m92-mo-leftmenu .tit span{float:right;cursor:pointer;width:50px;text-align:center;}
.m92-mo-leftmenu .tit span i{color:#fff;font-size:16px;}
.m92-mo-leftmenu > ul{}
.m92-mo-leftmenu > ul > li{line-height:50px;font-size:15px;border-top:2px solid #e5e5e5;position:relative;}
.m92-mo-leftmenu > ul > li > a{padding:0 0 0 20px;}
.m92-mo-leftmenu > ul > li > i {position:absolute;color:#333;font-size:12px;top:5px;right:0;z-index:1;width:50px;line-height:40px;text-align:center;cursor:pointer;}
.m92-mo-leftmenu > ul > li.active{}
.m92-mo-leftmenu ul li a{color:#333;display: block;}
.m92-mo-leftmenu ul li a:hover{text-decoration: none;}
.m92-mo-leftmenu ul li ul{display:none;padding-bottom:10px;}
.m92-mo-leftmenu ul li ul li{line-height:35px;}
.m92-mo-leftmenu ul li ul li a{background:url("../images/d.png") no-repeat 25px center;padding:0 0 0 40px;}
.menu-transitioning{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}

/*---header---*/
.m92-header{height:95px;position: relative;top: 0;left: 0;width: 100%;z-index: 20;background: rgb(255 255 255 / 0.7);/* border-top: 5px solid var(--color-active); */}
.m92-header.header-fix {position: fixed;top: 0;left: 0;right: 0;z-index: 300;}
.m92-header .wp{height:100%;display:flex;justify-content:space-between;align-items:center;}
.m92-header.header-fix .wp2 {background: transparent;}
.m92-header .logo img {height: 80px;}
.m92-header .nav > ul{display:-webkit-flex;display:flex;}
.m92-header .nav > ul > li{position:relative;padding: 0 30px;border-bottom:2px solid transparent;}
.m92-header .nav > ul > li > a{display:block;font-size: 20px;color: #4b5563;height:70px;line-height:70px;position:relative;z-index:20;text-transform: capitalize;font-weight: 500;}
.m92-header .nav > ul > li > a > i{display:inline-block;font-size:10px;vertical-align:middle;transition:all 0.3s ease 0s;margin-left: 10px;}
.m92-header .nav > ul > li:nth-child(3){position:static;}
.m92-header .nav > ul > li > ul{position:absolute;width: 260px;height:auto;left:-30px;text-align:left;top: 100%;z-index:100;padding:10px;background:#fff;transform:rotate3d(1,0,0,-90deg);transform-origin:0 0 0;opacity:0;transition: transform 0.5s, opacity 0.3s;box-shadow:rgba(0,0,0,0.14) 0px -6px 9px 0px;left: 0;right: 0;}
.m92-header .nav > ul > li > ul::before{/* content:''; */position:absolute;left: 50%;margin:0;top:-8px;overflow:hidden;display:inline-block;border-right:8px solid transparent;border-bottom:8px solid #fff;border-left:8px solid transparent;}
.m92-header .nav > ul > li > ul li{border-bottom:1px solid #EDEDED;position:relative;}
.m92-header .nav > ul > li > ul li:last-child{border:none;}
.m92-header .nav > ul > li > ul li > a{display:block;border-radius:4px;padding:10px 8px;color:#333;font-size: 17px;line-height:21px;text-transform:capitalize;}
.m92-header .nav > ul > li > ul > li > a{padding-right:20px;}
.m92-header .nav > ul > li > ul li > a i{position:absolute;right:10px;top:10px;font-size:11px;}
.m92-header .nav > ul > li > ul li:hover > a{background:var(--color-active);color:#fff;}
.m92-header .nav > ul > li > ul.two {display:flex;padding: 40px 80px;width:100%;}
.m92-header .nav > ul > li > ul.two > li{border-bottom:1px solid #EDEDED;position:relative;flex: 1;padding: 0 30px;}
.m92-header .nav > ul > li > ul.two > li> a{font-weight: bold;font-size: 20px;}
.m92-header .nav ul.three{}
.m92-header .nav ul.three li{}
.m92-header .nav > ul > li > ul li ul{left:260px;top:0;}

.m92-header .nav > ul > li:hover,.m92-header .nav > ul > li.active{border-color: var(--color-active);}
.m92-header .nav > ul > li:hover > a,.m92-header .nav > ul > li.active > a{color:var(--color-active);}
.nav > ul > li:hover > a > i{transform:rotate(180deg);}

.m92-header .nav > ul li:hover > ul{opacity:1;transform:rotate3d(0,0,0,0);}
.m92-header .header-right{display:flex;align-items:center;position:relative;z-index:20;width: 22%;align-items: center;}
.m92-header .header-right .header-lang{position:relative;z-index:200;width: 90px;margin-left: 10px;}
.m92-header .header-right .header-lang .box{height:32px;cursor:pointer;display:flex;justify-content:center;align-items:center;}
.m92-header .header-right .header-lang .box em{margin:0 5px;line-height:1;font-size:16px;color:#666;text-transform:uppercase;font-weight: 500;}
.m92-header .header-right .header-lang .box i{line-height:1;font-size: 25px;text-align:center;color:#666;}
.m92-header .header-right .header-lang .box i:last-child {font-size: 16px;}
.m92-header .header-right .header-lang .lang-box{width:200px;padding:15px;position:absolute;right:0;top:42px;z-index:200;background:#fff;transform:translate3d(0,10px,0);opacity:0;visibility:hidden;transition:all .4s ease 0s;box-shadow:0 0 10px rgba(63,62,62,0.2);}
.m92-header .header-right .header-lang .lang-box::before{content:'';position:absolute;right:37px;top:-8px;overflow:hidden;border-right:8px solid transparent;border-bottom:8px solid #fff;border-left:8px solid transparent;display:block;}
.m92-header .header-right .header-lang ul{max-height:160px;overflow-y:scroll;padding:5px 10px;border:1px solid #e5e5e5;display:flex;flex-wrap:wrap;}
.m92-header .header-right .header-lang ul li{line-height:20px;padding:5px 0;border-bottom:1px solid #f5f5f5;width:50%;}
.m92-header .header-right .header-lang ul li:last-child{border:none;}
.m92-header .header-right .header-lang ul li a{color:#333;font-size:12px;display:block;}
.m92-header .header-right .header-lang ul li a:hover{color:var(--color-active);}
.m92-header .header-right .header-lang ul li img{vertical-align:middle;margin-right:7px;}
.m92-header .header-right .header-lang:hover .lang-box{opacity:1;visibility:visible;transform:translate3d(0,0,0);}
.m92-header .header-right .top-right .line{width:1px;height:17px;background:#B0B0B0;overflow:hidden;margin:0 20px;}
.m92-header .search{position:relative;cursor: pointer;flex: 1;text-align: right;}
.m92-header .search .search-show {height: 40px;position: relative;z-index: 1;}
.m92-header .search .search-show i{font-size: 24px;color: #333;line-height: 40px;}
.m92-header .search .serchbox {display: flex;width: 40px;height: 40px;background: #fff;border-radius: 20px;overflow: hidden;padding: 0 10px;transition:all .4s ease 0s;box-shadow: 0 0 3px rgba(0,0,0,.1);align-items: center;position: absolute;top: 0;right: 0;z-index: 10;opacity: 0;visibility: hidden;}
.m92-header .search .serchbox .submit_text {flex: 1;width: 100%;font-size: 14px;}
.m92-header .search .serchbox .submit_btn {background: transparent;line-height: 1;padding: 0;cursor: pointer;}
.m92-header .search .serchbox .submit_btn i {font-size: 22px;color: #333;}
.m92-header .search .serchbox .close i{font-size: 20px;color: #666;margin-left: 20px;}
.m92-header .search.active .search-show {opacity: 0;visibility: hidden;}
.m92-header .search.active .serchbox {width: 100%;opacity: 1;visibility: visible;}
.m92-search-box{opacity: 0;visibility: hidden;transition: all .4s ease 0s;transform: translate3d(0,-10px,0);-webkit-transform: translate3d(0,-10px,0);position:absolute;z-index:9999;width:100%;left:0;right:0;top:90px;background:#fff;padding:25px 0;-webkit-backdrop-filter: blur(6px);backdrop-filter: blur(6px);}
.m92-search-box.active {opacity: 1;visibility: visible;transform: translate3d(0,0,0);-webkit-transform: translate3d(0,0,0);}
.m92-header.header-fix .m92-search-box {position: fixed;top: 90px;}
.m92-search-box .close{position:absolute;right:30px;top:calc(50% - 11px);line-height:22px;height:22px;}
.m92-search-box .close i{font-size:21px;color:#fff;}
.m92-search-box .serchbox{width:700px;margin:0 auto;position:relative;}
.m92-search-box .serchbox .submit_text{background:#fff;width:100%;height:47px;line-height:47px;float:left;color:#111;padding:0 90px 0 15px;font-size:15px;}
.m92-search-box .serchbox .submit_btn{position:absolute;right:0;top:0;width:70px;height:47px;line-height:47px;background:var(--bg-color);text-align:center;display:block;cursor:pointer;}
.m92-search-box .serchbox .submit_btn i{font-size:25px;color:#fff;}

@media screen and (max-width: 1550px) {
.m92-header .logo img {height: 65px;}
.m92-header .nav > ul > li > a {font-size: 17px;}
.m92-header .nav > ul > li {padding: 0 20px;}
}
 
@media screen and (max-width: 1440px) {
}
@media screen and (max-width: 1367px) {
.m92-header .logo img {height: 60px;}
.m92-header .nav > ul > li > a {font-size: 16px;}
.m92-header .nav > ul > li {padding: 0 20px;}
}
@media screen and (max-width: 1280px) {
}
@media screen and (max-width: 992px) {
.m92-header .nav {display:none;}
.m92-sitetop {height: 50px;background: #333;display: block;}
.m92-sitetop span {display: block;}
.m92-sitetop span i {color: #fff;}
.m92-header .search {display: none;}
.m92-header .header-right {position: static;width: auto;}  
.m92-header {height: auto;position: static;padding: 15px 0;}
.m92-header .wp {justify-content: center;}
.m92-header .logo img {height: 48px;}
.m92-header .header-right .header-lang {position: absolute;right: 10px;top: 10px;} 
.m92-header .header-right .header-lang .box {background: #fff;border-radius: 20px;}
}
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 480px) {
}
@media screen and (max-width: 400px) {
}

/*--for m68_sidebanner--*/
@charset "utf-8";
/*----------------------------*/
 
/* =========================
   SIDE BANNER
========================= */
.m68-sidebanner{
    position: relative;
    overflow: hidden;
    background: #000;
}

.m68-sidebanner .banner-media{
    position: relative;
    height: 520px;
    overflow: hidden;
}

.m68-sidebanner .banner-media::after{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to right,
        rgba(0,0,0,.58),
        rgba(0,0,0,.28),
        rgba(0,0,0,.45)
    );
    z-index: 1;
}

.m68-sidebanner img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1);
    transition: transform 7s ease;
}

.m68-sidebanner:hover img{
    transform: scale(1.06);
}

/* overlay */
.m68-sidebanner .banner-overlay{
    position: absolute;
    inset: 0;
    background:
    radial-gradient(circle at top right,
    rgba(255,255,255,.12),
    transparent 30%);
    z-index: 2;
}

/* content */
.m68-sidebanner .txt{
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.m68-sidebanner .txt .wp{
    max-width: 900px;
}

/* subtitle */
.m68-sidebanner .banner-subtitle{
    color: rgba(255,255,255,.75);
    font-size: 13px;
    letter-spacing: 4px;
    text-transform: uppercase;
    margin-bottom: 18px;
    font-weight: 500;
}

/* title */
.m68-sidebanner .txt h1,
.m68-sidebanner .txt h2{
    color: #fff;
    font-size: 50px;
    line-height: 1.1;
    font-weight: 700;
    margin: 0;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* line */
.m68-sidebanner .banner-line{
    width: 90px;
    height: 4px;
    background: var(--color-active);
    margin: 28px auto;
    border-radius: 20px;
    position: relative;
}

.m68-sidebanner .banner-line::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 14px;
    background: #fff;
    border-radius: 50%;
    transform: translate(-50%,-50%);
}

/* breadcrumb text */
.m68-sidebanner .txt p{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 26px;
    border-radius: 50px;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.15);

    color: rgba(255,255,255,.92);
    font-size: 15px;
    font-weight: 500;
    margin: 0;
}

.m68-sidebanner .txt p i{
    font-size: 15px;
}

.m68-sidebanner .txt p a{
    color: #fff;
    transition: all .3s ease;
}

.m68-sidebanner .txt p a:hover{
    color: var(--color-active);
}

/* =========================
   PATH
========================= */
.path{
    position: relative;
    background: #fff;
    border-bottom: 1px solid rgba(0,0,0,.06);
}

.path::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 120px;
    height: 2px;
    background: var(--color-active);
}

.path p{
    height: 60px;
    line-height: 60px;
    margin: 0;

    color: #666;
    font-size: 15px;
    font-weight: 500;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.path p i{
    margin-right: 8px;
    color: var(--color-active);
    font-size: 14px;
}

.path p a{
    color: #333;
    transition: all .3s ease;
}

.path p a:hover{
    color: var(--color-active);
}

/* =========================
   RESPONSIVE
========================= */
@media(max-width:1200px){

    .m68-sidebanner .banner-media{
        height: 420px;
    }

    .m68-sidebanner .txt h1,
    .m68-sidebanner .txt h2{
        font-size: 52px;
    }

}

@media(max-width:768px){

    .m68-sidebanner .banner-media{
        height: 240px;
    }

    .m68-sidebanner .txt h1,
    .m68-sidebanner .txt h2{
        font-size: 34px;
    }

    .m68-sidebanner .banner-subtitle{
        font-size: 12px;
        letter-spacing: 2px;
    }

    .m68-sidebanner .txt p{
        padding: 10px 18px;
        font-size: 13px;
        line-height: 1.6;
        border-radius: 30px;
    }

	.m68-sidebanner .txt p {
        font-size: 13px;
        padding: 6px 12px;
    }
    .m68-sidebanner .banner-line{margin: 10px auto;width: 60px;}
	.m68-sidebanner .txt p {font-size: 14px;padding: 8px 12px;}
    .path p{
        height: 52px;
        line-height: 52px;
        font-size: 14px;
    }

}
@media screen and (max-width: 1550px) {
.m68-sidebanner .txt h1, .m68-sidebanner .txt h2 {font-size: 46px;}
.m68-sidebanner .txt h1::after, .m68-sidebanner .txt h2::after {height: 5px;margin: 17px auto 0;}
.m68-sidebanner .txt p {font-size: 17px;margin: 27px 0 0;}
}

@media screen and (max-width: 1367px) {
.m68-sidebanner .txt h1, .m68-sidebanner .txt h2 {font-size: 40px;}
.m68-sidebanner .txt h1::after, .m68-sidebanner .txt h2::after {height: 4px;margin: 14px auto 0;}
.m68-sidebanner .txt p {font-size: 16px;margin: 21px 0 0;}
}

@media screen and (max-width: 768px) {
.m68-sidebanner .txt h1, .m68-sidebanner .txt h2 {font-size: 28px;}
.m68-sidebanner .txt h1::after, .m68-sidebanner .txt h2::after {margin: 10px auto 0;}
.m68-sidebanner .txt p {margin: 14px 0 0;}
}

@media screen and (max-width: 480px) {
.m68-sidebanner .txt h1, .m68-sidebanner .txt h2 {font-size: 24px;}
}

@media screen and (max-width:400px) {
.m68-sidebanner .txt h1, .m68-sidebanner .txt h2 {font-size: 22px;}
.m68-sidebanner .txt h1::after, .m68-sidebanner .txt h2::after {margin: 5px auto 0;height: 3px;}
.m68-sidebanner .txt p {margin: 10px 0 0;}

}

/*--for m122_product_list--*/
/* =========================================
   PRODUCT LIST PAGE
========================================= */

.pro-list-box{
    padding:clamp(50px,5vw,90px) 0;
    background:
    linear-gradient(to bottom,#fafbfd 0%,#f5f7fa 100%);
}

.display_flex{
    display:flex;
    align-items:flex-start;
    gap:35px;
}

.flex_wrap{
    flex-wrap:wrap;
}

/* =========================================
   LEFT SIDEBAR
========================================= */
.main-left{
    width:320px;
    position:relative;
}

.main-right{
    flex:1;
    min-width:0;
}

/* =========================================
   SEARCH
========================================= */
.side-search{
    margin-bottom:22px;
    padding:24px;
    background:#fff;
    border-radius:24px;

    border:1px solid rgba(0,0,0,.05);

    box-shadow:
    0 10px 35px rgba(0,0,0,.04);
}

.side-search form{
    position:relative;
}

.side-search .submit_text{
    width:100%;
    height:56px;
    line-height:56px;

    padding:0 60px 0 20px;

    border:none;
    border-radius:16px;

    background:#f7f9fc;

    font-size:15px;
    color:#111827;

    transition:all .3s ease;
}

.side-search .submit_text:focus{
    background:#fff;
    box-shadow:0 0 0 3px rgba(34,132,231,.08);
}

.side-search .submit_text::placeholder{
    color:#9aa3af;
}

.side-search .submit_btn{
    position:absolute;
    top:50%;
    right:8px;

    width:42px;
    height:42px;

    border:none;
    border-radius:12px;

    background:var(--color-active);

    transform:translateY(-50%);
    cursor:pointer;

    transition:all .3s ease;
}

.side-search .submit_btn i{
    color:#fff;
    font-size:16px;
}

.side-search .submit_btn:hover{
    transform:translateY(-50%) scale(1.05);
}

/* =========================================
   SIDE MENU
========================================= */
.sidemenu{
    position:sticky;
    top:25px;

    background:#fff;
    border-radius:24px;

    padding:28px;

    border:1px solid rgba(0,0,0,.05);

    box-shadow:
    0 10px 35px rgba(0,0,0,.04);
}

.sidemenu h2,
.sidemenu h3{
    font-size:26px;
    color:#111827;
    font-weight:700;

    margin-bottom:25px;
    padding-bottom:18px;

    position:relative;
    border-bottom:1px solid #eef1f4;
}

.sidemenu h2::after,
.sidemenu h3::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-1px;

    width:65px;
    height:2px;

    background:var(--color-active);
}

/* 一级菜单 */
.sidemenu > ul > li{
    border-bottom:1px solid #eef1f4;
}

.sidemenu > ul > li:last-child{
    border-bottom:none;
}

.sidemenu > ul > li h5{
    position:relative;

    display:flex;
    align-items:center;

    min-height:58px;

    font-size:16px;
    font-weight:600;
}

.sidemenu > ul > li h5 a{
    flex:1;

    position:relative;

    padding-left:18px;
    padding-right:40px;

    color:#374151;

    transition:all .3s ease;
}

.sidemenu > ul > li h5 a::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;

    width:6px;
    height:6px;

    border-radius:50%;
    background:var(--color-active);

    transform:translateY(-50%);
}

.sidemenu > ul > li h5 a:hover{
    color:var(--color-active);
    transform:translateX(4px);
}

.sidemenu > ul > li h5 span{
    position:absolute;
    right:0;
    top:50%;

    width:30px;
    height:30px;

    border-radius:50%;

    background:#f3f6fa;

    transform:translateY(-50%);

    transition:all .3s ease;
}

.sidemenu > ul > li h5 span::after{
    content:"\e699";
    font-family:"qico";

    position:absolute;
    left:50%;
    top:50%;

    font-size:14px;
    color:#6b7280;

    transform:translate(-50%,-50%);
}

.sidemenu > ul > li.active h5 a{
    color:var(--color-active);
}

.sidemenu > ul > li.active h5 span{
    background:var(--color-active);
}

.sidemenu > ul > li.active h5 span::after{
    color:#fff;
    transform:translate(-50%,-50%) rotate(180deg);
}

/* 二级菜单 */
.sidemenu > ul > li ul{
    display:none;
    padding:5px 0 12px 18px;
}

.sidemenu > ul > li ul li{
    margin-bottom:6px;
}

.sidemenu > ul > li ul li:last-child{
    margin-bottom:0;
}

.sidemenu > ul > li ul li a{
    display:block;

    position:relative;

    padding:10px 15px;

    border-radius:12px;

    color:#6b7280;
    font-size:14px;

    transition:all .3s ease;
}

.sidemenu > ul > li ul li a::before{
    content:"";
    width:4px;
    height:4px;

    border-radius:50%;

    background:#b0b8c3;

    position:absolute;
    left:0;
    top:50%;

    transform:translateY(-50%);
}

.sidemenu > ul > li ul li a:hover{
    background:#f6f9fc;
    color:var(--color-active);
    padding-left:20px;
}

/* =========================================
   TOP INTRO
========================================= */
.pro-top{
    margin-bottom:30px;

    background:#fff;
    border-radius:28px;

    padding:40px 45px;

    border:1px solid rgba(0,0,0,.05);

    box-shadow:
    0 10px 35px rgba(0,0,0,.04);

    position:relative;
    overflow:hidden;
}

.pro-top::before{
    content:"";
    position:absolute;
    right:-80px;
    top:-80px;

    width:220px;
    height:220px;

    border-radius:50%;

    background:
    radial-gradient(rgba(34,132,231,.08),transparent 70%);
}

.pro-top h1{
    font-size:clamp(32px,3vw,48px);
    line-height:1.2;
    font-weight:700;
    color:#111827;

    margin-bottom:16px;
}

.pro-top h3{
    font-size:clamp(32px,3vw,48px);
    line-height:1.2;
    font-weight:700;
    color:#111827;

    margin-bottom:16px;
}

.pro-top .t{
    max-width:900px;

    font-size:16px;
    line-height:1.9;
    color:#6b7280;
}

.pro-top .t p+p{
    margin-top:12px;
}

/* =========================================
   PRODUCT LIST
========================================= */
.pro-list ul{
    display:flex;
    flex-wrap:wrap;
    margin:-14px;
}

.pro-list ul li{
    width:33.3333%;
    padding:14px;
}

/* card */
.pro-list ul li .box{
    height:100%;

    background:#fff;

    border-radius:24px;
    overflow:hidden;

    border:1px solid rgba(0,0,0,.05);

    transition:all .4s ease;

    box-shadow:
    0 8px 30px rgba(0,0,0,.03);
}

.pro-list ul li:hover .box{
    transform:translateY(-8px);

    box-shadow:
    0 18px 45px rgba(0,0,0,.08);
}

/* image */
.pro-list ul li .pic{
    display:block;
    overflow:hidden;
    position:relative;
    background:#f7f7f7;
}

.pro-list ul li .pic::after{
    content:"";
    position:absolute;
    inset:0;

    background:
    linear-gradient(to top,
    rgba(0,0,0,.15),
    transparent);

    opacity:0;

    transition:all .4s ease;
}

.pro-list ul li .pic img{
    width:100%;
    aspect-ratio:1/1;
    object-fit:cover;

    transition:transform .7s ease;
}

.pro-list ul li:hover .pic img{
    transform:scale(1.08);
}

.pro-list ul li:hover .pic::after{
    opacity:1;
}

/* text */
.pro-list ul li .txt{
    padding:26px 24px 28px;
    text-align:center;
}

.pro-list ul li .txt h6{
    margin:0;
}

.pro-list ul li .txt h6 a{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;

    min-height:52px;

    font-size:19px;
    line-height:1.5;
    font-weight:600;
    color:#111827;

    transition:all .3s ease;
}

.pro-list ul li:hover .txt h6 a{
    color:var(--color-active);
}

/* button */
.pro-list ul li .txt .add-to-cart{
    margin-top:22px;
}

.pro-list ul li .txt .add-to-cart a{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:150px;
    height:48px;

    padding:0 24px;

    border-radius:999px;

    background:#f4f7fb;

    color:#374151;
    font-size:14px;
    font-weight:600;
    letter-spacing:.5px;
    text-transform:uppercase;

    transition:all .35s ease;
}

.pro-list ul li .txt .add-to-cart a:hover{
    background:var(--color-active);
    color:#fff;

    transform:translateY(-2px);
}

/* =========================================
   RESPONSIVE
========================================= */
@media screen and (max-width:1280px){

    .main-left{
        width:290px;
    }

    .pro-list ul li .txt{
        padding:22px 20px 24px;
    }

}

@media screen and (max-width:992px){

    .main-left,
    .main-right{
        width:100%;
        flex:none;
    }

    .main-right{
        margin-top:10px;
    }

    .sidemenu{
        position:relative;
        top:auto;
    }

    .pro-list ul li{
        width:50%;
    }

}

@media screen and (max-width:768px){

    .pro-list-box{
        padding:40px 0;
    }

    .display_flex{
        gap:20px;
    }

    .side-search,
    .sidemenu,
    .pro-top{
        border-radius:20px;
    }

    .side-search,
    .sidemenu{
        padding:20px;
    }

    .pro-top{
        padding:30px 24px;
    }

    .pro-top h1{
        font-size:28px;
    }

    .pro-top .t{
        font-size:15px;
    }

    .pro-list ul{
        margin:-10px;
    }

    .pro-list ul li{
        padding:10px;
    }

    .pro-list ul li .txt h6 a{
        font-size:17px;
        min-height:48px;
    }

}

@media screen and (max-width:576px){

    .pro-list ul li{
        width:100%;
    }

    .pro-list ul li .txt{
        padding:22px 18px;
    }

    .pro-list ul li .txt h6 a{
        font-size:16px;
    }

    .pro-list ul li .txt .add-to-cart a{
        width:100%;
    }

    .sidemenu h2,
    .sidemenu h3{
        font-size:22px;
    }

}

@media screen and (max-width:480px){

    .side-search .submit_text{
        height:48px;
        line-height:48px;
        font-size:14px;
    }

    .side-search .submit_btn{
        width:38px;
        height:38px;
    }

    .pro-top{
        padding:24px 18px;
    }

    .pro-top h1{
        font-size:24px;
    }

}

/*--for m122_footer--*/
/*--for m122_footer--*/
/*-----------*/

.m122-footer{padding: 100px 0 50px;position:relative;background:#241F21;overflow:hidden;}
.m122-footer::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;/*background-image:url(/template/pc/default/html/module/m122_footer/images/footer-bg.png);*/mix-blend-mode:overlay;background-size:cover;background-position:center;background-repeat:no-repeat;animation:scale 10s infinite;}
.m122-footer > .wp{position:relative;z-index:10;display:flex;justify-content:space-between;flex-wrap:wrap;}

.m122-footer h5{font-size: 22px;color:#fff;line-height:1;margin: 0 0 25px;font-weight:700;text-transform:uppercase;position:relative;}
.foot-logo img{
    max-width: 140px;
}
.foot-logo{width:25%;}
.foot-logo .share{font-size:0;margin:30px 0 0;}
.foot-logo .share a{display:inline-block;color:#fff;background:#4F4F4F;width:40px;height:40px;line-height:40px;text-align:center;border-radius:50%;transition:all 0.4s ease 0s;}
.foot-logo .share a+a{margin-left:15px;}
.foot-logo .share a i{font-size:19px;color:inherit;}
.foot-logo .share a:hover{transform:translateY(-5px);background:var(--color-active, #AE8F62);}
.foot-logo p{font-size: 16px;color:#958F91;line-height:1.6;margin:20px 0 0;}

.foot-nav ul li{font-size: 18px;line-height: 2;color:#958F91;position:relative;transition:all 0.4s ease-in-out;}
.foot-nav ul li::after{content:"";width:0px;height:2px;position:absolute;top:50%;left:0;background:var(--color-active, #AE8F62);transition:all 0.4s ease-in-out;}
.foot-nav ul li+li{margin-top:8px;}
.foot-nav ul li:hover{padding-left:18px;}
.foot-nav ul li:hover a{color:var(--color-active, #AE8F62);}
.foot-nav ul li:hover::after{width:10px;}

.foot-list ul li{font-size: 18px;line-height: 2;color:#958F91;position:relative;transition:all 0.4s ease-in-out;}
.foot-list ul li::after{content:"";width:0px;height:2px;position:absolute;top:50%;left:0;background:var(--color-active, #AE8F62);transition:all 0.4s ease-in-out;}
.foot-list ul li+li{margin-top:8px;}
.foot-list ul li:hover{padding-left:18px;}
.foot-list ul li:hover a{color:var(--color-active, #AE8F62);}
.foot-list ul li:hover::after{width:10px;}

.foot-contact{width:30%;}
.foot-contact p{color:#958F91;font-size: 18px;line-height:1.6;padding:0 0 0 50px;position:relative;}
.foot-contact p i{position:absolute;left:0;top:3px;width:40px;height:40px;line-height:40px;text-align:center;border-radius:50%;background:rgba(121, 117, 119, 0.2);color:var(--color-active, #AE8F62);transition:all 0.4s;}
.foot-contact p+p{margin-top: 20px;}
.foot-contact p span{font-weight:500;display:block;color:rgba(255,255,255,0.8);}
 
.foot-contact p a:hover{color:#fe2824;text-decoration:underline;}

.foot-contact p:hover i{background:var(--color-active, #AE8F62);color:#fff;}

.footer-copyright{background:#241F21;text-align:center;padding:30px 0;border-top:1px solid #3A3638;}
.footer-copyright p{color: #958F91;font-size:16px;font-weight:500;}

@keyframes scale {
  0%{transform:scale(1);}
  50%{transform:scale(1.3);}
  100%{transform:scale(1);}
}



@media screen and (max-width:1281px){
.m122-footer h5{font-size:18px;}
.foot-logo img{height:55px;}
.foot-nav ul li{font-size:15px;}
.foot-list ul li{font-size:15px;}
}

@media screen and (max-width:992px){
.m122-footer {padding: 30px 0 50px;}
.foot-logo{width:100%;text-align:center;margin-bottom:30px;}
.foot-logo p{font-size:16px;margin:15px 0 0;}
.foot-logo .share{margin:20px 0 0;}
.foot-contact{width:50%;}
}

@media screen and (max-width:768px){
.m122-footer h5{font-size:16px;}
.foot-logo img{height:40px;}
.foot-logo .share a{width:36px;height:36px;line-height:36px;}
.foot-logo .share a+a{margin-left:10px;}
.foot-logo .share a i{font-size:16px;}

.foot-nav,.foot-list,.foot-contact{width:100%;}
.foot-list,.foot-contact{margin-top:25px;}

.foot-nav h5,.foot-list h5{border-bottom:1px solid rgba(255,255,255,0.2);padding:0 0 15px;margin:0 !important;}
.foot-nav h5::after,.foot-list h5::after{display:block;content:"\e699";font-family:"qico";font-weight:400;position:absolute;right:10px;cursor:pointer;font-size:14px;top:2px;color:#fff;}
.foot-nav ul,.foot-list ul{display:none;padding:15px 0 0;}

.foot-contact p{font-size:15px;}

.footer-copyright{padding:25px 0;}
.footer-copyright p{font-size:15px;}
}

@media screen and (max-width:480px) {
.m122-footer h5{font-size:15px;}
.foot-logo p{font-size:15px;margin:10px 0 0;}
.foot-nav ul li{font-size:14px;line-height:1.4;}
.foot-list ul li{font-size:14px;line-height:1.4;}

.foot-contact p{padding:0 0 0 45px;font-size:14px;}
.foot-contact p i{width:36px;height:36px;line-height:36px;}
.footer-copyright p{font-size:14px;}
}	

@media screen and (max-width:420px) {
.foot-logo img{height:35px;}
}