/* Theme Name: The Project - Responsive Website Template
Author:HtmlCoder
Author URI:http://www.htmlcoder.me
Author e-mail:htmlcoder.me@gmail.com
Version: 2.0.5
Created:December 2014
License URI:http://support.wrapbootstrap.com/
File Description: Place here your custom CSS styles
img {
    pointer-events: none;
}
*/

.header .navbar-nav li li a {
  background-color: #7d090a;
  color:#fff;
  border:1px solid #974243;
}

.breadcrumb {
  padding:10px 10px 10px 0;
  font-weight: 400;
  font-size: 16px;
}

.breadcrumb-container {
  background-color: #ecd297;
  color:black;
}

.breadcrumb-item + .breadcrumb-item:before {
  color:black;
}

.nav.flex-column > li .nav-link.active, .nav.flex-column > li .nav-link.active:hover, .nav.flex-column > li .nav-link.active:focus, .nav.flex-column > li .nav-link:hover, .nav.flex-column > li .nav-link:focus {
  color:#c82727;
}

.nav.flex-column > li .nav-link.active, .nav.flex-column > li .nav-link.active:hover, .nav.flex-column > li .nav-link.active:focus, .nav.flex-column > li .nav-link:hover, .nav.flex-column > li .nav-link:focus {
  background-color: #f4efc9;
  padding-left:20px;
}

.nav.flex-column > li .nav-link {
  font-size:17px;
  color:#333;
  padding:7px 0px;
  font-weight:400;
}

.dark .footer {
  background-color:#7d090a;
}

.fixed.header .main-navigation.animated .navbar-nav > li > a {
  font-weight:500;
}

.header .navbar-nav li li a:focus, .header .navbar-nav li li a:hover, .header .navbar-nav li .show > a, .header .navbar-nav li li a.show, .header .navbar-nav li .active > a, .header .navbar-nav li li a.active {
  background-color:#f4efc9;
  color:#b42424;
}

.link-dark:hover {
  text-decoration:none !important;
}

.image-box {
  margin-bottom:30px;
}

.image-box .body:hover {
  background-color:#f4efc9;
  color:#b42424;
}

.nav-tabs.style-4 {
  margin-bottom: 15px;
  border-bottom: 1px solid #7d090a;
}

.nav-tabs.style-4 > li > a {
  color: #7d090a;
}

.nav-tabs.style-4 > li > a:hover {
  color: #ffffff;
  background-color: #7d090a !important;
  border-color: #7d090a;
  border-bottom-color: #7d090a !important;
}

.nav-tabs.style-4 > li > a:focus {
  border-color: #7d090a;
  background-color: #7d090a;
}

.nav-tabs.style-4 > li > a.active,
.nav-tabs.style-4 > li > a.active:hover,
.nav-tabs.style-4 > li > a.active:focus {
  color: #ffffff;
  cursor: default;
  background-color: #7d090a;
  border-color: #7d090a;
  border-bottom-color: transparent;
}

.ribbon-2 {
  --f: 10px; /* control the folded part*/
  --r: 15px; /* control the ribbon shape */
  --t: 10px; /* the top offset */
  z-index:9999;
  margin-right:16px;
  position: absolute;
  inset: var(--t) calc(-1*var(--f)) auto auto;
  padding: 0 10px var(--f) calc(10px + var(--r));
  clip-path: 
    polygon(0 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%,
      calc(100% - var(--f)) calc(100% - var(--f)),0 calc(100% - var(--f)),
      var(--r) calc(50% - var(--f)/2));
  background: #ff0000;
  box-shadow: 0 calc(-1*var(--f)) 0 inset #0005;
  color:white;
  font-size:1.7em;
}

/* 加大版面 */
@media (min-width: 1440px) {
  .container {
    max-width: 1380px;
  }
  .container .mega-menu--wide .dropdown-menu {
    width: 1380px !important;
  }

  .main-navigation .navbar-nav > li:first-child {
    margin: 0;
  }

  .container .col-lg-auto .mega-menu .dropdown-menu {
    left: auto !important;
    right: 0px !important;
    width: 1380px !important;
  }
}

@media (min-width: 1600px) {
  .container {
    max-width: 1540px;
  }
  .container .mega-menu--wide .dropdown-menu {
    width: 1540px !important;
  }

  .main-navigation .navbar-nav > li:first-child {
    margin: 0;
  }

  .container .col-lg-auto .mega-menu .dropdown-menu {
    left: auto !important;
    right: 0px !important;
    width: 1540px !important;
  }
}

@media (min-width: 1920px) {
  .container {
    max-width: 1860px;
  }
  .container .mega-menu--wide .dropdown-menu {
    width: 1860px !important;
  }

  .main-navigation .navbar-nav > li:first-child {
    margin: 0;
  }

  .container .col-lg-auto .mega-menu .dropdown-menu {
    left: auto !important;
    right: 0px !important;
    width: 1860px !important;
  }
}

/* 元件css */
  /* 副標題 */
  .ja_h2 {
    font-weight:500;
    font-size: 1.4em;
    color:#97291c; 
  }
  /* 文字元件 */
    .ja_a {
      font-size:16px;
      color:#000000;
      line-height:1.5em;
    }
    /* 灰背景 */
    .jaa_graybg {
      background: #f4efc9;
      padding:10px;
      border-radius: 10px;
    }
    /* 首行縮排 */
    .jaa_firstident {
      text-indent: 2em;
    }
    /* 斜體 */
    .jaa_italic {
      font-style: italic;
    }
    /* 粗體 */
    .jaa_bold {
      font-weight: 800;
    }
    
  /* 圖片元件 */
    .ja_p {
      padding:0 10px 10px 10px;
    }
    .ja_p img {
      width:100%;
    }
    /* 圖說 */
    .jap_alt {
      width:100%;
      text-align:center;
    }
    /* 對齊 */
    .jap_center {
      margin-left:auto;
      margin-right:auto;
    }
    .jap_left {
      float:left;
    }
    .jap_rigth {
      float:right;
    }
    /* 寬度25 */
    .jap_w25 {
      width:25%;
    }
    .jap_w50 {
      width:50%;
    }
    .jap_w75 {
      width:75%;
    }
  /* 連結元件 */
    .ja_l {
      color:black;
      font-weight:500;
      width: 100%;
      background-color:#ecd297;
      border-color:#ecd297;
    }
    .ja_l:hover {
      background-color:rgba(207,165,36,1);
      border-color:rgba(207,165,36,1);
    }
  /* 附件元件 */
    .ja_f {
      width: 100%;
    }
  /* Youtube元件 */
    .video-container {
      position:relative;
      padding-bottom:56.25%;
      padding-top:30px;
      height:0;
      overflow:hidden;
    }
    .video-container iframe, .video-container object, .video-container embed {
      position:absolute;
      top:0;
      left:0;
      width:100%;
      height:100%;
    }
    
  /* 地圖元件 */
    .ja_m {
      width:100%;
      min-height:650px;
      border:8px #eeeeee solid;
      margin:10px auto;
    }
    
    
  /* 不同尺寸畫面 */ 
    @media (max-width: 576px) {
      .jap_w25, .jap_w50, .jap_w75 {
        width: 100%;
      }
      .ja_m {
        min-height: 450px;
      }
    }
    @media (max-width: 768px) {
      .jap_w25, .jap_w50 {
        width: 100%;
      }
      .ja_m {
        min-height: 450px;
      }
    }
    
.overlay-visible .overlay-bottom, .overlay-visible .overlay-top {
  background-color:#7d090a;
}