@layer base {
  * {
    margin: 0;
    padding: 0;
  }

  main a:not([class]),
  main a.link,
  main a.popImage:not(:has(img))  {
    color: var(--blue1);
    text-decoration: none;

    box-shadow: inset -100% 0 0 0 transparent;
    background-image: linear-gradient(to top, var(--green1) 2px, transparent 2px), linear-gradient(to top, var(--blue1) 2px, transparent 2px);
    background-repeat: no-repeat, no-repeat;
    background-size: 0% 100%, 100% 100%;
    background-position: left 100%, left 100%;
    transition: background-size 0.3s cubic-bezier(0.25, 1, 0.5, 1), color 0.3s ease 0s;
  }

  main a:not([class]):is(:hover, :focus-visible),
  main a.link:is(:hover, :focus-visible),
  main a.popImage:not(:has(img)):is(:hover, :focus-visible)  {
    background-size: 0% 100%, 0% 100%;
    color: var(--green1);
  }

  :is(.popup-wrap, #content) ul {
    margin: 0 0 1.5em;
    counter-reset: revert;
    list-style: none;
  }

  :is(.popup-wrap, #content) ul {
    /* list-style-type: disc; */
    list-style-type: none;
  }

  :is(.popup-wrap, #content) ul>li {
    /* margin-left: 24px;
    padding-left: 0px; */
    padding-left: 24px;
    margin-bottom: 10px;
    position: relative;
  }

  :is(.popup-wrap, #content) ul>li:before {
    content: '';
    position: absolute;
    width: 9px;
    height: 9px;
    top: 0.45em;
    left: 0.4em;
    border-radius: 50%;
    background-color: var(--green3);
  }

  :is(.popup-wrap, #content) ul>li>ul>li {
    padding-left: 28px;
  }

  :is(.popup-wrap, #content) ul>li>ul>li:before {
    width: 11px;
    height: 11px;
    background-color: transparent;
    border-radius: 0;
    background: url(../images/bullet-lv2.svg) 50% 50% no-repeat;
    background-size: contain;
  }

  :is(.popup-wrap, #content) ul>li>ul>li>ul>li:before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 6.9px;
    border-color: transparent transparent transparent var(--olive3);
    border-radius: 0;

  }

  :is(.popup-wrap, #content) ul.col-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 10px;
  }

  /*   :is(.popup-wrap, #content) ul>li::marker {
    color: var(--blue2);
  }

  :is(.popup-wrap, #content) ul>li>ul>li::marker {
    color: #91c000;
  }

  :is(.popup-wrap, #content) ul>li>ul>li>ul>li::marker {
    color: #a6a6a6;
  } */


  :is(.popup-wrap, #content) ol,
  :is(.popup-wrap, #content) ul {
    line-height: 1.4;
  }
}

#wrapper:not(.home) :is(.popup-wrap, #content) {
  color: var(--black);
  line-height: 1.7;
}

#content {
  line-height: var(--line-height3);
  font-weight: 300;
  position: relative;
}
.popup-wrap{
	line-height: var(--line-height3);
  font-weight: 300;
}

:is(.popup-wrap, #content) p {
  margin-bottom: 1.2em;
}

:is(.popup-wrap, #content) .red-color {
  color: var(--red1);
}

:is(.popup-wrap, #content) .blue-color {
  color: var(--blue2);
}

:is(.popup-wrap, #content) .brown-color {
  color: var(--brown1);
}

:is(.popup-wrap, #content) .smallTxt{
	font-size: clamp(0.75rem, 0.6578rem + 0.3934vw, 1.125rem);
}

h1#pageTitle {
  color: var(--bluegreen2);
  font-size: clamp(1.4375rem, 0.8074rem + 2.6885vw, 4rem);
  font-weight: 600;
  line-height: 1.1;
}

#wrapper.other h1#pageTitle {
  max-width: var(--special-width);
  margin-inline: auto;
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

:is(.popup-wrap, #content) h2 {
  color: var(--green1);
  font-size: clamp(1.5rem, 1.1311rem + 1.5738vw, 3rem);
  font-weight: 500;
  margin-top: 1.5em;
  margin-bottom: 0.85em;
  line-height: var(--title-line-height);
}

:is(.popup-wrap, #content) h2.smallTxt{
	font-size: clamp(1.0625rem, 0.8012rem + 1.1148vw, 2.125rem);
}

:is(.popup-wrap, #content) .event-title-wrap h2 {
  margin-bottom: 0;
  margin-top: 0;
}

:is(.popup-wrap, #content) h2+h3 {
  margin-top: 0.8em;
}

:is(.popup-wrap, #content) h3 {
  color: var(--bluegreen2);
  font-size: clamp(1.0625rem, 0.8012rem + 1.1148vw, 2.125rem);
  line-height: var(--title-line-height);
  font-weight: 500;
  margin-top: 1.5em;
  margin-bottom: 0.8em;
}

#content>h2:first-child {
  margin-top: 0;
}

:is(.popup-wrap, #content) h4 {
  color: var(--green2);
  font-size: clamp(0.875rem, 0.6598rem + 0.918vw, 1.75rem);
  font-weight: 500;
  line-height: var(--title-line-height);
  margin-top: 0.8em;
  margin-bottom: 0.8em;
}

:is(.popup-wrap, #content) .icon-header {
  display: flex;
  align-items: center;
  gap: clamp(8px, calc(6.279px + 0.459vw), 15px);
  padding-inline-start: clamp(8px, calc(6.279px + 0.459vw), 15px);
  margin-bottom: 0.6em !important;
}

:is(.popup-wrap, #content) .icon-header>span.icon {
  display: block;
  min-width: clamp(40px, calc(30.164px + 2.623vw), 80px);
  width: auto;
  aspect-ratio: 1 / 1;
  background-image: linear-gradient(to bottom right, var(--green5), var(--green3));
}

:is(.popup-wrap, #content) .highlight-box .icon-header>span.icon {
  min-width: clamp(30px, calc(21.393px + 2.295vw), 65px);
  width: auto;
}

:is(.popup-wrap, #content) img {
  max-width: 100%;
}

:is(.popup-wrap, #content) hr {
  line-height: 0;
  margin-block: clamp(3.125rem, calc(2.357rem + 3.279vw), 6.25rem);
  height: 1px;
  width: 100%;
  border: none;
  border-top: 2px solid var(--linecolor);
}

:is(.popup-wrap, #content) hr.dotted {
  margin: 100px 0;
  height: 10px;
  border: 0;
  background: radial-gradient(circle at 5px 6px, var(--grey3) 3px, transparent 3px) 0 100% / 16px 12px repeat-x;
}

:is(.popup-wrap, #content) ul.noBullet {
  margin-left: 0;
  list-style-type: none;
}

:is(.popup-wrap, #content) ul.noBullet li {
  padding-left: 0;
  margin-left: 0;
}

:is(.popup-wrap, #content) ul.square {
  list-style-type: square;
}

:is(.popup-wrap, #content) ul.circle {
  list-style-type: circle;
}

