@charset "UTF-8";

/* @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap'); */
/* Gilroy Regular */
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/SVN-Gilroy-Regular.otf') format('opentype');
  font-weight: 400; /* Normal */
  font-style: normal;
}

/* Gilroy SemiBold */
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/SVN-Gilroy-SemiBold.otf') format('opentype');
  font-weight: 600; /* SemiBold */
  font-style: normal;
}

/* Gilroy Bold */
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/SVN-Gilroy-Bold.otf') format('opentype');
  font-weight: 700; /* Bold */
  font-style: normal;
}

/* Gilroy Extra Bold Italic */
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/SVN-Gilroy-XBold-Italic.otf') format('opentype');
  font-weight: 900; /* Extra Bold */
  font-style: italic;
}

:root{
  --main: #942218;
  --theme-color: #942218;
  --color-red: #942218;
  --sub: #FFCB84;
  --white: #fff;
  --black: #000;
  --grey: #8C8C8C;
  --linear: linear-gradient(90deg, rgba(220,181,76,1) 0%, rgba(255,254,161,1) 25%, rgba(255,254,161,1) 50%, rgba(220,181,76,1) 75%, rgba(220,181,76,1) 100%);
  --linear_old: linear-gradient(135deg, rgba(248,185,24,1) 0%, rgba(255,228,174,1) 28%, rgba(242,189,59,1) 55%, rgba(252,227,166,1) 80%, rgba(248,185,24,1) 100%);
}

body{width: 100%;font-size: 16px;margin: 0;font-family: Gilroy;font-weight: 400;background: var(--main);}

*, *::before, *::after{box-sizing: border-box;}

/* general */
.hidden, .hidden-seoh{display: none;width: 0;opacity: 0;user-select: none;}
a,a:hover{text-decoration: none;color: unset;}
a img{vertical-align: top;}
p{padding: 0;margin: 0;}
ul{margin: 0;padding: 0;list-style: none;}
.clear{clear: both;}

.bold{font-family: gilb;}
.semi_bold{font-family: gilsb;}

.mw,.wrap-content{max-width: 1230px;padding: 0 15px;margin: 0 auto;}
.wrap-main{padding: 20px 0;}
.wrap-main.wbg{background: var(--white);}
.wbg .content-main p{color:#000;}

.w100{width: 100%;}
.w50{width: 50%;}
.h100{height: 100%;}

.bora10{border-radius: 10px;}
.boral10{border-top-left-radius: 10px;border-bottom-left-radius: 10px;}
.borar10{border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
.borat10{border-top-left-radius: 10px;border-top-right-radius: 10px;}
.borab10{border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;}

.df{display: flex;}
.f1{flex: 1;}
.aic{align-items: center;}
.ais{align-items: stretch;}
.jcc{justify-content: center;}
.jcsb{justify-content: space-between;}
.jcfe{justify-content: flex-end;}

.fcol{flex-flow:column;}
.fwrap{flex-flow:wrap}

/* spacing */
.p30{padding: 30px;}

.py40{padding: 40px 0;}
.py60{padding: 60px 0;}

.py46{padding: 40px 0px 60px;}
.py64{padding: 60px 0px 40px;}

.g8{gap: 8px;}
.g10{gap: 10px;}
.g16{gap: 16px;}
.g20{gap: 20px;}
.g24{gap: 24px;}
.g32{gap: 32px;}
.g40{gap: 40px;}

/* text clamp */
.clamp_1{display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;}
.clamp_2{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.clamp_3{display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.clamp_4{display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;overflow: hidden;}
.clamp_5{display: -webkit-box;-webkit-line-clamp: 5;-webkit-box-orient: vertical;overflow: hidden;}


/* header */
.header .upper{background: var(--black);color: var(--white);padding: 8px 0;}
.header .lower{background: var(--white);padding: 8px 0px;}
.header .address i{font-size: 20px;}
.group_nav li a{font-weight: 600;}
.search-bar{max-width: 432px;width: 100%;position: relative;}
.search-bar input{width: 100%;padding: 9px 0 9px 24px;border-radius: 30px;background: #EEEEEE;outline: none;border: none;}
.search-bar p{position: absolute;top: 50%;right: 16px;transform: translateY(-50%);cursor: pointer;}
.search-bar p i{font-size: 24px;font-weight: 500;}
.buy_group .hotline{position: relative;z-index: 1;}
.hotline .phone_icon{position: absolute;left: -22px;bottom: 3px;background: var(--main);padding: 8.5px 10px;border-radius: 100%;z-index: 2;}
.hotline .phone_icon i{font-size: 24px;color: #fff;}
.hotline .phone_icon::after{content: '';width: 55px;height: 1px;background: var(--main);bottom: 0;right: -33px;position: absolute;}
.hotline_wrapper{padding: 9px 20px 5px 35px;position: relative;z-index: 1;}
.hotline_wrapper p{position: absolute;top: -7px;font-size: 12px;font-weight: 900;font-style: italic;text-transform: uppercase;line-height: 16px;padding: 0px 11px 2px 13px;z-index: 2;color: var(--white);}
.hotline_wrapper p span{width: 100%;height: 100%;position: absolute;}
.hotline_wrapper p .decor{background: var(--grey);left: -1px;top: 0;transform: skewX(-15deg);z-index: -3;height: 40%;}
.hotline_wrapper p .decor1{background: var(--main);left: 0;z-index: -1;clip-path: polygon(0 0, 100% 0, 93% 100%, 7% 100%);}
.hotline_wrapper p .decor2{height: 1px;width: 55px;right: -30px;top: 3px;background: var(--main);}
.hotline_wrapper .hotline_number a{color: var(--white);font-weight: 600;}
.hotline_wrapper .hotline_bg{background: var(--black);position: absolute;width: 100%;height: 100%;top: 0;left: 0;transform: skewX(-15deg);z-index: -1;}
.cart_head{padding: 10px 24px 10px 16px;background: var(--main);color: var(--white);border-radius: 60px;box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;}
.cart_head a{font-weight: 600;}
.cart_head .count_cart{position: relative;}
.cart_head .count_cart span{position: absolute;background: var(--white);color: var(--black);font-size: 14px;line-height: 1;padding: 2px 3px;border-radius: 10px;top: -10px;right: -7px;}

/* menu */
#menu-mobile{display: none;}
#menu{background: var(--main);}
.menu_ul > li a{padding: 10px 16px 7px;position: relative;color: var(--white);font-weight: 600;border-bottom: 3px solid transparent; transition: all 0.3s ease-in-out;display: inline-block;width: 100%;}
.menu_ul > li > a.active, .menu_ul > li a:hover{color: var(--sub);border-color: var(--sub);}
.menu_ul > li > a > i{font-size: 22px;}
.product_lvl2_ul{position: absolute;transform: translateY(20%);background: var(--main);visibility: hidden;opacity: 0;transition: transform 0.3s ease-in-out, visibility 0.2s ease-in-out, opacity 0.2s ease-in-out;z-index: 2;border: 1px solid var(--sub);border-radius: 8px;}
.product_lvl2_li{position: relative;}
.product_lvl2_li h2{font-size: 14px;font-weight: 600;}
.product_lvl1_li:hover .product_lvl2_ul{transform: translateY(0);visibility: visible;opacity: 1;}

.product_lvl3_ul{position: absolute;top: 0;left: calc(100% + 40px);background: var(--sub);visibility: hidden;z-index: 0;transition: visibility 0.2s ease-in-out, left .3s ease-in-out;}
.product_lvl3_ul a{font-size: 14px;white-space: nowrap;color: var(--main) !important;}
.product_lvl2_li:hover .product_lvl3_ul{left: 100%;visibility: visible;left: 100%;z-index: 3;}
/* menu mobile */
/* menu mobile */
#menu-mobile {
  display: none;
  z-index: 10;
  background: var(--theme-color);
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 99;
}

.menu-bar-res {
  height: 40px;
  padding: 0 10px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#hamburger {
  display: block;
  width: 30px;
  height: 22px;
  position: relative;
}

#hamburger:before,
#hamburger:after,
#hamburger span {
  background: #fff;
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  position: absolute;
  left: 0;
}

#hamburger:before {
  top: 0;
}

#hamburger span {
  top: 10px;
}

#hamburger:after {
  top: 20px;
}

#hamburger:before,
#hamburger:after,
#hamburger span {
  -webkit-transition: none .5s ease .5s;
  transition: none .5s ease .5s;
  -webkit-transition-property: transform, top, bottom, left, opacity;
  transition-property: transform, top, bottom, left, opacity;
}

