/* @import url("https://fonts.googleapis.com/css2?family=Cactus+Classical+Serif&display=swap");
@import url("https://fonts.googleapis.com/earlyaccess/cwtexming.css"); */
:root {
  --banner-ratio-720: calc(100vw * (720 / 720)); /* 預設比例 */
  --banner-ratio-1024: calc(100vw * (720 / 1024));
  --banner-ratio-1440: calc(100vw * (624 / 1440));
  --banner-ratio-1280: calc(100vw * (624 / 1280));
  --banner-ratio-1920: calc(100vw * (624 / 1920));

  --ab-bg-1024: calc(100vw * (512 / 1024));
  --ab-bg-1440: calc(100vw * (1080 / 1440));
  --ab-bg-1280: calc(100vw * (720 / 1280));
  --ab-bg-1920: calc(100vw * (1080 / 1920));
  --ab-bg-1080: calc(100vw * (1920 / 1080));
  --ab-bg-750: calc(100vw * (1334 / 750));

  --pro-bg-1024: calc(100vw * (720 / 1024));
  --pro-bg-1440: calc(100vw * (1200 / 1440));
  --pro-bg-1280: calc(100vw * (1080 / 1280));
  --pro-bg-1920: calc(100vw * (1200 / 1920));
}

body,
html {
  font-family: "Cactus Classical Serif", "Noto Sans TC", sans-serif !important;
  scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Cactus Classical Serif", "Noto Sans TC", sans-serif !important;
}

p {
  color: #71706e;
  font-weight: 600;
  letter-spacing: 1.5px;
}