:is(.popup-wrap, #content) ul li ul,
:is(.popup-wrap, #content) ol li ul {
  margin: 10px 0;
}

:is(.popup-wrap, #content) ol {
  list-style: decimal;
  counter-reset: revert;
  margin: 0 0 1.66em 1.66em;
}

:is(.popup-wrap, #content) ol.lowerAlpha {
  list-style-type: lower-alpha;
}

:is(.popup-wrap, #content) ol.upperAlpha {
  list-style-type: upper-alpha;
}

:is(.popup-wrap, #content) ol.lowerRoman {
  list-style-type: lower-roman;
}

:is(.popup-wrap, #content) ol.upperRoman {
  list-style-type: upper-roman;
}

:is(.popup-wrap, #content) ol.lowerGreek,
:is(.popup-wrap, #content) ol[type="α"] {
  list-style-type: lower-greek;
}

:is(.popup-wrap, #content) ol p {
  margin-bottom: 15px;
}

:is(.popup-wrap, #content) ol>li {
  padding-left: 4px;
  margin-bottom: 10px;
}

:is(.popup-wrap, #content) ol li ol,
:is(.popup-wrap, #content) ul li ol {
  margin: 20px 0 20px 24px;
}

:is(.popup-wrap, #content) ol>li>ol>li,
:is(.popup-wrap, #content) ol>li>ol>li>ol>li,
:is(.popup-wrap, #content) ul>li>ol>li {
  padding-left: 4px;
}

:is(.popup-wrap, #content) div.rwd-table-wrap {
  margin-bottom: 2.22em;
  position: relative;
  clear: both;
}

:is(.popup-wrap, #content) div.rwd-table-wrap>div {
  position: relative;
  width: 100%;
  overflow: auto;
}

:is(.popup-wrap, #content) div.rwd-table-wrap:before,
:is(.popup-wrap, #content) div.rwd-table-wrap:after {
  content: '';
  width: 40px;
  height: 100%;
  position: absolute;
  top: 0;
  background: linear-gradient(90deg, rgba(238, 238, 236, 0) 0%, rgba(238, 238, 236, .4) 50%, rgba(238, 238, 236, .8) 100%);
  z-index: 3;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease 0s;
}

:is(.popup-wrap, #content) div.rwd-table-wrap:before {
  left: 0;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

:is(.popup-wrap, #content) div.rwd-table-wrap.scroll-left:before,
:is(.popup-wrap, #content) div.rwd-table-wrap.scroll-right:after {
  opacity: 1;
}

:is(.popup-wrap, #content) div.rwd-table-wrap:after {
  right: 0;
}

.firefox :is(.popup-wrap, #content) div.rwd-table-wrap>div {
    scrollbar-color: var(--primary) var(--secondary);
  }

  :is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }

  :is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar-track {
    background-color: var(--secondary);
    border-radius: 0;
  }

  :is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar-thumb {
    background-color: var(--primary);
    border-radius: 0;
  }
  
/* :is(.popup-wrap, #content) div.rwd-table-wrap>div {
  scrollbar-color: var(--olive2) var(--grey3);
  scrollbar-width: thin;
}

:is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar {
  height: 10px;
}

:is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar-track {
  background-color: var(--grey3);
  border-radius: 0;
}

:is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar-thumb {
  background-color: var(--olive2);
  border-radius: 0;
  transition: background-color .3s;
}

:is(.popup-wrap, #content) div.rwd-table-wrap>div::-webkit-scrollbar-thumb:hover {
  background-color: var(--olive3);
} */

:is(.popup-wrap, #content) div.rwd-table-wrap>div>table {
  width: 100%;
  min-width: 640px;
  margin-bottom: 0;
}

:is(.popup-wrap, #content) table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0 0 3em;
  padding: 0;
}

:is(.popup-wrap, #content) table .empty {
  text-indent: -9999px;
  font-size: 0;
}

:is(.popup-wrap, #content) table thead th {
  vertical-align: top;
  text-align: left;
  font-weight: 500;
}

/* :is(.popup-wrap, #content) table thead tr>th:first-child {
  padding-left: 20px;
} */

:is(.popup-wrap, #content) table tbody>tr>th,
:is(.popup-wrap, #content) table tbody>tr>td {}

:is(.popup-wrap, #content) table tbody th {
  border-bottom: 1px solid var(--linecolor);
}

:is(.popup-wrap, #content) table tbody td {
  border-bottom: 1px solid var(--linecolor);
}



/* :is(.popup-wrap, #content) table tbody tr:first-child th,
:is(.popup-wrap, #content) table tbody tr:first-child td {
  border-top: 1px solid var(--grey3);
} */

:is(.popup-wrap, #content) table tr:last-child th,
:is(.popup-wrap, #content) table tr:last-child td {
  border-bottom: none;
}

:is(.popup-wrap, #content) table.vertical-table tr:last-child>*:first-child, :is(.popup-wrap, #content) table.vertical-table tbody th.no-content + td {
  border-bottom-left-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) table.vertical-table tr:last-child>*:last-child {
  border-bottom-right-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) table tbody th {
  padding: clamp(10px, calc(3.852px + 1.639vw), 35px) clamp(20px, calc(16.311px + 0.984vw), 35px);
  font-weight: 500;
  text-align: left;
  vertical-align: top;
  background-color: var(--tablecolor2);
}

:is(.popup-wrap, #content) table.vertical-table tbody th {
  width: 20%;
}
:is(.popup-wrap, #content) table.vertical-table tbody th.no-content{
	width: 0;
	padding: 0;
}

/* :is(.popup-wrap, #content) table.vertical-table tbody th.subhead {
  background-color: var(--green1);
  color: var(--lakeblue4);
} */

:is(.popup-wrap, #content) table tbody td {
  padding: clamp(10px, calc(3.852px + 1.639vw), 35px) clamp(20px, calc(16.311px + 0.984vw), 35px);
  vertical-align: top;
  background-color: var(--tablecolor1);
}

:is(.popup-wrap, #content) table tbody td>*:last-child {
  margin-bottom: 0 !important;
}

/* :is(.popup-wrap, #content) table tr>th:first-child,
:is(.popup-wrap, #content) table tr>td:first-child {
  padding-left: 20px;
} */

/* :is(.popup-wrap, #content) table tr th,
:is(.popup-wrap, #content) table tr td {
  transition: all .3s;
} */

:is(.popup-wrap, #content) table.no-style {
  border: none;
  width: auto;
}

:is(.popup-wrap, #content) table.no-style thead tr th,
:is(.popup-wrap, #content) table.no-style tbody tr td,
:is(.popup-wrap, #content) table.no-style tbody tr th {
  border: none;
  background: transparent;
  padding: 0 5px 5px 0;
  vertical-align: top;
}

:is(.popup-wrap, #content) table.no-style tr>td:first-child {
  padding-left: inherit;
}

:is(.popup-wrap, #content) table.no-style th {
  font-weight: 600;
  color: var(--lakeblue3);
}

/*style-table*/
:is(.popup-wrap, #content) table {}

:is(.popup-wrap, #content) table.vertical-table{
  border-top: 4px solid var(--bluegreen2);
}

:is(.popup-wrap, #content) table.style-table th{
	color: var(--white);
	background-color: var(--bluegreen2);
	font-weight: 500;
}

:is(.popup-wrap, #content) table.style-table :is(th, td){
	padding: clamp(10px, calc(8.77px + 0.328vw), 15px);
	border: 1px solid var(--white);
}

:is(.popup-wrap, #content) table.vertical-table th {
  font-weight: 500;
}


/* :is(.popup-wrap, #content) table.style-table thead th {
  
  background: var(--lakeblue3);
  padding: 15px 20px;
  vertical-align: top;
} */

/* :is(.popup-wrap, #content) table.style-table tbody tr td.subhead {
  background-color: var(--white);
  color: var(--lakeblue4);
  font-weight: 600;
} */
:is(.popup-wrap, #content) table.style-table tbody tr td.sub-head{
	background-color: var(--green5);
	font-weight: 500;
}
:is(.popup-wrap, #content) table.style-table tbody tr td.bg-color-1{
	background-color: var(--tablecolor2);
}
:is(.popup-wrap, #content) table.style-table tbody tr td {
  background-color: var(--tablecolor1);
}

/* :is(.popup-wrap, #content) table.style-table tbody tr:nth-child(2n+1) td {
  background-color: transparent;
} */

:is(#headerZone, #content) .more-btn {
  color: var(--green1);
  font-size: clamp(1.125rem, 1.0635rem + 0.2623vw, 1.375rem);
  font-weight: 400;
  text-decoration: none;
  padding-inline-end: 65px;
  position: relative;
  display: inline-block;
}

:is(#headerZone, #content) .more-btn::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 3px;
  width: calc(100% - 65px);
  height: 2px;
  background-color: var(--green1);

  will-change: transform;
  transform: scaleX(0) translateZ(0);
  transform-origin: left center;
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

:is(#headerZone, #content) .more-btn:is(:hover, :focus-visible)::after {
  transform: scaleX(1) translateZ(0);
}

:is(#headerZone, #content) .more-btn span {
  position: absolute;
  top: 50%;
  right: 15px;
  width: 36px;
  height: 10px;
  overflow: hidden;
  transform: translateY(-50%);
  transition: right 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

:is(#headerZone, #content) .more-btn:is(:hover, :focus-visible) span {
  right: 11px;
}

:is(#headerZone, #content) .more-btn span:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: var(--green3);
  left: 0;
  bottom: 0;
  transition: background-position 0.3s cubic-bezier(0.25, 1, 0.5, 1), color 0.25s;
  /* transition:all .3s; */
}

:is(#headerZone, #content) .more-btn span:after {
  content: '';
  position: absolute;
  width: 15px;
  height: 15px;
  border-top: 2px solid var(--green3);
  transform: rotate(45deg);
  right: 4px;
  top: 0px;
}

:is(#headerZone, #content) .common-btn {
  position: relative;
  text-decoration: none;
  padding: 12px 30px;
  border-radius: 30px;
  line-height: 30px;
  color: var(--white);
  font-size: var(--font-size2);
  font-weight: 700;
  background-color: var(--lakeblue3);
  transition: all .3s;
}

:is(#headerZone, #content) .common-btn.big-btn {
  display: inline-flex;
  align-items: center;
  min-height: 70px;
  line-height: var(--line-height1);
  font-size: var(--font-size3);
  font-weight: 700;
  color: var(--white);
  padding: 15px 40px 15px 40px;
  border-radius: 35px;
  background-color: var(--blue2);
}

:is(#headerZone, #content) .common-btn:is(:hover, :focus-visible),
:is(#headerZone, #content) .common-btn.big-btn:is(:hover, :focus-visible) {
  background-color: var(--orange3);
}

:is(#headerZone, #content) .common-btn.arrow,
:is(#headerZone, #content) .common-btn.double-arrow {
  padding-right: 60px;
}

:is(#headerZone, #content) .common-btn.arrow:not(.big-btn),
:is(#headerZone, #content) .common-btn.double-arrow:not(.big-btn) {
  padding-right: 50px;
}

:is(#headerZone, #content) .common-btn.arrow .icon,
:is(#headerZone, #content) .common-btn.double-arrow .icon {
  position: absolute;
  top: 50%;
  right: 15px;
  width: 30px;
  height: 30px;
  overflow: hidden;
  transform: translateY(-50%);
}

:is(#headerZone, #content) .common-btn.arrow .icon:before,
:is(#headerZone, #content) .common-btn.double-arrow .icon:before {
  content: '';
  position: absolute;
  width: 24px;
  height: 24px;
  top: 50%;
  left: 50%;
  margin: -12px 0 0 -12px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2034%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M12.7%2C16.98L1.2%2C5.51c-1.12-1.12-1.12-2.93%2C0-4.05%2C1.12-1.12%2C2.94-1.12%2C4.06%2C0l13.51%2C13.48s0%2C0%2C0%2C0%2C0%2C0%2C0%2C0l.02.02c1.12%2C1.12%2C1.12%2C2.93%2C0%2C4.05-.06.06-.13.1-.19.15l-13.34%2C13.37c-1.12%2C1.12-2.93%2C1.12-4.05%2C0-1.12-1.12-1.12-2.94%2C0-4.06l11.47-11.5Z%22%2F%3E%3C%2Fsvg%3E);
  /* transition:all .3s; */
}

:is(#headerZone, #content) .common-btn.double-arrow .icon:before {
  background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M5.36%2C3.94l6.14%2C6.14s.06.1.1.15c.34.45.34%2C1.05.02%2C1.51-.04.06-.06.12-.12.18%2C0%2C0%2C0%2C0%2C0%2C0h0s-6.14%2C6.14-6.14%2C6.14c-.51.51-1.33.51-1.84%2C0-.51-.51-.51-1.33%2C0-1.84l5.22-5.22L3.52%2C5.78c-.51-.51-.51-1.33%2C0-1.84.51-.51%2C1.33-.51%2C1.84%2C0ZM10.52%2C3.94c-.51.51-.51%2C1.33%2C0%2C1.84l5.22%2C5.22-5.22%2C5.22c-.51.51-.51%2C1.33%2C0%2C1.84.51.51%2C1.33.51%2C1.84%2C0l6.14-6.14h0s0%2C0%2C0%2C0c.05-.05.08-.12.12-.18.33-.46.32-1.06-.02-1.51-.04-.05-.06-.11-.1-.15l-6.14-6.14c-.51-.51-1.33-.51-1.84%2C0Z%22%2F%3E%3C%2Fsvg%3E);
}

:is(#headerZone, #content) .common-btn.arrow:hover .icon:before,
:is(#headerZone, #content) .common-btn.double-arrow:hover .icon:before {
  animation: moveright-arrow .6s 1;
}

:is(#headerZone, #content) .common-btn.arrow.big-btn .icon,
:is(#headerZone, #content) .common-btn.double-arrow.big-btn .icon {
  right: 20px;
}

:is(#headerZone, #content) .common-btn.arrow:not(.big-btn) .icon:before {
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
}

:is(#headerZone, #content) .common-btn.double-arrow:not(.big-btn) .icon:before {
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
}

:is(#headerZone, #content) .common-btn.arrow.big-btn .icon:before {
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
}

:is(#headerZone, #content) .common-btn.double-arrow.big-btn .icon:before {
  width: 26px;
  height: 26px;
  margin: -13px 0 0 -13px;
}


:is(#headerZone, #content, #mobileNav) .common-arrow-btn {
  display: inline-flex;
  align-items: center;
  position: relative;
  color: var(--green1);
  font-size: clamp(0.875rem, 0.8135rem + 0.2623vw, 1.125rem);
  font-weight: 400;
  text-decoration: none;
  /* background-size: 200% 100%;
  background-position: right center; */
  padding: 10px 65px 10px 15px;
  /* background-image: var(--common-btn-bg); */
  overflow: hidden;
  z-index: 1;
  transition: color 0.3s;
  border-radius: var(--border-radius-5);
  transition: all .3s;
}

:is(.popup-wrap, #content) .common-arrow-btn:not(.big) {
  font-size: clamp(0.9375rem, 0.8299rem + 0.459vw, 1.375rem);
  line-height: 1.6;
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.big {
  font-size: clamp(1.125rem, 0.8945rem + 0.9836vw, 2.0625rem);
  padding: clamp(10px, calc(-1.538px + 3.077vw), 20px) clamp(70px, calc(-10.769px + 21.538vw), 140px) clamp(10px, calc(-1.538px + 3.077vw), 20px) clamp(15px, calc(-25.385px + 10.769vw), 50px);
  line-height: 1.3;
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.color2 {
  color: var(--white);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 200%;
  height: 100%;
  background-image: var(--common-btn-bg);
  transition: right 0.6s ease;
  z-index: -1;
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.color2:after {
  background-image: var(--common-btn-bg2);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn span:not([class]) {
  position: absolute;
  top: 50%;
  right: 15px;
  width: 36px;
  height: 10px;
  overflow: hidden;
  transform: translateY(-50%);
  transition: right 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.big span:not([class]) {
  width: clamp(36px, calc(-5.538px + 11.077vw), 72px);
  height: clamp(10px, calc(-1.538px + 3.077vw), 20px);
  right: clamp(18px, calc(-7.385px + 6.769vw), 40px);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn:is(:hover, :focus-visible) span:not([class]) {
  right: 11px;
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.big:is(:hover, :focus-visible) span:not([class]) {
  right: clamp(13px, calc(-8.923px + 5.846vw), 32px);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn span:not([class]):before {
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: var(--white);
  left: 0;
  bottom: 0;
  transition: background-position 0.3s cubic-bezier(0.25, 1, 0.5, 1), color 0.25s;
  /* transition:all .3s; */
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.color2 span:not([class]):before {
  background-color: var(--green4);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.big span:not([class]):before {
  height: clamp(2px, calc(-0.308px + 0.615vw), 4px);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn span:not([class]):after {
  content: '';
  position: absolute;
  width: 15px;
  height: 15px;
  border-top: 2px solid var(--white);
  transform: rotate(45deg);
  right: 4px;
  top: 0px;
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.color2 span:not([class]):after {
  border-top-color: var(--green4);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn.big span:not([class]):after {
  width: clamp(15px, calc(-2.308px + 4.615vw), 30px);
  height: clamp(15px, calc(-2.308px + 4.615vw), 30px);
  border-top: clamp(2px, calc(-0.308px + 0.615vw), 4px) solid var(--white);
  right: clamp(4px, calc(0.538px + 0.923vw), 7px);
  top: 1px;
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn:is(:hover, :focus-visible) {
  color: var(--white);
}

:is(#headerZone, #content, #mobileNav) .common-arrow-btn:is(:hover, :focus-visible)::after {
  right: -100%;
}

:is(#headerZone, #content, #mobileNav) a.common-arrow-btn span.word>span {
  font-size: clamp(0.75rem, 0.5656rem + 0.7869vw, 1.5rem);
}


:is(#headerZone, #content) .common-arrow-btn-wrap {
  display: grid;
  gap: 10px 40px;
  grid-template-columns: repeat(2, 33%);
  margin-bottom: 40px;
}

:is(#headerZone, #content) .circle-arrow-btn {
  --circle-btn-size: clamp(2.5rem, calc(1.808rem + 2.951vw), 5.313rem);
  width: var(--circle-btn-size);
  aspect-ratio: 1/1;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
}

:is(#headerZone, #content) .circle-arrow-btn:after {
  content: '';
  position: absolute;
  width: 20%;
  aspect-ratio: 1/1;
  border-top: 2px solid var(--green1);
  border-right: 2px solid var(--green1);
  transform: rotate(45deg) translate(-50%, -50%);
  z-index: 2;
  left: 50%;
  top: 50%;
  margin-left: -12%;
  margin-top: 3%;
  transition: border-color 0.3s ease 0s, margin-left 0.3s ease 0s;
}

:is(#headerZone, #content) .circle-arrow-btn:is(:hover, :focus-visible):after {
  border-color: var(--white);
  margin-left: -7%;
}

:is(#headerZone, #content) .circle-arrow-btn:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 200%;
  height: 100%;
  background-image: var(--common-btn-bg);
  transition: right 0.6s ease;
  z-index: 1;
}

:is(#headerZone, #content) .circle-arrow-btn:is(:hover, :focus-visible)::before {
  right: -100%;
}

:is(.popup-wrap, #content) .btn-back {
  display: inline-flex;
  align-items: center;
  gap: clamp(10px, calc(7.541px + 0.656vw), 20px);
  color: var(--green1);
  font-size: clamp(1.125rem, 1.0328rem + 0.3934vw, 1.5rem);
  font-weight: 500;
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content .btn-back {
  color: var(--white);
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content .btn-back>span.circle:after {
  background-color: var(--white);
}

:is(.popup-wrap, #content) .btn-back>span.circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(40px, calc(32.623px + 1.967vw), 70px);
  aspect-ratio: 1/1;
  border-radius: 50%;
  /* border: 2px solid var(--green3); */
  overflow: hidden;
  position: relative;
}

:is(.popup-wrap, #content) .btn-back>span.circle:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--green3);
  transform: scaleX(0);
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transform-origin: right center;


}

:is(.popup-wrap, #content) .btn-back>span.circle>span {
  display: block;
  width: 100%;
  aspect-ratio: 1/1;
  border: 2px solid var(--green3);
  border-radius: 50%;
}

:is(.popup-wrap, #content) .btn-back.opp-arrow>span.circle:before {
  transform-origin: left center;
}

:is(.popup-wrap, #content) .btn-back>span.circle:after {
  content: '';
  position: absolute;
  object-fit: contain;
  transform-origin: center;
  width: 35%;
  aspect-ratio: 1/1;
  pointer-events: none;
  transform: rotate(180deg);
  -webkit-mask-image: url(../images/icon-arrow.svg);
  mask-image: url(../images/icon-arrow.svg);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: background-color 0.3s ease 0s, margin 0.3s ease 0s;
  background-color: var(--green1);
}

:is(.popup-wrap, #content) .btn-back.opp-arrow>span.circle:after {
  transform: rotate(0deg);
}

:is(.popup-wrap, #content) .btn-back.opp-arrow:is(:hover, :focus-visible)>span.circle:after {
  margin-left: clamp(5px, calc(3.77px + 0.328vw), 10px);
}

:is(.popup-wrap, #content) .btn-back:is(:hover, :focus-visible)>span.circle:after {
  background-color: var(--white);
  margin-left: calc(0px - clamp(5px, calc(3.77px + 0.328vw), 10px));
}

:is(.popup-wrap, #content) .btn-back:is(:hover, :focus-visible)>span.circle:before {
  transform: scaleX(1);
}

:is(.popup-wrap, #content) table+p.remarks {
  margin-top: -15px;
}

:is(.popup-wrap, #content) .remarks {
  font-size: var(--font-size1);
  line-height: var(--line-height1);
  color: var(--grey5);
  font-weight: 300;
}

:is(.popup-wrap, #content) .remarks-wrap {
  padding: clamp(10px, calc(3.852px + 1.639vw), 35px) clamp(15px, calc(10.082px + 1.311vw), 35px);
  margin-bottom: 3em;
  border-radius: var(--border-radius-10);
  border: 2px solid rgba(62, 152, 142, 0.5)
}

:is(.popup-wrap, #content) .remarks-wrap .title {
  font-weight: 500;
  margin-bottom: 1em;
}

:is(.popup-wrap, #content) .remarks-wrap>*:last-child, :is(.popup-wrap, #content) .remarks-wrap>.item:last-child>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .f-left-img {
  float: left;
  margin: 0 1.66em 1.66em 0;
}

:is(.popup-wrap, #content) .f-right-img {
  float: right;
  margin: 0 0 1.66em 1.66em;
}

:is(.popup-wrap, #content) .f-left-img,
:is(.popup-wrap, #content) .f-right-img {
  width: 100%;
  overflow: hidden;
  line-height: 0;
  max-width: 420px;
  border-radius: 5px;
  transition: margin .3s ease 0s, border-radius .3s ease 0s;
}

:is(.popup-wrap, #content) .f-left-img img,
:is(.popup-wrap, #content) .f-right-img img {
  width: 100%;
}

/* Customize the label (the container) */
.check-container {
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 1em;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.check-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.check-container.checkbox .checkmark {
  position: absolute;
  top: 5px;
  left: 0;
  height: 20px;
  width: 20px;
  border-radius: 5px;
  border: 1px solid var(--grey3);
  background-color: var(--white);
  transition: all .3s;
}

/* Create a custom radio button */
.check-container.radio .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: var(--grey3);
  border-radius: 50%;
  transition: all .3s;
}

/* On mouse-over, add a grey background color */
.check-container:hover input~.checkmark {
  background-color: var(--orange3);
}

/* When the checkbox/radio button is checked, add a blue background */
.check-container input:checked~.checkmark {
  background-color: var(--lakeblue3);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.check-container input:checked~.checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.check-container.checkbox .checkmark:after {
  left: 6px;
  top: 3px;
  width: 6px;
  height: 10px;
  border: solid var(--white);
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* Style the indicator (dot/circle) */
.check-container.radio .checkmark:after {
  top: 7px;
  left: 7px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--white);
}

/* custom-select css, The container must be positioned relative: */
.custom-select {
  position: relative;
  min-width: 100px;
}

.custom-select label {
  display: none;
}

.custom-select select {
  display: none !important;
  /*hide original SELECT element: */
}

.select-selected {
  background-color: transparent;
}

/* Style the arrow inside the select element: */
.select-selected:after {
  position: absolute;
  content: "";
  top: 19px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: var(--lakeblue3) transparent transparent transparent;
  /* transition: all .3s; */
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  /* border-color: transparent transparent var(--lakeblue3) transparent; */
  transform: rotate(180deg);
  top: 11px;
}

/* style the items (options), including the selected item: */
.select-selected {
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: 6px 30px 6px 15px;
  cursor: pointer;
  background-color: var(--grey2);
  border-radius: var(--corner-radius3);
}

.select-selected:hover,
.select-selected:focus {}

.select-items div {
  cursor: pointer;
}

.select-items div {
  padding: 6px 15px;
  /* text-align: center; */
  background: transparent;
  transition: background 0.3s ease 0s;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
}

.select-items div:first-child {
  border-top: none;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: #f4f4f4;
  border: 1px solid rgba(0, 0, 0, 0.2);
  top: calc(100% - 1px);
  left: 0;
  right: 0;
  z-index: 199;
  max-height: 300px;
  overflow-y: auto;
  border-radius: 10px;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover,
.same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}

/*custom select ends*/

.filter-wrap {
  margin-bottom: 40px;
}

.filter-wrap .select-wrap {
  display: flex;
  gap: 10px;
  align-items: center;
}

.filter-wrap .select-wrap .filter-type {
  font-weight: 700;
}

.filter-wrap .custom-select {
  min-width: 160px;
}

.filter-wrap .btn-filter {
  display: block;
  text-align: center;
  color: var(--white);
  font-weight: 700;
  text-decoration: none;
  background-color: var(--lakeblue3);
  border-radius: 50%;
  position: relative;
  width: 42px;
  line-height: 42px;
  transition: background-color 0.3s ease 0s, color 0.3s ease 0s;
}

.filter-wrap .btn-filter:hover,
.filter-wrap .btn-filter.focus,
.filter-wrap .btn-filter:hover:after,
.filter-wrap .btn-filter.focus:after {
  background-color: var(--blue2);
}

:is(.popup-wrap, #content) .btn-wrap,
:is(.popup-wrap, #content) #form-wrap .btn-wrap {
  margin: 2.22em 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  align-items: center;
  transition: gap .3s ease 0s;
}

:is(.popup-wrap, #content) .btn-wrap.a-center {
  justify-content: center;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap {
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding-block-end: 15px;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a {
  position: relative;
  z-index: 1;
  display: inline-block;
  color: var(--green1);
  font-weight: 600;
  font-size: clamp(0.875rem, 0.752rem + 0.5246vw, 1.375rem);
  box-shadow: none;
  background-image: none;
  line-height: 1.5;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a:before,
:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a:after {
  content: '';
  position: absolute;
  top: 50%;
  left: -2015px;
  transform: translateY(-50%);
  width: 2000px;
  height: 2px;
  background-color: var(--bluegreen2);
  opacity: 0.18;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a:after {
  left: auto;
  right: -2015px;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a>span {
  display: block;
  position: relative;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a>span:after {
  content: '';
  position: absolute;
  width: 10px;
  aspect-ratio: 1/1;
  border-top: 2px solid var(--green1);
  border-right: 2px solid var(--green1);
  transform: rotate(135deg) translateX(-50%);
  left: 50%;
  bottom: -10px;
  margin-left: -5px;
  transition: bottom 0.3s ease 0s;
}

:is(.popup-wrap, #content) .btn-wrap.load-more-wrap>a:is(:hover, :focus-visible)>span:after {
  bottom: -15px;
}

.hr {
  margin: 30px 0;
  width: 100%;
  height: 1px;
  background-color: rgba(0, 0, 0, 0.1);
}

:is(.popup-wrap, #content) a.iconLink+span img {
  margin: 0 10px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
}

/*accordion*/
.accordCtrls {
  display: flex;
  column-gap: clamp(15px, calc(12.541px + 0.656vw), 25px);
  justify-content: flex-end;
  margin-bottom: 1em;
}

.accordCtrls>a {
  text-decoration: none;
  position: relative;
  color: var(--black);
  display: inline-flex;
  align-items: center;
  gap: clamp(8px, calc(6.279px + 0.459vw), 15px);
  font-weight: 500;
}

.accordCtrls>a>span.circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(30px, calc(22.623px + 1.967vw), 60px);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  /* border: 2px solid var(--green3); */
  overflow: hidden;
  position: relative;
}

.accordCtrls>a>span.circle:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--green3);
  transform: scaleY(0);
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.accordCtrls>a.expandBtn>span.circle:before {
  transform-origin: center top;
}

.accordCtrls>a.collapseBtn>span.circle:before {
  transform-origin: center bottom;
}

.accordCtrls>a:is(:hover, :focus-visible)>span.circle:before {
  transform: scaleY(1);
}

.accordCtrls>a>span.circle>span {
  display: block;
  width: 100%;
  aspect-ratio: 1/1;
  border: 2px solid var(--green3);
  border-radius: 50%;
}

.accordCtrls>a>span.circle:after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  object-fit: contain;
  transform-origin: center;
  width: 35%;
  aspect-ratio: 1/1;
  pointer-events: none;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: background-color .3s ease 0s;
  background-color: var(--green1);
}

.accordCtrls>a:is(:hover, :focus-visible)>span.circle:after {
  background-color: var(--white);
}

.accordCtrls>a.expandBtn>span.circle:after {
  -webkit-mask-image: url(../images/icon-expand-all.svg);
  mask-image: url(../images/icon-expand-all.svg);
}

.accordCtrls>a.collapseBtn>span.circle:after {
  -webkit-mask-image: url(../images/icon-collapse-all.svg);
  mask-image: url(../images/icon-collapse-all.svg);
}

.accordion-wrap {
  margin: 0 0 2.22em;
  overflow: hidden;
}

.accordion-wrap+.accordion-wrap {
  margin-top: -1.72em;
}

.accordion-item {
  /*margin-bottom:10px; */
  /*border-bottom:1px solid rgba(217,29,99,.1);*/
  position: relative;
  margin-bottom: 15px;
  overflow: hidden;
}


/*.accordion-item:first-child{border-top:1px solid rgba(217,29,99,.1);}*/

.accordion-item .accordion-title {
  padding: 25px clamp(45px, calc(29.016px + 4.262vw), 110px) 25px clamp(15px, calc(10.082px + 1.311vw), 35px);
  display: flex;
  align-items: center;
  background-image: linear-gradient(to right, var(--bluegreen2), var(--green3)), linear-gradient(to right, var(--white) 50%, var(--white) 100%);
  background-position: left center, left center;
  background-repeat: no-repeat, no-repeat;
  background-size: 0% 100%, 100% 100%;
  color: var(--bluegreen2);
  font-weight: 500;
  font-size: clamp(1.25rem, 1.0348rem + 0.918vw, 2.125rem);
  position: relative;
  line-height: 1.1;
  transition: color 0.3s ease 0s, background-size 0.3s ease 0s;

}

.accordion-item.active .accordion-title {
  border-top-left-radius: var(--border-radius-10);
  border-top-right-radius: var(--border-radius-10);
}

.accordion-item.active .accordion-title,
.accordion-item .accordion-title:is(:hover, :focus-visible) {
  color: var(--white);
  background-size: 100% 100%, 100% 100%;
}


.accordion-item .accordion-title:not(.btnOnly):before {
  content: "";
  width: 25px;
  aspect-ratio: 1/1;
  display: block;
  position: absolute;
  top: 31%;
  right: 32px;
  transform-origin: center center;
  transform: rotate(45deg);
  transition: transform 0.3s ease 0s;
  border-right: 3px solid currentColor;
  border-bottom: 3px solid currentColor;
}

.accordion-item .accordion-title:after {
  content: "";
  width: 100%;
  height: 4px;
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--green3);
  opacity: 0.5;
}

.accordion-item.active .accordion-title:not(.btnOnly):before {
  transform: rotate(-135deg);
  top: 42%;
}

.accordion-item .accordion-title span.num {
  min-width: 40px;
  align-self: flex-start;
  margin-top: 1px;
  transition: min-width .3s ease 0s;
}

/* .accordion-item .accordion-content {
  overflow: hidden;
} */

.accordion-item .accordion-content {
  /* max-height: 0; */
  /* overflow: hidden; */
  /* transition: max-height 2s cubic-bezier(0.21, 0.2, 1, 1); */
  background-color: rgba(62, 152, 145, 0.1);
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 500ms;
  border-bottom-left-radius: var(--border-radius-10);
  border-bottom-right-radius: var(--border-radius-10);
}

.accordion-item.active .accordion-content {
  grid-template-rows: 1fr;
}

.accordion-item:not(.active) .accordion-content {
  /*display: none;*/
}

.accordion-item .accordion-content .accordion-main {
  padding: 0 clamp(15px, calc(10.082px + 1.311vw), 35px);
  overflow: hidden;
  transition: padding 500ms;
}

.accordion-item.active .accordion-content .accordion-main {
  padding: clamp(10px, calc(6.311px + 0.984vw), 25px) clamp(15px, calc(10.082px + 1.311vw), 35px);
}

.accordionWrap.faq .accordion-content .accordion-main {
  padding: 0 20px 0 60px;
}

.accordionWrap.faq .accordion-item.active .accordion-content .accordion-main {
  padding: 20px 20px 20px 60px;
}

.accordion-item .accordion-main>*:last-child {
  margin-bottom: 0 !important;
}

/*accordion ends*/

/*tab menu starts*/
.tab-container {
  position: relative;
  /* z-index: 100; */
}

.tab-container .tab-menu .tabCtrls .tab-item.mobileSelected.active a:after {
  transform: rotate(180deg);
}

.tab-container .tab-menu {
  margin-bottom: 1.66em;
  position: relative;
  padding-block-end: 10px;
  overflow: initial;
  font-size: clamp(1.0625rem, 0.8012rem + 1.1148vw, 2.125rem);
  font-weight: 500;
}

.tab-container:has(.subsecImg) .tab-menu {
  margin-bottom: 0;
}

.tab-container .tab-menu:after {
  content: '';
  position: absolute;
  bottom: 0;
  width: 150%;
  left: 50%;
  transform: translateX(-50%);
  height: 10px;
  background-color: var(--green4);
}

.tab-container .tab-menu .tabCtrls {
  display: flex;
  /* justify-content: center; */
  margin: 0;
  position: relative;
  z-index: 5;
  list-style-type: none;
  align-items: flex-end;
}

.tab-container .tab-menu.center .tabCtrls {
  justify-content: center;
}

.tab-container .tab-menu .swiper-arrow {
  display: block;
  position: absolute;
  width: clamp(40px, calc(30.164px + 2.623vw), 80px);
  aspect-ratio: 1/1;
  bottom: 10px;
  text-indent: -9999px;
  z-index: 10;
  transition: margin 0.3s ease 0s;
}

.tab-container .tab-menu .swiper-arrow.swiper-button-disabled {
  display: none;
}

.tab-container .tab-menu .swiper-arrow>span {
  position: absolute;
  width: 40%;
  height: 40%;
  border-top: 2px solid var(--white);
  border-right: 2px solid var(--white);
  transform: rotate(45deg) translate(-50%, -50%);
  left: 50%;
  top: 50%;
  display: block;
  margin: 0;
  transform-origin: 0 0;
}

.tab-container .tab-menu .swiper-arrow.swiper-prev>span {
  transform: rotate(-135deg) translate(-50%, -50%);
}

.tab-container .tab-menu .swiper-arrow.swiper-prev:is(:hover, :focus-visible) {
  margin-left: -10px;
}

.tab-container .tab-menu .swiper-arrow.swiper-next:is(:hover, :focus-visible) {
  margin-right: -10px;
}

.tab-container .tab-menu .swiper-arrow.swiper-prev {
  left: calc(0px - var(--page-inner-content-horizontal-padding) - var(--page-content-horizontal-padding));
}

.tab-container .tab-menu .swiper-arrow.swiper-next {
  right: calc(0px - var(--page-inner-content-horizontal-padding) - var(--page-content-horizontal-padding));
}

/* .tab-container .tab-menu .tabCtrls{

} */

.tab-container .tab-menu .tabCtrls .tab-item {
  /* min-height: 50px; */
  padding: 0;
  margin: 0;
  flex: 0 0 calc((100% - 40px) / 3);
  min-width: 320px;
}

.tab-container .tab-menu .tabCtrls .tab-item:before {
  display: none;
}

.tab-container .tab-menu .tabCtrls .tab-item a {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  padding: clamp(4px, calc(2.525px + 0.393vw), 10px) clamp(10px, calc(6.311px + 0.984vw), 25px);
  line-height: 1.1;
  position: relative;
  min-height: clamp(45px, calc(33.934px + 2.951vw), 90px);
  height: 100%;
  overflow: hidden;
  transition: background-size 0.3s ease 0s, color 0.3s ease 0s;
  background-image: linear-gradient(to top, var(--green4), var(--green5));
  background-position: center calc(100% + 1px);
  background-repeat: no-repeat;
  background-size: 100% 0%;
  background-color: var(--green2);
  border-top-right-radius: var(--border-radius-10);
  border-top-left-radius: var(--border-radius-10);
}

.tab-container .tab-menu .tabCtrls .tab-item.selected a {
  min-height: clamp(55px, calc(41.475px + 3.607vw), 110px);
  background-color: transparent;
  transform: translateY(1px);
}


.tab-container .tab-menu .tabCtrls .tab-item.selected a,
.tab-container .tab-menu .tabCtrls .tab-item:not(.mobileSelected) a:is(:hover, :focus-visible) {
  color: var(--green1);
  background-size: 100% calc(100% + 1px);
}

.tab-container .tab-content {
  padding-bottom: 1.66em;
}

.tab-container .tab-content .tabpanel {
  display: none;
  opacity: 0;
  transition: opacity 0.25s ease 0s;
}

.tab-container .tab-content .tabpanel.shownOp {
  opacity: 1;
}

:is(.popup-wrap, #content) .tab-container .tab-content .tabpanel>*:last-child {
  margin-bottom: 0;
}

/*tab menu ends*/

.photoslider-wrap {
  margin-bottom: 2.22em;
}

.photoslider-wrap .swiper-container {
  overflow: hidden;
  padding: 2px;
  margin: -2px;
}

.photoslider-wrap .swiper-slide {
  width: calc((99.99% - 40px)/5);
}

.photoslider-wrap .swiper-slide a {
  display: block;
  text-decoration: none;
  color: #000;
}

.photoslider-wrap .swiper-slide span {
  display: block;
  line-height: 0;
  border-radius: var(--border-radius-10);
  overflow: hidden;
  background-color: #e9e9e9;
  position: relative;
  aspect-ratio: 3/2;
}

.photoslider-wrap .swiper-slide .swiper-lazy-preloader {
  transition: all .3s;
}

.photoslider-wrap .swiper-slide.swiper-slide-visible .swiper-lazy-preloader,
.photoslider-wrap .swiper-slide.swiper-slide-fully-visible .swiper-lazy-preloader {
  opacity: 0;
}

.photoslider-wrap .swiper-slide span>img {
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  transition: transform .3s ease 0s;
}

.photoslider-wrap .swiper-slide a:hover span>img,
.photoslider-wrap .swiper-slide a.focus span>img {
  transform: translate(-50%, -50%) scale(1.1);
}

.swiper-wrap .slider-ctrls {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  max-width: 200px;
  padding: 0 40px;
  margin: 20px auto 0;
  text-align: center;
  transition: max-width .3s ease 0s;
}

.swiper-wrap .slider-ctrls>* {
  display: inline-block;
}

.swiper-wrap .slider-ctrls .swiper-arrow {
  width: 40px;
}

.swiper-wrap .slider-ctrls .swiper-prev {
  left: 0;
}

.swiper-wrap .slider-ctrls .swiper-prev:hover {
  left: -2px;
}

.swiper-wrap .slider-ctrls .swiper-next {
  right: 0;
}

.swiper-wrap .slider-ctrls .swiper-next:hover {
  right: -2px;
}

.swiper-wrap .slider-ctrls .swiper-arrow span {
  border-color: var(--primary-blue);
}

.swiper-wrap .slider-ctrls .swiper-paging {
  color: var(--primary-blue);
}

.swiper-paging {
  display: inline-block;
  vertical-align: top;
  padding: 0 5px;
}

.swiper-paging>a {
  display: inline-block;
  height: 40px;
  width: 28px;
  position: relative;
  vertical-align: top;
  text-indent: -9999px;
  opacity: 1;
}

.swiper-paging>a:before {
  content: '';
  position: absolute;
  background-color: rgba(56, 186, 169, .5);
  border-radius: 50%;
  width: 10px;
  height: 10px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.swiper-paging>a:not(.swiper-pagination-bullet-active):hover:before {
  background-color: rgba(56, 186, 169, 1);
}

.swiper-paging .swiper-pagination-bullet-active:before {
  background-color: rgba(56, 186, 169, 1);
}

.swiper-paging .swiper-pagination-bullet,
.swiper-paging .swiper-pagination-bullet-active {
  background: none;
}

.swiper-button-disabled {
  cursor: default;
  /*visibility:hidden;*/
  opacity: .2;
}

.swiper-wrap .slider-ctrls .btn-play:before,
.swiper-wrap .slider-ctrls .btn-play:after {
  background-color: var(--primary-blue);
}

.swiper-wrap .slider-ctrls .btn-play.stop:before {
  border-bottom: 7px solid transparent;
  border-left: 10px solid var(--primary-blue);
  border-top: 7px solid transparent;
}

:is(.popup-wrap, #content) .flexbox,
:is(.popup-wrap, #content) .masonry-grid {
  /* display: flex;
	flex-wrap: wrap;
  column-gap: 20px;
  row-gap: 20px; */
  display: grid;
  gap: 50px;
  margin-bottom: 1.66em;
}

:is(.popup-wrap, #content) .flexbox.type-url {
  gap: 20px;
}

:is(.popup-wrap, #content) .flexbox.type-info {
  gap: 20px 40px;
  font-size: clamp(0.9375rem, 0.7377rem + 0.8525vw, 1.75rem);
  grid-template-rows: auto 1fr;
}

:is(.popup-wrap, #content) .flexbox.col-2:has(.note) {
  grid-template-rows: auto 1fr auto;
}

:is(.popup-wrap, #content) .masonry-grid {
  align-items: start;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: masonry;
  grid-auto-flow: dense;
}

:is(.popup-wrap, #content) .masonry-grid.col-1 {
  grid-template-columns: repeat(1, 1fr);
}

:is(.popup-wrap, #content) .masonry-grid>div {
  padding-inline-start: clamp(1.125rem, calc(0.864rem + 1.115vw), 2.188rem);
  position: relative;
  align-self: start;
  grid-column-end: span var(--span, 1);
}

:is(.popup-wrap, #content) .masonry-grid>div::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 100%;
  background-image: linear-gradient(to bottom, var(--green4), var(--green5));
  left: 0;
  top: 0;
  border-radius: 5px;
}

:is(.popup-wrap, #content) .masonry-grid.stairs {
  gap: clamp(20px, calc(12.623px + 1.967vw), 50px);
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item {
  padding: 0;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item:nth-child(2) {
  padding-top: 23.75%;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item:before {
  display: none;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a {
  display: block;
  overflow: hidden;
  border-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.img {
  position: relative;
  line-height: 0;
  width: 100%;
  aspect-ratio: 800 / 380;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease 0s;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a:is(:hover, :focus-visible)>div.img img {
  transform: scale(1.1);
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.img:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--black);
  transition: background-color 0.3s ease 0s;
  z-index: 2;
  opacity: 0.3;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a:is(:hover, :focus-visible)>div.img:before {
  background-color: var(--bluegreen2);
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.img:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.8) 100%);
  transition: opacity 0.3s ease 0s;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a:is(:hover, :focus-visible)>div.img:after {
  opacity: 0;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.txt-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: var(--border-radius-10);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  color: var(--white);
  font-size: clamp(1.375rem, 1.1906rem + 0.7869vw, 2.125rem);
  font-weight: 500;
  padding: clamp(12px, calc(7.574px + 1.18vw), 30px);
  line-height: 1.2;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.txt-layer div {
  position: relative;
  z-index: 5;
  text-align: center;
  transition: padding-block-end 0.3s ease 0s;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a:is(:hover, :focus-visible)>div.txt-layer div {
  padding-block-end: clamp(20px, calc(15.082px + 1.311vw), 40px);
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.txt-layer:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, rgba(0, 55, 40, 0) 50%, rgba(0, 55, 40, 1) 100%);
  opacity: 0;
  transition: opacity 0.3s ease 0s;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a:is(:hover, :focus-visible)>div.txt-layer:before {
  opacity: 1;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.txt-layer span.arrow {
  display: block;
  position: absolute;
  left: 50%;
  width: clamp(36px, calc(-5.538px + 11.077vw), 72px);
  height: clamp(10px, calc(-1.538px + 3.077vw), 20px);
  overflow: hidden;
  transform: translateX(-50%);
  opacity: 0;
  margin-left: -15px;
  transition: opacity 0.3s ease 0s, margin-left 0.3s ease 0s;
  bottom: clamp(12px, calc(7.574px + 1.18vw), 30px);
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a:is(:hover, :focus-visible)>div.txt-layer span.arrow {
  opacity: 1;
  margin-left: 0;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.txt-layer span.arrow:before {
  content: '';
  position: absolute;
  width: 100%;
  height: clamp(2px, calc(-0.308px + 0.615vw), 4px);
  background-color: var(--green5);
  left: 0;
  bottom: 0;
}

:is(.popup-wrap, #content) .masonry-grid.stairs>.item a>div.txt-layer span.arrow:after {
  content: '';
  position: absolute;
  width: clamp(15px, calc(-2.308px + 4.615vw), 30px);
  height: clamp(15px, calc(-2.308px + 4.615vw), 30px);
  border-top: clamp(2px, calc(-0.308px + 0.615vw), 4px) solid var(--green5);
  transform: rotate(45deg);
  right: clamp(4px, calc(0.538px + 0.923vw), 7px);
  top: 0px;
}

:is(.popup-wrap, #content) .flexbox>div>*:last-child {
  /* margin-bottom: 0 !important; */
}

:is(.popup-wrap, #content) .flexbox.col-2 {
  grid-template-columns: repeat(2, 1fr);
}

:is(.popup-wrap, #content) .flexbox.col-3 {
  grid-template-columns: repeat(3, 1fr);
}

:is(.popup-wrap, #content) .flexbox.type-url a {
  display: flex;
  width: 100%;
  background-color: rgba(62, 152, 145, 0.1);
  padding: clamp(10px, calc(6.311px + 0.984vw), 25px) clamp(20px, calc(16.311px + 0.984vw), 35px);
  padding-inline-start: clamp(20px, calc(16.311px + 0.984vw), 35px);
  border-radius: var(--border-radius-10);
  font-size: clamp(0.9375rem, 0.7377rem + 0.8525vw, 1.75rem);
  /* background-image: linear-gradient(to right, var(--green5), var(--green4));
  background-position: left center;
  background-repeat: no-repeat;
  background-size: 0% 100%; */
  gap: clamp(12px, calc(7.574px + 1.18vw), 30px);
  align-items: center;
  transition: padding-inline-start 0.3s ease 0s;
  position: relative;
  overflow: hidden;
  height: 100%;
  line-height: 1.3;
}

:is(.popup-wrap, #content) .accordion-content .flexbox.type-url a {
  background-color: var(--white);
}

:is(.popup-wrap, #content) .flexbox.type-url a:is(:hover, :focus-visible) {
  padding-inline-start: clamp(30px, calc(22.623px + 1.967vw), 60px);
  background-size: 100% 100%;
}

:is(.popup-wrap, #content) .flexbox.type-url a:before {
  content: "";
  position: absolute;
  width: 201%;
  height: 100%;
  right: 0;
  top: 0;
  background-image: linear-gradient(to right, var(--green5), var(--green4) 50%, transparent 50%, transparent);
  background-position: right center;
  background-repeat: no-repeat;
  transition: right 0.6s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.type-url a:is(:hover, :focus-visible):before {
  right: -101%;
}

:is(.popup-wrap, #content) .flexbox.type-url a:after {
  content: "";
  position: absolute;
  width: 25px;
  aspect-ratio: 1/1;
  display: block;
  border-top: 3px solid var(--white);
  border-right: 3px solid var(--white);
  transform: rotate(45deg) translate(-50%, -50%);
  right: clamp(20px, calc(17.541px + 0.656vw), 30px);
  top: 50%;
  transform-origin: 0 0;
  transition: right 0.3s ease 0s, opacity 0.3s ease 0s;
  opacity: 0;
  z-index: 1;
}

:is(.popup-wrap, #content) .flexbox.type-url a:is(:hover, :focus-visible):after {
  right: clamp(13px, calc(11.279px + 0.459vw), 20px);
  opacity: 1;
  transition: right 0.3s ease 0.1s, opacity 0.3s ease 0.1s;
}

:is(.popup-wrap, #content) .flexbox.type-url a>span.img {
  flex: 0 0 clamp(32px, calc(23.885px + 2.164vw), 65px);
  aspect-ratio: 1/1;
  display: block;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  position: relative;
  z-index: 1;
}

:is(.popup-wrap, #content) .flexbox.type-url a.pdf>span.img, :is(.popup-wrap, #content) .flexbox.type-url .pdf a>span.img {
  background-image: url(../images/icon-pdf.svg);
}

:is(.popup-wrap, #content) .flexbox.type-url a.job>span.img, :is(.popup-wrap, #content) .flexbox.type-url .job a>span.img {
  background-image: url(../images/icon-jobs.svg);
}

:is(.popup-wrap, #content) .flexbox.type-url a.football>span.img, :is(.popup-wrap, #content) .flexbox.type-url .football a>span.img {
  background-image: url(../images/icon-football.svg);
}

:is(.popup-wrap, #content) .flexbox.type-url a.basketball>span.img, :is(.popup-wrap, #content) .flexbox.type-url .basketball a>span.img {
  background-image: url(../images/icon-basketball.svg);
}

:is(.popup-wrap, #content) .flexbox.type-url a.tennis>span.img, :is(.popup-wrap, #content) .flexbox.type-url .tennis a>span.img {
  background-image: url(../images/icon-tennis.svg);
}

:is(.popup-wrap, #content) .flexbox.type-url a.form>span.img, :is(.popup-wrap, #content) .flexbox.type-url .form a>span.img {
  background-image: url(../images/icon-form.svg);
}

:is(.popup-wrap, #content) .flexbox.type-url a>span.text {
  flex: 0 0 calc(100% - clamp(32px, calc(23.885px + 2.164vw), 65px) - clamp(10px, calc(6.311px + 0.984vw), 25px) - clamp(12px, calc(7.574px + 1.18vw), 30px));
  padding-inline-end: 25px;
  position: relative;
  z-index: 1;
  transition: flex 0.3s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.type-url a>span.text>span {
  display: block;
  color: var(--brown1);
  font-weight: 500;
  font-size: clamp(0.75rem, 0.6578rem + 0.3934vw, 1.125rem);
}

:is(.popup-wrap, #content) .flexbox.type-url a:is(:hover, :focus-visible)>span.text {
  flex: 0 0 calc(100% - clamp(32px, calc(23.885px + 2.164vw), 65px) - clamp(12px, calc(7.574px + 1.18vw), 30px));
}

:is(.popup-wrap, #content) .flexbox.type-url.highlight a {
  background-color: rgba(213, 228, 154, 0.2);
  border: 1px solid rgba(62, 152, 145, 0.2);
}

:is(.popup-wrap, #content) .flexbox.type-url.highlight a>span.flag {
  width: clamp(45px, calc(33.934px + 2.951vw), 90px);
  aspect-ratio: 1/1;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background-image: linear-gradient(to left bottom, var(--green3), var(--green5));
  clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
}

:is(.popup-wrap, #content) .flexbox.type-url.highlight a>span.flag:before {
  content: "";
  position: absolute;
  width: 39%;
  aspect-ratio: 1/1;
  left: 5%;
  top: 9%;
  background: url(../images/icon-highlight-pdf.svg) no-repeat center center;
  background-size: contain;
}

:is(.popup-wrap, #content) .flexbox.type-info>div {
  background-color: rgba(62, 152, 145, 0.1);
  padding: clamp(15px, calc(11.311px + 0.984vw), 30px);
  border-radius: var(--border-radius-10);
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: 10px;
}

:is(.popup-wrap, #content) .flexbox.type-info:has(.note)>div {
  grid-row: span 3;
}

:is(.popup-wrap, #content) .flexbox.type-info>div div.note {
  font-size: clamp(1rem, 0.9078rem + 0.3934vw, 1.375rem);
}

:is(.popup-wrap, #content) .flexbox.type-info>div div.note>*:last-child{
	margin-bottom: 0!important;
}

:is(.popup-wrap, #content) .flexbox.type-info>div .note {
  color: var(--brown1);
}

:is(.popup-wrap, #content) .flexbox.type-info>div .tittle {
  font-weight: 500;
}

:is(.popup-wrap, #content) .flexbox.graduate {
  margin-block-start: 3.5em;
  gap: clamp(20px, calc(15.082px + 1.311vw), 40px);
}

:is(.popup-wrap, #content) .flexbox.graduate>div {
  container-type: inline-size;
  container-name: graduate;
}

:is(.popup-wrap, #content) .flexbox.graduate>div>div {
  height: 100%;
  background-color: rgba(62, 152, 145, 0.1);
  padding: clamp(15px, calc(11.311px + 0.984vw), 30px);
  border-radius: var(--border-radius-10);
  grid-template-columns: 58% auto;
  display: grid;
  gap: 10px 15px;
  grid-template-areas:
    "g-name g-name"
    "g-info g-img";
  grid-template-rows: max-content 1fr;
}

:is(.popup-wrap, #content) .flexbox.graduate>div .g-name {
  grid-area: g-name;
  font-weight: 600;
  color: var(--green1);
  font-size: clamp(1.375rem, 1.2213rem + 0.6557vw, 2rem);
}

:is(.popup-wrap, #content) .flexbox.graduate>div .g-info {
  grid-area: g-info;
}

:is(.popup-wrap, #content) .flexbox.graduate>div .g-info>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .flexbox.graduate>div .g-img {
  grid-area: g-img;
  aspect-ratio: 1/1;
  overflow: hidden;
  line-height: 0;
  border-radius: 50%;
  align-self: flex-start;
  width: 100%;
}

@container graduate (width <=600px) {
  :is(.popup-wrap, #content) .flexbox.graduate>div.g-item>div {
    grid-template-columns: 1fr;
    grid-template-areas:
      "g-name"
      "g-info"
      "g-img";
	grid-template-rows: max-content 1fr max-content;
  }

  :is(.popup-wrap, #content) .flexbox.graduate>div .g-img {
    max-width: 250px;
    margin: 0 auto;
  }
}

:is(.popup-wrap, #content) .timeslot {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 15px 20px;
  align-self: flex-start;
  align-items: flex-start;
}

:is(.popup-wrap, #content) .timeslot>div {
  background-color: var(--white);
  padding: 10px;
  text-align: center;
  border-radius: var(--border-radius-5);
}

:is(.popup-wrap, #content) .flexbox.imgCols {
  border-top: 4px solid var(--bluegreen2);
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  margin-bottom: 4em;
}

:is(.popup-wrap, #content) .flexbox.imgCols .item:not(.img) {
  padding: clamp(25px, calc(18.852px + 1.639vw), 50px);
  background-color: rgba(62, 152, 145, 0.1);
}

:is(.popup-wrap, #content) .flexbox.imgCols .item:not(.img)>*:first-of-type {
  margin-top: 0;
}

:is(.popup-wrap, #content) .flexbox.imgCols .item.img {
  position: relative;
  padding: clamp(25px, calc(18.852px + 1.639vw), 50px);
  background-color: rgba(62, 152, 145, 0.2);
}

:is(.popup-wrap, #content) .flexbox.imgCols .item.img>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .flexbox.imgCols .item.img>a {
  display: block;
  overflow: hidden;
  position: relative;
  line-height: 0;
}

:is(.popup-wrap, #content) .flexbox.imgCols .item.img>a:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border: clamp(2px, calc(1.262px + 0.197vw), 5px) solid var(--white);
}

:is(.popup-wrap, #content) .flexbox.imgCols .item.img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.imgCols .item.img>a:is(:hover, :focus-visible) img {
  transform: scale(1.1);
}

:is(.popup-wrap, #content) .flexbox.imgCols .item .caption {
  padding: 15px 20px;
  text-align: center;
  line-height: 1.4rem;
}

:is(.popup-wrap, #content) .flexbox.imgCols .item>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .flexbox.logo-list {
  grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
  gap: 40px 20px;
}

:is(.popup-wrap, #content) .flexbox.logo-list a {
  background-image: none;
  display: block;
}

:is(.popup-wrap, #content) .flexbox.logo-list a>span {
  display: block;
}

:is(.popup-wrap, #content) .flexbox.logo-list a>span.img {
  border: 2px solid rgba(62, 152, 145, 0.3);
  aspect-ratio: 540/280;
  padding: clamp(20px, calc(15.082px + 1.311vw), 40px);
  border-radius: var(--border-radius-10);
  margin-bottom: 0.2em;
  transition: border-color 0.3s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.logo-list a:is(:hover, :focus)>span.img {
  border-color: var(--bluegreen2);
}

:is(.popup-wrap, #content) .flexbox.logo-list a>span.img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

:is(.popup-wrap, #content) .flexbox.logo-list a>span.name {
  text-align: center;
  color: var(--black);
  font-size: clamp(0.875rem, 0.6598rem + 0.918vw, 1.75rem);
  padding-inline: clamp(10px, calc(7.541px + 0.656vw), 20px);
  line-height: 1.5;
}

:is(.popup-wrap, #content) .flexbox.album-list {
  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
  gap: clamp(25px, calc(16.393px + 2.295vw), 60px) clamp(20px, calc(12.623px + 1.967vw), 50px);
}

:is(.popup-wrap, #content) .flexbox.album-list>div {
  padding-top: 30px;
}

:is(.popup-wrap, #content) .flexbox.album-list a {
  position: relative;
  display: block;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div:not(.date) {
  display: block;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.date {
  position: absolute;
  width: 110px;
  display: grid;
  font-weight: 400;
  grid-template-columns: 1fr;
  grid-template-areas: "day-month" "year";
  text-align: center;
  align-self: flex-start;
  align-items: baseline;
  border-radius: var(--border-radius-10);
  overflow: hidden;
  column-gap: 4px;
  right: 25px;
  top: -30px;
  z-index: 2;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.date:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to right, var(--green5), var(--green4));
  z-index: 0;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.date .day-month {
  grid-area: day-month;
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 4px;
  position: relative;
  z-index: 2;
  font-size: clamp(1.5rem, 1.1311rem + 1.5738vw, 3rem);
  line-height: 1;
  color: var(--green1);
  padding-block: clamp(7px, calc(6.262px + 0.197vw), 10px);
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.date .year {
  grid-area: year;
  font-size: clamp(0.9375rem, 0.8299rem + 0.459vw, 1.375rem);
  color: var(--white);
  background-color: var(--green1);
  width: 100%;
  position: relative;
  z-index: 2;
  opacity: 0.8;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.cover-photo {
  width: 100%;
  aspect-ratio: 520 / 390;
  overflow: hidden;
  border-radius: var(--border-radius-10);
  margin-block-end: 10px;
  position: relative;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.cover-photo:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--bluegreen1);
  opacity: 0;
  z-index: 1;
  transition: opacity 0.3s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.album-list a:is(:hover, :focus-visible)>div.cover-photo:before {
  opacity: 0.3;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.cover-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.album-list a:is(:hover, :focus-visible)>div.cover-photo img {
  transform: scale(1.1);
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.location {
  color: var(--bluegreen1);
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 5px;
  padding-inline: var(--border-radius-10);
  margin-block-end: 5px;
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.location span.icon {
  width: 25px;
  aspect-ratio: 1 / 1;
  background-color: var(--bluegreen1);
}

:is(.popup-wrap, #content) .flexbox.album-list a>div.album-name {
  font-weight: 400;
  font-size: clamp(1.125rem, 0.9713rem + 0.6557vw, 1.75rem);
  padding-inline-start: var(--border-radius-10);
  line-height: 1.3;
  width: calc(100% - 30px);
  transition: transform 0.3s ease 0s;
}

:is(.popup-wrap, #content) .flexbox.album-list a:is(:hover, :focus-visible)>div.album-name {
  transform: translateX(30px);
}


:is(.popup-wrap, #content) .gradient-text {
  background: linear-gradient(to right, var(--green2), var(--green3));

  -webkit-background-clip: text;
  background-clip: text;

  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}




/******** inside page **********/
:is(.popup-wrap, #content) .highlight-box {
  max-width: var(--special-width);
  margin-inline: auto;
  background-color: rgba(62, 152, 145, 0.1);
  padding: clamp(2.188rem, calc(1.419rem + 3.279vw), 5.313rem) clamp(1.25rem, calc(0.097rem + 4.918vw), 5.938rem) clamp(2.813rem, calc(2.198rem + 2.623vw), 5.313rem);
  border-radius: var(--border-radius-10);
  margin-block-end: 2em;
}

:is(.popup-wrap, #content) .highlight-box>*:first-of-type {
  margin-top: 0;
}

:is(.popup-wrap, #content) .highlight-box>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .highlight-box .bigger {
  font-weight: 400;
  font-size: clamp(1.0625rem, 0.8934rem + 0.7213vw, 1.75rem);
  line-height: 1.3;
}

:is(.popup-wrap, #content) .highlight-box.with-quote :is(.f-right-img, .f-left-img) {
  max-width: 460px;
  width: 40%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  overflow: hidden;
}

:is(.popup-wrap, #content) .highlight-box.with-quote :is(.f-right-img, .f-left-img) img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.popup-wrap, #content) .highlight-box.with-quote .f-right-img {
  margin: 0 0 2em 3em;
}

:is(.popup-wrap, #content) .highlight-box.with-quote {
  padding-block: clamp(35px, calc(14.098px + 5.574vw), 120px);
  position: relative;
  margin-block-start: 1.5em;
}

:is(.popup-wrap, #content) .highlight-box.with-quote:before,
:is(.popup-wrap, #content) .highlight-box.with-quote:after {
  content: '';
  position: absolute;
  width: clamp(65px, calc(19.508px + 12.131vw), 250px);
  aspect-ratio: 1/1;
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
}

:is(.popup-wrap, #content) .highlight-box.with-quote:before {
  background-image: url(../images/home/icon-QuotationMarks-open.png);
  left: calc(-1 * clamp(15px, calc(3.934px + 2.951vw), 60px));
  top: calc(-1 * clamp(10px, calc(2.623px + 1.967vw), 40px));
}

:is(.popup-wrap, #content) .highlight-box.with-quote:after {
  background-image: url(../images/home/icon-QuotationMarks-close.png);
  right: calc(-1 * clamp(15px, calc(3.934px + 2.951vw), 60px));
  bottom: calc(-1 * clamp(10px, calc(2.623px + 1.967vw), 40px));
  background-position: right bottom;
}

:is(.popup-wrap, #content) .highlight-box.green {
  color: var(--green1);
  font-size: clamp(1.25rem, 1.0348rem + 0.918vw, 2.125rem);
}

:is(.popup-wrap, #content) .highlight-box.green .flexbox {
  margin-bottom: 1em;
}

:is(.popup-wrap, #content) .highlight-box.green .flexbox.col-3 {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  row-gap: 1em;
}

:is(.popup-wrap, #content) .highlight-box.green .flexbox .icon-header {
  margin-bottom: 0 !important;
  padding-inline-start: 0;
  line-height: 1.2;
}

:is(.popup-wrap, #content) .fixed-width-box {
  max-width: 900px;
  margin-inline: auto;
  margin-block-end: 2em;
  text-align: center;
  font-size: clamp(0.9375rem, 0.7377rem + 0.8525vw, 1.75rem);
  line-height: 1.6;
}

:is(.popup-wrap, #content) .fixed-width-box span.highlight {
  display: block;
  font-weight: 500;
  font-size: clamp(1.3125rem, 0.9898rem + 1.377vw, 2.625rem);
  color: var(--bluegreen2);
  line-height: 1.4;
}

:is(.popup-wrap, #content) .fixed-width-box .btn-wrap {
  justify-content: center;
  column-gap: clamp(1.875rem, 1.4139rem + 1.9672vw, 3.75rem);
}

:is(.popup-wrap, #content) .job-box {
  background-color: rgba(62, 152, 145, 0.1);
  padding: clamp(15px, calc(11.311px + 0.984vw), 30px);
  border-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .job-box>.job-item {
  display: flex;
  align-items: center;
  gap: clamp(12px, calc(8.803px + 0.852vw), 25px);
}

:is(.popup-wrap, #content) .job-box>.job-item .job-item-title {
  font-weight: 500;
  flex: 0 0 180px;
}

:is(.popup-wrap, #content) .fullwidth {
  width: calc(100% + var(--page-inner-content-horizontal-padding)*2 + var(--page-content-horizontal-padding)*2);
  margin-left: calc(-1 * (var(--page-inner-content-horizontal-padding) + var(--page-content-horizontal-padding)));
}


#wrapper.other .inner-container {
  container-type: inline-size;
  container-name: viewport;
  padding-inline: 0;
}

#wrapper.other .inner-container :is(.popup-wrap, #content) .fullwidth {
  width: calc(100cqw + var(--page-content-horizontal-padding)*2);
  margin-left: 0;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

:is(.popup-wrap, #content) .subsecImg {
  aspect-ratio: 1900 / 330;
  line-height: 0;
  max-height: 330px;
  min-height: 120px;
  position: relative;
  margin-bottom: 3em;
}

:is(.popup-wrap, #content) .subsecImg:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(0, 55, 40, 0.7);
  z-index: 1;
}

:is(.popup-wrap, #content) .subsecImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.popup-wrap, #content) .subsecImg .subsecTitle {
  position: absolute;
  bottom: 0;
  right: clamp(5px, calc(1.311px + 0.984vw), 20px);
  color: var(--white);
  font-size: clamp(3.75rem, 1.752rem + 8.5246vw, 11.875rem);
  font-weight: 600;
  line-height: 0.7;
  text-align: right;
  z-index: 2;
}

:is(.popup-wrap, #content) .subsecImg.layer-title {
  aspect-ratio: auto;
  max-height: none;
  min-height: auto;
  border-radius: var(--border-radius-10) var(--border-radius-10) 0 0;
  overflow: hidden;
  margin-bottom: 0;
}

:is(.popup-wrap, #content) .subsecImg.layer-title~.highlight-box {
  border-radius: 0 0 var(--border-radius-10) var(--border-radius-10);
  padding: clamp(25px, calc(18.852px + 1.639vw), 50px);
}

:is(.popup-wrap, #content) .subsecImg.layer-title .subsecTitle {
  font-size: clamp(1.625rem, 1.2869rem + 1.4426vw, 3rem);
  width: 100%;
  /* max-width: var(--special-width); */
  right: auto;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 400;
  line-height: 1;
  color: var(--green1);
  padding-inline: calc(var(--page-content-horizontal-padding));
  text-align: left;
}

:is(.popup-wrap, #content) .subsecImg.layer-title .subsecTitle>div {
  max-width: var(--special-width);
  margin-inline: auto;
  position: relative;
  padding: clamp(10px, calc(5.082px + 1.311vw), 30px) clamp(25px, calc(18.852px + 1.639vw), 50px);
}

:is(.popup-wrap, #content) .subsecImg.layer-title .subsecTitle>div:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: linear-gradient(to right, var(--green5), var(--green4));
  opacity: 0.8;
  z-index: -1;
  border-radius: var(--border-radius-10) var(--border-radius-10) 0 0;
}

:is(.popup-wrap, #content) .subsecImg.with-border {
  border-top: 10px solid var(--green4);
  aspect-ratio: 1900 / 590;
  max-height: 590px;
  min-height: 280px;
}

:is(.popup-wrap, #content) .subsecImg.normal-content {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  min-height: clamp(250px, calc(188.525px + 16.393vw), 500px);
  width: 100%;
  aspect-ratio: auto;
  margin-block-end: 5em;
}

:is(.popup-wrap, #content) .subsecImg.normal-content:before {
  z-index: 2;
  border-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .subsecImg.normal-content img {
  /* position: absolute;
  top: 0;
  left: 0; */
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--border-radius-10);
  min-height: 0;
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  line-height: 1.8;
  height: 100%;
  padding: clamp(25px, calc(16.393px + 2.295vw), 60px) clamp(20px, calc(10.164px + 2.623vw), 60px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 3;
  color: var(--white);
  text-align: center;
  position: relative;
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content h3 {
  margin-top: 0;
  color: var(--green5);
  font-weight: 500;
  margin-bottom: 0.5em;
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content .btn-wrap {
  margin-top: 10px;
  width: 100%;
}

:is(.popup-wrap, #content) .subsecImg.normal-content .content .btn-wrap.absolute {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 50%);
}

:is(.popup-wrap, #content) .fullwidth.img-wrap {
  line-height: 0;
}

:is(.popup-wrap, #content) .fullwidth.img-wrap.with-padding {
  padding-inline: clamp(5px, calc(-1.148px + 1.639vw), 30px);
}

:is(.popup-wrap, #content) .fullwidth.img-wrap.with-padding+.flexbox.imgCols {
  margin-top: -3%;
  position: relative;
  z-index: 1;
}

:is(.popup-wrap, #content) .fullwidth.img-wrap img {
  width: 100%;
}

:is(.popup-wrap, #content) .fullwidth.img-wrap+.btn-wrap.mt-0 {
  margin-top: -7%;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec {
  display: grid;
  grid-template-columns: 1fr clamp(40px, calc(28.934px + 2.951vw), 85px) 1fr;
  grid-template-rows: clamp(40px, calc(28.934px + 2.951vw), 85px) 1fr clamp(40px, calc(28.934px + 2.951vw), 85px);
  margin-bottom: 3em;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.only-img {
  grid-template-rows: clamp(15px, calc(-0.984px + 4.262vw), 80px) 1fr clamp(15px, calc(-0.984px + 4.262vw), 80px);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec h2 {
  margin-bottom: 0.5em;
  line-height: 1.2;
  margin-top: 0;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec .desc, :is(.popup-wrap, #content) .fullwidth.highlight-sec .content>div {
  font-size: clamp(0.9375rem, 0.7377rem + 0.8525vw, 1.75rem);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec .desc>*:last-child, :is(.popup-wrap, #content) .fullwidth.highlight-sec .content>div>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec .content {
  background-image: linear-gradient(to right, var(--green5), var(--green4));
  grid-column: 2 / 4;
  grid-row: 2 / 4;
  z-index: 1;
  padding: clamp(40px, calc(27.705px + 3.279vw), 90px) clamp(20px, calc(0.328px + 5.246vw), 100px) clamp(40px, calc(27.705px + 3.279vw), 90px) clamp(50px, calc(22.951px + 7.213vw), 160px);
  border-bottom-left-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec .img {
  line-height: 0;
  grid-column: 1 / 3;
  grid-row: 1 / 3;
  z-index: 2;
  border-top-right-radius: var(--border-radius-10);
  border-bottom-right-radius: var(--border-radius-10);
  overflow: hidden;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.only-img .img {
  grid-column: 1 / 4;
  padding-inline-end: clamp(15px, calc(8.852px + 1.639vw), 40px);
  aspect-ratio: 1900 / 640;
  line-height: 0;
  max-height: 640px;
  min-height: 180px;
  position: relative;
  width: 100%;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.only-img .title {
  grid-column: 1 / 4;
  grid-row: 1 / 3;
  z-index: 3;
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 400;
  font-size: clamp(1.5rem, 0.916rem + 2.4918vw, 3.875rem);
  flex-direction: column;
  text-align: center;
  line-height: 1.2;
  padding-inline: var(--page-content-horizontal-padding);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.only-img .title span {
  display: block;
  font-weight: 600;
  font-size: clamp(1.75rem, 0.8893rem + 3.6721vw, 5.25rem);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.only-img .img:before {
  content: "";
  position: absolute;
  width: calc(100% - clamp(15px, calc(8.852px + 1.639vw), 40px));
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(0, 55, 40, 0.5);
  border-top-right-radius: var(--border-radius-10);
  border-bottom-right-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.only-img .img img {
  border-top-right-radius: var(--border-radius-10);
  border-bottom-right-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.quote .content>div {
  position: relative;
  height: 100%;
  padding-block: clamp(45px, calc(31.475px + 3.607vw), 100px);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.quote .content>div:before,
:is(.popup-wrap, #content) .fullwidth.highlight-sec.quote .content>div:after {
  content: "";
  position: absolute;
  width: clamp(55px, calc(36.557px + 4.918vw), 130px);
  aspect-ratio: 1/1;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.quote .content>div:before {
  left: 0;
  top: -7%;
  background-image: url(../images/icon-QuotationMarks-open-w.png);
}

:is(.popup-wrap, #content) .fullwidth.highlight-sec.quote .content>div:after {
  right: 0;
  bottom: -7%;
  background-image: url(../images/icon-QuotationMarks-close-w.png);
}

:is(.popup-wrap, #content) .fullwidth.with-outside-img {
  display: grid;
  grid-template-columns: calc(var(--page-inner-content-horizontal-padding) + var(--page-content-horizontal-padding)) 1fr 1fr calc(var(--page-inner-content-horizontal-padding) + var(--page-content-horizontal-padding));
  grid-template-rows: clamp(2.188rem, calc(1.419rem + 3.279vw), 5.313rem) 1fr clamp(2.188rem, calc(1.419rem + 3.279vw), 5.313rem);
}



:is(.popup-wrap, #content) .fullwidth.with-outside-img>div.highlight-box {
  grid-column: 2 / 4;
  grid-row: 1 / 4;
  z-index: 1;
  width: 100%;
  margin-bottom: 0;
}

:is(.popup-wrap, #content) .fullwidth.with-outside-img~.fixed-width-box {
  margin-block-start: 3em;
}

:is(.popup-wrap, #content) .fullwidth.with-outside-img>div.highlight-box>div {
  width: 50%;
  padding-inline-end: clamp(1.25rem, calc(0.097rem + 4.918vw), 5.938rem);
}

:is(.popup-wrap, #content) .fullwidth.with-outside-img>div.highlight-box>div>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .fullwidth.with-outside-img>div.outside-img {
  grid-column: 3 / 5;
  grid-row: 2 / 3;
  z-index: 2;
  line-height: 0;
  padding-inline-start: clamp(1.25rem, calc(0.097rem + 4.918vw), 5.938rem);
}

:is(.popup-wrap, #content) .fullwidth.with-outside-img>div.outside-img img {
  width: 100%;
  border-radius: var(--border-radius-10) 0 0 var(--border-radius-10);
}

:is(.popup-wrap, #content) .fullwidth.btm-img {
  /* -webkit-mask-image: linear-gradient(to top, black 15%, transparent 100%);
  mask-image: linear-gradient(to top, black 15%, transparent 100%); */
  line-height: 0;
  position: relative;
}

:is(.popup-wrap, #content) .fullwidth.btm-img::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
  background-color: var(--bluegreen2);
  opacity: 0.4;
}

:is(.popup-wrap, #content) .fullwidth.btm-img::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 2;
  background-image: linear-gradient(to bottom, var(--white), transparent);
}

:is(.popup-wrap, #content) .fullwidth.btm-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.popup-wrap, #content) .images-group {
  margin-bottom: 3em;
  max-width: var(--special-width);
  margin-inline: auto;
}

:is(.popup-wrap, #content) .images-group.w-100{
	max-width: 100%;
}

:is(.popup-wrap, #content) .images-group .image-item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-block-end: 4.5em;
  margin-block-start: 3em;
}

:is(.popup-wrap, #content) .images-group.w-100 .image-item{
	margin-block-start: 2em;
}

:is(.popup-wrap, #content) .images-group .image-item .img, :is(.popup-wrap, #content) .images-group.direction-reverse .image-item:nth-child(even) .img {
  z-index: 2;
  grid-column: 2 / 3;
  grid-row: 1;
  line-height: 0;
}

:is(.popup-wrap, #content) .images-group .image-item:nth-child(even) .img, :is(.popup-wrap, #content) .images-group.direction-reverse .image-item:nth-child(odd) .img {
  grid-column: 1 / 2;
}

:is(.popup-wrap, #content) .images-group .image-item .img img, :is(.popup-wrap, #content) .images-group.direction-reverse .image-item:nth-child(even) .img img {
  border-top-right-radius: var(--border-radius-10);
  border-bottom-right-radius: var(--border-radius-10);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

:is(.popup-wrap, #content) .images-group .image-item:nth-child(even) .img img, :is(.popup-wrap, #content) .images-group.direction-reverse .image-item:nth-child(odd) .img img {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: var(--border-radius-10);
  border-bottom-left-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .images-group .image-item .content, :is(.popup-wrap, #content) .images-group.direction-reverse .image-item:nth-child(even) .content {
  grid-column: 1 / 3;
  grid-row: 1;
  z-index: 2;
  width: calc(50% + clamp(40px, calc(28.934px + 2.951vw), 85px));
  background-color: rgba(62, 152, 145, 0.1);
  border-bottom-left-radius: var(--border-radius-10);
  padding: clamp(35px, calc(21.475px + 3.607vw), 90px) clamp(80px, calc(55.41px + 6.557vw), 180px) clamp(20px, calc(10.164px + 2.623vw), 60px) clamp(25px, calc(13.934px + 2.951vw), 70px);
  position: relative;
  justify-self: flex-start;
}

:is(.popup-wrap, #content) .images-group.w-100 .image-item .content, :is(.popup-wrap, #content) .images-group.w-100.direction-reverse .image-item:nth-child(even) .content {
	border-top-left-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .images-group .image-item:nth-child(even) .content, :is(.popup-wrap, #content) .images-group.direction-reverse .image-item:nth-child(odd) .content {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: var(--border-radius-10);
  justify-self: flex-end;
  padding: clamp(35px, calc(21.475px + 3.607vw), 90px) clamp(25px, calc(13.934px + 2.951vw), 70px) clamp(20px, calc(10.164px + 2.623vw), 60px) clamp(80px, calc(60.328px + 5.246vw), 160px);
}

:is(.popup-wrap, #content) .images-group.w-100 .image-item:nth-child(even) .content, :is(.popup-wrap, #content) .images-group.direction-reverse.w-100 .image-item:nth-child(odd) .content {
	border-top-right-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .images-group .image-item .content .title {
  position: absolute;
  border-radius: var(--border-radius-10);
  background-image: linear-gradient(to right, var(--green4), var(--green5));
  font-weight: 500;
  color: var(--green1);
  font-size: clamp(1rem, 0.7541rem + 1.0492vw, 2rem);
  text-align: center;
  width: auto;
  max-width: 90%;
  padding: clamp(10px, calc(7.541px + 0.656vw), 20px) clamp(15px, calc(11.311px + 0.984vw), 30px);
  line-height: 1.2;
  left: calc(-1 * var(--page-content-horizontal-padding));
  top: 0;
  transform: translateY(-50%);
}

:is(.popup-wrap, #content) .images-group .image-item:nth-child(even) .title {
  left: auto;
  right: calc(-1 * var(--page-content-horizontal-padding));
}

:is(.popup-wrap, #content) .images-group .image-item .content>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .images-group .image-item .content ul {
  line-height: 1.5;
}

:is(.popup-wrap, #content) .images-group .image-item .content ul>li::before {
  top: 0.5em;
}

:is(.popup-wrap, #content) .accordion-wrap.milestone {
  width: calc(100% + var(--page-inner-content-horizontal-padding) * 2);
  margin-left: calc(-1 * var(--page-inner-content-horizontal-padding));
  position: relative;
}

:is(.popup-wrap, #content) .accordion-wrap.milestone .accordion-item:not(:last-child) {
  margin-block-end: clamp(30px, calc(20.164px + 2.623vw), 70px);
}

:is(.popup-wrap, #content) .accordion-wrap.milestone .accordion-item .accordion-title {
  max-width: 420px;
  margin-inline: auto;
  border-radius: var(--border-radius-10);
  background-image: linear-gradient(to right, var(--green2), var(--green3));
  color: var(--white);
  font-size: clamp(1.25rem, 0.9426rem + 1.3115vw, 2.5rem);
  font-weight: 400;
  background-size: 100% 100%;
  padding-inline-end: clamp(40px, calc(30.164px + 2.623vw), 80px);
}

:is(.popup-wrap, #content) .accordion-wrap.milestone .accordion-item .accordion-title:not(.btnOnly):after {
  display: none;
}

:is(.popup-wrap, #content) .accordion-wrap.milestone .accordion-item .accordion-content .accordion-main {
  padding: 0 !important;
}

:is(.popup-wrap, #content) .accordion-wrap.milestone .accordion-item .accordion-content {
  background-color: transparent;
}

:is(.popup-wrap, #content) .accordion-wrap.milestone .accordion-item:last-child {
  margin-bottom: 0;
}

:is(.popup-wrap, #content) .timeline-wrap {
  position: relative;
  padding-block-start: clamp(30px, calc(20.164px + 2.623vw), 70px);
  display: flex;
  flex-direction: column;
}

:is(.popup-wrap, #content) .accordion-wrap.milestone:before {
  content: "";
  position: absolute;
  width: 4px;
  height: 100%;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  background-color: var(--grey1);
  opacity: 0.2;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:not(:first-child) {
  margin-block-start: calc(-1 * clamp(20px, calc(17.541px + 0.656vw), 30px));
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item {
  width: calc(50% - clamp(20px, calc(15.082px + 1.311vw), 40px));
  display: grid;
  grid-template-columns: 1fr clamp(90px, calc(80.164px + 2.623vw), 130px);
  grid-template-areas: "content year";
  position: relative;
  opacity: 0;
  transition: opacity 0.3s ease-out 0s, transform 0.4s ease-out 0s;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:before {
  content: "";
  width: clamp(17px, calc(12.574px + 1.18vw), 35px);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: var(--green2);
  display: block;
  position: absolute;
  right: calc(-1 * clamp(20px, calc(15.082px + 1.311vw), 40px));
  top: 0;
  transform: translate(50%, -50%);
  border: clamp(2px, calc(1.508px + 0.131vw), 4px) solid var(--green5);
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:nth-child(even) {
  align-self: flex-end;
  grid-template-columns: clamp(90px, calc(80.164px + 2.623vw), 130px) 1fr;
  grid-template-areas: "year content";
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:nth-child(even):before {
  left: calc(-1 * clamp(20px, calc(15.082px + 1.311vw), 40px));
  right: auto;
  transform: translate(-50%, -50%);
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-year {
  grid-area: year;
  font-size: clamp(1.125rem, 0.8484rem + 1.1803vw, 2.25rem);
  font-weight: 500;
  color: var(--green1);
  line-height: 1;
  text-align: center;
  background-color: var(--tablecolor2);
  padding: clamp(10px, calc(7.541px + 0.656vw), 20px) 0;
  position: relative;
  border-radius: 0 0 var(--border-radius-10) 0;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-year:before {
  content: '';
  width: 13px;
  aspect-ratio: 1 / 1;
  display: block;
  position: absolute;
  right: -13px;
  top: 0;
  background-color: var(--tablecolor2);
  clip-path: polygon(0% 0%, 100% 0%, 0% 100%);
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:nth-child(even) .timeline-year {
  border-radius: 0 0 0 var(--border-radius-10);
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:nth-child(even) .timeline-year:before {
  right: auto;
  left: -12px;
  clip-path: polygon(100% 100%, 100% 0, 0 0);
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content {
  grid-area: content;
  font-size: clamp(0.875rem, 0.752rem + 0.5246vw, 1.375rem);
  background-color: rgba(62, 152, 145, 0.1);
  padding: clamp(10px, calc(7.541px + 0.656vw), 20px) clamp(15px, calc(11.311px + 0.984vw), 30px);
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  width: 100%;
  border-radius: var(--border-radius-10) 0 0 var(--border-radius-10);
  container-type: inline-size;
  container-name: layout-container;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item:nth-child(even) .timeline-content {
  border-radius: 0 var(--border-radius-10) var(--border-radius-10) 0;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content .timeline-desc {
  flex: 1 1 0%;
  min-width: 240px;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content .timeline-desc>*:last-child {
  margin-bottom: 0 !important;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content .timeline-img {
  flex: 0 0 max-content;
  max-width: 70%;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content .timeline-img a {
  /* display: block; */

}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content .timeline-img img {
  max-width: 240px;
  max-height: 180px;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: 0 0;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content.breakLine .timeline-desc {
  flex: 0 0 100%;
}

:is(.popup-wrap, #content) .timeline-wrap .timeline-item .timeline-content.breakLine .timeline-img {
  flex: 0 0 100%;
  max-width: 100%;
}

:is(.popup-wrap, #content) .event-list {
  position: relative;
}

:is(.popup-wrap, #content) .event-list a {
  display: flex;
  padding: clamp(15px, calc(11.311px + 0.984vw), 30px);
  position: relative;
  gap: clamp(15px, calc(11.311px + 0.984vw), 30px);
  transition: padding-inline-start 0.3s ease 0s;
  margin-block-end: 1em;
}

:is(.popup-wrap, #content) .event-title-wrap {
  display: flex;
  gap: clamp(15px, calc(11.311px + 0.984vw), 30px);
  align-items: center;
  margin-block-end: 1em;
}

:is(.popup-wrap, #content) .event-list a:is(:hover, :focus-visible) {
  padding-inline-start: 0;
}

:is(.popup-wrap, #content) .event-list a>* {
  position: relative;
  z-index: 2;
}

:is(.popup-wrap, #content) .event-list a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  right: 0;
  top: 0;
  background-color: rgba(62, 152, 145, 0.1);
  border-radius: var(--border-radius-10);
  transition: width 0.3s ease 0s, background-color 0.3s ease 0s;
}

:is(.popup-wrap, #content) .event-list a:is(:hover, :focus-visible):before {
  width: calc(100% - clamp(15px, calc(11.311px + 0.984vw), 30px) * 2);
  background-color: rgba(62, 152, 145, 0.3);
}

:is(.popup-wrap, #content) .event-list a>.date,
:is(.popup-wrap, #content) .event-title-wrap .date {
  flex: 0 0 120px;
  display: grid;
  font-weight: 400;
  grid-template-columns: 1fr;
  grid-template-areas: "day-month" "year";
  text-align: center;
  align-self: flex-start;
  align-items: baseline;
  border-radius: var(--border-radius-10);
  overflow: hidden;
  column-gap: 4px;
  position: relative;
}

:is(.popup-wrap, #content) .event-list a>.date::before,
:is(.popup-wrap, #content) .event-title-wrap .date:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to right, var(--green5), var(--green4));
  opacity: 0.5;
  z-index: 0;
  transition: opacity 0.3s ease 0s;
}

:is(.popup-wrap, #content) .event-title-wrap .date:before {
  opacity: 1;
}

:is(.popup-wrap, #content) .event-list a>.date .day-month,
:is(.popup-wrap, #content) .event-title-wrap .date .day-month {
  grid-area: day-month;
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 4px;
  position: relative;
  z-index: 2;
}

:is(.popup-wrap, #content) .event-list a>.date .day,
:is(.popup-wrap, #content) .event-title-wrap .date .day {
  font-size: clamp(1.5rem, 1.1311rem + 1.5738vw, 3rem);
  line-height: 1;
  color: var(--green1);
  padding-block: clamp(10px, calc(7.541px + 0.656vw), 20px);
}

:is(.popup-wrap, #content) .event-list a>.date .month,
:is(.popup-wrap, #content) .event-title-wrap .date .month {
  grid-area: day-month;
  font-size: clamp(0.9375rem, 0.7377rem + 0.8525vw, 1.75rem);
  line-height: 1;
  color: var(--green1);
}

:is(.popup-wrap, #content) .event-list a>.date .year,
:is(.popup-wrap, #content) .event-title-wrap .date .year {
  grid-area: year;
  font-size: clamp(0.9375rem, 0.8299rem + 0.459vw, 1.375rem);
  color: var(--white);
  background-color: var(--green1);
  width: 100%;
  position: relative;
  z-index: 2;
  opacity: 0.8;
  transition: opacity 0.3s ease 0s;
}

:is(.popup-wrap, #content) .event-title-wrap .date .year {
  opacity: 1;
}

:is(.popup-wrap, #content) .event-list a:is(:hover, :focus-visible)>.date::before,
:is(.popup-wrap, #content) .event-list a:is(:hover, :focus-visible)>.date .year {
  opacity: 1;
}

:is(.popup-wrap, #content) .event-list a>.img {
  flex: 0 0 25%;
  max-width: 290px;
  line-height: 0;
  aspect-ratio: 290 / 180;
  position: relative;
}

:is(.popup-wrap, #content) .event-list a>.img>span.pin {
  display: block;
  position: absolute;
  width: clamp(26px, calc(22.557px + 0.918vw), 40px);
  aspect-ratio: 1/1;
  right: calc(-1 * clamp(5px, calc(3.77px + 0.328vw), 10px));
  top: calc(-1 * clamp(5px, calc(3.77px + 0.328vw), 10px));
  background-color: var(--red1);
  border-radius: 50%;
}

:is(.popup-wrap, #content) .event-list a>.img>span.pin:after {
  content: "";
  display: block;
  position: absolute;
  width: 55%;
  aspect-ratio: 1 / 1;
  left: 50%;
  top: 50%;
  background: url(../images/icon-highlight-pdf.svg) no-repeat center center;
  background-size: contain;
  opacity: 1;
  transform: translate(-50%, -50%);
}

:is(.popup-wrap, #content) .event-list a>.img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) .event-list a>.info {
  flex: 1 1 auto;
}

:is(.popup-wrap, #content) .event-list a>.info>div {
  width: calc(100% - clamp(15px, calc(11.311px + 0.984vw), 30px));
  transition: width 0.3s ease 0s;
}

:is(.popup-wrap, #content) .event-list a:is(:hover, :focus-visible)>.info>div {
  width: calc(100% - clamp(15px, calc(11.311px + 0.984vw), 30px) - clamp(15px, calc(11.311px + 0.984vw), 30px));
}

:is(.popup-wrap, #content) .event-list a>.info .title {
  font-weight: 400;
  font-size: clamp(0.9375rem, 0.6762rem + 1.1148vw, 2rem);
  /* box-shadow: inset -100% 0 0 0 transparent;
  background-image: linear-gradient(to top, var(--black) 2px, transparent 2px);
  background-repeat: no-repeat;
  background-size: 0% 100%;
  background-position: left 100%;
  transition: background-size 0.3s cubic-bezier(0.25, 1, 0.5, 1); */
  line-height: 1.2;
  margin-block-end: 0.5em;
}

/* :is(.popup-wrap, #content) .event-list a:is(:hover, :focus-visible)>.info .title {
  background-size: 100% 100%;
} */

:is(.popup-wrap, #content) .event-list a>.info .desc {
  font-size: clamp(0.75rem, 0.5963rem + 0.6557vw, 1.375rem);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

:is(.popup-wrap, #content) .event-gallery {
  margin-bottom: 1.5em;
}

:is(.popup-wrap, #content) .event-gallery .swiper-wrapper {
  max-height: 850px;
}

:is(.popup-wrap, #content) .event-gallery div.swiper-slide {
  line-height: 0;
  height: auto;
  aspect-ratio: 1660 / 850;
}

:is(.popup-wrap, #content) .event-gallery div.swiper-slide a {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 0;
  background-image: none;
  border-radius: var(--border-radius-10);
  overflow: hidden;
  background-color: rgba(140, 151, 143, 0.5);
}

:is(.popup-wrap, #content) .event-gallery div.swiper-slide a img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-pagination {
  bottom: clamp(15px, calc(11.962px + 0.949vw), 30px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(5px, calc(3.987px + 0.316vw), 10px);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-pagination>span.swiper-pagination-bullet {
  margin: 0;
  top: 0;
  left: 0;
  display: block;
  width: clamp(8px, calc(6.582px + 0.443vw), 15px);
  aspect-ratio: 1 / 1;
  height: auto;
  border: 2px solid var(--white);
  opacity: 1;
  background-color: transparent;
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5));
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-pagination>span.swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--white);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) :is(.swiper-button-next, .swiper-button-prev) {
  color: var(--white);
  border-radius: 50%;
  width: clamp(36px, calc(29.114px + 2.152vw), 70px);
  height: clamp(36px, calc(29.114px + 2.152vw), 70px);
  transition: all 0.3s ease;
  overflow: hidden;
  z-index: 10;
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) :is(.swiper-button-next, .swiper-button-prev):after {
  content: '';
  position: absolute;
  top: 1px;
  left: 1px;
  border-radius: 50%;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  z-index: -2;
  background-color: rgba(0, 0, 0, 0.7);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) :is(.swiper-button-next, .swiper-button-prev)::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  background-color: var(--bluegreen2);
  transform: scaleX(0);
  z-index: -1;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-button-next::before {
  transform-origin: left center;
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-button-prev::before {
  transform-origin: right center;
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) :is(.swiper-button-next, .swiper-button-prev):hover::before {
  transform: scaleX(1);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) :is(.swiper-button-next, .swiper-button-prev):hover {
  color: var(--white);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) :is(.swiper-button-next, .swiper-button-prev) .swiper-navigation-icon {
  width: 35%;
  height: 35%;
  transition: margin 0.3s ease 0s;
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-button-next {
  right: clamp(10px, calc(7.541px + 0.656vw), 20px);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-button-next:is(:hover, :focus-visible) .swiper-navigation-icon {
  margin-left: 10px;
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-button-prev {
  left: clamp(10px, calc(7.541px + 0.656vw), 20px);
}

:is(.popup-wrap, #content) :is(.event-gallery, .card-gallery) .swiper-button-prev:is(:hover, :focus-visible) .swiper-navigation-icon {
  margin-right: 10px;
}

:is(.popup-wrap, #content) .event-gallery .control-btn {
  position: absolute;
  bottom: clamp(15px, calc(11.962px + 0.949vw), 30px);
  right: clamp(15px, calc(11.962px + 0.949vw), 30px);
}

:is(.popup-wrap, #content) .event-gallery .btn-play {
  display: inline-block;
  position: relative;
  text-indent: -9999px;
  width: 35px;
  height: 34px;
  z-index: 10;
  transform: translate(40%, 40%);
  transition: background-color 0.3s ease 0s;
}

:is(.popup-wrap, #content) .event-gallery .btn-play:hover {}

:is(.popup-wrap, #content) .event-gallery .btn-play:before {
  left: 12px;
}

:is(.popup-wrap, #content) .event-gallery .btn-play:after {
  right: 12px;
}

:is(.popup-wrap, #content) .event-gallery .btn-play:before,
:is(.popup-wrap, #content) .event-gallery .btn-play:after {
  position: absolute;
  width: 3px;
  height: 14px;
  background-color: #fff;
  content: "";
  top: 50%;
  transform: translateY(-50%);
  /*transition: background-color .3s ease 0s;*/
}

:is(.popup-wrap, #content) .event-gallery .btn-play.stop:before {
  content: "";
  border-bottom: 7px solid transparent;
  border-left: 10px solid #fff;
  border-top: 7px solid transparent;
  background: none;
  border-radius: 0;
  height: 0;
  top: 50%;
  left: 50%;
  width: 0;
  transform: translate(-50%, -50%);
}

:is(.popup-wrap, #content) .event-gallery .btn-play.stop:hover:before,
:is(.popup-wrap, #content) .event-gallery .btn-play.stop:focus:before {
  border-bottom: 7px solid transparent;
  border-left: 10px solid #fff;
  border-top: 7px solid transparent;
}

:is(.popup-wrap, #content) .event-gallery .btn-play.stop::after {
  display: none;
}

.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
  border-color: var(--bluegreen2) !important;
}

:is(.popup-wrap, #content) .marquee-wrap {
  overflow: hidden;
  margin-top: 5em;
}

:is(.popup-wrap, #content) .marquee-inner {
  display: flex;
  gap: clamp(15px, calc(6.393px + 2.295vw), 50px);
}

:is(.popup-wrap, #content) .marquee-inner div {
  width: auto;
  flex-shrink: 0;
}

:is(.popup-wrap, #content) .marquee-inner div img {
  border-radius: var(--border-radius-10);
  width: clamp(calc(var(--w) * 0.5px),
      calc((var(--w) * 0.0331vw) + (var(--w) * 0.371px)),
      calc(var(--w) * 1px));
}

:is(.popup-wrap, #content) .marquee-inner div:nth-child(7n+1) {
  padding-block-start: clamp(45px, calc(33.934px + 2.951vw), 90px);
}

:is(.popup-wrap, #content) .marquee-inner div:nth-child(7n+2) {
  padding-block-start: clamp(200px, calc(150.82px + 13.115vw), 400px);
}

:is(.popup-wrap, #content) .marquee-inner div:nth-child(7n+4) {
  padding-block-start: clamp(135px, calc(101.803px + 8.852vw), 270px);
}

:is(.popup-wrap, #content) .marquee-inner div:nth-child(7n+5) {
  padding-block-start: clamp(30px, calc(22.623px + 1.967vw), 60px);
}

:is(.popup-wrap, #content) .marquee-inner div:nth-child(7n+6) {
  padding-block-start: clamp(185px, calc(139.508px + 12.131vw), 370px);
}

:is(.popup-wrap, #content) .marquee-inner div:nth-child(7n) {
  padding-block-start: clamp(120px, calc(89.262px + 8.197vw), 245px);
}

:is(.popup-wrap, #content) .sticky-section {
  width: calc(100% + var(--page-inner-content-horizontal-padding) * 2);
  margin-left: calc(-1 * var(--page-inner-content-horizontal-padding));
  grid-template-columns: clamp(280px, calc(260.328px + 5.246vw), 360px) 1fr;
  gap: 0 !important;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item {
  padding-block: 70px;
  position: sticky;
  top: 0;
  left: 0;
  align-self: flex-start;
  font-size: clamp(1rem, 0.9385rem + 0.2623vw, 1.25rem);
  font-weight: 400;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item ul,
:is(.popup-wrap, #content) .sticky-section .sticky-item li {
  padding: 0;
  margin: 0;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li:before {
  display: none;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li:not(:last-child) {
  margin-block-end: 2px;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li a {
  display: block;
  background-image: none;
  position: relative;
  overflow: hidden;
  padding: clamp(5px, calc(2.541px + 0.656vw), 15px) clamp(10px, calc(7.541px + 0.656vw), 20px) clamp(5px, calc(2.541px + 0.656vw), 15px) clamp(20px, calc(15.082px + 1.311vw), 40px);
  color: var(--green2);
  border-radius: var(--border-radius-10) 0 0 var(--border-radius-10);
  z-index: 1;
  line-height: 1.3;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li a::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: -100%;
  top: 0;
  background-image: linear-gradient(to right, var(--green4), var(--green5));
  transition: left 0.3s ease 0s;
  z-index: -1;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li.selected a,
:is(.popup-wrap, #content) .sticky-section .sticky-item li a:is(:hover, :focus-visible) {
  color: var(--green1);
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li.selected a::after,
:is(.popup-wrap, #content) .sticky-section .sticky-item li a:is(:hover, :focus-visible)::after {
  left: 0;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li.selected a:before,
:is(.popup-wrap, #content) .sticky-section .sticky-item li a:is(:hover, :focus-visible):before {
  background-color: var(--white);
  opacity: 1;
}

:is(.popup-wrap, #content) .sticky-section .sticky-item li a:before {
  content: '';
  width: clamp(6px, calc(4.525px + 0.393vw), 12px);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  position: absolute;
  left: clamp(10px, calc(7.541px + 0.656vw), 20px);
  top: 50%;
  transform: translateY(-50%);
  background-color: var(--grey1);
  opacity: 0.5;
  transition: background-color 0.3s ease 0s, opacity 0.3s ease 0s;
  z-index: 2;
}

:is(.popup-wrap, #content) .sticky-section .content {
  padding: clamp(25px, calc(11.475px + 3.607vw), 80px);
  padding-inline-end: clamp(0px, calc(-36.98px + 3.525vw), 30px);
  position: relative;
  z-index: 1;
}

:is(.popup-wrap, #content) .sticky-section .content:before {
  content: '';
  position: absolute;
  width: calc(100% + var(--page-content-horizontal-padding));
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(62, 152, 145, 0.1);
  border-radius: var(--border-radius-10) 0 0 var(--border-radius-10);
  z-index: -1;
}

:is(.popup-wrap, #content) .sticky-section .content>div:first-child>*:first-child {
  margin-block-start: 0;
}

:is(.popup-wrap, #content) .imgTxtBlk .imgTxtItem :is(.f-right-img, .f-left-img)+* {
  margin-block-start: 0;
}

:is(.popup-wrap, #content) .sticky-section .trigger-btn a {
  display: block;
  background-image: none;
  position: relative;
  overflow: hidden;
  padding: clamp(10px, calc(4.436px + 1.484vw), 20px) clamp(15px, calc(6.654px + 2.226vw), 30px);
  color: var(--green1);
  border-radius: var(--border-radius-5) 0 0 var(--border-radius-5);
  background-image: linear-gradient(to right, var(--green4), var(--green5));
  background-size: 100% 100%;
  z-index: 1;
  line-height: 1.3;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

:is(.popup-wrap, #content) .sticky-section .trigger-btn a>span.icon {
  display: block;
  width: 25px;
  aspect-ratio: 1 / 1;
  background-color: var(--green1);
}


:is(.popup-wrap, #content) .keyframe-container {
  position: relative;
  /* height: 2100px; */
  padding-inline: clamp(15px, calc(1.475px + 3.607vw), 70px);
  /* padding-block: clamp(20px, calc(7.705px + 3.279vw), 70px) clamp(60px, calc(45.246px + 3.934vw), 120px); */
  padding-block: clamp(20px, calc(7.705px + 3.279vw), 70px) clamp(35px, calc(26.393px + 2.295vw), 70px);
  margin-bottom: 5em;
  /* height: clamp(600px, calc(476.471px + 11.765vw), 700px); */
  background-image: linear-gradient(to right, var(--green5), var(--green4));
  display: grid;
  grid-template-columns: min(25%, 420px) 1fr;
  column-gap: 20px;
  /* max-height: 680px; */
}

:is(.popup-wrap, #content) .keyframe-container .keyframe-deco {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  font-weight: 600;
  font-size: clamp(5rem, 1.7725rem + 13.7705vw, 18.125rem);
  color: var(--white);
  opacity: 0.2;
  line-height: 0.7;
  white-space: nowrap;
}

:is(.popup-wrap, #content) .keyframe-container .small-title {
  font-size: clamp(0.9375rem, 0.707rem + 0.9836vw, 1.875rem);
  font-weight: 400;
  color: var(--green1);
  margin-block-end: 0.5em;
  line-height: 1.2;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe-year-list {
  font-size: clamp(1.9375rem, 1.1844rem + 3.2131vw, 5rem);
  font-weight: 600;
  line-height: 0.75;
  color: var(--white);
  filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.2));
}

:is(.popup-wrap, #content) .keyframe-container .keyframe-year-list>div {
  position: relative;
  margin-block-end: 25px;
  transition: color 0.3s ease 0s;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe-year-list>div:before {
  content: '';
  position: absolute;
  width: calc(clamp(15px, calc(1.475px + 3.607vw), 70px) - 8px);
  height: 8px;
  left: calc(-1 * clamp(15px, calc(1.475px + 3.607vw), 70px));
  bottom: 0;
  background-image: linear-gradient(to right, var(--green2), var(--green3));
  border-radius: 0 var(--border-radius-10) var(--border-radius-10) 0;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

:is(.popup-wrap, #content) .keyframe-container .keyframe-year-list>div.active:before {
  transform: scaleX(1);
}

:is(.popup-wrap, #content) .keyframe-container .keyframe-year-list>div.active {
  color: var(--green1);
  filter: none;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe {
  /* position: sticky;
  top: 100px; */
  height: 100%;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content {
  width: 100%;
  height: 100%;
  display: flex;
  gap: clamp(25px, calc(-5.882px + 2.941vw), 50px);

  align-items: stretch;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel {
  flex: 1 1 0;
  position: relative;

  display: flex;
  flex-direction: column;
  cursor: default;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel.active {
  cursor: pointer;
}

#keyframe-detail-wrap {
  max-width: 720px;
}

#keyframe-detail-wrap .k-img {
  line-height: 0;
  max-width: 560px;
  margin-inline: auto;
  margin-block-end: 1em;
}

#keyframe-detail-wrap article header>div .date {
  color: var(--green1);
  font-weight: 400;
}

#keyframe-detail-wrap article .modal-content .modal-scroll-content .title {
	margin-top: 0;
  font-size: clamp(1rem, 0.877rem + 0.5246vw, 1.5rem);
  font-weight: 400;
  color: var(--green1);
  margin-bottom: 0.5em;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel .year {
  display: none;
  font-size: clamp(1.9375rem, 1.1844rem + 3.2131vw, 5rem);
  font-weight: 600;
  line-height: 1;
  margin-block-end: 0.3em;
  color: var(--white);
  filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.2));
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel.swiper-slide-active .year {
  color: var(--green1);
  filter: none;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel .img {
  --layer-opacity: 0.5;
  width: 100%;
  /* border-radius: var(--border-radius-10); */
  border-radius: 8px;
  overflow: hidden;

  /* aspect-ratio: 560 / 352; */

  position: relative;

  /* flex-grow: 1; */
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel .img::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: var(--green1);
  opacity: var(--layer-opacity);
  pointer-events: none;
  z-index: 1;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel-content {
  position: relative;
  width: 100%;
  text-align: left;
  padding: clamp(10px, calc(7.541px + 0.656vw), 20px) clamp(5px, calc(3.77px + 0.328vw), 10px);

  /* flex-shrink: 0; */
  color: var(--green1);
  line-height: 1.2;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel-content div {
  font-size: clamp(0.9375rem, 0.7684rem + 0.7213vw, 1.625rem);
  font-weight: 600;
  margin-bottom: 0;

}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel-content div span {
  font-weight: 400;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: calc(1.2em * 4);
}

/* 初始 211 */
:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel-1 {
  flex-grow: 2;
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel-1 img {
  transform: scale(1.08);
}

:is(.popup-wrap, #content) .keyframe-container .keyframe .content .panel-1 .panel-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}


:is(.popup-wrap, #content) #campus-container {
  position: relative;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content {
  position: sticky;
  z-index: 5;
  width: 100%;
  height: 100dvh;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: clamp(50px, calc(37.705px + 3.279vw), 100px) clamp(40px, calc(30.164px + 2.623vw), 80px);
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box {
  width: 100%;
  max-width: 900px;
  display: grid;
  grid-template-columns: 1fr;
  max-height: 70dvh;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div {
  padding: clamp(40px, calc(27.705px + 3.279vw), 90px) clamp(25px, calc(9.016px + 4.262vw), 90px);
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div p {
  position: relative;
  z-index: 2;
  font-size: clamp(0.9375rem, 0.7377rem + 0.8525vw, 1.75rem);
  margin-block-end: 0;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div>.box-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: -1;
  opacity: 0.95;
  border-radius: var(--border-radius-10);
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box .split-lines-wrapper {
  overflow: hidden;
  display: block;
  width: 100%;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box .split-lines-inner {
  display: inline-block;
  will-change: transform, opacity;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-1 {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  z-index: 1;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-1>.box-bg {
  background-image: linear-gradient(to right, rgba(213, 228, 154, 0.95), rgba(118, 192, 125, 0.95));
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-1>.box-bg:before {
  content: '';
  position: absolute;
  width: clamp(60px, calc(45.246px + 3.934vw), 120px);
  aspect-ratio: 1 / 1;
  left: calc(-1 * clamp(15px, calc(11.311px + 0.984vw), 30px));
  top: clamp(10px, calc(5.082px + 1.311vw), 30px);
  background: url(../images/icon-QuotationMarks-open-about.png) 0 0 no-repeat;
  background-size: contain;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-2 {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  z-index: 2;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-2>.box-bg {
  background-image: linear-gradient(to right, rgba(80, 161, 109, 0.95), rgba(53, 94, 59, 0.95));
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-2>.box-bg:before {
  content: '';
  position: absolute;
  width: clamp(60px, calc(45.246px + 3.934vw), 120px);
  aspect-ratio: 1 / 1;
  right: calc(-1 * clamp(15px, calc(11.311px + 0.984vw), 30px));
  bottom: clamp(10px, calc(5.082px + 1.311vw), 30px);
  background: url(../images/icon-QuotationMarks-close-about.png) 100% 100% no-repeat;
  background-size: contain;
}

:is(.popup-wrap, #content) #campus-container .campus-main-content .box>div.text-2 p {
  color: var(--white);
}

:is(.popup-wrap, #content) #campus-container .campus-gallery {
  margin-top: 0;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item {
  display: flex;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item#g-item-2 .big-img {
  order: 2;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item#g-item-2 .scroll-img {
  order: 1;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .big-img {
  flex: 0 0 50%;
  position: sticky;
  top: 0;
  display: grid;
  grid-template-columns: 1fr;
  height: 100dvh;
  grid-template-rows: 100%;
  overflow: hidden;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .big-img>div {
  line-height: 0;
  width: 100%;
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  height: 100%;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .big-img>div img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 var(--border-radius-10) var(--border-radius-10) 0;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item#g-item-2 .big-img>div img {
  border-radius: var(--border-radius-10) 0 0 var(--border-radius-10);
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .big-img>div:first-child {
  z-index: 1;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .big-img>div:last-child {
  z-index: 2;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img {
  flex: 0 0 50%;
  padding-top: 25em;
  /* padding-bottom: 15em; */
  display: flex;
  flex-direction: column;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img div {
  line-height: 0;
  overflow: hidden;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img div img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img #g-1-4 {
  align-self: flex-end;
  width: 45%;
  max-width: 350px;
  border-radius: var(--border-radius-10) 0 0 var(--border-radius-10);
  aspect-ratio: 700 / 880;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img #g-1-3 {
  align-self: center;
  width: 30%;
  max-width: 250px;
  border-radius: var(--border-radius-10);
  margin-right: clamp(50px, calc(38.934px + 2.951vw), 95px);
  margin-top: clamp(50px, calc(37.705px + 3.279vw), 100px);
  z-index: 6;
  aspect-ratio: 500 / 630;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img #g-1-5 {
  align-self: center;
  width: 39%;
  max-width: 300px;
  border-radius: var(--border-radius-10);
  margin-top: clamp(140px, calc(105.574px + 9.18vw), 280px);
  margin-left: clamp(50px, calc(32.787px + 4.59vw), 120px);
  aspect-ratio: 600 / 756;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img #g-2-4 {
  width: 45%;
  max-width: 350px;
  border-radius: 0 var(--border-radius-10) var(--border-radius-10) 0;
  aspect-ratio: 700 / 880;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img #g-2-3 {
  align-self: center;
  width: 30%;
  max-width: 250px;
  border-radius: var(--border-radius-10);
  margin-left: clamp(50px, calc(38.934px + 2.951vw), 95px);
  margin-top: clamp(50px, calc(37.705px + 3.279vw), 100px);
  z-index: 6;
  aspect-ratio: 500 / 630;
}

:is(.popup-wrap, #content) #campus-container .campus-gallery-item .scroll-img #g-2-5 {
  align-self: center;
  width: 39%;
  max-width: 300px;
  border-radius: var(--border-radius-10);
  margin-top: clamp(140px, calc(105.574px + 9.18vw), 280px);
  margin-right: clamp(50px, calc(32.787px + 4.59vw), 120px);
  aspect-ratio: 600 / 756;
}

:is(.popup-wrap, #content) .img-zone {
  margin-block-end: 2.5em;
}

:is(.popup-wrap, #content) .img-zone:has(+ h3) {
  margin-block: 2.5em;
}


:is(.popup-wrap, #content) iframe{
	max-width: 100%;
}

:is(.popup-wrap, #content) .core-bubble {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(15px, calc(8.852px + 1.639vw), 40px);
  justify-content: center;
  align-items: center;
  margin-block-end: 5em;
}

:is(.popup-wrap, #content) .core-bubble .c-item {
  overflow: hidden;
  border-radius: 50%;
  width: clamp(180px, calc(165.246px + 3.934vw), 240px);
  aspect-ratio: 1 / 1;
  position: relative;
  padding: clamp(5px, calc(3.77px + 0.328vw), 10px);
}

:is(.popup-wrap, #content) .core-bubble .c-item:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-image: linear-gradient(to bottom, var(--green5), var(--green4));
}

:is(.popup-wrap, #content) .core-bubble .c-item>div {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  border-radius: 50%;
  padding: clamp(5px, calc(0.217px + 1.276vw), 10px);
  background-color: var(--white);
}

:is(.popup-wrap, #content) .core-bubble .c-item span.bg {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 0;
  position: absolute;
  top: 0;
  left: 0;
}

:is(.popup-wrap, #content) .core-bubble .c-item span.bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(.popup-wrap, #content) .core-bubble .c-item span.txt {
  position: relative;
  z-index: 1;
  font-size: clamp(1.25rem, 1.127rem + 0.5246vw, 1.75rem);
  font-weight: 400;
  line-height: 1.1;
  text-align: center;
}

:is(.popup-wrap, #content) .pagination {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-block-start: 5em;
}

:is(.popup-wrap, #content) .pagination :is(a, span) {
  display: flex;
  width: clamp(35px, calc(31.311px + 0.984vw), 50px);
  aspect-ratio: 1 / 1;
  border-radius: var(--border-radius-5);
  border: 1px solid rgba(53, 94, 59, 0.5);
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: var(--green1);
  transition: color 0.3s ease 0s, border-color 0.3s ease 0s, background-color 0.3s ease 0s;
  font-size: clamp(0.875rem, 0.7828rem + 0.3934vw, 1.25rem);
}

:is(.popup-wrap, #content) .pagination span {
  border: none;
  width: auto;
  aspect-ratio: auto;
}

:is(.popup-wrap, #content) .pagination a:is(:hover, :focus-visible, .selected) {
  color: var(--white);
  border-color: var(--green2);
  background-color: var(--green2);
}

:is(.popup-wrap, #content) .pagination a.arrow {
  position: relative;
}

:is(.popup-wrap, #content) .pagination a.arrow.disabled {
  pointer-events: none;
  opacity: 0.5;
}

:is(.popup-wrap, #content) .pagination a.arrow:before {
  content: '';
  position: absolute;
  width: 36%;
  aspect-ratio: 1 / 1;
  border-top: 2px solid var(--green1);
  border-left: 2px solid var(--green1);
  top: 50%;
  left: 50%;
  transform-origin: left top;
  transition: border-color 0.3s ease 0s, margin-left 0.3s ease 0s;
}

:is(.popup-wrap, #content) .pagination a.arrow:is(:hover, :focus-visible):before {
  border-color: var(--white);
}

:is(.popup-wrap, #content) .pagination a.arrow.prev_page:before {
  transform: rotate(-45deg);
  margin-left: -18%;
}

:is(.popup-wrap, #content) .pagination a.arrow.prev_page:is(:hover, :focus-visible):before {
  margin-left: -24%;
}

:is(.popup-wrap, #content) .pagination a.arrow.next_page:before {
  transform: rotate(135deg);
  margin-left: 18%;
}

:is(.popup-wrap, #content) .pagination a.arrow.next_page:is(:hover, :focus-visible):before {
  margin-left: 24%;
}

:is(.popup-wrap, #content) .card-container {
  position: relative;
}

:is(.popup-wrap, #content) .card-container h2 {
  /*  position: sticky;
  top: 50px; */
}

:is(.popup-wrap, #content) .card-container .card {
  border-radius: var(--border-radius-10);
  overflow: hidden;
  background-color: var(--green1);
  margin-bottom: 2em;
}

:is(.popup-wrap, #content) .card-container.light-color .card {
  background-color: rgba(62, 152, 145, 0.1);
}

:is(.popup-wrap, #content) .card-container .card .details .txt {
  flex: 1 1 auto;
}

:is(.popup-wrap, #content) .card-container.light-color .card .details .txt:not(:has(> h3:first-child)) {
  padding-block-start: 0.5em;
}

:is(.popup-wrap, #content) .card-container .card .title {
  color: var(--white);
  background-image: linear-gradient(to right, var(--bluegreen2), var(--green3));
  font-size: clamp(1.0625rem, 0.832rem + 0.9836vw, 2rem);
  line-height: var(--title-line-height);
  font-weight: 500;
  padding: clamp(13px, calc(10.049px + 0.787vw), 25px) clamp(20px, calc(15.082px + 1.311vw), 40px);
}

:is(.popup-wrap, #content) .card-container .card .details {
  padding: clamp(13px, calc(10.049px + 0.787vw), 25px) clamp(20px, calc(15.082px + 1.311vw), 40px);
  display: flex;
  width: 100%;
  gap: clamp(20px, calc(10.164px + 2.623vw), 60px);
}

:is(.popup-wrap, #content) .card-container:not(.light-color) .card .details {
  color: var(--white);
}

:is(.popup-wrap, #content) .card-container .card .details h3 {
  margin-top: 0;
  font-size: clamp(1.0625rem, 0.832rem + 0.9836vw, 2rem);
}

:is(.popup-wrap, #content) .card-container:not(.light-color) .card .details h3 {
  color: var(--green5);
}

:is(.popup-wrap, #content) .card-container .card .details .img-wrap {
  max-width: 600px;
  flex: 0 0 40%;
}

:is(.popup-wrap, #content) .card-container .card .details .img-wrap div.swiper {
  width: 100%;
  border-radius: var(--border-radius-10);
  overflow: hidden;
}

:is(.popup-wrap, #content) .card-container .card .details .img-wrap div.swiper-slide {
  width: 100% !important;
}

:is(.popup-wrap, #content) .card-container .card .details .img-wrap div.swiper-slide a {
  display: block;
  aspect-ratio: 600 / 450;
  width: 100%;
  line-height: 0;
  background-image: none;
  background-color: rgba(0, 0, 0, 0.9);
  border-radius: var(--border-radius-10);
  overflow: hidden;
}

:is(.popup-wrap, #content) .card-container .card .details .img-wrap div.swiper-slide a img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#content .card-gallery :is(.swiper-button-next, .swiper-button-prev) {
  width: clamp(30px, calc(25.082px + 1.311vw), 50px);
  height: clamp(30px, calc(25.082px + 1.311vw), 50px);
}

#content .card-gallery .swiper-button-prev {
  left: clamp(5px, calc(3.77px + 0.328vw), 10px);
}

#content .card-gallery .swiper-button-next {
  right: clamp(5px, calc(3.77px + 0.328vw), 10px);
}

#content .card-gallery .swiper-pagination {
  bottom: clamp(10px, calc(7.541px + 0.656vw), 20px);
}

#content #map_animation_container{
	position: relative;
	width: 100%;
	aspect-ratio: 1760 / 870;
}
:is(.popup-wrap, #content) div#sitemap>ul>li{
	padding-left: 0;
	margin-bottom: 1.5rem;
}
:is(.popup-wrap, #content) div#sitemap>ul>li:before{
	display: none;
}
:is(.popup-wrap, #content) div#sitemap>ul>li>a{
	display: block;
	padding: clamp(10px, calc(6.311px + 0.984vw), 25px) clamp(45px, calc(29.016px + 4.262vw), 110px) clamp(10px, calc(6.311px + 0.984vw), 25px) clamp(15px, calc(10.082px + 1.311vw), 35px);
	font-weight: 500;
    font-size: clamp(1.25rem, 1.0348rem + 0.918vw, 2.125rem);
    position: relative;
    line-height: 1.1;
	border-radius: var(--border-radius-10);
	color: var(--green1);
	position: relative;
	overflow: hidden;
	background-image: linear-gradient(to right, var(--green5), var(--green4)), linear-gradient(to right, rgba(62, 152, 145, 0.1) 50%, rgba(62, 152, 145, 0.1) 100%);
    background-position: left center, left center;
    background-repeat: no-repeat, no-repeat;
    background-size: 0% 100%, 100% 100%;
	transition: background-size 0.6s ease 0s;
}
:is(.popup-wrap, #content) div#sitemap>ul>li>a:is(:hover, :focus-visible) {
    background-size: 100% 100%, 100% 100%;
}
:is(.popup-wrap, #content) div#sitemap>ul>li>a:after {
    content: "";
    position: absolute;
    width: 25px;
    aspect-ratio: 1 / 1;
    display: block;
    border-top: 3px solid var(--white);
    border-right: 3px solid var(--white);
    transform: rotate(45deg) translate(-50%, -50%);
    right: clamp(20px, calc(17.541px + 0.656vw), 30px);
    top: 50%;
    transform-origin: 0 0;
    transition: right 0.3s ease 0s, opacity 0.3s ease 0s;
    opacity: 0;
    z-index: 1;
}
:is(.popup-wrap, #content) div#sitemap>ul>li>a:is(:hover, :focus-visible):after {
    right: clamp(13px, calc(11.279px + 0.459vw), 20px);
    opacity: 1;
    transition: right 0.3s ease 0.1s, opacity 0.3s ease 0.1s;
}
/* :is(.popup-wrap, #content) div#sitemap>ul>li>a:before{
	content: "";
    position: absolute;
    width: 201%;
    height: 100%;
    right: 0;
    top: 0;
    background-image: linear-gradient(to right, var(--green5), var(--green4) 50%, transparent 50%, transparent);
    background-position: right center;
    background-repeat: no-repeat;
    transition: right 0.6s ease 0s;
}
:is(.popup-wrap, #content) div#sitemap>ul>li>a:is(:hover, :focus-visible):before {
    right: -101%;
} */
:is(.popup-wrap, #content) div#sitemap>ul>li>ul{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
	margin: 0;
	padding: clamp(5px, calc(2.541px + 0.656vw), 15px) clamp(15px, calc(10.082px + 1.311vw), 35px);
}
:is(.popup-wrap, #content) div#sitemap>ul>li>ul>li:before{
	content: '';
    position: absolute;
    width: 9px;
    height: 9px;
    top: 0.45em;
    left: 0.4em;
    border-radius: 50%;
    background-color: var(--green3);
}
/******** inside page end **********/