@charset 'utf-8';
/* ============ STYLE ============ */
html {
    font-family: "Noto Sans JP", sans-serif;
    color: #000;
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    line-height: 1.6em;
    letter-spacing: 0;
}
body {
    text-align: justify;
        -webkit-text-size-adjust: 100%;
}
body.ready {
    opacity: 1;
}
a {
    color: #000;
    margin: 0 !important;
    padding: 0 !important;
    text-decoration: none;
}
a:hover {
    cursor: pointer;
}
h3 a,
a.text {
    color: #179745;
    text-decoration: underline;
    transition: all .3s;
}
h3 a:hover,
a.text:hover {
    opacity: .7;
}
h3 a {
    text-decoration: none;
}
*:focus {
    outline: none;
}
img {
    max-width: 100%;
	vertical-align: bottom;
}
body.scroll-disable {
    overflow: hidden;
}

.main {
    padding: 0 0 12rem;
    background-image: url(../img/sec/bg-main.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 85% auto;
    aspect-ratio: 1032 / 398;
}

/* -----------------------
COMMON
-------------------------- */
/* LAYOUT */
.page {width: 100%; margin: 0 auto;}
.page__inner {margin: 0 auto;}
.page__inner--wide97 {width: 97%; max-width: 1300px;}
.page__inner--wide93 {width: 93%;}
.page__inner--wide90 {width: 90%;}
.page__inner--wide85 {width: 85%;}
.page__inner--wide80 {width: 80%;}
.page__inner--wide75 {width: 75%; background-color: rgba(255, 255, 255, 0.6);}
.page__inner--wide70 {width: 70%;}
.page__inner--wide65 {width: 65%;}
.page__inner--wide60 {width: 60%;}
.page__inner--wide55 {width: 55%;}
.page__inner--wide50 {width: 50%;}
.page__inner--wide45 {width: 45%;}
.page__inner--wide40 {width: 40%;}
.page__inner--wide35 {width: 35%;}
.page__inner--wide30 {width: 30%;}
@media only screen and (max-width: 640px) {
    .page {width: 100%; max-width: 100%; margin: 0 auto;}
}

/* DISPLAY FLEX */
.display__flex-between {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.page__layout {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.page__layout--main {
    width: calc(100% - 248px - 100px);
    background-color: rgba(255, 255, 255, 0.6);
}
.page__layout--side {
    width: 248px;
}

.submenu__layout {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 2rem;
}

/* TEXT */
p,li {
    text-align: justify;
}

/* list */
.list--bullet {
    display: block;
    text-align: justify;
}
.list__item {
    position: relative;
}
.list__item::before {
	content: '\203B';
    position: absolute;
	top: 0;
	left: 0;
}
.list__item--small {
    padding-left: 1.4rem;
    font-size: 1.2rem;
}
/* list numbered */
.numbered-list {
    list-style: decimal !important;
    list-style-position: outside !important;
    padding-left: 1.8em !important;
    margin: 0 !important;
}
.numbered-list li {
    margin-bottom: 1em;
    text-align: left !important;
    display: list-item !important;
}
.numbered-list li:last-child {
    margin-bottom: 0;
}


/* BREADCRUMB */
.breadcrumb {
    width: 100% !important;
    margin: 2rem 0 4rem;
    font-size: 0.875rem;
    line-height: 1.4em;
}
.breadcrumb ol {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}
.breadcrumb li + li::before {
    content: ">";
    margin: 0 0.5em;
    color: #179745;
}
.breadcrumb,
.breadcrumb a {
    color: #179745;
}
.breadcrumb a:hover {
    text-decoration: underline;
}
.material-icons {
    font-size: 1.2em !important;
    font-size: 0.875rem;
    vertical-align: top;
    margin-right: .1rem;
}


/* -----------------------
HEADER
-------------------------- */
header {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    padding: 0.555rem 0 0.555rem 1rem;
}
.header__logo {
    width: 187px;
}
.header__logo-50th {
    width: 130px;
    margin-left: 1rem;
}
/* NAVIGATION */
nav {
    width: calc(100% - (187px + 130px + 1rem + 150px));
}
.header__navigation {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.header__navigation .nav-1st {
    padding: 0 1.4rem;
    transition: all .5s ease;
}

.header__navigation li.nav-1st a {
    position: relative;
    display: inline-block;
    padding: 0.5rem 0;
    text-decoration: none;
    color: inherit;
}  
.header__navigation li.nav-1st > a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 100%;
    height: 2px;
    background: #179745;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
}
.header__navigation li.nav-1st > a:hover::after {
    transform: scaleX(1);
}
.header__navigation li.nav-1st:hover {
    color: #179745;
}

/* -----------------------
MEGA MENU
-------------------------- */
.has-panel-wrapper {
    position: relative;
    display: inline-block;
}
.nav-panel {
    position: absolute;
    top: 2.4rem;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    z-index: 999;
}
.nav-panel.include-image {
    width: 83vw;
    min-width: 1024px;
    max-width: 1024px;
}
.nav-panel.no-image {
    width: 20vw;
    min-width: 380px;
    max-width: 380px;
}

.nav-panel__title {
    padding: 0.8rem 1.2rem;
    color: #fff;
    font-size: 1.1rem;
    background-color: #179745;
    border-left: solid 10px #4CC74B;
}

.nav-panel__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    padding: 1.6rem 1.4rem;
}

.nav-panel__item {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem !important;
    border: 1px solid #179745;
    background-color: #fff;
    text-decoration: none;
    color: #000;
    height: 100%;
    box-sizing: border-box;
}
.nav-panel__item:hover {
    outline: 6px solid #4CC74B;
    outline-offset: -5px;
    cursor: pointer;
}
.nav-panel__item .nav-panel__text {
    display: block;
    font-size: .875rem;
    line-height: 1.4;
    flex: 1;
}
.nav-panel__item img {
    display: block;
    width: 100px;
    max-height: 80px;
    object-fit: contain;
    flex-shrink: 0;
}
a.nav-panel__item {
    display: flex !important;
}

.nav-panel__item.text-only {
    position: relative;
    padding: 0 0 0 .9rem !important;
    border: none;
}
.nav-panel__item.text-only::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: .4rem;
    height: 2px;
    background: #000;
}
.nav-panel__item.text-only:hover {
    outline: 0;
    outline-offset: 0;
    color: #179745;
    cursor: pointer;
}
.nav-panel__item.text-only:hover::after {
    background: #179745;
}

.nav-panel__item img {
    width: 100px;
    height: auto;
    max-height: 80px;
    object-fit: contain;
    flex-shrink: 0;
}

.nav-panel__text {
    flex: 1;
    font-size: .875rem;
}
.nav-panel__text span {
    display: block;
    margin-bottom: 0.2em;
}

/* Nヒートシリーズ */
.nav-panel__item--nheat {
    color: #fff;
    background-color: #179745;
    border-color: #179745;
}
.nav-panel__item--nheat .nav-panel__text,
.nav-panel__item--nheat .nav-panel__text span {
    color: #fff;
}

/* bg */
.nav-panel__overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(83, 83, 83, 0.2); /* #535353 の 20% */
    z-index: 998;
}
.nav-panel,
.nav-panel__overlay {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.has-panel-wrapper.is-open .nav-panel,
.has-panel-wrapper.is-open .nav-panel__overlay {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    cursor: pointer;
}


/* -----------------------
HEADDING
-------------------------- */
/* h1 */
.page__title-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    padding: 6rem 0;
    text-align: center;
    overflow: hidden;
}
.page__title-bg,
.page__title-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -3;
}
.page__title-bg img,
.page__title-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page__title-cover {
    z-index: -2;
}
.page__title {
    position: relative;
    color: #fff;
    font-size: clamp(40px, 3.692vw, 60px);
    font-weight: 600;
    text-align: left;
    line-height: 1.2;
    z-index: -1;
 }