/* common */
.loading-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #1c2022;
  background-image: url(../images/00-hp/bg.jpg);
  background-size: auto;
  background-position: center;
  background-repeat: repeat;
}
.loading {
  font-size: 38px;
  font-family: "新細明體","Montserrat", sans-serif;
  font-weight: 800;
  text-align: center;
  span {
    display: inline-block;
    margin: 0 -0.05em;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .loading {
    font-size: 26px;
  }
}
@media screen and (max-width: 768px) {
  .loading {
    font-size: 16px;
  }
}
/* code #6 */
.loading06 {
  span {
    position: relative;
    color: rgba(#000, 0.2);
    &::after {
      position: absolute;
      top: 0;
      left: 0;
      content: attr(data-text);
      color: #fff;
      opacity: 0;
      transform: rotateY(-90deg);
      animation: loading06 4s infinite;
    }
    @for $i from 1 through 6 {
      &:nth-child(#{$i + 1})::after {
        animation-delay: #{$i * 0.2}s;
      }
    }
  }
}
@keyframes loading06 {
  0%,
  75%,
  100% {
    transform: rotateY(-90deg);
    opacity: 0;
  }
  25%,
  50% {
    transform: rotateY(0);
    opacity: 1;
  }
}

.back-to-top {
  position: fixed;
  display: none;
  right: 30px;
  bottom: 30px;
  z-index: 99;
}

@media (max-width: 768px) {
  .back-to-top {
    bottom: 60px;
  }
}

/* .nav-dropdown {
    border-top: 5px solid #06aed0 !important;
    background: white !important;
  }

  @media (max-width: 992px) {
    .nav-dropdown {
      width: max-content !important;
      border-left: unset;
      border-right: unset;
      border-bottom: unset;
    }
  }

  @media (min-width: 992px) {
    .nav-dropdown {
      border-radius: 10px !important;
    }
  }

  @media (max-width: 991.98px) {
    .navbar .navbar-nav {
      margin-top: 20px;
      border-top: unset;
    }
  } */

.dropdown-item:not(:last-child)::after {
  position: relative;
  width: 100%;
  height: 1px;
  text-align: center;
  content: "";
  display: block;
  margin: 0 auto;
  margin-top: 5px;
  background-color: #71706ecc;
}

.dropdown-item.active,
.dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #06aed0cc;
}

.dropdown-menu {
  border: unset;
}

.navbar .navbar-nav .nav-link {
  color: #6f6f6f !important;
}

.navbar .navbar-nav .nav-link {
  margin-right: 23px;
}

.navbar .navbar-nav .nav-link {
  font-size: 18px;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link.active {
  color: #29b3d3 !important;
}

.dropdown-item {
  /* color: #29b3d3 !important; */
  color: #71706e !important;
  font-size: 15px;
  font-weight: 600;
}

.navbar .navbar-brand {
  position: relative;
  height: inherit !important;
  width: inherit !important;
}

.navbar .navbar-brand img {
  height: 2.3rem;
}

.marquee {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
}
.marquee-text {
  display: inline-block;
  padding-left: 100%;
  animation: marquee 20s linear infinite;
  color: #006813;
  -webkit-animation: marquee 20s linear infinite;
}
@keyframes marquee {
  from {
    transform: translateX(0%);
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
  }
  to {
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
  }
}

.site-navbar {
  background: linear-gradient(to right, #e9eaee, #ffffff) !important;
  top: 0 !important;
}

.site-navbar .site-navigation .site-menu > li > a span {
  font-size: 1.2rem;
  color: #313131;
  font-weight: 700;
  padding: 5px 10px;
}

.site-navbar .site-navigation .site-menu > li > a:hover,
.site-navbar .site-navigation .site-menu > li > a:hover > span{
  color: #313131 !important;
}

.site-navbar .site-navigation .site-menu .active > a span {
  font-size: 1.2rem;
  color: #313131;
  padding: 5px 10px;
  font-weight: 700;
}

.site-navbar .site-navigation .site-menu .active > a span:hover,
.site-navbar .site-navigation .site-menu .active > a span:focus {
  color: #313131 !important;
}

.site-menu li {
  position: relative;
  display: inline-block;
  margin: 0 10px;
}

.site-menu li.active span,
.site-menu li span {
  position: relative;
  display: inline-block;
}
/*
.site-menu li.active span::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid red;
}

.site-menu li span:hover::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid red;
}

.site-menu li.active:hover span::after,
.site-menu li.active:focus span::after {
  display: block;
} */

@media screen and (max-width: 768px) {
  .site-navbar .site-navigation .site-menu .active > a span {
    font-size: 1rem;
  }
}

@media (min-width: 768px) and (max-width: 1280px) {
  .site-navbar .site-navigation .site-menu .active > a span {
    font-size: 1.1rem;
    padding: 5px 5px;
  }
}

@media screen and (max-width: 1024px) {
  .site-navbar .site-navigation .site-menu {
    padding-right: 2rem;
  }
}

.site-mobile-menu {
  width: 190px;
  /* background: #1c2022; */
  padding-top: unset !important;
  margin-top: 80px;
  height: 320px;
}

@media (min-width: 767px) and (max-width: 979px) {
  .site-mobile-menu {
    padding-top: 130px;
  }
}

.site-mobile-menu-body {
  /* background: #1c2022; */
  scrollbar-width: none;
}

.site-mobile-menu .site-nav-wrap a {
  padding-left: unset !important;
  padding: 7px 5px;
  display: block;
  position: relative;
  color: #1c2022;
  font-weight: bold;
}

.site-mobile-menu .site-nav-wrap li:not(:last-child) {
    border-bottom: #71706e 1px solid;
}

.site-mobile-menu .site-nav-wrap a span {
  font-size: 1.2rem;
  color: #1c2022;
  padding: 0px 10px;
}

.offcanvas-menu .site-wrap {
  z-index: 2999;
}

.site-wrap:before {
  position: fixed;
}

.logo-img {
  height: 4rem;
}

@media screen and (max-width: 768px) {
  .logo-img {
    height: 3rem;
  }
}


/* Hero */

.carousel-caption {
  background: transparent !important;
}

#hero {
  min-height: auto !important;
}

#hero .item1,
#hero .item2,
#hero .item3 {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* width: 100vw; */
}

#hero .item1 {
  background-image: url(../images/00-hp/banner01_624.jpg);
}
#hero .item2 {
  background-image: url(../images/00-hp/banner02_624.jpg);
}
#hero .item3 {
  background-image: url(../images/00-hp/banner03_624.jpg);
}

@media (max-width: 768px) {
  #hero .item1,
  #hero .item2,
  #hero .item3 {
    height: var(--banner-ratio-720);
    /* height: 100vw; 以正方形顯示 */
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  #hero .item1,
  #hero .item2,
  #hero .item3 {
    height: var(--banner-ratio-1024);
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  #hero .item1,
  #hero .item2,
  #hero .item3 {
    height: var(--banner-ratio-1280);
  }
}

