@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Aldrich&family=Noto+Sans+TC:wght@100..900&display=swap');

html{
  -webkit-tap-highlight-color:rgba(0,0,0,0);}
body{
  font-family: "Aldrich", "Noto Sans TC", Arial;
  font-weight: normal;}  
a{
  color: #a10215;
  text-decoration: none;
  outline: none;}
a:active, a:hover {
  color: #100f0f;
  text-decoration:none;
  transition: all 0.3s ease 0s;}
::selection {
    background: #a10215;
    color: #fff;}
::-moz-selection {
    background: #a10215;
    color: #fff;}

/*----------------------------------------------------------------------------------HEADER & FOOTER*/

/*NAV*/
nav.navbar_style_EW {
  height: 80px;
  background-color: transparent;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  transition: height 0.2s ease-in-out, background-color 0.2s ease-in-out;
  box-shadow: none !important;}
.navbar-brand img {
  height: 50px;  
  padding: 11px 0;
  transition: height 0.2s ease-in-out;}
.navbar-brand img:hover {
  opacity: 0.7;
  transition: all 0.3s ease 0s;}
.navbar-nav a.nav-link {
  height: 65px;
  line-height: 80px;
  margin-bottom: 15px;
  padding: 0 15px !important;
  color: #fff;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
  transition: color 0.3s ease;}
.navbar-nav a.nav-link:hover, .navbar-nav .active a.nav-link {
  background: #a10215;
  color: #FFF;
  transition: all 0.3s ease 0s;}

@media (min-width: 992px) {
.navbar-nav a.nav-link {
  background: linear-gradient(to bottom, #a10215 50%, transparent 50%);
  background-size: 100% 200%;
  background-position: bottom center;
  transition: background-position 0.4s ease, color 0.4s ease;}
.navbar-nav a.nav-link:hover {
  background-position: top center; 
  color: #a10215;
  color: #FFF;}}

nav.navbar_style_EW.scrolled {
  background-color: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;}
nav.navbar_style_EW.scrolled .logo-light {
  display: none;}
nav.navbar_style_EW.scrolled .logo-dark {
  display: inline-block !important;}

@media (min-width: 768px) {
nav.navbar_style_EW.scrolled .navbar-nav a.nav-link {
  color: #100f0f;}
nav.navbar_style_EW.scrolled .navbar-nav a.nav-link:hover, nav.navbar_style_EW.scrolled .navbar-nav .active a.nav-link {
  color: #FFF;}}
nav.navbar_style_EW.scrolled .navbar-toggler span {
    background: #100f0f;}
nav.navbar_style_EW.scrolled .navbar-toggler.active span {
    background: #FFF;}

.lng_area_EW {
  position: relative;
  display: inline-block;
  padding-left: 15px;}
.lng_area_EW i.fa-earth-asia{
  position: absolute;
  left: 27px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #fff;
  font-size: 1rem;}
.lng_area_EW select {
  padding: 5px 40px;
  background: transparent;
  border: 1px solid #fff;
  border-radius: 6px;
  color: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;}
.lng_area_EW select:focus {
  outline: none;
  border-color: #fff;
  box-shadow: none;}
.lng_area_EW::after {
  content: "\f107";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 1rem;
  color: #fff;}
.lng_area_EW select option {
  color: #100f0f;}

nav.navbar_style_EW.scrolled .lng_area_EW i.fa-earth-asia, nav.navbar_style_EW.scrolled .lng_area_EW select, nav.navbar_style_EW.scrolled .lng_area_EW::after {
  color: #100f0f;}
nav.navbar_style_EW.scrolled .lng_area_EW select {
  border: 1px solid #100f0f;}

@media (max-width: 991px) {
nav.navbar_style_EW {
  height: 50px;
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;}
.navbar-brand img {
  height: 32px;
  padding: 6px 0;}
.navbar-toggler {
    border: none;
    color: transparent;
    background: transparent;
    width: 24px;
    height: 20px;
    position: relative;
    z-index: 10001;
    text-decoration: none;}
.navbar-toggler span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #fff;
    border-radius: 3px;
    left: 0;
    transition: all 0.3s ease-in-out;}
.navbar-toggler span:nth-child(1) { top: 0; }
.navbar-toggler span:nth-child(2) { top: 8px; }
.navbar-toggler span:nth-child(3) { top: 16px; }
.navbar-toggler.active span:nth-child(1) {
    transform: rotate(45deg);
    top: 10px;}
.navbar-toggler.active span:nth-child(2) {
    opacity: 0;}
.navbar-toggler.active span:nth-child(3) {
    transform: rotate(-45deg);
    top: 10px;}
nav.navbar_style_EW.scrolled .navbar-nav a.nav-link {
  color: #FFF;}
nav.navbar_style_EW.scrolled .lng_area_EW i.fa-earth-asia, nav.navbar_style_EW.scrolled .lng_area_EW select, nav.navbar_style_EW.scrolled .lng_area_EW::after {
  color: #FFF;}
nav.navbar_style_EW.scrolled .lng_area_EW select {
  border: 1px solid #FFF;}
.navbar-collapse {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(16, 15, 15, 0.85);
    backdrop-filter: blur(6px);
    z-index: 10000;
    padding-top: 70px;
    transition: opacity 0.2s ease, transform 0.2s ease;
    opacity: 0;
    transform: translateY(-5%);
    pointer-events: none;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;}
.navbar-collapse.show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;}
.navbar-nav {
    /*display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;*/
    width: 100%;
    padding: 1rem;
    text-align: center;
    max-width: 600px;
   margin: 0 auto;}
.navbar-nav a.nav-link {
  height: 55px;
  line-height: 50px;
  font-size: 1.1rem;
  margin-bottom: 15px;
  border-radius: 6px;
  border-bottom-right-radius: 50px;
  border-top-left-radius: 50px;
  padding: 5px !important;
  margin-bottom: 20px;}
.logo_style{
  height: 65px;
  margin-bottom: 25px;}}

/*FOOTER*/
footer {
  background: #100f0f url(../images/bg_footer.jpg) no-repeat center top;
  background-size: cover;
  background-attachment: fixed;
  color: #FFF;
  line-height: 180%;
  text-align: center;}
footer a {
  color: #FFF;}
footer a:hover, footer a:active, footer a:focus  {
  color: #a10215;}
footer img{
  height: 140px;
  margin-top: 15px;}
footer .social_style i{
  display: inline-block;
  margin: 5px 5px 20px;
  font-size: 1.4em;
  transition: transform 0.2s ease;}
footer .social_style i:hover {
  transform: translateY(-5px);}
footer p.mb-0 span i{
  color: #a10215;}
footer p.mb-0 span{
  display: inline-block;
  margin: 5px 20px;}
.footer_links_EW {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;}
.footer_links_EW li {
  display: inline-block;
  margin: 0 0.5rem;}
@media (min-width: 768px) {
.footer_links_EW li:not(:last-child)::after {
  content: "．";
  margin-left: 1rem;}}
.footer_copyright_EW{
  font-size: 0.9em;
  text-align: center;}

/*TO TOP*/
#toTop_EW {
    position: fixed;
    right: 20px;
    bottom: 10%;
    cursor: pointer;
    text-align: center;
    z-index: 3;
    display: none;}
#toTop_EW a {
    display: block;
    width: 50px;
    height: 72px;
    border: 1px #a10215 solid;
    background: url(../images/icon_top.png) no-repeat;
    background-size: cover;
    text-indent: -9999px;
    border-radius: 50px;}
#toTop_EW a:hover {
    opacity: 0.8;
    cursor: pointer;}
@media (max-width: 767px) {
#toTop_EW {
    right: 10px;}
#toTop_EW a {
    width: 35px;
    height: 50px;}}

/*----------------------------------------------------------------------------------COMMON*/

/*TXT*/
.txt_red_EW{
  color:#a10215 !important;}
.txt_gray_EW{
  color:#888 !important;}
.txt_white_EW{
  color:#FFF !important;}

@media (min-width: 768px) {
.py-md-6 {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;}
.py-md-7 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;}}

/*----------------------------------------------------------------------------------INDEX AREA*/

/*BANNER*/
.banner {
  position: relative;}
.carousel-caption {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  color: #fff;
  text-shadow: 0 0 20px rgba(0,0,0,0.8);}
p.banner_txt {
  letter-spacing: 3px;
  font-size: 1.9rem;}
@media (max-width: 1399px) {
p.banner_txt {
  font-size: 1.5rem;}}
@media (max-width: 767px) {
p.banner_txt {
  font-size: 1.2rem;
  line-height: 160%;
  margin-bottom: 0;}}

/*MAIN TITLE*/
.main_title_EW{
  position: relative;
  padding: 0;
  margin-bottom: 50px;
  text-align: center;}
.main_title_EW h2{
  margin: 0;
  padding: 0;
  color: #a10215;
  text-align: center;
  font-size: 2.5rem;}
.main_title_EW h2 span.en{
  display: block;
  letter-spacing: 5px;}
.main_title_EW h2 span.cht{
  display: block;
  letter-spacing: 2px;
  color: #100f0f;
  margin: 10px 0 -15px;
  font-size: 1.5rem;
  font-weight: 500;}
.main_title_EW h2::after {
  content: "";
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 110px;
  height: 4px;
  background-color: #a10215;
  margin-top: 32px;}
.main_title_EW a.btn_more{
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 2px 20px;
  font-size: 1em;
  display: inline-block;
  color: #FFF;
  background: #a10215;
  border: 1px #a10215 solid;
  border-radius: 4px;}
.main_title_EW a.btn_more:hover{
  color: #a10215;
  background: #FFF;
  border: 1px #a10215 solid;}
@media (max-width:991px){
.main_title_EW{
  padding: 0;}
.main_title_EW h2{
  font-size: 1.8rem;}
.main_title_EW h2 span.cht{
  font-size: 1.2rem;}
.main_title_EW h2::after {
  width: 90px;}
.main_title_EW a.btn_more{
  padding: 2px 15px;
  font-size: 0.9em;}}

/*ADVANTAGES*/
.index_advantages_EW{
  position: relative;
  background: #d1e9e9 url(../images/bg_advantages.png) left bottom no-repeat;
  background-attachment: fixed;}
.advantages_area_EW {
  text-align: center;}
.advantages_area_EW .pic{
  display: inline-block;
  width: auto;
  height: auto;
  background: #FFF;
  border-radius: 50%;}
.advantages_area_EW img{
  border-radius: 50%;}
.advantages_area_EW h4{
  margin-bottom: 15px;
  font-weight: 500;
  color: #a10215;}
.advantages_area_EW p{
  font-size: 1.05em;
  line-height: 160%;
  text-align: left;}
.advantages_area_EW .col-12:hover .pic{
  background: #a10215;
  transition: all 0.3s ease 0s;}
.advantages_area_EW .col-12:hover .pic img{
  filter: invert(1);
  transition: all 0.3s ease 0s;
  animation: sway-natural 1.4s ease-out forwards;}
@keyframes sway-natural {
  0%   { transform: rotate(0deg); }
  12%  { transform: rotate(6deg); }
  24%  { transform: rotate(-5deg); }
  36%  { transform: rotate(4deg); }
  48%  { transform: rotate(-3deg); }
  60%  { transform: rotate(2deg); }
  72%  { transform: rotate(-1deg); }
  100% { transform: rotate(0deg); }}
@media (max-width: 767px) {
.advantages_area_EW .pic{
  width: 60%;
  height: 60%;}}

/*NEWS*/
.index_news_EW{
  display: block;
  width: 100%;
  height: auto;
  margin-top: -200px;
  margin-bottom: 40px;}
.news_area_EW{
  background: #fff;
  border: 1px #a10215 solid;
  border-radius: 20px;}
.news_area_EW .main_title_EW{
  position: relative;
  margin-bottom: 0;
  padding: 45px 0;
  background: #a10215;
  border-top-left-radius: 18px;
  border-bottom-left-radius: 18px;}
.news_area_EW .main_title_EW::after{
  content: '';
  position: absolute;
  bottom: -12px; 
  left: 50%; 
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent; 
  border-top: 15px solid #a10215;}
.news_area_EW .main_title_EW h2, .news_area_EW .main_title_EW h2 .en, .news_area_EW .main_title_EW h2 .cht{
  color: #fff;}
.news_area_EW .main_title_EW h2::after {
  background-color: #fff;}
.index_news_EW .news_EW {
  padding: 11px 30px;}
.news_EW .news_list {
  cursor: pointer;}
.news_EW .date {
  text-align: right;
  width: 280px;
  padding-right: 80px;
  flex-shrink: 0;
  font-weight: 600;
  letter-spacing: 2px;
  color: #a10215;}
.index_news_EW .news_EW .date {
  width: 180px;
  padding-right: 0;}
.news_EW .txt {
  flex: 1; 
  min-width: 0;
  padding-right: 10px;
  text-align: left !important;
  white-space: nowrap; 
  overflow: hidden;
  text-overflow: ellipsis;}
.news_EW .news_list:hover .date{
  color: #100f0f;
  transition: all 0.3s ease 0s;}
.news_EW .news_list:hover .txt{
  color: #a10215;
  transition: all 0.3s ease 0s;}
.news_EW .border-bottom {
  border-bottom: 2px #EEE solid !important;}
@media (max-width: 991px) {
.news_area_EW .main_title_EW{
  padding: 52px 0;}
.index_news_EW{
  margin-bottom: 20px;}
.news_EW .date {
  width: 260px;
  padding-right: 60px;}
.news_EW .txt {
  padding-right: 60px;}
.index_news_EW .news_EW .txt {
  padding-right: 10px;}}
@media (max-width: 767px) {
.index_news_EW{
  margin-top: -120px;}
.news_area_EW .main_title_EW{
  padding: 30px 0;
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;
  border-bottom-left-radius: 0;}
.news_area_EW .main_title_EW h2::after {
  margin-top: 10px;}
.news_EW .date {
  text-align: left;
  width: 100%;
  margin-bottom: 5px;}
.news_EW .txt {
  white-space: normal;
  font-size: 1.05em;
  padding-right: 0;}}

/*----------------------------------------------------------------------------------PAGE*/

/*BANNER*/
.page_banner_EW{
  position: relative;
  padding: 0 10px;
  height: 300px;
  background: transparent url(../images/bg_banner.jpg) center center no-repeat;}
.page_banner_EW::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 45px solid transparent;
  border-right: 45px solid transparent;
  border-bottom: 25px solid #fff;}
.page_banner_EW h2{
  position: relative;
  margin: 0;
  padding: 145px 0 0;
  color: #fff;
  text-align: center;
  letter-spacing: 4px;
  font-size: 2.5em;
  text-shadow: 0 0 10px rgba(0,0,0,0.5);}
.page_banner_EW h2::after {
  content: "";
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 110px;
  height: 4px;
  background-color: #a10215;
  margin-top: 10px;}
@media (max-width: 991px){
.page_banner_EW{
  height: 200px;
  background: transparent url(../images/bg_banner.jpg) center left 35% no-repeat;
  background-size: auto 100%;}
.page_banner_EW h2{
  padding: 90px 0 0;
  font-size:1.8em;}}
@media (max-width: 767px){
.page_banner_EW{
  height: 170px;
  background: transparent url(../images/bg_banner.jpg) center left 35% no-repeat;
  background-size: auto 100%;}
.page_banner_EW h2{
  padding: 70px 0 0;
  font-size:1.6em;}
.page_banner_EW::after {
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  border-bottom: 15px solid #fff;}
.page_banner_EW h2::after {
  width: 90px;
  height: 3px;
  margin-top: 7px;}}

/*PATHWAY*/  
.pathway_area_EW{
  float: right;
  width: 100%;
  height: auto;
  margin-top: 50px;
  padding: 0;
  line-height:180%;
  text-align: right;
  font-size: 0.9em;
  color: #FFF;}
.pathway_area_EW span{
  text-shadow: 0 0 10px rgba(0,0,0,0.5);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;}
.pathway_area_EW i{
  display: inline-block;
  margin: 0 6px;
  color: #a10215;}
.pathway_area_EW a{
  color:#FFF;}
.pathway_area_EW a:hover, .pathway_area_EW a:hover i{
  color:#a10215;}
@media (max-width: 991px){
.pathway_area_EW{
  margin-top: 15px;}}
@media (max-width:767px){
.pathway_area_EW{
  margin-top: 15px;
  font-size: 0.8em;}}

main.bg_page_EW{
  background: #FFF url(../images/bg_page.jpg) left bottom 80px no-repeat fixed;
  background-size: auto 50%;
  animation: bgShake 3s ease-in-out infinite alternate;}
@media (max-width: 767px){
main.bg_page_EW{
  background-size: auto 20%;}
/*main.bg_page_EW{
  background: #FFF url(../images/bg_pageR.jpg) right top 50% no-repeat fixed;
  background-size: auto 20%;}*/}

@keyframes bgShake {
  from {
    background-position: bottom 80px left;}
  to {
    background-position: bottom 30px left;}}

/*PAGE TITLE*/
.page_title_EW{
  position: relative;
  padding: 0 0 15px;
  margin: 0 0 25px;
  border-bottom: 4px #dfdfdf solid;
  width:auto;}
.page_title_EW h1{
  padding: 0;
  margin: 0;
  color: #100f0f;
  font-size: 1.8em;
  font-weight: 500;
  letter-spacing: 1px;
  line-height:150%;}
.page_title_EW h1::first-letter {
  color: #a10215;}
.page_title_EW h1::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 110px;
  height: 4px; 
  background-color: #a10215;}
.sharethis-inline-share-buttons{
  z-index: 1 !important;
  margin-bottom: 0;}
@media (max-width:767px){
.page_title_EW{
  padding: 0 0 5px;}
.page_title_EW h1{
  font-size: 1.4em;}
.sharethis-inline-share-buttons{
  margin-bottom: 5px;}}

/*PAGE*/
.btn_prev_EW, .btn_next_EW {
  color: #100f0f;
  border: none;
  padding: 4px 15px;
  font-weight: 600;
  background-color: transparent;
  border-radius: 50px;}
.btn_prev_EW:disabled {
  opacity: 0.5;
  pointer-events: none;}
.btn_prev_EW:hover:not(:disabled), .btn_next_EW:hover, .btn_next_EW:focus {
  color: #a10215 !important;}
.page_select_EW {
  width: auto;
  padding: 3px 15px;
  font-weight: 600;
  color: #100f0f;
  border: 1px solid #100f0f;
  background-color: transparent;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml;utf8,\
      <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' \
      stroke='%23100f0f' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'>\
      <polyline points='4 6 8 10 12 6'/></svg>");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 1rem;
  padding-right: 2rem;
  border-radius: 50px;}
.page_select_EW:focus {
  box-shadow: none;
  border-color: #a10215;
  box-shadow: 0 0 0 0.25rem rgba(161, 2, 21, 0.25);}

.btn_common_EW{
  padding: 5px 35px;
  border: 1px solid #a10215;
  color: #fff;
  border-radius: 4px;
  background: linear-gradient(to right, #a10215 50%, #ffffff 50%);
  background-size: 200% 100%;
  background-position: left bottom;
  transition: background-position 0.4s ease, color 0.4s ease;}
.btn_common_EW:hover, .btn_common_EW:focus {
  border: 1px solid #a10215 !important;
  background-position: right bottom; 
  color: #a10215 !important;}
.btn_common_EW:focus {
  box-shadow: 0 0 0 0.25rem rgba(161, 2, 21, 0.25);}

/*網頁編輯內容*/  
.page_content_EW h2, .page_content_EW h3{
  margin: 5px 0 10px;
  padding: 0;
  width: auto;
  color: #a10215;
  font-size: 1.2em;
  font-weight: 600;
  line-height:150%;
  letter-spacing: 1px;}
.page_content_EW p{
  font-size: 1.05em;
  margin-bottom: 20px;
  line-height: 180%;
  color: #333;
  letter-spacing: 1px;}
.page_content_EW .content_box_EW img{
  margin-top: 5px;
  margin-bottom: 20px;
  max-width: 100%;
  height: auto;}
.page_content_EW .content_box_EW a:hover img{
  opacity: 0.7;
  transition: all 0.3s ease 0s;}
.page_content_EW iframe{
  border-radius: 10px;}
@media (max-width:991px){
.page_content_EW h2{
  font-size: 1.1em;}}

.numlist_EW {
  padding-left: 20px;
  margin-bottom: 20px;}  
.numlist_EW li{
  list-style-type:decimal;
  font-size:1.1em;
  padding-bottom:0;
  line-height:170%;
  color: #555;
  letter-spacing: 1px;}
.numlist_EW li ul li{
  font-size:1em;
  margin-left: -5px;
  list-style-type:upper-alpha;}
.numlist_EW li ul li ul li{
  font-size:1em;
  list-style-type:lower-alpha;}
@media (max-width:991px){
.numlist_EW li{
  font-size: 1em;}}

.arrowlist_EW {
  list-style: none;
  padding-left: 0; 
  position: relative;}
.arrowlist_EW li {
  position: relative;
  padding-left: 1.2em;}
.arrowlist_EW li::before {
  content: "➤";
  color: #a10215;
  position: absolute;
  left: 0; 
  top: 0;}

 /*TABLE*/ 
@media (min-width:992px){
.table_EW table, .news_EW {
  font-size: 1.05em;}}
.table_EW table th, .table_EW table td{
  padding: 15px 15px;
  font-weight: normal;
  background: transparent;
  border: none;
  border-bottom: 2px #eee solid;}
.table_EW table th{
  color: #a10215;}
.table_EW table td{
  color: #333;}
.table_EW table.hover_style tr th, .table_EW table.hover_style tr td {
  transition: background-color 0.3s ease;}
.table_EW table.hover_style tr:hover th, .table_EW table.hover_style tr:hover td {
  background-color: rgba(209, 233, 233, 0.5);}
@media (max-width:767px){
.table_EW table th, .table_EW table td{
  padding: 15px 10px;}}

/*左側選單*/
.left_menu_EW {
  font-size: 1.05em;
  letter-spacing: 1px;}
@media (min-width:992px){
.left_menu_EW {
  font-size: 1.1em;
  padding-right: 30px;}}
.left_menu_EW .accordion-button:not(.collapsed), .left_menu_EW .accordion-button {
  padding: 5px 5px 20px;
  font-size: 0.9em;
  font-weight: 600;
  text-align: left;
  color: #a10215;
  background-color: transparent;
  box-shadow: none;
  letter-spacing: 2px;}
.left_menu_EW .accordion-button::after{
  background-image: none !important;
  content: "+";
  font-size: 22px;
  font-weight: 700;
  color: #a10215;
  line-height: 1;
  display: inline-block;
  transition: transform .3s ease, color .3s ease;
  transform-origin: center center;}
.left_menu_EW .accordion-button:hover::after{
  transform: scale(1.25);}
.left_menu_EW .accordion-button:not(.collapsed)::after{
  content: "−"; 
  transform: rotate(180deg); 
  color: #a10215;}
@media (min-width:768px){
.left_menu_EW .accordion-button::after {
  display: none !important;}}
.left_menu_EW .accordion-item {
  background: transparent;
  border: none;}
.left_menu_EW .list-group-item {
  background: transparent;
  padding: 0;
  border: none;}
.left_menu_EW .list-group-item a{
  position: relative;
  padding: 1rem 1.7rem 0.8rem 1.2rem;
  margin-bottom: 15px;
  display: block;
  width: 100%;
  color: #333;
  background: #fff;
  border-radius: 6px;
  border-left: 5px #a10215 solid;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);}
.left_menu_EW .list-group-item a i{
  position: absolute;
  top: 20px;
  right: 10px;
  display: inline-block;
  color: #cecece;
  font-size: 0.8em;}
.left_menu_EW .list-group-item.active{
  background: transparent;}
.left_menu_EW .list-group-item > a:hover, .left_menu_EW .list-group-item.active > a{
  background: #a10215;
  color: #fff;}

.left_menu_EW .list-group-item > a{
  background: linear-gradient(to left, #ffffff 50%, #a10215 50%);
  background-size: 200% 100%;
  background-position: right bottom;
  transition: background-position 0.4s ease, color 0.4s ease;}
.left_menu_EW .list-group-item > a:hover{
  color: #fff;
  background-position: left bottom;}

.left_menu_EW .list-group-item a:hover i, .left_menu_EW .list-group-item.active > a i{
  color: #fff;}
@media (max-width: 767px) {
.left_menu_EW .accordion-button:not(.collapsed), .left_menu_EW .accordion-button {
  padding: 5px 4px 20px 0;}}

.sub_menu_EW.list-group{
  padding: 5px 0;}
.sub_menu_EW .list-group-item {
  padding-left: 1.4rem;
  border: none;
  font-size: 1em;
  background-color: transparent;
  border: none !important;}
.sub_menu_EW .list-group-item a {
  padding: 0.1rem 0.5rem;
  border-left: none;
  background: transparent;
  text-decoration: none;
  box-shadow: none;
  color: #333;}
.sub_menu_EW .list-group-item a:hover, .sub_menu_EW .list-group-item a.active {
  background: transparent;
  color: #a10215;}

/*FORM*/
.form-control{
  color: #100f0f;
  padding: .5rem .75rem;}
.form-control:focus, .form-check-input:focus {
  color: #100f0f;
  box-shadow: none;
  border-color: #a10215;
  box-shadow: 0 0 0 0.25rem rgba(161, 2, 21, 0.25);}
.form-check-input:checked {
  background-color: #a10215;
  border-color: #a10215;}
.btn-outline-danger{
  color: #a10215;
  border-color: #a10215;}
.btn-outline-danger:hover, .btn-outline-danger:active, .btn-outline-danger:focus {
  color: #fff;
  background-color: #a10215 !important;
  border-color: #a10215 !important;}
.btn-outline-danger:active, .btn-outline-danger:focus {
  box-shadow: 0 0 0 0.25rem rgba(161, 2, 21, 0.25);}

/*PRODUCTS*/
.proPosition_EW{}
.proPosition_EW i.fa-magnifying-glass{
  position: absolute;
  bottom: -8px;
  right: 10%;
  display: inline-block;
  font-size: 2.2em;
  color: #a10215;
  padding: 0 5px;
  background: #fff;}
.proPosition_EW:hover i.fa-magnifying-glass{
  transform: rotate(360deg);
  transition: transform 0.6s ease; }
.products_list_EW { 
  position: relative; 
  display: flex;
  background: #FFF;
  border: 1px solid #a10215;
  border-radius: 20px;}
.products_list_EW .pic {
  width: 50%;
  position: relative;
  overflow: hidden;
  border-top-left-radius: 18px;
  border-bottom-left-radius: 18px;}
.products_list_EW .pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;}
.products_list_EW:hover .pic img {
  transform: scale(1.05);}
.products_list_EW .txt {
  width: 50%;
  padding: 2rem;
  letter-spacing: 1px;
  display: flex;
  flex-direction: column;
  justify-content: center;}
.products_list_EW .txt h3{
  font-size: 1.4em;
  line-height: 140%;
  color: #a10215;
  max-height: 63px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;}
.products_list_EW .txt p{
  color: #100f0f;
  font-size: 1.1em;
  line-height: 160%;
  max-height: 169px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;}
.overlay_style {
  position: absolute;
  inset: 0;
  background: rgba(161, 2, 21, 0.9);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  opacity: 0;
  transition: opacity .3s ease;
  font-size: 1.25rem;
  letter-spacing: 1px;}
.products_list_EW:hover .overlay_style {
  opacity: 1;}
.products_page_EW .products_list_EW {
    flex-direction: column;}
.products_page_EW .products_list_EW .pic,
.products_page_EW .products_list_EW .txt {
    width: 100%;}
.products_page_EW .products_list_EW .txt {
  padding: 1.5rem;}
.products_page_EW .products_list_EW .pic {
  border-radius: 0;
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;}
.products_page_EW .products_list_EW .txt h3{
  font-size: 1.2em;
  max-height: 54px;}
.products_page_EW .products_list_EW .txt p{
  font-size: 1.05em;
  max-height: 85px;
  -webkit-line-clamp: 3;}
.products_page_EW .proPosition_EW i.fa-magnifying-glass{
  font-size: 1.5em;}
@media (max-width: 1199px) {
.products_list_EW .txt p{
  max-height: 85px;
  -webkit-line-clamp: 3;}}
@media (max-width: 991px) {
  .products_list_EW {
    flex-direction: column;}
  .products_list_EW .pic,
  .products_list_EW .txt {
    width: 100%;}
.products_list_EW .pic {
  border-radius: 0;
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;}
.proPosition_EW i.fa-magnifying-glass{
  font-size: 1.5em;}}
@media (max-width: 767px) {
.proPosition_EW{
  margin-top: 30px;}
.products_list_EW .txt {
  padding: 1.5rem;}
.products_list_EW .txt h3{
  font-size: 1.2em;
  max-height: 54px;}
.products_list_EW .txt p{
  font-size: 1.05em;}}

/*PRODUCTS*/
.products_list_EW .pic.detail_style {
  border-radius: 18px;}
.products_info_EW h2{
  margin: 5px 0 10px;
  padding: 0;
  width: auto;
  color: #a10215;
  font-size: 1.3em;
  font-weight: 500;
  line-height:150%;
  letter-spacing: 1px;}
.products_info_EW p{
  font-size: 1.05em;
  margin-bottom: 20px;
  line-height: 180%;
  color: #333;
  letter-spacing: 1px;}
@media (max-width:991px){
.products_info_EW h2{
  font-size: 1.2em;}}

.nav-pills{
  border-radius: 50px;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);}
.nav-pills .nav-link {
  border: none;
  border-radius: 50px;
  background-color: #fff;
  color: #a10215;
  font-size: 1.1em;
  letter-spacing: 2px;
  padding: 10px 0 5px;
  transition: all 0.3s;}
.nav-pills .nav-link.pills_L{
  border-radius: 0;
  border-top-left-radius: 50px;
  border-bottom-left-radius: 50px;}
.nav-pills .nav-link.pills_C{
  border-radius: 0;}
.nav-pills .nav-link.pills_R{
  border-radius: 0;
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;}
.nav-pills .nav-link.active, .nav-pills .nav-link:hover {
  background-color: #a10215;
  color: #fff;}
.nav-pills .nav-item {
  flex: 1;
  text-align: center;}  
@media (max-width:991px){
.nav-pills .nav-link {
  font-size: 1.05em;
  letter-spacing: 0;
  padding: 10px 0 5px;}}