#mmenu {
  display: none;
}

.mm-wrapper_opening #hamburger:before,
.mm-wrapper_opening #hamburger:after {
  top: 10px;
}

.mm-wrapper_opening #hamburger span {
  left: -50px;
  opacity: 0;
}

.mm-wrapper_opening #hamburger:before {
  transform: rotate(45deg);
}

.mm-wrapper_opening #hamburger:after {
  transform: rotate(-45deg);
}

.mm-menu_opened {
  display: block !important;
}

#mmenu h2 {
  font-weight: normal;
  font-size: 15px;
  margin: 0;
}

.mm-listitem.heading {
  font-weight: bold;
  color: var(--theme-color);
  background: #dfdfdf;
  line-height: 20px;
  padding: 10px;
  text-transform: capitalize;
  margin-top: -1px;
}

.mm-listitem.heading:after {
  display: none;
}

.mm-wrapper__blocker {
  box-shadow: 0 0 10px rgba(0, 0, 0, .3);
}

div.search_mobi {
  position: absolute;
  z-index: 100;
  background: #fff;
  height: 30px;
  width: 70%;
  top: calc(50% - 15px);
  right: 10px;
}

div.search_mobi:after {
  display: none;
}

div.search_mobi input {
  padding: 0 20px;
  float: left;
  height: 30px !important;
  height: 29px;
  e-height: 30px;
  border: none;
  background: none;
  width: 86%;
  outline: none;
  color: #333;
  text-align: left;
}