@media (min-width: 1280px) and (max-width: 1440px) {
  #hero .item1,
  #hero .item2,
  #hero .item3 {
    height: var(--banner-ratio-1440);
  }
}

@media (min-width: 1440px) {
  #hero .item1,
  #hero .item2,
  #hero .item3 {
    height: var(--banner-ratio-1920);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  #hero .item1 {
    background-image: url(../images/00-hp/banner01_1024.jpg);
  }
  #hero .item2 {
    background-image: url(../images/00-hp/banner02_1024.jpg);
  }
  #hero .item3 {
    background-image: url(../images/00-hp/banner03_1024.jpg);
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  #hero .item1 {
    background-image: url(../images/00-hp/banner01_1280.jpg);
  }
  #hero .item2 {
    background-image: url(../images/00-hp/banner02_1280.jpg);
  }
  #hero .item3 {
    background-image: url(../images/00-hp/banner03_1280.jpg);
  }
}

@media (min-width: 1280px) and (max-width: 1440px) {
  #hero .item1 {
    background-image: url(../images/00-hp/banner01_1440.jpg);
  }
  #hero .item2 {
    background-image: url(../images/00-hp/banner02_1440.jpg);
  }
  #hero .item3 {
    background-image: url(../images/00-hp/banner03_1440.jpg);
  }
}

@media (min-width: 1440px) {
  #hero .item1 {
    background-image: url(../images/00-hp/banner01_1920.jpg);
  }
  #hero .item2 {
    background-image: url(../images/00-hp/banner02_1920.jpg);
  }
  #hero .item3 {
    background-image: url(../images/00-hp/banner03_1920.jpg);
  }
}

.site-blocks-cover {
  min-height: auto !important;
  height: auto !important;
  margin-top: 125px;
}

@media screen and (max-width: 768px) {
  .site-blocks-cover {
    margin-top: 80px;
  }
}

.block-quick-info-2 {
  padding: 0;
  background: #e9e7e8;
}

.block-quick-info-2 .block-quick-info-2-inner{
  margin-left: 10rem !important;
  margin-right: 10rem !important;
  position: absolute;
  left: 10px;
  right: 10px;
  margin-top: -130px;
}

@media (max-width: 767px) {
  .block-quick-info-2 .block-quick-info-2-inner{
    margin-left: 1rem !important;
    margin-right: 1rem !important;
    position: relative;
    left: unset;
    right: unset;
  }
}

@media (min-width: 767px) and (max-width: 1280px) {
  .block-quick-info-2 .block-quick-info-2-inner{
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }
}

.hero-news-list {
  background-color: #00001e;
  color: #fff;
  padding: 30px 30px;
}

.hero-news-list p {
  color: #fff;
}

.hero-news-list ul {
  /* list-style: none; */
}

.hero-news-list ul li {
  display: flex;
  margin-bottom: 10px;
  /* display: flex;
  align-items: center;  */
}

.hero-news-list ul li div span {
  font-size: 1.5rem;
  line-height: 0;
  letter-spacing: 0;
  margin-right: 5px;
}

.hero-news-list ul li::marker {
  /* color: red; */
  /* content: '•';
  font-size: 20px;
  line-height: 1;
  margin-right: 8px; */
  /* vertical-align: middle;  */
}

.news-mask {
  position: absolute;
  top: 10px;
  left: 10px;
  width: calc(100% + 10px);
  height: calc(100% - 5px);
  background-color: #6e78a8;
}

.hero-news-slogn {
  background-color: #142165;
  color: #fff;
  padding: 30px 30px;
}

.hero-news-line {
  height: 100%;
  width: 1.2px;
  background-color: #fff;
}

@media screen and (max-width: 997px) {
  .hero-news-line {
    width: 100% !important;
    height: 2px !important;
    background-color: #fff !important;
  }
}