.page__title span {
    display: block;
    margin-top: 0.5em;
    font-size: clamp(18px, 1.5vw, 28px);
    font-weight: 400;
}

.page__title-detail {
    font-size: clamp(28px, 2.46vw, 36px);
}
/* h2 */
.page__heading {
    padding: 0 1em;
    color: #fff;
    font-size: clamp(20px, 1.846vw, 28px);
    padding: .5em 1em;
    line-height: 1.4em;
    background-color: #179745;
    border-left: .875em solid #4CC74B;
}

/* h3 */
.page__subheading {
    padding-bottom: 0.676em;
    color: #179745;
    font-size: clamp(16px, 1.538vw, 24px);
    line-height: 1.5em;
    border-bottom: 1px solid #179745;
}


/* -----------------------
BUTTON
-------------------------- */
.stair-button__wrapper {
    width: 100%;
    max-width: 232px;
}
.stair-button {
    display: block;
    aspect-ratio: 232 / 53;
    background-image: url(../img/common/btn-stair.svg);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: contain;
    color: #fff;
    transition: all 0.3s;
}
.stair-button__arrow {
    position: absolute;
    top: 50%;
    right: .5rem;
    transform: translateY(-50%);
}
.stair-button:hover,
.nspcom_list li:hover .stair-button,
.products_list li:hover .stair-button {
    color: #179745;
    background-image: url(../img/common/btn-stair_hover.svg);
    cursor: pointer;
}