div.search_mobi i {
  padding: 8px 11px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

div.search_mobi input::-moz-placeholder {
  color: #333;
}

div.search_mobi input:-ms-input-placeholder {
  color: #333;
}

div.search_mobi input:-moz-placeholder {
  color: #333;
}

/* slideshow */
.slideshow{position: relative;}
.slideshow .nav_btn{position: absolute;top: 50%;transform: translateY(-50%);left: 20px;z-index: 1;cursor: pointer;}
.slideshow .nav_btn.next{right: 20px;left: unset;}
.slideshow .nav_btn i{font-size: 34px;color: var(--white);opacity: 0.7;transition: all 0.3s ease-in-out;}
.slideshow .nav_btn i:hover{opacity: 1;color: var(--sub);}
.slideshow .swiper-slide img{transition: all 20s ease-in-out;}
.slideshow .swiper-slide.swiper-slide-active img{transform: scale(1.5);}


/* page index */
.ads_index_item{overflow: hidden;border-radius: 7px;}
.ads_index_item img{transition: all 5s ease-in-out;}
.ads_index_item:hover img{transform: scale(1.5) rotate(-30deg);}
.brand_tag{margin-top: 24px;overflow: visible;}
.brand_tag .swiper-button-prev, .brand_tag .swiper-button-next{color: var(--sub);}
.brand_tag .swiper-button-prev{left: -30px;}
.brand_tag .swiper-button-next{right: -30px;}
.brand_tag .swiper-button-prev::after, .brand_tag .swiper-button-next::after{font-size: 30px;}
.title_index{font-size:clamp(24px,4vw,32px);font-weight:700;text-align:center;background:linear-gradient(90deg, rgba(220,181,76,1) 0%, rgba(255,254,161,1) 25%, rgba(255,254,161,1) 50%, rgba(220,181,76,1) 75%, rgba(220,181,76,1) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-transform:uppercase;width:fit-content;margin:0 auto;}
.tag_item img{border-radius: 8px;}

/* new_products */
.new_products {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  overflow: auto;
}

.new_products::-webkit-scrollbar {
  display: none;
}

.new_products .list {
  font-size: 16px;
  border: 1px solid var(--sub);
  padding: 10px 16px;
  color: var(--sub);
  border-radius: 8px;
  display: block;
  cursor: pointer;
  text-wrap: nowrap;
  font-weight: 600;
}

.new_products .list.active {
  background: var(--sub);
  color: var(--main);
}

.ajax_new_pro{margin-top:12px}
.hot_products {display: grid;grid-template-columns: repeat(auto-fill,minmax(201px, 1fr));align-content: stretch;align-items: stretch;}
.product{padding: 0px 10px 24px;color: var(--white);text-align: center;height: auto;}
.product img{border-radius: 8px;width: 100%;}
.product .name{font-weight: 600;transition: all 0.3s ease-in-out;}
.product .name:hover{color: var(--white);}
.product .hidden_price{font-weight: 700;margin-top: auto;color: var(--sub);}
.product .sku{position:relative;display:inline-block;cursor:pointer;}
.product .sku .tooltiptext{visibility:hidden;width:140px;background-color:#555;color:#fff;text-align:center;border-radius:6px;padding:5px;position:absolute;z-index:1;bottom:-150%;left:50%;margin-left:-75px;opacity:0;transition:opacity .3s;}
.product .sku .tooltiptext::after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#555 transparent transparent transparent;transform:rotate(180deg);}
.product .sku:hover .tooltiptext{visibility:visible;opacity:1;}
.add_cart_btn{padding: 10px 24px 10px 16px;background: var(--linear);color: var(--main) !important;width: fit-content;margin: 0 auto;border-radius: 60px;font-weight: 600;cursor: pointer;white-space:nowrap;}
.add_cart_btn .decor{overflow: hidden;height: 22px;position: relative;width: 24px;}
.add_cart_btn i{font-size: 22px;position: absolute;top: 0;transition: all 0.3s ease-in-out;}
.add_cart_btn i:last-child{top: 24px;}
.add_cart_btn:hover i{transform: translateY(-24px);}

/* featured_pro_list */
.group_pro_list_title{position: relative;}
.pro_list_title{padding: 10px 16px;background: var(--linear);position: relative;white-space: nowrap;line-height: 1.4;width: fit-content;}
.pro_list_title::before{content: '';max-width: 34px;width: 100%;height: 100%;display: block;background: url(../images/pro_list_title_decor.svg);background-repeat: no-repeat;background-size: contain;position: absolute;top: 0;right: -33px;}
.pro_list_title a{color: var(--main);font-weight: 700;font-size: clamp(24px,4vw,32px);}
a.see_all{margin-top: auto;padding: 6px 14px 6px 22px;border: 2px solid var(--sub);color: var(--sub);border-radius: 60px;transition: all 0.3s ease-in-out;font-weight: 600;width: fit-content;font-size: clamp(14px,4vw,16px);}
a.see_all:hover{background: var(--sub);border-color: var(--sub); color: var(--main);}
.group_pro_list_title .decor{height: 2px;margin-top: auto;margin-left: auto;background: var(--linear);border-radius: 5px;}


/* ajax_product_index */
.pro_cat_wrapper{max-width: 240px;width: 100%;}
.pro_cat_list{margin-top: 8px;gap: 5px;}
.pro_cat_item{padding: 8px 0px 8px 16px;color: var(--sub);cursor: pointer;border: 3px solid var(--sub);border-radius: 7px;}
.pro_cat_item.active{background: var(--white);color: var(--black);}

/* service_index */
.service_index .title_index{font-size: clamp(20px,4vw,24px);padding: 10px 0;}
.service_item{position: relative;border-radius: 8px;}
.service_item .service_info{position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.5);text-align: center;border-radius: 8px;}
.service_info a.name{font-size: clamp(18px,4vw,20px);color: var(--white);font-weight: 700;margin-top: auto;}
.service_info a.see_more{color: var(--white);background: var(--main);padding: 8px 16px 8px 24px;border-radius: 60px;width: fit-content;margin: 0 auto;margin-bottom: 16px;}
.service_item img{border-radius: 8px;}

/* news_video */
.news_video .title_index{text-align: left;margin: unset;}
.group_news .swiper_news{max-height: 508px;}
.news_nav_group{margin-top: 24px;overflow: visible;}
.news_nav_group .swiper_news_nav{padding: 8px 16px;background: rgba(234, 234, 234, .6);border-radius: 100%;}
.swiper_news_nav:hover{transform: scale(0.95);box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24);}



/* news_photo */
.news_video {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 40px;
}

.group_news{max-width: 668px;width: 100%;}

.group_video {
  width: calc(100% - 708px);
}

.news_item {
  display: flex !important;
  width: 100%;
  gap: 20px;
  justify-content: space-between;
  position: relative;
}

.news_item .news_img{margin: 8px 0;}

.news_item .name {
  color: var(--white);
  font-weight: 700;
  transition: color .3s ease-in-out;
}
.news_item .name:hover {color: var(--sub);}

.news_item .day_created{font-weight: 600;color: var(--white);}

.news_item .desc {
  color: #fff;
}

/* assurance */
.assurance {
  padding: 60px 0 40px;
  background: url('../images/assurance_bg.png') no-repeat top center;
  background-size: contain;
}

.assurance .title_index{color: var(--white);background: none;-webkit-text-fill-color: unset;}

.assurance_items {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 40px;
  padding-top: 60px;
  justify-content: space-between;
}

.assurance_items .item {
  display: flex;flex-flow: column;
  align-items: center;
  gap: 40px;
  max-width: 350px;
  width: 100%;margin: 0 auto;
  text-align: center;
}
.assurance_items .item .img {padding: 20px;background: var(--main);border-radius: 100%;position: relative;}
.assurance_items .item .img::after{width: calc(100% + 24px);height: calc(100% + 24px);content: '';background: rgba(255, 255, 255, .2);border-radius: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: -1;}
.assurance_items img {width: 80px;transition: all 0.3s ease-in-out;}
.assurance_items .swiper-slide-active img{width: 100px;transition: all 0.3s ease-in-out;}
.assurance_items .item .name {font-size: clamp(20px,4vw,24px);font-weight: 700;color: var(--white);background: rgba(148, 34, 24, .8);border-radius: 8px;text-align: center;}
.assurance_items .item .desc {
  color: #fff;font-size: clamp(20px,4vw,24px);font-weight: 400;
}

/* footer */
.footer{border-top: 4px solid;border-image: linear-gradient(135deg, rgba(248,185,24,1) 0%, rgba(255,228,174,1) 28%, rgba(242,189,59,1) 55%, rgba(252,227,166,1) 80%, rgba(248,185,24,1) 100%);border-image-slice: 1;}
.footer_title {font-size: clamp(18px,4vw,20px);font-weight: 600;padding: 10px 0;color: var(--sub);border-bottom: 2px solid var(--sub);width: fit-content;text-transform: uppercase;}

/* lower_footer */
.lower_footer {
  background: var(--main);color: var(--white);
}
.footer_logo{padding: 10px;background: var(--sub);border-radius: 10px;text-align: center;box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}
.contact_info_item i{font-size: 24px;}
.contact_info_item i::before{width: 24px;display: inline-block;}
.contact_info_item .content{font-weight: 600;}
.contact_info_item span{font-weight: 400;transition: all 0.3s ease-in-out;}
.contact_info_item:hover span{color: var(--main);}
.phone_call_footer{color: var(--sub);font-size: 24px;font-weight: 600;transition: all 0.3s ease-in-out;width: fit-content;border-radius: 8px;}
.phone_call_footer:hover{color: var(--main);padding: 5px 10px;background: var(--sub);}
.contact_info_item{text-align:left;}
.contact_info_item:hover span{color: var(--sub);}

.footer_info .social {
  display: flex;
  flex-direction: row;
  gap: 15px;
}

.footer_info .social a {
  width: 36px;
  height: 36px;
  background: var(--main);
  border-radius: 100%;
  position: relative;
}

.footer_info .social a img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.footer_info .policy {
  list-style-type: disc;text-align: start;
}

.footer_info .policy a {
  font-weight: 600;transition: all .3s ease-in-out;
}
.footer_info .policy a:hover{color: var(--main);}


/* branch */
#footer-map{position: relative;}
.group_branch_title{position: absolute;top: 10px;left: 50%;transform: translateX(-50%);display: flex;gap: 24px;}
.click_switch_branch{padding: 5px 10px;background: var(--sub);border: 1px solid var(--main);color: var(--black);border-radius: 10px;cursor: pointer;transition: all .3s ease-in-out;}
.click_switch_branch.active{background: var(--main);color: var(--sub);}
.click_switch_branch:hover{background: transparent;}
#footer-map iframe {
 width: 100%;
}
/* end branch */

