@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap');
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 0 none;
  list-style: none outside none;
  margin: 0;
  outline: 0 none;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
input, img, iframe {
  vertical-align: middle;
  max-width: 100%;
}
a {
  color: inherit;
  text-decoration: none;
}
ol, ul {
  padding-inline-start: 0;
  margin-block-start: 0;
  margin-block-end: 0;
}
li {
  list-style: none;
}
figure {
  margin-bottom:0;
}
figure img {
  width:100%;
}
body {
  background-color: white;
  color:black;
  font:20px/28px 'Zilla Slab', serif;
}
h1, h2, h3, h4, h5, h6 {
  margin-bottom:0;
  font-weight:600;
}
h1 {font-size:36px;line-height:42px;}
h2 {font-size:34px;line-height:40px;}
h3 {font-size:24px;line-height:28px;}
h5 {font-size:20px;line-height:24px;}
h4 {font-size:22px;line-height:26px;}
h6 {font-size:19px;line-height:23px;}
main {
  padding-top:35px;
}
.row,
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
  --bs-gutter-x: 40px;
}
.container-fluid {
  max-width:1300px;
}
/* header */
.icon-menu,
.icon-search {
  display:block;
  width:46px;
  height:46px;
  cursor:pointer;
  background-position:center;
  background-size:20px;
  background-repeat:no-repeat;
}
.icon-menu {
  background-image:url(../images/icon_menu.svg);
}
.icon-search {
  background-image:url(../images/icon_search.svg);
}
.showMenu .icon-menu,
.showSearch .icon-search {
  background-image:url(../images/icon_x.svg);
}
.logo {
  text-align:center;
}
.logo a {
  display:inline-block;
  width:255px;
  height:33px;
  vertical-align:middle;
  background-position:center;
  background-size:contain;
  background-repeat:no-repeat;
}
.ph .logo {
  padding-top:8px;
  padding-bottom:5px;
}
.ph .logo a {
  background-image:url(../images/logo.svg);
}
.ph {
  position:relative;
  z-index:1000;
  background-color:white;
}
.pn {
  font:19px/24px "Helvetica Neue", Helvetica, sans-serif;
  text-transform:uppercase;
}
.pn a {
  display:inline-block;
  position:relative;
}
.pn a::after {
  content:"";
  height:10px;
  background-color:#fdd54f;
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  width:0;
  transition:0.3s;
  z-index:-1;
}
.pn a:hover::after {
  width:100%;
}
.searchform {
  position:absolute;
  bottom:0;
  right:46px;
  opacity:0;
  visibility:hidden;
  transition:0.3s;
}
.showSearch .searchform {
  opacity:1;
  visibility:visible;
  left:0;
}
.searchform input {
  height:46px;
}
.searchform input[type="submit"] {
  width:46px;
  cursor:pointer;
  background:url(../images/icon_search.svg) center / 20px no-repeat white;
}
.searchform input[type="text"] {
  text-indent:15px;
  color:black;
  transition:0.3s;
  width:0;
}
.showSearch .searchform input[type="text"] {
  width:100%;
}
.scrollHeader .ph {
  position:fixed;
  top:0;
  left:0;
  right:0;
}
@media (min-width: 992px) {
  .ph .logo {
    padding-top:50px;
    padding-bottom:30px;
  }
  .ph .logo a {
    width:530px;
    height:68px;
  }
  .icon-menu {
    /*
    opacity:0;
    visibility:hidden;*/
  }
  .pn {
    border-top:1px solid #cfcfcf;
    border-bottom:1px solid #cfcfcf;
  }
  .pn > div {
    position:relative;
  }
  .scrollHeader .ph .logo {
    display:none;
  }
  .pn .active a {
    display:block;
    background-color:#fdd54f;
    padding-top:11px;
    padding-bottom:11px;
  }
}
@media (min-width:992px) and (max-width:1259px) {
  .pn li {
    flex-grow:1;
    text-align:center;
  }
}
@media (min-width:1260px) {
  .pn li {
    padding-left:22px;
    padding-right:22px;
  }
  .pn .active {
    padding-left:2px;
    padding-right:2px;
  }
  .pn .active a {
    padding-left:20px;
    padding-right:20px;
  }
}
@media (max-width:991px) {
  .icon-menu {
    position:absolute;
    top:0;
    left:0;
  }
  .icon-search {
    position:absolute;
    top:0;
    right:0;
  }
  .ph {
    border-bottom:1px solid #cfcfcf;
  }
  .pn .menu {
    position:fixed;
    top:47px;
    left:0;
    width:100%;
    max-width:480px;
    background-color:white;
    height:calc(100vh - 46px);
    -webkit-box-shadow:inset -10px 0 5px 5px rgba(0,0,0,0.1);
    box-shadow:inset -5px 0 50px 0 rgba(0,0,0,0.1);
    transition:0.3s;
    transform:translateX(-100%);
  }
  .showMenu .pn .menu {
    transform:translateX(0);
  }
  .pn .menu li {
    padding:15px;
  }
  .pn .active a::after {
    width:100%;
  }
}
/* homepage */
.adwrap {
  text-align:center;
  padding-bottom:20px;
}
.middle1 {
  padding-top:30px;
  margin-bottom:45px;
}
.middle2 {
  padding-top:60px;
  margin-bottom:35px;
}
.bottom {
  padding-top:30px;
  margin-bottom:50px;
}
.topic {
  font:500 13px/14px "Helvetica Neue", Helvetica, sans-serif;
  text-transform:uppercase;
}
.topic a {
  display:inline-block;
}
.feature .topic {
  text-align:center;
  margin-top:-17px;
  margin-bottom:12px;
}
.feature .topic a {
  background-color:#fdd54f;
  padding:10px 15px;
}
.feature summary {
  font-size:21px;
  line-height:30px;
  padding-top:15px;
}
.block-title {
  position:relative;
  text-transform:uppercase;
  text-align:center;
  font-weight:600;
  font-size:30px;
  line-height:30px;
  margin-bottom:26px;
}
.block-title::after {
  content:"";
  display:block;
  height:2px;
  background-color:black;
  position:absolute;
  top:50%;
  left:0;
  right:0;
}
.block-title span {
  display:inline-block;
  position:relative;
  border-left:23px solid white;
  border-right:23px solid white;
  z-index:1;
  background-color:white;
}
.block-title span::after {
  content:"";
  height:10px;
  background-color:#fdd54f;
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  z-index:-1;
}
.block .topic a {
  background-color:#fdd54f;
}
.most-read .block-title {
  font-size:25px;
  margin-bottom:30px;
}
.most-read .block-title::after {
  content:none;
}
.most-read {
  counter-reset: chapter;
}
.most-read li {
  padding-bottom:20px;
  padding-left:37px;
  position:relative;
}
.most-read li::before {
   counter-increment: chapter;
   content: counter(chapter);
   font-weight:600;
   font-size:30px;
   line-height:10px;
   position:absolute;
   top:0;
   left:0;
}
.order-lg-1 .block-item {
  padding-bottom:68px;
}
.block1 .topic {
  margin-top:30px;
  margin-bottom:3px;
}
.block1 .block-item {
  padding-bottom:30px;
}
.block1 li {
  padding-bottom:30px;
}
.block2 .topic {
  margin-top:4px;
  margin-bottom:11px;
}
.block2 .top .topic {
  margin-top:15px;
  margin-bottom:12px;
}
.block2 .top summary {
  margin-top:26px;
}
.block2 .top {
  border-bottom:1px solid #cecece;
  padding-bottom:29px;
  margin-bottom:32px;
}
.block2 li {
  position:relative;
  padding-bottom:35px;
}
.block2 li::before {
  content:"";
  display:block;
  width:1px;
  background-color:#cecece;
  position:absolute;
  top:0;
  left:0;
  height:100%;
}
.block2 li:first-child::before {
  content:none;
}
.block2 li figure {
  flex:0 0 50%;
  margin-right:20px;
}
.block2 li .info {
  flex:0 0 50%;
  padding-right:15px;
}
.block2 {
  padding-bottom:35px;
}
.block3 .block-title {
  text-align:left;
  margin-bottom:28px;
}
.block3 .block-title span {
  border-left:0;
}
.block3 .block-item figure {
  margin-bottom:22px;
}
.block3 .block-item summary {
  padding-top:12px;
  padding-bottom:24px;
}
.block3 li {
  border-top:1px solid #cecece;
  padding-top:25px;
  padding-bottom:25px;
}
.block3 li figure {
  flex:0 0 35%;
  margin-right:20px;
}
.block4 li {
  border-top:1px solid #cecece;
  padding-top:25px;
  padding-bottom:25px;
}
.block4 li:first-child {
  border-top:0;
  padding-top:0;
}
.block4 figure {
  flex:0 0 35%;
  margin-left:20px;
}
.block4 .topic {
  margin-bottom:6px;
}
.block5 h4 {
  margin-top:18px;
  margin-bottom:55px;
}
@media (max-width:991px) {
  .order-lg-2 .block-item {
    padding-bottom:68px;
  }
}
/* footer */
.pf {
  background-color:black;
  color:white;
  font:12px/16px "Helvetica Neue", Helvetica, sans-serif;
  text-transform:uppercase;
}
.pf a {
  display:inline-block;
  position:relative;
}
.pf a::after {
  content:"";
  height:4px;
  background-color:#fdd54f;
  position:absolute;
  bottom:0;
  left:0;
  width:0;
  transition:0.3s;
}
.pf a:hover::after {
  right:0;
  width:100%;
}
.pf .logo {
  padding-top:30px;
  padding-bottom:20px;
}
.pf .logo a {
  background-image:url(../images/logo2.svg);
}
.pf .menu {
  font-size:15px;
  line-height:19px;
  margin-bottom:10px;
}
.pf .corporate {
  font-size:13px;
  line-height:17px;
  margin-bottom:22px;
}
.pf li {
  padding-bottom:10px;
}
.pf > .container-fluid {
  position:relative;
}
.pf .social {
  position:absolute;
}
@media (min-width:992px) {
  .pf .logo {
    display:inline-block;
    vertical-align:middle;
  }
  .pf li {
    margin-right:30px;
  }
  .pf .social {
    top:42px;
    right:calc(var(--bs-gutter-x) * .5);
  }
}
@media (max-width:991px) {
  .pf ul {
    text-align:center;
  }
  .pf > .container-fluid {
    padding-bottom:55px;
  }
  .pf .social {
    bottom:30px;
    left:50%;
    transform:translateX(-50%);
  }
}
.copyright {
  text-transform:uppercase;
  background-color:white;
  color:black;
  padding-top:10px;
  padding-bottom:10px;
  font-size: 13px;
}
.social a {
  display:inline-block;
  width:20px;
  height:20px;
  background-position:center;
  background-size:contain;
  background-repeat:no-repeat;
  margin-left:20px;
}
.social a:first-of-type {
  margin-left:0;
}
.social-facebook {
  background-image:url(../images/social_facebook.svg);
}
.social-facebook:hover {
  background-image:url(../images/social_facebook2.svg);
}
.social-twitter {
  background-image:url(../images/social_twitter.svg);
}
.social-twitter:hover {
  background-image:url(../images/social_twitter2.svg);
}
.social-instagram {
  background-image:url(../images/social_instagram.svg);
}
.social-instagram:hover {
  background-image:url(../images/social_instagram.svg);
}
.social-youtube {
  background-image:url(../images/social_youtube.svg);
}
.social-youtube:hover {
  background-image:url(../images/social_youtube2.svg);
}
/* section */
.section-title {
  text-transform:uppercase;
  font-weight:600;
  font-size:36px;
  line-height:36px;
  margin-bottom:34px;
}
.section-title span {
  display:inline-block;
  position:relative;
}
.section-title span::after {
  content:"";
  height:10px;
  background-color:#fdd54f;
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  z-index:-1;
}
figcaption,
time,
.byline {
  color:#666;
  font:13px/16px "Helvetica Neue", Helvetica, sans-serif;
}
.section-item {
  padding-bottom:10px;
}
.section-item .info,
.section-item figure {
  margin-bottom:20px;
}
.section-item summary {
  font-size:18px;
  line-height:21px;
  margin-top:30px;
  margin-bottom:18px;
}
.section-list summary {
  font-size:16px;
  line-height:19px;
  margin-top:14px;
}
.section-list .byline {
  font-size:12px;
}
@media (min-width: 992px) {
  .section-item figure {
    flex:0 0 66.66%;
    margin-right:20px;
  }
}
.section-list figure {
  flex:0 0 33%;
  margin-right:30px;
}
.section-list li {
  border-top:1px solid #cecece;
  padding-top:30px;
  padding-bottom:30px;
}
.section-list {
  border-bottom:1px solid #cecece;
}
.pager {
  font:16px/20px "Helvetica Neue", Helvetica, sans-serif;
  padding-top:30px;
  padding-bottom:30px;
}
.pager-prev,
.pager-next {
  width:20px;
  height:20px;
  display:inline-block;
  background-position:center;
  background-size:12px;
  background-repeat:no-repeat;
  font-size:0;
}
.pager-prev {
  background-image:url(../images/arrow_carrot-left.svg);
}
.pager-next {
  background-image:url(../images/arrow_carrot-right.svg);
}
.pager a:hover {
  background-color:#fdd54f;
}
@media (min-width:992px) {
  .pager li {
    padding-left:20px;
    padding-right:20px;
  }
}
@media (max-width:991px) {
  .pager li {
    flex-grow:1;
    text-align:center;
  }
}
/* article */
.article-header {
  padding-bottom:7px;
}
.article-header .byline {
  margin-bottom:5px;
}
.article-header h1 {
  margin-top:6px;
  margin-bottom:10px;
}
.share {
  margin-top:12px;
}
.share a {
  display:inline-block;
  width:46px;
  height:46px;
  background-position:center;
  background-size:20px;
  background-repeat:no-repeat;
  border-radius:50%;
}
.share a:hover {
  background-color:#fdd54f;
}
.share-facebook {
  background-image:url(../images/share_facebook.svg);
}
.share-twitter {
  background-image:url(../images/share_twitter.svg);
}
.share-mail {
  background-image:url(../images/share_mail.svg);
}
.article-content figure {
  padding-bottom:20px;
}
.article-content figcaption {
  padding-top:7px;
  padding-bottom:8px;
}
.article-content {
  font-size:22px;
  line-height:26px;
  padding-bottom:60px;
}
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
  font-weight:700;
  padding-bottom:26px;
  padding-top:18px;
}
.article-content p {
  padding-bottom:10px;
}

