* {
  padding: 0;
  margin: 0;
}
body.framed,
body.framed header,
body.framed .header-wrapper,
body.boxed,
body.boxed header,
body.boxed .header-wrapper,
body.boxed .is-sticky-section {
  max-width: 560px;
}
html {
  max-width: 750px;
  margin: 0 auto;
  overflow-x: hidden;
  overflow-y: scroll;
}
.hiden {
  overflow: hidden;
}
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.header-main {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 2% 2%;
}
.header-main .menu-icon img {
  width: 50%;
}
.header-main .logo {
  flex: 1;
  text-align: center;
}
.header-main .logo a {
  display: inline-block;
  width: 50%;
}
.header-main .logo a img {
  display: block;
  width: 100%;
}
.header-footer .nav {
  background: #5eaffa;
  display: flex;
  align-items: center;
  justify-content: center;
  list-style-type: none;
  padding: 8px 10%;
}
.header-footer .nav li:first-child {
  margin-right: 10px;
}
.header-footer .nav li a {
  text-decoration: none;
}
.header-footer .nav li a img {
  width: 100%;
}
.content-area {
  padding: 5% 2%;
}
.swiper img {
  width: 100%;
  display: block;
}
.text-box {
  padding: 0 5%;
}
.text-box p {
  margin: 5% 0;
}

.detail-bredcrumb {
  border: 1px solid #e4e4e4;
  border-right: none;
  border-left: none;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  padding-top: 0.5rem;
}

.detail-bredcrumb p {
  margin: 0;
}

.rank-math-breadcrumb p {
  color: #36a638;
  margin: 0;
}

.des-category h1 {
  font-size: 40px;
}

.page-wrapper #content,
.page-wrapper #post-list,
.blog-single .post,
.archive-page-header .des-category {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 0.25rem;
  padding-right: 1.5rem;
  padding-left: 1.5rem;
  padding-bottom: 1.5rem;
  padding-top: 1rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.widget-area > .widget {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 0.25rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  padding: 1rem;
  margin-bottom: 1.5rem;
}

blockquote {
  background: #f8f6f1 !important;
  border: solid 1px #e7e2d5;
  padding: 20px !important;
  color: #6a6043 !important;
  font-size: 0.875em !important;
  line-height: 1.4em !important;
  border-radius: 5px;
}

.is-divider {
  background-color: #36a638;
}

@media (min-width: 850px) {
  .post-sidebar {
    border: 0 !important;
    padding-left: 0 !important;
  }
}

.footer-widgets .widget-title {
  border-bottom: 1px solid #f1f1f1;
  padding-bottom: 10px;
  margin-bottom: 10px;
  text-transform: uppercase;
  font-size: 1.3rem;
  font-weight: 700;
  display: block;
}

.footer-widgets .is-divider {
  display: none;
}

.header-bottom {
  margin-top: 20px;
}

.home .detail-bredcrumb {
  display: none;
}

a.btn-link {
  text-decoration-color: initial;
  background: linear-gradient(30deg, #36a638, #00d084);
  box-shadow: rgb(255 249 0) 3px 3px 0px;
  width: 100%;
  color: #fff !important;
  transform: skewX(-10deg);
}
.header-button {
  position: relative;
}
.header-button a {
  cursor: pointer;
  margin: 0;
  border: 1px solid #fff;
  border-radius: 10px;
  background-image: repeating-linear-gradient(
    to right,
    #5ecdfb 0,
    #5cbdfa 50%,
    #5476f8 100%
  );
  background-size: 200% auto;
  line-height: 2.4em;
  padding: 0 20px;
  display: inline-block;
  color: #fff;
  font-weight: bold;
  animation: 1s infinite gradient;
  animation-fill-mode: forwards;
  animation-timing-function: linear;
}

@keyframes gradient {
  0% {
    background-position: 0 0;
  }

  100% {
    background-position: -200% 0;
  }
}

.header-button::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 50%;
  height: 50%;
  box-shadow: 0 0 17px 3px #ffff01, 0 0 4px 2px #ffff01;
  z-index: -1;
  border-radius: 10px;
  animation-name: yellow-shadow;
  animation-timing-function: ease;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  border-radius: 10px;
}
@keyframes yellow-shadow {
  0% {
    top: 0;
    left: 0;
  }

  25% {
    top: 50%;
    left: 0;
  }

  50% {
    top: 50%;
    left: 50%;
  }

  75% {
    top: 0;
    left: 50%;
  }

  100% {
    top: 0;
    left: 0;
  }
}
.header-button::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 50%;
  height: 50%;
  box-shadow: 0 0 17px 3px #31a749, 0 0 4px 2px #31a749;
  z-index: -1;
  border-radius: 10px;
  animation-name: cyan-shadow;
  animation-timing-function: ease;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  border-radius: 10px;
}

@keyframes cyan-shadow {
  0% {
    right: 0;
    bottom: 0;
  }

  25% {
    right: 0;
    bottom: 50%;
  }

  50% {
    right: 50%;
    bottom: 50%;
  }

  75% {
    right: 50%;
    bottom: 0;
  }

  100% {
    right: 0;
    bottom: 0;
  }
}