.square-button__wrapper {
    width: 171px;
    min-width: 171px;
    max-width: 100%;
}
.square-button {
    position: relative;
    display: block;
    width: 100%;
    height: 34px;
    padding-left: 1em !important;
    color: #fff;
    font-size: 0.875em !important;
    line-height: 34px;
    background-color: #179745;
    border: solid 1px #179745;
    transition: all .3s;
}
.square-button__arrow {
    position: absolute;
    top: 50%;
    right: .4rem;
    transform: translateY(-50%);
}
.square-button:hover {
    color: #179745;
    background-color: #fff;
    cursor: pointer;
}


/* -----------------------
TABLE
-------------------------- */
table {
    width: 100%;
    background-color: #fff;
    border-collapse: collapse;
}
th {
    padding: 1em;
    color: #fff;
    vertical-align: top;
    white-space: nowrap;
    background-color: #179745;
}
td {
    padding: 1em;
    vertical-align: top;
    white-space: wrap;
}

/* 縦並び */
.table-horizontal th {
    border: solid 1px #179745;
    border-right: solid 1px #fff;
}
.table-horizontal th:last-child {
    border-right: solid 1px #179745;
}
.table-horizontal td {
    border: solid 1px #179745;
}

/* スマホで横並びを維持 */
.table-horizontal--sp th {
    border: solid 1px #179745;
    border-right: solid 1px #fff;
}
.table-horizontal--sp th:last-child {
    border-right: solid 1px #179745;
}
.table-horizontal--sp td {
    border: solid 1px #179745;
}

/* 横並び */
.table-vertical th {
    border-top: solid 1px #fff;
}
.table-vertical td {
    border: solid #179745;
    border-width: 1px 1px 1px 0;
}
.table-vertical tr:first-child th {
    border-top: solid 1px #179745;
}
.table-vertical tr:last-child {
    border-bottom: solid 1px #179745;
}

/* -----------------------
ANCHOR
-------------------------- */
.anchor-box {
    display: inline-flex;
    position: relative;
    width: 100%;
    padding: 0 0 0 .675em !important;
    color: #222;
    font-size: 1rem;
    line-height: 2em;
    align-items: center;
    text-decoration: none;
    border-left: 8px solid #4CC74B;
    border-bottom: 2px solid #179745;
    transition: all .3s;
}

.anchor-box .arrow::before,
.anchor-box .arrow::after {
    content: "";
    position: absolute;
    top: 40%;
    right: .5rem;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    border-right: 1px solid #179745;
    border-bottom: 1px solid #179745;
    transform: rotate(45deg);
}

.anchor-box .arrow::after {
    top: 52%;
    right: .5rem;
    border-color: #179745;
}

.anchor-box:hover {
    color: #fff;
    background-color: #179745;
}
.anchor-box:hover .arrow::before,
.anchor-box:hover .arrow::after {
    border-color: #fff;
}

/* -----------------------
FORM
-------------------------- */
/* input */
input,
textarea,
select {
    -webkit-appearance: none; /* iOS Safariのデフォルトスタイルを除去 */
    border-radius: 0;
}

input[type='text'],
input[type='name'],
input[type='number'],
input[type='email'],
input[type='tel'],
input[type='postal-code'],
input[type='password'] {
  padding: 12px;
  line-height: 1em;
  border: solid 1px #c1c1c1;
  background: #f5f2f2;
  border-radius: 0 !important;
  z-index: 0 !important;
}
input[type="text"]:focus,
input[type='name']:focus,
input[type='number']:focus,
input[type='email']:focus,
input[type='tel']:focus,
input[type='postal-code']:focus,
input[type='password']:focus {
  z-index: 0 !important;
  outline: 0;
}
input[type='text'].error,
input[type='name'].error,
input[type='number'].error,
input[type='email'].error,
input[type='tel'].error,
input[type='postal-cod'].errore,
input[type='password'].error,
select.error {
  border: solid 1px #ff0000;
}

::placeholder{
  color:#acacac;
}
/* IMG */
input[type='image'] {
  width: 100%;
}
/* TEXTAREA */
textarea {
  width: 100%;
  height: 200px;
  padding: 10px 15px;
  background: #f5f2f2;
  border: solid 1px #c1c1c1;
}
textarea:focus {
  outline: 0;
}