.btn-outline-more {
  color: #fff;
  border: #fff 1px solid;
  border-radius: 30px;
  padding: 5px 20px;
  font-size: 16px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.btn-outline-more:hover {
  background-color: #fff;
  color: #00001e;
}

.btn-outline-more-bluedark {
  color: #00001e;
  border: #00001e 1px solid;
  border-radius: 30px;
  padding: 5px 20px;
  font-size: 16px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.btn-outline-more-bluedark:hover {
  background-color: #00001e;
  color: #fff;
}

.single-ellipsis {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;

  /* line-clamp: 5; */

  /*
  display: flex;
  flex-direction: column;
  line-clamp: 5;
  overflow: hidden;
  */
}

.multiline-ellipsis-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;

  /* line-clamp: 5; */

  /*
  display: flex;
  flex-direction: column;
  line-clamp: 5;
  overflow: hidden;
  */
}

.multiline-ellipsis-5 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;

  /* line-clamp: 5; */

  /*
  display: flex;
  flex-direction: column;
  line-clamp: 5;
  overflow: hidden;
  */
}

.text-with-line {
  display: flex;
  align-items: center; /* 垂直置中 */
}

.text-with-line::after {
  content: "";
  flex-grow: 1; /* 填滿剩餘空間 */
  height: 2px; /* 橫線高度 */
  background-color: white; /* 橫線顏色 */
  margin-left: 10px; /* 文字與橫線間距 */
}


/* About Section */
.about-bg {
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  /* width: 100vw; */
}