.copyright {
  background: #6B0A01;
  color: #E3B3AF;
  padding: 20px 0;
  text-align: center;
}

/* float cart */
.cart-fixed {
  position: fixed;
  right: 20px;
  bottom: 390px;
  z-index: 10;
  background: var(--sub);
  width: 50px;
  height: 50px;
  text-align: center;
  color: #fff !important;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cart-fixed i {
  font-size: 20px;
}

.cart-fixed span {
  position: absolute;
  top: 0;
  right: -5px;
  color: #fff;
  width: 25px;
  height: 25px;
  background: var(--main);
  text-align: center;
  line-height: 25px;
  font-size: 11px;
  border-radius: 100%;
}

/* float btn */
.btn-frame {
  display: block;
  width: 50px;
  height: 50px;
  position: fixed;
  right: 20px;
  z-index: 10;
  cursor: pointer;
}

.btn-frame i {
  display: flex;
  display: -ms-flex;
  justify-content: center;
  align-items: center;
  -ms-flex-align: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #1182FC;
  position: relative;
  z-index: 1;
}

.btn-frame i img {
  vertical-align: middle;
  width: 70%;
}

.btn-frame .animated.infinite {
  animation-iteration-count: infinite;
}

.btn-frame .kenit-alo-circle {
  width: 60px;
  height: 60px;
  top: -5px;
  right: -5px;
  position: absolute;
  background-color: transparent;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  border: 2px solid rgba(7, 41, 103, .8);
  opacity: .1;
  border-color: #1182FC;
  opacity: .5;
}