@media (max-width: 1024px) {
  #wide-nav {
    background: #003843;
  }
}
.section-content {
  padding: 5%;
  background-color: #5faffa;
}
.section-title {
  border-bottom: 1px solid #fff;
  margin-bottom: 16px;
  padding-bottom: 12px;
}
.text {
  margin-bottom: 10%;
  color: #fff;
}
.mobile-sidebar {
  background-color: #fff;
  width: 60vw;
  left: 0;
  top: 0;
  height: 100%;
  z-index: 1;
}
.mobile-cover {
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 999999999;
  display: flex;
  align-items: flex-start;
  display: none;
}
.mobile-cover .close {
  color: #000;
  font-size: 30px;
  flex: 1;
  text-align: right;
  padding-right: 10px;
}
.mobile-sidebar .menu-item {
  line-height: 2;
  padding: 10px;
  border-bottom: 1px solid #eee;
}
.mobile-sidebar .menu-item a {
  text-decoration: none;
  color: #666;
  display: block;
}
.mobile-sidebar .menu-item a:hover {
  color: #333;
  background: #eee;
}
.iframe {
  width: 100%;
  overflow: hidden;
}
.iframe iframe {
  width: 100% !important;
}
.footer-primary {
  height: 50px;
  color: #000;
  text-align: center;
  line-height: 50px;
}
html :where(img[class*="wp-image-"]) {
  height: auto;
  max-width: 100%;
}
:root {
  --wp-admin-theme-color: #007cba;
  --wp-admin-theme-color--rgb: 0, 124, 186;
  --wp-admin-theme-color-darker-10: #006ba1;
  --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
  --wp-admin-theme-color-darker-20: #005a87;
  --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
  --wp-admin-border-width-focus: 2px;
  --wp-block-synced-color: #7a00df;
  --wp-block-synced-color--rgb: 122, 0, 223;
  --wp-bound-block-color: var(--wp-block-synced-color);
}

@media (min-resolution: 192dpi) {
  :root {
    --wp-admin-border-width-focus: 1.5px;
  }
}

.wp-element-button {
  cursor: pointer;
}

:root {
  --wp--preset--font-size--normal: 16px;
  --wp--preset--font-size--huge: 42px;
}

:root .has-very-light-gray-background-color {
  background-color: #eee;
}

:root .has-very-dark-gray-background-color {
  background-color: #313131;
}

:root .has-very-light-gray-color {
  color: #eee;
}

:root .has-very-dark-gray-color {
  color: #313131;
}

:root .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {
  background: linear-gradient(135deg, #00d084, #0693e3);
}

:root .has-purple-crush-gradient-background {
  background: linear-gradient(135deg, #34e2e4, #4721fb 50%, #ab1dfe);
}

:root .has-hazy-dawn-gradient-background {
  background: linear-gradient(135deg, #faaca8, #dad0ec);
}

:root .has-subdued-olive-gradient-background {
  background: linear-gradient(135deg, #fafae1, #67a671);
}

:root .has-atomic-cream-gradient-background {
  background: linear-gradient(135deg, #fdd79a, #004a59);
}

:root .has-nightshade-gradient-background {
  background: linear-gradient(135deg, #330968, #31cdcf);
}

:root .has-midnight-gradient-background {
  background: linear-gradient(135deg, #020381, #2874fc);
}

.has-regular-font-size {
  font-size: 1em;
}

.has-larger-font-size {
  font-size: 2.625em;
}

.has-normal-font-size {
  font-size: var(--wp--preset--font-size--normal);
}

.has-huge-font-size {
  font-size: var(--wp--preset--font-size--huge);
}

.has-text-align-center {
  text-align: center;
}

.has-text-align-left {
  text-align: left;
}

.has-text-align-right {
  text-align: right;
}

#end-resizable-editor-section {
  display: none;
}

.aligncenter {
  clear: both;
}

.items-justified-left {
  justify-content: flex-start;
}

.items-justified-center {
  justify-content: center;
}

.items-justified-right {
  justify-content: flex-end;
}

.items-justified-space-between {
  justify-content: space-between;
}

.screen-reader-text {
  border: 0;
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: #ddd;
  clip-path: none;
  color: #444;
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

html :where(.has-border-color) {
  border-style: solid;
}

html :where([style*="border-top-color"]) {
  border-top-style: solid;
}

html :where([style*="border-right-color"]) {
  border-right-style: solid;
}

html :where([style*="border-bottom-color"]) {
  border-bottom-style: solid;
}

html :where([style*="border-left-color"]) {
  border-left-style: solid;
}

html :where([style*="border-width"]) {
  border-style: solid;
}

html :where([style*="border-top-width"]) {
  border-top-style: solid;
}

html :where([style*="border-right-width"]) {
  border-right-style: solid;
}

html :where([style*="border-bottom-width"]) {
  border-bottom-style: solid;
}

html :where([style*="border-left-width"]) {
  border-left-style: solid;
}

html :where(img[class*="wp-image-"]) {
  height: auto;
  max-width: 100%;
}

:where(figure) {
  margin: 0 0 1em;
}

html :where(.is-position-sticky) {
  --wp-admin--admin-bar--position-offset: var(
    --wp-admin--admin-bar--height,
    0px
  );
}

@media screen and (max-width: 600px) {
  html :where(.is-position-sticky) {
    --wp-admin--admin-bar--position-offset: 0px;
  }
}