.article-content li {
  position: relative;
  padding-left: 30px;
  padding-top:10px;
  padding-bottom:10px;
}
.article-content li::before {
  position:absolute;
  left:0;
}

.article-content ul li::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  background-color: black;
  top:20px;
}
.article-content ol {
  counter-reset: counter;
}
.article-content ol li {
  counter-increment: counter;
}
.article-content ol li::before {
  content: counter(counter)". ";
  font-weight:700;
  top:10px;
}

.article-content ul,
.article-content ol {
  padding-bottom:26px;
}
.article-content a {
    display: inline-block;
    position: relative;
    z-index: 1;
    background-color: white;
}  
.article-content a:after{
    content: "";
    height: 10px;
    background-color: #fdd54f;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
} 
/* menu */
.dropdown {
  position: relative;
  display: inline-block;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 160px;
  box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.1);
  z-index: 1;
  margin-left: 0px;
  font-size: 15px;
  text-align: left;

}
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}
.dropdown-content a:hover {}
.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {}
@media only screen and (max-width: 1260px) {
  .dropdown-content {
    margin-left: 30px;
  }
}
@media only screen and (max-width: 990px) {
  .dropdown-content {
    display: block;
    position: relative;
    margin-top: 10px;
    margin-left:0px;
  }
}
.load-more {text-align: center;}  
.load-more button{text-align: center;padding: 15px 30px;border-radius: 15px;cursor: pointer;background-color: #fdd54f;text-transform: uppercase;color: black;} 
.ajax-loader {text-align: center;padding: 5px;}