@media (max-width: 768px) {
  .about-bg {
    background-image: url(../images/00-hp/ab_bg750.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* width: 100vw; */
    min-height: var(--ab-bg-750);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .about-bg {
    background-image: url(../images/00-hp/ab_bg1024.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* width: 100vw; */
    min-height: var(--ab-bg-1024);
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  .about-bg {
    background-image: url(../images/00-hp/ab_bg1280.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* width: 100vw; */
    min-height: var(--ab-bg-1280);
  }
}

@media (min-width: 1280px) and (max-width: 1440px) {
  .about-bg {
    background-image: url(../images/00-hp/ab_bg1440.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* width: 100vw; */
    /* min-height: var(--ab-bg-1440); */
  }
}

@media (min-width: 1440px) {
  .about-bg {
    background-image: url(../images/00-hp/ab_bg1920.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* width: 100vw; */
    /* height: var(--ab-bg-1920); */
  }
}

.about {
  padding-top: 10rem;
  padding-bottom: 100px;
}

@media (max-width: 768px) {
  .about {
    padding-top: 4rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 768px) and (max-width: 997px) {
  .about {
    padding-top: 25rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 997px) and (max-width: 1024px) {
  .about {
    padding-top: 15rem;
    padding-bottom: 80px;
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  .about {
    padding-top: 12rem;
    padding-bottom: 100px;
  }
}

@media (min-width: 1440px) {
  .about {
    padding-top: 5rem;
    padding-bottom: 100px;
  }
}

.about-section {
  padding-top: 10rem;
  padding-bottom: 100px;
}

@media (max-width: 768px) {
  .about-section {
    padding-top: 4rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 768px) and (max-width: 997px) {
  .about-section {
    padding-top: 25rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 997px) and (max-width: 1024px) {
  .about-section {
    padding-top: 15rem;
    padding-bottom: 80px;
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  .about-section {
    padding-top: 12rem;
    padding-bottom: 100px;
  }
}

.about-title {
  color: #0f1951 !important;
}

.about-title h3 {
  font-size: 1.5rem;
  white-space: nowrap;
}

.about-title p {
  font-size: 0.9rem;
  color: #0f1951 !important;
}

.about-content p {
  color: #2c3145 !important;
  line-height: 2em;
}

/* Local News Section */

.local-news {
  padding-top: 4rem;
  padding-bottom: 10px;
}

.lcoal-news-inner-title {
  padding: 15px 15px;
  border-bottom: 1px dashed #7e7e7e;
  background-color: #e9eaee;
}

.lcoal-news-inner-title h4 {
  font-size: 1.25rem;
  color: #3b4050 !important;
  margin-bottom: 0;
}

.lcoal-news-inner-title span {
  font-size: 1.5rem;
  letter-spacing: 0;
  line-height: 0;
  margin-right: 5px;
}

.local-news-inner-date {

}

.local-news-inner-content {
  color: #48484a !important;
}

.local-news-title {
  color: #0f1951 !important;
}

.local-news-title h3 {
  font-size: 1.5rem;
  white-space: nowrap;
}

.local-news-title p {
  font-size: 0.9rem;
  color: #0f1951 !important;
  white-space: nowrap;
}

.local-news-header {
  background-color: #e9eaee;
  padding: 10px 15px;
}

.local-news-line {
  background-color: #0f1951;
  height: 4rem;
  width: 1px;
  margin: 0 15px;
}

@media screen and (max-width: 997px) {
  .local-news-line {
    height: 1px;
    width: 100%;
    margin: 15px 0;
  }
}

.local-new-sub-txt p {
  color: #0f1951 !important;
  line-height: 1.2em;
}

.local-news-more {
  width: max-content;
}

.local-news-item-title p {
  color: #3b4050 !important;
}

.local-news-item-title span {
  font-size: 1.5rem;
  letter-spacing: 0;
  line-height: 0;
  margin-right: 5px;
}

.local-news-item-date {
  width: max-content;
  color: #3e4050 !important;
  white-space: nowrap;
  margin-left: 5px;
}

.local-news-body {
  margin-top: 15px;
}

.local-news-item {
  padding: 15px 15px;
}

.local-news-item:not(:last-child) {
  border-bottom: 1px dashed #7e7e7e;
}

.local-news-item:nth-child(2n-1) {
  background-color: #e9eaee;
}

.local-news-footer-img {
  border: 5px solid #e9eaee;

}

.local-news-footer-contact-info p {
  color: #0f1951 !important;
  line-height: 1.2em;
}

.local-news-contact-line {
  background-color: #0f1951;
  height: 5rem;
  width: 1px;
  margin: 0 15px;
}

@media screen and (max-width: 997px) {
  .local-news-contact-line {
    height: 1px;
    width: 100%;
    margin: 15px 0;
  }
}

@media (min-width: 768px) and (max-width: 997px) {
  .local-news-imgs {
    width: 100%;
    height: 25rem;
    object-fit: cover;
    object-position: center top;
    margin: 15px 0;
  }
}

@media (max-width: 768px) {
  .local-news-imgs {
    width: 100%;
    height: 18rem;
    object-fit: cover;
    object-position: center top;
    margin: 15px 0;
  }
}

.btn-about-us {
  background-color: #e9eaee;
  color: #0f1951 !important;
  border: 1px solid #0f1951 !important;
  border-radius: 30px;
  padding: 10px 20px;
  font-size: 0.9rem;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.btn-about-us:hover {
  background-color: #0f1951;
  color: #e9eaee !important;
  border: 1px solid #e9eaee !important;
  border-radius: 30px;
  padding: 10px 20px;
  font-size: 0.9rem;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.btn-organization {
  background-color: #0f1951;
  color: #e9eaee !important;
  border: 1px solid #0f1951 !important;
  border-radius: 30px;
  padding: 10px 20px;
  font-size: 0.9rem;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.btn-organization:hover {
  background-color: #e9eaee;
  color: #0f1951 !important;
  border: 1px solid #0f1951 !important;
  border-radius: 30px;
  padding: 10px 20px;
  font-size: 0.9rem;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.footer-left {
  background-color: #00001e !important;
}

.footer-left img {
  height: 5rem;
}

@media (max-width: 768px) {
  .footer-left img {
    height: 4rem;
  }
}

.footer-right {
  background-color: #142165 !important;
}

.footer-right p, .footer-right a {
  color: #fff !important;
  margin-bottom: 0;
}

.footer-link .link, .footer-link .link a {
  color: #b5bcdb !important;
  text-decoration: none;
}

.footer-link .link:not(:last-child)::after {
  content: "|";
  color: #b5bcdb !important;
  margin: 0 15px;
}

.footer-link .link:hover, .footer-link .link a:hover {
  color: #fff !important;
  text-decoration: none;

}

.copyright {
  width: 100%;
  font-size: 15px;
  word-break: break-all;
  color: #b5bcdb !important;
}

@media (max-width: 768px) {
  footer {
    /* padding-bottom: 40px; */
  }
  .footer-link .link:not(:last-child)::after {
    content: "";
    color: #b5bcdb !important;
    margin: 0 15px;
  }
}

.copyright-line {
  background-color: #5d5d60;
  height: 1px;
}

.copyright p,
.copyright p a {
  font-size: 12px;
  color: #b5bcdb !important;
}

.footer-line {
  background-color: #ff5934;
  height: 5px;
}

.line-red {
  background-color: #ff5934;
  height: 1px;
  width: 100%;
  margin: 0 auto;
}

.about-sub-title h4 {
  font-size: 1.35rem;
  color: #292d40 !important;
  font-weight: 900;
  border-left: 5px solid #ff5934;
  padding-left: 10px;
  margin-bottom: 20px;
}

.about-content-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center;
}

.about-pic-2 {
  background-image: url(../images/01/01pic2.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: auto;
}

@media (min-width: 768px) and (max-width: 1200px) {
  .about-pic-2 {
    height: calc(100vw * (624*0.4 / 624));
  }
}

@media (max-width: 768px) {
  .about-pic-2 {
    height: 100vw;
  }
}

@media (max-width: 768px) {
  .about-content-img {
    width: 100% !important;
    height: auto !important;
  }
}

.about-sub-section {
  border: 5px solid #e9eaee;
}

.about-sub-section-left {

}

.content-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 768px) {
  .content-img {
    width: 100% !important;
    height: auto !important;
  }
}


.organization {
  padding-top: 10rem;
  padding-bottom: 100px;
}

@media (max-width: 768px) {
  .organization {
    padding-top: 4rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 768px) and (max-width: 997px) {
  .organization {
    padding-top: 25rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 997px) and (max-width: 1024px) {
  .organization {
    padding-top: 15rem;
    padding-bottom: 80px;
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  .organization {
    padding-top: 12rem;
    padding-bottom: 100px;
  }
}

@media (min-width: 1440px) {
  .organization {
    padding-top: 5rem;
    padding-bottom: 100px;
  }
}

.organization-title {
  color: #0f1951 !important;
}

.organization-title h3 {
  font-size: 1.5rem;
  white-space: nowrap;
}

.organization-title p {
  font-size: 0.9rem;
  color: #0f1951 !important;
}


.organization-sub-title h4 {
  font-size: 1.35rem;
  color: #292d40 !important;
  font-weight: 900;
  border-left: 5px solid #ff5934;
  padding-left: 10px;
  margin-bottom: 20px;
}

.organization-content p {
  line-height: 2em;
  color: #2a2c41 !important;
}

@media screen and (max-width: 768px) {
  .organization-content p {
    line-height: 1.5em;
  }

}

.news {
  padding-top: 10rem;
  padding-bottom: 100px;
}

@media (max-width: 768px) {
  .news {
    padding-top: 4rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 768px) and (max-width: 997px) {
  .news {
    padding-top: 25rem;
    padding-bottom: 50px;
  }
}

@media (min-width: 997px) and (max-width: 1024px) {
  .news {
    padding-top: 15rem;
    padding-bottom: 80px;
  }
}

@media (min-width: 1024px) and (max-width: 1280px) {
  .news {
    padding-top: 12rem;
    padding-bottom: 100px;
  }
}

@media (min-width: 1440px) {
  .news {
    padding-top: 5rem;
    padding-bottom: 100px;
  }
}

.news-title {
  color: #0f1951 !important;
}

.news-title h3 {
  font-size: 1.5rem;
  white-space: nowrap;
}

.news-title p {
  font-size: 0.9rem;
  color: #0f1951 !important;
}

.news-body {
  margin-top: 15px;
}

.news-item {
  padding: 15px 15px;
}

.news-item:not(:last-child) {
  border-bottom: 1px dashed #7e7e7e;
}

.news-item:nth-child(2n-1) {
  background-color: #e9eaee;
}

.news-item-title p {
  color: #3b4050 !important;
}

.news-item-title span {
  font-size: 1.5rem;
  letter-spacing: 0;
  line-height: 0;
  margin-right: 5px;
}

.news-item-date {
  width: max-content;
  color: #3e4050 !important;
  white-space: nowrap;
  margin-left: 5px;
}

.news-inner-title {
  padding: 15px 15px;
  border-bottom: 1px dashed #7e7e7e;
  background-color: #e9eaee;
}

.news-inner-title h4 {
  font-size: 1.25rem;
  color: #3b4050 !important;
  margin-bottom: 0;
}

.news-inner-title span {
  font-size: 1.5rem;
  letter-spacing: 0;
  line-height: 0;
  margin-right: 5px;
}

.news-inner-date {

}

.news-inner-content {
  color: #48484a !important;
}

.btn-outline-back-list {
  color: #00001e;
  border: #00001e 1px solid;
  border-radius: 30px;
  padding: 7px 20px;
  font-size: 16px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.btn-outline-back-list:hover {
  background-color: #00001e;
  color: #fff;
}