/* -----------------------
SIDE NAVIGATION
-------------------------- */
.search-form--side {
    display: flex;
    align-items: center;
    margin: .3rem 0 0;
}
.search__keyword--side {
    width: calc(100% - 42px);
    height: 42px;
    padding: 0 1rem;
    box-sizing: border-box;
    border: 1px solid #ccc;
}
.search-button--side {
    width: 42px;
    height: 42px;
    margin: 0;
    padding: 0;
    background-color: #179745;
    border: solid 1px #179745;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .5s;
}
.search-button--side .material-icons {
    font-size: 24px !important;
    transition: all .5s;
}
.search-button--side:hover {
    color: #179745;
    background-color: #fff;
}
.search-button--side:hover .material-icons {
    transform: scale(1.2);
}

.list__side-tag {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    margin: 1rem 0 2rem;
}
.list__side-tag li {
    padding: 0 .2rem .4rem;
}
.list__side-tag a {
    display: block;
    padding: 0 .7rem !important;
    font-size: 0.875rem;
    background-color: #e9e9e9;
    border-radius: 9rem;
    transition: all 0.3s ease;
}
.list__side-tag a:hover {
    opacity: .7;
}

.list__side-category {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: calc(100% - 6.9rem);
    margin-bottom: 3rem;
    font-size: .875rem;
    background-color: #fff;
    border-top: solid 1px #545454;
    border-left: solid 1px #545454;
}
.list__side-category li {
    position: relative;
    width: calc(100% / 4);
    padding: .7rem;
    line-height: 1.2em;
    box-sizing: border-box;
    border-right: solid 1px #545454;
    border-bottom: solid 1px #545454;
    transition: all .5s ease;
}
.list__side-category li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.list__side-category li:hover {
    color: #fff;
    background-color: #179745;
}
.list__side-category li span {
    position: absolute;
    top: 53%;
    right: .7rem;
    font-size: 1.1rem;
    transform: translateY(-50%);
}


/* -----------------------
FOOTER
-------------------------- */
.footer {
    background: #127937;
    color: #fff;
    padding: 3rem 0 0;
    font-size: 0.875rem;
}

.footer__navigation--download,
.footer__navigation--link ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    column-gap: 2rem;
    row-gap: 1.4rem;
}
.footer__navigation--download li,
.footer__navigation--link li {
    position: relative;
    line-height: 1.4em;
}
.footer__navigation--download li a,
.footer__navigation--link li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.footer__navigation--download {
    margin-bottom: 3rem;
}
.footer__navigation--download li {
    width: 23%;
    padding-left: 2.2rem;
    background-image: url(../img/common/icon-pdf.svg);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: auto 80%;
}

.footer__navigation--link {
    padding: 3rem 0;
    background-color: #179745;
}
.footer__navigation--link li {
    width: 23%;
}

.footer__navigation-logo {
    padding: 2.4rem 0 3rem;
    background-color: #fff;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.footer__navigation-logo--inner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.footer__logo {
    width: 267px;
    margin-right: 1.6rem;
    height: 100%;
}
.footer__logo-50th {
    width: calc(267px * .7);
}

.footer__copyright {
    display: block;
    padding: 3rem 0;
    color: #fff;
    font-size: 0.75rem;
    text-align: center;
    background-color: #127937;
}

.button__page-top {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    pointer-events: none; /* 非表示時クリック無効 */
    position: fixed;
    bottom: 1rem;
    left: 1rem;
    width: 3rem;
    height: 3rem;
    font-size: .875rem;
    font-weight: 600;
    text-align: center;
    color: #179745;
    background-color: #fff;
    border: solid 2px #179745;
    border-radius: 90%;
    z-index: 999;
}
.button__page-top::after {
    content: '〈';
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%,-50%) rotate(90deg);
    line-height: 1;
    color: #0d7b33;
}
.button__page-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* -----------------------
SIDE NAVIGATION
-------------------------- */
.side-nav {
    width: 248px;
    background-color: #fff;
}

.side-nav__title {
    width: 100%;
    margin: 0;
    padding: 1rem !important;
    color: #fff;
    background-color: #179745;
    border-top: solid 1px #B0B0B0;
}

.side-nav__list,
.side-nav__list-second,
.side-nav__list-third {
    list-style: none;
    margin: 0;
    padding: 0;
}
.side-nav__list-third {
    padding-bottom: .5rem;
}