.btn-frame .zoomIn {
  animation-name: zoomIn;
}

.btn-frame .animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.btn-frame .kenit-alo-circle-fill {
  width: 70px;
  height: 70px;
  top: -10px;
  right: -10px;
  position: absolute;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
  background-color: rgba(7, 41, 103, .35);
  opacity: .4;
}

.btn-frame .pulse {
  animation-name: pulse;
}

/* Zalo */
.btn-zalo {
  bottom: 315px;
}

/* Phone */
.btn-phone {
  bottom: 230px;
}

/* Messenger */
.js-facebook-messenger-container.closed,
.js-facebook-messenger-tooltip.closed {
  display: none !important
}

.js-facebook-messenger-tooltip {
  bottom: 97px;
  right: 97px
}

.js-facebook-messenger-tooltip {
  color: #404040;
  background: #fff
}

.js-facebook-messenger-box,
.js-facebook-messenger-button,
.js-facebook-messenger-tooltip {
  z-index: 999
}

.js-facebook-messenger-tooltip {
  display: none;
  position: fixed;
  text-align: center;
  border-radius: 10px;
  overflow: hidden;
  font-size: 12px;
  line-height: 1;
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, .1);
  box-shadow: rgba(0, 0, 0, .15) 0 2pt 10pt;
  z-index: 1.0E+30
}

.js-facebook-messenger-close-tooltip {
  width: 10px;
  height: 10px;
  display: inline-block;
  cursor: pointer;
  margin-left: 10px
}

.js-facebook-messenger-box.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand
}

.js-facebook-messenger-box.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

.js-facebook-messenger-box,
.js-facebook-messenger-button,
.js-facebook-messenger-tooltip {
  z-index: 999
}

.js-facebook-messenger-box {
  display: block;
  position: fixed;
  cursor: pointer;
  bottom: 150px;
  right: 17px;
  width: 56px;
  height: 56px;
  text-align: center;
  background: #1182FC;
  border-radius: 100%;
  overflow: hidden;
  z-index: 99;
  -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .3);
  -moz-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .3);
  box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .3)
}

.js-facebook-messenger-box.rotate svg#fb-msng-icon {
  transform: rotate(0deg)
}

.js-facebook-messenger-box svg#fb-msng-icon {
  width: 32px;
  height: 33px;
  position: absolute;
  top: 13px;
  left: 12px;
  opacity: 1;
  overflow: hidden;
  -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  -moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  -o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
}

.js-facebook-messenger-box.rotate svg#close-icon {
  transform: rotate(-45deg)
}

.js-facebook-messenger-box svg#close-icon {
  opacity: 0;
  width: 19px;
  height: 20px;
  position: absolute;
  top: 19px;
  left: 19px;
  -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  -moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  -o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
}

.js-facebook-messenger-container,
.js-facebook-messenger-container-button {
  z-index: 1000
}

.js-facebook-messenger-container {
  position: fixed;
  opacity: 0;
  transform: translateY(50px);
  bottom: 110px;
  right: 90px;
  border-radius: 10px;
  pointer-events: none;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .06), 0 2px 32px rgba(0, 0, 0, .16);
  -webkit-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;
  -moz-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;
  -o-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;
  transition: transform 160ms ease-in-out, opacity 160ms ease-in-out
}

.js-facebook-messenger-top-header {
  width: 300px
}

.js-facebook-messenger-top-header {
  color: #fff;
  background: #1182FC
}

.js-facebook-messenger-top-header {
  display: block;
  position: relative;
  width: 300px;
  background: #1182FC;
  color: #fff;
  text-align: center;
  line-height: 1;
  padding: 10px;
  font-size: 14px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px
}

.js-facebook-messenger-container iframe,
.js-facebook-messenger-container-button iframe {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px
}

.js-facebook-messenger-box,
.js-facebook-messenger-button,
.js-facebook-messenger-tooltip {
  z-index: 999
}

.js-facebook-messenger-container,
.js-facebook-messenger-container-button {
  z-index: 1000
}

.js-facebook-messenger-top-header {
  color: #fff;
  background: #1182FC
}

.js-facebook-messenger-top-header {
  width: 300px
}

.js-facebook-messenger-tooltip {
  color: #404040;
  background: #fff
}

.js-facebook-messenger-container.open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: all
}

.js-facebook-messenger-tooltip {
  bottom: 97px;
  right: 97px
}

.js-facebook-messenger-box.open svg#fb-msng-icon {
  opacity: 0
}

.js-facebook-messenger-box.rotate.open svg#close-icon {
  transform: rotate(0deg)
}

.js-facebook-messenger-box.open svg#close-icon {
  opacity: 1
}

/*Go top*/
.progress-wrap {
  position: fixed;
  bottom: 70px;
  right: 19px;
  height: 50px;
  width: 50px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(20px);
  -ms-transform: translateY(20px);
  transform: translateY(20px);
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.progress-wrap::after {
  position: absolute;
  font-family: 'Font Awesome 6 Pro';
  content: '\f077';
  text-align: center;
  line-height: 50px;
  font-size: 16px;
  font-weight: 900;
  color: #1182FC;
  left: 0;
  top: 0;
  height: 50px;
  width: 50px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}

.progress-wrap svg path {
  fill: none;
}

.progress-wrap svg.progress-circle path {
  stroke: #1182FC;
  stroke-width: 4;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}

/* Fix toolbar */
.fix-toolbar {
  background: var(--main);
  width: 100%;
  padding: 5px;
  bottom: 0;
  position: fixed;
  height: auto;
  line-height: 25px;
  left: 0;
  right: 0;
  margin: 0 auto;
  display: none;
  border-top: 1px solid #fff;
  z-index: 99;
}

.fix-toolbar img {
  vertical-align: top;
}

.fix-toolbar ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px;
  list-style: none;
  margin: 0;
}

