aside>ul>li{margin:80px 0vw 0px}
aside>ul>li[data-type="1"]{overflow:inherit;}
aside>ul>li h4{padding: 5px 10px;border: none;border-radius: 50px;margin: 5px;display: flex;flex-direction: row;align-items: center;justify-content: center;}
aside>ul>li h4 a{min-width: 140px;padding: 5px 0px;}
aside>ul.ininnav>li{display:none}
aside>ul.ininnav>li.action{display:flex;margin:20px auto 0;justify-content:center;overflow: visible;}
aside>ul.ininnav>li.action .subUL li{position: relative;padding-top: 60px;}
aside>ul.ininnav>li.action h4{display:none}
aside>ul.ininnav>li.action .subUL li:hover a{background: var(--primary);color: white;}
aside>ul.ininnav>li.action .subUL{position:relative;display:flex;opacity:1;z-index:2;width:auto;transform:translate(0,0px);-webkit-transform:translate(0,0px);left:unset;background:unset;overflow:visible;flex-wrap:wrap;width:100%;justify-content:center;pointer-events: auto;}
aside>ul.ininnav>li .subUL>li .subULHead a{position:relative;border: solid 1px #e2dede;font-size:18px;font-weight:500;letter-spacing:1px;border-bottom:3px solid #D1D1D1;border-radius:inherit;min-width:160px;padding: 7px 10px;color:#474747;box-shadow: 0 2px 3px rgb(0 0 0 / 16%);}
aside>ul.ininnav>li .subUL>li p{padding:5px 10px;border-radius:50px;margin:5px;position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;}
aside>ul.ininnav>li .subUL>li.action  p:before{opacity: 1;}
aside>ul.ininnav>li .subUL>li .subULHead a:before{content:"";background:url(../../images/44/img-beauty-01.png) no-repeat;background-size:cover;background-position:50% 50%;position:absolute;width:110px;height:80px;z-index:10;top:15%;left:50%;transform:translate(-50%,-100%)}
aside>ul.ininnav>li .subUL>li .subULHead a:before{content:"";background:url(../../images/44/img-beauty-02.png) no-repeat;background-size:cover;background-position:50% 50%;position:absolute;width:110px;height:80px;z-index:10;top: 0%;left:50%;transform:translate(-50%,-100%)}
aside>ul.ininnav>li .subUL>li:nth-child(2) .subULHead a:before{background:url(../../images/44/img-beauty-04.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul.ininnav>li .subUL>li:nth-child(3) .subULHead a:before{background:url(../../images/44/img-beauty-03.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul.ininnav>li .subUL>li:nth-child(4) .subULHead a:before{background:url(../../images/44/img-beauty-06.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul.ininnav>li .subUL>li:nth-child(5) .subULHead a:before{background:url(../../images/44/img-beauty-05.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul.ininnav>li .subUL>li:nth-child(6) .subULHead a:before{background:url(../../images/44/img-beauty-01.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul.ininnav>li .subUL>li b {display: flex;position: absolute;right: 18px;top: 16px;}
aside>ul.ininnav>li .subULHead { position: relative; }
ul.subUL li.action > div.subULHead > p { color: var(--white); position: relative; }
ul.subUL li.action > div.subULHead > p > a {color: #fff!important;border-bottom: 0px solid #D1D1D1;background: var(--primary);border-color: var(--primary);padding: 11px 10px;}
aside>ul>li h4 a:before{content:"";background:url(../../images/44/img-beauty-02.png) no-repeat;background-size:cover;background-position:50% 50%;position:absolute;width:110px;height:80px;z-index:10;top:15%;left:50%;transform:translate(-50%,-100%)}
aside>ul>li:nth-child(2) h4 a:before{background:url(../../images/44/img-beauty-04.png) no-repeat;background-size:cover;background-position: 50% 48%;background-repeat: no-repeat;}
aside>ul>li:nth-child(3) h4 a:before{background:url(../../images/44/img-beauty-03.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul>li:nth-child(4) h4 a:before{background:url(../../images/44/img-beauty-06.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul>li:nth-child(5) h4 a:before{background:url(../../images/44/img-beauty-05.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul>li:nth-child(6) h4 a:before{background:url(../../images/44/img-beauty-01.png) no-repeat;background-size:cover;background-position:50% 50%}
aside>ul>li h4{border: solid 1px #e2dede;font-size:18px;font-weight:500;letter-spacing:1px;border-bottom:3px solid #D1D1D1;box-shadow: 0 2px 3px rgb(0 0 0 / 16%);}
aside ul li.action h4 a, aside ul li.action h4 i{background:none;color: var(--white);}
aside ul li b {
    position: absolute;
    right: 7px;
}
aside>ul.ininnav .see >li[data-type="2"] .sub2UL{

    -webkit-transform: translate(0px, 0);
}
aside>ul.ininnav>li.action .subUL .sub2UL li {padding-top: 0;}
aside>ul.ininnav>li.action .subUL .sub2UL li a ,aside>ul.ininnav>li .subUL>li b i{ color: aliceblue; }
aside>ul.ininnav>li .subUL .sub2UL>li p {border: 0;border-radius: 0;padding: 0;margin: 0;}
aside>ul.ininnav>li.action .subUL .sub2UL li a{
    padding: 10px 15px;
    color: var(--white);
    font-weight: 400;
    text-align: center;
    border-bottom: 1px solid rgb(255 255 255 / 10%);
    width: 100%;
}




@media screen and (min-width: 1281px) {
	aside>ul>li:hover h4 { background: var(--primary); border-color: var(--primary); }
	aside>ul>li:hover h4  {background: var(--primary);border-color: var(--primary);color: var(--white);}
	aside>ul>li:hover h4  b i{
    color: var(--white);
}
    aside>ul>li:hover h4 a{color:var(--white)}
}
@media screen and (max-width: 640px) {
    aside>ul>li:before{width:90px;height:60px}
	aside>ul>li h4 a{min-width:100%;font-size:17px;letter-spacing:1px;padding: 2px 0px;}
	aside>ul>li[data-type="1"]{margin: 70px 0vw 0px;}
	#category_nav{position:absolute;background: #ffffff;width:100%;height:0;opacity:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px 10px;padding:20px;align-items:center}
	#category_nav.ininnav{grid-template-columns:repeat(1,1fr)}
	aside>ul.ininnav>li.action .subUL{grid-template-columns:repeat(2,1fr);display:grid;top: -30px;width: 100%;}
	#category_nav.showme{opacity:100%;z-index:999;height: auto;display: grid;grid-template-columns: 49% 49%;gap: 3% 1%;padding: 20px 20px 30px;}
	
}
@media screen and (max-width: 480px) {
	#category_nav {display: block;}
	#category_nav.ininnav.showme{grid-template-columns: 100%;padding: 0;}
	aside>ul.ininnav>li.action{margin: 0;width: 100%;overflow: hidden;}
	aside>ul.ininnav>li .subUL>li p{padding: 0px 0px;}
	aside>ul.ininnav>li.action .subUL li{padding-top: 117px;}
	aside>ul.ininnav>li .subUL>li.action p:before{bottom: -5px;width: 94%;}
}