/* first */
.side-nav__item {
    width: 100%;
    margin: 0;
    border-bottom: solid 1px #B0B0B0;
}
.side-nav__item:first-child {
    border-top: solid 1px #B0B0B0;
}

.side-nav__toggle-title {
    position: relative;
    padding: 1rem 2.4rem 1rem 1rem;
    cursor: pointer;
    transition: all 0.3s;
}

.side-nav__toggle-icon {
    position: absolute;
    top: 50%;
    right: 0.5rem;
    transform: translateY(-50%);
    display: block;
    width: 1rem;
    height: 1rem;
    transition: all 0.3s ease;
}
.side-nav__toggle-icon::before,
.side-nav__toggle-icon::after {
    content: '';
    position: absolute;
    background-color: #179745;
    transition: 0.3s;
}

.side-nav__toggle-icon::before {
    width: 2px;
    height: 1rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.side-nav__toggle-icon::after {
    width: 1rem;
    height: 2px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.side-nav__item.link a {
    display: block;
    position: relative;
    padding: 1rem !important;
    text-decoration: none;
    transition: all 0.3s;
}
.side-nav__item.link {
    position: relative;
}
.side-nav__item.link .material-icons {
    position: absolute;
    top: 54%;
    right: .25rem;
    transform: translateY(-50%);
    color: #179745;
}

.side-nav__content {
    display: none;
    background-color: #F1FFF4;
}

/* second */
.side-nav__item-second {
    width: 100%;
    margin: 0;
    border-bottom: solid 1px #B0B0B0;
}

.side-nav__item-second:first-child {
    border-top: solid 1px #B0B0B0;
}
.side-nav__item-second:last-child {
    border-bottom: none;
}

.side-nav__toggle-title-second {
    position: relative;
    padding: 1rem 2.4rem 1rem 1rem;
    cursor: pointer;
    transition: all 0.3s;
}

.side-nav__content-second {
    display: none;
    background-color: #F1FFF4;
}

.side-nav__item-second.link a {
    display: block;
    position: relative;
    padding: 1rem !important;
    text-decoration: none;
    transition: all 0.3s;
}
.side-nav__item-second.link a::after {
    content: '→';
    position: absolute;
    top: 50%;
    right: 0.5rem;
    transform: translateY(-50%);
    font-size: 0.9em;
    color: #179745;
}

/* third */
.side-nav__item-third {
    margin: 0;
    padding: 0;
}
.side-nav__item-third a {
    display: block;
    position: relative;
    padding: 0.8rem 2rem 0.8rem 1rem !important;
    font-size: 0.875rem;
    line-height: 1.4em;
    text-decoration: none;
    transition: all 0.3s;
}
.side-nav__item-third a::after {
    content: '→';
    position: absolute;
    top: 50%;
    right: 0.5rem;
    transform: translateY(-50%);
    color: #179745;
    font-size: 0.9em;
}

/* hover */
.side-nav__toggle-title:hover,
.side-nav__toggle-title-second:hover {
    color: #fff;
    background-color: #179745;
}
.side-nav__toggle-title:hover .side-nav__toggle-icon::before,
.side-nav__toggle-title:hover .side-nav__toggle-icon::after,
.side-nav__toggle-title-second:hover .side-nav__toggle-icon::before,
.side-nav__toggle-title-second:hover .side-nav__toggle-icon::after {
    background-color: #fff;
}

.side-nav__item.link a:hover,
.side-nav__item-second.link a:hover,
.side-nav__item-third a:hover {
    color: #fff;
    background-color: #179745;
}
.side-nav__item.link a:hover .material-icons {
    color: #fff;
}
.side-nav__item-second.link a:hover::after,
.side-nav__item-third a:hover::after {
    color: #fff;
}

.nav__archive-list {
    color: #fff;
    background-color: #4CC74B;
}
.nav__archive-list a,
.nav__archive-list a::after {
    color: #fff;
}

/* selected */
.side-nav__toggle-title.selected {
    color: #fff;
    background-color: #179745;
}
.side-nav__toggle-title-second.selected {
    color: #fff;
    background-color: #4CC74B;
}
.side-nav__toggle-title.selected .side-nav__toggle-icon,
.side-nav__toggle-title-second.selected .side-nav__toggle-icon {
    transform: translateY(-50%) rotate(90deg);
}
.side-nav__toggle-title.selected .side-nav__toggle-icon::before,
.side-nav__toggle-title-second.selected .side-nav__toggle-icon::before {
    background-color: #fff;
}
.side-nav__toggle-title.selected .side-nav__toggle-icon::after,
.side-nav__toggle-title-second.selected .side-nav__toggle-icon::after {
    content: normal;
}

/* side menu */
.topics__category .side-nav__item.link a:hover {
    color: #fff;
    background-color: #4CC74B;
}


/* -----------------------
PAGENATION
-------------------------- */
.pagination {
    text-align: center;
    margin: 6rem 0 0;
}
.pagination__list {
    display: inline-flex;
    gap: 0.5rem;
    padding: 0;
    margin: 0;
    list-style: none;
}
.pagination__item {
    font-size: 0.875rem;
}
.pagination__item a {
    display: inline-block;
    text-decoration: none;
    transition: all 0.2s;
}

.pagination__item a:hover {
    color: #4CC74B;
    text-decoration: underline;
}

.pagination__item--current {
    color: #4CC74B;
    cursor: default;
    pointer-events: none;
}


/* -----------------------
UTILITY
-------------------------- */
.u-pc {display: block;}
.u-sp {display: none;}

.gnav-sp {display: none;}

.u-mt05 {margin-top: .5rem !important;}
.u-mt10 {margin-top: 1.0rem !important;}
.u-mt15 {margin-top: 1.5rem !important;}
.u-mt20 {margin-top: 2.0rem !important;}
.u-mt25 {margin-top: 2.5rem !important;}
.u-mt30 {margin-top: 3.0rem !important;}
.u-mt35 {margin-top: 3.5rem !important;}
.u-mt40 {margin-top: 4.0rem !important;}
.u-mt45 {margin-top: 4.5rem !important;}
.u-mt50 {margin-top: 5.0rem !important;}
.u-mt55 {margin-top: 5.5rem !important;}
.u-mt60 {margin-top: 6.0rem !important;}
.u-mt65 {margin-top: 6.5rem !important;}
.u-mt70 {margin-top: 7.0rem !important;}
.u-mt75 {margin-top: 7.5rem !important;}
.u-mt80 {margin-top: 8.0rem !important;}
.u-mt85 {margin-top: 8.5rem !important;}
.u-mt90 {margin-top: 9.0rem !important;}
.u-mt95 {margin-top: 9.5rem !important;}
.u-mt100 {margin-top: 10.0rem !important;}
.u-mt105 {margin-top: 10.5rem !important;}
.u-mt110 {margin-top: 11.0rem !important;}
.u-mt115 {margin-top: 11.5rem !important;}
.u-mt120 {margin-top: 12.0rem !important;}
.u-mt125 {margin-top: 12.5rem !important;}
.u-mt130 {margin-top: 13.0rem !important;}
.u-mt135 {margin-top: 13.5rem !important;}
.u-mt140 {margin-top: 14.0rem !important;}
.u-mt145 {margin-top: 14.5rem !important;}
.u-mt150 {margin-top: 15.0rem !important;}

.u-mb05 {margin-bottom: .5rem !important;}
.u-mb10 {margin-bottom: 1.0rem !important;}
.u-mb15 {margin-bottom: 1.5rem !important;}
.u-mb20 {margin-bottom: 2.0rem !important;}
.u-mb25 {margin-bottom: 2.5rem !important;}
.u-mb30 {margin-bottom: 3.0rem !important;}
.u-mb35 {margin-bottom: 3.5rem !important;}
.u-mb40 {margin-bottom: 4.0rem !important;}
.u-mb45 {margin-bottom: 4.5rem !important;}
.u-mb50 {margin-bottom: 5.0rem !important;}
.u-mb55 {margin-bottom: 5.5rem !important;}
.u-mb60 {margin-bottom: 6.0rem !important;}
.u-mb65 {margin-bottom: 6.5rem !important;}
.u-mb70 {margin-bottom: 7.0rem !important;}
.u-mb75 {margin-bottom: 7.5rem !important;}
.u-mb80 {margin-bottom: 8.0rem !important;}
.u-mb85 {margin-bottom: 8.5rem !important;}
.u-mb90 {margin-bottom: 9.0rem !important;}
.u-mb95 {margin-bottom: 9.5rem !important;}
.u-mb100 {margin-bottom: 10.0rem !important;}
.u-mb105 {margin-bottom: 10.5rem !important;}
.u-mb110 {margin-bottom: 11.0rem !important;}
.u-mb115 {margin-bottom: 11.5rem !important;}
.u-mb120 {margin-bottom: 12.0rem !important;}
.u-mb125 {margin-bottom: 12.5rem !important;}
.u-mb130 {margin-bottom: 13.0rem !important;}
.u-mb135 {margin-bottom: 13.5rem !important;}
.u-mb140 {margin-bottom: 14.0rem !important;}
.u-mb145 {margin-bottom: 14.5rem !important;}
.u-mb150 {margin-bottom: 15.0rem !important;}

.u-ml05 {margin-left: .5rem !important;}
.u-ml10 {margin-left: 1.0rem !important;}
.u-ml15 {margin-left: 1.5rem !important;}
.u-ml20 {margin-left: 2.0rem !important;}
.u-ml25 {margin-left: 2.5rem !important;}
.u-ml30 {margin-left: 3.0rem !important;}
.u-ml35 {margin-left: 3.5rem !important;}
.u-ml40 {margin-left: 4.0rem !important;}
.u-ml45 {margin-left: 4.5rem !important;}
.u-ml50 {margin-left: 5.0rem !important;}
.u-ml55 {margin-left: 5.5rem !important;}
.u-ml60 {margin-left: 6.0rem !important;}
.u-ml65 {margin-left: 6.5rem !important;}
.u-ml70 {margin-left: 7.0rem !important;}
.u-ml75 {margin-left: 7.5rem !important;}
.u-ml80 {margin-left: 8.0rem !important;}
.u-ml85 {margin-left: 8.5rem !important;}
.u-ml90 {margin-left: 9.0rem !important;}
.u-ml95 {margin-left: 9.5rem !important;}
.u-ml100 {margin-left: 10.0rem !important;}
.u-ml105 {margin-left: 10.5rem !important;}
.u-ml110 {margin-left: 11.0rem !important;}
.u-ml115 {margin-left: 11.5rem !important;}
.u-ml120 {margin-left: 12.0rem !important;}
.u-ml125 {margin-left: 12.5rem !important;}
.u-ml130 {margin-left: 13.0rem !important;}
.u-ml135 {margin-left: 13.5rem !important;}
.u-ml140 {margin-left: 14.0rem !important;}
.u-ml145 {margin-left: 14.5rem !important;}
.u-ml150 {margin-left: 15.0rem !important;}

.u-pt05 {padding-top: .5rem !important;}
.u-pt10 {padding-top: 1.0rem !important;}
.u-pt15 {padding-top: 1.5rem !important;}
.u-pt20 {padding-top: 2.0rem !important;}
.u-pt25 {padding-top: 2.5rem !important;}
.u-pt30 {padding-top: 3.0rem !important;}
.u-pt35 {padding-top: 3.5rem !important;}
.u-pt40 {padding-top: 4.0rem !important;}
.u-pt45 {padding-top: 4.5rem !important;}
.u-pt50 {padding-top: 5.0rem !important;}
.u-pt55 {padding-top: 5.5rem !important;}
.u-pt60 {padding-top: 6.0rem !important;}
.u-pt65 {padding-top: 6.5rem !important;}
.u-pt70 {padding-top: 7.0rem !important;}
.u-pt75 {padding-top: 7.5rem !important;}
.u-pt80 {padding-top: 8.0rem !important;}
.u-pt85 {padding-top: 8.5rem !important;}
.u-pt90 {padding-top: 9.0rem !important;}
.u-pt95 {padding-top: 9.5rem !important;}
.u-pt100 {padding-top: 1.00rem !important;}
.u-pt105 {padding-top: 1.05rem !important;}
.u-pt110 {padding-top: 1.10rem !important;}
.u-pt115 {padding-top: 1.15rem !important;}
.u-pt120 {padding-top: 1.20rem !important;}
.u-pt125 {padding-top: 1.25rem !important;}
.u-pt130 {padding-top: 1.30rem !important;}
.u-pt135 {padding-top: 1.35rem !important;}
.u-pt140 {padding-top: 1.40rem !important;}
.u-pt145 {padding-top: 1.45rem !important;}
.u-pt150 {padding-top: 1.50rem !important;}

.u-pb05 {padding-bottom: .5rem !important;}
.u-pb10 {padding-bottom: 1.0rem !important;}
.u-pb15 {padding-bottom: 1.5rem !important;}
.u-pb20 {padding-bottom: 2.0rem !important;}
.u-pb25 {padding-bottom: 2.5rem !important;}
.u-pb30 {padding-bottom: 3.0rem !important;}
.u-pb35 {padding-bottom: 3.5rem !important;}
.u-pb40 {padding-bottom: 4.0rem !important;}
.u-pb45 {padding-bottom: 4.5rem !important;}
.u-pb50 {padding-bottom: 5.0rem !important;}
.u-pb55 {padding-bottom: 5.5rem !important;}
.u-pb60 {padding-bottom: 6.0rem !important;}
.u-pb65 {padding-bottom: 6.5rem !important;}
.u-pb70 {padding-bottom: 7.0rem !important;}
.u-pb75 {padding-bottom: 7.5rem !important;}
.u-pb80 {padding-bottom: 8.0rem !important;}
.u-pb85 {padding-bottom: 8.5rem !important;}
.u-pb90 {padding-bottom: 9.0rem !important;}
.u-pb95 {padding-bottom: 9.5rem !important;}
.u-pb100 {padding-bottom: 10.0rem !important;}
.u-pb105 {padding-bottom: 10.5rem !important;}
.u-pb110 {padding-bottom: 11.0rem !important;}
.u-pb115 {padding-bottom: 11.5rem !important;}
.u-pb120 {padding-bottom: 12.0rem !important;}
.u-pb125 {padding-bottom: 12.5rem !important;}
.u-pb130 {padding-bottom: 13.0rem !important;}
.u-pb135 {padding-bottom: 13.5rem !important;}
.u-pb140 {padding-bottom: 14.0rem !important;}
.u-pb145 {padding-bottom: 14.5rem !important;}
.u-pb150 {padding-bottom: 15.0rem !important;}

.u-tal {text-align: left !important;}
.u-tac {text-align: center !important;}
.u-tar {text-align: right !important;}

.u-w05 {width: 5%;}
.u-w10 {width: 10%;}
.u-w15 {width: 15%;}
.u-w20 {width: 20%;}
.u-w23 {width: 23%;}
.u-w25 {width: 25%;}
.u-w30 {width: 30%;}
.u-w35 {width: 35%;}
.u-w40 {width: 40%;}
.u-w45 {width: 45%;}
.u-w50 {width: 50%;}
.u-w55 {width: 55%;}
.u-w60 {width: 60%;}
.u-w65 {width: 65%;}
.u-w70 {width: 70%;}
.u-w75 {width: 75%;}
.u-w80 {width: 80%;}
.u-w85 {width: 85%;}
.u-w90 {width: 90%;}
.u-w95 {width: 95%;}
.u-w100 {width: 100%;}

.u-fs10 {font-size: 1.0rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs12 {font-size: 1.2rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs14 {font-size: 1.4rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs16 {font-size: 1.6rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs18 {font-size: 1.8rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs20 {font-size: 2.0rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs22 {font-size: 2.2rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs24 {font-size: 2.4rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs26 {font-size: 2.6rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs28 {font-size: 2.8rem; line-height: 1.5em; letter-spacing: 0;}
.u-fs30 {font-size: 3.0rem; line-height: 1.5em; letter-spacing: 0;}

.u-fw300 {font-weight: 300;}
.u-fw400 {font-weight: 400;}
.u-fw500 {font-weight: 500;}
.u-fw600 {font-weight: 600;}
.u-fw700 {font-weight: 700;}
.u-fw800 {font-weight: 800;}
.u-fw900 {font-weight: 900;}

.u-lh10 {line-height: 1.0em !important;}
.u-lh11 {line-height: 1.1em !important;}
.u-lh12 {line-height: 1.2em !important;}
.u-lh13 {line-height: 1.3em !important;}
.u-lh14 {line-height: 1.4em !important;}
.u-lh15 {line-height: 1.5em !important;}
.u-lh16 {line-height: 1.6em !important;}
.u-lh17 {line-height: 1.7em !important;}
.u-lh18 {line-height: 1.8em !important;}
.u-lh19 {line-height: 1.9em !important;}
.u-lh20 {line-height: 2.0em !important;}
.u-lh21 {line-height: 2.1em !important;}
.u-lh22 {line-height: 2.2em !important;}
.u-lh23 {line-height: 2.3em !important;}
.u-lh24 {line-height: 2.4em !important;}
.u-lh25 {line-height: 2.5em !important;}
.u-lh26 {line-height: 2.6em !important;}
.u-lh27 {line-height: 2.7em !important;}
.u-lh28 {line-height: 2.8em !important;}
.u-lh29 {line-height: 2.9em !important;}

.u-ls00 {letter-spacing: 0;}
.u-ls01 {letter-spacing: 0.1rem;}
.u-ls02 {letter-spacing: 0.2rem;}
.u-ls03 {letter-spacing: 0.3rem;}
.u-ls04 {letter-spacing: 0.4rem;}
.u-ls05 {letter-spacing: 0.5rem;}

.u-colorW {color: #fff;}
.u-colorR {color: #ff0000;}