.fix-toolbar ul li {
  text-align: center;
  width: 20%;
}

.fix-toolbar ul li a {
  display: block;
  width: 100%;
  cursor: pointer;
  color: #fff;
  font-size: 30px;
}

.fix-toolbar ul li a img {
  height: 25px !important;
  width: auto;
}

.fix-toolbar ul li a span {
  font-weight: 400;
  color: #fff;
  font-size: 13px;
  display: none;
}

/* inpage general */
.title-main {
  margin-bottom: 45px;
  text-align: center;
  font-weight: 700;
  font-size: clamp(26px,4vw,32px);
}

.title-main h1,
.title-main h2,
.title-main span {
  color: var(--sub);
  text-transform: uppercase;
}

.title-main p {
  display: block;
  margin: 0;
}

.title-detail {
  margin-bottom: 15px;
  color: var(--sub);
}

.title-detail h1 {
  margin: 0;
  font-weight: normal;
  font-size: 25px;
  line-height: 28px;
  text-transform: capitalize;
}

.title-detail p {
  display: none;
}

.time-detail {
  margin-bottom: 10px;
  color: #999;
}

.time-detail i {
  vertical-align: top;
  margin: 5px 10px 0 0;
}

.time-detail span {
  vertical-align: top;
  display: inline-block;
}

.content-main {
  color: #fff;
}

/* Toc */
.box-readmore {
  padding: 8px 15px;
  border: 1px solid #dedede;
  margin-bottom: 2rem;
  border-radius: 5px;
  background-color: #eeeeee;
}

.box-readmore li ul>li {
  margin: 0;
  margin-bottom: 8px
}

.box-readmore li ul>li:before {
  content: counters(item, ".") " "
}

.box-readmore ul {
  list-style-type: none;
  counter-reset: item;
  margin-bottom: 0;
  padding-left: 0 !important;
  margin-top: 8px;
}

.box-readmore ul li {
  display: table;
  counter-increment: item;
  margin-bottom: 5px
}

.box-readmore ul li:before {
  content: counters(item, ".") ". ";
  display: table-cell;
  padding-right: 5px
}

.box-readmore ul li a {
  color: #333333;
  cursor: pointer;
  font-weight: 600;
}

.box-readmore ul li a:hover {
  color: #767676;
}

/* Like Share */
.social-plugin {
  display: flex;
  justify-content: flex-start;
  margin-top: 10px;
}

.social-plugin .at-share-btn {
  margin-bottom: 0 !important;
}

.social-plugin .zalo-share-button {
  margin-left: 3px;
}

/* inpage product */
.div-sanpham {
  display: flex;
  flex-flow: wrap;
}

