html, body {
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* Reset by titstudio.com */
:root{
  --cnvs-themecolor:#212529;
  --bs-body-font-size: .875rem;
  --cnvs-header-height: 60px;
}

#header {
  --cnvs-primary-menu-submenu-display-speed:  0s;
  --cnvs-mobile-menu-off-canvas-width: 100%;
  --cnvs-primary-menu-font-size: 0.875rem;
  --cnvs-primary-menu-font-weight: 400;
}
body,
h1,h2,h3,h4,h5,h6,
p,ul,li{
  font-family: "PingFang SC", "Helvetica Neue", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
a{text-decoration: none!important; color: #00204a;}
body.no-scroll {
  overflow: hidden;
  position: fixed;
  width: 100%;
}
@media (max-width: 767.98px) {
    h4, .h4 {
      font-size: var(--cnvs-font-size-h4);
    }
}
.fs-7{font-size: 0.875rem;}
.aspect-3-2{aspect-ratio: 600 / 400!important;}
.aspect-1-1{aspect-ratio: 800 / 800!important;}
.aspect-2-3{aspect-ratio: 400 / 600!important;}

.section{margin: 0!important;}
.line, .double-line{border-top: none;}
.btn:hover{top: 0}
.site{margin-top: 90px;}
.navbar-brand-image{

  /*filter: brightness(0) invert(1);*/
}
.rating-color{color: #00204a!important;}
.menu-bg-wrap{ padding: 0 30px ;background-color: transparent; box-shadow: none; position: static;}
.site-nav .site-navigation .site-menu > li > a,
.site-nav .site-navigation .site-menu > li.active > a{color: #0d1d3c;}
.site-mobile-menu .site-nav-wrap > li > a,
.site-mobile-menu .site-nav-wrap > li > ul > li > a{font-size: 16px;}

.menu-item .sub-menu-container.dynamic-submenu {
  top: auto !important; 
}


.primary-menu .mega-menu-content,
.primary-menu-active .menu-container{background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), url('../images/hero_bg_2.jpg'); background-size: cover; background-position: center bottom; backdrop-filter: blur(100px);}
.primary-menu-active.primary-menu .mega-menu-content{background-image: none; backdrop-filter: none;}
.primary-menu-active .menu-container .fs-5,
.primary-menu-active .menu-container .fs-6,
.primary-menu-active .menu-container .fs-7{ font-size: 0.875rem !important;}
.sub-menu-container .menu-item > .menu-link div{padding-right: 1.5rem;}
.is-expanded-menu .mega-menu-style-2 .sub-menu-container:not(.mega-menu-dropdown) .menu-item:not(.mega-menu-title):hover > .menu-link{
  --cnvs-primary-menu-submenu-hover-padding-offset: 0.25rem;
  padding-right: 0.25rem;
  padding-left: 0.25rem;
  --cnvs-primary-menu-submenu-hover-bg: rgba(255, 255, 255, 0.5);
}
.sub-menu-container .menu-item .sub-menu-container{
  background-color: transparent;
  box-shadow: none;
  border: none;
}
.is-expanded-menu .mega-menu-content .sub-menu-container.mega-menu-dropdown{ padding:0; }
.is-expanded-menu .sub-menu-container, .is-expanded-menu .mega-menu-content{    transition: top 0s ease;}
.is-expanded-menu .primary-menu:not(.on-click) .menu-item:hover > .sub-menu-container, .is-expanded-menu .primary-menu:not(.on-click) .menu-item:hover > .mega-menu-content{
  transition: none;
  border-top: 0 none;
}

.is-expanded-menu .nav-pills .nav-link.active, .is-expanded-menu .nav-pills .show > .nav-link{ background-color: rgba(255, 255, 255, 0.5);color: var(--cnvs-heading-color);}
.is-expanded-menu .nav-pills .nav-link{position: relative;}
.is-expanded-menu .nav-pills .nav-link i.sub-menu-indicator{ 
  display: block;
  position: absolute;
  top: 50%;
  right: 10px;
  line-height: 1;
  margin: 0;
  transform: translateY(-50%) rotate(-90deg);
}
.is-expanded-menu .nav-pills .nav-link a,
.is-expanded-menu .nav-pills .nav-link a:hover {background-color: transparent;color: var(--cnvs-heading-color);}

.hero-slide {
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0; /* 初始透明度 */
    transition: opacity 1s ease-in-out; /* 使用opacity来渐变 */
}
.slide.active {
    opacity: 1; /* 当前活动幻灯片 */
}
.hero .form-search .form-control {
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 20px;
  padding-right: 20px;
  border: none;
  border-radius: 30px; }
  .hero .form-search .form-control:hover, .hero .form-search .form-control:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none; }
.hero .form-search .form-control {
  margin-right: 10px; }
.hero .form-search .btn {
  background-color: #005555;
  padding-left: 30px;
  padding-right: 30px;
  color: #fff; }
  .hero .form-search .btn:hover, .hero .form-search .btn:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none; }


#homeHero.overlay:before{background-color:  rgba(34, 34, 34, 0.2);}
.hero .form-search .btn,
.btn.btn-primary { background-color: #0d1d3c;}
.fullpage .hero .container {
    position: relative;
    z-index: 2;
}
.hero .form-search .btn{width: 64px; border-radius: 30px;}
.hero .form-search .btn:hover{opacity: 0.9;}
.hero, .hero > .container > .row{overflow: hidden;}
.hero .heading{color: #00204a;}
.breadcrumb {margin: 0; margin-bottom: 1rem;font-size: 0.8rem;}
.section.bg-bluelogo{background-color: #0d1d3c;}

/*Home Mobile BG*/
 @media (max-width: 576px) {
  .hm1{
    background-image:url(../images/hero/m4.jpg)!important;
  }
  .hm2{
    background-image:url(../images/hero/hm2.jpg)!important;
  }
  .hm3{
    background-image:url(../images/hero/hm3.jpg)!important;
  }
  .mbg1{
    background-image:url(../images/hero/m1.jpg)!important;
  }
  .mbg2{
    background-image:url(../images/hero/m2.jpg)!important;
  }
  .mbg3{
    background-image:url(../images/hero/m3.jpg)!important;
  }
  .mbg4{
    background-image:url(../images/hero/hm1.jpg)!important;
  }
  .mbg5{
    background-image:url(../images/hero/m5.jpg)!important;
  }

}

/*Course List Page */
.relation-designer .designer-avatar{border-radius: 50%; width: 24px; height: 24px;}
.nav-tab-tit { border-bottom: none; }
.nav-tab-tit a.nav-link{
    border: 1px solid #e4e4e4;
    border-radius: 30px;
    padding: 5px 20px;
    margin: 0 10px;
    color: #000;

}
.nav-tab-tit a.nav-link.active{background-color: #000; color: #FFF; border-color: #000;}


/* Course Detail Page */
.tips-content p{margin-bottom: 1rem;}
.detail p img{max-width: 100%;}
.additional-info{
  bottom: 0;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  justify-content: space-between;
  height: 5rem;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(0.9rem);
  border-top: 0.1rem solid var(--border-light);
  z-index: 1;
  font-size: 18px;
  color: #FFF;
}
.additional-info a{color: #FFF;}
.additional-info .info-title{
  padding-left: 5px;
  line-height: 1;
  margin-right: 10px;
  border-right: 0.1rem solid rgba(255, 255, 255, 0.1);
}
.additional-info .info-designer{
  background-color: rgba(255, 255, 255, 0.25);
  /*backdrop-filter: blur(0.9rem);*/
  display: inline-block;
  padding: 7px 10px;
  border-radius: 30px;
  line-height: 1;
  font-size: 14px;
}
.additional-info .info-designer .designer-avatar{border-radius: 50%;}
.additional-info .dropdown-toggle{border-radius: 30px; padding: 5px 15px; line-height: 1.1;}
.additional-info .dropdown-toggle:hover{top: 0;}
.additional-info .dropdown-toggle::after{display: none;}

.additional-info .dropdown-menu{ animation-duration: .3s;}
.additional-info .dropdown-menu li{padding: 5px 10px;}
.additional-info .dropdown-menu .dropdown-item{border-radius: 30px;background-color: #999;}
.page-inner .container-fluid{padding-top:100px; z-index: 3;}
.page-inner .hero-title{
  position: relative;
  display: flex;
  flex-direction: column;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  flex: 1 1 0%;
  text-align: center;
}
.additional-info p.rating{
  cursor: default;
  border-radius: 30px;
  display: inline-block;
  margin-right: 20px;
  padding: 6px 10px;
  line-height: 1.1;
  background-color: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(0.9rem);
}
.additional-info .info-designer:hover,
.additional-info p.rating:hover{background-color: rgba(255, 255, 255, 0.3);}
.additional-info p.rating span.text{line-height: 1.1;}
.hero.page-inner, .hero.page-inner > .container > .row{overflow: inherit;height: 350px; max-height: 500px;}
.hero.page-inner .breadcrumb{
  /*border-bottom: 0.1rem solid rgba(255,255,255,0.1);*/
  padding: 10px 30px;
}
.reviewlist{ }
.reviewlist p{line-height: 1.7rem;}
.course-additinal .star-rating i,
.reviewlist .star-rating i{color: #2271b1; margin-right: 2px;}
.course-sidebar{/*max-width: 300px ;position: absolute; left: 0;*/}
@media (max-width: 1068px){
  .course-sidebar{position: static}
}
.course-additinal .ranking{ display: inline-block; border: 1px solid #f2f2f2; border-radius: 12px;}
.course-additinal .ranking:hover{background-color: #f2f2f2; cursor: default;}
.course-additinal .ranking span{display:block ;}
.course-additinal h5{font-size: 18px;}

.section.bg-bluelogo .text-primary{color: #FFF !important;}
.section.bg-02{ background-color: rgba(0, 32, 74, 0.05); }
.post-detail table{width: 100%;margin-bottom: 20px; border-top: 1px solid #e4e4e4; border-left: 1px solid #e4e4e4;}
.post-detail td{border-right: 1px solid #f2f2f2;border-bottom: 1px solid #f2f2f2; padding: 10px;}
.post-summary p,
.post-detail td,
.post-detail p{font-size: 1rem;}
.post-detail p img{max-width: 100%;}

@media (max-width: 960px){
  .section-4.bg-02,
  .section-4.bg-light{
    /*background-size: inherit!important;*/
    
  }
}
.posts-navigation{margin-bottom: 30px;}
.burger.light:before, 
.burger.light span, 
.burger.light:after{background: #0d1d3c;}

.courseNavlist {
  position: relative; /* 保证子菜单的定位参照 */
  height: 100%;       /* 你已用 vh-100，可继续保持 */
  overflow: hidden;   /* 防止子菜单溢出 */
}

.courseNavlist ul.dropdown {
  position: absolute;
  top: 0;
  left: 100%;
  z-index: 100;
  overflow-y: auto;
  max-height: 100vh; /* 限高为视口高度，或你可以改成 parent 的实际高度 */
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  background: #fff;  /* 背景建议加上，避免滚动出空 */
  min-width: 220px;  
  transition: top 0.2s ease;
}



.section .fullscreen .container{padding-top: 270px; padding-bottom: 70px;}
.section .feature-text h1{position: relative; padding-bottom: 15px; margin-bottom: 30px;}
.section .feature-text h1 a{
  position: relative;
}

.section .feature-text h1 a:after{
  content: "";
  position: absolute; bottom: -5px; right: 0;
  display: block; width:100%; height: 1px; background-color: #ffffff;
}
.section .feature-text.text-end h1:after{right: 3px;}
.section .feature-text p{font-size: 18px;}
.feature-h .feature-text .heading{font-size: 2rem;}
.section .btn-primary.tit-btn{ border-radius: 0; background-color: transparent;letter-spacing: 1px; color: #fff; border: 1px solid #dcd4bf!important;}
.section .btn-primary.tit-btn:hover{background-color:#dcd4bf; top: 0 ;}

.editor-styles-wrapper, .entry-content img{max-width: 100%; height: auto;}
/* Item List */
.events-section.section-bg .container > .row {
  margin-right: 5px;
  margin-left: 5px;
}

.events-section.section-bg .container > .row .row {
  margin: auto;
}

.events-listing-section {
  margin-bottom: 100px;
}

.events-detail-section .custom-block-info {
  padding: 40px 60px;
}

.events-detail-info {
  background-color: var(--section-bg-color);
  border-radius: var(--border-radius-medium);
  padding: 50px 25px;
}

.events-title {
  font-size: var(--h3-font-size);
  font-weight: var(--font-weight-medium);
}
.custom-block {
  border-radius: var(--border-radius-medium);
  position: relative;
  overflow: hidden;
  padding: 30px 20px;
}

.custom-block-bg {
  background: var(--white-color);
}

.custom-block-date-wrap {
  background-color: var(--primary-color);
  border-radius: var(--border-radius-medium);
  text-align: center;
  padding: 20px 30px;
}

.custom-block-date {
  font-size: var(--h1-font-size);
}

.custom-block-image-wrap {
  border-radius: var(--border-radius-medium);
  position: relative;
  overflow: hidden;
}

.custom-block-image-wrap:hover .custom-block-image {
  transform: scale(1.2);
}

.custom-block-image-wrap:hover .custom-block-icon {
  opacity: 1;
}

.custom-block-image {
  transition: all 0.3s;
}

.custom-block-image-wrap .custom-block-date-wrap,
.custom-block-image-wrap .custom-btn-wrap {
  position: absolute;
  bottom: 0;
}

.custom-block-image-wrap .custom-block-date-wrap {
  border-radius: 0;
  left: 0;
  width: 50%;
  padding: 12.30px 20px;
}

.custom-block-image-wrap .custom-btn-wrap {
  right: 0;
  width: 50%;
}

.custom-block-image-wrap .custom-btn  {
  border-radius: 0;
  display: block;
  padding: 15px 20px;
}

.custom-block-info {
  padding-top: 10px;
}

.custom-block-image-wrap + .custom-block-info {
  padding-top: 20px;
}

.custom-block-span {
  color: var(--secondary-color);
  font-weight: var(--font-weight-bold);
  min-width: 110px;
  margin-right: 10px;
}

.custom-block-icon {
  background: var(--custom-btn-bg-color);
  border-radius: var(--border-radius-large);
  color: var(--white-color);
  width: 60px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-size: var(--h3-font-size);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: all 0.5s;
}

.custom-block-icon:hover {
  background: var(--custom-btn-bg-hover-color);
  color: var(--white-color);
}
/* Course Module */
.course-list-items li{border: 1px solid #f2f2f2; border-radius: 10px;min-height: 35px; line-height: 35px;padding: 0.3rem .7rem; margin-bottom: 7px;}
.course-list-items li:hover{background-color: #f2f2f2;}

#coursesIndex li a h3{color: #00204a;}
#coursesIndex li a:hover *{color:#0a58ca ;}
/* Designer Module */
.custom-block-image-wrap .designer-avatar{max-width: 150px;}

/* Post Module */
.post-thumbnail img{max-width: 100%; height: auto;}
.pagination {margin-top: 30px;color: #838893;}
.pagination {display: flex;padding: 0;margin: 0;list-style: none;margin: 0 5px;transition: 0.3s;}
.pagination a, .pagination span{color: var(--color-secondary); padding: 7px 16px;display: flex;align-items: center;justify-content: center;margin: 0 2px;}
.pagination span,
.pagination a:hover {background: #00204a;color: #fff;}

/* Entry*/
.top100-list h3.entry-title,
.category-1 h3.entry-title,
.category-35 h3.entry-title,
.post-type-archive h3.entry-title {font-size: 16px;}

.site-footer{}
/* Contact Form */
.wpcf7-form .form-control{font-size: 14px;}
.wpcf7-form input.form-control{height: 42px; padding-top: 0; padding-bottom: 0;}
.wpcf7-form .row div p{margin-bottom: 0;}



/* Lightbox */
.lightbox-modal .slide{opacity: 1; position: static;}

.lightbox-modal .modal-content {
  background-color: var(--lightbox);
}

.lightbox-modal .btn-close {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  font-size: 1.25rem;
  z-index: 10;
  filter: invert(1) grayscale(100);
}

.lightbox-modal .modal-body {
  display: flex;
  align-items: center;
  padding: 0;
}

.lightbox-modal .lightbox-content {
  width: 100%;
}

.lightbox-modal .carousel-indicators {
  margin-bottom: 0;
}

.lightbox-modal .carousel-indicators [data-bs-target] {
  background-color: var(--carousel-text) !important;
}

.lightbox-modal .carousel-inner {
  width: 75%;
}

.lightbox-modal .carousel-inner img {
  animation: zoomin 10s linear infinite;
}

.lightbox-modal .carousel-item .carousel-caption {
  right: 0;
  bottom: 0;
  left: 0;
  padding-bottom: 2rem;
  background-color: var(--lightbox);
  color: var(--carousel-text) !important;
}

.lightbox-modal .carousel-control-prev,
.lightbox-modal .carousel-control-next {
  width: auto;
}

.lightbox-modal .carousel-control-prev {
  left: 1.25rem;
}

.lightbox-modal .carousel-control-next {
  right: 1.25rem;
}

@media (min-width: 1400px) {
  .lightbox-modal .carousel-inner {
    max-width: 60%;
  }
}

[data-bs-theme = "dark"] .lightbox-modal .carousel-control-next-icon,
[data-bs-theme = "dark"] .lightbox-modal .carousel-control-prev-icon {
    filter: none;
}

.btn-fullscreen-enlarge,
.btn-fullscreen-exit {
  position: absolute;
  top: 1.25rem;
  right: 3.5rem;
  z-index: 10;
  border: 0;
  background: transparent;
  opacity: .6;
  font-size: 1.25rem;
}

.bi {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.035em;
  fill: currentcolor;
}



/* Post Categoories Block */
.categories-menu .items-nav li a {
  display: block;
  position: relative;
  padding: 10px 8px;
  color: #888;
  transition: all .1s linear;
}
.categories-menu .items-nav li a:hover {
  background-color: #F5F5F5;
  color: #111;
}
.categories-menu .items-nav li li a:hover {
  background-color:transparent;
  color: #000;
}