.proprice_item_size,.proprice_item_color{overflow:visible;cursor:pointer;min-width:5rem;min-height:2.125rem;box-sizing:border-box;padding:.25rem .75rem;margin:0 8px 8px 0;color:rgba(0,0,0,.8);text-align:left;border-radius:2px;border:1px solid rgba(0,0,0,.09);position:relative;background:#fff;outline:0;word-break:break-word;display:inline-flex;align-items:center;justify-content:center;}
.proprice_item_size.active,.proprice_item_color.active,.proprice_item_size:hover,.proprice_item_color:hover{color:var(--clr-base,#ee4d2d);border-color:var(--clr-base,#ee4d2d);}
.proprice_item_tick{width:.9375rem;height:.9375rem;position:absolute;overflow:hidden;right:0;bottom:0;display:none;}
.proprice_item_tick::before{content:"";position:absolute;right:-.9375rem;bottom:0;border:.9375rem solid transparent;border-bottom:.9375rem solid var(--clr-base,#ee4d2d);}
.proprice_item_color.active .proprice_item_tick{display:block;}
.nina-svg-icon{display:inline-block;width:9px;height:9px;fill:currentColor;position:relative;}
.proprice_item_tick>.icon-tick-bold{position:absolute;right:0;bottom:0;color:#fff;font-size:8px;}
.proprice_item_size.active>a{color:var(--clr-base);}


/* pagination-home */
.pagination-home{margin: 24px 0;}
.pagination-home .pagination{flex-flow:wrap;}
.page-item .page-link {
  color: var(--main);
  white-space: nowrap;
}

.page-item.active .page-link {
  background: var(--sub);
  color: var(--main);
  border: none;
  transform: translateY(-5px);
}

/* Sản Phẩm Detail */
.grid-pro-detail {
  margin-bottom: 50px;
}

.left-pro-detail {
  position: relative;
  float: left;
  width: 40%;
  text-align: center;
  margin-right: 2%;
}

.left-pro-detail .MagicZoom {
  border: 1px solid #eee;
  padding: 7px;
  border-radius: 5px;
}

.right-pro-detail {
  width: calc(100% - 42%);
  float: left;
}

.gallery-thumb-pro {
  position: relative;
  margin-top: 10px;
}

.owl-thumb-pro {
  padding: 0 40px;
}

.thumb-pro-detail {
  display: block !important;
  border: 1px solid #eee;
  padding: 5px;
  border-radius: 3px;
  cursor: pointer;
}

.thumb-pro-detail.mz-thumb.mz-thumb-selected {
  border-color: #cecfd2;
}

.thumb-pro-detail img {
  box-shadow: none !important;
  filter: brightness(100%) !important;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.title-pro-detail {
  text-transform: capitalize;
  font-size: 20px;
  display: block;
  font-weight: 700;
  margin: 10px 0 15px;
  color: var(--sub);
}

.social-plugin-pro-detail {
  margin-bottom: 1rem;
  margin-top: 0 !important;
}

.desc-pro-detail {
  margin-bottom: 1rem;
  color: #fff;
}

.attr-pro-detail {
  list-style: none;
  padding: 0;
  margin: 0;
  color: #fff;
}

.attr-pro-detail li {
  margin-bottom: .5rem;
}

.attr-label-pro-detail {
  margin: 0 5px 0 0;
}

.attr-label-pro-detail.d-block {
  display: block;
  margin: 0 0 5px 0;
}

.attr-content-pro-detail {
  display: inline-block;
  margin-bottom: 0;
}

.price-new-pro-detail {
  font-weight: 700;
  font-size: 20px;
  color: var(--sub);
}

.price-old-pro-detail {
  font-weight: 400;
  color: var(--color-gray);
  text-decoration: line-through;
  padding-left: 5px;
}

.color-pro-detail {
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: 35px;
  height: 30px;
  margin: 0 0 3px 0;
  border: 1px solid transparent;
}

.size-pro-detail {
  border: 1px solid #ccc;
  padding: 3px 10px 4px 10px;
  display: inline-block;
  position: relative;
}

.size-pro-detail.active,
.color-pro-detail.active {
  border-color: #e5101d;
  color: #e5101d;
}

.color-pro-detail.active:before,
.size-pro-detail.active:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  z-index: 1;
  background-image: url(../images/check-cart.png);
  background-repeat: no-repeat;
  background-position: bottom right;
}

.color-pro-detail input[type=radio],
.size-pro-detail input[type=radio] {
  outline: none;
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100% !important;
  -webkit-appearance: none;
  border: 0;
  top: 0;
  left: 0;
}

.quantity-pro-detail {
  width: 100%;
  max-width: 110px;
  line-height: normal;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: center;
}

.quantity-pro-detail span {
  line-height: 30px;
  padding: 0;
  width: 30px;
  height: 30px;
  color: #fff;
  cursor: pointer;
  font-size: 22px;
  border: 1px solid #cccccc;
}

.quantity-pro-detail span.quantity-plus-pro-detail {
  border-left: 0;
}

.quantity-pro-detail span.quantity-minus-pro-detail {
  border-right: 0;
}

.quantity-pro-detail input {
  height: 30px !important;
  border: 1px solid #cccccc;
  width: calc(100% - 60px);
  text-align: center;
  font-size: 14px;
  padding: 5px;
  line-height: inherit !important;
}

.cart-pro-detail {
  margin-bottom: 1rem;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
}

.cart-pro-detail a {
  width: auto;
  text-align: center;
  color: #fff;
  padding: 8px 15px;
  text-transform: uppercase;
  border-radius: 3px;
  cursor: pointer;
}

.cart-pro-detail a.addnow {
  margin-right: 10px;
  background: #fd6e1d;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fd6e1d), to(#f59000));
  background: -webkit-linear-gradient(top, #f59000, #fd6e1d);
  background: -moz-linear-gradient(top, #f59000, #fd6e1d);
  background: -ms-linear-gradient(top, #f59000, #fd6e1d);
  background: -o-linear-gradient(top, #f59000, #fd6e1d);
}

.cart-pro-detail a.buynow {
  background-color: var(--color-green);
}

.cart-pro-detail a.buynow:hover {
  background-color: var(--color-dark-green);
}

.cart-pro-detail a i {
  vertical-align: top;
  margin-top: 3px;
  margin-right: 8px;
}

.tags-pro-detail {
  margin: 1rem 0 2rem 0;
}

.tags-pro-detail a {
  float: left;
  font-size: 12px;
  color: #fff;
  padding: 5px 10px 7px 10px;
  margin-right: 5px;
  margin-bottom: 5px;
  background-color: var(--color-red);
  border-radius: 3px;
}

.tags-pro-detail a:hover {
  background-color: var(--color-medium-red);
}

.tags-pro-detail a i {
  font-size: 10px;
  float: left;
  margin: 5px 5px 0 0;
}

.tabs-pro-detail {
  margin: 25px 0 0;
}

.tabs-pro-detail .ul-tabs-pro-detail {
  padding: 0;
  margin: 0;
  list-style: none;
  margin-bottom: 15px;
  border-bottom: 1px solid #e7e7e7;
}

.tabs-pro-detail .ul-tabs-pro-detail li {
  cursor: pointer;
  float: left;
  margin-right: 5px;
  margin-bottom: 5px;
  background: #eee;
  padding: 5px 10px;
}

.tabs-pro-detail .ul-tabs-pro-detail li.active {
  background: #333;
  color: #fafafa;
}

.tabs-pro-detail .ul-tabs-pro-detail li:last-child {
  margin-right: 0;
}

.tabs-pro-detail .content-tabs-pro-detail {
  display: none;
}

.tabs-pro-detail .content-tabs-pro-detail.active {
  display: block;
  color: #fff;
}

.mgt-25 {
  margin-top: 25px;
}

.control-carousel {
  position: absolute;
  top: calc(50% - 30px/2);
  margin-bottom: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border: 1px solid #eee;
  z-index: 2;
  background-color: #fff;
  color: #ccc;
  cursor: pointer;
}

.control-carousel:hover {
  background-color: var(--color-red);
  border-color: var(--color-red);
  color: #fff;
}

.prev-carousel {
  left: 0;
}

.next-carousel {
  right: 0;
}

/* price filter */
.boloc-sanpham{margin-bottom:30px;display:flex;}
.boloc-sanpham .khoanggia-sanpham select{border:1px solid #ddd;background-color:#fff;padding:10px 15px;font-size:16px;min-width:200px;}
.boloc-sanpham .boloc-click{margin-left:20px;background:var(--sub);color:#fff;display:flex;align-items:center;padding:5px 15px;cursor:pointer;font-size:18px;}
.boloc-sanpham .boloc-click:hover{opacity:.8;}
.boloc-sanpham .boloc-click i{margin-right:10px;}

/* news */
.grid_news{display: grid;grid-template-columns: repeat(auto-fill,minmax(350px,1fr));gap: 15px;}
.box-news .pic-news{position: relative;overflow: hidden;}
.box-news .name-news{color: var(--white);font-size: clamp(18px,4vw,20px);text-align: center;margin-top: 16px;transition: all .3s ease-in-out;}
.box-news .name-news:hover{color: var(--sub);}
.box-news .time-news{color: #9d9d9d;text-align: center;}
.box-news .desc-news{position: absolute;top: 0;left: 0;background: rgba(255, 203, 132, .8);width: 100%;height: 100%;padding: 10px;text-align: center;transform: translateY(20%);visibility: hidden;transition: transform .3s ease-in-out,visibility .2s ease-in-out;}
.box-news:hover .desc-news{transform: translateY(0);visibility: visible;}
.box-news .desc-news .text-split{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;overflow: scroll;}
.box-news .desc-news a{padding: 10px 20px;display: inline-block;background: rgba(148, 34, 24, .8);border-radius: 60px;color: var(--white);margin-top: auto;width: fit-content;}


.share {
  padding: 20px 10px 10px 15px;
  background: rgba(128, 128, 128, .15);
  margin-top: 15px;
  border-radius: 5px;
}

.share b {
  display: block;
  margin-bottom: 5px;
}

/* Bài viết liên quan */
.othernews b {
  margin-bottom: 10px;
}

.list-news-other {
  padding-left: 10px;
  list-style: square;
}

.list-news-other li {
  margin-bottom: 2px;
}

.list-news-other li a {
  text-transform: none;
  color: #000;
}

.list-news-other li a:hover {
  color: var(--sub);
}

/* contact */
.top-contact {
  display: flex;
  flex-flow: wrap;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 30px;
}

.top-contact .article-contact {
  width: 48%;
  color: #fff;
}

.form-contact {
  width: 47%;
}

.input-contact {
  position: relative;
  margin-bottom: 15px;
}

.input-contact input,
.input-contact textarea {
  width: 100%;
  padding: 0;
  outline: none;
  font-size: 14px;
}

.input-contact input {
  padding: 5px 10px;
}

.input-contact textarea {
  resize: none;
  height: 150px;
  padding: 5px 10px;
}

.input-contact .custom-file-label::after {
  content: attr(title);
}

.bottom-contact {
  position: relative;
  height: 500px;
}

.bottom-contact iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/* breadcrumb */
.breadcrumb{background: transparent;border-top: 1px solid var(--white);border-bottom: 1px solid var(--white);margin: 0;}
.breadcrumb-item{color: var(--white);}
.breadcrumb-item.active{color: var(--sub);}


/* pagination ajax */
.pagination-ajax {
  text-align: center;
  margin: 20px 0;
}

.pagination-ajax a {
  vertical-align: top;
  margin: 3px;
  color: var(--sub);
  background: var(--main);
  border: 1px solid var(--sub);
  font-size: 12px;
  cursor: pointer;
  width: 35px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  transition: all ease 0.3s;
}

.pagination-ajax a:hover {
  background: var(--color-red);
  color: #fff;
  border-color: var(--color-red);
  transform: translateY(-2px);
  transition: all ease 0.3s;
}

.translate img {
  cursor: pointer;
}

.pagination-ajax a.current {
  background: var(--sub);
  color: var(--main);
  border-color: var(--main);
  transform: translateY(0);
}

.title_box {
  border: var(--sub) 1px dotted;
  padding: 10px 20px;
  padding-top: 0;
}

.title_box #title {
  position: relative;
  top: -0.9em;
  margin-left: 1em;
  display: inline;
  background: var(--main);
  font-size: 16px;
  color: var(--sub);
  padding: 0 5px;
}

/* news detail right col */
.wrap-frame-left {position: sticky;position: -webkit-sticky; top: 12px;}
.wrap-frame-left h2 {
  line-height: 30px;
  font-size: 16px;
  text-transform: uppercase;
  margin-bottom: 0;
  font-family: gilr;
  color: var(--sub);
  text-shadow: 0.3px 0.3px 0 #000;
  padding: 7px 10px;
  border-radius: 5px 5px 0 0;
  padding-top: 15px;
  text-align: center;
}

.wrap-frame-left .list-btn-position {list-style: none;padding: 10px 0;}
.list-btn-position li{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;line-clamp: 1;overflow: hidden;margin: 10px 5px;}
.list-btn-position li a {color: #000;}
.list-btn-position li:hover a{color: #e5101d;}

.frame-left>h2:nth-child(2) {
  margin-bottom: 10px;
}
.wrap-frame-left{
  width: 270px;
  float: right;
}
.frame-left {
  border-radius: 10px;
  box-shadow: 0 15px 35px rgba(0,0,0,.1);
}