/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
*, ::before, ::after {
    box-sizing: border-box
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    tab-size: 4
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"
}

hr {
    height: 0;
    color: inherit
}

abbr[title] {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b, strong {
    font-weight: bolder
}

code, kbd, samp, pre {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}

table {
    text-indent: 0;
    border-color: inherit
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button, select {
    text-transform: none
}

button, [type=button], [type=reset], [type=submit] {
    -webkit-appearance: button
}

::-moz-focus-inner {
    border-style: none;
    padding: 0
}

:-moz-focusring {
    outline: 1px dotted ButtonText
}

:-moz-ui-invalid {
    box-shadow: none
}

legend {
    padding: 0
}

progress {
    vertical-align: baseline
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
    margin: 0
}

h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit
}

ol, ul {
    list-style: none;
    margin: 0;
    padding: 0
}

img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle
}

img, video {
    max-width: 100%;
    height: auto
}

button, [type=button], [type=reset], [type=submit] {
    -webkit-appearance: button;
    background-color: rgba(0, 0, 0, 0);
    background-image: none
}

button {
    color: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

*, ::before, ::after {
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb
}

:root {
    --base-color: #fff;
    --base-text-color: #222;
    --gray-text-color: #555;
    --placeholder-text-color: #727171;
    --accent-color: #009682;
    --accent-text-color: #009682;
    --caution-color: #ee0101;
    --gray-color: #f7f7f7;
    --green-color: #e9f4f1;
    --gray-border-color: #ccc;
    --stock-color: #00aa8a;
    --usmmf-color: #e85471;
    --usstock-color: #e85471;
    --fund-color: #00a0d7;
    --fx-color: #074d96
}

[id] {
    scroll-margin-top: 82px
}

@media (max-width: 47.99em) {
    [id] {
        scroll-margin-top: 0
    }
}

@media (min-width: 48em) {
    [id] {
        scroll-margin-top: 120px
    }
}

@media (min-width: 81.25em) {
    [id] {
        scroll-margin-top: 110px
    }
}

body {
    font-family: Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Helvetica Neue", Meiryo, sans-serif;
    color: #222;
    font-size: 0.875rem;
    line-height: 1.5
}

@media (min-width: 48em) {
    body {
        font-size: 1rem
    }

    a[href^=tel] {
        pointer-events: none
    }
}

.l-main {
    display: flex;
    flex-direction: column
}

[data-page-category=stock] .l-main {
    border-top: 3px solid var(--stock-color)
}

[data-page-category=usmmf] .l-main {
    border-top: 3px solid var(--usmmf-color)
}

[data-page-category=usstock] .l-main {
    border-top: 3px solid var(--usstock-color)
}

[data-page-category=fund] .l-main {
    border-top: 3px solid var(--fund-color)
}

[data-page-category=fx] .l-main {
    border-top: 3px solid var(--fx-color)
}

.first-article .reel .reel-container .reel-items .reel-card .reel-card-link, .first-article .reel .reel-container .reel-small-card .reel-small-card-link, .first-article .theme-labels-bloc .theme-labels .label, a.apply-header-logo, .company-header .company-header-links .company-header-links-current a, .company-header .company-header-links .company-header-links-list li a, .company-header .company-header-links .company-header-links-lang > .label, body[data-page-category=company] .accordion-box-menu > li.accordion-box-menu-title > a, body[data-page-category=company] .company-img-nav > li > a, .fund-app-list a, .market-news-link, .market-ranking-name > a, body[data-page-category=stock] .study-card-box, .top-mv .top-mv-link, .top-member-campaign .top-campaign-list > li a, .top-campaign .top-campaign-list .swiper-slide a:not(.image-link), .top-product .top-product-block, .top-market-movie .top-movie-item, .top-first .top-first-search, .top-first .top-select-list > a, .top-first .top-first-link, .top-products .top-products-block, .top-links-sns-link, .top-links-item-link, .top-links-news-title a, .top-links-news-description a, .top-market-news-banner, .top-member-market-ranking-list a, .theme-list-question > li > a, .learning-link-text, .update, .update-button, .movie-link, .table > tbody a, a.panel, .panel-title a, .panel-link, .link-panel, .reel-link, .reel-card-link, .reel-small-card-link, .section-title > a, .link, .image-link, .movie-link-column, .page-back-link, .card-link-title, .link-card, .button, .keyword-button, .accordion-box-menu > li a, .adobe-reader-link .text-link, .footer-nav > li a, .footer-link-external > li > a, .footer-link > li > a, .footer-corporate > a, .local-nav-login__button, .local-nav-login__link, .local-nav-lv2 a, .local-nav-lv3 a, .local-nav-lv4 a, .local-nav-lv5 a, .local-nav-lv6 a, .local-nav-lv3__list a, .local-nav-lv4__list a, .local-nav-lv5__list a, .local-nav-lv6__list a, .local-nav-lv7__list a, .global-header-button a, .global-header-menu__item > a, .global-header-sub-menu__head > a, .global-header-sub-menu__link > li > a, .global-header-sub-menu__list > li > a, .global-header-banner > li > a, .global-header-tag__list > li > a, .global-header-tag__productlink > li > a, .global-header-link > li > a, .global-header-brand__button {
    transition: opacity .15s ease-out
}

@media (hover: hover) {
    .first-article .reel .reel-container .reel-items .reel-card .reel-card-link:hover, .first-article .reel .reel-container .reel-small-card .reel-small-card-link:hover, .first-article .theme-labels-bloc .theme-labels .label:hover, a.apply-header-logo:hover, .company-header .company-header-links .company-header-links-current a:hover, .company-header .company-header-links .company-header-links-list li a:hover, .company-header .company-header-links .company-header-links-lang > .label:hover, body[data-page-category=company] .accordion-box-menu > li.accordion-box-menu-title > a:hover, body[data-page-category=company] .company-img-nav > li > a:hover, .fund-app-list a:hover, .market-news-link:hover, .market-ranking-name > a:hover, body[data-page-category=stock] .study-card-box:hover, .top-mv .top-mv-link:hover, .top-member-campaign .top-campaign-list > li a:hover, .top-campaign .top-campaign-list .swiper-slide a:hover:not(.image-link), .top-product .top-product-block:hover, .top-market-movie .top-movie-item:hover, .top-first .top-first-search:hover, .top-first .top-select-list > a:hover, .top-first .top-first-link:hover, .top-products .top-products-block:hover, .top-links-sns-link:hover, .top-links-item-link:hover, .top-links-news-title a:hover, .top-links-news-description a:hover, .top-market-news-banner:hover, .top-member-market-ranking-list a:hover, .theme-list-question > li > a:hover, .learning-link-text:hover, .update:hover, .update-button:hover, .movie-link:hover, .table > tbody a:hover, a.panel:hover, .panel-title a:hover, .panel-link:hover, .link-panel:hover, .reel-link:hover, .reel-card-link:hover, .reel-small-card-link:hover, .section-title > a:hover, .link:hover, .image-link:hover, .movie-link-column:hover, .page-back-link:hover, .card-link-title:hover, .link-card:hover, .button:hover, .keyword-button:hover, .accordion-box-menu > li a:hover, .adobe-reader-link .text-link:hover, .footer-nav > li a:hover, .footer-link-external > li > a:hover, .footer-link > li > a:hover, .footer-corporate > a:hover, .local-nav-login__button:hover, .local-nav-login__link:hover, .local-nav-lv2 a:hover, .local-nav-lv3 a:hover, .local-nav-lv4 a:hover, .local-nav-lv5 a:hover, .local-nav-lv6 a:hover, .local-nav-lv3__list a:hover, .local-nav-lv4__list a:hover, .local-nav-lv5__list a:hover, .local-nav-lv6__list a:hover, .local-nav-lv7__list a:hover, .global-header-button a:hover, .global-header-menu__item > a:hover, .global-header-sub-menu__head > a:hover, .global-header-sub-menu__link > li > a:hover, .global-header-sub-menu__list > li > a:hover, .global-header-banner > li > a:hover, .global-header-tag__list > li > a:hover, .global-header-tag__productlink > li > a:hover, .global-header-link > li > a:hover, .global-header-brand__button:hover {
        opacity: .5
    }
}

@media (min-width: 48em) {
    .global-header--sticky + .l-main, .global-header--sticky ~ .l-main {
        padding-top: 186px
    }
}

@media (min-width: 62.5em) {
    .global-header--sticky + .l-main, .global-header--sticky ~ .l-main {
        padding-top: 190px
    }
}

@media (min-width: 81.25em) {
    .global-header--sticky + .l-main, .global-header--sticky ~ .l-main {
        padding-top: 158px
    }
}

.global-header {
    background-color: #fff;
    width: 100%;
    z-index: 9999;
    position: relative
}

@media (min-width: 48em) {
    .global-header {
        box-shadow: 0 1px 4px rgba(0, 0, 0, .16)
    }

    .global-header--sticky {
        position: fixed;
        top: 0
    }
}

@media (max-width: 47.99em) {
    .global-header--open {
        position: fixed;
        top: 0
    }
}

.global-header-container {
    display: grid;
    grid-template-columns:auto;
    grid-template-rows:1fr 1fr 284px;
    gap: 9px 20px
}

@media (min-width: 48em) {
    .global-header-container {
        grid-template-columns:9% 1fr -webkit-max-content;
        grid-template-columns:9% 1fr max-content;
        grid-template-rows:auto auto auto;
        padding-top: 10px
    }
}

@media (min-width: 81.25em) {
    .global-header-container {
        grid-template-rows:auto auto
    }
}

@media (max-width: 47.99em) {
    .global-header-container {
        background-color: #f5f5f5;
        display: none;
        position: fixed;
        top: 60px;
        left: 0;
        width: 100%;
        height: calc(100% - 60px);
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 5
    }

    .global-header--open .global-header-container {
        display: grid
    }
}

@media (min-width: 48em) {
    .global-header-container .global-header-logo-frame {
        width: 152px;
        grid-row: 1/3;
        grid-column: 1
    }
}

@media (min-width: 62.5em) {
    .global-header-container .global-header-logo-frame {
        width: 193px
    }
}

.global-header-container .global-header-link {
    grid-row: 3;
    grid-column: 1
}

@media (min-width: 48em) {
    .global-header-container .global-header-link {
        grid-row: 1;
        grid-column: 2
    }
}

.global-header-container .global-header-search {
    position: fixed;
    bottom: 0
}

@media (min-width: 48em) {
    .global-header-container .global-header-search {
        position: static;
        grid-row: 1;
        grid-column: 3
    }

    .global-header-container .global-header-buttons-frame {
        grid-row: 2;
        grid-column: 3;
        height: 46px;
        margin-right: 21px
    }
}

.global-header-container .global-header-nav {
    grid-row: 1;
    grid-column: 1
}

@media (min-width: 48em) {
    .global-header-container .global-header-nav {
        grid-row: 3;
        grid-column: 1/4
    }
}

@media (min-width: 81.25em) {
    .global-header-container .global-header-nav {
        grid-row: 2;
        grid-column: 2/3
    }
}

.global-header-container .global-header-tag {
    grid-row: 2;
    grid-column: 1
}

@media (min-width: 48em) {
    .global-header-container .global-header-tag {
        grid-row: 4;
        grid-column: 1/4
    }
}

@media (min-width: 81.25em) {
    .global-header-container .global-header-tag {
        grid-row: 3;
        grid-column: 1/4
    }
}

@media (min-width: 48em) {
    .global-header--sticky .global-header-container {
        grid-template-columns:161px auto auto 246px;
        grid-template-rows:auto auto;
        gap: 14px 0;
        padding: 13px 0
    }

    .global-header--sticky .global-header-container .global-header-logo-frame {
        grid-column: 1;
        grid-row: 1
    }

    .global-header--sticky .global-header-container .global-header-menu {
        margin-right: 0
    }

    .global-header--sticky .global-header-container .global-header-menu [data-category=product] {
        display: block
    }

    .global-header--sticky .global-header-container .global-header-menu > li {
        padding: 0 10px
    }
}

@media (min-width: 48em)and (min-width: 62.5em) {
    .global-header--sticky .global-header-container .global-header-menu > li {
        padding: 0 12px
    }
}

@media (min-width: 48em) {
    .global-header--sticky .global-header-container .global-header-search {
        grid-column: 3;
        grid-row: 1;
        align-self: center;
        margin-right: 15px;
        margin-left: auto
    }

    .global-header--sticky .global-header-container .global-header-nav {
        grid-column: 1/5;
        grid-row: 2
    }

    .global-header--sticky .global-header-container .global-header-search.global-header-search--open .global-header-search__inner {
        width: 160px
    }

    .global-header--sticky .global-header-container .global-header-search.global-header-search--open .global-header-search__button, .global-header--sticky .global-header-container .global-header-search.global-header-search--open .global-header-search__input {
        pointer-events: auto
    }

    .global-header--sticky .global-header-container .global-header-buttons-frame {
        grid-column: 3;
        grid-row: 1
    }
}

@media (min-width: 62.5em) {
    .global-header--sticky .global-header-container {
        grid-template-columns:161px auto auto 284px;
        grid-template-rows:auto auto;
        grid-gap: 9px 0
    }
}

@media (min-width: 81.25em) {
    .global-header--sticky .global-header-container {
        grid-template-columns:161px auto 53px 284px;
        grid-template-rows:auto;
        grid-gap: 0
    }

    .global-header--sticky .global-header-container .global-header-logo-frame {
        grid-column: 1;
        grid-row: 1
    }

    .global-header--sticky .global-header-container .global-header-nav {
        grid-column: 2;
        grid-row: 1
    }

    .global-header--sticky .global-header-container .global-header-buttons-frame {
        grid-column: 3;
        grid-row: 1
    }

    .global-header--sticky .global-header-container .global-header-search {
        height: 34px;
        grid-column: 3;
        grid-row: 1;
        position: relative;
        margin-left: 0
    }

    .global-header--sticky .global-header-container .global-header-search .global-header-search__form {
        width: auto;
        max-width: none;
        min-width: 0;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 5
    }

    .global-header--sticky .global-header-container .global-header-search .global-header-search__inner {
        width: 0;
        transition: width .15s ease-out
    }

    .global-header--sticky .global-header-container .global-header-search .global-header-search__button, .global-header--sticky .global-header-container .global-header-search .global-header-search__input {
        pointer-events: none
    }
}

@media (min-width: 48em) {
    .global-header--sticky .global-header-logo {
        top: 14px
    }

    .global-header--sticky .global-header-logo > a {
        width: 138px;
        height: 50px;
        overflow: hidden
    }

    .global-header--sticky .global-header-logo > a > img {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px)
    }

    .global-header--sticky .global-header-buttons {
        width: auto;
        top: 12px
    }
}

.global-header-sp-container {
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 10
}

@media (min-width: 48em) {
    .global-header-sp-container {
        display: block
    }
}

@media (max-width: 47.99em) {
    .global-header-logo {
        padding: 12px 0 11px 15px
    }
}

@media (min-width: 48em) {
    .global-header-logo {
        display: grid;
        place-items: center;
        margin-left: 23px;
        position: absolute;
        width: auto;
        top: 20px;
        left: 0
    }
}

.global-header-logo > a {
    display: block;
    width: 86px
}

@media (min-width: 48em) {
    .global-header-logo > a {
        width: 10vw
    }
}

@media (min-width: 52.5em) {
    .global-header-logo > a {
        width: 130px
    }
}

@media (min-width: 81.25em) {
    .global-header-logo > a {
        width: 9.5vw
    }
}

@media (min-width: 90em) {
    .global-header-logo > a {
        width: auto
    }
}

.global-header-buttons {
    display: flex;
    gap: 3px;
    line-height: 1.2
}

@media (max-width: 47.99em) {
    .global-header-buttons {
        padding: 12px 15px 11px 0
    }
}

@media (min-width: 48em) {
    .global-header-buttons {
        gap: 5px;
        position: absolute;
        top: 53px;
        right: 20px
    }
}

@media (min-width: 81.25em) {
    .global-header-buttons {
        width: 15vw;
        max-width: 263px;
        min-width: 206.6px
    }
}

@media (min-width: 48em) {
    .global-header--sticky .global-header-buttons {
        margin-top: 0
    }
}

.global-header-button {
    border-radius: 10px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    display: flex;
    align-items: center;
    height: 37px
}

@media (min-width: 48em) {
    .global-header-button {
        display: block;
        height: auto;
        flex: 1 1 auto;
        width: 110px
    }
}

@media (min-width: 62.5em) {
    .global-header-button {
        width: 129px
    }
}

.global-header-button a {
    display: block;
    width: 100%;
    min-width: 70px;
    padding: 10px 0;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .global-header-button a {
        padding: 14px
    }
}

@media (min-width: 62.5em) {
    .global-header-button a {
        font-size: 0.9375rem
    }
}

.global-header-button[data-type=header-reg] {
    background-color: #e83a3a
}

.global-header-button[data-type=header-login] {
    background-color: #009682
}

.global-header-trigger {
    background-color: #009682;
    border-radius: 23px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
    color: #fff;
    font-size: 0.625rem;
    position: fixed;
    right: 15px;
    bottom: 15px;
    width: 62px;
    height: 62px;
    padding-top: 26px
}

.global-header-trigger::before {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat;
    content: "";
    position: absolute;
    top: 19px;
    left: 50%;
    width: 23px;
    height: 14px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media (min-width: 48em) {
    .global-header-trigger {
        display: none
    }
}

@media (max-width: 47.99em) {
    .global-header-nav {
        margin: 20px 15px 0
    }
}

@media (min-width: 48em) {
    .global-header-nav {
        position: relative;
        min-height: 0
    }
}

@media (max-width: 47.99em) {
    .global-header-nav--open {
        display: block
    }
}

@media (min-width: 48em) {
    .global-header-nav {
        display: flex;
        margin: 0 auto;
        align-self: center
    }
}

@media (min-width: 81.25em) {
    .global-header-nav {
        margin: 0 0 0 auto
    }
}

@media (min-width: 48em) {
    .global-header-menu {
        display: flex;
        align-items: center;
        font-size: 0.875rem
    }
}

@media (min-width: 62.5em) {
    .global-header-menu {
        font-size: 0.9375rem
    }
}

@media (min-width: 81.25em) {
    .global-header--sticky .global-header-menu {
        margin-right: 50px
    }
}

@media (max-width: 47.99em) {
    .global-header-menu > li {
        background-color: #fff;
        border-bottom: 1px solid #e5e5e5;
        position: relative
    }
}

@media (min-width: 48em) {
    .global-header-menu > li {
        padding: 0 6px
    }
}

@media (min-width: 62.5em) {
    .global-header-menu > li {
        padding: 0 14px
    }
}

@media (min-width: 48em) {
    .global-header-menu > li:first-of-type {
        padding: 0 6px 0 0
    }
}

@media (min-width: 62.5em) {
    .global-header-menu > li:first-of-type {
        padding: 0 14px 0 0
    }
}

@media (min-width: 48em) {
    .global-header-menu > li:last-of-type {
        padding: 0 0 0 6px
    }
}

@media (min-width: 62.5em) {
    .global-header-menu > li:last-of-type {
        padding: 0 0 0 14px
    }
}

@media (max-width: 47.99em) {
    .global-header-menu > li:first-of-type {
        border-radius: 10px 10px 0 0
    }

    .global-header-menu > li > a {
        display: block;
        position: relative;
        padding: 12px 48px 13px 15px
    }

    .global-header-menu > li > a::after {
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        border-radius: 50%;
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.global-header-menu [data-category=product] {
    display: none
}

.global-header-menu__item {
    cursor: pointer;
    position: relative
}

@media (max-width: 47.99em) {
    .global-header-menu__item {
        background-color: #fff;
        border-bottom: 1px solid #e5e5e5;
        font-size: 0.875rem
    }

    .global-header-menu__item::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 14px;
        width: 8px;
        height: 14px;
        background: #fff url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

@media (min-width: 48em) {
    .global-header-menu__item::after {
        border-top: 7px solid rgba(0, 150, 130, .4);
        border-right: 4px solid rgba(0, 0, 0, 0);
        border-left: 4px solid rgba(0, 0, 0, 0);
        border-bottom: 7px solid rgba(0, 0, 0, 0);
        -webkit-transform-origin: center;
        transform-origin: center;
        content: "";
        display: block;
        margin-left: 6px;
        margin-bottom: 7px;
        -webkit-transform: translateY(7px);
        transform: translateY(7px)
    }

    .global-header--sticky .global-header-menu__item::after {
        display: none
    }

    .global-header-menu__item {
        display: flex;
        align-items: center
    }
}

@media (max-width: 47.99em) {
    .global-header-menu__item > a::after {
        display: none
    }
}

.global-header-menu__item[aria-expanded=true]::before {
    background-color: #078271;
    content: "";
    position: absolute;
    left: 0;
    bottom: -9px;
    width: 100%;
    height: 5px
}

@media (min-width: 81.25em) {
    .global-header-menu__item[aria-expanded=true]::before {
        bottom: -21px
    }
}

@media (min-width: 48em) {
    .global-header-menu__item[aria-expanded=true]::after {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }
}

.global-header-menu__item[aria-expanded=true] > a:hover {
    opacity: 1
}

.global-header-menu__item[data-category=product] {
    display: none
}

@media (min-width: 48em) {
    .global-header--sticky .global-header-menu__item[data-category=product] {
        display: block
    }
}

@media (max-width: 47.99em) {
    .global-header-menu__item > a {
        display: block;
        position: relative;
        padding: 12px 48px 13px 15px
    }

    .global-header-menu__item > a::after {
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        border-radius: 50%;
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.global-header-menu__item:not(.global-header-menu__item) {
    padding-right: 0
}

.global-header-menu__item:not(.global-header-menu__item)::after {
    display: none
}

@media (max-width: 47.99em) {
    .global-header-menu__item:first-child {
        border-radius: 10px 10px 0 0
    }

    .global-header-menu__item:last-child {
        border-bottom: none;
        border-radius: 0 0 10px 10px;
        box-shadow: 0 1px 0px #e5e5e5
    }
}

.global-header-menu__item:only-child > a {
    border-radius: 10px
}

.global-header-sub-menu {
    background-color: #f5f5f5;
    grid-column: 1;
    grid-row: 1/4;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    transition: -webkit-transform .2s ease-out;
    transition: transform .2s ease-out;
    transition: transform .2s ease-out, -webkit-transform .2s ease-out
}

@media (max-width: 47.99em) {
    .global-header-sub-menu {
        padding-bottom: 70px
    }
}

@media (min-width: 48em) {
    .global-header-sub-menu {
        background: #f5f5f5;
        box-shadow: 0 2px 3px rgba(0, 0, 0, .16);
        position: absolute;
        top: 139px;
        left: 0;
        width: 100%;
        height: auto;
        -webkit-transform: translateX(0);
        transform: translateX(0);
        transition: opacity .2s ease-out, visibility .2s ease-out;
        opacity: 0;
        visibility: hidden;
        z-index: 10000
    }
}

@media (min-width: 62.5em) {
    .global-header-sub-menu {
        top: 141px
    }
}

@media (min-width: 81.25em) {
    .global-header-sub-menu {
        top: 109px
    }
}

.global-header-sub-menu.global-header-sub-menu--open {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

@media (min-width: 48em) {
    .global-header-sub-menu.global-header-sub-menu--open {
        opacity: 1;
        visibility: visible
    }

    .global-header--sticky .global-header-sub-menu {
        top: 30px
    }
}

@media (min-width: 62.5em) {
    .global-header--sticky .global-header-sub-menu {
        top: 34px
    }
}

@media (min-width: 81.25em) {
    .global-header--sticky .global-header-sub-menu {
        top: 46px
    }
}

.global-header-sub-menu__inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 20px 15px 30px
}

@media (min-width: 48em) {
    .global-header-sub-menu__inner {
        padding: 20px 20px 30px
    }
}

.global-header-sub-menu__close {
    display: none
}

@media (min-width: 48em) {
    .global-header-sub-menu__close {
        cursor: pointer;
        position: absolute;
        right: 22px;
        bottom: -27px
    }

    .global-header-sub-menu--open .global-header-sub-menu__close {
        display: block
    }

    .global-header-sub-menu__close > button {
        background-color: #fff;
        border: 3px solid #f5f5f5;
        box-shadow: 0 2px 3px rgba(0, 0, 0, .16);
        width: 54px;
        height: 54px;
        border-radius: 50%;
        font-size: 0
    }
}

.global-header-sub-menu__close > button::before {
    content: ""
}

@media (min-width: 48em) {
    .global-header-sub-menu__close > button::before {
        background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center/100%;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 18px;
        height: 18px;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }
}

.global-header-sub-menu__contents {
    display: none
}

@media (max-width: 47.99em) {
    .global-header-sub-menu__contents {
        padding-bottom: 80px
    }
}

.global-header-sub-menu__contents.global-header-sub-menu__contents--open {
    display: block
}

@media (min-width: 48em) {
    .global-header-sub-menu__col {
        width: 25%;
        margin: 0 10px;
        overflow: hidden
    }

    .global-header-sub-menu__col[data-relation=true] {
        width: calc(25% + 25px);
        margin-left: 15px;
        padding-left: 25px;
        border-left: 1px solid #ccc
    }
}

.global-header-sub-menu__col > li {
    margin-top: 30px
}

@media (min-width: 48em) {
    .global-header-sub-menu__col > li {
        margin: 0
    }

    .global-header-sub-menu__col > li + li {
        margin-top: 30px
    }
}

@media (max-width: 47.99em) {
    .global-header-sub-menu__col.global-header-sub-menu__linking + .global-header-sub-menu__col > li {
        margin-top: 0
    }

    .global-header-sub-menu__col.global-header-sub-menu__linking + .global-header-sub-menu__col > li .global-header-sub-menu__list > li:first-of-type a {
        border-radius: 0
    }

    .global-header-sub-menu__col.global-header-sub-menu__linking > li .global-header-sub-menu__list > li:last-of-type a {
        border-radius: 0
    }
}

@media (min-width: 48em) {
    .global-header-sub-menu__spacer {
        margin-top: 33px
    }
}

.global-header-sub-menu__category {
    position: relative;
    margin: -20px -15px 20px -15px;
    padding: 20px 0;
    border-bottom: 1px solid #e5e5e5;
    background-color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .global-header-sub-menu__category {
        display: none
    }
}

.global-header-sub-menu__back {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 60px;
    padding: 20px;
    font-size: 0
}

.global-header-sub-menu__back::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 15px;
    width: 10px;
    height: 18px;
    background: #fff url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center/100%;
    -webkit-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg)
}

.global-header-sub-menu__head {
    border-bottom: 1px solid #ccc;
    display: block
}

@media (min-width: 48em) {
    .global-header-sub-menu__head {
        margin-bottom: 20px
    }
}

.global-header-sub-menu__head > a {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    position: relative;
    padding: 0 0 18px 0
}

@media (min-width: 48em) {
    .global-header-sub-menu__head > a {
        padding: 8px 0 10px 0
    }
}

.global-header-sub-menu__head > a::after {
    background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
    border-radius: 50%;
    content: "";
    width: 18px;
    height: 18px;
    margin-left: 14px
}

@media (min-width: 48em) {
    .global-header-sub-menu__link {
        width: calc(25% - 20px);
        margin-bottom: 20px
    }
}

.global-header-sub-menu__link > li > a {
    display: block;
    position: relative;
    padding: 12px 48px 13px 15px;
    border-radius: 10px;
    background-color: #fff;
    font-size: 0.875rem;
    box-shadow: 0 1px 0px #e5e5e5
}

.global-header-sub-menu__link > li > a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.global-header-sub-menu__hdg {
    margin-bottom: 10px;
    font-size: 0.75rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .global-header-sub-menu__hdg {
        margin-bottom: 15px
    }

    .global-header-sub-menu__top {
        display: flex;
        margin: 0 -10px;
        overflow: hidden
    }
}

.global-header-sub-menu__bottom {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #ccc
}

@media (min-width: 48em) {
    .global-header-sub-menu__bottom {
        margin-top: 20px;
        padding-top: 20px
    }
}

.global-header-sub-menu__list > li {
    border-bottom: 1px solid #e5e5e5
}

.global-header-sub-menu__list > li > a {
    display: block;
    position: relative;
    padding: 14px 48px 15px 15px;
    background-color: #fff;
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .global-header-sub-menu__list > li > a {
        padding: 10px 48px 10px 15px
    }
}

.global-header-sub-menu__list > li > a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.global-header-sub-menu__list > li:first-child > a {
    border-radius: 10px 10px 0 0
}

.global-header-sub-menu__list > li:last-child {
    border-bottom: none
}

.global-header-sub-menu__list > li:last-child > a {
    margin-bottom: 1px;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 1px 0px #e5e5e5
}

.global-header-sub-menu__list > li:only-child > a {
    border-radius: 10px
}

.global-header-contact {
    max-width: 793px;
    margin: 0 auto;
    border-radius: 10px;
    background-color: #fff;
    overflow: hidden;
    box-shadow: 0 1px 0px #e5e5e5
}

@media (min-width: 48em) {
    .global-header-contact {
        padding: 25px 20px 19px
    }
}

.global-header-contact__unit {
    padding: 0 20px
}

@media (min-width: 48em) {
    .global-header-contact__unit {
        display: flex;
        padding: 0
    }
}

.global-header-contact__info {
    padding: 19px 0 16px;
    text-align: center
}

@media (min-width: 48em) {
    .global-header-contact__info {
        width: 50%;
        padding: 0
    }
}

.global-header-contact__info + .global-header-contact__info {
    border-top: 1px solid rgba(204, 204, 204, .5)
}

@media (min-width: 48em) {
    .global-header-contact__info + .global-header-contact__info {
        border-top: none;
        border-left: 1px solid rgba(204, 204, 204, .5)
    }
}

.global-header-contact__hdg {
    font-size: 1rem;
    font-weight: 600
}

.global-header-contact__num {
    color: #019682;
    font-size: 2rem;
    font-weight: bold
}

@media (min-width: 48em) {
    .global-header-contact__num {
        font-size: 2.125rem
    }
}

.global-header-contact__num > img {
    display: inline-block;
    margin-right: 10px;
    vertical-align: -1px
}

.global-header-contact__txt {
    font-size: 0.875rem
}

.global-header-contact__txt > span {
    padding-left: 12px;
    font-size: 1rem
}

.global-header-contact__time {
    padding: 6px;
    background: #e8e8e8;
    font-size: 0.8125rem;
    text-align: center
}

@media (min-width: 48em) {
    .global-header-contact__time {
        margin-top: 18px;
        font-size: 0.75rem
    }
}

.global-header-banner {
    margin: -10px 0
}

@media (min-width: 48em) {
    .global-header-banner {
        display: flex
    }
}

.global-header-banner > li {
    margin: 10px 0
}

@media (min-width: 48em) {
    .global-header-banner > li {
        width: 100%;
        max-width: 574px
    }

    .global-header-banner > li + li {
        margin-left: 52px
    }
}

@media (max-width: 47.99em) {
    .global-header-tag {
        margin: 0 15px
    }
}

@media (min-width: 48em) {
    .global-header-tag {
        border-top: 1px solid rgba(0, 0, 0, .1);
        padding: 9px
    }

    .global-header--sticky .global-header-tag {
        display: none
    }

    .global-header-tag__list {
        display: flex;
        justify-content: center
    }
}

@media (max-width: 47.99em) {
    .global-header-tag__list > li {
        padding: 10px 5px;
        border-bottom: 1px solid #e5e5e5;
        background-color: #fff
    }
}

@media (min-width: 48em) {
    .global-header-tag__list > li {
        margin-left: 8px
    }
}

@media (max-width: 47.99em) {
    .global-header-tag__list > li > a {
        display: block;
        position: relative;
        padding: 12px 48px 13px 15px;
        font-size: 0.875rem
    }

    .global-header-tag__list > li > a::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

@media (min-width: 48em) {
    .global-header-tag__list > li > a {
        display: block;
        padding: 5px 20px 6px;
        border: 1px solid #e5e5e5;
        border-radius: 2px;
        background-color: #fff;
        font-size: 0.625rem;
        box-sizing: border-box
    }
}

@media (min-width: 62.5em) {
    .global-header-tag__list > li > a {
        font-size: 0.75rem
    }
}

.global-header-tag__list > li[data-category=products] {
    padding: 0
}

@media (max-width: 47.99em) {
    .global-header-tag__list > li:first-child {
        border-radius: 10px 10px 0 0
    }
}

.global-header-tag__list > li:last-child {
    border-bottom: none
}

@media (max-width: 47.99em) {
    .global-header-tag__list > li:last-child {
        border-radius: 0 0 10px 10px;
        box-shadow: 0 1px 0px #e5e5e5
    }
}

.global-header-tag__list > li:only-child > a {
    border-radius: 10px
}

.global-header-tag__productlink {
    display: flex;
    flex-wrap: wrap
}

@media (min-width: 48em) {
    .global-header-tag__productlink {
        justify-content: center
    }
}

@media (max-width: 47.99em) {
    .global-header-tag__productlink > li {
        width: calc(50% - 10px);
        margin: 5px
    }
}

@media (min-width: 48em) {
    .global-header-tag__productlink > li {
        margin: 0 7px 0 8px
    }
}

@media (max-width: 47.99em) {
    .global-header-tag__productlink > li > a {
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: relative;
        min-height: 50px;
        padding: 4px 48px 4px 15px;
        border-radius: 4px;
        background: #f2f2f2;
        font-size: 0.875rem
    }

    .global-header-tag__productlink > li > a::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

@media (min-width: 48em) {
    .global-header-tag__productlink > li > a {
        display: block;
        position: relative;
        padding: 6px 16px 7px;
        border-radius: 2px;
        background: rgba(0, 0, 0, .05);
        font-size: 0.625rem
    }
}

@media (min-width: 62.5em) {
    .global-header-tag__productlink > li > a {
        padding: 6px 20px 7px;
        font-size: 0.75rem
    }
}

.global-header-tag__productlink > li > a > span {
    font-size: 0
}

@media (min-width: 48em) {
    .global-header-tag__productlink > li > a > span {
        position: absolute;
        top: -4px;
        right: -13px;
        width: 28px;
        height: 20px
    }

    .global-header-tag__productlink > li > a > span[data-label=new] {
        background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat
    }

    .global-header-tag__productlink > li > a > span[data-label=feature] {
        background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat
    }
}

.global-header-link {
    color: #555;
    font-size: 0.6875rem
}

@media (max-width: 47.99em) {
    .global-header-link {
        margin: 0 15px 70px
    }
}

@media (min-width: 48em) {
    .global-header-link {
        display: flex;
        margin-left: auto;
        align-self: center
    }
}

@media (min-width: 62.5em) {
    .global-header-link {
        font-size: 0.75rem
    }
}

@media (min-width: 48em) {
    .global-header--sticky .global-header-link {
        display: none
    }
}

@media (max-width: 47.99em) {
    .global-header-link > li {
        border-bottom: 1px solid #e5e5e5
    }
}

@media (min-width: 48em) {
    .global-header-link > li {
        position: relative;
        padding: 0 12px
    }
}

@media (min-width: 62.5em) {
    .global-header-link > li {
        padding: 0 18px
    }
}

@media (min-width: 48em) {
    .global-header-link > li::before {
        background-color: #ccc;
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        margin: auto 0;
        width: 1px;
        height: 12px
    }
}

.global-header-link > li:first-of-type::before {
    display: none
}

@media (max-width: 47.99em) {
    .global-header-link > li:first-of-type > a {
        border-radius: 10px 10px 0 0
    }
}

.global-header-link > li:last-of-type {
    border-bottom: none
}

@media (min-width: 48em) {
    .global-header-link > li:last-of-type {
        padding: 0 0 0 12px
    }
}

@media (min-width: 62.5em) {
    .global-header-link > li:last-of-type {
        padding: 0 0 0 18px
    }
}

@media (max-width: 47.99em) {
    .global-header-link > li:last-of-type > a {
        border-radius: 0 0 10px 10px;
        box-shadow: 0 1px 0px #e5e5e5
    }
}

.global-header-link > li:only-child > a {
    border-radius: 10px
}

@media (max-width: 47.99em) {
    .global-header-link > li > a {
        background-color: #fff;
        display: block;
        padding: 12px 48px 13px 15px;
        position: relative;
        font-size: 0.875rem
    }

    .global-header-link > li > a::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

@media (min-width: 48em) {
    .global-header-link > li > a {
        color: #555
    }
}

.global-header-link > li > a[data-type=external] > img {
    display: inline-block;
    margin-left: 6px;
    vertical-align: -1px
}

@media (min-width: 48em) {
    .global-header-link > li > a[data-type=external] > img {
        width: 8px;
        margin-left: 2px
    }
}

@media (min-width: 62.5em) {
    .global-header-link > li > a[data-type=external] > img {
        width: 11px;
        margin-left: 5px
    }
}

@media (min-width: 48em) {
    .global-header-search {
        display: flex;
        gap: 5px;
        justify-content: flex-end;
        font-size: 0.75rem;
        margin-right: 21px
    }
}

@media (max-width: 47.99em) {
    .global-header--open .global-header-search {
        background-color: #fff;
        box-shadow: 0 -3px 2px rgba(0, 0, 0, .16);
        display: block;
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 15px 66px 15px 15px;
        z-index: 5
    }
}

.global-header-search__form {
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    height: 40px;
    overflow: hidden
}

@media (min-width: 48em) {
    .global-header-search__form {
        width: 156px;
        height: 34px;
        border-radius: 5px;
        flex-shrink: 0
    }
}

@media (min-width: 62.5em) {
    .global-header-search__form {
        width: 194px
    }
}

@media (min-width: 81.25em) {
    .global-header-search__form {
        width: 10.6vw;
        max-width: 194px;
        min-width: 133px
    }
}

.global-header-search__container {
    width: 100%;
    display: flex
}

.global-header-search__inner {
    flex: 1 1 auto
}

.global-header-search__input {
    width: 100%;
    height: 38px;
    padding: 8px 10px
}

@media (max-width: 47.99em) {
    .global-header-search__input {
        font-size: 1rem
    }

    .global-header-search__input::-webkit-input-placeholder {
        color: #fff
    }

    .global-header-search__input:-ms-input-placeholder {
        color: #fff
    }

    .global-header-search__input::placeholder {
        color: #fff
    }
}

@media (min-width: 48em) {
    .global-header-search__input {
        max-width: 130px;
        height: 32px;
        padding: 8px
    }
}

@media (min-width: 62.5em) {
    .global-header-search__input {
        max-width: 160px
    }
}

.global-header-search__button {
    position: relative;
    width: 38px;
    cursor: pointer
}

.global-header-search__button > span {
    font-size: 0
}

.global-header-search__button::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -10px;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat
}

.global-header-close {
    display: none;
    position: fixed;
    right: 0;
    bottom: 2px;
    z-index: 15
}

.global-header--open .global-header-close {
    display: block
}

@media (min-width: 48em) {
    .global-header--open .global-header-close {
        display: none
    }
}

.global-header-close > button {
    width: 66px;
    height: 66px;
    font-size: 0
}

.global-header-close > button::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center/100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.global-header-brand {
    display: none
}

@media (min-width: 48em) {
    .global-header-brand {
        display: block
    }

    .global-header--sticky .global-header-brand {
        display: none
    }
}

.global-header-brand__button {
    display: block;
    width: 64px;
    padding: 7px 0;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 5px;
    font-size: 0.75rem;
    text-align: center
}

.global-header-bg {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1
}

.global-header-bg.global-header-bg--open {
    display: block
}

.global-header .global-header-container .global-header-search {
    position: relative
}

@media (max-width: 47.99em) {
    .global-header .global-header-container .global-header-search {
        position: fixed
    }
}

.global-header.global-header--sticky #search_suggest {
    position: fixed;
    right: 300px;
    top: 54px;
    width: 198px
}

@media (max-width: 62.49em) {
    .global-header.global-header--sticky #search_suggest {
        right: 261px;
        width: 155px
    }
}

.global-header.global-header--sticky .global-header-search:not(.global-header-search--open) #search_suggest {
    display: none
}

.global-header:not(.global-header--sticky) #search_suggest {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    max-width: calc(100% - 69px)
}

.global-header #search_suggest {
    display: block;
    z-index: 999;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content
}

@media (max-width: 47.99em) {
    .global-header #search_suggest {
        display: none
    }
}

.global-header #search_suggest li + li {
    border-top: solid 1px #fff
}

.global-header #search_suggest li a {
    display: block;
    padding: 5px 10px;
    color: #fff;
    background-color: rgba(100, 100, 100, .9);
    transition: background-color .15s ease-out
}

.global-header #search_suggest li a:hover {
    background-color: rgba(100, 100, 100, .8)
}

@media (max-width: 47.99em) {
    .global-header #search_suggest li a:hover {
        background-color: rgba(100, 100, 100, .9)
    }
}

.page-title {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    width: 100%
}

.page-title-hdg {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 20px 0 0
}

@media (min-width: 48em) {
    .page-title-hdg {
        font-size: 2.125rem
    }
}

@media (max-width: 47.99em) {
    .is-local-nav-sticky .l-with-local-nav .page-title.with-sub-title .page-title-hdg, .is-open-local-navigation .l-with-local-nav .page-title.with-sub-title .page-title-hdg {
        padding-top: 0;
        padding-bottom: 2px
    }
}

.page-sub-title {
    font-size: 0.875rem;
    font-weight: 400;
    display: block;
    margin-bottom: 3px
}

@media (min-width: 48em) {
    .page-sub-title {
        margin-bottom: 5px
    }
}

.page-title-description {
    margin-top: 30px
}

.l-with-local-nav .page-title {
    border-bottom: 1px solid #e5e5e5;
    align-items: center;
    flex-direction: row
}

@media (max-width: 47.99em) {
    .l-with-local-nav .page-title {
        background-color: #fff;
        min-height: 80px;
        display: grid;
        grid-template-columns:calc(100% - 75px) 75px;
        grid-template-rows:auto;
        top: 0;
        z-index: 11
    }
}

@media (min-width: 48em) {
    .l-with-local-nav .page-title {
        border-bottom: 0
    }
}

@media (max-width: 47.99em) {
    .is-open-local-navigation .l-with-local-nav .page-title .page-title {
        height: 80px
    }

    .local-nav--sticky .l-with-local-nav .page-title {
        position: fixed
    }
}

.l-with-local-nav .page-title-hdg {
    padding: 27px 0 0;
    font-size: 2.125rem;
    font-weight: 600
}

@media (max-width: 47.99em) {
    .l-with-local-nav .page-title-hdg {
        font-size: 1.5rem;
        padding: 27px 10px 25px;
        grid-column: 1;
        grid-row: 1
    }

    .is-local-nav-sticky .l-with-local-nav .page-title-hdg, .is-open-local-navigation .l-with-local-nav .page-title-hdg {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .l-with-local-nav .local-nav-button {
        grid-column: 2;
        grid-row: 1
    }
}

.l-with-local-nav .page-description {
    font-size: 0.875rem;
    padding: 20px 15px 0
}

@media (min-width: 48em) {
    .l-with-local-nav .page-description {
        font-size: 1.125rem;
        padding: 26px 0 0
    }

    .page-title-mv {
        display: grid;
        grid-template-columns:1fr 1fr;
        grid-template-rows:auto
    }

    .page-title-mv .page-title-mv-inner {
        border-radius: 10px;
        grid-column: 1;
        grid-row: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin: 20px 0 20px 20px;
        z-index: 2
    }

    .page-title-mv .page-title-mv-inner[class*=theme-bgc-] {
        padding: 25px
    }

    .page-title-mv .page-title-hdg {
        padding: 0
    }

    .page-title-mv .page-description {
        font-size: 0.8125rem;
        padding: 10px 0 0
    }
}

.page-title-mv .page-description b {
    font-weight: 600
}

.page-title-mv-bg {
    display: none
}

@media (min-width: 48em) {
    .page-title-mv-bg {
        display: block;
        grid-column: 1/3;
        grid-row: 1;
        height: 100%
    }
}

.page-title-mv-bg .image.theme-image-full, .page-title-mv-bg .image-picture, .page-title-mv-bg img {
    object-fit: cover;
    object-position: right;
    width: 100%;
    height: 100%
}

.page-title-mv-sp-bg {
    display: none
}

@media (max-width: 47.99em) {
    .page-title-mv-sp-bg {
        display: block;
        margin-top: 30px;
        margin-right: 15px;
        margin-left: 15px
    }
}

.page-title-mv-sp-bg .image.theme-image-full, .page-title-mv-sp-bg .image-picture, .page-title-mv-sp-bg img {
    object-fit: cover;
    object-position: right;
    width: 100%;
    height: 100%
}

.main-title {
    padding: 40px 15px
}

@media (max-width: 47.99em) {
    .main-title {
        text-align: center
    }
}

@media (min-width: 48em) {
    .main-title {
        padding: 50px 0
    }
}

@media (max-width: 47.99em) {
    .l-main-contents {
        width: 100%;
        display: flex;
        flex-direction: column
    }
}

.is-open-local-navigation {
    width: 100%
}

.l-with-local-nav {
    display: flex;
    width: 100%
}

@media (min-width: 48em) {
    .l-with-local-nav {
        max-width: 1240px;
        padding: 0 20px;
        margin: 0 auto;
        display: grid;
        grid-template-rows:auto;
        grid-template-columns:minmax(444px, 880px) minmax(240px, 276px);
        gap: 44px
    }

    .l-with-local-nav .l-main-contents {
        grid-column: 1;
        grid-row: 1
    }

    .l-with-local-nav .l-local-nav {
        grid-column: 2;
        grid-row: 1
    }
}

@media (max-width: 47.99em) {
    .is-local-nav-sticky .l-with-local-nav .page-title {
        position: fixed
    }

    .is-local-nav-sticky .l-content {
        padding-top: 82px
    }

    .l-local-nav {
        position: fixed;
        top: 139px;
        left: 0;
        width: 100%;
        height: calc(100% - 139px);
        background: #f5f5f5;
        overflow-x: hidden;
        overflow-y: scroll;
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        visibility: hidden;
        z-index: 10;
        transition: opacity .2s ease-out, visibility .2s ease-out, -webkit-transform .2s ease-out;
        transition: opacity .2s ease-out, transform .2s ease-out, visibility .2s ease-out;
        transition: opacity .2s ease-out, transform .2s ease-out, visibility .2s ease-out, -webkit-transform .2s ease-out
    }
}

.l-local-nav.is-open {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
}

.is-local-nav-sticky .l-local-nav {
    top: 80px;
    height: calc(100% - 80px)
}

.local-nav-button {
    border-left: 1px solid #e5e5e5;
    color: #009682;
    font-size: 0.625rem;
    position: relative;
    white-space: nowrap;
    width: 75px;
    height: 52px;
    padding-top: 34px;
    margin: 15px 0 14px;
    flex-shrink: 0
}

@media (min-width: 48em) {
    .local-nav-button {
        display: none
    }
}

.local-nav-button::before {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat;
    content: "";
    position: absolute;
    top: 16px;
    left: 50%;
    width: 25px;
    height: 14px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.local-nav-button.is-close {
    font-size: 0
}

.local-nav-button.is-close::before {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center/100%;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.local-nav-login {
    display: none
}

@media (min-width: 48em) {
    .local-nav-login {
        display: block;
        margin-top: 20px;
        padding: 25px 15px;
        border-radius: 10px;
        background: #f5f5f5
    }
}

.local-nav-login__button {
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    border-radius: 10px;
    color: #fff;
    display: block;
    position: relative;
    width: 100%;
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center;
    padding: 15px
}

.local-nav-login__button::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_local_login.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    position: absolute;
    top: 0;
    left: 15px;
    bottom: 0;
    margin: auto 0;
    width: 17px;
    height: 16px
}

.local-nav-login__button.is-trade {
    background: var(--stock-color);
    padding: 15px 0 15px 25px
}

.local-nav-login__button.is-usstock {
    background: var(--usstock-color)
}

.local-nav-login__button.is-fund {
    background: var(--fund-color)
}

.local-nav-login__button.is-fx {
    background: var(--fx-color)
}

.local-nav-login__link {
    display: block;
    margin-top: 16px;
    font-size: 0.875rem;
    text-align: center
}

.local-nav-login__link::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -4px
}

.local-nav {
    margin: 20px 0;
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .local-nav {
        border: 1px solid #e5e5e5;
        border-radius: 10px;
        margin: 20px 0 0;
        overflow: hidden
    }
}

.local-nav[data-local-category=fee] .local-nav-other, .local-nav[data-local-category=fee] .local-nav-relative, .local-nav[data-local-category=first] .local-nav-other, .local-nav[data-local-category=first] .local-nav-relative {
    display: none
}

.local-nav[data-local-category=fee] .local-nav-lv3, .local-nav[data-local-category=first] .local-nav-lv3 {
    border-bottom: none
}

.local-nav-other {
    display: none;
    background: var(--base-color);
    margin: 26px 0 0 0;
    padding-left: 14px;
    position: relative
}

@media (min-width: 48em) {
    .local-nav-other {
        display: block
    }
}

.local-nav-other > span {
    display: block;
    font-weight: 600;
    padding: 14px 26px 15px 10px
}

.local-nav-other > span::before {
    background-color: #e5e5e5;
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0
}

@media (min-width: 48em) {
    .local-nav-other > span {
        font-size: 1rem
    }
}

@media (max-width: 47.99em) {
    .local-nav-hdg > a::after {
        display: none
    }
}

.local-nav-lv2[data-page-current=true] > a {
    color: var(--base-color)
}

[data-page-current=true] > a {
    color: var(--accent-color);
    font-weight: 600
}

[data-local-category=stock] [data-page-current=true] > a, [data-local-category=finance] [data-page-current=true] > a {
    color: var(--stock-color)
}

[data-local-category=fund] [data-page-current=true] > a {
    color: var(--fund-color)
}

[data-local-category=usstock] [data-page-current=true] > a {
    color: var(--usstock-color)
}

.local-nav-current {
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    padding-left: 14px
}

@media (min-width: 48em) {
    .local-nav-current {
        border-bottom: none
    }
}

.local-nav-current [data-page-current=true] > a {
    font-weight: 600
}

.local-nav-current .local-nav-lv3[data-page-current=true] + .local-nav-lv4__list, .local-nav-current .local-nav-lv4[data-page-current=true] + .local-nav-lv5__list, .local-nav-current .local-nav-lv5__list > li[data-page-current=true] .local-nav-lv6__list {
    display: block
}

.local-nav-current .local-nav-lv5__list, .local-nav-current .local-nav-lv6__list {
    display: none
}

.local-nav-current .local-nav-lv5__list.is-show, .local-nav-current .local-nav-lv6__list.is-show {
    display: block
}

.local-nav-current .local-nav-lv5__list.is-show {
    padding-bottom: 10px
}

.local-nav-current .local-nav-lv5__list.is-lv6-show {
    display: block
}

@media (min-width: 48em) {
    .local-nav-current .local-nav-lv5__list.is-lv6-show {
        padding-bottom: 10px
    }
}

.local-nav-current .local-nav-lv5__list.is-lv6-show > li.is-show {
    display: block
}

.local-nav-current .local-nav-lv3.local-nav-hdg .is-ignore, .local-nav-current ul:not(.local-nav-lv5__list.is-show,.local-nav-lv5__list.is-lv6-show) .is-ignore, .local-nav-current ul.local-nav-lv5__list.is-lv6-show > li.is-show > .is-ignore {
    font-weight: 600;
    pointer-events: none
}

.local-nav-current .local-nav-lv3.local-nav-hdg .is-ignore:hover, .local-nav-current ul:not(.local-nav-lv5__list.is-show,.local-nav-lv5__list.is-lv6-show) .is-ignore:hover, .local-nav-current ul.local-nav-lv5__list.is-lv6-show > li.is-show > .is-ignore:hover {
    opacity: 1;
    transition: none
}

.local-nav-current .local-nav-lv3.local-nav-hdg .is-ignore::after, .local-nav-current ul:not(.local-nav-lv5__list.is-show,.local-nav-lv5__list.is-lv6-show) .is-ignore::after, .local-nav-current ul.local-nav-lv5__list.is-lv6-show > li.is-show > .is-ignore::after {
    display: none
}

@media (max-width: 47.99em) {
    .local-nav-current .local-nav-lv3__list > li:last-of-type .local-nav-lv4, .local-nav-current .local-nav-lv5__list > li:last-of-type a {
        border-bottom: 0
    }
}

.local-nav-hdg.is-heading {
    display: none
}

.local-nav-current .local-nav-hdg.is-heading.local-nav-lv3 {
    display: block
}

.local-nav-current .local-nav-hdg.is-heading.local-nav-lv3 > span {
    display: block;
    font-weight: 600
}

.local-nav-relative .local-nav-hdg.is-heading {
    display: block
}

.local-nav-hdg.is-heading + .local-nav-lv3__list {
    display: block
}

.local-nav-relative {
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    padding-left: 14px;
    margin-top: 10px
}

@media (min-width: 48em) {
    .local-nav-relative {
        border-bottom: none;
        margin-top: 0
    }
}

.local-nav-relative .local-nav-hdg > span {
    display: block;
    font-weight: 600
}

.local-nav-relative .local-nav-hdg + .local-nav-lv3__list {
    display: block
}

.local-nav-relative .local-nav-item:last-of-type .local-nav-lv3__list > li:last-of-type .local-nav-lv4 {
    border-bottom: none
}

.local-nav-lv2 a, .local-nav-lv3 a, .local-nav-lv4 a, .local-nav-lv5 a, .local-nav-lv6 a {
    display: block;
    position: relative
}

@media (max-width: 47.99em) {
    .local-nav-lv2 a::after, .local-nav-lv3 a::after, .local-nav-lv4 a::after, .local-nav-lv5 a::after, .local-nav-lv6 a::after {
        background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
        background-color: #009682;
        background-position: 7px center;
        background-repeat: no-repeat;
        border-radius: 50%;
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.local-nav-lv3__list a, .local-nav-lv4__list a, .local-nav-lv5__list a, .local-nav-lv6__list a, .local-nav-lv7__list a {
    display: block;
    position: relative
}

@media (max-width: 47.99em) {
    .local-nav-lv3__list a::after, .local-nav-lv4__list a::after, .local-nav-lv5__list a::after, .local-nav-lv6__list a::after, .local-nav-lv7__list a::after {
        background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
        background-color: #009682;
        background-position: 7px center;
        background-repeat: no-repeat;
        border-radius: 50%;
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.local-nav-lv3__list > li > .is-heading, .local-nav-lv4__list > li > .is-heading, .local-nav-lv5__list > li > .is-heading, .local-nav-lv6__list > li > .is-heading, .local-nav-lv7__list > li > .is-heading {
    display: block;
    font-weight: 600;
    pointer-events: none
}

.local-nav-lv3__list > li > .is-heading:hover, .local-nav-lv4__list > li > .is-heading:hover, .local-nav-lv5__list > li > .is-heading:hover, .local-nav-lv6__list > li > .is-heading:hover, .local-nav-lv7__list > li > .is-heading:hover {
    opacity: 1;
    transition: none
}

.local-nav-lv3__list > li > .is-heading::after, .local-nav-lv4__list > li > .is-heading::after, .local-nav-lv5__list > li > .is-heading::after, .local-nav-lv6__list > li > .is-heading::after, .local-nav-lv7__list > li > .is-heading::after {
    display: none
}

.local-nav-lv2 {
    background-color: var(--accent-color);
    border-bottom: 1px solid #e5e5e5;
    color: var(--base-color)
}

[data-local-category=stock] .local-nav-lv2 {
    background-color: var(--stock-color)
}

[data-local-category=fund] .local-nav-lv2 {
    background-color: var(--fund-color)
}

[data-local-category=usstock] .local-nav-lv2 {
    background-color: var(--usstock-color)
}

.local-nav-lv2 > a {
    padding: 14px 45px 15px 15px;
    font-weight: 600
}

@media (min-width: 48em) {
    .local-nav-lv2 > a {
        font-size: 1rem
    }
}

.local-nav-lv2[data-page-current=true] ~ .local-nav-current, .local-nav-lv2[data-page-current=true] ~ .local-nav-other {
    display: none
}

.local-nav-lv3__list {
    display: none;
    padding-left: 14px;
    background: #fff
}

@media (min-width: 48em) {
    .local-nav-lv3__list {
        border-bottom: none
    }
}

.local-nav-lv3__list > li:last-of-type .local-nav-lv4__list, .local-nav-lv3__list > li:last-of-type .local-nav-lv5__list {
    border-bottom: none
}

.local-nav-lv3 {
    border-bottom: 1px solid #e5e5e5
}

.local-nav-lv3 > a, .local-nav-lv3 > span {
    padding: 14px 40px 15px 15px
}

@media (min-width: 48em) {
    .local-nav-lv3 > a, .local-nav-lv3 > span {
        padding: 18px 14px
    }
}

.local-nav-lv4__list {
    display: none;
    margin-left: 10px
}

.local-nav-current .local-nav-lv4__list {
    display: block
}

.local-nav-lv4 {
    border-bottom: 1px solid #e5e5e5
}

.local-nav-lv4 > a {
    padding: 14px 45px 15px 15px
}

@media (min-width: 48em) {
    .local-nav-lv4 > a {
        padding: 14px 26px 15px 10px
    }

    .local-nav-lv3.is-heading + .local-nav-lv3__list .local-nav-lv4 > a {
        padding: 14px 26px 15px 10px
    }
}

.local-nav-lv5__list {
    display: none;
    margin-left: 10px
}

@media (min-width: 48em) {
    .local-nav-lv5__list {
        border-bottom: 1px solid #e5e5e5;
        padding-top: 10px;
        margin-left: 0
    }
}

.local-nav-lv5__list > li > a, .local-nav-lv5__list > li > span {
    padding: 14px 45px 15px 15px
}

@media (max-width: 47.99em) {
    .local-nav-lv5__list > li > a, .local-nav-lv5__list > li > span {
        border-bottom: 1px solid #e5e5e5
    }
}

@media (min-width: 48em) {
    .local-nav-lv5__list > li > a, .local-nav-lv5__list > li > span {
        padding: 7px 36px 7px 20px
    }
}

.local-nav-lv5__list > li:last-of-type .local-nav-lv6__list {
    border-bottom: none
}

.local-nav-lv5__list[data-category-current=true] {
    display: block
}

.local-nav-lv6__list {
    display: none;
    margin-left: 10px
}

@media (min-width: 48em) {
    .local-nav-lv6__list {
        border-bottom: 1px solid #e5e5e5;
        padding-bottom: 10px;
        margin-bottom: 10px
    }
}

.local-nav-lv6__list a {
    padding: 14px 45px 15px 15px
}

@media (min-width: 48em) {
    .local-nav-lv6__list a {
        padding: 5px 36px 7px 20px
    }
}

@media (max-width: 47.99em) {
    .local-nav-lv6__list li:not(:first-of-type) a {
        border-top: 1px solid #e5e5e5
    }
}

.local-nav-lv6__list[data-category-current=true] {
    display: block
}

.is-heading + .local-nav-lv6__list {
    display: block
}

.local-nav-lv7__list {
    display: none;
    padding-left: 10px
}

.local-nav-lv6__list > li[data-page-current=true] .local-nav-lv7__list, .local-nav-lv7__list.is-show {
    display: block
}

.footer-local-nav {
    border-top: 1px solid #e5e5e5;
    margin-top: 50px
}

@media (min-width: 48em) {
    .footer-local-nav {
        display: none
    }
}

.footer-local-nav [data-page-current=true] a {
    color: var(--accent-color)
}

.footer-local-nav .local-nav-other {
    display: block;
    padding-left: 14px;
    margin-top: 10px;
    position: relative
}

.footer-local-nav .local-nav-other > span {
    padding: 14px 26px 15px 15px
}

.footer-local-nav .local-nav-relative {
    display: none;
    padding-left: 0;
    margin-top: 0
}

.footer-local-nav .local-nav-relative .local-nav-item {
    margin-left: 24px
}

.footer-local-nav.is-open .local-nav-relative {
    display: block
}

.local-footer-trigger {
    -webkit-appearance: none;
    appearance: none;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0
}

.local-footer-trigger::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    padding: 0;
    margin: auto 0
}

.footer-local-nav.is-open .local-footer-trigger::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.local-footer-nav {
    background: var(--base-color);
    padding-left: 14px
}

.local-footer-nav .local-nav-lv3.local-nav-hdg .is-ignore, .local-footer-nav ul:not(.local-nav-lv5__list.is-show,.local-nav-lv5__list.is-lv6-show) .is-ignore, .local-footer-nav ul.local-nav-lv5__list.is-lv6-show > li.is-show > .is-ignore {
    font-weight: 600;
    pointer-events: none
}

.local-footer-nav .local-nav-lv3.local-nav-hdg .is-ignore:hover, .local-footer-nav ul:not(.local-nav-lv5__list.is-show,.local-nav-lv5__list.is-lv6-show) .is-ignore:hover, .local-footer-nav ul.local-nav-lv5__list.is-lv6-show > li.is-show > .is-ignore:hover {
    opacity: 1;
    transition: none
}

.local-footer-nav .local-nav-lv3.local-nav-hdg .is-ignore::after, .local-footer-nav ul:not(.local-nav-lv5__list.is-show,.local-nav-lv5__list.is-lv6-show) .is-ignore::after, .local-footer-nav ul.local-nav-lv5__list.is-lv6-show > li.is-show > .is-ignore::after {
    display: none
}

.local-footer-nav .local-nav-lv3.is-heading {
    display: block;
    font-weight: 600
}

.local-footer-nav .local-nav-lv3.is-heading > span {
    display: block
}

.local-footer-nav [data-page-current=true] + .local-nav-lv5__list {
    display: block
}

.local-footer-nav .local-nav-lv3__list {
    padding-left: 0
}

.local-footer-nav .local-nav-lv3__list > li:last-of-type .local-nav-lv4 {
    border-bottom: 0
}

.local-footer-nav .local-nav-lv4__list, .local-footer-nav .local-nav-lv5__list.is-show, .local-footer-nav .local-nav-lv5__list.is-lv6-show, .local-footer-nav .local-nav-lv5__list.is-lv6-show .is-show {
    display: block
}

@media (max-width: 47.99em) {
    .l-breadcrumb {
        order: 1
    }
}

.breadcrumb {
    padding: 20px 15px
}

@media (min-width: 48em) {
    .breadcrumb {
        max-width: 1240px;
        padding: 25px 20px 15px;
        margin: 0 auto
    }

    .l-with-local-nav .breadcrumb {
        padding: 25px 0 8px
    }
}

.breadcrumb__list {
    display: flex;
    flex-wrap: wrap
}

.breadcrumb__list > li {
    font-size: 0.75rem
}

.breadcrumb__list > li > a {
    text-decoration: underline
}

.breadcrumb__list > li > a:hover {
    text-decoration: none
}

.breadcrumb__list > li::after {
    content: ">";
    display: inline-block;
    margin: 0 6px
}

.breadcrumb__list > li:last-of-type::after {
    display: none
}

.footer {
    margin-top: 15%
}

@media (min-width: 48em) {
    .footer {
        margin-top: 18%
    }
}

@media (min-width: 62.5em) {
    .footer {
        margin-top: 16%
    }
}

@media (min-width: 81.25em) {
    .footer {
        margin-top: 13%
    }
}

.footer-top {
    position: relative;
    padding: 0 0 22px;
    background: #078271;
    font-weight: 300
}

@media (min-width: 48em) {
    .footer-top {
        padding: 0 0 42px
    }
}

.footer-top::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 100%;
    height: 0;
    padding-top: 62px;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center top;
    background-size: 614px;
    -webkit-transform: translateY(-99%);
    transform: translateY(-99%)
}

@media screen and (min-width: 614px) {
    .footer-top::before {
        padding-top: 10%;
        background-size: cover
    }
}

@media (min-width: 48em) {
    .footer-top::before {
        padding-top: 144px;
        background-size: 1440px
    }
}

@media (min-width: 81.25em) {
    .footer-top::before {
        padding-top: 10%;
        background-size: cover
    }
}

.footer__inner {
    padding: 0 15px
}

@media (min-width: 48em) {
    .footer__inner {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 20px
    }
}

.footer-nav {
    display: none
}

@media (min-width: 48em) {
    .footer-nav {
        display: flex;
        margin-bottom: 50px
    }
}

.footer-nav > li {
    color: #fff
}

@media (min-width: 48em) {
    .footer-nav > li {
        width: 25%;
        padding: 0 15px 10px;
        border-left: 1px solid rgba(255, 255, 255, .5)
    }
}

.footer-nav > li:first-child {
    padding-left: 0;
    border-left: none
}

@media (max-width: 47.99em) {
    .footer-nav + .footer-nav {
        border-top: 1px solid rgba(255, 255, 255, .5)
    }
}

@media (min-width: 48em) {
    .footer-nav--tool {
        margin-top: 50px
    }

    .footer-nav--campaign {
        margin-top: 90px
    }

    .footer-nav--stock {
        margin-top: 40px
    }
}

@media (max-width: 47.99em) {
    .footer-nav__lv2 {
        display: flex;
        flex-wrap: wrap;
        width: 100%
    }

    .footer-nav__lv2 > li {
        display: flex;
        flex-wrap: wrap;
        width: 50%;
        margin: 7px 0
    }
}

@media (min-width: 48em) {
    .footer-nav__lv2 > li {
        margin-bottom: 30px
    }
}

.footer-nav__lv2 > li:last-child {
    margin-bottom: 0
}

.footer-nav__lv2 > li > a {
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .footer-nav__lv2 > li > a {
        font-size: 1.125rem;
        font-weight: 600
    }
}

@media (max-width: 47.99em) {
    .footer-nav__lv3 {
        display: none
    }
}

@media (min-width: 48em) {
    .footer-nav__lv3 {
        margin: 4px 0 -12px
    }

    .footer-nav__lv3 > li {
        margin: 12px 0
    }
}

.footer-nav__lv3 > li > a {
    font-size: 1rem
}

@media (max-width: 47.99em) {
    .footer-nav__lv4 {
        display: none
    }
}

@media (min-width: 48em) {
    .footer-nav__lv4 {
        margin-left: 20px
    }

    .footer-nav__lv4 > li {
        margin: 14px 0
    }
}

.footer-nav__lv4 > li > a {
    font-size: 0.875rem
}

.footer-nav-sp {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 20px
}

@media (min-width: 48em) {
    .footer-nav-sp {
        display: none
    }
}

.footer-nav-sp + .footer-nav-sp {
    padding: 20px 0 8px;
    border-top: 1px solid rgba(255, 255, 255, .5)
}

.footer-nav-sp > li {
    width: 50%
}

.footer-nav-sp > li.footer-nav-sp--first {
    width: 100%
}

.footer-nav-sp > li > a {
    display: inline-block;
    padding: 0 10px 12px 0;
    font-size: 0.875rem;
    color: #fff
}

.footer-link-external {
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, .5)
}

@media (min-width: 48em) {
    .footer-link-external {
        display: flex;
        flex-wrap: wrap;
        margin: -8px -20px;
        padding-top: 42px
    }
}

.footer-link-external > li {
    margin-bottom: 12px
}

@media (min-width: 48em) {
    .footer-link-external > li {
        margin: 8px 20px
    }
}

.footer-link-external > li > a {
    color: #fff;
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .footer-link-external > li > a {
        font-size: 1rem
    }
}

.footer-link-external > li > a > img {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 6px;
    vertical-align: -1px
}

.footer-bottom {
    padding: 24px 0 44px;
    background: #fff
}

@media (min-width: 48em) {
    .footer-bottom {
        padding: 40px 0 90px
    }
}

.footer-link {
    display: flex;
    flex-wrap: wrap;
    margin: -6px 0;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, .15)
}

@media (min-width: 48em) {
    .footer-link {
        padding-bottom: 34px
    }
}

.footer-link > li {
    width: 50%;
    margin: 6px 0
}

@media (min-width: 48em) {
    .footer-link > li {
        width: 25%;
        padding-right: 10px
    }
}

.footer-link > li:nth-child(odd) {
    padding-right: 20px
}

@media (min-width: 48em) {
    .footer-link > li:nth-child(odd) {
        padding-right: 10px
    }
}

.footer-link > li > a {
    font-size: 0.875rem
}

.footer-hdg {
    margin-top: 22px;
    font-weight: 600;
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .footer-hdg {
        margin-top: 40px
    }
}

.footer-txt {
    margin-top: 12px;
    font-size: 0.75rem;
    line-height: 1.6
}

@media (min-width: 48em) {
    .footer-txt {
        line-height: 2
    }
}

.footer-copyright {
    margin: 18px 15px 0;
    padding-top: 18px;
    border-top: 1px solid rgba(0, 0, 0, .15)
}

@media (min-width: 48em) {
    .footer-copyright {
        margin: 34px 0 0;
        padding-top: 34px
    }
}

.footer-copyright .footer__inner {
    padding: 0;
    color: #707070
}

@media (min-width: 48em) {
    .footer-copyright .footer__inner {
        display: flex;
        justify-content: space-between;
        padding: 0 20px
    }
}

.footer-copyright small {
    display: block;
    margin-top: 20px;
    font-size: 0.875rem;
    text-align: center
}

@media (min-width: 48em) {
    .footer-copyright small {
        margin-top: 0;
        text-align: left
    }
}

.footer-corporate {
    padding-right: 20px;
    font-size: 0.75rem
}

@media (min-width: 48em) {
    .footer-corporate {
        padding-right: 20px
    }
}

.footer-corporate > span, .footer-corporate > a {
    display: block;
    padding-bottom: 4px
}

@media (min-width: 48em) {
    .footer-corporate > span, .footer-corporate > a {
        display: inline-block;
        padding-right: 15px;
        padding-bottom: 0;
        font-weight: 600
    }
}

.apply-area {
    background-color: #e9f4f1;
    padding: 40px 0;
    margin-top: 40px
}

@media (min-width: 48em) {
    .apply-area {
        padding: 60px;
        margin-top: 60px
    }
}

.apply-area-title {
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .apply-area-title {
        font-size: 1.875rem
    }
}

.apply-area-text {
    text-align: center;
    margin-top: 30px
}

.apply-area-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    margin-top: 30px
}

.apply-area-buttons > * + * {
    margin-top: 18px
}

.apply-area-list {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px
}

@media (max-width: 47.99em) {
    .apply-area-list {
        flex-direction: column;
        align-items: center
    }
}

@media (min-width: 48em) {
    .apply-area-list {
        margin-top: 40px;
        gap: 40px
    }
}

.apply-cta-area {
    padding: 40px 0
}

.apply-cta-title {
    text-align: center;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 25px
}

@media (min-width: 48em) {
    .apply-cta-title {
        font-size: 1.875rem
    }
}

.apply-cta-item {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 10px;
    padding: 30px 20px;
    text-align: center
}

@media (min-width: 48em) {
    .apply-cta-item {
        padding: 30px
    }
}

.apply-cta-header {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 20px
}

.apply-cta-button.button {
    background-color: #e83a3a;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 70px;
    padding: 8px 15px
}

.apply-cta-button > span {
    font-size: 0.875rem
}

.apply-cta-button.theme-cta-button-login {
    background-color: var(--accent-color)
}

.apply-cta-link {
    margin-top: 20px
}

.apply-call {
    text-align: center
}

.apply-call .apply-call-title {
    font-size: 1.25rem;
    font-weight: bold
}

.apply-call .apply-call-numberlist {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0 20px
}

.account-open-area {
    background-color: var(--base-color);
    border: 2px solid var(--accent-color);
    border-radius: 10px;
    padding: 40px 20px
}

@media (min-width: 48em) {
    .account-open-area {
        padding: 50px 20px
    }
}

.account-open-title {
    font-size: 1.25rem;
    text-align: center;
    font-weight: 600
}

@media (min-width: 48em) {
    .account-open-title {
        font-size: 1.875rem
    }
}

.account-open-text {
    text-align: center;
    margin-top: 25px
}

@media (min-width: 48em) {
    .account-open-text {
        margin-top: 35px
    }
}

.account-open-button {
    margin-top: 30px
}

@media (min-width: 48em) {
    .account-open-button {
        margin-top: 45px
    }
}

.account-open-link {
    text-align: center;
    margin-top: 25px
}

.account-step-area {
    background-color: var(--green-color);
    padding: 40px 20px
}

@media (min-width: 48em) {
    .account-step-area {
        padding: 65px 20px
    }
}

.l-with-local-nav .account-step-area {
    padding: 0 20px
}

@media (min-width: 48em) {
    .l-with-local-nav .account-step-area {
        padding: 0 20px
    }
}

.l-with-local-nav .account-step-area .account-step-list {
    border-top: 0
}

.account-step-title {
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px
}

@media (min-width: 48em) {
    .account-step-title {
        margin-bottom: 38px
    }
}

h2.account-step-title {
    font-size: 1.25rem
}

@media (min-width: 48em) {
    h2.account-step-title {
        font-size: 1.5rem
    }
}

h3.account-step-title {
    font-size: 1.125rem
}

@media (min-width: 48em) {
    h3.account-step-title {
        font-size: 1.5rem
    }
}

.account-step-text {
    text-align: center
}

.account-step-list {
    border-top: 1px solid var(--accent-color);
    border-bottom: 1px solid var(--accent-color);
    padding: 30px 0;
    margin: 20px auto 0;
    width: 100%;
    max-width: 1240px
}

@media (min-width: 48em) {
    .account-step-list {
        padding: 65px 0;
        margin: 40px auto 0
    }
}

.l-with-local-nav .account-step-list {
    margin: 0 auto
}

.account-step-items {
    display: flex;
    flex-wrap: wrap
}

@media (max-width: 47.99em) {
    .account-step-items {
        flex-direction: column
    }
}

.account-step-item {
    flex: 1 0 33.33333%;
    position: relative;
    padding: 10px 15px
}

@media (max-width: 47.99em) {
    .account-step-item {
        padding: 30px 10px 15px;
        flex: 1 0 auto
    }
}

.account-step-item + .account-step-item::before {
    border-top: 10px solid #7fcac0;
    border-right: 14px solid rgba(0, 0, 0, 0);
    border-bottom: 10px solid rgba(0, 0, 0, 0);
    border-left: 14px solid rgba(0, 0, 0, 0);
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

@media (min-width: 48em) {
    .account-step-item + .account-step-item::before {
        border-top: 14px solid rgba(0, 0, 0, 0);
        border-right: 10px solid rgba(0, 0, 0, 0);
        border-bottom: 14px solid rgba(0, 0, 0, 0);
        border-left: 10px solid #7fcac0;
        top: 0;
        right: auto;
        bottom: 0;
        left: 0;
        margin: auto 0;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.account-step-action {
    font-size: 1rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .account-step-action {
        font-size: 1.125rem
    }
}

.account-step-pic img {
    margin: 0 auto
}

.account-step-buttons {
    margin-top: 30px
}

@media (min-width: 48em) {
    .account-step-buttons {
        margin-top: 40px
    }
}

.account-step-buttons > .button + .button {
    margin-top: 20px
}

.account-step-contact {
    background-color: var(--base-color);
    border-radius: 10px;
    display: flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    padding: 20px;
    margin-top: 32px
}

@media (min-width: 48em) {
    .account-step-contact {
        padding: 30px;
        margin-top: 35px
    }
}

.account-step-contact-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-right: 22px
}

@media (max-width: 47.99em) {
    .account-step-contact-title {
        width: 100%;
        font-size: 1rem
    }
}

.account-step-free-tel {
    color: var(--accent-color);
    font-size: 1.875rem;
    font-weight: 600;
    padding: 0 18px;
    display: flex;
    align-items: baseline
}

@media (max-width: 47.99em) {
    .account-step-free-tel {
        width: 100%;
        justify-content: center
    }
}

.account-step-free-tel > span {
    margin-right: 8px
}

.account-step-ip-tel {
    color: var(--accent-color);
    font-size: 1.0625rem;
    font-weight: 600
}

@media (max-width: 47.99em) {
    .account-step-ip-tel {
        width: 100%;
        text-align: center
    }
}

.account-step-reception {
    text-align: center;
    width: 100%;
    margin-top: 5px
}

.adobe-reader {
    background-color: #f7f7f7;
    border-radius: 10px;
    display: flex;
    padding: 30px
}

@media (max-width: 47.99em) {
    .adobe-reader {
        display: none
    }
}

.adobe-reader-logo {
    width: 158px;
    flex-shrink: 0;
    margin-right: 30px
}

.adobe-reader-link {
    margin-top: 20px
}

.adobe-reader-link .text-link {
    text-decoration: none
}

.accordion-box {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    padding: 10px 15px;
    position: relative
}

@media (min-width: 48em) {
    .accordion-box.theme-border-green {
        padding: 10px 15px 0
    }
}

.accordion-box-title {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    padding: 10px 25px 10px 0
}

@media (max-width: 47.99em) {
    .accordion-box-title {
        cursor: pointer;
        position: relative
    }
}

@media (min-width: 48em) {
    .accordion-box-title {
        font-size: 1.125rem;
        padding: 10px 10px 15px 0
    }
}

.accordion .accordion-box-title {
    cursor: pointer;
    position: relative;
    padding: 10px 10px 10px 0
}

@media (min-width: 48em) {
    .accordion.is-open .accordion-box-title {
        padding: 10px 0 15px
    }
}

@media (max-width: 47.99em) {
    .accordion-box.is-open .accordion-box-title {
        padding: 10px 25px 20px 0
    }

    .accordion-box-title a {
        pointer-events: none
    }
}

.accordion-box-title a::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.accordion-box-trigger {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    padding: 0;
    margin: auto 0
}

@media (min-width: 48em) {
    .accordion .accordion-box-trigger {
        display: block;
        top: -4px
    }
}

.accordion-box.is-open .accordion-box-trigger {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    top: -8px
}

@media (min-width: 48em) {
    .accordion-box-trigger {
        display: none
    }
}

.accordion-box-contents {
    display: none;
    padding-bottom: 10px
}

@media (min-width: 48em) {
    .accordion-box-contents {
        display: block
    }

    .accordion .accordion-box-contents {
        display: none
    }
}

.accordion-box.is-open .accordion-box-contents {
    display: block
}

@media (min-width: 48em) {
    .accordion-box.theme-border-green .accordion-box-contents {
        padding-bottom: 0
    }
}

.accordion-box-menu {
    border-top: 1px dashed #ccc;
    margin: 0 -15px
}

.accordion-box-menu > li {
    padding: 15px 0 15px 15px;
    margin: 0 15px
}

.accordion-box-menu > li > a {
    display: flex;
    align-items: center
}

.accordion-box-menu > li > a::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    content: "";
    width: 18px;
    height: 18px;
    margin-left: auto;
    vertical-align: -3px;
    flex-shrink: 0
}

.accordion-box-menu > li:first-of-type {
    padding: 15px 0
}

.accordion-box-menu > li + li {
    border-top: 1px dashed #ccc
}

.accordion-box-contents {
    display: none
}

@media (min-width: 48em) {
    .accordion-box-contents {
        display: block
    }
}

.accordion-box.is-open .accordion-box-contents {
    display: block
}

.accordion-box-bottom {
    display: block;
    text-align: right;
    width: 100%;
    padding-top: 20px;
    margin-top: auto
}

@media (min-width: 48em) {
    .accordion-box-bottom {
        display: none
    }
}

.accordion-box-link {
    display: block;
    text-align: right;
    width: 100%;
    padding-top: 20px;
    margin-top: auto
}

.box {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 10px;
    display: block;
    padding: 25px 20px
}

@media (min-width: 48em) {
    .box {
        padding: 30px 20px
    }
}

.box-header {
    margin-bottom: 15px
}

.box-title {
    font-size: 1.125rem;
    font-weight: 600
}

.box-label-title {
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 600
}

.box-label-title > .label {
    margin-right: 8px
}

.box-error-title {
    color: var(--caution-color);
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 15px
}

.box-emphasis-title {
    color: var(--accent-color);
    font-size: 1.5rem;
    font-weight: 600;
    text-align: center
}

.box-pictogram {
    display: block;
    text-align: center;
    margin-top: 15px
}

.box-pictogram > img {
    margin: 0 auto
}

.box-message dt {
    display: inline-block;
    font-weight: 600
}

.box-message dd {
    display: inline-block
}

.box-list {
    margin-top: 30px
}

.box-caption {
    margin-top: 20px
}

.box-return-example {
    margin-top: 15px;
    font-size: 1rem
}

.box-return-example .example-list:nth-child(n+2) {
    margin-top: 15px
}

.box-return-example .example-title {
    font-weight: 600
}

.box-return-example .example-body {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px
}

.box-return-example .example-item .example-text-num {
    margin-left: 5px;
    color: var(--accent-text-color);
    font-size: 2.25rem;
    font-weight: 600
}

.box-return-example .example-item .example-text-unit {
    color: var(--accent-text-color)
}

.block-list {
    display: flex;
    flex-direction: column
}

@media (min-width: 48em) {
    .block-list {
        flex-direction: row
    }
}

.block {
    border: 1px solid #ccc;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    padding: 20px;
    font-size: 0.875rem;
    flex: 1 1 auto
}

.block-link {
    display: flex;
    align-items: center;
    pointer-events: none;
    position: relative
}

@media (min-width: 48em) {
    .block-link {
        pointer-events: auto
    }

    .block-link * + * {
        margin-top: 20px
    }
}

.block-title {
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .block-title {
        display: block
    }
}

.block-title::after {
    display: none
}

@media (min-width: 48em) {
    .block-title::after {
        display: inline-block
    }
}

.block-trigger {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 14px;
    height: 14px;
    margin-left: auto;
    pointer-events: auto;
    position: relative;
    padding: 0
}

@media (min-width: 48em) {
    .block-trigger {
        display: none
    }
}

.block.is-open .block-trigger {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.block-trigger::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.block-contents {
    display: none;
    padding-top: 10px
}

@media (min-width: 48em) {
    .block-contents {
        display: block;
        padding-top: 20px
    }
}

.block.is-open .block-contents {
    display: block
}

.block-bottom {
    margin-top: 20px
}

@media (min-width: 48em) {
    .block-bottom {
        display: none
    }
}

.block-bottom-area {
    padding-top: 20px;
    margin-top: auto;
    text-align: right
}

@media (max-width: 47.99em) {
    .block-bottom-area {
        display: none
    }

    .block.is-open .block-bottom-area {
        display: block
    }
}

.button-list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
    width: 100%
}

@media (max-width: 47.99em) {
    .button-list {
        align-items: center
    }

    .button-list > li {
        width: 100%
    }

    .button-list > li .button {
        width: 100%;
        max-width: none
    }
}

@media (min-width: 48em) {
    .button-list {
        flex-direction: row
    }
}

.button-list[data-type=wide] > li {
    width: 100%
}

@media (min-width: 48em) {
    .button-list[data-type=wide] > li {
        width: 340px
    }
}

.button-list[data-col] > li {
    display: flex;
    flex: 1 0 0
}

.button-list[data-col] > li .button {
    max-width: none
}

.button-list.button-list-col-2 {
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap
}

.button-list.button-list-col-2 > .button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(50% - 6.5px);
    margin: 0
}

.button-list.button-list-col-2 > .button:nth-of-type(2n) {
    margin-left: 13px
}

.button-list.button-list-col-2 > .button:nth-of-type(n+3) {
    margin-top: 10px
}

@media (min-width: 48em) {
    .button-list.md\:button-list-col-auto {
        flex-wrap: nowrap
    }

    .button-list.md\:button-list-col-auto > .button {
        width: 100%
    }

    .button-list.md\:button-list-col-auto > .button:nth-of-type(n+3) {
        margin-top: 0
    }

    .button-list.md\:button-list-col-auto > .button + .button {
        margin-left: 20px
    }
}

.button-group {
    gap: 12px
}

@media (min-width: 48em) {
    .button-group {
        gap: 20px 11px
    }
}

.stock-button-group {
    display: flex;
    gap: 11px
}

@media (min-width: 48em) {
    .stock-button-group {
        gap: 20px
    }
}

.search-button-group {
    display: flex;
    gap: 11px
}

@media (min-width: 48em) {
    .search-button-group {
        gap: 20px
    }
}

.button {
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 10px;
    cursor: pointer;
    font-weight: 600;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative
}

.button[target=_blank] {
    padding: 15px 40px
}

.button[target=_blank]:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    right: 16px;
    bottom: 0;
    margin: auto 0
}

.grid .button {
    width: 100%;
    max-width: none
}

.button[data-micromodal-trigger] {
    border-color: rgba(0, 0, 0, .1);
    padding: 15px 40px;
    cursor: pointer
}

.button[data-micromodal-trigger]:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    right: 16px;
    bottom: 0;
    margin: auto 0
}

.button-icon {
    display: inline-block;
    margin-right: 8px;
    vertical-align: -4px
}

.keyword-button-group {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap: 10px
}

@media (min-width: 768px) {
    .keyword-button-group {
        grid-template-columns:repeat(5, minmax(0, 1fr))
    }
}

.keyword-button {
    border: 1px solid var(--gray-border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px
}

.code-block {
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 10px
}

.code-block + .code-block {
    margin-top: 35px
}

.code-block .footer-local-nav {
    display: none
}

.code-block-label {
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    font-size: 1.125rem;
    font-weight: 600;
    padding: 15px
}

.code-block-label-name {
    padding: 4px;
    margin-right: 8px
}

.code-block-module {
    background-color: #fff
}

@media (min-width: 48em) {
    .code-block-module {
        border: 15px inset rgba(0, 0, 0, .08)
    }
}

.code-block-code {
    background-color: #3b3b3b;
    color: #fff;
    padding: 15px;
    word-break: break-all;
    white-space: break-spaces
}

.code-block-summary, .code-block-class {
    padding: 15px
}

.code-block-class {
    border-top: 1px solid rgba(0, 0, 0, .1)
}

.calendar {
    border-collapse: collapse;
    font-family: var(--en-font);
    width: 100%;
    background-color: #fff
}

.calendar > thead th {
    border: 1px solid #fff;
    background-color: #078271;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    padding: 11px
}

.calendar > tbody td {
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 16px 8px;
    font-size: 16px;
    text-align: center
}

.calendar > tbody td:empty {
    background-color: #f7f7f7
}

.calendar > tbody td:nth-child(1) {
    color: var(--caution-color)
}

.calendar > tbody td:nth-child(7) {
    color: #2a84dd
}

.calendar > tbody td.cell-rights-quotation {
    background-color: rgba(238, 1, 1, .1)
}

.calendar > tbody td.cell-ex-rights {
    background-color: rgba(42, 132, 221, .1)
}

.calendar > tbody td.cell-rights-allotment {
    background-color: rgba(7, 130, 113, .1)
}

@media (min-width: 48em) {
    .calendar > tbody th.theme-cell-green {
        width: auto
    }
}

.calendar-legend {
    border: 1px solid var(--gray-border-color)
}

.calendar-legend dl {
    background-color: #fff;
    font-size: 14px
}

@media (min-width: 48em) {
    .calendar-legend dl {
        display: flex
    }
}

.calendar-legend dl:nth-child(n+2) {
    border-top: 1px solid var(--gray-border-color)
}

.calendar-legend dt {
    padding: 14px;
    font-weight: 600
}

.calendar-legend dt.cell-rights-quotation {
    background-color: rgba(238, 1, 1, .1)
}

.calendar-legend dt.cell-ex-rights {
    background-color: rgba(42, 132, 221, .1)
}

.calendar-legend dt.cell-rights-allotment {
    background-color: rgba(7, 130, 113, .1)
}

@media (min-width: 48em) {
    .calendar-legend dt {
        flex-shrink: 0;
        flex-basis: 28.5714285714%
    }
}

.calendar-legend dd {
    padding: 14px
}

@media (min-width: 48em) {
    .calendar-legend dd {
        flex-grow: 1
    }
}

.card {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 10px;
    -webkit-filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative
}

@media (max-width: 47.99em) {
    .card.sp-card-direction-row {
        flex-direction: row;
        align-items: center
    }
}

.card.sp-no-img {
    flex-direction: row
}

.card-inner {
    display: flex;
    flex-direction: column;
    padding: 30px 15px;
    width: 100%
}

@media (min-width: 48em) {
    .card-inner {
        padding: 30px 20px
    }
}

@media (max-width: 47.99em) {
    .sp-no-img .card-inner {
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        padding: 20px 40px 20px 20px;
        width: 100%
    }
}

.card-title {
    font-size: 1.125rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .card-title {
        font-size: 1.25rem
    }
}

.card-link-title {
    font-size: 1.125rem;
    text-align: center;
    font-weight: 600
}

@media (min-width: 48em) {
    .card-link-title {
        font-size: 1.25rem
    }
}

.card-link-title::after {
    background-color: var(--accent-color);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

@media (min-width: 48em) {
    .card-link-title::after {
        vertical-align: -2px
    }
}

.card[target=_blank] .card-link-title::after {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-size: contain;
    border-radius: 0;
    width: 14px;
    height: 14px;
    vertical-align: 0
}

@media (max-width: 47.99em) {
    .sp-no-img .card-link-title {
        text-align: left
    }

    .sp-no-img .card-link-title::after {
        position: absolute;
        top: 0;
        right: 15px;
        bottom: 0;
        margin: auto 0;
        vertical-align: 0
    }
}

.card-thumb {
    flex-shrink: 0
}

.card-thumb img {
    width: 100%
}

@media (max-width: 47.99em) {
    .sp-card-direction-row .card-thumb {
        margin: 0 9px
    }
}

.card-img {
    padding: 10px
}

.card-img img {
    margin: 0 auto
}

@media (max-width: 47.99em) {
    .sp-no-img .card-img {
        display: none
    }
}

.card-description {
    font-size: 1rem;
    margin-top: 10px;
    height: 100%
}

.card-small-description {
    font-size: 0.875rem;
    margin-top: 5px;
    height: 100%
}

.card-link {
    display: inline-block;
    margin-top: 30px;
    margin-left: auto
}

.link-card {
    transition: opacity .15s ease-out
}

.ranking-card .ranking-card-title {
    display: flex
}

.ranking-card .ranking-card-title .title-number {
    border-radius: 50%;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 30px;
    height: 30px
}

.ranking-card .ranking-card-title .title-number[data-rank="1"], .ranking-card .ranking-card-title .title-number[data-rank="2"], .ranking-card .ranking-card-title .title-number[data-rank="3"] {
    color: var(--base-color)
}

.ranking-card .ranking-card-title .title-number[data-rank="1"] {
    background-color: #c4a96c
}

.ranking-card .ranking-card-title .title-number[data-rank="2"] {
    background-color: #959595
}

.ranking-card .ranking-card-title .title-number[data-rank="3"] {
    background-color: #bc8a70
}

.ranking-card .ranking-card-title .title-number:not([data-rank="1"]), .ranking-card .ranking-card-title .title-number:not([data-rank="2"]), .ranking-card .ranking-card-title .title-number:not([data-rank="3"]), .ranking-card .ranking-card-title .title-number:not([data-rank]) {
    border: 1px solid #ccc
}

.ranking-card .ranking-card-title .title-text {
    flex-grow: 1;
    margin-left: 8px;
    font-size: 20px;
    font-weight: 600
}

.ranking-card .ranking-card-body {
    margin-top: 15px;
    font-size: 1rem
}

.ranking-card .ranking-card-body > *:nth-child(n+2) {
    margin-top: 5px
}

.ranking-card .ranking-card-image {
    display: block;
    margin-top: 25px;
    border: 1px solid #ccc
}

.container {
    width: 100%;
    padding: 0 15px
}

@media (min-width: 48em) {
    .container {
        max-width: 1240px;
        padding: 0 20px;
        margin: 0 auto
    }
}

.contributor {
    background-color: var(--gray-color);
    border-radius: 10px;
    display: grid;
    grid-template-columns:auto 1fr;
    grid-template-rows:-webkit-max-content -webkit-max-content auto;
    grid-template-rows:max-content max-content auto;
    padding: 20px 15px;
    gap: 18px 20px
}

@media (min-width: 48em) {
    .contributor {
        padding: 30px
    }
}

.contributor-photo {
    grid-column: 1;
    grid-row: 1/4
}

.contributor-name {
    font-size: 0.9375rem;
    font-weight: 600;
    grid-column: 2;
    grid-row: 1
}

.contributor-profile {
    font-size: 0.9375rem;
    grid-column: 2;
    grid-row: 2
}

.contributor-description {
    font-size: 0.875rem;
    grid-column: 1/3;
    grid-row: 3
}

@media (max-width: 47.99em) {
    .contributor-description {
        margin-top: 20px
    }
}

@media (min-width: 48em) {
    .contributor-description {
        grid-column: 2;
        grid-row: 3
    }
}

.contact-area-title {
    text-align: center;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 30px
}

@media (min-width: 48em) {
    .contact-area-title {
        font-size: 1.875rem
    }
}

.contact-area-item {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 10px;
    padding: 30px;
    text-align: center;
    font-weight: 600
}

.contact-area-header {
    margin-bottom: 10px
}

.contact-area-number {
    color: #009682;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.875rem;
    font-weight: 600
}

.contact-area-number > img {
    margin-right: 8px
}

.contact-area-tel {
    color: #009682;
    font-weight: 600
}

.contact-area-reception {
    font-weight: 400;
    margin-top: 14px
}

.checkbox {
    display: flex;
    position: relative;
    font-size: 0.9375rem
}

.checkbox input[type=checkbox] {
    opacity: 0;
    position: absolute
}

.checkbox label {
    border-radius: 10px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .15);
    -webkit-filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    padding: 13px 16px;
    position: relative;
    display: flex;
    align-items: center;
    width: 100%
}

.checkbox label::before, .checkbox label::after {
    content: "";
    display: inline-block;
    flex-shrink: 0
}

.checkbox label::before {
    background-position: center;
    background-repeat: no-repeat;
    background-size: 80%;
    border: 1px solid #999;
    border-radius: 2px;
    height: 18px;
    width: 18px;
    top: 0;
    left: 15px;
    bottom: 0;
    margin: auto 10px auto 0
}

.checkbox input[type=checkbox]:focus + label::before {
    outline: #3b99fc auto 5px
}

.checkbox input[type=checkbox]:checked + label::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.checkbox label::after {
    background-color: var(--accent-color);
    border-radius: 45px;
    padding: 1px 8px;
    content: attr(data-number);
    color: #fff;
    display: block;
    font-weight: 600;
    margin-left: auto
}

.checkbox label[disabled] {
    pointer-events: none;
    opacity: .4
}

.checkbox .score {
    border: 1px solid #ccc;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center
}

.checkbox:first-of-type .score, .checkbox:nth-of-type(2) .score, .checkbox:nth-of-type(3) .score {
    border: 0;
    color: #fff
}

.checkbox:first-of-type .score {
    background-color: #c4a96c
}

.checkbox:nth-of-type(2) .score {
    background-color: #959595
}

.checkbox:nth-of-type(3) .score {
    background-color: #bc8a70
}

.divider {
    border-top: 1px solid #ccc;
    width: 100%;
    height: 0
}

.image {
    display: inline-flex;
    flex-direction: column;
    vertical-align: middle
}

.image-picture {
    display: flex;
    align-items: flex-start
}

.image-movie {
    display: block;
    width: 100%;
    padding-top: 56.5%;
    position: relative;
    line-height: 0
}

.image-movie > iframe {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.image-caption {
    margin-top: 20px
}

.list {
    display: grid;
    gap: 15px;
    width: 100%
}

.list > li {
    line-height: 1.4
}

.list > li > .list {
    padding-left: 1em
}

.list .link {
    display: inline
}

.question-list a {
    text-decoration: underline
}

.question-list[data-api*=faq-] li:nth-of-type(n+6) {
    display: none
}

.with-list-title {
    background-color: #f7f7f7;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    padding: 30px 20px
}

@media (min-width: 48em) {
    .with-list-title {
        flex-direction: row
    }
}

.with-list-title li {
    display: block
}

@media (max-width: 47.99em) {
    .with-list-title li {
        margin-top: 10px
    }
}

@media (min-width: 48em) {
    .with-list-title li {
        border-left: 1px solid #ccc;
        display: inline-block;
        padding: 0 20px
    }
}

.list-title {
    font-size: 1rem;
    font-weight: 600;
    display: inline-block;
    flex-shrink: 0;
    padding-top: 8px;
    padding-right: 40px
}

@media (max-width: 47.99em) {
    .more-list .more-list-item:nth-of-type(n+4) {
        display: none
    }

    .more-list.is-open .more-list-item:nth-of-type(n+4) {
        display: flex
    }
}

@media (min-width: 48em) {
    .more-list .more-list-item:nth-of-type(n+4), .more-list.is-open .more-list-item:nth-of-type(n+4) {
        display: flex
    }
}

.more-list-button {
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    cursor: pointer;
    font-weight: 600;
    width: 160px;
    margin: 20px auto 0;
    padding: 10px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative
}

@media (min-width: 48em) {
    .more-list-button {
        display: none
    }
}

.more-list-button::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    margin-left: 10px
}

.more-list.is-open .more-list-button::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.link-list li {
    display: inline-block;
    margin: 8px 0
}

@media (min-width: 48em) {
    .link-list li {
        margin: 0
    }
}

.link {
    display: inline-block
}

.link::after {
    content: "";
    display: inline-block
}

.link:not([target=_blank])::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 6px center;
    background-size: 6.5px;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -4px
}

@media (min-width: 48em) {
    .link:not([target=_blank])::after {
        vertical-align: -3px
    }
}

.link.is-blank-link::after, .link[target=_blank]::after {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border-radius: 0;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -1px
}

.link[target=_blank][href*=".pdf"]::after, .link:not([target=_blank])[href*=".pdf"]::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px;
    border-radius: 0
}

.link[target=_blank][href*=".xlsx"]::after, .link:not([target=_blank])[href*=".xlsx"]::after, .link[target=_blank][href*=".csv"]::after, .link:not([target=_blank])[href*=".csv"]::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

.anchor-link {
    display: inline-flex;
    align-items: center
}

.anchor-link::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 35%;
    content: "";
    display: block;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.external > img {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 6px;
    vertical-align: -1px
}

.text-link {
    text-decoration: underline
}

.text-link:hover {
    text-decoration: none
}

.text-link.is-blank-link::after, .text-link[target=_blank]::after, .text-link[data-micromodal-trigger]::after {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border-radius: 0;
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -1px
}

.text-link[data-micromodal-trigger] {
    cursor: pointer;
    text-decoration: none
}

.text-link[data-micromodal-trigger]:hover {
    text-decoration: underline
}

.text-link[target=_blank][href*=".pdf"]::after, .text-link:not([target=_blank])[href*=".pdf"]::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px;
    border-radius: 0
}

.text-link[target=_blank][href*=".xlsx"]::after, .text-link:not([target=_blank])[href*=".xlsx"]::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

.image-link {
    display: inline-block
}

.movie-link {
    display: flex;
    align-items: center
}

.movie-link > * {
    flex: 1 1 50%
}

.movie-link:not([target=_blank]) .movie-link-title::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

.movie-link[target=_blank] .movie-link-title::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -1px
}

.movie-link-column {
    display: flex;
    flex-direction: column
}

.movie-link-column .movie-link-thumb {
    margin-right: 0
}

.movie-link-thumb {
    margin-right: 15px;
    position: relative
}

.movie-link-thumb::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.movie-link-thumb img {
    width: 100%
}

.movie-link-title {
    font-weight: 600
}

.movie-link-title::after {
    content: "";
    display: inline-block
}

.movie-link-description {
    font-size: 0.875rem;
    margin-top: 10px
}

.page-back-link::before {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    content: "";
    display: inline-block;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    width: 18px;
    height: 18px;
    margin-right: 8px;
    vertical-align: -4px
}

@media (min-width: 48em) {
    .page-back-link::before {
        vertical-align: -3px
    }
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    gap: 0 10px
}

.pagination > li {
    display: flex;
    max-width: 34px;
    width: 100%;
    justify-content: center;
    align-items: center
}

.pagination > li > a, .pagination > li > button {
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 4px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    height: 40px;
    width: 100%;
    font-size: 0.875rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center
}

@media (max-width: 47.99em) {
    .pagination > li > a:hover, .pagination > li > button:hover {
        opacity: 1 !important
    }
}

.pagination > li > button {
    appearance: none;
    -webkit-appearance: none
}

.pagination > li.is-current > a, .pagination > li.is-current > button {
    background-color: var(--accent-color);
    color: var(--base-color);
    pointer-events: none;
    opacity: 1 !important
}

.pagination .pagination-dot {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    background-position: center center;
    background-repeat: no-repeat;
    color: var(--base-color);
    width: 18px;
    min-width: 16px;
    margin: 0 -5px
}

.pagination .pagination-prev, .pagination .pagination-next {
    color: var(--base-color);
    max-width: 40px
}

.pagination .pagination-prev a, .pagination .pagination-prev button, .pagination .pagination-next a, .pagination .pagination-next button {
    position: relative;
    cursor: pointer
}

.pagination .pagination-prev a::before, .pagination .pagination-prev button::before, .pagination .pagination-next a::before, .pagination .pagination-next button::before {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 8px;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transform-origin: center;
    transform-origin: center;
    position: absolute;
    top: 0;
    left: 0
}

.pagination .pagination-prev.is-inactive a, .pagination .pagination-prev.is-inactive button, .pagination .pagination-next.is-inactive a, .pagination .pagination-next.is-inactive button {
    pointer-events: none
}

.pagination .pagination-prev.is-inactive a::before, .pagination .pagination-prev.is-inactive button::before, .pagination .pagination-next.is-inactive a::before, .pagination .pagination-next.is-inactive button::before {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: .3
}

.pagination .pagination-prev a::before, .pagination .pagination-prev button::before {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.page-top {
    background-color: var(--base-color);
    border: 1px solid var(--accent-color);
    border-radius: 50%;
    -webkit-filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 54px;
    height: 54px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    opacity: 0;
    transition: opacity .2s ease-out;
    z-index: 15
}

.page-top.is-visible {
    opacity: 1
}

@media (max-width: 47.99em) {
    .page-top {
        display: none
    }
}

body[data-page-category=popup] [id] {
    scroll-margin-top: 0
}

.popup-header {
    background-color: #fff;
    box-shadow: 0 2px 3px rgba(0, 0, 0, .16);
    position: relative;
    width: 100%;
    height: 63px;
    z-index: 9999
}

@media (min-width: 48em) {
    .popup-header {
        box-shadow: 0 1px 4px rgba(0, 0, 0, .16);
        height: 109px
    }
}

.popup-header + .l-main .page-title-hdg {
    padding-top: 40px
}

@media (min-width: 48em) {
    .popup-header + .l-main .page-title-hdg {
        padding-top: 50px
    }
}

.popup-header-sp-container {
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 10
}

@media (min-width: 48em) {
    .popup-header-sp-container {
        display: block;
        height: 100%
    }
}

@media (max-width: 47.99em) {
    .popup-header-logo {
        padding: 12px 0 11px 15px
    }
}

@media (min-width: 48em) {
    .popup-header-logo {
        margin-left: 23px;
        position: absolute;
        top: 20px;
        left: 0
    }
}

@media (min-width: 62.5em) {
    .popup-header-logo {
        top: 17px
    }
}

.popup-header-logo > a {
    display: block;
    width: 86px
}

@media (min-width: 48em) {
    .popup-header-logo > a {
        width: auto;
        height: auto
    }
}

.popup-header-logo > a img {
    -webkit-transform: none;
    transform: none
}

.popup-close-button-header {
    display: flex;
    height: 100%;
    width: 66px;
    position: absolute;
    right: 0;
    top: 0;
    border: none;
    background-color: #fff;
    padding: 0;
    margin: 0;
    -webkit-filter: none;
    filter: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18.707' height='18.707' viewBox='0 0 18.707 18.707'%3E%3Cg transform='translate(0.354 0.354)'%3E%3Cline x2='18' y2='18' fill='none' stroke='%230f9682' stroke-width='1'/%3E%3Cline x1='18' y2='18' fill='none' stroke='%230f9682' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    font-weight: 100;
    font-size: 2.875rem;
    color: rgba(0, 0, 0, 0);
    border-radius: 0;
    cursor: pointer;
    box-shadow: none
}

.button.popup-close-button {
    font-size: 0.9375rem;
    font-weight: normal;
    width: 159px;
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 10px;
    padding: 5px 40px;
    box-sizing: border-box;
    margin: 0 auto;
    background: #fff;
    border: solid 1px rgba(0, 0, 0, .08);
    cursor: pointer;
    position: relative
}

.button.popup-close-button::after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19.063' height='19.062' viewBox='0 0 19.063 19.062'%3E%3Cg transform='translate(1.414 1.414)'%3E%3Cline x2='22.958' transform='translate(0 0) rotate(45)' fill='none' stroke='%23009682' stroke-linecap='round' stroke-width='2'/%3E%3Cline x2='22.958' transform='translate(0.001 16.234) rotate(-45)' fill='none' stroke='%23009682' stroke-linecap='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    width: 10px;
    height: 10px;
    flex: 0 0 auto;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.section {
    position: relative;
    padding-top: 40px
}

@media (min-width: 48em) {
    .section {
        padding-top: 50px
    }
}

.section[class*=theme-bgc-] {
    padding-top: 40px;
    padding-bottom: 40px
}

@media (min-width: 48em) {
    .section[class*=theme-bgc-] {
        padding-top: 50px;
        padding-bottom: 50px
    }
}

.section[class*=theme-bgc-] + .section[class*=theme-bgc-] {
    padding-top: 0
}

@media (min-width: 48em) {
    .section[class*=theme-bgc-] + .section[class*=theme-bgc-] {
        padding-top: 0
    }
}

.section:not([class*=theme-bgc-]) + .section[class*=theme-bgc-] {
    margin-top: 40px
}

@media (min-width: 48em) {
    .section:not([class*=theme-bgc-]) + .section[class*=theme-bgc-] {
        margin-top: 50px
    }
}

.section .section[class*=theme-bgc-] {
    padding-top: 30px;
    padding-bottom: 30px
}

@media (min-width: 48em) {
    .section .section[class*=theme-bgc-] {
        padding-top: 36px;
        padding-bottom: 36px
    }
}

.section .section + .section {
    padding-top: 40px
}

@media (min-width: 48em) {
    .section .section + .section {
        padding-top: 50px
    }
}

.section .section .section + .section {
    padding-top: 25px
}

@media (min-width: 48em) {
    .section .section .section + .section {
        padding-top: 30px
    }
}

.l-with-local-nav .l-content > .section {
    margin-right: 15px;
    margin-left: 15px
}

@media (min-width: 48em) {
    .l-with-local-nav .l-content > .section {
        margin-right: 0;
        margin-left: 0
    }
}

@media (max-width: 47.99em) {
    .l-with-local-nav .l-content > .section:first-of-type {
        padding-top: 36px;
        padding-bottom: 0
    }
}

.l-with-local-nav .l-content > .section[class*=theme-bgc-] {
    padding: 26px 0
}

@media (min-width: 48em) {
    .l-with-local-nav .l-content > .section[class*=theme-bgc-] {
        padding: 40px 0
    }
}

.l-with-local-nav .l-content > .section [class*=theme-bgc-]:not(.section,.preserve-padding) {
    padding: 26px 0
}

@media (min-width: 48em) {
    .l-with-local-nav .l-content > .section [class*=theme-bgc-]:not(.section,.preserve-padding) {
        padding: 40px 0
    }
}

.l-with-local-nav .l-content > .section [class*=theme-bgc-]:not(.section,.preserve-padding) .section:first-of-type {
    padding-top: 0
}

.l-with-local-nav .l-content > .section[class*=theme-bgc-]:first-of-type {
    margin-top: 32px
}

@media (min-width: 48em) {
    .l-with-local-nav .l-content > .section[class*=theme-bgc-]:first-of-type {
        margin-top: 52px
    }
}

.l-with-local-nav .l-content .section:not([class*=theme-bgc-]) .section[class*=theme-bgc-] {
    margin-top: 26px
}

@media (min-width: 48em) {
    .l-with-local-nav .l-content .section:not([class*=theme-bgc-]) .section[class*=theme-bgc-] {
        margin-top: 40px
    }
}

.section .section-header {
    padding-bottom: 30px;
    position: relative
}

@media (min-width: 48em) {
    .section .section-header {
        padding-bottom: 50px
    }
}

.l-with-local-nav .section .section-header {
    padding-bottom: 30px;
    position: relative
}

@media (min-width: 48em) {
    .l-with-local-nav .section .section-header {
        padding-bottom: 40px
    }
}

.l-with-local-nav .section.theme-section-counter .section-header {
    padding-bottom: 20px;
    position: relative
}

@media (min-width: 48em) {
    .l-with-local-nav .section.theme-section-counter .section-header {
        padding-bottom: 28px
    }
}

.section .section .section-header, .l-with-local-nav .section .section .section-header {
    padding-bottom: 20px
}

@media (min-width: 48em) {
    .section .section .section-header, .l-with-local-nav .section .section .section-header {
        padding-bottom: 30px
    }
}

.section .section .section .section-header, .l-with-local-nav .section .section .section .section-header {
    padding-bottom: 20px
}

.section .section .section .section .section-header, .l-with-local-nav .section .section .section .section .section-header {
    padding-bottom: 15px
}

.section-header h2 {
    font-size: 1.25rem
}

@media (min-width: 48em) {
    .section-header h2 {
        font-size: 1.875rem
    }
}

.section-header h2 + .section-description {
    font-size: 1rem;
    padding-top: 20px
}

@media (min-width: 48em) {
    .section-header h2 + .section-description {
        padding-top: 30px
    }
}

.section-header h3 {
    font-size: 1.125rem
}

@media (min-width: 48em) {
    .section-header h3 {
        font-size: 1.5rem
    }
}

.section-header h3 + .section-description {
    font-size: 1rem;
    padding-top: 20px
}

.section-header h4 {
    font-size: 1rem
}

@media (min-width: 48em) {
    .section-header h4 {
        font-size: 1.125rem
    }
}

.section-header h4 + .section-description {
    font-size: 1rem;
    padding-top: 20px
}

.section-header h5 {
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .section-header h5 {
        font-size: 1rem
    }
}

.section-header h5 + .section-description {
    font-size: 0.875rem;
    padding-top: 10px
}

.section-title {
    font-weight: 600;
    line-height: 1.2
}

.section-title > span {
    display: inline-block
}

.section-title > a::after {
    content: "";
    display: inline-block;
    margin-left: 8px
}

.section-title > a:not([target=_blank])::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 6px center;
    background-size: 6.5px;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    vertical-align: -1px
}

.section-title > a[target=_blank]::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 14px;
    height: 14px
}

.section-title .section-sub-title {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 5px
}

.section-title .icon-beginner {
    display: inline-block;
    margin-right: 14px;
    vertical-align: -8px
}

.section-header.with-serif {
    text-align: center
}

.section-header.with-serif .section-title {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap
}

.section-header.with-serif .serif {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center bottom;
    background-size: 290px auto;
    display: block;
    font-size: 1rem;
    width: 100%;
    padding-bottom: 20px
}

@media (min-width: 48em) {
    .section-header.with-serif .serif {
        background-size: 348px auto;
        font-size: 1.125rem;
        padding-bottom: 30px
    }
}

.section-header.with-serif .section-description {
    padding-top: 23px
}

@media (min-width: 48em) {
    .section-header.with-serif .section-description {
        padding-top: 35px
    }
}

.section-header.with-underline .section-title {
    display: flex;
    flex-direction: column;
    align-items: center
}

.section-header.with-underline .underline {
    background: linear-gradient(transparent 75%, rgba(0, 150, 130, 0.25) 0%);
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 12px
}

.section-header.with-icon h2.section-title {
    display: flex;
    justify-content: center;
    align-items: center
}

.section-header.with-icon h2.section-title > img {
    margin-right: 19px
}

.section-header.with-number .section-title {
    font-size: 1.125rem
}

@media (min-width: 48em) {
    .section-header.with-number .section-title {
        font-size: 1.5rem
    }
}

.section-header.with-number .number {
    font-family: "Arial", sans-serif;
    font-size: 2.625rem;
    font-weight: 600;
    font-style: italic;
    display: block;
    position: relative;
    width: 100%;
    margin-bottom: 15px;
    text-align: center;
    line-height: 1
}

@media (min-width: 48em) {
    .section-header.with-number .number {
        font-size: 5rem
    }
}

.section-header.with-number .number > span {
    position: relative;
    padding: 0 30px;
    z-index: 2
}

@media (min-width: 48em) {
    .section-header.with-number .number > span {
        padding: 0 65px
    }
}

.section-header.with-number .number::before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 1
}

.theme-bgc-green .section-header.with-number .number {
    color: rgba(0, 150, 130, .5)
}

.theme-bgc-green .section-header.with-number .number::before {
    background-color: rgba(0, 150, 130, .5)
}

.theme-bgc-green .section-header.with-number .number > span {
    background-color: #e9f4f1
}

.theme-bgc-pink .section-header.with-number .number {
    color: rgba(232, 84, 113, .5)
}

.theme-bgc-pink .section-header.with-number .number::before {
    background-color: rgba(232, 84, 113, .5)
}

.theme-bgc-pink .section-header.with-number .number > span {
    background-color: #fef6f8
}

.theme-bgc-blue .section-header.with-number .number {
    color: rgba(0, 160, 215, .5)
}

.theme-bgc-blue .section-header.with-number .number::before {
    background-color: rgba(0, 160, 215, .5)
}

.theme-bgc-blue .section-header.with-number .number > span {
    background-color: #f2fafd
}

.theme-bgc-steelblue .section-header.with-number .number {
    color: rgba(7, 77, 150, .5)
}

.theme-bgc-steelblue .section-header.with-number .number::before {
    background-color: rgba(7, 77, 150, .5)
}

.theme-bgc-steelblue .section-header.with-number .number > span {
    background-color: #f2f6fa
}

.section-header.with-tooltip h2 {
    display: flex;
    align-items: center
}

.section-header.with-tooltip .tooltip-trigger {
    flex-shrink: 0
}

.step {
    display: flex;
    width: 100%
}

.step.step-cols-5 {
    flex-wrap: wrap;
    gap: 2px 0
}

.step-item {
    background-color: var(--green-color);
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    min-height: 50px;
    padding: 10px 10px 10px 35px;
    overflow-y: hidden;
    position: relative
}

@media (min-width: 48em) {
    .step-item {
        padding: 15px 15px 15px 42px
    }
}

@media (max-width: 47.99em) {
    .step-item:first-of-type {
        padding-left: 20px
    }
}

.step-item:first-of-type:before, .step-item:first-of-type:after {
    display: none
}

.step.step-cols-5 .step-item {
    flex: 1 0 33.3333%
}

.step.step-cols-5 .step-item:nth-of-type(3n+1) {
    padding-left: 20px
}

.step.step-cols-5 .step-item:nth-of-type(3n+1):before, .step.step-cols-5 .step-item:nth-of-type(3n+1):after {
    display: none
}

.step-item:not(.is-current) a {
    text-decoration: underline
}

.step-item:not(.is-current) a:hover {
    text-decoration: none
}

.step-item.is-current {
    pointer-events: none
}

.step-item.is-current a {
    text-decoration: none
}

.step-item:first-of-type {
    border-radius: 10px 0 0 10px
}

.step-item:first-of-type::before {
    display: none
}

.step-item:last-of-type {
    border-radius: 0 10px 10px 0
}

.step-item::before, .step-item::after {
    border-right: 35px solid rgba(0, 0, 0, 0);
    border-bottom: 70px solid rgba(0, 0, 0, 0);
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    top: 50%
}

@media (min-width: 20em) {
    .step-item::before, .step-item::after {
        -webkit-transform: translate(-14%, -50%);
        transform: translate(-14%, -50%)
    }
}

@media (min-width: 23.4375em) {
    .step-item::before, .step-item::after {
        -webkit-transform: translate(-18%, -50%);
        transform: translate(-18%, -50%)
    }
}

@media (min-width: 48em) {
    .step-item::before, .step-item::after {
        -webkit-transform: translate(-21%, -50%);
        transform: translate(-21%, -50%)
    }
}

.step-item::before {
    border-top: 70px solid rgba(0, 0, 0, 0);
    border-left: 35px solid var(--green-color);
    left: 1px;
    z-index: 1
}

.step-item::after {
    border-top: 70px solid rgba(0, 0, 0, 0);
    border-left: 35px solid var(--accent-color);
    left: 0;
    z-index: 2
}

.step-item.is-done {
    background-color: var(--gray-color)
}

.step-item.is-done::after {
    border-left: 35px solid var(--gray-color)
}

.step-item.is-done + .step-item.is-done::before {
    border-left: 35px solid #222
}

.step-item.is-done + .step-item.is-current::after {
    border-left-color: var(--gray-color)
}

.step-item.is-current {
    background-color: var(--accent-color);
    color: var(--base-color);
    font-weight: 600
}

.step-item.is-current::after {
    border-left-color: var(--accent-color)
}

.step-item:not(.is-current) + .step-item:not(.is-done):not(.is-current)::before {
    border-left-color: var(--accent-color)
}

.step-item:not(.is-current) + .step-item:not(.is-done):not(.is-current)::after {
    border-left-color: var(--green-color)
}

.text-wrap {
    display: inline-flex;
    flex-direction: column;
    line-height: 1
}

.text-base em, .text-base strong, .text-base mark, .text-small em, .text-small strong, .text-small mark {
    font-style: normal;
    font-weight: 600
}

.text-base sup, .text-small sup {
    top: -0.3em
}

.text-base sub, .text-small sub {
    bottom: 0
}

.text-large {
    font-size: 1.125rem
}

.text-base {
    font-size: 1rem
}

.text-base sup, .text-base sub {
    font-size: 0.6875rem
}

.text-small {
    font-size: 0.875rem
}

.text-small sup, .text-small sub {
    font-size: 0.625rem
}

.text-box {
    background-color: #e9f4f1;
    border-radius: 10px;
    padding: 20px;
    text-align: center
}

.text-flex-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 10px
}

.text-box .list, .text-flex-box .list {
    gap: 2px;
    width: auto;
    padding-top: 5px
}

.text-img {
    display: inline;
    vertical-align: -2px
}

.text-underline {
    background: linear-gradient(transparent 70%, rgba(0, 150, 130, 0.23) 0%);
    display: inline
}

.text-unit-sm {
    color: var(--accent-color);
    font-size: 0.875rem
}

.text-unit-md {
    color: var(--accent-color);
    font-size: 1rem
}

.text-unit-lg {
    color: var(--accent-color);
    font-size: 1.25rem
}

.text-unit-supplement {
    color: var(--accent-color);
    font-weight: 600;
    font-size: 1.25rem
}

.text-emphasis-sm {
    color: var(--accent-color);
    font-weight: 600;
    font-size: 1.625rem
}

.text-emphasis-md {
    color: var(--accent-color);
    font-weight: 600;
    font-size: 2.625rem
}

.text-emphasis-lg {
    color: var(--accent-color);
    font-weight: 600;
    font-size: 2.75rem
}

.text-answer {
    display: flex;
    align-items: flex-start;
    line-height: 1.4
}

.text-answer::before {
    border-radius: 4px;
    background-color: #009682;
    color: #fff;
    content: "A";
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 26px;
    height: 26px;
    margin-top: -3px;
    margin-right: 8px;
    vertical-align: -2px
}

.text-prose {
    line-height: 1.5
}

:root .reel {
    --swiper-theme-color: #009682;
    --swiper-pagination-bullet-size: 10px;
    --swiper-pagination-bullet-horizontal-gap: 5px
}

@media (min-width: 48em) {
    :root .reel {
        --swiper-pagination-bullet-size: 12px
    }
}

.js-swiper {
    visibility: hidden;
    opacity: 0;
    transition: opacity .03s ease-out
}

.js-swiper.swiper-initialized {
    visibility: visible;
    opacity: 1
}

.reel {
    position: relative;
    overflow: hidden
}

.reel.reel-sp-only {
    margin: 0 -15px;
    padding-right: 12px
}

@media (min-width: 48em) {
    .reel.reel-sp-only {
        overflow: visible;
        margin-left: 0;
        margin-right: 0;
        padding-right: 0
    }

    .reel.reel-pagination-sp-only .reel-pagination {
        display: none
    }
}

.reel-container {
    width: 100%;
    max-width: 1240px;
    overflow-x: hidden;
    overflow-y: visible;
    margin: 0 auto;
    position: relative
}

@media (min-width: 48em) {
    .reel-container[data-reel-pc=false] .reel-items.swiper-wrapper {
        -webkit-transform: translate3d(0, 0px, 0px) !important;
        transform: translate3d(0, 0px, 0px) !important
    }

    .reel-container.reel-item-insufficient.reel-container {
        padding-bottom: 0
    }

    .reel-container.reel-item-insufficient .reel-items {
        justify-content: center
    }
}

.reel-items.panels {
    margin: 0 -20px;
    flex-wrap: nowrap
}

@media (min-width: 48em) {
    .reel-items.panels {
        margin: 0
    }
}

.reel-item {
    font-size: 0.875rem
}

.reel-item.panel {
    margin-top: 0;
    margin-left: 0
}

.reel-box {
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    overflow: hidden
}

.reel-thumb > img {
    width: 100%
}

.reel-inner {
    padding: 10px 10px 20px
}

@media (min-width: 48em) {
    .reel-inner {
        padding: 20px 15px 30px
    }
}

.reel-title {
    font-size: 0.875rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .reel-title {
        font-size: 1rem
    }
}

.reel-text {
    font-size: 0.75rem;
    margin-top: 10px
}

@media (min-width: 48em) {
    .reel-text {
        font-size: 1rem
    }
}

.reel-small-text {
    font-size: 0.875rem
}

.reel .reel-container {
    overflow: visible;
    padding-bottom: 40px
}

.l-with-local-nav .reel .reel-container, .container .reel .reel-container {
    padding-left: 0
}

@media (max-width: 47.99em) {
    .l-with-local-nav .reel .reel-container, .container .reel .reel-container {
        padding-left: 20px
    }
}

.reel .reel-pagination.swiper-pagination-bullets {
    bottom: 0
}

.reel-card {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .03);
    border-radius: 10px;
    -webkit-filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    overflow: hidden;
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative
}

.reel-card-link {
    padding: 20px 15px
}

@media (min-width: 48em) {
    .reel-card-link {
        padding: 30px 20px
    }
}

.reel-card-title {
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
    margin-bottom: 20px
}

.reel-card-title::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    flex-shrink: 0;
    vertical-align: -1px
}

.reel-card-link[target=_blank] .reel-card-title::after {
    background-color: rgba(0, 0, 0, 0);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-size: contain;
    border-radius: 0;
    width: 14px;
    height: 14px;
    vertical-align: 0
}

.reel-card-img img {
    margin: 0 auto
}

.reel-card-description {
    margin-top: 20px
}

.reel-small-card {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px
}

.reel-small-card-image {
    flex: 1 0 auto;
    margin-right: 10px
}

.reel-small-card-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 10px
}

.reel-small-card-title::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

.reel-small-card-link {
    display: flex;
    padding: 20px
}

.reel .js-swiper {
    opacity: 1;
    visibility: visible
}

@media (max-width: 47.99em) {
    .reel .reel-container {
        padding-left: 15px;
        padding-right: 3px
    }

    .top-member-campaign .reel.reel-sp-only .reel-container {
        padding-right: 3px
    }
}

.reel.is-rtoaster.is-ready + .reel, .reel.is-rtoaster:not(.is-ready) {
    display: none
}

.top-member-campaign .reel .swiper-slide {
    height: auto !important;
    display: flex
}

.top-member-campaign .reel .swiper-slide a {
    display: flex;
    flex-direction: column
}

@media (min-width: 48em) {
    .reel .js-swiper:not([data-reel-custom-pc-per-view]) .swiper-slide {
        width: calc(19.2307692308% - 16px) !important;
        margin-right: 20px
    }
}

@media (max-width: 47.99em) {
    .reel .js-swiper:not(.swiper-initialized) .swiper-wrapper {
        gap: 12px
    }

    .reel .js-swiper:not([data-reel-custom-sp-per-view]):not(.swiper-initialized) .swiper-slide {
        width: calc((100% - 13px) / 2.3) !important
    }

    .reel .js-swiper[data-reel-custom-sp-per-view="2.1"]:not(.swiper-initialized) .swiper-slide {
        width: calc((100% - 13px) / 2.1) !important
    }

    .reel .js-swiper[data-reel-custom-sp-per-view="2.3"]:not(.swiper-initialized) .swiper-slide {
        width: calc((100% - 13px) / 2.3) !important
    }

    .reel .js-swiper[data-reel-custom-sp-per-view="1.2"]:not(.swiper-initialized) .swiper-slide {
        width: calc((100% - 13px) / 1.2) !important
    }

    .reel .js-swiper[data-reel-custom-sp-per-view="1.4"]:not(.swiper-initialized) .swiper-slide {
        width: calc((100% - 13px) / 1.4) !important
    }
}

@media (min-width: 48em) {
    .reel.reel-sp-only .js-swiper .swiper-wrapper {
        display: grid !important;
        gap: 20px !important;
        padding-bottom: 0 !important
    }

    .reel.reel-sp-only .js-swiper .swiper-slide {
        margin: 0 !important
    }

    .reel.reel-sp-only .js-swiper[data-reel-custom-pc-per-view="2"] .swiper-wrapper {
        grid-template-columns:repeat(2, 1fr) !important
    }

    .reel.reel-sp-only .js-swiper[data-reel-custom-pc-per-view="3"] .swiper-wrapper {
        grid-template-columns:repeat(3, 1fr) !important
    }

    .reel.reel-sp-only .js-swiper[data-reel-custom-pc-per-view="4"] .swiper-wrapper {
        grid-template-columns:repeat(4, 1fr) !important
    }

    .reel.reel-sp-only .js-swiper[data-reel-custom-pc-per-view="5"] .swiper-wrapper {
        grid-template-columns:repeat(5, 1fr) !important
    }

    .reel.reel-sp-only .js-swiper[data-reel-custom-pc-per-view="6"] .swiper-wrapper {
        grid-template-columns:repeat(6, 1fr) !important
    }
}

.tab-group .tab-panels .tab-panel > * {
    padding: 20px 0 0
}

@media (min-width: 48em) {
    .tab-group .tab-panels .tab-panel > * {
        padding: 40px 0 0
    }
}

.tab-list {
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 3px 0
}

@media (max-width: 47.99em) {
    .tab-list .tab-button {
        flex: 1 1 33%
    }
}

.tab-list.tab-scroll-list {
    overflow-y: hidden;
    overflow-x: auto;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    flex-wrap: nowrap
}

@media (min-width: 48em) {
    .tab-list.tab-scroll-list {
        overflow: visible
    }
}

.tab-list.tab-scroll-list .tab-button {
    flex: 1 0 auto;
    scroll-snap-align: start
}

@media (min-width: 48em) {
    .tab-list.tab-scroll-list .tab-button {
        flex: 1 1 33%
    }
}

.tab-list.tab-small-list {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0
}

@media (min-width: 48em) {
    .tab-list.tab-small-list {
        grid-template-columns:repeat(7, minmax(0, 1fr))
    }
}

.tab-list.tab-small-list .tab-button {
    background-color: var(--base-color);
    border: 1px solid var(--accent-color);
    border-radius: 4px;
    font-size: 0.875rem;
    padding: 10px;
    margin: 0;
    width: 100%;
    max-width: none;
    flex: none
}

.tab-list.tab-small-list .tab-button.is-active {
    background-color: var(--accent-color);
    color: var(--base-color)
}

.tab-list.tab-small-list .tab-button::before {
    display: none
}

@media (max-width: 47.99em) {
    .tab-list:not(.tab-scroll-list,.tab-small-list) .tab-button:nth-of-type(n+4) {
        margin-top: 8px
    }
}

.tab-button {
    background-color: #f5f5f5;
    border-radius: 8px 8px 0 0;
    cursor: pointer;
    text-align: center;
    font-size: 1rem;
    line-height: 1.2;
    padding: 14px 10px;
    position: relative
}

@media (max-width: 47.99em) {
    .tab-button {
        display: flex;
        justify-content: center;
        align-items: center
    }
}

@media (min-width: 48em) {
    .tab-button {
        padding: 12px 10px
    }
}

.tab-button:before {
    background-color: #009682;
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    left: 0;
    bottom: -3px;
    opacity: 0;
    transition: opacity .25s ease-out
}

.tab-button:hover::before, .tab-button.is-active::before {
    opacity: 1
}

.tab-button.is-active {
    color: var(--accent-color);
    font-weight: 600
}

@media (min-width: 48em) {
    .tab-button {
        font-size: 1.125rem;
        padding: 16px;
        flex: 1 1 0
    }
}

.tab-button + .tab-button {
    margin-left: 1px
}

@media (min-width: 48em) {
    .tab-button + .tab-button {
        margin-left: 2px
    }
}

.tab-panel {
    display: none
}

.tab-panel.is-active {
    display: block
}

.tab-panel > *[class*=theme-] {
    padding: 30px 0
}

@media (min-width: 48em) {
    .tab-panel > *[class*=theme-] {
        padding: 40px 0
    }
}

.filter-list {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 3px;
    margin: 0
}

@media (min-width: 48em) {
    .filter-list {
        grid-template-columns:repeat(6, minmax(0, 1fr))
    }
}

.filter-button {
    background-color: var(--base-color);
    border: 1px solid var(--accent-color);
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.875rem;
    padding: 10px;
    width: 100%
}

.filter-button.is-active {
    background-color: var(--accent-color);
    color: var(--base-color);
    font-weight: 600
}

.filter-button[data-filter-category=stock] {
    border-color: var(--stock-color)
}

.filter-button[data-filter-category=stock].is-active {
    background-color: var(--stock-color)
}

.filter-button[data-filter-category=us] {
    border-color: var(--usmmf-color)
}

.filter-button[data-filter-category=us].is-active {
    background-color: var(--usmmf-color)
}

.filter-button[data-filter-category=fund] {
    border-color: var(--fund-color)
}

.filter-button[data-filter-category=fund].is-active {
    background-color: var(--fund-color)
}

.filter-button[data-filter-category=fx] {
    border-color: var(--fx-color)
}

.filter-button[data-filter-category=fx].is-active {
    background-color: var(--fx-color)
}

.filter-button[data-filter-category=oth] {
    border-color: var(--gray-border-color)
}

.filter-button[data-filter-category=oth].is-active {
    background-color: var(--gray-border-color)
}

.filter-contents .is-hidden {
    display: none
}

.flexible-grid {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 12px
}

@media (min-width: 48em) {
    .flexible-grid {
        gap: 20px 30px
    }

    .l-with-local-nav .flexible-grid {
        gap: 20px
    }
}

.flexible-grid > .button {
    max-width: none;
    margin: 0
}

.flexible-grid.justify-center {
    justify-content: center
}

.flexible-grid.justify-end {
    justify-content: flex-end
}

.flexible-grid.items-center {
    align-items: center
}

@media (min-width: 48em) {
    .flexible-grid.md\:items-center {
        align-items: center
    }
}

.flexible-grid.direction-column {
    flex-direction: column
}

@media (min-width: 48em) {
    .flexible-grid.md\:direction-column {
        flex-direction: column
    }
}

.flexible-grid.direction-row {
    flex-direction: row
}

@media (min-width: 48em) {
    .flexible-grid.md\:direction-row {
        flex-direction: row
    }
}

.flexible-grid.flexible-grid-cols-1 > * {
    flex: 0 0 100%
}

.flexible-grid.flexible-grid-cols-2 > * {
    flex: 0 0 calc(50% - 12px)
}

.flexible-grid.flexible-grid-cols-3 > * {
    flex: 0 0 calc(33.3333333333% - 12px)
}

.flexible-grid.flexible-grid-cols-4 > * {
    flex: 0 0 calc(25% - 15px)
}

.flexible-grid.flexible-grid-cols-5 > * {
    flex: 0 0 calc(20% - 12px)
}

@media (min-width: 48em) {
    .flexible-grid.md\:flexible-grid-cols-2 > * {
        flex: 0 0 calc(50% - 12px)
    }

    .flexible-grid.md\:flexible-grid-cols-3 > * {
        flex: 0 0 calc(33.3333333333% - 12px)
    }

    .flexible-grid.md\:flexible-grid-cols-4 > * {
        flex: 0 0 calc(25% - 15px)
    }

    .l-with-local-nav .flexible-grid.md\:flexible-grid-cols-4 > * {
        flex: 0 0 205px
    }

    .flexible-grid.md\:flexible-grid-cols-5 > * {
        flex: 0 0 calc(20% - 12px)
    }

    .l-with-local-nav .flexible-grid.md\:flexible-grid-cols-5 > * {
        flex: 0 0 160px
    }
}

.grid {
    display: grid;
    gap: 12px
}

@media (min-width: 768px) {
    .grid {
        gap: 20px
    }
}

.grid-cols-1 {
    grid-template-columns:repeat(1, minmax(0, 1fr))
}

.grid-cols-2 {
    grid-template-columns:repeat(2, minmax(0, 1fr))
}

.grid-cols-3 {
    grid-template-columns:repeat(3, minmax(0, 1fr))
}

.grid-cols-4 {
    grid-template-columns:repeat(4, minmax(0, 1fr))
}

.grid-cols-5 {
    grid-template-columns:repeat(5, minmax(0, 1fr))
}

.grid-cols-6 {
    grid-template-columns:repeat(6, minmax(0, 1fr))
}

.grid-cols-7 {
    grid-template-columns:repeat(7, minmax(0, 1fr))
}

.grid-cols-8 {
    grid-template-columns:repeat(8, minmax(0, 1fr))
}

.grid-cols-9 {
    grid-template-columns:repeat(9, minmax(0, 1fr))
}

.grid-cols-10 {
    grid-template-columns:repeat(10, minmax(0, 1fr))
}

.grid-cols-11 {
    grid-template-columns:repeat(11, minmax(0, 1fr))
}

.grid-cols-12 {
    grid-template-columns:repeat(12, minmax(0, 1fr))
}

@media (min-width: 48em) {
    .md\:grid-cols-1 {
        grid-template-columns:repeat(1, minmax(0, 1fr))
    }

    .md\:grid-cols-2 {
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }

    .md\:grid-cols-3 {
        grid-template-columns:repeat(3, minmax(0, 1fr))
    }

    .md\:grid-cols-4 {
        grid-template-columns:repeat(4, minmax(0, 1fr))
    }

    .md\:grid-cols-5 {
        grid-template-columns:repeat(5, minmax(0, 1fr))
    }

    .md\:grid-cols-6 {
        grid-template-columns:repeat(6, minmax(0, 1fr))
    }

    .md\:grid-cols-7 {
        grid-template-columns:repeat(7, minmax(0, 1fr))
    }

    .md\:grid-cols-8 {
        grid-template-columns:repeat(8, minmax(0, 1fr))
    }

    .md\:grid-cols-9 {
        grid-template-columns:repeat(9, minmax(0, 1fr))
    }

    .md\:grid-cols-10 {
        grid-template-columns:repeat(10, minmax(0, 1fr))
    }

    .md\:grid-cols-11 {
        grid-template-columns:repeat(11, minmax(0, 1fr))
    }

    .md\:grid-cols-12 {
        grid-template-columns:repeat(12, minmax(0, 1fr))
    }
}

.grid-col-span-1 {
    grid-column: span 1 / span 1
}

.grid-col-span-2 {
    grid-column: span 2 / span 2
}

.grid-col-span-3 {
    grid-column: span 3 / span 3
}

.grid-col-span-4 {
    grid-column: span 4 / span 4
}

.grid-col-span-5 {
    grid-column: span 5 / span 5
}

.grid-col-span-6 {
    grid-column: span 6 / span 6
}

.grid-col-span-7 {
    grid-column: span 7 / span 7
}

.grid-col-span-8 {
    grid-column: span 8 / span 8
}

.grid-col-span-9 {
    grid-column: span 9 / span 9
}

.grid-col-span-10 {
    grid-column: span 10 / span 10
}

.grid-col-span-11 {
    grid-column: span 11 / span 11
}

.grid-col-span-12 {
    grid-column: span 12 / span 12
}

@media (min-width: 48em) {
    .md\:grid-col-span-1 {
        grid-column: span 1 / span 1
    }

    .md\:grid-col-span-2 {
        grid-column: span 2 / span 2
    }

    .md\:grid-col-span-3 {
        grid-column: span 3 / span 3
    }

    .md\:grid-col-span-4 {
        grid-column: span 4 / span 4
    }

    .md\:grid-col-span-5 {
        grid-column: span 5 / span 5
    }

    .md\:grid-col-span-6 {
        grid-column: span 6 / span 6
    }

    .md\:grid-col-span-7 {
        grid-column: span 7 / span 7
    }

    .md\:grid-col-span-8 {
        grid-column: span 8 / span 8
    }

    .md\:grid-col-span-9 {
        grid-column: span 9 / span 9
    }

    .md\:grid-col-span-10 {
        grid-column: span 10 / span 10
    }

    .md\:grid-col-span-11 {
        grid-column: span 11 / span 11
    }

    .md\:grid-col-span-12 {
        grid-column: span 12 / span 12
    }
}

.grid-col-start-1 {
    grid-column-start: 1
}

.grid-col-start-2 {
    grid-column-start: 2
}

.grid-col-start-3 {
    grid-column-start: 3
}

.grid-col-start-4 {
    grid-column-start: 4
}

.grid-col-start-5 {
    grid-column-start: 5
}

.grid-col-start-6 {
    grid-column-start: 6
}

.grid-col-start-7 {
    grid-column-start: 7
}

.grid-col-start-8 {
    grid-column-start: 8
}

.grid-col-start-9 {
    grid-column-start: 9
}

.grid-col-start-10 {
    grid-column-start: 10
}

.grid-col-start-11 {
    grid-column-start: 11
}

.grid-col-start-12 {
    grid-column-start: 12
}

@media (min-width: 48em) {
    .md\:grid-col-start-1 {
        grid-column-start: 1
    }

    .md\:grid-col-start-2 {
        grid-column-start: 2
    }

    .md\:grid-col-start-3 {
        grid-column-start: 3
    }

    .md\:grid-col-start-4 {
        grid-column-start: 4
    }

    .md\:grid-col-start-5 {
        grid-column-start: 5
    }

    .md\:grid-col-start-6 {
        grid-column-start: 6
    }

    .md\:grid-col-start-7 {
        grid-column-start: 7
    }

    .md\:grid-col-start-8 {
        grid-column-start: 8
    }

    .md\:grid-col-start-9 {
        grid-column-start: 9
    }

    .md\:grid-col-start-10 {
        grid-column-start: 10
    }

    .md\:grid-col-start-11 {
        grid-column-start: 11
    }

    .md\:grid-col-start-12 {
        grid-column-start: 12
    }
}

.grid-col-end-1 {
    grid-column-end: 1
}

.grid-col-end-2 {
    grid-column-end: 2
}

.grid-col-end-3 {
    grid-column-end: 3
}

.grid-col-end-4 {
    grid-column-end: 4
}

.grid-col-end-5 {
    grid-column-end: 5
}

.grid-col-end-6 {
    grid-column-end: 6
}

.grid-col-end-7 {
    grid-column-end: 7
}

.grid-col-end-8 {
    grid-column-end: 8
}

.grid-col-end-9 {
    grid-column-end: 9
}

.grid-col-end-10 {
    grid-column-end: 10
}

.grid-col-end-11 {
    grid-column-end: 11
}

.grid-col-end-12 {
    grid-column-end: 12
}

@media (min-width: 48em) {
    .md\:grid-col-end-1 {
        grid-column-end: 1
    }

    .md\:grid-col-end-2 {
        grid-column-end: 2
    }

    .md\:grid-col-end-3 {
        grid-column-end: 3
    }

    .md\:grid-col-end-4 {
        grid-column-end: 4
    }

    .md\:grid-col-end-5 {
        grid-column-end: 5
    }

    .md\:grid-col-end-6 {
        grid-column-end: 6
    }

    .md\:grid-col-end-7 {
        grid-column-end: 7
    }

    .md\:grid-col-end-8 {
        grid-column-end: 8
    }

    .md\:grid-col-end-9 {
        grid-column-end: 9
    }

    .md\:grid-col-end-10 {
        grid-column-end: 10
    }

    .md\:grid-col-end-11 {
        grid-column-end: 11
    }

    .md\:grid-col-end-12 {
        grid-column-end: 12
    }
}

.grid-rows-1 {
    grid-template-rows:repeat(1, minmax(0, 1fr))
}

.grid-rows-2 {
    grid-template-rows:repeat(2, minmax(0, 1fr))
}

.grid-rows-3 {
    grid-template-rows:repeat(3, minmax(0, 1fr))
}

.grid-rows-4 {
    grid-template-rows:repeat(4, minmax(0, 1fr))
}

.grid-rows-5 {
    grid-template-rows:repeat(5, minmax(0, 1fr))
}

.grid-rows-6 {
    grid-template-rows:repeat(6, minmax(0, 1fr))
}

@media (min-width: 48em) {
    .md\:grid-rows-1 {
        grid-template-rows:repeat(1, minmax(0, 1fr))
    }

    .md\:grid-rows-2 {
        grid-template-rows:repeat(2, minmax(0, 1fr))
    }

    .md\:grid-rows-3 {
        grid-template-rows:repeat(3, minmax(0, 1fr))
    }

    .md\:grid-rows-4 {
        grid-template-rows:repeat(4, minmax(0, 1fr))
    }

    .md\:grid-rows-5 {
        grid-template-rows:repeat(5, minmax(0, 1fr))
    }

    .md\:grid-rows-6 {
        grid-template-rows:repeat(6, minmax(0, 1fr))
    }
}

.grid-row-span-1 {
    grid-row: span 1 / span 1
}

.grid-row-span-2 {
    grid-row: span 2 / span 2
}

.grid-row-span-3 {
    grid-row: span 3 / span 3
}

.grid-row-span-4 {
    grid-row: span 4 / span 4
}

.grid-row-span-5 {
    grid-row: span 5 / span 5
}

.grid-row-span-6 {
    grid-row: span 6 / span 6
}

@media (min-width: 48em) {
    .md\:grid-row-span-1 {
        grid-row: span 1 / span 1
    }

    .md\:grid-row-span-2 {
        grid-row: span 2 / span 2
    }

    .md\:grid-row-span-3 {
        grid-row: span 3 / span 3
    }

    .md\:grid-row-span-4 {
        grid-row: span 4 / span 4
    }

    .md\:grid-row-span-5 {
        grid-row: span 5 / span 5
    }

    .md\:grid-row-span-6 {
        grid-row: span 6 / span 6
    }
}

.grid-row-start-1 {
    grid-row-start: 1
}

.grid-row-start-2 {
    grid-row-start: 2
}

.grid-row-start-3 {
    grid-row-start: 3
}

.grid-row-start-4 {
    grid-row-start: 4
}

.grid-row-start-5 {
    grid-row-start: 5
}

.grid-row-start-6 {
    grid-row-start: 6
}

@media (min-width: 48em) {
    .md\:grid-row-start-1 {
        grid-row-start: 1
    }

    .md\:grid-row-start-2 {
        grid-row-start: 2
    }

    .md\:grid-row-start-3 {
        grid-row-start: 3
    }

    .md\:grid-row-start-4 {
        grid-row-start: 4
    }

    .md\:grid-row-start-5 {
        grid-row-start: 5
    }

    .md\:grid-row-start-6 {
        grid-row-start: 6
    }
}

.grid-row-end-1 {
    grid-row-end: 1
}

.grid-row-end-2 {
    grid-row-end: 2
}

.grid-row-end-3 {
    grid-row-end: 3
}

.grid-row-end-4 {
    grid-row-end: 4
}

.grid-row-end-5 {
    grid-row-end: 5
}

.grid-row-end-6 {
    grid-row-end: 6
}

@media (min-width: 48em) {
    .md\:grid-row-end-1 {
        grid-row-end: 1
    }

    .md\:grid-row-end-2 {
        grid-row-end: 2
    }

    .md\:grid-row-end-3 {
        grid-row-end: 3
    }

    .md\:grid-row-end-4 {
        grid-row-end: 4
    }

    .md\:grid-row-end-5 {
        grid-row-end: 5
    }

    .md\:grid-row-end-6 {
        grid-row-end: 6
    }

    .md\:grid-cols-4-auto {
        grid-template-columns:repeat(4, auto)
    }
}

.panels {
    display: flex;
    flex-wrap: wrap
}

@media (min-width: 48em) {
    .panels.panels-col-2 .panel {
        width: calc(50% - 11px)
    }

    .panels.panels-col-2 .panel:nth-of-type(2n+1) {
        margin-left: 0
    }
}

@media (max-width: 47.99em) {
    .panels.panels-col-2 .panel:nth-of-type(n+2) {
        margin-top: 5px
    }
}

@media (min-width: 48em) {
    .panels.panels-col-2 .panel:nth-of-type(n+3) {
        margin-top: 22px
    }

    .panels.panels-col-3 .panel {
        width: calc(33.3333333333% - 14.6666666667px)
    }

    .panels.panels-col-3 .panel:nth-of-type(3n+1) {
        margin-left: 0
    }

    .panels.panels-col-4 .panel {
        width: calc(25% - 16.5px)
    }

    .panels.panels-col-4 .panel:nth-of-type(4n+1) {
        margin-left: 0
    }
}

.panel {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .1);
    -webkit-filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    border-radius: 10px;
    width: 100%;
    padding: 30px 15px;
    display: flex;
    flex-direction: column;
    position: relative;
    gap: 15px
}

@media (min-width: 48em) {
    .panel {
        padding: 30px 20px
    }
}

.panel .underline {
    background: linear-gradient(transparent 80%, rgba(234, 117, 128, 0.2) 0%);
    font-weight: 600
}

.panel-inner {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 15px
}

.panel-contents {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    flex: 1 0 0;
    gap: 10px
}

.panel-label.label {
    padding: 2px
}

.panel-title {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: -0.025em
}

@media (min-width: 48em) {
    .panel-title {
        font-size: 1.25rem
    }
}

.panel-title a {
    text-decoration: underline
}

.panel-description {
    font-size: 0.875rem
}

.panel-list {
    margin-top: 18px
}

.panel-list li {
    text-indent: -26px;
    padding-left: 26px
}

.panel-list li:before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    vertical-align: -1px;
    flex-shrink: 0
}

.panel-inner .panel-img {
    display: flex
}

@media (min-width: 48em) {
    .panel-inner .panel-img {
        display: block;
        margin-left: 16px
    }
}

.panel-link {
    display: inline-block;
    margin-left: auto
}

.panel-link::after {
    content: "";
    display: inline-block
}

.panel-link:not([target=_blank])::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -5px
}

@media (min-width: 48em) {
    .panel-link:not([target=_blank])::after {
        vertical-align: -3px
    }
}

.panel-link.is-blank-link::after, .panel-link[target=_blank]::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -1px;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0
}

.panel-pic {
    width: 78px;
    flex-shrink: 0;
    align-self: flex-start
}

@media (min-width: 48em) {
    .panel-pic {
        width: auto
    }
}

.panel-img {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-shrink: 0;
    width: 100%;
    padding: 20px 0;
    margin-right: auto;
    margin-left: auto
}

@media (min-width: 48em) {
    .panel-img {
        width: auto;
        padding: 15px 0 30px
    }
}

.panel-tool .panel-img img {
    display: block;
    margin: 0 auto;
    width: 162px
}

.panel-point .panel-img img {
    display: block;
    margin: 0 auto
}

@media (min-width: 48em) {
    .panel-point .panel-img img {
        width: 144px
    }
}

.panel-ipo .panel-img img {
    display: block;
    width: 111px;
    margin: 0 auto
}

.link-panel {
    padding: 30px 40px 30px 15px
}

@media (min-width: 48em) {
    .link-panel {
        padding: 30px 50px 30px 20px
    }
}

.link-panel::after {
    background-color: var(--accent-color);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    margin: auto 0
}

.table-title {
    font-size: 1.25rem;
    font-weight: 600;
    padding-bottom: 20px
}

.table-scroll {
    overflow-y: hidden;
    overflow-x: auto;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    padding-bottom: 1px
}

@media (min-width: 48em) {
    .table-scroll {
        overflow: visible
    }
}

@media (max-width: 47.99em) {
    .table-scroll .table {
        width: auto;
        white-space: nowrap;
        min-width: 768px
    }
}

.table {
    border-collapse: collapse;
    font-family: var(--en-font);
    width: 100%
}

.table > thead th {
    border: 1px solid #fff;
    background-color: #078271;
    color: #fff;
    font-weight: 600;
    padding: 11px
}

.table > tbody th, .table > tbody td {
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 16px 8px;
    word-break: break-all
}

.table > tbody th {
    background-color: #e9f4f1
}

@media (min-width: 48em) {
    .table > tbody th.theme-cell-green {
        width: auto
    }
}

.table > tbody .with-icon, .table > tbody .with-flag-icon {
    display: flex;
    align-items: center
}

.table > tbody .with-flag-icon {
    justify-content: flex-start;
    text-align: left
}

.table > tbody .with-flag-icon i {
    width: 24px;
    height: 16px;
    margin-right: 10px
}

.table > tbody .with-icon {
    justify-content: flex-end
}

.table > tbody .with-icon i {
    width: 14px;
    height: 14px;
    margin-right: 6px
}

.table > tbody a {
    text-decoration: underline
}

.table > tbody b {
    font-weight: 600
}

.media {
    display: flex;
    flex-direction: column;
    gap: 20px
}

@media (min-width: 48em) {
    .media {
        flex-direction: row
    }
}

.media .media-thumb {
    flex-shrink: 0;
    position: relative
}

@media (min-width: 48em) {
    .media .media-thumb {
        max-width: 42%
    }
}

.media .media-thumb img {
    margin: 0 auto
}

.media .media-thumb img.media-thumb_b-radius {
    border-radius: 4px;
    overflow: hidden
}

.media .media-inner {
    flex-grow: 1
}

.media-list {
    display: grid;
    grid-template-columns:repeat(1, minmax(0, 1fr));
    gap: 10px
}

@media (min-width: 48em) {
    .media-list {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 20px 40px
    }
}

.media-list .media-link {
    display: flex
}

.media-list .media-link:hover .media-thumb {
    opacity: .5
}

.media-list .media-link:hover .media-title {
    text-decoration: underline
}

.media-list .media-link:hover .media-text {
    text-decoration: underline
}

.media-list .media-thumb {
    flex: 1 0 47%;
    padding-right: 3%;
    transition: opacity .15s ease-out
}

.media-list .media-thumb img {
    width: 100%
}

.media-list .media-inner {
    width: 50%
}

.media-list .media-title {
    font-weight: 600;
    line-height: 1.2
}

.media-list .media-text {
    display: none;
    font-size: 0.875rem;
    margin-top: 15px
}

@media (min-width: 48em) {
    .media-list .media-text {
        display: block
    }
}

.media-frame {
    position: relative
}

.media-frame img {
    margin: 0 auto
}

.media-expansion {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer
}

.media-expansion::before {
    background-color: var(--base-color);
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .15s ease-out
}

.media-expansion:hover::before {
    opacity: .4
}

.media-expansion::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 18px;
    background-color: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, .16);
    border-radius: 10px;
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    padding: 0;
    position: absolute;
    right: 10px;
    bottom: 10px
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(34, 34, 34, .5);
    z-index: 10000
}

.modal-container {
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 4px;
    width: calc(100% - 40px);
    max-width: 980px;
    padding: 20px;
    position: fixed;
    right: 0;
    left: 0;
    margin: auto;
    z-index: 10001
}

.modal-container.modal-image-container {
    background-color: rgba(0, 0, 0, 0)
}

.modal-image-container img {
    margin: 0 auto
}

.modal-header {
    display: flex;
    justify-content: flex-start;
    flex-direction: column
}

.modal-close {
    background: rgba(0, 0, 0, 0);
    border: 0;
    padding: 0;
    margin-left: auto
}

.modal-close::before {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
    content: "";
    display: block;
    width: 18px;
    height: 18px
}

.modal-image-container .modal-close::before {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg")
}

.modal-title {
    font-size: 1.25rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .modal-title {
        font-size: 1.875rem
    }
}

.modal-description {
    margin-top: 20px
}

.modal-content {
    margin-top: 30px
}

.modal-footer {
    margin-top: 50px
}

@-webkit-keyframes mmfadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes mmfadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@-webkit-keyframes mmfadeOut {
    from {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes mmfadeOut {
    from {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

.micromodal-slide {
    display: none
}

.micromodal-slide.is-open {
    display: block
}

.micromodal-slide[aria-hidden=false] .modal-overlay {
    -webkit-animation: mmfadeIn .24s cubic-bezier(0, 0, 0.2, 1);
    animation: mmfadeIn .24s cubic-bezier(0, 0, 0.2, 1)
}

.micromodal-slide[aria-hidden=false] .modal-container {
    -webkit-animation: mmfadeIn .24s cubic-bezier(0, 0, 0.2, 1);
    animation: mmfadeIn .24s cubic-bezier(0, 0, 0.2, 1)
}

.micromodal-slide[aria-hidden=true] .modal-overlay {
    -webkit-animation: mmfadeOut .24s cubic-bezier(0, 0, 0.2, 1);
    animation: mmfadeOut .24s cubic-bezier(0, 0, 0.2, 1)
}

.micromodal-slide[aria-hidden=true] .modal-container {
    -webkit-animation: mmfadeOut .24s cubic-bezier(0, 0, 0.2, 1);
    animation: mmfadeOut .24s cubic-bezier(0, 0, 0.2, 1)
}

.micromodal-slide .modal-container, .micromodal-slide .modal-overlay {
    will-change: transform
}

.movie-list {
    display: flex;
    flex-wrap: wrap
}

.movie {
    width: 100%;
    margin-top: 10px
}

@media (min-width: 48em) {
    .movie {
        width: calc(50% - 10px);
        margin-top: 0
    }

    .movie:nth-of-type(2n) {
        margin-left: 20px
    }

    .movie:nth-of-type(n+3) {
        margin-top: 20px
    }
}

.movie-link {
    display: flex;
    align-items: center
}

.movie-thumb {
    flex: 1 0 47%;
    padding-right: 5%;
    position: relative
}

.movie-thumb img {
    width: 100%
}

.movie-inner {
    width: 50%
}

.movie-title {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.45
}

.movie-link[target=_blank] .movie-title::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -3px
}

.excursion-navigation {
    background-color: #f7f7f7;
    border-radius: 10px;
    padding: 35px 0
}

.excursion-navigation-title {
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
    padding: 0 15px
}

@media (min-width: 48em) {
    .excursion-navigation-title {
        font-size: 1.875rem
    }
}

.excursion-navigation-list {
    display: grid;
    grid-template-columns:repeat(1, minmax(0, 1fr));
    gap: 12px;
    padding: 0 20px;
    margin-top: 27px
}

@media (min-width: 48em) {
    .excursion-navigation-list {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        gap: 20px
    }
}

.excursion-navigation-item {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    padding: 30px 15px
}

.excursion-navigation-name {
    font-size: 1.125rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .excursion-navigation-name {
        text-align: center
    }
}

@media (max-width: 47.99em) {
    .excursion-navigation-picture img{
        margin: 0 auto;
    }
}

.excursion-navigation-description {
    font-size: 0.875rem;
    margin-top: 14px
}

.radio-list {
    display: flex
}

.radio-list input[type=radio] {
    display: none
}

.radio-list input[type=radio] + label:before {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 10px;
    flex-shrink: 0
}

.radio-list input[type=radio]:checked + label:before {
    background-color: #009682;
    box-shadow: 0 0 0 4px #fff inset
}

.radio-list-item + .radio-list-item {
    margin-left: 20px
}

@media (min-width: 48em) {
    .radio-list-item + .radio-list-item {
        margin-left: 30px
    }
}

.radio-list-item label {
    display: flex;
    align-items: center
}

.label-list {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px
}

.label {
    background-color: #707070;
    color: #fff;
    display: inline-block;
    font-size: 0.75rem;
    width: auto;
    min-width: 90px;
    text-align: center;
    padding: 5px
}

.label-stock {
    background-color: #db7b82
}

.label-ipo {
    background-color: #727171
}

.label-interview {
    background-color: #52915c
}

.label-report {
    background-color: #3370e1
}

.with-update {
    display: flex;
    justify-content: space-between
}

.update {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    margin-left: auto
}

.update:before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    margin-right: 8px
}

.update-text {
    text-decoration: underline
}

.update-status {
    display: inline-flex;
    align-items: center
}

.update-time {
    font-size: 0.875rem
}

.update-button {
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    margin-left: auto
}

.update-button:before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    margin-right: 8px
}

.tooltip-trigger {
    cursor: pointer
}

.tooltip-box {
    background-color: #f8f7ec;
    border-radius: 10px;
    padding: 20px;
    margin-top: 20px;
    width: 100%;
    font-size: 0.875rem;
    position: relative;
    display: none
}

.tooltip-box::before {
    border-top: 15px solid rgba(0, 0, 0, 0);
    border-right: 8px solid rgba(0, 0, 0, 0);
    border-left: 8px solid rgba(0, 0, 0, 0);
    border-bottom: 15px solid #f8f7ec;
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    top: -28px;
    left: 20px
}

.tooltip.is-open .tooltip-box {
    display: block
}

.learning {
    background-color: #f8f7ec;
    border-radius: 10px;
    box-shadow: none
}

.learning-description {
    font-size: 0.9375rem
}

.learning-inner {
    padding: 30px 20px
}

@media (min-width: 48em) {
    .learning-inner {
        padding: 30px
    }
}

.learning-links {
    display: grid;
    grid-template-columns:repeat(1, minmax(0, 1fr));
    margin-top: 25px;
    gap: 25px
}

@media (min-width: 48em) {
    .learning-links {
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }
}

.learning-link {
    display: grid;
    grid-template-columns:auto 1fr;
    grid-template-rows:auto auto auto;
    gap: 0 20px
}

.learning-link-title {
    font-size: 1.125rem;
    font-weight: 600;
    grid-column: 2;
    grid-row: 1;
    margin-bottom: 15px
}

@media (min-width: 48em) {
    .learning-link-title {
        grid-column: 1/3;
        grid-row: 1
    }
}

.learning-link-img {
    grid-column: 1;
    grid-row: 1
}

@media (min-width: 48em) {
    .learning-link-img {
        grid-row: 2
    }
}

.learning-link-description {
    font-size: 0.875rem;
    grid-column: 1/3;
    grid-row: 2
}

@media (max-width: 47.99em) {
    .learning-link-description {
        margin-top: 15px
    }
}

@media (min-width: 48em) {
    .learning-link-description {
        grid-column: 2
    }
}

.learning-link-text {
    grid-column: 1/3;
    grid-row: 3;
    text-align: right
}

@media (max-width: 47.99em) {
    .learning-link-text {
        margin-top: 15px
    }
}

.learning-link-text::after {
    background-color: var(--accent-color);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

.learning-contents {
    padding: 25px 20px 32px;
    display: grid;
    grid-template-columns:auto 1fr;
    grid-template-rows:auto 1fr auto
}

@media (min-width: 48em) {
    .learning-contents {
        grid-template-columns:auto 1fr auto;
        grid-template-rows:auto 1fr auto;
        padding: 25px;
        flex-direction: row
    }

    .learning-contents.no-list {
        padding: 10px 25px
    }
}

.learning.learning-large .learning-contents {
    border-top: 1px dashed #a7a7a7;
    padding: 25px 0;
    margin: 0 25px
}

@media (max-width: 47.99em) {
    .learning.learning-large .learning-contents {
        padding: 25px 0 32px;
        margin: 0 20px
    }
}

.learning-img {
    grid-column: 1;
    grid-row: 1/3;
    margin-right: 20px
}

@media (max-width: 47.99em) {
    .learning.learning-large .learning-img {
        grid-row: 1;
        grid-column: 1
    }
}

.learning-text {
    grid-column: 2;
    grid-row: 1;
    font-size: 0.9375rem
}

@media (min-width: 48em) {
    .learning-text {
        grid-column: 2;
        grid-row: 1;
        padding: 0;
        margin-left: 0
    }

    .learning-contents.no-list .learning-text {
        grid-row: 1/3;
        align-self: center
    }
}

@media (max-width: 47.99em) {
    .learning.learning-large .learning-text {
        grid-row: 1;
        grid-column: 2
    }
}

.learning-list {
    margin-top: 3px;
    grid-column: 1/3;
    grid-row: 2
}

@media (min-width: 48em) {
    .learning-list {
        grid-column: 2;
        margin-top: 0
    }
}

.learning-list li {
    display: inline-block;
    margin-top: 15px;
    margin-right: 15px
}

@media (min-width: 48em) {
    .learning-list li {
        margin-right: 30px
    }
}

@media (max-width: 47.99em) {
    .learning.learning-large .learning-list {
        grid-column: 1/3;
        grid-row: 2
    }
}

.learning-button {
    display: flex;
    grid-column: 1/3;
    grid-row: 3;
    flex-shrink: 0;
    margin-top: 25px;
    margin-left: auto;
    width: 100%
}

@media (min-width: 48em) {
    .learning-button {
        grid-column: 3;
        grid-row: 1/3;
        margin-top: 0;
        width: 340px
    }
}

.learning-button .button {
    height: auto;
    min-height: 0;
    align-self: flex-end
}

@media (min-width: 48em) {
    .learning-contents.no-list .learning-button {
        align-self: center
    }
}

.learning-choose {
    background-color: #f7f7f7;
    border-radius: 10px;
    padding: 25px 20px;
    margin-top: 20px
}

@media (min-width: 48em) {
    .learning-choose {
        padding: 30px 20px
    }
}

.learning-choose-list {
    display: flex;
    flex-direction: column;
    margin-top: 10px
}

@media (min-width: 48em) {
    .learning-choose-list {
        flex-direction: row;
        margin-top: 20px
    }
}

@media (max-width: 47.99em) {
    .learning-choose-item + .learning-choose-item .learning-choose-inner {
        border-top: 1px dashed #e3e3e3
    }

    .learning-choose-item:last-of-type .learning-choose-inner {
        padding: 10px 0 0
    }

    .learning-choose-inner {
        padding: 10px 0
    }
}

@media (min-width: 48em) {
    .learning-choose-inner {
        padding-right: 50px
    }
}

.learning-choose-link {
    display: flex;
    transition: opacity .4s ease-out
}

@media (min-width: 48em) {
    .learning-choose-link {
        margin-top: 0
    }

    .learning-choose-link:hover {
        opacity: .65
    }
}

.learning-choose-title {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 5px
}

@media (min-width: 48em) {
    .learning-choose-title {
        font-size: 1.125rem;
        margin-bottom: 2px
    }
}

.learning-choose-description {
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .learning-choose-description {
        font-size: 0.9375rem
    }
}

.learning-choose-thumb {
    flex-shrink: 0;
    margin-right: 11px
}

@media (max-width: 47.99em) {
    .learning-choose-thumb {
        padding-top: 10px
    }
}

@media (min-width: 48em) {
    .learning-choose-thumb {
        margin-right: 15px
    }
}

.stock-consultation {
    display: flex;
    justify-content: space-between;
    gap: 30px
}

@media (max-width: 47.99em) {
    .stock-consultation {
        flex-direction: column
    }
}

.stock-consultation-inner {
    width: 100%
}

@media (min-width: 48em) {
    .stock-consultation-inner {
        width: 53%
    }
}

.stock-consultation-mark {
    text-align: center;
    margin-top: 35px
}

.stock-consultation-image {
    width: 100%
}

@media (min-width: 48em) {
    .stock-consultation-image {
        width: 47%
    }
}

.stock-consultation-image img {
    margin-left: auto
}

@media (max-width: 47.99em) {
    .stock-consultation-image img {
        width: 100%
    }
}

.stock-consultation-button .button {
    margin: 20px auto 0
}

.hdi-japan {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    padding: 30px
}

.hdi-japan-title {
    font-size: 1.25rem;
    font-weight: 600
}

.hdi-japan-inner {
    display: flex;
    margin-top: 20px
}

@media (max-width: 47.99em) {
    .hdi-japan-inner {
        flex-direction: column;
        align-items: center
    }
}

@media (min-width: 48em) {
    .hdi-japan-inner {
        margin-top: 25px
    }
}

.hdi-japan-img {
    flex-shrink: 0
}

@media (min-width: 48em) {
    .hdi-japan-img {
        margin-right: 20px
    }
}

.hdi-japan-img img {
    margin: 0 auto
}

@media (max-width: 47.99em) {
    .hdi-japan-text {
        margin-top: 10px
    }
}

.hdi-japan-link {
    text-align: right;
    margin-top: 15px
}

.disclaimer {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    padding: 40px 20px
}

@media (min-width: 48em) {
    .disclaimer {
        padding: 40px
    }
}

.disclaimer-title {
    font-size: 1.25rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .disclaimer-title {
        font-size: 1.5rem
    }
}

.disclaimer-text {
    margin-top: 30px
}

.sns-list {
    display: flex;
    justify-content: flex-end;
    gap: 10px
}

.point-package {
    display: grid;
    grid-template-columns:1fr 90px;
    grid-template-rows:auto 1fr;
    gap: 20px
}

@media (min-width: 48em) {
    .point-package {
        grid-template-columns:1fr 180px
    }
}

.point-package .point-package-body {
    grid-column: 1/3;
    grid-row: 1/2
}

@media (min-width: 48em) {
    .point-package .point-package-body {
        grid-column: 1/2
    }
}

.point-package .point-package-notes {
    grid-column: 1/2;
    grid-row: 2/3
}

.point-package .point-package-image {
    grid-column: 2/3;
    grid-row: 2/3;
    text-align: center
}

@media (min-width: 48em) {
    .point-package .point-package-image {
        grid-row: 1/3
    }
}

.point-package .point-package-image img {
    display: inline;
    max-width: 70px
}

@media (min-width: 48em) {
    .point-package .point-package-image img {
        max-width: none
    }
}

.m-frm-suggest {
    display: none;
    background-color: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .08);
    border-top: none;
    font-size: 0.875rem;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    z-index: 100
}

.m-frm-suggest li {
    border: 1px;
    font-size: 0.875rem;
    text-align: left
}

.m-frm-suggest li a {
    cursor: pointer;
    color: var(--base-text-color);
    display: block;
    font-size: 0.875rem;
    text-decoration: none;
    padding: 10px 15px
}

.m-frm-suggest .m-frm-suggest-list li a:hover, .m-frm-suggest .m-frm-suggest-list li a.is-selected, .m-frm-suggest .m-frm-suggest-other:hover, .m-frm-suggest .m-frm-suggest-other.is-selected {
    background-color: var(--accent-color);
    color: var(--base-color)
}

.m-frm-suggest-list {
    background-color: var(--base-color);
    position: relative;
    z-index: 10
}

.m-frm-suggest .m-frm-suggest-other {
    color: var(--base-text-color);
    display: block;
    padding: 5px 10px 5px 0;
    text-align: right;
    text-decoration: none
}

html[lang=en] .hide_if_en, html[lang=ja] .hide_if_ja {
    display: none !important
}

.container [class*=theme-bgc] {
    border-radius: 10px
}

.section .section [class*=theme-bgc] {
    padding: 30px 10px
}

@media (min-width: 48em) {
    .section .section [class*=theme-bgc] {
        padding: 30px 20px
    }
}

.l-with-local-nav [class*=theme-bgc] {
    border-radius: 10px
}

.l-with-local-nav [class*=theme-bgc] + [class*=theme-bgc] {
    margin-top: 20px
}

.theme-bgc-transparent {
    background-color: rgba(0, 0, 0, 0) !important
}

.theme-bgc-white {
    background-color: var(--base-color)
}

.theme-bgc-gray {
    background-color: #f7f7f7
}

.theme-bgc-green {
    background-color: #e9f4f1
}

.theme-bgc-beige {
    background-color: #f8f7ec
}

.theme-bgc-white {
    background-color: #fff
}

.theme-bgc-pink {
    background-color: #fef6f8
}

.theme-bgc-blue {
    background-color: #f2fafd
}

.theme-bgc-steelblue {
    background-color: #f2f6fa
}

.theme-bgc-darker-blue {
    background-color: #f2f6fa
}

.theme-border-none {
    border: none !important
}

.theme-border-green {
    border-color: #00aa8a !important
}

.theme-border-red {
    border-color: #e83a3a !important
}

.theme-border-pink {
    border-color: var(--usstock-color) !important
}

.theme-border-blue {
    border-color: var(--fund-color) !important
}

.theme-border-fx {
    border-color: var(--fx-color) !important
}

.theme-border-gray {
    border-color: rgba(0, 0, 0, .08) !important
}

.theme-border-darker-gray {
    border-color: #ccc !important
}

.theme-border-light-gray {
    border-color: #f7f7f7 !important
}

.theme-border-beige {
    border-color: #f8f7ec !important
}

.theme-border-box {
    border-width: 2px;
    border-style: solid;
    border-radius: 10px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    padding: 40px 16px 42px
}

@media (min-width: 48em) {
    .theme-border-box {
        padding: 50px
    }
}

.theme-box-shadow {
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11)
}

.theme-box-base {
    border: 1px solid rgba(0, 0, 0, .1)
}

.theme-box-no-border {
    border: none
}

.theme-box-gray {
    background-color: #f7f7f7
}

.theme-box-beige {
    background-color: #f8f7ec
}

.theme-box-green {
    background-color: #e9f4f1
}

.theme-box-alert {
    background-color: rgba(232, 84, 113, .05);
    border-color: var(--caution-color)
}

.theme-box-error {
    border-color: var(--caution-color)
}

.theme-box-point {
    background-color: #f8f7ec;
    border-color: #f8f7ec
}

.theme-box-title-alert .theme-icon-alert {
    margin-right: 5px;
    vertical-align: -4px
}

.theme-box-title-warning .theme-icon-warning {
    margin-right: 5px;
    vertical-align: -4px
}

.theme-box-title-point .theme-icon-point {
    margin-right: 5px;
    vertical-align: -2px
}

.theme-box-title-caution .theme-icon-news {
    margin-right: 5px;
    vertical-align: -4px
}

.theme-green-button {
    background-color: var(--accent-color);
    border-color: var(--accent-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-green-button {
        max-width: 340px
    }
}

.theme-green-button[target=_blank]:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.theme-pink-button {
    background-color: var(--usstock-color);
    border-color: var(--usstock-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-pink-button {
        max-width: 340px
    }
}

.theme-blue-button {
    background-color: var(--fund-color);
    border-color: var(--fund-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-blue-button {
        max-width: 340px
    }
}

.theme-primary-button {
    background-color: var(--base-color);
    font-size: 0.9375rem;
    padding: 15px 20px;
    margin: 0 auto;
    width: calc(100% - 30px)
}

@media (min-width: 48em) {
    .theme-primary-button {
        width: 100%;
        max-width: 340px
    }
}

.theme-flexible-button {
    background-color: var(--base-color);
    border-color: rgba(0, 0, 0, .1);
    font-size: 0.9375rem;
    padding: 15px;
    display: inline-block;
    width: auto
}

.theme-flexible-button[target=_blank] {
    padding: 15px
}

.theme-flexible-button[target=_blank]::after {
    position: relative;
    display: inline-block;
    right: 0;
    margin-left: 4px;
    vertical-align: -2px
}

.theme-flexible-button.theme-register-button, .theme-flexible-button.theme-corporate-button {
    width: auto
}

.theme-small-button {
    padding: 10px 15px
}

.theme-small-button[target=_blank] {
    padding: 10px 15px
}

.theme-large-button {
    font-size: 1.25rem;
    padding: 18px 40px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-large-button {
        width: 100%;
        max-width: 372px
    }
}

.theme-register-button {
    background-color: #e83a3a;
    color: var(--base-color);
    font-size: 0.9375rem;
    padding: 15px 20px
}

@media (min-width: 48em) {
    .theme-register-button {
        width: 372px;
        max-width: none
    }
}

.theme-corporate-button {
    background-color: #072f7d;
    color: var(--base-color);
    padding: 15px 20px
}

@media (min-width: 48em) {
    .theme-corporate-button {
        width: 340px
    }
}

.theme-account-button {
    font-size: 1.25rem;
    position: relative;
    padding: 18px 24px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-account-button {
        width: 100%;
        max-width: 372px
    }
}

.theme-account-button::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    content: "";
    display: inline-block;
    width: 18px;
    height: 21px;
    position: absolute;
    top: 0;
    left: 20px;
    bottom: 0;
    margin: auto 0
}

.theme-request-button {
    border: 1px solid #e83a3a;
    font-size: 1.25rem;
    padding: 18px;
    margin: 0 auto;
    position: relative
}

@media (min-width: 48em) {
    .theme-request-button {
        width: 372px
    }
}

.theme-anchor-button {
    border-radius: 45px;
    font-size: 0.875rem;
    font-weight: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 35px 8px 24px;
    position: relative
}

@media (max-width: 47.99em) {
    .theme-anchor-button {
        min-height: 61px
    }
}

@media (min-width: 48em) {
    .theme-anchor-button {
        font-size: 0.9375rem;
        padding: 15px 35px 15px 30px
    }
}

.theme-anchor-button::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 35%;
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    margin: auto 0
}

.theme-search-button {
    border-color: rgba(0, 0, 0, .1);
    font-size: 0.9375rem;
    width: 170px;
    padding: 15px 10px;
    line-height: 1
}

.theme-reset-button {
    border-color: rgba(0, 0, 0, .1);
    max-width: 120px
}

.theme-close-button {
    background-color: var(--base-color);
    border-color: rgba(0, 0, 0, .1);
    font-size: 0.9375rem;
    font-weight: 500;
    max-width: 159px;
    display: flex;
    align-items: center;
    padding: 10px;
    margin: 0 auto;
    position: relative
}

.theme-close-button::before {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    margin: auto
}

.theme-back-button {
    border: 1px solid rgba(0, 0, 0, .1);
    padding: 15px 16px;
    position: relative;
    width: 100%;
    max-width: 340px;
    margin: 0 auto
}

.theme-back-button::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 45%;
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    position: absolute;
    top: 0;
    left: 10px;
    bottom: 0;
    margin: auto 0
}

.theme-stock-button {
    background-color: var(--stock-color);
    border-color: var(--stock-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-stock-button {
        max-width: 340px
    }
}

.theme-fund-button {
    background-color: var(--fund-color);
    border-color: var(--fund-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-fund-button {
        max-width: 340px
    }
}

.theme-usmmf-button {
    background-color: var(--usmmf-color);
    border-color: var(--usmmf-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-usmmf-button {
        max-width: 340px
    }
}

.theme-fx-button {
    background-color: var(--fx-color);
    border-color: var(--fx-color);
    color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-fx-button {
        max-width: 340px
    }
}

.theme-counter-button {
    font-weight: 600;
    color: #009682;
    counter-increment: number;
    padding: 15px 35px 15px 65px
}

.theme-counter-button::before {
    content: "0" counter(number);
    color: rgba(0, 150, 130, .5);
    display: block;
    font-style: italic;
    font-size: 2.375rem;
    position: absolute;
    left: 15px
}

.theme-pdf-button {
    background-color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px
}

.theme-pdf-button::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 12px;
    vertical-align: -3px
}

.theme-excel-button {
    background-color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px
}

.theme-excel-button::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 12px;
    vertical-align: -3px
}

.theme-more-button {
    background-color: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .08);
    cursor: pointer;
    font-size: 0.9375rem;
    padding: 10px 15px 10px 30px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    max-width: 160px
}

.theme-more-button::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    margin-left: auto
}

.js-accordion.is-open .theme-more-button::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    top: -8px
}

.theme-order-button {
    border: 1px solid #e83a3a;
    padding: 10px 20px
}

.theme-accumulation-button {
    border: 1px solid #009682;
    padding: 10px 20px
}

.theme-movie-button {
    background-color: var(--base-color);
    font-weight: 600;
    padding: 15px 20px
}

.theme-movie-button::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 25px;
    height: 18px;
    margin-left: 12px;
    vertical-align: -4px
}

.theme-step-button {
    background-color: var(--base-color);
    border-color: rgba(0, 0, 0, .08);
    display: flex;
    align-items: center;
    text-align: left;
    font-weight: 600;
    padding: 15px;
    text-decoration: none
}

.theme-step-button::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    border-radius: 50%;
    background-size: 6px;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: auto;
    flex-shrink: 0
}

.theme-step-button .number {
    color: var(--accent-color);
    font-weight: 600;
    font-style: italic;
    flex-shrink: 0;
    margin-right: 10px
}

.theme-stock-contact-button {
    background-color: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .1);
    font-weight: 600;
    max-width: 340px;
    padding: 15px 20px;
    position: relative
}

.theme-stock-contact-button::before {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: 15px;
    bottom: 0;
    margin: auto 0
}

.theme-chat-support, .theme-ai-chat-support {
    position: relative;
    padding: 15px 55px
}

.theme-chat-support::after {
    background: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg") no-repeat center center
}

.theme-ai-chat-support::after {
    background: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg") no-repeat center center
}

.theme-chat-support::after, .theme-ai-chat-support::after {
    content: "";
    display: block;
    width: 42px;
    height: 42px;
    position: absolute;
    left: 15px;
    top: calc(50% - 21px)
}

.theme-gray-color {
    color: #727171
}

.theme-green-color {
    color: #009682
}

.theme-plus-color {
    color: #ee0101
}

.theme-minus-color {
    color: #2a84dd
}

.theme-divider-dash {
    border-top: 1px dashed #ccc
}

.filter-list .filter-button.theme-filter-button-stock {
    border-color: var(--stock-color)
}

.filter-list .filter-button.theme-filter-button-stock.is-active {
    background-color: var(--stock-color)
}

.filter-list .filter-button.theme-filter-button-usstock {
    border-color: var(--usstock-color)
}

.filter-list .filter-button.theme-filter-button-usstock.is-active {
    background-color: var(--usstock-color)
}

.filter-list .filter-button.theme-filter-button-fund {
    border-color: var(--fund-color)
}

.filter-list .filter-button.theme-filter-button-fund.is-active {
    background-color: var(--fund-color)
}

.filter-list .filter-button.theme-filter-button-fx {
    border-color: var(--fx-color)
}

.filter-list .filter-button.theme-filter-button-fx.is-active {
    background-color: var(--fx-color)
}

.filter-list .filter-button.theme-filter-button-other {
    border-color: #ccc
}

.filter-list .filter-button.theme-filter-button-other.is-active {
    background-color: #ccc
}

@media (min-width: 48em) {
    .theme-grid-border {
        gap: 0
    }

    .theme-grid-border > *:first-of-type {
        padding-right: 30px
    }

    .theme-grid-border > *:last-of-type {
        border-left: 1px solid var(--gray-border-color);
        padding-left: 30px
    }
}

.theme-section-border-top {
    position: relative;
    padding-top: 40px;
    margin-top: 40px
}

@media (min-width: 48em) {
    .theme-section-border-top {
        padding-top: 50px;
        margin-top: 50px
    }
}

.theme-section-border-top::before {
    background-color: #d8d8d8;
    width: 100%;
    height: 1px;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-section-border-top::before {
        max-width: 1200px
    }
}

.theme-section-dashed-top {
    position: relative;
    padding-top: 40px;
    margin-top: 40px
}

@media (min-width: 48em) {
    .theme-section-dashed-top {
        padding-top: 50px;
        margin-top: 50px
    }
}

.theme-section-dashed-top::before {
    border-top: 1px dashed #a7a7a7;
    width: 100%;
    height: 1px;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

@media (min-width: 48em) {
    .theme-section-dashed-top::before {
        max-width: 1200px
    }
}

.theme-section-counter {
    counter-increment: section-number
}

.theme-section-counter.section:first-of-type {
    padding-bottom: 0
}

.theme-section-counter > .section-header .section-title, .theme-section-counter > .container > .section-header .section-title {
    font-size: 1.125rem;
    display: flex
}

@media (min-width: 48em) {
    .theme-section-counter > .section-header .section-title, .theme-section-counter > .container > .section-header .section-title {
        font-size: 1.5rem
    }
}

.theme-section-counter > .section-header .section-title::before, .theme-section-counter > .container > .section-header .section-title::before {
    color: rgba(0, 150, 130, .5);
    content: counter(section-number, decimal-leading-zero);
    font-style: italic;
    font-size: 2rem;
    margin-top: -5px;
    margin-right: 10px
}

.l-with-local-nav .theme-section-counter > .section-header .section-title, .l-with-local-nav .theme-section-counter > .container > .section-header .section-title {
    font-size: 1.125rem;
    display: flex
}

@media (min-width: 48em) {
    .l-with-local-nav .theme-section-counter > .section-header .section-title, .l-with-local-nav .theme-section-counter > .container > .section-header .section-title {
        font-size: 1.5rem
    }
}

.l-with-local-nav .theme-section-counter > .section-header .section-title::before, .l-with-local-nav .theme-section-counter > .container > .section-header .section-title::before {
    content: counter(section-number, decimal-leading-zero);
    font-style: italic;
    font-size: 2rem;
    margin-top: -5px;
    margin-right: 10px
}

.l-with-local-nav .theme-section-counter.theme-bgc-green .section-title::before {
    color: rgba(0, 150, 130, .5)
}

.theme-section-flow {
    position: relative
}

.theme-section-flow + .theme-section-flow::before {
    border-top: 20px solid #7fcac0;
    border-right: 40px solid rgba(0, 0, 0, 0);
    border-bottom: 20px solid rgba(0, 0, 0, 0);
    border-left: 40px solid rgba(0, 0, 0, 0);
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin: 0 auto
}

.theme-question-section h2.section-title + h2.section-title {
    padding-top: 30px
}

@media (min-width: 48em) {
    .theme-question-section h2.section-title + h2.section-title {
        padding-top: 40px
    }
}

.theme-question-section h3.section-title + h3.section-title {
    padding-top: 20px
}

@media (min-width: 48em) {
    .theme-question-section h3.section-title + h3.section-title {
        padding-top: 30px
    }
}

.theme-question-section .text-link::after {
    display: none
}

.theme-question-section.section + .theme-question-section.section {
    padding-top: 30px
}

@media (min-width: 48em) {
    .theme-question-section.section + .theme-question-section.section {
        padding-top: 40px
    }
}

.tab-list.tab-small-list .tab-button.theme-tab-button-stock {
    border-color: var(--stock-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-stock.is-active {
    background-color: var(--stock-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-usstock {
    border-color: var(--usstock-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-usstock.is-active {
    background-color: var(--usstock-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-fund {
    border-color: var(--fund-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-fund.is-active {
    background-color: var(--fund-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-fx {
    border-color: var(--fx-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-fx.is-active {
    background-color: var(--fx-color)
}

.tab-list.tab-small-list .tab-button.theme-tab-button-other {
    border-color: #ccc
}

.tab-list.tab-small-list .tab-button.theme-tab-button-other.is-active {
    background-color: #ccc
}

.table > tbody th.theme-cell-green, .table > tbody td.theme-cell-green {
    background-color: #078271;
    color: #fff
}

.table > tbody th.theme-cell-gray, .table > tbody td.theme-cell-gray {
    background-color: #078271;
    color: #fff
}

.table > tbody th.theme-cell-darker-gray, .table > tbody td.theme-cell-darker-gray {
    background-color: #078271;
    color: #fff
}

.table > tbody th.theme-cell-beige, .table > tbody td.theme-cell-beige {
    background-color: #f8f7ec
}

@media (max-width: 47.99em) {
    .theme-table-flow-column colgroup {
        display: none
    }

    .theme-table-flow-column > tbody tr {
        display: flex;
        flex-direction: column
    }
}

.theme-table-flow-column > tbody th {
    text-align: left;
    padding: 16px 10px
}

@media (min-width: 48em) {
    .theme-table-flow-column > tbody th {
        padding: 16px
    }
}

@media (max-width: 47.99em) {
    .theme-table-flow-column > tbody td {
        border-top: 0
    }
}

[class*=theme-icon] {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain
}

.theme-icon-up {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.theme-icon-down {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.theme-icon-stay {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.theme-icon-jpy {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-usd {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-nzd {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-aud {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-dem {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-cad {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-eur {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-frf {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-gbp {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png)
}

.theme-icon-news {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    display: inline-block;
    width: 22px;
    height: 22px
}

.theme-icon-point {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    display: inline-block;
    width: 24px;
    height: 24px
}

.theme-icon-alert {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    display: inline-block;
    width: 30px;
    height: 26px
}

.theme-icon-warning {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    display: inline-block;
    width: 24px;
    height: 24px
}

.theme-simple-panel {
    border: 0;
    -webkit-filter: none;
    filter: none
}

.theme-small-panel {
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-filter: none;
    filter: none
}

.theme-small-panel .panel-pic {
    width: 30%;
    max-width: 80px
}

@media (max-width: 47.99em) {
    .theme-reel-money-satellite .reel-item {
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 10px;
        box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
        overflow: hidden
    }
}

.theme-reel-money-satellite .reel-text {
    font-size: 0.875rem
}

@media (max-width: 47.99em) {
    .theme-reel-money-satellite .reel-text {
        padding: 0 10px 15px
    }
}

.theme-title-border {
    position: relative;
    padding-left: 10px
}

.theme-title-border::before {
    background-color: #959595;
    border-radius: 2px;
    content: "";
    display: block;
    width: 3px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.theme-title-border-green {
    position: relative;
    padding-left: 10px
}

.theme-title-border-green::before {
    background-color: rgba(0, 150, 130, .55);
    border-radius: 2px;
    content: "";
    display: block;
    width: 3px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.theme-title-question::before, .theme-title-answer::before {
    border-radius: 4px;
    color: var(--base-color);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    font-size: 1rem;
    font-weight: 500;
    width: 26px;
    height: 26px;
    margin-right: 6px
}

.theme-title-question {
    display: flex;
    position: relative
}

.theme-title-question::before {
    background-color: var(--accent-color);
    content: "Q"
}

.theme-title-answer {
    display: flex;
    position: relative
}

.theme-title-answer::before {
    background-color: var(--caution-color);
    content: "A"
}

h2.theme-title-question:before, h2.theme-title-answer:before {
    margin-top: -2px
}

@media (min-width: 48em) {
    h2.theme-title-question:before, h2.theme-title-answer:before {
        margin-top: 2px
    }
}

@media (max-width: 47.99em) {
    h3.theme-title-question:before, h3.theme-title-answer:before {
        margin-top: -4px
    }
}

.theme-label-list-small .label {
    min-width: 0;
    padding: 1px 4px
}

.theme-label-base {
    background-color: var(--base-color);
    border: 1px solid #ccc;
    color: var(--base-text-color)
}

.theme-label-brand {
    background-color: var(--accent-color);
    border: 1px solid var(--accent-color);
    color: var(--base-color)
}

.theme-label-gray {
    background-color: #f7f7f7;
    border: 1px solid #f7f7f7;
    color: var(--base-text-color)
}

.theme-label-require {
    background-color: var(--caution-color);
    color: var(--base-color)
}

.theme-label-stock {
    background-color: #db7b82;
    color: var(--base-color)
}

.theme-label-ipo {
    background-color: #727171;
    color: var(--base-color)
}

.theme-label-interview {
    background-color: #52915c;
    color: var(--base-color)
}

.theme-label-report {
    background-color: #3370e1;
    color: var(--base-color)
}

.theme-label-jpstock {
    background-color: var(--base-color);
    border: var(--stock-color) 1px solid;
    color: var(--base-text-color)
}

.theme-label-online {
    background-color: var(--base-color);
    border: var(--stock-color) 1px solid;
    color: var(--base-text-color)
}

.theme-label-usstock {
    background-color: var(--base-color);
    border: var(--usstock-color) 1px solid;
    color: var(--base-text-color)
}

.theme-label-fx {
    background-color: var(--base-color);
    border: var(--fx-color) 1px solid;
    color: var(--base-text-color)
}

.theme-label-fund {
    background-color: var(--base-color);
    border: var(--fund-color) 1px solid;
    color: var(--base-text-color)
}

.theme-label-limited {
    background-color: var(--caution-color);
    border: var(--caution-color) 1px solid;
    color: var(--base-color)
}

.theme-label-full {
    background-color: var(--base-color);
    border: var(--caution-color) 1px solid;
    color: var(--caution-color)
}

.theme-label-other {
    background-color: var(--base-color);
    border: #ccc 1px solid;
    color: var(--base-text-color);
    width: auto;
    min-width: 90px
}

.theme-link-large {
    font-size: 1.5rem
}

.theme-link-large.link::after {
    vertical-align: 0
}

.theme-link-bold {
    font-weight: 600
}

.theme-link-bold.text-link {
    text-decoration: none
}

.theme-link-bold.text-link:hover {
    text-decoration: underline
}

[class*=theme-list] li::before {
    display: inline-block;
    flex-shrink: 0;
    margin-right: 5px
}

[class*=theme-list] .theme-list-title {
    display: block;
    font-weight: 600;
    font-style: normal
}

.theme-list-reference > li::before {
    content: "※"
}

.theme-list-disc {
    display: grid;
    gap: 20px
}

.theme-list-disc > li {
    padding-left: 16px;
    text-indent: 0;
    position: relative
}

.theme-list-disc > li::before {
    content: "・";
    margin-right: 0;
    position: absolute;
    top: 0;
    left: 0
}

.theme-list-wide-disc {
    display: grid;
    gap: 30px
}

.theme-list-wide-disc > li {
    display: flex;
    text-indent: 0
}

.theme-list-wide-disc > li::before {
    content: "・";
    margin-right: 0
}

.theme-list-decimal {
    list-style: decimal
}

.theme-list-decimal > li {
    counter-increment: number;
    margin-left: 2em
}

.theme-list-decimal > li .list {
    margin-top: 20px;
    padding-left: 0
}

.theme-list-decimal > li > .theme-list-decimal {
    margin-left: 0
}

.theme-list-counters li {
    position: relative
}

.theme-list-counters > li .number {
    flex-shrink: 0;
    margin-right: 5px;
    width: 46px;
    position: absolute;
    top: 0;
    left: 0
}

.theme-list-counters > li > .theme-list-counters {
    padding-left: 0
}

.theme-list-counters > li > .theme-list-counters > li {
    padding-left: 48px
}

.theme-list-brackets > li {
    counter-increment: number;
    position: relative;
    padding-left: 50px
}

.theme-list-brackets > li .number {
    width: 50px;
    position: absolute;
    top: 0;
    left: 0
}

.theme-list-asterisk {
    font-size: 0.875rem
}

.theme-list-asterisk > li {
    display: flex
}

.theme-list-asterisk > li::before {
    content: "※"
}

.theme-list-asterisk > li .number {
    display: inline;
    margin-right: 6px;
    margin-left: -4px;
    min-width: 1.4em
}

.theme-list-link {
    gap: 18px
}

.theme-list-link > li > a {
    text-decoration: underline
}

.theme-list-question {
    display: grid;
    gap: 20px
}

.theme-list-question > li {
    display: flex;
    margin-top: 2px
}

.theme-list-question > li::before {
    border-radius: 4px;
    background-color: #009682;
    color: #fff;
    content: "Q";
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 26px;
    height: 26px;
    margin-right: 6px
}

.theme-list-question > li > a {
    display: inline-block;
    margin-top: 2px;
    text-decoration: underline
}

.theme-list-question a[target=_blank]::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -2px
}

.theme-list-horizontal {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 20px
}

.theme-list-point {
    counter-reset: number;
    gap: 0
}

.theme-list-point > li {
    display: flex;
    align-items: flex-start;
    counter-increment: number;
    font-weight: 600;
    padding: 20px 0
}

@media (max-width: 47.99em) {
    .theme-list-point > li {
        align-items: flex-start;
        flex-direction: column
    }
}

.theme-list-point > li .point {
    background-color: var(--accent-color);
    border-radius: 4px;
    color: var(--base-color);
    flex-shrink: 0;
    font-size: 0.875rem;
    padding: 2px 15px;
    line-height: 1
}

@media (max-width: 47.99em) {
    .theme-list-point > li .point {
        margin-bottom: 10px
    }
}

@media (min-width: 48em) {
    .theme-list-point > li .point {
        margin-right: 20px
    }
}

.theme-list-point > li .point::after {
    content: counter(number);
    font-size: 1.25rem;
    margin-left: 4px;
    vertical-align: -1px
}

.theme-list-point > li + li {
    border-top: 1px solid #d8d8d8
}

.theme-list-topic.theme-list-topic-column li {
    flex-direction: column
}

.theme-list-topic.theme-list-topic-column a {
    margin: 4px 0 0 0
}

.theme-list-topic li {
    display: flex;
    align-items: center
}

@media (max-width: 47.99em) {
    .theme-list-topic li {
        flex-wrap: wrap
    }
}

@media (min-width: 48em) {
    .theme-list-topic li {
        align-items: flex-start
    }
}

.theme-list-topic li .meta {
    display: flex;
    align-items: center
}

@media (max-width: 47.99em) {
    .theme-list-topic li .meta {
        margin-right: auto
    }
}

.theme-list-topic li .date {
    font-size: 0.875rem;
    margin-right: 8px
}

.theme-list-topic li .label {
    background-color: var(--base-color);
    border: 1px solid #ccc;
    color: var(--base-text-color);
    flex-shrink: 0
}

.theme-list-topic li > a {
    display: block;
    width: 100%;
    text-decoration: underline;
    transition: opacity .15s ease-out
}

@media (hover: hover) {
    .theme-list-topic li > a:hover {
        opacity: .5
    }
}

@media (max-width: 47.99em) {
    .theme-list-topic li > a {
        margin-top: 15px
    }
}

@media (min-width: 48em) {
    .theme-list-topic li > a {
        margin-top: 3px;
        margin-left: 10px;
        width: auto
    }
}

@media (max-width: 47.99em) {
    .theme-list-topic.theme-list-topic-adjust li:nth-of-type(n + 4) {
        display: none
    }
}

.theme-list-label .label {
    margin-right: 10px
}

.theme-list-label li {
    display: flex;
    align-items: center
}

.theme-list-label a.new:after {
    content: "NEW!";
    color: #ee0101;
    font-size: 0.875rem;
    margin-left: 8px
}

.theme-list-label a span {
    text-decoration: underline;
    transition: opacity .15s ease-out
}

@media (hover: hover) {
    .theme-list-label a span:hover {
        opacity: .5
    }
}

.theme-list-label a .time {
    text-decoration: underline
}

.theme-list-label a .icon-blank:before {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0 2px;
    vertical-align: -4px
}

.theme-list-label a .icon-pdf:before {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0 2px;
    vertical-align: -5px
}

.theme-list-ipo li [class*=icon-] {
    margin-left: 4px
}

.theme-list-pdf {
    display: grid;
    grid-template-columns:repeat(1, minmax(0, 1fr));
    gap: 20px
}

@media (min-width: 768px) {
    .theme-list-pdf {
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }
}

.theme-list-pdf li.new:after {
    content: "NEW!";
    color: #ee0101;
    font-size: 0.875rem;
    margin-left: 6px
}

.theme-list-pdf li a {
    transition: opacity .15s ease-out
}

@media (hover: hover) {
    .theme-list-pdf li a:hover {
        opacity: .5
    }
}

.theme-list-pdf li a::after {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center;
    border-radius: 50%;
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-left: 6px;
    vertical-align: -3px
}

.theme-list-no-style::before {
    display: none !important
}

.theme-list-text-center li {
    justify-content: center;
    text-align: center
}

.theme-question-list-border li + li {
    border-top: 1px dashed var(--gray-border-color);
    padding-top: 20px
}

.theme-list-step-button {
    gap: 18px
}

.theme-image-center {
    justify-content: center
}

.theme-image-right {
    justify-content: flex-end
}

.theme-image-full {
    width: 100%
}

.theme-image-full img {
    width: 100%
}

[class*=theme-media-float-] {
    overflow: hidden
}

@media (min-width: 48em) {
    [class*=theme-media-float-] {
        display: block
    }
}

.theme-media-float-left .media-thumb {
    float: left
}

@media (min-width: 48em) {
    .theme-media-float-left .media-thumb {
        margin-right: 20px
    }
}

.theme-media-float-right .media-thumb {
    float: right
}

@media (min-width: 48em) {
    .theme-media-float-right .media-thumb {
        margin-left: 20px
    }
}

@media (max-width: 47.99em) {
    .theme-media-column {
        display: flex;
        flex-direction: column
    }

    .theme-media-column .media-thumb {
        margin-right: 0;
        margin-left: 0
    }

    .theme-media-column-reverse {
        display: flex;
        flex-direction: column-reverse
    }

    .theme-media-column-reverse .media-thumb {
        margin-right: 0;
        margin-left: 0
    }
}

.top-mv {
    display: grid;
    grid-template-columns:1fr;
    grid-template-rows:auto;
    position: relative
}

.top-mv .top-mv-picture {
    display: grid;
    place-items: center;
    grid-column: 1;
    grid-row: 1
}

.top-mv .top-mv-inner {
    width: 100%;
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
    position: relative;
    grid-column: 1;
    grid-row: 1;
    z-index: 2
}

.top-mv .top-mv-lead {
    padding-top: 45px;
    color: var(--base-color);
    font-size: 0.875rem
}

@media (min-width: 32.5em) {
    .top-mv .top-mv-lead {
        padding-left: 20px;
        font-size: 1.375rem
    }
}

.top-mv .top-mv-lead > img {
    width: 48%;
    max-width: 326px
}

@media (min-width: 62.5em) {
    .top-mv .top-mv-lead > img {
        width: 30%
    }
}

.top-mv .top-mv-link {
    margin-top: 30px
}

@media (min-width: 32.5em) {
    .top-mv .top-mv-link {
        padding-left: 25px;
        margin-top: 36px
    }
}

.top-mv .top-cv {
    background-color: rgba(0, 150, 130, .3);
    padding: 8px;
    text-align: center;
    position: absolute;
    width: calc(100% - 30px);
    right: 0;
    bottom: -120px
}

@media (min-width: 32.5em) {
    .top-mv .top-cv {
        bottom: -196px
    }
}

@media (min-width: 48em) {
    .top-mv .top-cv {
        bottom: -278px
    }
}

@media (max-width: 62.4375em) {
    .top-mv .top-cv {
        margin: 0 auto;
        left: 0
    }
}

@media (min-width: 62.5em) {
    .top-mv .top-cv {
        background-color: rgba(0, 0, 0, .1);
        width: 100%;
        max-width: 376px;
        position: absolute;
        top: 80px;
        right: 20px;
        bottom: initial
    }
}

.top-mv .top-cv-inner {
    background-color: var(--base-color);
    border-radius: 4px;
    padding: 20px 15px 15px
}

.top-mv .top-cv-title {
    margin-bottom: 15px;
    font-size: 0.9375rem;
    font-weight: 600
}

.top-mv .top-cv-text {
    font-size: 0.75rem;
    padding-top: 8px
}

@media (min-width: 48em) {
    .top-mv .top-cv-text {
        border-bottom: 1px solid #b7b7b7;
        font-size: 0.8125rem;
        padding: 10px 0;
        margin-bottom: 15px
    }
}

.top-mv .top-cv-register {
    background-color: #e83a3a;
    color: var(--base-color);
    font-size: 0.9375rem;
    padding: 16px 0;
    width: 100%;
    position: relative
}

.top-mv .top-cv-register::before {

}

.top-mv .top-cv-support {
    border: 1px solid #ee0101;
    color: #ee0101;
    font-size: 0.875rem;
    padding: 6px 0 7px;
    margin-top: 10px;
    width: 100%
}

.top-mv .top-cv-login {
    background-color: #009682;
    color: var(--base-color);
    font-size: 0.9375rem;
    padding: 16px 0;
    width: 100%;
    position: relative
}

@media (max-width: 47.99em) {

}

.top-mv .top-cv-login::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_local_login.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: block;
    width: 19px;
    height: 18px;
    position: absolute;
    top: 0;
    left: 16px;
    bottom: 0;
    margin: auto 0
}

.top-member-mv {
    display: grid;
    grid-template-columns:1fr;
    grid-template-rows:1fr
}

.top-member-mv .top-campaign-link {
    display: none
}

.top-member-mv .box.theme-box-error {
    position: absolute;
    bottom: 0
}

.top-member-mv .top-member-campaign .top-campaign-body {
    display: block
}

.top-member-mv-picture {
    display: grid;
    grid-template-rows:1fr;
    place-items: center;
    grid-column: 1;
    grid-row: 1
}

@media (min-width: 48em) {
    .top-member-mv-picture > img {
        grid-row: 1;
        object-fit: cover;
        width: 100%;
        max-width: 1920px;
        height: 100%
    }
}

@media (max-width: 47.99em) {
    .top-member-mv-picture > img {
        grid-row: 1;
        object-fit: cover;
        width: 100%;
        height: 100%
    }
}

.top-member-campaign {
    grid-column: 1;
    grid-row: 1;
    position: relative;
    width: 100%;
    max-width: 1240px;
    padding: 43px 0 70px 0;
    margin: 0 auto;
    overflow: hidden;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

@media (min-width: 48em) {
    .top-member-campaign {
        padding: 20px 20px 130px 20px
    }
}

.top-member-campaign .reel.reel-sp-only {
    width: 100%
}

@media (min-width: 48em) {
    .top-member-campaign .reel.reel-sp-only {
        overflow: visible !important
    }

    .top-member-campaign .reel.reel-sp-only .reel-container {
        padding-bottom: 0 !important
    }
}

@media (max-width: 47.99em) {
    .top-member-campaign .reel.reel-sp-only {
        margin: 0
    }
}

.top-member-campaign .top-campaign-list {
    display: flex;
    width: 100%;
    margin: 0 auto
}

@media (min-width: 48em) {
    .top-member-campaign .top-campaign-list {
        position: relative;
        max-width: 1240px;
        margin: 0 auto;
        padding-bottom: 4px;
        z-index: 2
    }
}

.top-member-campaign .top-campaign-list > li {
    background-color: var(--base-color);
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, .16)
}

.top-member-campaign .top-campaign-body {
    padding: 10px
}

@media (min-width: 48em) {
    .top-member-campaign .top-campaign-body {
        padding: 20px
    }
}

.top-member-campaign .top-campaign-body > * + * {
    margin-top: 5px
}

@media (min-width: 48em) {
    .top-member-campaign .top-campaign-body > * + * {
        margin-top: 10px
    }
}

.top-member-campaign .top-campaign-title {
    font-weight: 600
}

@media (max-width: 47.99em) {
    .top-member-campaign .top-campaign-title {
        font-size: 0.875rem
    }

    .top-member-campaign .top-campaign-text {
        font-size: 0.75rem
    }
}

.top-campaign {
    margin-top: 165px;
    position: relative;
    z-index: 2
}

@media (min-width: 32.5em) {
    .top-campaign {
        margin-top: 206px
    }
}

@media (min-width: 48em) {
    .top-campaign {
        margin-top: 288px
    }
}

@media (min-width: 62.5em) {
    .top-campaign {
        margin-top: -50px
    }
}

.top-campaign .top-campaign-list .swiper-slide {
    background: #fff
}

.top-campaign .top-campaign-body {
    display: none
}

.top-campaign .top-campaign-link {
    width: 100%;
    margin: 30px auto 0;
    padding: 0 15px;
    font-size: 1rem;
    text-align: right
}

@media (min-width: 48em) {
    .top-campaign .top-campaign-link {
        max-width: 1240px;
        padding: 0
    }
}

.top-campaign-thumb > img {
    width: 100%
}

.top-alert {
    margin-top: 20px
}

@media (min-width: 48em) {
    .top-alert {
        margin-top: 30px
    }
}

@media (max-width: 47.99em) {
    .top-member-alert {
        padding: 0 20px
    }
}

.top-product {
    width: 100%;
    padding: 36px 0 30px;
    margin-top: 28px;
    position: relative
}

@media (min-width: 48em) {
    .top-product {
        padding: 50px 0 40px;
        margin-top: 40px
    }
}

.top-product::before {
    background-color: #d8d8d8;
    content: "";
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

.top-product h2.section-title {
    margin-bottom: 26px
}

@media (min-width: 48em) {
    .top-product h2.section-title {
        margin-bottom: 46px
    }
}

.top-product .top-product-list {
    display: flex;
    flex-wrap: wrap;
    margin: -5px -5px -5px -4px
}

@media (min-width: 48em) {
    .top-product .top-product-list {
        flex-wrap: nowrap;
        margin: 0 -10px
    }
}

.top-product .top-product-list > li {
    width: calc(50% - 9px);
    margin: 5px 5px 5px 4px
}

@media (min-width: 48em) {
    .top-product .top-product-list > li {
        width: 25%;
        margin: 0 10px
    }
}

.top-product .top-product-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    padding: 18px 15px 16px;
    border-radius: 10px
}

@media (min-width: 48em) {
    .top-product .top-product-block {
        max-width: 285px;
        padding: 38px 20px 55px
    }
}

.top-product .top-product-block.theme-background-stock {
    background: rgba(0, 170, 138, .05)
}

@media (max-width: 47.99em) {
    .top-product .top-product-block.theme-background-stock > img {
        width: 66px
    }
}

.top-product .top-product-block.theme-background-usstock {
    background: rgba(232, 84, 113, .05)
}

@media (max-width: 47.99em) {
    .top-product .top-product-block.theme-background-usstock > img {
        width: 72px
    }
}

.top-product .top-product-block.theme-background-fx {
    background: rgba(7, 77, 150, .05)
}

@media (max-width: 47.99em) {
    .top-product .top-product-block.theme-background-fx > img {
        width: 68px
    }
}

.top-product .top-product-block.theme-background-fund {
    background: rgba(0, 160, 215, .05)
}

@media (max-width: 47.99em) {
    .top-product .top-product-block.theme-background-fund > img {
        width: 79px
    }
}

.top-product .top-product-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 15px
}

@media (min-width: 48em) {
    .top-product .top-product-title {
        font-size: 1.25rem;
        margin-bottom: 30px
    }
}

.top-product .top-product-title::after {
    vertical-align: -2px
}

@media (min-width: 48em) {
    .top-product .top-product-title:hover {
        opacity: 1
    }
}

.top-product .top-product-img {
    display: grid;
    place-items: center
}

@media (max-width: 47.99em) {
    .top-product .top-product-img {
        width: 55%
    }
}

.top-product .top-product-text {
    font-size: 0.875rem;
    text-align: center;
    margin-top: 15px
}

@media (min-width: 48em) {
    .top-product .top-product-text {
        font-size: 1rem;
        margin-top: 30px
    }
}

.top-product .top-product-link {
    margin-top: 30px;
    font-size: 1rem;
    text-align: right
}

.top-movies {
    padding: 40px 0;
    position: relative
}

@media (min-width: 48em) {
    .top-movies {
        padding: 50px 0 40px;
        margin-top: 40px
    }
}

.top-movies::before {
    background-color: #d8d8d8;
    content: "";
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

.top-movies .section-header {
    padding-bottom: 30px
}

@media (min-width: 48em) {
    .top-movies .section-header {
        padding-bottom: 50px
    }
}

.top-market-movie .top-movie-item {
    display: block
}

.top-market-movie .top-movie-item .movie-link-thumb {
    margin-right: 0
}

.top-market-movie .top-movie-item p {
    font-size: 0.875rem;
    margin-top: 15px
}

.top-service {
    position: relative
}

.top-service .top-service-header {
    background-color: #f7f7f7;
    padding: 40px 20px 28px;
    text-align: center
}

@media (min-width: 48em) {
    .top-service .top-service-header {
        padding: 50px 20px 48px
    }
}

.top-service .top-service-title {
    background: linear-gradient(transparent 80%, rgba(0, 150, 130, 0.25) 0%);
    display: inline;
    font-size: 1rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-service .top-service-title {
        font-size: 1.125rem
    }
}

.top-service .top-service-title > span {
    display: block;
    font-size: 1.25rem;
    position: relative;
    margin-top: 8px
}

@media (min-width: 48em) {
    .top-service .top-service-title > span {
        font-size: 1.875rem
    }
}

.top-service .top-service-title br {
    display: inline-block
}

@media (min-width: 48em) {
    .top-service .top-service-title br {
        display: none
    }

    .top-service .panel-sp-tool {
        display: none
    }
}

.top-service .panel-sp-tool .panel-reel {
    width: 100%
}

.top-service .panel-sp-tool .panel-reel-link {
    width: 100%
}

@media (max-width: 47.99em) {
    .top-service .panel-tool {
        display: none
    }
}

.top-sp-tool {
    display: none
}

@media (max-width: 47.99em) {
    .top-sp-tool {
        display: block
    }
}

.top-sp-tool .reel-card {
    position: relative
}

.top-sp-tool .reel-tool-label {
    background-color: #e9f4f1;
    border-radius: 50%;
    font-size: 0.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    position: absolute;
    top: 5px;
    right: 7px
}

.top-sp-tool .reel-card-title {
    display: flex;
    justify-content: center;
    align-items: center
}

.top-sp-tool .reel-card-title > img {
    margin-right: 12px
}

.top-sp-tool .reel .reel-container {
    padding-left: 15px
}

.top-service-learning {
    background-image: url(../image/bg_top-service-learning-pc01.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: contain;
    display: flex;
    padding: 45% 20px 0;
    position: relative;
    z-index: 3
}

@media (min-width: 31.25em) {
    .top-service-learning {
        padding: 55% 20px 0
    }
}

@media (min-width: 48em) {
    .top-service-learning {
        background-image: url(../image/bg_top-service-learning-pc01.jpg);
        background-size: cover;
        padding: 0
    }
}

.top-service-learning-inner {
    width: 100%
}

@media (min-width: 48em) {
    .top-service-learning-inner {
        max-width: 1240px;
        padding: 0 20px;
        margin: 0 auto
    }
}

.top-service-learning-content {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, .16);
    padding: 30px 20px
}

@media (min-width: 31.25em) {
    .top-service-learning-content {
        -webkit-transform: translateY(-15%);
        transform: translateY(-15%)
    }
}

@media (min-width: 48em) {
    .top-service-learning-content {
        background-color: rgba(0, 0, 0, 0);
        box-shadow: none;
        border-radius: 0;
        max-width: 550px;
        padding: 62px 25px 42px;
        margin-left: auto;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.top-service-learning-title {
    font-size: 1.125rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .top-service-learning-title {
        font-size: 1.5rem
    }
}

.top-service-learning-description {
    text-align: center;
    margin-top: 18px
}

@media (min-width: 48em) {
    .top-service-learning-description {
        margin-top: 29px
    }
}

.top-service-learning-list {
    margin-top: 24px;
    display: flex;
    justify-content: center
}

.top-service-learning-list > li {
    background-color: #0abc86;
    border-radius: 50%;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 0.75rem;
    width: 68px;
    height: 68px
}

@media (min-width: 48em) {
    .top-service-learning-list > li {
        font-size: 0.875rem;
        width: 90px;
        height: 90px
    }
}

.top-service-learning-list > li:not(:first-of-type) {
    margin-left: 6px
}

@media (min-width: 48em) {
    .top-service-learning-list > li:not(:first-of-type) {
        margin-left: 8px
    }
}

.top-service-learning-link {
    margin-top: 32px;
    text-align: right
}

@media (min-width: 48em) {
    .top-service-learning-link {
        margin-top: 36px
    }
}

.top-service-support {
    position: relative
}

@media (min-width: 48em) {
    .top-service-support {
        background-color: #078271;
        padding-bottom: 4%
    }
}

.top-service-support:before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    content: "";
    padding-top: 10%;
    width: 100%;
    position: absolute;
    bottom: -1px;
    left: 0;
    z-index: 3;
    display: none
}

@media (min-width: 48em) {
    .top-service-support:before {
        background-image: url(https://puyzee.com/static/templ/1708564837/03/images/bg_top-service-support-pc01.svg);
        display: block
    }
}

.top-service-support-container {
    width: 100%
}

@media (min-width: 48em) {
    .top-service-support-container {
        max-width: 1240px;
        padding: 0 20px;
        margin: 0 auto
    }
}

.top-service-support-bg {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    padding-top: 78.5%;
    margin-top: -25%;
    position: relative;
    z-index: -1
}

@media (min-width: 48em) {
    .top-service-support-bg {
        background-image: url(../image/bg_top-service-support-pc01.jpg);
        position: absolute;
        top: 0;
        right: 0;
        width: 50%;
        height: 100%;
        padding-top: 0;
        margin-top: 0;
        z-index: 1
    }
}

.top-service-support-inner {
    background-color: #078271;
    display: flex;
    flex-direction: column;
    padding-bottom: 40px
}

@media (min-width: 48em) {
    .top-service-support-inner {
        background-color: rgba(0, 0, 0, 0);
        flex-direction: row
    }
}

.top-service-support-links, .top-service-support-rate {
    width: 100%
}

@media (min-width: 48em) {
    .top-service-support-links, .top-service-support-rate {
        width: 50%
    }
}

.top-service-support-links .link::after, .top-service-support-rate .link::after {
    background-color: var(--base-color);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.top-service-support-links {
    color: #fff;
    padding: 30px 24px 0
}

@media (min-width: 48em) {
    .top-service-support-links {
        padding: 60px 24px 70px
    }
}

.top-service-support-links > h3 {
    text-align: center;
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 24px
}

@media (min-width: 48em) {
    .top-service-support-links > h3 {
        font-size: 1.5rem;
        margin-bottom: 38px
    }
}

.top-service-support-rate {
    background-color: #078271;
    color: #fff;
    display: flex;
    flex-direction: column-reverse;
    padding: 30px 20px;
    text-align: center;
    position: relative
}

@media (min-width: 48em) {
    .top-service-support-rate {
        text-align: left;
        flex-direction: row;
        background-color: rgba(0, 0, 0, .35);
        padding: 30px 20px 12%;
        position: absolute;
        right: 0;
        bottom: 0;
        z-index: 2
    }
}

.top-service-support-rate .top-service-support-rate-title {
    font-size: 1rem;
    font-weight: 600
}

.top-service-support-rate .top-service-support-rate-title br {
    display: inline-block
}

@media (min-width: 48em) {
    .top-service-support-rate .top-service-support-rate-title br {
        display: none
    }
}

.top-service-support-rate .top-service-support-rate-description {
    font-size: 0.875rem;
    margin-top: 10px
}

.top-service-support-rate .top-service-support-rate-circle {
    background-color: #fff;
    border-radius: 50%;
    color: #009682;
    font-size: 0.75rem;
    font-weight: 600;
    text-align: center;
    width: 76px;
    height: 76px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 60px;
    left: 50%;
    -webkit-transform: translateX(100px);
    transform: translateX(100px)
}

@media (min-width: 48em) {
    .top-service-support-rate .top-service-support-rate-circle {
        display: none
    }
}

.top-service-support-rate .top-service-support-rate-img {
    width: 100%;
    max-width: 200px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 15px
}

@media (min-width: 48em) {
    .top-service-support-rate .top-service-support-rate-img {
        margin-right: initial;
        margin-left: 20px;
        margin-bottom: 0
    }
}

.top-service-support-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    font-size: 1rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .top-service-support-item {
        font-size: 1.25rem
    }
}

.top-service-support-item > h4 {
    display: block;
    width: 100%
}

.top-service-support-item > a {
    margin-top: 16px
}

.top-service-support-item + .top-service-support-item {
    margin-top: 40px
}

.top-service-support-link {
    text-align: right;
    width: 100%;
    position: absolute;
    right: 20px;
    bottom: 25px;
    z-index: 3
}

@media (min-width: 48em) {
    .top-service-support-link {
        position: static;
        margin-top: 32px
    }
}

.top-service-support-button {
    background-color: #fff;
    color: #009682;
    font-size: 0.9375rem;
    width: 100%;
    padding: 16px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .top-service-support-button {
        max-width: 360px
    }
}

.top-service-links {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #f7f7f7;
    position: relative;
    top: -1px;
    z-index: 5
}

@media (min-width: 48em) {
    .top-service-links {
        background-image: initial
    }
}

.top-service-list {
    padding-bottom: 40px
}

@media (min-width: 48em) {
    .top-service-list {
        padding-bottom: 50px
    }
}

.top-service-list .panel {
    padding: 30px 20px 48px
}

@media (min-width: 48em) {
    .top-service-list .panel {
        padding: 30px
    }
}

@media (max-width: 47.99em) {
    .top-service-list .panel-title br {
        display: none
    }
}

.top-service-list .panel-inner, .top-service-list .panel-contents {
    height: 100%
}

.top-service-list .panel-inner {
    align-items: flex-start
}

@media (max-width: 47.99em) {
    .top-service-list .panel-inner {
        flex-direction: column
    }
}

.top-service-list .panel-link {
    margin-top: auto;
    margin-left: 0
}

@media (max-width: 47.99em) {
    .top-service-list .panel-link {
        position: absolute;
        right: 20px;
        bottom: 30px
    }
}

.top-service-button {
    background-color: #fff;
    border: 1px solid #009682;
    color: #222;
    font-size: 0.9375rem;
    width: 100%;
    max-width: 265px;
    padding: 16px;
    margin: 20px auto 0
}

@media (min-width: 48em) {
    .top-service-button {
        margin: 30px auto 0
    }
}

.top-first {
    padding: 35px 0 40px
}

@media (min-width: 48em) {
    .top-first {
        padding: 50px 0
    }
}

.top-first .top-first-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -5px
}

@media (min-width: 48em) {
    .top-first .top-first-list {
        flex-wrap: nowrap;
        margin: 36px -10px 0
    }
}

.top-first .top-first-list > li {
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    margin: 20px 5px 0
}

@media (min-width: 48em) {
    .top-first .top-first-list > li {
        width: 14.2857142857%;
        margin: 0 10px
    }
}

.top-first .top-first-text {
    font-size: 0.875rem;
    text-align: center
}

.top-first .top-first-search {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    margin-top: 10px;
    padding: 12px 0 14px;
    border: 1px solid #009682;
    border-radius: 2px;
    font-size: 0.8125rem;
    text-align: center
}

@media (min-width: 48em) {
    .top-first .top-first-search {
        padding: 3px 0 6px
    }
}

.top-first .top-first-search > span {
    display: block;
    color: #1b967b;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2
}

@media (max-width: 47.99em) {
    .top-first .top-first-search > span .is-sp {
        display: none
    }
}

.top-first .top-first-unit {
    margin-top: 30px
}

@media (min-width: 48em) {
    .top-first .top-first-unit {
        display: grid;
        grid-template-columns:1fr 1fr 1fr;
        grid-template-rows:auto;
        gap: 20px;
        margin-top: 40px
    }
}

.top-first .top-first-simulation {
    background-color: #f8f7ec;
    border-radius: 10px;
    padding: 30px 20px 10px
}

@media (min-width: 48em) {
    .top-first .top-first-simulation {
        grid-column: span 2/span 2;
        padding: 30px 20px 0
    }
}

.top-first .top-simulation-title {
    font-size: 1.125rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-first .top-simulation-title {
        font-size: 1.25rem
    }
}

.top-first .top-simulation-block {
    margin-top: 12px;
    padding-bottom: 20px
}

@media (min-width: 48em) {
    .top-first .top-simulation-block {
        display: flex;
        margin-top: 15px;
        padding-bottom: 24px
    }
}

@media (max-width: 47.99em) {
    .top-first .top-simulation-block > img {
        max-width: 164px;
        margin: 0 auto
    }
}

.top-first .top-simulation-unit {
    margin-top: 18px
}

@media (min-width: 48em) {
    .top-first .top-simulation-unit {
        margin-top: 0;
        margin-left: 10px
    }
}

.top-first .top-simulation-subtitle {
    font-size: 1rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-first .top-simulation-subtitle {
        font-size: 1.125rem
    }
}

.top-first .top-simulation-text {
    margin: 12px 0 16px;
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .top-first .top-simulation-text {
        margin: 16px 0 20px;
        font-size: 0.9375rem
    }
}

.top-first .top-simulation-button-wrapper {
    max-width: 315px;
    margin: 0 auto
}

@media (min-width: 48em) {
    .top-first .top-simulation-button-wrapper {
        width: 100%;
        max-width: 340px;
        margin-left: auto;
        margin-right: 0;
        text-align: right
    }
}

.top-first .top-simulation-button-wrapper > li + li {
    margin-top: 15px
}

@media (min-width: 48em) {
    .top-first .top-simulation-button-wrapper > li + li {
        margin-top: 10px
    }
}

.top-first .top-simulation-button {
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 10px;
    border: 1px solid rgba(0, 0, 0, .08);
    background-clip: padding-box;
    background: #fff;
    color: #222;
    font-size: 0.9375rem;
    font-weight: 600;
    text-align: center
}

.top-first .top-simulation-subblock {
    padding: 20px 0;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) repeat-x center top
}

@media (min-width: 48em) {
    .top-first .top-simulation-subblock {
        display: flex;
        padding: 20px 0 25px
    }

    .top-first .top-simulation-subblock .top-simulation-text {
        max-width: 390px;
        margin-bottom: 0
    }

    .top-first .top-simulation-description {
        margin-right: 22px
    }
}

.top-first .top-first-select {
    background-color: #f7f7f7;
    border-radius: 10px;
    padding: 25px 15px 30px
}

@media (max-width: 47.99em) {
    .top-first .top-first-select {
        margin-top: 20px
    }
}

@media (min-width: 48em) {
    .top-first .top-first-select {
        padding: 26px 20px 30px
    }
}

.top-first .top-select-title {
    font-size: 1.125rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-first .top-select-title {
        font-size: 1.25rem
    }
}

.top-first .top-select-list {
    margin-top: 20px
}

.top-first .top-select-list > a {
    display: flex;
    align-items: center
}

.top-first .top-select-list > a:first-child .top-select-block {
    padding-top: 0;
    background: none
}

.top-first .top-select-list > a:last-child .top-select-block {
    padding-bottom: 0
}

.top-first .top-select-block {
    width: 100%;
    margin-left: 10px;
    padding: 18px 0;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) repeat-x center top
}

@media (min-width: 48em) {
    .top-first .top-select-block {
        margin-left: 15px;
        padding: 20px 0;
        font-size: 1.125rem
    }
}

.top-first .top-select-subtitle {
    font-size: 1rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-first .top-select-subtitle {
        font-size: 1.125rem
    }
}

.top-first .top-select-text {
    margin-top: 8px;
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .top-first .top-select-text {
        font-size: 0.9375rem
    }
}

.top-first .top-first-link-list {
    display: flex;
    gap: 10px;
    width: 100%;
    margin-top: 20px
}

.top-first .top-first-link-list > li {
    flex: 1 1 0
}

@media (max-width: 47.99em) {
    .top-first .top-first-link-list {
        flex-direction: column
    }
}

@media (min-width: 48em) {
    .top-first .top-first-link-list {
        gap: 21px
    }
}

.top-first .top-first-link {
    border: 1px solid #ccc;
    border-radius: 2px;
    display: flex;
    align-items: center;
    min-height: 84px;
    padding: 15px 45px 15px 80px;
    font-size: 1rem;
    font-weight: 600;
    position: relative
}

.top-first .top-first-link.theme-icon-type {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat 15px center
}

.top-first .top-first-link.theme-icon-qa {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat 15px center
}

.top-first .top-first-link.theme-icon-flow {
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat 15px 13px
}

.top-first .top-first-link::after {
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 6px center;
    background-size: 6.5px;
    border-radius: 50%;
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    margin: auto 0
}

.top-news {
    padding: 40px 0;
    position: relative
}

@media (min-width: 48em) {
    .top-news {
        padding: 50px 0
    }
}

.top-news::before {
    background-color: #d8d8d8;
    content: "";
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

.top-news-list {
    margin-top: 10px
}

@media (min-width: 48em) {
    .top-news-list {
        display: flex;
        flex-wrap: wrap;
        margin-top: 30px
    }
}

@media (max-width: 47.99em) {
    .top-news-list > dt:nth-of-type(n + 4), .top-news-list > dd:nth-of-type(n + 4) {
        display: none
    }
}

@media (min-width: 48em) {
    .top-news-list > dt:nth-of-type(n + 9), .top-news-list > dd:nth-of-type(n + 9) {
        display: none
    }
}

.top-news-list > dt {
    margin-top: 20px
}

@media (min-width: 48em) {
    .top-news-list > dt {
        width: 210px;
        padding-right: 10px;
        margin-top: 15px
    }
}

.top-news-list > dd {
    margin-top: 15px
}

@media (min-width: 48em) {
    .top-news-list > dd {
        width: calc(100% - 210px)
    }
}

.top-news-date {
    font-size: 1rem
}

.top-news-label {
    display: inline-block;
    width: 100%;
    max-width: 90px;
    margin: 0 7px;
    padding: 1px 0 2px;
    border: 1px solid #ccc;
    font-size: 0.75rem;
    text-align: center
}

@media (min-width: 48em) {
    .top-news-label {
        margin: 0 10px
    }
}

.top-news-link {
    font-size: 1rem;
    text-decoration: underline
}

@media (min-width: 48em) {
    .top-news-link:hover {
        text-decoration: none
    }
}

.top-news-button-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 20px -5px -6px
}

@media (min-width: 48em) {
    .top-news-button-wrapper {
        flex-wrap: nowrap;
        margin: 28px -11px 0
    }
}

.top-news-button-wrapper > li {
    width: calc(50% - 12px);
    margin: 6px 5px
}

@media (min-width: 48em) {
    .top-news-button-wrapper > li {
        width: 25%;
        margin: 0 11px
    }
}

.top-news-button.button {
    background-color: var(--base-color);
    border: 1px solid #009682;
    padding: 12px;
    font-size: 0.9375rem
}

.top-news-button.button[target=_blank] {
    padding: 12px 35px 12px 12px
}

.top-market {
    padding: 40px 0;
    position: relative
}

@media (min-width: 48em) {
    .top-market {
        padding: 50px 0
    }
}

.top-market::before {
    background-color: #d8d8d8;
    content: "";
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

.top-market-container {
    width: 100%
}

@media (min-width: 48em) {
    .top-market-container {
        max-width: 1240px;
        padding: 0 20px;
        margin: 0 auto
    }
}

@media (max-width: 47.99em) {
    .top-market-info {
        margin: 0 15px
    }
}

.top-market-info-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 30px
}

@media (min-width: 48em) {
    .top-market-info-list {
        display: grid;
        grid-template-columns:repeat(3, minmax(0, 1fr));
        margin-top: 50px
    }
}

.top-market-info-item {
    border: 1px solid #ccc;
    border-bottom: rgba(0, 0, 0, 0)
}

@media (min-width: 48em) {
    .top-market-info-item {
        border-bottom: 1px solid #ccc;
        border-radius: 2px;
        flex: 1 1 auto
    }

    .top-market-info-item:not(:first-of-type) {
        margin-left: 20px
    }
}

.top-market-info-item:first-of-type {
    border-radius: 4px 4px 0 0
}

@media (min-width: 48em) {
    .top-market-info-item:first-of-type {
        border-radius: 2px
    }
}

.top-market-info-item:last-of-type {
    border-bottom: 1px solid #ccc;
    border-radius: 0 0 4px 4px
}

@media (min-width: 48em) {
    .top-market-info-item:last-of-type {
        border-radius: 2px
    }
}

.top-market-info-link {
    display: flex;
    padding: 24px 56px 24px 16px;
    position: relative;
    transition: opacity .15s ease-out
}

@media (min-width: 48em) {
    .top-market-info-link:hover {
        opacity: .65
    }
}

.top-market-info-link:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 16px;
    height: 16px;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 16px;
    bottom: 0;
    margin: auto
}

.top-market-info-contents {
    display: flex;
    flex-wrap: wrap
}

.top-market-info-title, .top-market-info-total {
    font-size: 1rem;
    font-weight: 600
}

.top-market-info-total {
    margin-left: 24px
}

.top-market-info-time {
    color: #727171;
    font-size: 0.875rem;
    width: 100%
}

.top-market-info-number {
    font-size: 0.875rem;
    font-weight: 600
}

.top-market-info-links {
    margin-top: 22px;
    justify-content: flex-end;
    display: flex
}

@media (min-width: 48em) {
    .top-market-info-links {
        margin-top: 30px
    }
}

.top-market-info-links > a + a {
    margin-left: 50px
}

@media (min-width: 48em) {
    .top-market-info-links > a + a {
        margin-left: 30px
    }
}

.top-market-inner {
    width: 100%;
    margin-top: 30px
}

@media (min-width: 48em) {
    .top-market-inner {
        display: grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 21px;
        margin-top: 40px
    }
}

@media (max-width: 47.99em) {
    .top-market-stock {
        padding: 0 20px
    }
}

@media (min-width: 48em) {
    .top-market-stock {
        width: 100%
    }
}

.top-market-stock-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 18px
}

@media (min-width: 48em) {
    .top-market-stock-title {
        font-size: 1.25rem;
        margin-bottom: 20px
    }
}

.top-market-tab-list {
    background-color: #f7f7f7;
    padding: 3px
}

.top-market-tab-list .top-market-tab-button {
    border-radius: 5px;
    padding: 14px 14px 13px
}

.top-market-tab-list .top-market-tab-button:hover::before {
    display: none
}

.top-market-tab-list .top-market-tab-button.is-active {
    background-color: var(--base-color);
    color: var(--base-text-color)
}

.top-market-tab-list .top-market-tab-button.is-active::before {
    display: none
}

.top-market-stock-links {
    border-top: 1px dashed #a7a7a7;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap
}

.top-market-stock-links a {
    margin-top: 20px
}

.top-market-stock-links a:not(:first-of-type) {
    margin-left: 28px
}

.tab-group .top-market-list.tab-panels {
    padding: 30px 0 20px
}

.tab-group .top-market-list.tab-panels .tab-panel > * {
    padding: 0
}

@media (max-width: 47.99em) {
    .top-market-list .more-list li:nth-of-type(n + 10) {
        display: none
    }

    .top-market-list .more-list.is-open li:nth-of-type(n + 10) {
        display: flex
    }

    .top-market-list .more-list-button {
        margin: 30px auto 0
    }
}

.top-market-list-item {
    display: flex;
    align-items: flex-start
}

.top-market-list-item:not(:first-of-type) {
    margin-top: 20px
}

.top-market-list-label {
    color: #fff;
    display: inline-block;
    font-size: 0.75rem;
    text-align: center;
    width: 90px;
    padding: 2px;
    margin-right: 20px;
    flex-shrink: 0
}

.top-market-list-label.label-stock {
    background-color: #db7b82
}

.top-market-list-label.label-report {
    background-color: #3370e1
}

.top-market-list-link > span {
    text-decoration: underline
}

.top-market-list-link > span:hover {
    text-decoration: none
}

.top-market-list-link[target=_blank]:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 4px;
    vertical-align: -1px
}

.top-market-movie {
    background-color: #e9f4f1;
    border-radius: 10px;
    padding: 20px 15px
}

@media (max-width: 47.99em) {
    .top-market-movie {
        margin: 30px 15px 0
    }
}

@media (min-width: 48em) {
    .top-market-movie {
        width: 100%;
        padding: 30px 20px
    }
}

.top-market-movie-description {
    margin-top: 15px
}

@media (min-width: 48em) {
    .top-market-movie-description {
        margin-top: 20px
    }
}

.top-market-movie-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 18px
}

@media (min-width: 48em) {
    .top-market-movie-title {
        font-size: 1.25rem;
        margin-bottom: 20px
    }
}

.top-market-movie-list {
    padding: 15px 0 20px 0
}

@media (min-width: 48em) {
    .top-market-movie-list {
        padding: 25px
    }
}

.top-market-movie-list .reel .reel-container {
    padding-bottom: 0
}

@media (min-width: 48em) {
    .top-market-movie-list .reel .reel-container {
        padding-left: 0
    }

    .top-market-movie-item {
        flex: 1 1 auto
    }

    .top-market-movie-item + .top-market-movie-item {
        margin-left: 20px
    }
}

.top-market-movie-description {
    display: block;
    font-size: 0.875rem;
    margin-top: 15px
}

.top-market-movie-button.button {
    border: 1px solid rgba(0, 0, 0, .08);
    background-color: #fff;
    max-width: 375px;
    height: auto;
    font-size: 0.9375rem;
    padding: 15px 20px;
    margin-left: auto;
    margin-bottom: 25px
}

.top-market-movie-link {
    border-top: 1px dashed #a7a7a7;
    padding-top: 20px;
    display: flex;
    flex-direction: column
}

.top-market-link-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 10px
}

.top-market-form {
    width: 100%;
    max-width: 1240px;
    padding: 30px 15px 0;
    margin: 0 auto
}

@media (min-width: 48em) {
    .top-market-form {
        background-color: #f7f7f7;
        border-top: 1px dashed #a7a7a7;
        border-bottom: 1px dashed #a7a7a7;
        background-color: #fff;
        padding: 24px 0;
        margin-top: 50px;
        display: flex;
        align-items: center
    }
}

.top-market-form-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 14px
}

@media (min-width: 48em) {
    .top-market-form-title {
        font-size: 1.25rem;
        margin-right: 40px;
        margin-bottom: 0
    }
}

.top-market-form-box {
    background-color: #f7f7f7;
    display: flex
}

@media (max-width: 47.99em) {
    .top-market-form-box {
        flex-direction: column;
        gap: 20px;
        padding: 20px 10px
    }
}

@media (min-width: 48em) {
    .top-market-form-box {
        align-items: center;
        flex: 1 1 auto;
        padding: 15px;
        gap: 38px
    }
}

.top-market-form-text {
    display: flex;
    position: relative;
    flex: 1 1 auto
}

.top-market-form-input {
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 5px;
    padding: 16px 15px;
    width: 100%
}

.top-market-form-input::-webkit-input-placeholder {
    color: #727171
}

.top-market-form-input:-ms-input-placeholder {
    color: #727171
}

.top-market-form-input::placeholder {
    color: #727171
}

.top-market-form-button {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 46px;
    height: 100%
}

.top-market-button {
    background-color: #fff;
    border: 1px solid #009682;
    max-width: 340px;
    font-size: 0.9375rem;
    padding: 15px 20px;
    margin: 22px auto 0
}

@media (min-width: 48em) {
    .top-market-button {
        margin: 30px auto 0
    }
}

.top-products {
    padding: 35px 0 30px;
    background: #f7f7f7
}

@media (min-width: 48em) {
    .top-products {
        padding: 45px 0 50px
    }

    .top-products .top-products-wrapper {
        display: flex;
        margin-top: 36px
    }
}

.top-products h3 {
    position: relative;
    margin: 16px 0 22px;
    font-size: 1.125rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .top-products h3 {
        font-size: 1.25rem;
        margin: 0 0 26px
    }
}

.top-products h3::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 132px;
    height: 28px;
    background: #f7f7f7;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 2
}

@media (min-width: 48em) {
    .top-products h3::before {
        width: 140px
    }
}

.top-products h3::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #727171;
    z-index: 1
}

.top-products h3 > span {
    position: relative;
    z-index: 3
}

.top-products h4 {
    margin: 25px 0 15px;
    font-size: 1rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-products h4 {
        margin: 40px 15px 10px;
        font-size: 1.125rem
    }

    .top-products .top-products-handling {
        width: 100%;
        max-width: 793px
    }
}

.top-products .top-products-list {
    display: flex;
    flex-wrap: wrap;
    margin: -5px
}

@media (min-width: 48em) {
    .top-products .top-products-list {
        padding: 0 15px
    }
}

.top-products .top-products-list > li {
    margin: 5px
}

@media (max-width: 47.99em) {
    .top-products .top-products-list > li {
        width: calc(33.3% - 10px)
    }
}

.top-products .top-products-block {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    min-height: 66px;
    padding: 6px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    .top-products .top-products-block {
        width: 100px;
        min-height: 76px
    }
}

@media (max-width: 47.99em) {
    .top-products .top-products-stock .top-products-list {
        margin: 0
    }

    .top-products .top-products-stock .top-products-list > li {
        width: 50%;
        margin: 0
    }

    .top-products .top-products-stock .top-products-block {
        display: inline-block;
        height: auto;
        min-height: 0;
        padding: 6px 0;
        border: none;
        border-radius: 0px;
        background: none;
        font-weight: normal;
        text-align: left
    }

    .top-products .top-products-stock .top-products-block::after {
        content: "";
        display: inline-block;
        width: 6px;
        height: 11px;
        margin-left: 8px;
        background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center/100%;
        vertical-align: -1px
    }
}

@media (min-width: 48em) {
    .top-products .top-products-service {
        width: 100%;
        max-width: 386px;
        margin-left: 20px
    }

    .top-products .top-products-service .top-products-list {
        max-width: 320px;
        margin: 0 auto;
        padding: 0 0 26px
    }

    .top-products .top-products-service .top-products-list > li {
        width: calc(33.3% - 10px)
    }
}

.top-products .top-products-link {
    padding-top: 30px;
    text-align: right
}

@media (min-width: 48em) {
    .top-products .top-products-link {
        padding-top: 20px;
        background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) repeat-x center top
    }
}

.top-apply-area {
    margin-top: 0
}

.top-support-tel {
    margin-top: 26px
}

@media (max-width: 47.99em) {
    .top-support-tel {
        text-align: center
    }
}

@media (min-width: 48em) {
    .top-support-tel {
        display: flex;
        justify-content: center;
        align-items: center
    }
}

.top-support-tel > dd {
    color: #019682;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-support-tel > dd {
        display: flex;
        align-items: center
    }
}

.top-support-tel-title {
    font-size: 1rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .top-support-tel-title {
        font-size: 1.25rem
    }
}

.top-support-tel-free {
    margin: 10px 0 8px;
    font-size: 1.5625rem
}

@media (min-width: 48em) {
    .top-support-tel-free {
        margin: 0 18px 0 23px;
        font-size: 2.25rem
    }
}

.top-support-tel-free::before {
    content: "";
    display: inline-block;
    width: 38px;
    height: 30px;
    margin-right: 8px;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat center/100%;
    vertical-align: -5px
}

@media (min-width: 48em) {
    .top-support-tel-free::before {
        vertical-align: -3px
    }
}

.top-support-tel-ip {
    font-size: 0.875rem
}

@media (min-width: 48em) {
    .top-support-tel-ip {
        font-size: 1rem
    }
}

.top-support-tel-ip > span {
    font-size: 1.0625rem
}

.top-support-reception {
    text-align: center
}

.top-links {
    padding-top: 25px
}

@media (min-width: 48em) {
    .top-links {
        padding-top: 50px
    }
}

.top-links-sns-description {
    font-size: 1.125rem;
    text-align: center
}

@media (min-width: 48em) {
    .top-links-sns-description {
        font-size: 1.25rem
    }
}

.top-links-sns-list {
    display: flex;
    justify-content: center;
    margin-top: 30px
}

.top-links-sns-item {
    width: 60px;
    margin: 0 13px
}

@media (min-width: 48em) {
    .top-links-sns-item {
        width: 68px;
        margin: 0 15px
    }
}

.top-links-list {
    display: flex;
    flex-wrap: wrap
}

.top-links-list:first-of-type {
    padding-top: 50px
}

.top-links-list:last-of-type {
    padding-bottom: 60px
}

@media (max-width: 47.99em) {
    .top-links-list:last-of-type .top-links-item {
        width: 100%;
        margin-top: 20px;
        margin-left: 0
    }

    .top-links-list:last-of-type .top-links-item .top-links-item-thumb {
        display: none
    }

    .top-links-list:last-of-type .top-links-item .top-links-item-title, .top-links-list:last-of-type .top-links-item .top-links-item-description {
        margin-top: 0
    }
}

.top-links-list + .top-links-list {
    margin-top: 30px
}

@media (min-width: 48em) {
    .top-links-list + .top-links-list {
        border-top: 1px solid #d8d8d8;
        padding-top: 30px
    }
}

.top-links-item {
    width: calc(50% - 10px)
}

@media (min-width: 48em) {
    .top-links-item {
        flex: 1 1 auto;
        max-width: calc(25% - 16px)
    }
}

.top-links-item:not(:nth-of-type(2n + 1)) {
    margin-left: 20px
}

@media (min-width: 48em) {
    .top-links-item:not(:nth-of-type(4n + 1)) {
        margin-left: 21px
    }
}

.top-links-item:nth-of-type(n + 3) {
    margin-top: 30px
}

@media (min-width: 48em) {
    .top-links-item:nth-of-type(n + 3) {
        margin-top: initial
    }

    .top-links-item:nth-of-type(n + 5) {
        margin-top: 56px
    }
}

.top-links-item-thumb {
    border: 1px solid #d9d9d9
}

.top-links-item-title {
    font-weight: 600;
    margin-top: 8px
}

@media (min-width: 48em) {
    .top-links-item-title {
        margin-top: 16px
    }
}

.top-links-item-link[target=_blank] .top-links-item-title:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 4px;
    vertical-align: -1px
}

@media (min-width: 48em) {
    .top-links-item-link[target=_blank] .top-links-item-title:after {
        margin-left: 8px
    }
}

.top-links-item-description {
    font-size: 0.875rem;
    margin-top: 8px
}

.divider + .container > .top-links-news::before {
    top: -1px
}

.top-links-news {
    padding: 15px 0 20px;
    display: flex;
    flex-direction: column;
    position: relative
}

@media (min-width: 48em) {
    .top-links-news {
        padding: 30px 0 50px
    }
}

.top-links-news::before {
    background-color: #d8d8d8;
    content: "";
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

@media (min-width: 48em) {
    .top-links-news {
        flex-direction: row
    }
}

.top-links-news-item {
    border: 1px solid #d9d9d9;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    padding: 20px
}

@media (min-width: 48em) {
    .top-links-news-item {
        width: calc(33.3333333333% - 14px);
        min-height: 138px
    }
}

.top-links-news-item + .top-links-news-item {
    margin-top: 10px
}

@media (min-width: 48em) {
    .top-links-news-item + .top-links-news-item {
        margin-top: 0
    }

    .top-links-news-item:not(:nth-of-type(3n + 1)) {
        margin-left: 21px
    }
}

.top-links-news-title {
    font-weight: 600;
    margin-bottom: 12px
}

.top-links-news-title a, .top-links-news-description a {
    text-decoration: underline
}

.top-info {
    padding-bottom: 30px;
    margin-top: 30px
}

@media (min-width: 48em) {
    .top-info {
        padding: 0 15px 40px;
        margin-top: 40px
    }
}

.top-member-news {
    padding-top: 40px;
    position: relative
}

@media (min-width: 48em) {
    .top-member-news {
        padding-top: 50px
    }
}

.top-member-news::before {
    background-color: #d8d8d8;
    content: "";
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

.top-member-news-inner {
    margin-top: 29px
}

@media (min-width: 48em) {
    .top-member-news-inner {
        display: grid;
        grid-template-columns:1fr 285px;
        grid-template-rows:auto;
        gap: 60px;
        margin-top: 40px
    }
}

.top-member-news-inner .top-news-list {
    margin-top: 0
}

@media (max-width: 47.99em) {
    .top-market-news-banners {
        margin-top: 30px
    }
}

@media (min-width: 48em) {
    .top-market-news-banners .swiper-wrapper {
        flex-direction: column;
        gap: 10px
    }

    .top-market-news-banners .top-market-news-banner {
        width: 100% !important;
        margin-right: 0 !important
    }
}

@media (max-width: 47.99em) {
    .top-market-news-banners .reel .reel-container {
        padding-bottom: 0
    }
}

.top-market-news-banner {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 26px 40px
}

.top-market-news-banner:not([style*=background-image]) {
    padding: 0
}

.top-market-news-banner:not([style*=background-image]) > a > img {
    width: 100%;
    display: block
}

.top-market-news-banner:not([style*=background-image]) > a > img + p:empty, .top-market-news-banner:not([style*=background-image]) > a > img ~ p:empty {
    display: none
}

.top-market-news-banner > a {
    display: block
}

.top-market-news-banner-title {
    text-align: center;
    font-weight: 600;
    font-size: 1rem
}

@media (min-width: 48em) {
    .top-market-news-banner-title {
        font-size: 1.125rem
    }
}

.top-market-news-banner-description {
    font-size: 0.8125rem;
    margin-top: 12px
}

@media (min-width: 48em) {
    .top-market-news-banner-description {
        font-size: 0.875rem;
        margin-top: 18px
    }
}

.top-member-market {
    padding: 20px 0;
    margin: 40px 0 30px
}

@media (min-width: 48em) {
    .top-member-market {
        padding: 40px 0;
        margin: 50px 0 30px
    }
}

.top-member-market-ranking {
    background-color: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .03);
    border-radius: 10px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, .16);
    padding: 22px 20px
}

@media (min-width: 48em) {
    .top-member-market-ranking {
        padding: 30px 20px
    }
}

.top-member-market-ranking-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-top: 5px
}

.top-member-market-ranking-list {
    margin: 20px 0 30px
}

.top-member-market-ranking-list > li {
    counter-increment: number;
    display: flex;
    align-items: center
}

.top-member-market-ranking-list > li::before {
    border: 1px solid #ccc;
    border-radius: 50%;
    content: counter(number);
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    margin-right: 15px;
    align-self: center
}

.top-member-market-ranking-list > li:first-of-type::before, .top-member-market-ranking-list > li:nth-of-type(2)::before, .top-member-market-ranking-list > li:nth-of-type(3)::before {
    border: 0;
    color: var(--base-color)
}

.top-member-market-ranking-list > li:first-of-type::before {
    background-color: #c4a96c
}

.top-member-market-ranking-list > li:nth-of-type(2)::before {
    background-color: #959595
}

.top-member-market-ranking-list > li:nth-of-type(3)::before {
    background-color: #bc8a70
}

.top-member-market-ranking-list > li + li {
    margin-top: 10px
}

.top-member-market-ranking-list a {
    text-decoration: underline
}

@media (max-width: 47.99em) {
    .top-member-market-links {
        padding: 0 20px
    }
}

.top-support {
    border-top: 1px solid #d8d8d8;
    padding-bottom: 40px
}

@media (min-width: 48em) {
    .top-support {
        padding-bottom: 50px
    }
}

.top-support-worries-box h3.section-title, .top-support-problems h3.section-title, .top-support-worries-procedure h3.section-title, .top-support-worries-desc h3.section-title {
    font-size: 1.125rem
}

@media (min-width: 48em) {
    .top-support-worries-box h3.section-title, .top-support-problems h3.section-title, .top-support-worries-procedure h3.section-title, .top-support-worries-desc h3.section-title {
        font-size: 1.25rem
    }
}

.top-support-worries-box h4.section-title, .top-support-problems h4.section-title, .top-support-worries-procedure h4.section-title, .top-support-worries-desc h4.section-title {
    font-size: 1rem
}

@media (min-width: 48em) {
    .top-support-worries-box h4.section-title, .top-support-problems h4.section-title, .top-support-worries-procedure h4.section-title, .top-support-worries-desc h4.section-title {
        font-size: 1.125rem
    }
}

.top-support-worries-box, .top-support-worries-desc, .top-support-problems {
    border-radius: 10px
}

.top-support-worries-box .top-support-button, .top-support-worries-desc .top-support-button, .top-support-problems .top-support-button {
    max-width: 340px;
    margin-top: 12px
}

.top-support-problems {
    padding: 30px 15px
}

@media (min-width: 48em) {
    .top-support-problems {
        padding: 30px 20px
    }
}

.top-support-worries-box {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right 30%;
    background-color: #d6eef5;
    padding: 30px 15px
}

@media (min-width: 48em) {
    .top-support-worries-box {
        padding: 30px 145px 30px 20px;
        background-position: right center;
        background-size: cover
    }
}

.top-support-worries-box header {
    padding-right: 75px
}

@media (min-width: 48em) {
    .top-support-worries-box header {
        padding-right: 0
    }
}

.top-support-worries-procedure {
    margin-top: 20px
}

@media (min-width: 48em) {
    .top-support-worries-procedure {
        margin-top: 40px
    }
}

@media (max-width: 47.99em) {
    .top-support-worries-procedure .section-header {
        display: none
    }
}

.top-support-worries-procedure .top-support-worries-procedure-buttons {
    display: flex;
    gap: 10px
}

@media (max-width: 47.99em) {
    .top-support-worries-procedure .top-support-worries-procedure-buttons {
        flex-direction: column
    }
}

.top-support-worries-procedure .top-support-worries-procedure-buttons .button {
    padding: 12px 5px;
    height: auto
}

.top-support-worries-desc {
    margin-top: 20px;
    background-color: #d6eef5;
    padding: 30px 15px
}

@media (min-width: 48em) {
    .top-support-worries-desc {
        margin-top: 40px;
        padding: 30px 20px
    }
}

.top-support-problems {
    background-color: #f8f7ec
}

.top-support-worries-tel {
    display: flex;
    justify-content: center;
    line-height: 1.2;
    margin-bottom: 20px;
    padding-right: 75px
}

@media (min-width: 48em) {
    .top-support-worries-tel {
        padding-right: 0
    }
}

.top-support-worries-tel::before {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 38px;
    height: 30px;
    margin-top: 16px;
    margin-right: 10px
}

.top-support-worries-tel span {
    color: var(--accent-color);
    font-weight: 600
}

.top-support-worries-tel p {
    margin-top: 6px
}

.top-support-worries-tel-free {
    color: var(--accent-color);
    display: block;
    font-size: 1.875rem;
    font-weight: 600;
    margin-bottom: 6px
}

.top-support-worries-tel-ip {
    color: var(--accent-color);
    font-weight: 600
}

.member-apply-area {
    background-color: #e9f4f1;
    padding: 30px 0
}

@media (min-width: 48em) {
    .member-apply-area {
        padding: 40px 0
    }

    .member-apply-area-list {
        display: grid;
        grid-auto-columns: minmax(0, 1fr);
        grid-auto-flow: column;
        gap: 30px
    }

    .member-apply-area-list .member-apply-area-box {
        display: grid;
        grid-template-rows:auto 1fr auto;
        word-break: break-word
    }

    .member-apply-area-list .member-apply-area-box .theme-large-button {
        padding-left: 10px;
        padding-right: 10px
    }
}

@media (max-width: 47.99em) {
    .member-apply-area-list {
        display: flex;
        flex-direction: column;
        gap: 20px
    }
}

.member-apply-area-box {
    border: 2px solid;
    background-color: var(--base-color);
    border-radius: 10px;
    padding: 21px 15px;
    text-align: center
}

.member-apply-area-box.member-apply-area-usstock {
    border-color: var(--usstock-color)
}

.member-apply-area-box.member-apply-area-usstock .button {
    background-color: var(--usstock-color)
}

.member-apply-area-box.member-apply-area-fx {
    border-color: var(--fx-color)
}

.member-apply-area-box.member-apply-area-fx .button {
    background-color: var(--fx-color)
}

.member-apply-area-box .button {
    color: var(--base-color);
    height: auto;
    margin-top: 20px
}

@media (min-width: 48em) {
    .member-apply-area-box .button {
        margin-top: 30px
    }

    .member-apply-area-box {
        padding: 46px 28px
    }
}

.member-apply-area-box h2 {
    font-size: 1.25rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .member-apply-area-box h2 {
        font-size: 1.625rem
    }
}

.member-apply-area-box p {
    padding-top: 22px
}

.top-tool {
    padding-top: 30px
}

@media (min-width: 48em) {
    .top-tool {
        display: none
    }
}

.stock-lineup {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 50px
}

@media (max-width: 47.99em) {
    .stock-lineup {
        flex-direction: column;
        padding-bottom: 40px
    }
}

.stock-lineup-item {
    background-color: #fff;
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    line-height: 1.2;
    padding: 15px;
    position: relative;
    transition: opacity .15s ease-out
}

@media (min-width: 48em) {
    .stock-lineup-item {
        display: block
    }

    .stock-lineup-item:hover {
        opacity: .5
    }
}

.stock-lineup-item.stock-lineup-accordion {
    justify-content: flex-start;
    align-items: flex-start
}

@media (min-width: 48em) {
    .stock-lineup-item.stock-lineup-accordion {
        display: flex
    }
}

.stock-lineup-item + .stock-lineup-item {
    margin-top: 5px
}

@media (min-width: 48em) {
    .stock-lineup-item {
        flex: 1 1 30%;
        margin-left: 21px;
        padding: 30px 25px
    }
}

.stock-lineup-item:nth-of-type(n+4) {
    align-items: flex-start;
    flex-direction: column;
    padding: 24px 15px
}

@media (min-width: 48em) {
    .stock-lineup-item:nth-of-type(n+4) {
        flex: 1 1 20%;
        padding: 30px 25px;
        margin-top: 20px
    }
}

.stock-lineup-item:nth-of-type(n+4) .stock-lineup-link:after {
    display: none
}

@media (min-width: 48em) {
    .stock-lineup-item:nth-of-type(n+4) .stock-lineup-link:after {
        display: inline-block
    }

    .stock-lineup-item:first-of-type, .stock-lineup-item:nth-of-type(4) {
        margin-left: 0
    }
}

.stock-lineup-item:nth-of-type(4) {
    margin-top: 20px
}

.stock-lineup-logo {
    width: 54px;
    margin-right: 10px
}

@media (min-width: 48em) {
    .stock-lineup-logo {
        width: auto;
        margin-right: 0
    }

    .stock-lineup-logo > img {
        margin: 0 auto 20px
    }
}

.stock-lineup-title {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 1rem;
    flex: 1 1 auto;
    width: 100%
}

@media (min-width: 48em) {
    .stock-lineup-title {
        text-align: center;
        font-size: 1.25rem;
        flex: 0 0 auto
    }
}

.stock-lineup-item.stock-lineup-accordion .stock-lineup-title {
    text-align: left
}

.stock-lineup-title .stock-lineup-link {
    display: flex
}

@media (min-width: 48em) {
    .stock-lineup-title .stock-lineup-link {
        display: block
    }
}

.stock-lineup-title .stock-lineup-link:after {
    margin-left: auto
}

@media (min-width: 48em) {
    .stock-lineup-title .stock-lineup-link:after {
        margin-left: 8px;
        vertical-align: -1px
    }
}

.stock-lineup-link {
    flex: 1 1 auto
}

.stock-lineup-item.stock-lineup-accordion .stock-lineup-link {
    pointer-events: none
}

@media (min-width: 48em) {
    .stock-lineup-item.stock-lineup-accordion .stock-lineup-link {
        pointer-events: auto
    }

    .stock-lineup-link {
        pointer-events: auto
    }
}

.stock-lineup-link:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

.stock-lineup-trigger {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 14px;
    height: 14px;
    padding: 0;
    margin-right: 2px;
    margin-left: auto;
    position: relative
}

@media (min-width: 48em) {
    .stock-lineup-trigger {
        display: none
    }
}

.stock-lineup-item.is-open .stock-lineup-trigger {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.stock-lineup-trigger::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.stock-lineup-text {
    display: none
}

@media (min-width: 48em) {
    .stock-lineup-text {
        display: block;
        margin-top: 20px;
        line-height: 1.5
    }
}

@media (max-width: 47.99em) {
    .stock-lineup-item.is-open .stock-lineup-text {
        display: block;
        padding-top: 22px
    }
}

.stock-lineup-bottom {
    display: none;
    text-align: right;
    width: 100%;
    padding-top: 20px;
    margin-top: auto
}

@media (min-width: 48em) {
    .stock-lineup-bottom {
        display: block
    }
}

@media (max-width: 47.99em) {
    .stock-lineup-item.is-open .stock-lineup-bottom {
        display: block
    }
}

.stock-lineup-others {
    display: flex;
    flex-direction: column;
    position: relative
}

@media (min-width: 48em) {
    .stock-lineup-others {
        flex-direction: row
    }
}

.stock-lineup-other {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 20px;
    font-size: 0.875rem;
    flex: 1 1 auto;
    transition: opacity .3s ease-out;
    position: relative
}

.stock-lineup-other:hover {
    opacity: .65
}

.stock-lineup-other + .stock-lineup-other {
    margin-top: 10px
}

@media (min-width: 48em) {
    .stock-lineup-other + .stock-lineup-other {
        margin-top: initial
    }

    .stock-lineup-other {
        margin-left: 21px
    }
}

.stock-lineup-other:first-of-type {
    margin-left: 0
}

.stock-lineup-other span {
    display: block;
    font-size: 1rem;
    font-weight: 600
}

.stock-lineup-other a::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media (min-width: 48em) {
    .stock-charm .panel {
        height: 100%;
        padding: 30px;
        flex-grow: 1
    }
}

.stock-charm .panel-inner {
    position: relative;
    flex-grow: 1;
    align-items: stretch
}

@media (max-width: 47.99em) {
    .stock-charm .panel-inner {
        flex-direction: column
    }
}

.stock-charm .panel-link {
    margin-top: auto;
    margin-left: 0
}

@media (max-width: 47.99em) {
    .stock-charm .panel-link {
        position: absolute;
        right: 0;
        bottom: 0
    }
}

.stock-charm .panel-img {
    padding: 0
}

@media (max-width: 47.99em) {
    .stock-charm .panel-img {
        padding: 0 0 40px
    }
}

.stock-start-text {
    font-size: 1rem;
    text-align: center;
    padding-top: 20px;
    padding-right: 15px;
    padding-left: 15px
}

@media (min-width: 48em) {
    .stock-start-text {
        padding-top: 40px;
        padding-right: 0;
        padding-left: 0
    }
}

body[data-page-category=stock] .study-card-box .study-card-link {
    display: inline-block
}

body[data-page-category=stock] .study-card-box .study-card-link::after {
    content: "";
    display: inline-block;
    background-color: #009682;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    background-size: 6px;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: -3px
}

.market-search {
    padding: 15px 0
}

@media (min-width: 48em) {
    .market-search {
        padding: 30px 0
    }
}

#report .section-header .section-title {
    text-align: center
}

.market-search-form {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 21px
}

@media (min-width: 48em) {
    .market-search-form {
        flex-direction: row;
        gap: 25px
    }
}

@media (max-width: 47.99em) {
    .market-search-radio {
        justify-content: flex-start;
        width: 100%
    }
}

@media (min-width: 48em) {
    .market-search-radio {
        margin-right: 31px
    }
}

.market-search-inner {
    background-color: #f7f7f7;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 20px 10px
}

@media (max-width: 47.99em) {
    .market-search-inner {
        width: 100%
    }
}

@media (min-width: 48em) {
    .market-search-inner {
        flex-direction: row;
        padding: 15px 21px;
        gap: 15px
    }
}

.search-box {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    color: #727171;
    position: relative;
    overflow: hidden
}

.search-box label {
    display: none
}

.search-box input {
    padding: 16px
}

.search-box-icon {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 45%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0
}

.search-box-submit {
    font-size: 0.9375rem;
    padding: 16px
}

@media (max-width: 47.99em) {
    .search-box-submit {
        margin-bottom: 6px
    }
}

@media (min-width: 48em) {
    .reel .market-chart.reel-container {
        padding: 0
    }
}

.market-button-list {
    padding: 40px 0;
    gap: 11px 12px
}

@media (min-width: 48em) {
    .market-button-list {
        gap: 12px 22px
    }
}

.market-search-box {
    flex: 0 1 auto;
    position: relative
}

@media (max-width: 47.99em) {
    .market-search-box {
        width: 100%;
        margin-top: 20px
    }
}

@media (min-width: 48em) {
    .market-search-box {
        flex: 1 1 auto;
        min-width: 240px
    }
}

.market-search-box .market-search-box-input {
    width: 100%
}

@media (min-width: 48em) {
    .market-search-buttons {
        flex: 0 1 370px
    }
}

.market-anchor-button {
    padding: 15px
}

.market-panel {
    padding: 21px 20px 20px
}

.market-panel-update {
    font-size: 0.875rem;
    font-weight: normal
}

.market-panel-economic {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 10px
}

.market-panel-economic-value {
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    align-items: center
}

.market-panel-economic-value::before {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    margin-right: 5px
}

.market-panel-economic-value.is-plus::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.market-panel-economic-value.is-minus::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

.market-panel-economic-balance {
    font-size: 0.875rem
}

.market-panel-button {
    width: 100%
}

.market-news-list {
    display: grid;
    grid-template-columns:auto;
    grid-template-rows:auto auto auto auto auto
}

@media (min-width: 48em) {
    .market-news-list {
        grid-template-columns:1fr 1fr;
        grid-template-rows:auto auto auto auto;
        gap: 0 30px
    }
}

.market-news-item {
    display: flex;
    flex-direction: column;
    position: relative
}

@media (max-width: 47.99em) {
    .market-news-item + .market-news-item {
        margin-top: 20px
    }
}

.market-news-item:first-of-type {
    grid-column: 1;
    grid-row: 1
}

@media (min-width: 48em) {
    .market-news-item:first-of-type {
        background-color: #e9f4f1;
        border-radius: 10px;
        width: 100%;
        padding: 30px;
        grid-column: 1;
        grid-row: 1/5
    }

    .market-news-item:first-of-type .market-news-meta {
        font-size: 1.125rem
    }

    .market-news-item:first-of-type .market-news-title {
        display: block;
        font-size: 1.125rem;
        font-weight: 600;
        margin-top: 20px
    }
}

.market-news-item:first-of-type .market-news-link {
    display: block;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.market-news-item:not(:first-of-type) {
    grid-column: 1
}

@media (min-width: 48em) {
    .market-news-item:not(:first-of-type) {
        grid-column: 2
    }
}

.market-news-item:not(:first-of-type) .market-news-link {
    display: block;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

@media (min-width: 48em) {
    .market-news-item:not(:first-of-type) .market-news-link {
        -webkit-line-clamp: 1
    }
}

.market-news-meta {
    order: -1;
    display: flex;
    align-items: center
}

.market-news-tag {
    background-color: #fff;
    border: 1px solid #ccc;
    font-size: 0.75rem;
    width: 90px;
    text-align: center;
    padding: 2px 5px;
    line-height: 1;
    margin-left: 10px
}

@media (min-width: 48em) {
    .market-news-tag {
        padding: 4px 5px 5px
    }
}

.market-news-title {
    margin-top: 11px
}

.market-news-link {
    text-decoration: underline
}

.market-news-description {
    display: none;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    margin-top: 20px
}

@media (min-width: 48em) {
    .market-news-description {
        display: block;
        display: -webkit-box
    }
}

.market-news-link:hover {
    text-decoration: underline
}

.market-news-more {
    display: none;
    margin-top: 20px;
    margin-left: auto
}

@media (min-width: 48em) {
    .market-news-more {
        display: block
    }
}

.market-ranking {
    background-color: #f7f7f7
}

@media (max-width: 47.99em) {
    .market-ranking {
        padding: 20px 0;
        margin: 0 -15px
    }

    .market-ranking .reel {
        padding: 0
    }

    .market-ranking .reel.reel-sp-only {
        margin: 0
    }

    .market-ranking .reel .reel-container {
        padding-right: 20px;
        padding-bottom: 70px
    }

    .market-ranking .reel .reel-pagination {
        bottom: 25px
    }
}

@media (min-width: 48em) {
    .market-ranking {
        padding: 40px 20px
    }

    .market-ranking .reel {
        overflow: visible
    }

    .market-ranking .reel .reel-container {
        padding-left: 0
    }

    .market-ranking .reel-items {
        display: grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        row-gap: 27px;
        -webkit-column-gap: 21px;
        column-gap: 21px
    }
}

.market-stock-list {
    border: 1px solid #e5e5e5
}

.market-stock-item {
    background-color: #fff;
    padding: 21px 10px;
    font-size: 0.875rem
}

.market-stock-item + .market-stock-item {
    border-top: 1px solid #e5e5e5
}

.market-stock-link {
    display: flex;
    align-items: center;
    width: 100%
}

.market-stock-link:after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-left: 9px
}

.market-stock-inner {
    display: flex;
    flex-wrap: wrap;
    flex: 1 1 auto
}

.market-stock-title {
    display: flex;
    align-items: center;
    width: 50%
}

@media (max-width: 47.99em) {
    .market-stock-title {
        font-weight: 600
    }
}

.market-stock-title i {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 18px;
    height: 11px;
    flex-shrink: 0;
    margin-right: 5px
}

.market-stock-economic {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 50%;
    font-weight: 600
}

.market-stock-economic i {
    width: 14px;
    height: 14px;
    margin-right: 6px
}

.market-stock-update {
    width: 50%;
    margin-top: 10px;
    padding-left: 23px
}

.market-stock-economic-balance {
    width: 50%;
    text-align: right;
    margin-top: 10px
}

.market-ranking-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    font-size: 1.25rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .market-ranking-title {
        align-items: center
    }
}

.market-ranking-meta {
    display: flex;
    justify-content: space-between;
    flex-direction: column
}

@media (min-width: 48em) {
    .market-ranking-meta {
        align-items: center;
        flex-direction: row;
        flex: 1 1 auto
    }
}

.market-ranking-update {
    font-size: 0.875rem;
    font-weight: normal;
    margin-right: 5px
}

.market-ranking-list {
    margin-top: 10px
}

@media (min-width: 48em) {
    .market-ranking-list {
        margin-top: 32px
    }
}

.market-ranking-item {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    counter-increment: number
}

.market-ranking-item + .market-ranking-item {
    margin-top: 10px
}

.market-ranking-item:first-of-type .market-ranking-name::before {
    background-color: #c4a96c
}

.market-ranking-item:nth-of-type(2) .market-ranking-name::before {
    background-color: #b5b5b5
}

.market-ranking-item:nth-of-type(3) .market-ranking-name::before {
    background-color: #bc8a70
}

.market-ranking-name {
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    flex: 1 1 42%
}

@media (min-width: 48em) {
    .market-ranking-name {
        font-size: 1rem;
        margin: 5px 0
    }
}

.market-ranking-name > a {
    text-decoration: underline
}

.market-ranking-name::before {
    border-radius: 50%;
    content: counter(number);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    margin-right: 5px
}

@media (min-width: 48em) {
    .market-ranking-name::before {
        margin-right: 15px
    }
}

.market-ranking-info {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    flex: 1 1 58%
}

@media (min-width: 48em) {
    .market-ranking-info {
        justify-content: space-between;
        flex-direction: row;
        align-items: baseline;
        margin: 5px 0
    }
}

.market-ranking-economic {
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
    font-size: 1rem;
    font-weight: 600;
    text-align: right
}

@media (min-width: 48em) {
    .market-ranking-economic {
        width: 130px
    }
}

.market-ranking-economic > i {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 2px
}

@media (min-width: 48em) {
    .market-ranking-economic > i {
        margin-right: 10px
    }
}

.market-ranking-economic-balance {
    font-size: 0.875rem;
    text-align: right
}

@media (min-width: 48em) {
    .market-ranking-economic-balance {
        width: 156px
    }
}

.market-ranking-economic-volume {
    color: #000;
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
    flex-wrap: wrap
}

.market-ranking-economic-volume dt {
    font-size: 0.75rem
}

.market-ranking-economic-volume dd {
    font-size: 0.875rem;
    margin-left: 8px
}

.market-stock-selling-buying {
    width: 100%;
    display: flex;
    justify-content: flex-end
}

.market-stock-selling, .market-stock-buying {
    font-size: 0.75rem
}

.market-stock-selling span, .market-stock-buying span {
    font-size: 1.125rem;
    font-weight: 600
}

.market-stock-buying {
    margin-left: 20px
}

.market-stock-economic-before {
    text-align: right;
    width: 100%;
    margin-top: 5px
}

.market-ranking-link {
    font-size: 1rem;
    margin-top: 30px;
    margin-left: auto
}

.market-brand-contents {
    border-radius: 10px;
    padding: 30px 20px
}

.market-brand-title {
    font-size: 1.25rem;
    font-weight: 600
}

.market-brand-day {
    margin-top: 15px;
    line-height: 1.2
}

.market-brand-table {
    background-color: #fff;
    border-radius: 4px;
    padding: 10px;
    margin-top: 21px
}

@media (min-width: 48em) {
    .market-brand-table {
        padding: 22px 10px
    }
}

.market-brand-table h2 {
    font-size: 1.125rem;
    font-weight: 600;
    flex-shrink: 0
}

.market-brand-table dl {
    display: flex;
    flex-direction: column;
    margin-left: auto;
    flex: 1 1 auto
}

@media (min-width: 48em) {
    .market-brand-table dl {
        flex-direction: row
    }
}

.market-brand-table dl div {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    flex: 1 1 auto
}

.market-brand-table dl dt {
    margin-right: 20px
}

.market-brand-table dl dd span {
    font-size: 1rem;
    font-weight: 600
}

.market-brand-table-row {
    display: flex;
    align-items: flex-start
}

.market-brand-table-row + .market-brand-table-row {
    border-top: 1px dashed #e3e3e3;
    padding: 14px 10px
}

.market-brand-table-row:first-of-type {
    padding: 0 10px 14px
}

.market-brand-table-row:last-of-type {
    padding: 14px 10px 0
}

.market-brand-contents-text {
    margin-top: 20px
}

@media (min-width: 48em) {
    .market-brand-contents-text {
        margin-top: 30px
    }
}

.market-brand-contents-link {
    margin-top: 28px;
    text-align: right
}

@media (min-width: 48em) {
    .market-brand-contents-link {
        margin-top: 30px
    }
}

.market-link-box {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    position: relative
}

@media (max-width: 47.99em) {
    .market-link-box {
        box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
        border-radius: 10px;
        display: block;
        font-size: 0.9375rem;
        padding: 16px
    }
}

@media (min-width: 48em) {
    .market-link-box {
        border-radius: 4px;
        padding: 30px
    }
}

.market-link-box a::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.market-link-title {
    font-weight: 600
}

@media (max-width: 47.99em) {
    .market-link-title {
        text-align: center
    }
}

.market-link-title *::after {
    display: none
}

@media (min-width: 48em) {
    .market-link-title *::after {
        display: inline-block
    }
}

.market-link-text {
    display: none;
    font-size: 0.875rem;
    margin-top: 20px
}

@media (min-width: 48em) {
    .market-link-text {
        display: block
    }
}

.iframe-container {
    overflow: hidden;
    position: relative
}

.iframe-container iframe {
    border: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.iframe-container.iframe-container-1 {
    height: 350px
}

@media (max-width: 840px) {
    .iframe-container.iframe-container-1 {
        height: 375px
    }
}

@media (max-width: 824px) {
    .iframe-container.iframe-container-1 {
        height: 385px
    }
}

.iframe-container.iframe-container-2 {
    height: 385px
}

@media (max-width: 824px) {
    .iframe-container.iframe-container-2 {
        height: 480px
    }
}

@media (max-width: 590px) {
    .iframe-container.iframe-container-2 {
        height: 510px
    }
}

@media (max-width: 421px) {
    .iframe-container.iframe-container-2 {
        height: 540px
    }
}

.iframe-container.iframe-container-3 {
    height: 705px
}

@media (max-width: 1270px) {
    .iframe-container.iframe-container-3 {
        height: 1300px
    }
}

@media (max-width: 807px) {
    .iframe-container.iframe-container-3 {
        height: 770px
    }
}

@media (max-width: 362px) {
    .iframe-container.iframe-container-3 {
        height: 850px
    }
}

.iframe-container.iframe-container-4 {
    height: 950px
}

@media (max-width: 1234px) {
    .iframe-container.iframe-container-4 {
        height: 1125px
    }
}

@media (max-width: 918px) {
    .iframe-container.iframe-container-4 {
        height: 1135px
    }
}

@media (max-width: 898px) {
    .iframe-container.iframe-container-4 {
        height: 1195px
    }
}

@media (max-width: 807px) {
    .iframe-container.iframe-container-4 {
        height: 875px
    }
}

@media (max-width: 560px) {
    .iframe-container.iframe-container-4 {
        height: 900px
    }
}

@media (max-width: 400px) {
    .iframe-container.iframe-container-4 {
        height: 950px
    }
}

.fee-grid-list {
    font-size: 0.875rem
}

@media (max-width: 47.99em) {
    .fee-accordion {
        background-color: #fff;
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 10px;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, .16);
        padding: 10px 10px 20px;
        margin-top: 28px
    }

    .fee-accordion .fee-grid {
        display: none
    }

    .fee-accordion.is-open .fee-grid {
        display: flex
    }
}

.fee-sp-item {
    display: block;
    padding: 20px 10px 20px
}

@media (min-width: 48em) {
    .fee-sp-item {
        display: none
    }
}

.fee-sp-item-text {
    text-align: center;
    font-size: 0.875rem
}

.fee-sp-item-price {
    color: #009682;
    text-align: center;
    line-height: 1
}

.fee-sp-item-price > em {
    font-size: 3.75rem;
    font-style: normal;
    font-weight: 600
}

.fee-sp-item-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 15px
}

.fee-sp-item-commission {
    color: #009682;
    display: flex;
    justify-content: center;
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    margin-top: 20px
}

.fee-sp-item-commission::before, .fee-sp-item-commission::after {
    background-color: #009682;
    content: "";
    display: block;
    width: 1px;
    -webkit-transform-origin: bottom;
    transform-origin: bottom
}

.fee-sp-item-commission::before {
    -webkit-transform: rotate(-20deg);
    transform: rotate(-20deg)
}

.fee-sp-item-commission::after {
    -webkit-transform: rotate(20deg);
    transform: rotate(20deg)
}

.fee-accordion-trigger {
    display: flex;
    align-items: center;
    padding: 20px 10px 0;
    position: relative
}

.fee-accordion-trigger::before {
    background-color: #dcdcdc;
    content: "";
    display: block;
    width: calc(100% + 20px);
    height: 1px;
    position: absolute;
    top: 0;
    left: -10px
}

.fee-accordion-trigger::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    margin-right: 2px;
    margin-left: auto
}

.fee-accordion.is-open .fee-accordion-trigger::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg)
}

@media (min-width: 48em) {
    .fee-accordion-trigger {
        display: none
    }
}

.fee-grid {
    display: flex
}

@media (min-width: 48em) {
    .fee-grid > *:nth-child(1) {
        width: 55%
    }

    .fee-grid > *:nth-child(2) {
        width: 45%
    }
}

@media (max-width: 47.99em) {
    .fee-grid {
        flex-direction: column
    }
}

.fee-grid .fee-grid-table {
    text-align: center
}

.fee-grid .fee-grid-table > thead th, .fee-grid .fee-grid-table > thead td {
    font-size: 0.875rem;
    font-weight: normal
}

@media (min-width: 48em) {
    .fee-grid .fee-grid-table > thead th, .fee-grid .fee-grid-table > thead td {
        font-size: 1rem
    }
}

.fee-grid .fee-grid-table > tbody th, .fee-grid .fee-grid-table > tbody td {
    font-size: 0.875rem;
    font-weight: normal
}

@media (max-width: 47.99em) {
    .fee-grid .fee-grid-table > tbody th, .fee-grid .fee-grid-table > tbody td {
        padding: 12px 8px
    }
}

@media (min-width: 48em) {
    .fee-grid .fee-grid-table > tbody th, .fee-grid .fee-grid-table > tbody td {
        font-size: 1rem
    }
}

.fee-grid .fee-grid-table > tbody th em, .fee-grid .fee-grid-table > tbody td em {
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 600
}

@media (min-width: 48em) {
    .fee-grid .fee-grid-table > tbody th em, .fee-grid .fee-grid-table > tbody td em {
        font-size: 1.625rem
    }
}

@media (max-width: 47.99em) {
    .fee-grid .fee-grid-item {
        margin-top: 26px
    }
}

@media (min-width: 48em) {
    .fee-grid .fee-grid-item {
        margin-left: 30px
    }
}

.fee-box {
    padding: 10px;
    display: flex;
    flex-direction: column
}

.fee-box-title {
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 600;
    position: relative;
    padding: 10px 0 20px
}

.accordion-box .fee-box-title {
    font-size: 0.9375rem
}

@media (max-width: 47.99em) {
    .accordion-box .fee-box-title {
        padding: 10px 0
    }
}

@media (min-width: 48em) {
    .accordion-box .fee-box-title {
        font-size: 1.125rem
    }
}

.fee-box-contents {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f7f7f7;
    padding: 20px
}

.accordion-box .fee-box-contents {
    margin-top: 10px
}

@media (min-width: 48em) {
    .accordion-box .fee-box-contents {
        margin-top: 0
    }
}

.fee-box-contents.theme-bgc-pink {
    border-radius: 0;
    background-color: #fef6f8
}

.fee-box-contents.theme-bgc-blue {
    border-radius: 0;
    background-color: #f2fafd
}

.fee-box-contents.theme-bgc-darker-blue {
    border-radius: 0;
    background-color: #f2f6fa
}

.fee-box-inner {
    display: flex;
    flex-direction: column;
    width: 100%
}

@media (max-width: 47.99em) {
    .fee-box-inner {
        padding: 0 10px
    }
}

.fee-box-inner > * + * {
    margin-top: 10px
}

.fee-box-price {
    font-size: 0.875rem;
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
    flex-shrink: 0;
    line-height: 1;
    text-align: center
}

.fee-box-price span {
    color: #009682
}

.fee-box-price em {
    font-size: 3.75rem;
    font-weight: 600;
    font-style: normal;
    padding: 0 5px
}

.fee-box-tax {
    text-align: right
}

.fee-box-percent {
    font-size: 0.875rem;
    text-align: center;
    line-height: 1;
    margin-right: 10px;
    margin-left: 10px
}

.fee-box-percent span {
    color: #009682;
    font-size: 1.25rem
}

.fee-box-percent em {
    font-size: 2.25rem;
    font-weight: 600;
    font-style: normal;
    padding: 0 5px
}

@media (max-width: 47.99em) {
    .fee-box-passing.is-primary {
        display: flex;
        align-items: flex-end;
        grid-column: span 2/span 2
    }

    .fee-box-passing.is-primary .fee-box-passing-value {
        margin-top: 0;
        margin-left: 24px
    }
}

.fee-box-passing-countries {
    display: flex
}

.fee-box-passing-countries > img {
    width: 24px
}

.fee-box-passing-countries > img + img {
    margin-left: 4px
}

.fee-box-passing-passing {
    font-size: 0.875rem;
    margin-top: 8px
}

.fee-box-passing-value {
    font-size: 0.875rem;
    color: #009682;
    flex-shrink: 0;
    line-height: 1;
    margin-top: 14px
}

.fee-box-passing-value em {
    font-size: 2.25rem;
    font-weight: 600;
    font-style: normal
}

.fee-box-text {
    text-align: center
}

.fee-box-list {
    font-size: 0.875rem
}

.fee-box-link {
    text-align: right;
    margin: 20px 10px 10px 0
}

@media (max-width: 47.99em) {
    .fee-match-height-sp {
        height: auto !important
    }
}

.ipo-lottery {
    display: flex;
    flex-direction: column
}

@media (min-width: 48em) {
    .ipo-lottery {
        flex-direction: row
    }
}

.ipo-lottery-list {
    margin-top: 20px
}

@media (min-width: 48em) {
    .ipo-lottery-list {
        margin-top: 30px
    }
}

@media (max-width: 47.99em) {
    .ipo-lottery-img {
        margin-top: 15px
    }
}

@media (min-width: 48em) {
    .ipo-lottery-img {
        margin-left: 46px
    }
}

.ipo-box {
    padding: 10px;
    display: flex;
    flex-direction: column
}

.ipo-box-contents {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px
}

.accordion-box .ipo-box-contents {
    margin-top: 10px
}

@media (min-width: 48em) {
    .accordion-box .ipo-box-contents {
        margin-top: 0
    }
}

.ipo-box-contents.theme-bgc-pink {
    border-radius: 0;
    background-color: #fef6f8
}

.ipo-box-contents.theme-bgc-blue {
    border-radius: 0;
    background-color: #f2fafd
}

.ipo-box-contents.theme-bgc-darker-blue {
    border-radius: 0;
    background-color: #f2f6fa
}

.ipo-box-inner {
    display: flex;
    flex-direction: column;
    width: 100%
}

@media (max-width: 47.99em) {
    .ipo-box-inner {
        padding: 0 10px
    }
}

.ipo-box-inner > * + * {
    margin-top: 10px
}

.ipo-box-price {
    font-size: 0.875rem;
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
    flex-shrink: 0;
    line-height: 1;
    text-align: center
}

.ipo-box-price span {
    color: #009682
}

.ipo-box-price em {
    font-size: 3.75rem;
    font-weight: 600;
    font-style: normal;
    padding: 0 5px
}

.ipo-box-title {
    font-weight: 600;
    text-align: center
}

.ipo-box-text {
    text-align: center;
    font-size: 0.875rem
}

.ipo-box-list {
    font-size: 0.875rem
}

.ipo-box-link {
    text-align: right;
    margin: 20px 10px 10px 0
}

@media (min-width: 48em) {
    .ipo-step-wrapper .reel .reel-container {
        padding-left: 0;
        padding-right: 12px
    }

    .ipo-step-wrapper .reel-items {
        align-items: stretch;
        display: grid;
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap: 20px
    }
}

.ipo-step-wrapper .reel-item.ipo-step-item {
    height: auto
}

.ipo-step-item {
    background-color: #f7f7f7;
    border-radius: 10px;
    padding: 30px 20px;
    position: relative;
    height: auto
}

.ipo-step-item::before {
    border-top: 13px solid rgba(0, 0, 0, 0);
    border-right: 10px solid rgba(0, 0, 0, 0);
    border-bottom: 13px solid rgba(0, 0, 0, 0);
    border-left: 10px solid #7fcac0;
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    top: 90px;
    right: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.ipo-step-item:last-of-type::before {
    display: none
}

.ipo-step-title {
    text-align: center;
    font-size: 1.125rem;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.ipo-step-title span {
    color: #009682;
    font-size: 1rem;
    font-style: italic;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 10px
}

.ipo-step-title span::after {
    background-color: #009682;
    content: "";
    display: block;
    width: 30px;
    height: 1px;
    margin: 0 auto;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0
}

.ipo-step-description {
    font-size: 1rem
}

.ipo-step-buttons {
    margin-top: 30px
}

.ipo-step-buttons > * {
    min-height: 0;
    height: auto
}

.ipo-step-buttons > * + * {
    margin-top: 20px
}

.ipo-step-list {
    font-size: 0.875rem;
    margin-top: 30px
}

.ipo-step-link {
    margin-top: 20px
}

.ipo-movie {
    border-top: 1px dashed #e5e7eb;
    border-bottom: 1px dashed #e5e7eb;
    padding: 20px 0;
    margin: 30px 0
}

.ipo-stock-link, .ipo-pdf-link {
    border-top: 1px dashed #e5e7eb;
    display: flex;
    justify-content: flex-end;
    padding-top: 20px;
    margin-top: 30px
}

.ipo-service {
    padding: 30px 0
}

.ipo-service-item {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    padding: 30px 15px
}

.ipo-service-title {
    font-size: 1.125rem;
    font-weight: 600
}

@media (min-width: 48em) {
    .ipo-service-title {
        text-align: center
    }
}

@media (max-width: 47.99em) {
    .ipo-service-picture {
        display: none
    }
}

.ipo-service-description {
    font-size: 0.875rem;
    margin-top: 14px
}

.ipo-contact-title {
    text-align: center;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 30px
}

@media (min-width: 48em) {
    .ipo-contact-title {
        font-size: 1.875rem
    }
}

.ipo-contact-item {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 10px;
    padding: 30px;
    text-align: center;
    font-weight: 600
}

.ipo-contact-number {
    color: #009682;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.875rem
}

.ipo-contact-number > img {
    margin-right: 8px
}

.ipo-contact-tel {
    color: #009682
}

.ipo-contact-reception {
    font-weight: 400;
    margin-top: 14px
}

@media (max-width: 47.99em) {
    .ipo-accordion-list li:nth-of-type(n+4) {
        display: none
    }

    .ipo-accordion-list .ipo-stock-link {
        display: none
    }

    .ipo-accordion-list.is-open li:nth-of-type(n+4) {
        display: block
    }

    .ipo-accordion-list.is-open .ipo-stock-link {
        display: flex
    }
}

.fund-app-title {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: 1.125rem;
    font-weight: 600
}

.fund-app-list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 20px
}

.fund-stock-ranking-item {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    counter-increment: number;
    -webkit-filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    padding: 40px;
    display: flex;
    justify-content: center;
    text-align: center;
    flex-direction: column;
    font-weight: 600;
    position: relative
}

.fund-stock-ranking-item .fund-stock-ranking-link::before {
    border-radius: 50%;
    content: counter(number);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    margin-right: 6px;
    align-self: center
}

.fund-stock-ranking-item:first-of-type .fund-stock-ranking-link::before {
    background-color: #c4a96c
}

.fund-stock-ranking-item:nth-of-type(2) .fund-stock-ranking-link::before {
    background-color: #959595
}

.fund-stock-ranking-item:nth-of-type(3) .fund-stock-ranking-link::before {
    background-color: #bc8a70
}

.fund-stock-ranking-link {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px
}

.fund-stock-ranking-link > span {
    text-decoration: underline
}

.fund-detail-search {
    border-radius: 10px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, .16);
    padding: 30px 10px
}

@media (min-width: 48em) {
    .fund-detail-search {
        padding: 40px 60px
    }
}

.fund-detail-search-form {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%
}

@media (min-width: 48em) {
    .fund-detail-search-form {
        flex-direction: row
    }
}

.fund-detail-search-box {
    background-color: #f7f7f7;
    padding: 15px;
    flex: 1 1 auto;
    display: flex
}

@media (max-width: 47.99em) {
    .fund-detail-search-box {
        font-size: 0.75rem;
        width: 100%;
        padding: 15px 10px
    }
}

.fund-detail-search-text {
    position: relative;
    display: flex;
    flex: 1 1 auto
}

.fund-detail-search-input {
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 5px;
    padding: 16px 15px;
    width: 100%
}

.fund-detail-search-icon {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 46px;
    height: 100%
}

.button.fund-detail-search-button {
    border-radius: 10px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, .16);
    font-weight: 600;
    max-width: 155px
}

@media (max-width: 47.99em) {
    .button.fund-detail-search-button {
        margin-top: 15px
    }
}

@media (min-width: 48em) {
    .button.fund-detail-search-button {
        margin-left: 16px
    }
}

.fund-detail-search-keyword {
    display: flex;
    align-items: center;
    margin-top: 25px;
    gap: 10px
}

.fund-detail-search-keyword > * {
    flex-shrink: 0
}

@media (max-width: 47.99em) {
    .fund-detail-search-keyword {
        align-items: flex-start;
        flex-direction: column
    }
}

.fund-box {
    display: flex;
    align-items: center;
    gap: 20px
}

@media (max-width: 47.99em) {
    .fund-box {
        flex-direction: column
    }
}

.fund-box .button {
    max-width: 340px;
    margin-right: auto;
    margin-left: auto
}

@media (min-width: 48em) {
    .fund-box .button {
        margin-right: 0
    }
}

.fund-contributor {
    display: grid;
    grid-template-columns:repeat(1, minmax(0, 1fr));
    gap: 20px
}

.fund-contributor-box {
    background-color: var(--gray-color);
    border-radius: 10px;
    display: grid;
    grid-template-columns:1fr;
    grid-template-rows:auto 1fr;
    gap: 18px 20px;
    padding: 20px 15px
}

@media (min-width: 48em) {
    .fund-contributor-box {
        padding: 30px;
        grid-template-columns:auto 1fr;
        grid-template-rows:1fr
    }
}

.fund-contributor-photo {
    margin: 0 auto
}

.fund-contributor-profile {
    margin-top: 10px
}

:root {
    --lang-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 13 13'%3E%3Cg transform='translate(0.5 0.5)'%3E%3Cpath d='M6-.5A6.5,6.5,0,1,1-.5,6,6.507,6.507,0,0,1,6-.5Zm0,12A5.5,5.5,0,1,0,.5,6,5.506,5.506,0,0,0,6,11.5Z' transform='translate(0 0)' fill='%23959595'/%3E%3Cpath d='M170.536,193.484a11.979,11.979,0,0,1-2.727-.3.5.5,0,0,1,.228-.974,10.98,10.98,0,0,0,2.5.276c3.241,0,5.5-1.266,5.5-2.4,0-.629-.673-1.282-1.8-1.747a.5.5,0,0,1,.381-.925c1.537.634,2.419,1.607,2.419,2.671,0,.977-.724,1.866-2.04,2.5A10.5,10.5,0,0,1,170.536,193.484Z' transform='translate(-164.536 -184.083)' fill='%23959595'/%3E%3Cpath d='M2.373,159.161a.5.5,0,0,1-.208-.046C.769,158.476,0,157.567,0,156.555c0-.977.724-1.866,2.04-2.5a10.5,10.5,0,0,1,4.46-.9,11.98,11.98,0,0,1,2.727.3A.5.5,0,1,1,9,154.43a10.981,10.981,0,0,0-2.5-.276c-3.241,0-5.5,1.265-5.5,2.4,0,.589.576,1.191,1.581,1.651a.5.5,0,0,1-.209.955Z' transform='translate(-0.5 -150.555)' fill='%23959595'/%3E%3Cpath d='M156.555,250.491c-.977,0-1.866-.724-2.5-2.04a10.5,10.5,0,0,1-.9-4.46c0-.383.017-.766.05-1.14a.5.5,0,0,1,1,.089c-.031.344-.046.7-.046,1.051,0,3.241,1.265,5.5,2.4,5.5.851,0,1.705-1.206,2.126-3a.5.5,0,0,1,.974.228C159.109,249.045,157.922,250.491,156.555,250.491Z' transform='translate(-150.555 -237.991)' fill='%23959595'/%3E%3Cpath d='M173.387,8.134l-.047,0a.5.5,0,0,1-.452-.544c.033-.356.05-.722.05-1.088,0-3.241-1.266-5.5-2.4-5.5-.851,0-1.705,1.206-2.126,3a.5.5,0,1,1-.974-.228C167.982,1.446,169.17,0,170.537,0c.977,0,1.866.724,2.5,2.04a10.5,10.5,0,0,1,.9,4.46c0,.4-.018.793-.054,1.18A.5.5,0,0,1,173.387,8.134Z' transform='translate(-164.537 -0.5)' fill='%23959595'/%3E%3C/g%3E%3C/svg%3E");
    --white-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440.499 666.644' preserveAspectRatio='none'%3E%3Cpath d='M422.73-10V589.005c90.2,33.785,180.244,67.638,360.641,67.638,360.129,0,360.129-134.9,720.258-134.9,179.715,0,269.743,33.58,359.6,67.246V-10Z' transform='translate(1863.5 1187) rotate(180)' fill='white' /%3E%3C/svg%3E");
    --scrollbar-width: 17px
}

body[data-page-category=company] [id] {
    scroll-margin-top: 0
}

@media (max-width: 47.99em) {
    body[data-page-category=company] [id] {
        scroll-margin-top: 80px
    }
}

body[data-page-category=company] > .l-main > .l-with-local-nav > .l-main-contents > .l-content > .page-title + .section > .grid.grid-cols-1[id="07"] {
    scroll-margin-top: 50px
}

@media (max-width: 47.99em) {
    body[data-page-category=company] > .l-main > .l-with-local-nav > .l-main-contents > .l-content > .page-title + .section > .grid.grid-cols-1[id="07"] {
        scroll-margin-top: 115px
    }
}

.company-header {
    position: relative;
    top: 0
}

.company-header.global-header--sticky {
    position: relative;
    top: 0
}

.company-header.global-header--sticky .global-header-logo > a {
    width: auto;
    height: auto
}

.company-header.global-header--sticky .global-header-logo > a > img {
    -webkit-transform: inherit;
    transform: inherit
}

.company-header.global-header--sticky .global-header-buttons {
    top: 53px;
    right: 20px
}

.company-header.global-header--sticky + main {
    padding-top: 0 !important
}

.company-header .global-header-container {
    position: relative;
    display: flex;
    padding: 0;
    margin: 0;
    align-items: center;
    justify-content: center;
    height: 110px;
    padding-right: 20px;
    padding-left: 20px
}

.company-header .company-header-home {
    position: absolute;
    top: 18px;
    right: 20px;
    font-size: 0.75rem;
    color: #555
}

.company-header .company-header-home::after {
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.svg");
    width: 12px;
    height: 12px;
    vertical-align: -2px;
    margin-left: 6px
}

.company-header .global-header-buttons {
    top: 53px;
    right: 20px
}

.company-header .global-header-logo {
    position: relative;
    top: inherit;
    left: inherit;
    margin: 0
}

.company-header .company-header-links {
    padding-right: 24px;
    padding-left: 24px;
    height: 50px;
    border-top: 1px solid rgba(0, 0, 0, .1);
    display: flex;
    align-items: center;
    justify-content: space-between
}

.company-header .company-header-links .company-header-links-current a {
    color: var(--accent-color);
    font-size: 1rem;
    font-weight: bold
}

.company-header .company-header-links .company-header-links-list {
    display: flex;
    align-items: center;
    justify-content: center
}

.company-header .company-header-links .company-header-links-list li {
    margin: 0 14px
}

.company-header .company-header-links .company-header-links-list li a {
    font-size: 0.9375rem
}

.company-header .company-header-links .company-header-links-lang {
    visibility: hidden
}

.company-header .company-header-links .company-header-links-lang > .label {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    font-size: 0.75rem;
    padding: 5px 9px;
    box-sizing: border-box;
    height: 36px;
    width: auto;
    cursor: pointer
}

.company-header .company-header-links .company-header-links-lang > .label .sp-text {
    display: none
}

.company-header .global-header-container.sp-global-navi {
    display: none
}

[data-page-category=company].is-local-nav-sticky .l-content {
    padding-top: 0
}

body[data-page-category=company] .local-nav-lv5__list {
    padding: 5px 0 0 10px
}

body[data-page-category=company] .local-nav-lv5__list > li:not(:last-of-type) {
    border-bottom: 1px solid #e5e5e5
}

body[data-page-category=company] .local-nav-lv5__list > li > a {
    padding: 10px 35px 10px 10px
}

@media (min-width: 48em) {
    body[data-page-category=company] .local-nav-lv5__list > li > a {
        padding: 10px 15px 10px 10px
    }
}

body[data-page-category=company] .local-nav-lv4 + .local-nav-lv5__list.local-nav-hdg, body[data-page-category=company] .local-nav-lv4[data-page-current=true] + .local-nav-lv5__list, body[data-page-category=company] .local-nav-current > li > .local-nav-lv4 + .local-nav-lv5__list {
    display: block
}

body[data-page-category=company] .local-nav-current .local-nav-lv5__list.local-nav-hdg {
    font-weight: normal
}

body[data-page-category=company] .company-section-full-width {
    width: calc(100vw - var(--scrollbar-width));
    margin-left: calc((100vw - var(--scrollbar-width) - 100%) / 2 * -1)
}

body[data-page-category=company] .u-underline {
    text-decoration: underline;
    text-underline-offset: 3px
}

body[data-page-category=company] .theme-list-topic li .meta .date {
    word-break: keep-all
}

body[data-page-category=company] .page-description + .section:first-of-type {
    padding-top: 30px
}

body[data-page-category=company] .list.theme-list-topic li .link:not([target=_blank]):not([href*=".pdf"]):not([href*=".xlsx"])::after {
    display: none
}

body[data-page-category=company] .theme-primary-button > span.link {
    display: flex;
    justify-content: space-between;
    text-align: left;
    align-items: center;
    width: 100%
}

body[data-page-category=company] .theme-primary-button > span.link::after {
    flex: 0 0 auto
}

body[data-page-category=company] .company-small-media {
    display: flex;
    flex-direction: row;
    gap: 0
}

body[data-page-category=company] .company-small-media .media-thumb {
    padding: 0 20px;
    display: flex;
    justify-content: center
}

body[data-page-category=company] .company-small-media .media-thumb img {
    width: auto;
    max-width: 100%
}

body[data-page-category=company] .company-small-media .media-inner {
    padding: 20px 0
}

body[data-page-category=company] .accordion-box-menu > li.accordion-box-menu-title > a {
    font-weight: 600;
    font-size: 1.125rem
}

body[data-page-category=company] .accordion-box-menu > li.accordion-box-menu-title ~ li {
    padding-left: 15px
}

body[data-page-category=company] .table-double-circle-mark {
    font-size: 1.125rem;
    line-height: 14px
}

body[data-page-category=company] .table-circle-mark {
    font-size: 0.875rem;
    line-height: 14px
}

body[data-page-category=company] .table-dot-mark {
    font-size: 1.5625rem;
    line-height: 14px
}

body[data-page-category=company] .company_top_hero {
    height: 550px;
    width: 100%;
    background-image: var(--white-wave), url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.jpg);
    background-size: max(100%, 1440px) 750px, cover;
    background-position: center calc(100% + 1px), center top;
    background-repeat: no-repeat, no-repeat
}

body[data-page-category=company] .company_top_hero h1 {
    font-weight: bold;
    font-size: 2.125rem;
    display: block;
    text-align: center;
    padding-top: 90px
}

body[data-page-category=company] .company_top_nav {
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    margin-bottom: -90px
}

body[data-page-category=company] .company-img-nav > li {
    box-shadow: 0 2px 2px rgba(0, 0, 0, .16);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    background: #fff
}

body[data-page-category=company] .company-img-nav > li > a {
    display: grid;
    grid-template-rows:auto minmax(67px, 1fr);
    width: 100%
}

body[data-page-category=company] .company-img-nav > li > a > img {
    width: 100%
}

body[data-page-category=company] .company-img-nav > li > a > span {
    padding: 10px 10px 10px 15px;
    justify-content: space-between;
    display: inline-flex;
    align-items: center;
    font-weight: bold;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%
}

body[data-page-category=company] .company-img-nav > li > a > span::after {
    flex: 0 0 auto
}

body[data-page-category=company] .company-img-nav > li > a > span:hover {
    opacity: 1
}

body[data-page-category=company] .section.company-top-banner {
    padding: 45px 0 90px 0;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.jpg);
    background-size: auto 100%;
    background-position: right center;
    background-repeat: no-repeat;
    background-color: #f8f8f8
}

body[data-page-category=company] .section.company-top-banner .company-top-banner-title {
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 15px
}

body[data-page-category=company] .section.company-top-banner .company-top-banner-news > ul {
    display: flex;
    flex-direction: column;
    gap: 10px 0
}

body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow {
    border: none;
    padding: 15px 20px;
    pointer-events: none
}

body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .banner-box-title {
    margin-bottom: 15px
}

body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .banner-box-title .link {
    pointer-events: auto
}

body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .company-top-banner-image {
    display: flex;
    align-items: flex-start;
    gap: 0 30px;
    font-size: 0.875rem
}

body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .company-top-banner-image > img {
    flex: 0 0 auto
}

body[data-page-category=company] .theme-sdgs-pictures {
    padding: 0 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 15px
}

body[data-page-category=company] .theme-sdgs-pictures > img {
    flex: 0 0 74px;
    width: 74px;
    height: auto
}

body[data-page-category=company] .theme-philosopy-desc > p {
    font-size: 1.125rem
}

body[data-page-category=company] .theme-philosopy-desc > p.theme-philosopy-text {
    font-size: 2.125rem
}

body[data-page-category=company] .theme-philosopy-desc > p + p {
    margin-top: 20px
}

body[data-page-category=company] .theme-philosopy-desc > p + p.theme-philosopy-text {
    margin-top: 30px
}

body[data-page-category=company] .theme-philosopy-text {
    font-size: 2.125rem;
    font-weight: bold;
    color: var(--accent-text-color)
}

body[data-page-category=company] .theme-philosopy-text + p, body[data-page-category=company] .theme-philosopy-text + .theme-philosopy-desc {
    margin-top: 40px
}

body[data-page-category=company] .theme-philosophy-values {
    counter-reset: values-number
}

body[data-page-category=company] .theme-philosophy-values .box {
    counter-increment: values-number
}

body[data-page-category=company] .theme-philosophy-values .box .box-title {
    display: flex;
    gap: 10px;
    font-size: 1.875rem;
    font-weight: bold;
    color: var(--accent-text-color)
}

body[data-page-category=company] .theme-philosophy-values .box .box-title::before {
    content: "0" counter(values-number);
    color: rgba(0, 150, 130, .5);
    font-family: "Arial", sans-serif;
    font-size: 2.375rem;
    font-weight: bold;
    font-style: italic;
    line-height: 2.8125rem
}

body[data-page-category=company] .theme-philosophy-values + p {
    margin-top: 40px
}

body[data-page-category=company] .theme-philosophy-logo .box-title {
    font-size: 1.25rem
}

body[data-page-category=company] .theme-philosophy-logo .media {
    gap: 30px
}

body[data-page-category=company] .theme-philosophy-logo .media .media-thumb {
    flex: 0 0 auto
}

body[data-page-category=company] .theme-philosophy-logo .media .media-thumb img {
    max-width: 230px
}

@media (min-width: 48em)and (max-width: 62.49em) {
    .company-header .global-header-container {
        height: 90px
    }

    .company-header .company-header-home {
        top: 10px
    }

    .company-header .global-header-buttons {
        top: 38px
    }

    .company-header .company-header-links {
        padding-right: 20px;
        padding-left: 20px
    }

    .company-header .company-header-links .company-header-links-current a {
        font-size: 0.75rem
    }

    .company-header .company-header-links .company-header-links-list li {
        margin: 0 6px
    }

    .company-header .company-header-links .company-header-links-list li a {
        font-size: 0.75rem
    }

    .company-header .company-header-links .company-header-links-lang > .label {
        height: 27px;
        padding: 4px 5px
    }

    body[data-page-category=company] .l-main {
        padding-bottom: 80px
    }
}

@media (max-width: 47.99em) {
    .is-open-global-header .company-header {
        position: -webkit-sticky;
        position: sticky
    }

    .local-nav-button {
        white-space: nowrap;
        width: 75px
    }

    .local-nav-button, .global-header-trigger, .global-header-close > button {
        cursor: pointer
    }

    .company-header {
        background: #fff;
        border-bottom: 1px solid rgba(0, 0, 0, .1)
    }

    .company-header .global-header-logo {
        padding: 0
    }

    .company-header .global-header-logo > a {
        width: 85px;
        height: auto
    }

    .company-header .global-header-logo > a > img {
        -webkit-transform: inherit;
        transform: inherit
    }

    .company-header.global-header--sticky .global-header-logo > a {
        width: 85px;
        height: auto
    }

    .company-header.global-header--sticky .global-header-logo > a > img {
        -webkit-transform: inherit;
        transform: inherit
    }

    .company-header .global-header-container {
        height: 59px;
        top: inherit;
        left: inherit;
        box-sizing: border-box;
        background: #fff
    }

    .company-header .global-header-buttons, .company-header .company-header-home {
        display: none
    }

    .company-header .company-header-links {
        height: 0;
        justify-content: center;
        text-align: center;
        border: none;
        padding: 0
    }

    .company-header .company-header-links .company-header-links-current {
        display: none
    }

    .company-header .company-header-links .company-header-links-list {
        display: none
    }

    .company-header .company-header-links .company-header-links-lang {
        position: absolute;
        right: 20px;
        top: 30px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 6
    }

    .company-header .company-header-links .company-header-links-lang > .label {
        height: 32px;
        padding: 5px 10px
    }

    .company-header .company-header-links .company-header-links-lang > .label .sp-text {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0 5px;
        line-height: 1
    }

    .company-header .company-header-links .company-header-links-lang > .label .sp-text::before {
        content: "";
        width: 12px;
        height: 12px;
        background-image: var(--lang-icon);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain
    }

    .company-header .company-header-links .company-header-links-lang > .label .pc-text {
        display: none
    }

    .company-header .global-header-container.sp-global-navi {
        background-color: #f5f5f5;
        display: none;
        position: fixed;
        top: 60px;
        left: 0;
        padding: 20px 15px 70px;
        width: 100%;
        height: calc(100% - 60px);
        height: calc(100dvh - 60px);
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 5
    }

    .company-header .global-header-menu > li:first-of-type {
        border-radius: 10px 10px 0 0
    }

    .company-header .global-header-menu > li:last-of-type {
        border-radius: 0 0 10px 10px;
        border-bottom: none
    }

    .company-header .global-header-menu > li:first-of-type:last-of-type {
        border-radius: 10px
    }

    .company-header .global-header-nav-title {
        font-weight: bold;
        font-size: 1.25rem;
        text-align: center;
        display: block;
        padding: 0 15px 15px 15px
    }

    .company-header .global-header-menu + .global-header-nav-title {
        margin-top: 40px
    }

    .company-header.global-header--open .global-header-container.sp-global-navi {
        display: block;
        padding-bottom: 80px
    }

    .company-header.global-header--open .global-header-container.sp-global-navi .global-header-buttons {
        display: flex;
        position: fixed;
        left: 0;
        top: 100%;
        flex: 0 0 auto;
        right: inherit;
        height: 66px;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        box-sizing: border-box;
        width: 100%;
        align-items: center;
        padding-left: 15px;
        padding-right: 66px;
        gap: 0 15px;
        background: #fff;
        box-shadow: 0 -3px 2px rgba(0, 0, 0, .16)
    }

    .company-header.global-header--open .global-header-container.sp-global-navi .global-header-buttons .global-header-button {
        width: 100%
    }

    body[data-page-category=company] .local-nav-lv5__list > li > a {
        border: none
    }

    body[data-page-category=company] .local-nav-lv4 > a {
        padding: 14px 45px 15px 15px;
        position: relative
    }

    body[data-page-category=company] .local-nav-lv4 > a::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        display: block;
        border-radius: 50%;
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    body[data-page-category=company] .footer-local-nav {
        margin-top: 40px;
        border-top: 1px solid #e5e5e5;
        position: relative
    }

    body[data-page-category=company] .footer-local-nav::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 1px;
        background: #e5e5e5
    }

    body[data-page-category=company] .footer-local-nav > li:first-of-type > .local-nav-hdg {
        font-weight: bold
    }

    body[data-page-category=company] .footer-local-nav .local-nav-lv5__list > li > a {
        padding: 14px 45px 15px 15px;
        border: none
    }

    body[data-page-category=company] .footer-local-nav .local-nav-item .local-nav-hdg > a {
        font-weight: bold;
        padding: 14px 45px 15px 15px;
        position: relative
    }

    body[data-page-category=company] .footer-local-nav .local-nav-item .local-nav-hdg > a::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 18px;
        height: 18px;
        display: block;
        border-radius: 50%;
        background: #009682 url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg) no-repeat 7px center;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    body[data-page-category=company] .footer-local-nav .local-nav-item > ul {
        display: inherit
    }

    body[data-page-category=company] .page-description + .section:first-of-type {
        padding-top: 0
    }

    body[data-page-category=company] .page-description + .section:first-of-type:not(:last-of-type) {
        padding-bottom: 0
    }

    body[data-page-category=company] .table.theme-table-flow-column > colgroup {
        display: none
    }

    body[data-page-category=company] .l-with-local-nav .page-title {
        position: -webkit-sticky;
        position: sticky
    }

    body[data-page-category=company] .grid-cols-1 .theme-primary-button {
        width: 100%
    }

    body[data-page-category=company] .company-small-media {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0 20px
    }

    body[data-page-category=company] .company-small-media .media-thumb, body[data-page-category=company] .company-small-media .media-inner {
        padding: 0
    }

    body[data-page-category=company] .table-scroll .table.u-sp-white-space {
        white-space: normal
    }

    body[data-page-category=company] .company_top_hero {
        height: 280px;
        background-image: var(--white-wave), url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.jpg);
        background-size: calc(100% + 80px) auto, cover
    }

    body[data-page-category=company] .company_top_hero h1 {
        font-size: 1.25rem;
        padding-left: 15px;
        padding-right: 15px;
        text-align: left;
        padding-top: 60px
    }

    body[data-page-category=company] .company_top_hero + .company_top_nav + .container {
        margin-bottom: 50px
    }

    body[data-page-category=company] .company_top_nav {
        margin-bottom: -40px;
        -webkit-transform: translateY(-40px);
        transform: translateY(-40px)
    }

    body[data-page-category=company] .company-top-list-topics > li + li {
        margin-top: 0
    }

    body[data-page-category=company] .company-top-list-topics > li > a {
        margin-top: 10px
    }

    body[data-page-category=company] .section.company-top-banner {
        background-image: none;
        padding-top: 0;
        padding-bottom: 25px
    }

    body[data-page-category=company] .section.company-top-banner::before {
        content: "";
        display: block;
        width: 100%;
        aspect-ratio: 375/135;
        background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.jpg);
        background-size: auto 100%;
        background-position: right center;
        background-repeat: no-repeat;
        background-color: inherit;
        margin-bottom: 30px
    }

    body[data-page-category=company] .section.company-top-banner .company-top-banner-title {
        font-size: 1.125rem;
        margin-bottom: 10px
    }

    body[data-page-category=company] .section.company-top-banner .company-top-banner-news {
        margin-bottom: 10px
    }

    body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow {
        pointer-events: auto;
        position: relative;
        padding-right: 40px
    }

    body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .banner-box-title .link:hover {
        opacity: 1
    }

    body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .banner-box-title .link::after {
        position: absolute;
        right: 15px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    body[data-page-category=company] .section.company-top-banner .box.theme-box-shadow .company-top-banner-image > img {
        display: none
    }

    body[data-page-category=company] .company-img-nav-sp > li {
        border: solid 1px #e5e5e5
    }

    body[data-page-category=company] .company-img-nav-sp > li > a {
        padding: 10px 15px 10px 95px;
        position: relative;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        min-height: 86px
    }

    body[data-page-category=company] .company-img-nav-sp > li > a > img {
        position: absolute;
        left: 10px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 66px;
        height: 66px
    }

    body[data-page-category=company] .company-img-nav-sp > li > a > img:not(.u-pc-hidden) {
        -webkit-transform: translateY(-50%) translateX(-40px);
        transform: translateY(-50%) translateX(-40px);
        width: auto;
        -webkit-clip-path: polygon(40px 0, 106px 0, 106px 66px, 40px 66px);
        clip-path: polygon(40px 0, 106px 0, 106px 66px, 40px 66px)
    }

    body[data-page-category=company] .company-img-nav-sp > li > a > span {
        width: 100%;
        display: flex;
        padding: 0
    }

    body[data-page-category=company] .theme-company-pad-t-0-sp {
        padding-top: 0 !important
    }

    body[data-page-category=company] .theme-philosopy-text {
        font-size: 1.5rem
    }

    body[data-page-category=company] .theme-philosopy-text + p {
        margin-top: 30px
    }

    body[data-page-category=company] .theme-philosopy-text + .theme-philosopy-desc {
        margin-top: 40px
    }

    body[data-page-category=company] .theme-philosopy-box {
        padding: 30px 15px
    }

    body[data-page-category=company] .theme-philosopy-box .theme-philosopy-desc > p {
        font-size: 1rem
    }

    body[data-page-category=company] .theme-philosopy-box .theme-philosopy-desc > p.theme-philosopy-text {
        font-size: 1.5rem
    }

    body[data-page-category=company] .theme-philosophy-values .box {
        padding: 25px 15px
    }

    body[data-page-category=company] .theme-philosophy-values .box .box-title {
        gap: 8px;
        font-size: 1.25rem
    }

    body[data-page-category=company] .theme-philosophy-values .box .box-title::before {
        font-size: 1.625rem;
        line-height: 1.875rem
    }

    body[data-page-category=company] .theme-philosophy-values .box .box-caption {
        margin-top: 15px
    }

    body[data-page-category=company] .theme-philosophy-values + p {
        margin-top: 40px
    }

    body[data-page-category=company] .theme-philosophy-logo .box-title {
        font-size: 1.125rem
    }

    body[data-page-category=company] .theme-philosophy-logo .media {
        gap: 30px
    }

    body[data-page-category=company] .theme-philosophy-logo .media .media-thumb {
        flex: 0 0 100%
    }

    body[data-page-category=company] .theme-philosophy-logo .media .media-thumb img {
        max-width: 315px;
        margin: 0 auto
    }

    body[data-page-category=company] .theme-philosophy-logo .media .media-text {
        font-size: 1rem
    }
}

.apply-header {
    box-shadow: 0px 1px 4px rgba(0, 0, 0, .16)
}

.apply-header + .l-main [id], .apply-header ~ .l-main [id] {
    scroll-margin-top: 0
}

@media (max-width: 47.99em) {
    .apply-header-logo {
        border-bottom: 1px solid #e5e5e5;
        width: 100%;
        padding: 0 15px 8px
    }
}

.apply-header-logo img {
    width: 85px
}

@media (min-width: 48em) {
    .apply-header-logo img {
        width: auto
    }
}

.apply-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    width: 100%;
    padding: 12px 0
}

@media (min-width: 48em) {
    .apply-header-inner {
        flex-direction: row;
        padding: 12px 20px
    }
}

.apply-header-contents {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap
}

.apply-header-links {
    color: var(--gray-text-color);
    font-size: 0.75rem;
    line-height: 1.2;
    display: none
}

@media (min-width: 48em) {
    .apply-header-links {
        display: flex;
        margin: 10px 0 10px 20px
    }
}

.apply-header-links > li {
    padding: 0 22px
}

.apply-header-links > li a {
    display: flex;
    align-items: center
}

.apply-header-links > li + li {
    border-left: 1px solid var(--gray-border-color)
}

.apply-header-links .link::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    width: 12px;
    height: 12px
}

@media (max-width: 47.99em) {
    .apply-header-contents {
        width: 100%;
        padding: 0 15px;
        margin-top: 8px
    }
}

.apply-header-contact {
    background-color: var(--green-color);
    display: flex;
    border-radius: 10px;
    padding: 15px 8px
}

@media (max-width: 47.99em) {
    .apply-header-contact {
        justify-content: center;
        width: 100%
    }
}

@media (min-width: 48em) {
    .apply-header-contact {
        padding: 15px;
        margin-left: 40px
    }
}

.apply-header-contact-head {
    border-right: 1px solid var(--gray-border-color);
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 600;
    padding-right: 15px
}

.apply-header-contact-body {
    display: flex;
    align-items: center;
    padding-left: 15px
}

.apply-header-contact-inner {
    text-align: center;
    line-height: 1.2
}

.apply-header-contact-tel {
    color: var(--accent-text-color);
    font-size: 1.375rem;
    font-weight: 600;
    display: flex;
    align-items: center
}

.apply-header-contact-tel > img {
    margin-right: 6px
}

.apply-header-contact-chat {
    background-color: var(--base-color);
    padding: 9px 12px;
    margin-left: 14px;
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center;
    display: none
}

@media (min-width: 48em) {
    .apply-header-contact-chat {
        display: block
    }
}

.apply-header-contact-chat-button {
    background: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 10px;
    display: block;
    -webkit-filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.16));
    width: 100%;
    padding: 8px 10px;
    margin-top: 8px
}

.apply-header-contact-chat-button::after {
    display: none
}

.apply-footer {
    margin-top: 50px
}

@media (min-width: 48em) {
    .apply-footer {
        margin-top: 80px
    }
}

.apply-footer .footer-copyright {
    margin-top: 0
}

@media (max-width: 47.99em) {
    .apply-footer .footer-copyright {
        border-top: 0
    }
}

.apply-footer-contact {
    background-color: var(--green-color);
    padding: 30px 0
}

@media (min-width: 48em) {
    .apply-footer-contact {
        padding: 60px 0
    }
}

.apply-footer-contact-inner {
    display: flex;
    justify-content: center
}

.apply-footer-contact-contents {
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    align-items: center
}

@media (min-width: 48em) {
    .apply-footer-contact-contents {
        flex-direction: row
    }
}

.apply-footer-contact-free-call {
    color: var(--accent-color);
    font-size: 2.25rem;
    font-weight: 600;
    display: flex;
    align-items: center
}

@media (min-width: 48em) {
    .apply-footer-contact-free-call {
        margin: 0 18px 0 23px
    }
}

.apply-footer-contact-free-call img {
    margin-right: 8px
}

.apply-footer-contact-ip {
    color: var(--accent-color);
    font-size: 1.0625rem;
    font-weight: 600
}

.apply-footer-contact-reception {
    text-align: center
}

.apply-footer-bottom {
    padding-bottom: 34px
}

.apply-under-age-cv {
    display: flex;
    justify-content: center
}

@media (max-width: 47.99em) {
    .apply-under-age-cv {
        align-items: center;
        flex-direction: column
    }

    .apply-under-age-cv > * + * {
        margin-top: 40px
    }

    .apply-under-age-cv .apply-cta-item {
        width: 100%
    }
}

.apply-under-age-cv .apply-cta-number {
    width: 372px;
    margin: 0 auto
}

@media (max-width: 47.99em) {
    .apply-under-age-cv .apply-cta-number {
        width: 100%
    }
}

:root {
    --green-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440.499 666.644' preserveAspectRatio='none'%3E%3Cpath d='M422.73-10V589.005c90.2,33.785,180.244,67.638,360.641,67.638,360.129,0,360.129-134.9,720.258-134.9,179.715,0,269.743,33.58,359.6,67.246V-10Z' transform='translate(1863.5 1187) rotate(180)' fill='%23F8F7EC' /%3E%3C/svg%3E");
    --yellow-bg: #fcf6b3;
    --light-green-bg: #f8f7ec;
    --lighter-green-bg: var(--gray-color, #f7f7f7);
    --green-bg: var(--green-color, #e9f4f1);
    --green-text: #1b967b
}

.first-article:first-of-type {
    background-color: var(--light-green-bg)
}

.first-article .section {
    padding-bottom: 50px
}

.first-article .section .section-header {
    padding-bottom: 30px
}

.first-article .section .section-header.with-number {
    padding-bottom: 50px
}

.first-article .section .sub-section + .sub-section {
    padding-top: 50px
}

.first-article .section .sub-section + .sub-section.mini-sub-section {
    padding-top: 20px
}

.first-article .section-bg-lighter-green {
    background-color: var(--lighter-green-bg)
}

.first-article .section-bg-light-green {
    background-color: var(--light-green-bg)
}

.first-article .section-bg-green {
    background-color: var(--green-bg)
}

.first-article .section-bg-yellow {
    background-color: var(--yellow-bg)
}

.first-article .first-section-full-width {
    width: calc(100vw - var(--scrollbar-width));
    margin-left: calc((100vw - var(--scrollbar-width) - 100%) / 2 * -1)
}

.first-article .first_top_hero {
    height: 460px;
    width: 100%;
    background-color: #fcf6b3;
    background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    position: relative;
    padding: 0 20px
}

.first-article .first_top_hero::after {
    content: "";
    background-image: var(--green-wave);
    background-size: max(100%, 1440px) 750px;
    background-position: center calc(100% + 1px);
    background-repeat: no-repeat;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 0;
    width: 100%;
    height: 100%
}

.first-article .first_top_hero .container {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.first-article .first_top_hero .container .first_top_hero-desc {
    max-width: min(38%, 370px);
    min-width: 300px;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 20px 0;
    position: relative;
    z-index: 2
}

.first-article .first_top_hero .container .first_top_hero-desc h1 {
    font-weight: bold;
    font-size: 2.125rem;
    display: block;
    text-align: left
}

.first-article .first_top_hero .container .first_top_hero-desc h1 + p {
    font-size: 1.125rem
}

.first-article .first_top_hero .container .first_top_hero-images {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    position: relative;
    z-index: 2;
    width: 40%;
    max-width: 490px;
    gap: 10px
}

.first-article .first_top_hero .container .first_top_hero-images > img {
    flex: 0 0 auto;
    width: calc(50% - 5px);
    height: auto
}

.first-article .first_top_hero-desc-text {
    min-height: 5.25rem
}

@media (min-width: 48em) {
    .first-article .first_top_hero-desc-text {
        min-height: none
    }
}

.first-article .first_top_hero-desc-bloc {
    background-color: rgba(255, 255, 255, .5);
    border-radius: 10px;
    max-width: 100%;
    width: 300px;
    padding: 20px 25px;
    display: flex;
    flex-direction: column;
    gap: 15px 0
}

.first-article .first_top_hero-desc-bloc p {
    font-size: 0.9375rem;
    text-align: center
}

.first-article .first_top_hero-desc-bloc p:first-of-type {
    font-weight: bold
}

.first-article .first_top_hero-desc-bloc .button {
    width: 100%;
    padding-left: 45px;
    padding-right: 45px
}

.first-article .first_top_hero-desc-bloc .button::before {
    content: "";
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    width: 18px;
    height: 21px;
    position: absolute;
    top: 0;
    left: 20px;
    bottom: 0;
    margin: auto 0
}

.first-article .first_top-anchors-button > a {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 100vw;
    padding: 14px 60px;
    font-size: 1.25rem
}

.first-article .first_top-anchors-button > a::before {
    font-size: 2.25rem;
    left: 10px
}

.first-article .first_top-anchors-button > a small {
    font-size: 0.875rem;
    color: #222;
    font-weight: normal
}

.first-article .first_top-section-header.section-header.with-number .number {
    color: rgba(0, 150, 130, .5)
}

.first-article .first_top-section-header.section-header.with-number .number::before {
    display: none
}

.first-article .first_top-section-header.section-header.with-number p {
    text-align: center;
    margin-top: 25px
}

.first-article .account-step-pic > img {
    margin: 0 auto
}

.first-article .account-step-description {
    text-align: center
}

.first-article .account-step-contact {
    max-width: 790px;
    margin-left: auto;
    margin-right: auto
}

.first-article .reel .swiper-slide {
    height: auto
}

.first-article .reel .reel-container {
    padding-left: 0;
    padding-bottom: 30px
}

.first-article .reel .reel-container .reel-items .reel-card .reel-card-link .reel-card-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px
}

.first-article .reel .reel-container .reel-items .reel-card .reel-card-link .reel-card-title::after {
    margin-left: 0
}

.first-article .reel .reel-container .reel-small-card .reel-small-card-link {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding-right: 40px;
    padding-left: 15px;
    position: relative;
    height: 100%
}

.first-article .reel .reel-container .reel-small-card .reel-small-card-link::after {
    content: "";
    background-color: var(--accent-color);
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_arrow_white.svg);
    background-repeat: no-repeat;
    background-position: 7px center;
    border-radius: 50%;
    display: block;
    width: 18px;
    height: 18px;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.first-article .reel .reel-container .reel-small-card .reel-small-card-link .reel-small-card-image {
    align-self: center
}

.first-article .reel .reel-container .reel-small-card .reel-small-card-link .reel-small-card-title::after {
    display: none
}

.first-article .box {
    position: relative;
    display: grid;
    grid-template-rows:54px 1fr auto;
    gap: 20px;
    padding-top: 43px;
    padding-bottom: 40px
}

.first-article .box .label {
    position: absolute;
    right: 10px;
    top: 10px;
    border-radius: 4px
}

.first-article .box .box-header {
    margin: 0
}

.first-article .box .box-header .box-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 10px;
    font-size: 1.25rem
}

.first-article .box .box-desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px 0
}

.first-article .box .box-desc p {
    font-size: 0.875rem;
    text-align: center
}

.first-article .box .box-link {
    font-size: 1rem;
    text-align: right
}

.first-article .box .box-link .link {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end
}

.first-article .box .box-link .link::after {
    flex: 0 0 auto;
    margin: 0
}

.first-article .card:not(.link-card) .card-link-title::after {
    display: none
}

.first-article .card.link-card[target=_blank] .card-link-title::after {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 14px;
    height: 14px;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 0;
    vertical-align: initial
}

.first-article .theme-labels-bloc .theme-labels-title {
    text-align: center;
    margin-bottom: 25px
}

.first-article .theme-labels-bloc .theme-labels .label {
    border-radius: 2px;
    border: solid 2px var(--accent-color);
    padding: 5px 10px;
    font-size: 0.8125rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px 0
}

.first-article .theme-labels-bloc .theme-labels .label strong {
    color: var(--green-text);
    font-weight: bold;
    font-size: 1rem;
    line-height: 1.3
}

.first-article .account-step-item + .account-step-item::before {
    left: 5px
}

.learning.theme-first-convertion {
    background-color: var(--green-bg)
}

.learning.theme-first-convertion .learning-contents.no-list {
    padding: 25px 40px
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .learning-text-title {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 10px
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .learning-text-subtitle {
    font-size: 1.125rem;
    margin-bottom: 18px
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-title-tel {
    font-size: 1.25rem;
    font-weight: bold
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc p {
    display: inline-flex;
    margin-right: 12px;
    vertical-align: middle
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc .account-step-free-tel {
    padding: 0
}

.learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc .account-step-ip-tel {
    margin-right: 25px
}

.section.theme-full-padding {
    padding-bottom: 50px
}

.learning.theme-flow {
    background-color: var(--green-bg)
}

.learning.theme-flow .learning-contents.no-list {
    padding: 25px 40px;
    display: flex;
    gap: 20px
}

.learning.theme-flow .learning-contents.no-list .learning-text .learning-text-title {
    font-size: 1.375rem;
    font-weight: bold;
    margin-bottom: 5px;
    text-align: center
}

.learning.theme-flow .learning-contents.no-list .learning-text .learning-text-subtitle {
    font-size: 1rem;
    text-align: center
}

.learning.theme-flow .learning-contents.no-list .learning-button {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px
}

.learning.theme-flow .learning-contents.no-list .learning-button .theme-account-button {
    max-width: 100%
}

@media (min-width: 48em) {
    .theme-section-first {
        padding-top: 100px
    }

    .theme-sp-only {
        display: none !important
    }

    .media.theme-fluid-image .media-thumb {
        flex: 0 0 auto;
        max-width: calc(50% - 10px)
    }

    .media.theme-fluid-image .media-thumb img {
        width: auto;
        max-width: 100%;
        height: auto
    }
}

@media (max-width: 47.99em) {
    .theme-pc-only {
        display: none !important
    }

    .first-article .section {
        padding-bottom: 40px
    }

    .first-article .section .sub-section + .sub-section {
        padding-top: 40px
    }

    .first-article .section .sub-section + .sub-section.mini-sub-section {
        padding-top: 30px
    }

    .first-article .section .section-header.with-number .number {
        font-size: 3.75rem
    }

    .first-article .section#service {
        padding-top: 0
    }

    .first-article .section .first_top-section-header.section-header.with-number p br {
        display: none
    }

    .first-article .first_top_hero {
        height: auto;
        padding: 0;
        background-image: url("https://puyzee.com/static/templ/1708564837/03/image/icon_menu.jpg")
    }

    .first-article .first_top_hero::after {
        background-size: calc(100% + 480px) 380px
    }

    .first-article .first_top_hero .container {
        flex-direction: column;
        gap: 25px 0;
        padding: 25px 15px 25px 15px;
        background-size: 220px auto;
        background-position: left -45px bottom -30px
    }

    .first-article .first_top_hero .container .first_top_hero-desc {
        width: 100%;
        max-width: 100%;
        gap: 15px 0
    }

    .first-article .first_top_hero .container .first_top_hero-desc h1 {
        font-size: 1.5rem
    }

    .first-article .first_top_hero .container .first_top_hero-desc h1 + p {
        font-size: 0.875rem
    }

    .first-article .first_top_hero .container .first_top_hero-desc h1 + p br {
        display: none
    }

    .first-article .first_top_hero .container .first_top_hero-desc .first_top_hero-desc-bloc {
        display: none
    }

    .first-article .first_top_hero .container .first_top_hero-images {
        display: flex;
        position: relative;
        z-index: 2;
        width: 100%;
        max-width: 450px;
        gap: 4px;
        padding-left: 30%
    }

    .first-article .first_top_hero .container .first_top_hero-images img {
        width: calc(50% - 2px)
    }

    .first-article .first_top_hero + .u-pc-hidden.container {
        margin-top: -10px;
        position: relative
    }

    .first-article .first_top_hero + .u-pc-hidden.container .first_top_hero-desc-bloc {
        width: 100%;
        background: #fff
    }

    .first-article .first_top_hero + .u-pc-hidden.container .first_top_hero-desc-bloc p:not(:first-of-type) {
        font-size: 0.875rem
    }

    .first-article .first_top_hero + .u-pc-hidden.container .first_top_hero-desc-bloc .button {
        padding: 19px 45px;
        font-size: 1.25rem
    }

    .first-article .reel .reel-container {
        padding-left: 15px;
        padding-bottom: 40px
    }

    .first-article .reel .reel-container .reel-items .reel-card .reel-card-link .reel-card-title {
        font-size: 1rem
    }

    .first-article .reel .reel-container .reel-items .reel-card .reel-card-link .reel-card-description {
        font-size: 0.875rem
    }

    .first-article .reel .reel-container .reel-small-card .reel-small-card-link .reel-small-card-image {
        flex: 0 0 64px
    }

    .first-article .first_top-anchors-button > a {
        font-size: 1rem
    }

    .first-article .first_top-anchors-button > a small {
        font-size: 0.8125rem
    }

    .first-article .first_top-anchors-button > a small br {
        display: none
    }

    .first-article .box {
        padding: 22px 10px;
        grid-template-rows:minmax(24px, auto) 1fr 18px;
        gap: 10px
    }

    .first-article .box .label {
        display: none
    }

    .first-article .box .box-header .box-title {
        display: block;
        text-align: center;
        font-size: 1rem
    }

    .first-article .box .box-header .box-title img {
        display: none
    }

    .first-article .box .box-link .link span span {
        display: none
    }

    .first-article .theme-labels-bloc .theme-labels-title {
        margin-bottom: 15px
    }

    .first-article .theme-labels-bloc .theme-labels .label strong {
        font-size: 0.9375rem
    }

    .first-article .card .card-inner {
        padding: 20px 5px
    }

    .first-article .card .card-inner .card-link-title {
        font-size: 1rem
    }

    .first-article .account-step-item + .account-step-item::before {
        left: 28px
    }

    .learning.theme-first-convertion .learning-contents.no-list {
        padding: 25px 20px
    }

    .learning.theme-first-convertion .learning-contents.no-list .learning-text .learning-text-title {
        text-align: center;
        font-size: 1.125rem
    }

    .learning.theme-first-convertion .learning-contents.no-list .learning-text .learning-text-subtitle {
        font-size: 1rem;
        text-align: center
    }

    .learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-title-tel {
        font-size: 1rem
    }

    .learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap
    }

    .learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc p {
        margin-right: 0
    }

    .learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc .account-step-ip-tel, .learning.theme-first-convertion .learning-contents.no-list .learning-text .account-step-contact-bloc .account-step-hours-tel {
        text-align: center;
        display: block;
        width: 100%;
        margin-right: 0
    }

    .first-article-with-local {
        padding: 0 15px
    }

    .learning.theme-flow .learning-contents.no-list {
        padding: 25px 20px;
        flex-direction: column;
        gap: 0
    }

    .learning.theme-flow .learning-contents.no-list .learning-text .learning-text-title {
        font-size: 1.125rem
    }

    .media.theme-fluid-image .media-thumb img {
        width: auto;
        max-width: 100%;
        height: auto;
        margin: 0 auto
    }

    .first-article-with-local .theme-section-first {
        padding-top: 0
    }

    .first-article-with-local .theme-section-first .theme-section-flow {
        padding-top: 20px
    }

    .first-article-with-local .theme-section-first .theme-section-flow:first-of-type {
        padding-top: 0
    }

    .first-article-with-local .theme-section-first .theme-section-flow .section-header {
        padding-top: 20px
    }

    .first_top-section-header.section-header.with-number p {
        font-size: 1rem
    }
}

body[data-page-category=study] .top-keyvisual {
    background-color: #fcf6b3
}

body[data-page-category=study] .top-keyvisual > .container {
    padding-top: 10px;
    padding-bottom: 40px
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual > .container {
        padding-top: 30px;
        padding-bottom: 50px
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type {
    margin-top: 30px
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-header {
    display: flex;
    align-items: center
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-header::before, body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-header::after {
    content: "";
    flex-grow: 1;
    display: block;
    height: 1px;
    background-color: #d8cb42
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-header-title {
    flex-shrink: 0;
    padding: 0 12px;
    font-size: 1.25rem;
    font-weight: bold
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-header-title {
        padding: 0 62px;
        font-size: 1.5rem
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-list {
    margin-top: 30px;
    display: grid;
    grid-template-columns:repeat(1, minmax(0, 1fr));
    gap: 30px
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-list {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        gap: 20px
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-detail {
    display: flex;
    align-items: center;
    justify-content: center
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-detail {
        display: block
    }

    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-image {
        text-align: center
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-image img {
    display: inline-block;
    width: 68px
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-image img {
        width: 166px
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-text {
    min-width: 9.375rem;
    margin-left: 15px;
    font-size: 1rem;
    font-weight: bold;
    text-align: left
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-text {
        margin-top: 20px;
        margin-left: 0;
        font-size: 1.125rem;
        text-align: center
    }

    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-text br {
        display: none
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-button {
    margin-top: 15px
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-button {
        margin-top: 30px
    }
}

body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-button .button {
    border-radius: 100vh;
    background-color: var(--base-color);
    color: var(--accent-text-color);
    font-weight: bold
}

@media (min-width: 48em) {
    body[data-page-category=study] .top-keyvisual .top-keyvisual-type .type-item-button .button {
        min-height: 95px;
        font-size: 1.25rem
    }
}

body[data-page-category=study] .seminar-list-wrap {
    overflow: hidden
}

body[data-page-category=study] .seminar-list {
    margin-top: -61px
}

body[data-page-category=study] .seminar-list .seminar-item {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px dashed #ccc
}

@media (min-width: 48em) {
    body[data-page-category=study] .seminar-list .seminar-item-block {
        display: flex
    }

    body[data-page-category=study] .seminar-list .seminar-item-image {
        flex-shrink: 0
    }
}

body[data-page-category=study] .seminar-list .seminar-item-image img {
    margin-right: auto;
    margin-left: auto
}

body[data-page-category=study] .seminar-list .seminar-item-detail {
    margin-top: 30px
}

@media (min-width: 48em) {
    body[data-page-category=study] .seminar-list .seminar-item-detail {
        flex-grow: 1;
        margin-top: 0;
        margin-left: 20px
    }
}

body[data-page-category=study] .seminar-item-definition {
    display: table
}

body[data-page-category=study] .seminar-item-definition dl {
    display: table-row
}

body[data-page-category=study] .seminar-item-definition dl > * {
    display: table-cell
}

body[data-page-category=study] .seminar-item-definition dl:nth-child(n+2) > * {
    padding-top: 10px
}

body[data-page-category=study] .seminar-item-definition dt > span {
    position: relative;
    display: block;
    padding-right: 1em;
    white-space: nowrap
}

body[data-page-category=study] .seminar-item-definition dt > span::before {
    content: "：";
    position: absolute;
    top: 0;
    right: 0
}

.select .select-wrapper li.disabled {
    display: none !important
}

.select li.filter-button {
    cursor: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0
}

.select li.filter-button a {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    flex: 1 0 auto
}

.results > tr:first-of-type {
    display: none
}

.results td span {
    display: block
}

.results tr td:first-of-type {
    text-align: center
}

:root {
    --table-right-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6.145' height='10.876' viewBox='0 0 6.145 10.876'%3E%3Cg transform='translate(0.707 0.707)'%3E%3Cline x2='6.69' transform='translate(0 0) rotate(45)' fill='none' stroke='%231b967b' stroke-linecap='round' stroke-width='1'/%3E%3Cline x2='6.69' transform='translate(4.731 4.731) rotate(135)' fill='none' stroke='%231b967b' stroke-linecap='round' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E");
    --main-grey: #CCCCCC
}

@media (max-width: 47.99em) {
    .table.compact-sp-table thead, .table.compact-sp-table tbody tr:first-of-type {
        display: none
    }

    .table.compact-sp-table, .table.compact-sp-table tbody {
        display: block
    }

    .table.compact-sp-table {
        border-bottom: solid 1px var(--main-grey);
        border-right: solid 1px var(--main-grey);
        border-left: solid 1px var(--main-grey)
    }

    .table.compact-sp-table tbody tr {
        display: flex;
        flex-wrap: wrap;
        padding: 18px 35px 15px 15px;
        box-sizing: border-box;
        position: relative;
        overflow: hidden;
        gap: 4px 0;
        border-top: solid 1px var(--main-grey);
        background-image: var(--table-right-arrow);
        background-position: right 15px center;
        background-repeat: no-repeat
    }

    .table.compact-sp-table tbody tr td {
        border: none;
        padding: 0;
        height: auto;
        width: 100%;
        text-align: left
    }

    .table.compact-sp-table tbody tr td:nth-of-type(1) {
        order: 2
    }

    .table.compact-sp-table tbody tr td:nth-of-type(2) {
        order: 1
    }

    .table.compact-sp-table tbody tr td:nth-of-type(3) {
        order: 3
    }

    .table.compact-sp-table tbody tr td:nth-of-type(4) {
        order: 4
    }

    .table.compact-sp-table tbody tr td:nth-of-type(4)::before {
        content: "確定月 : "
    }

    .table.compact-sp-table tbody tr td > a, .table.compact-sp-table tbody tr td > a:hover {
        text-decoration: none;
        opacity: 1
    }

    .table.compact-sp-table tbody tr td > a::after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%
    }
}

body[data-page-category=support] .text-email::after {
    content: "@" attr(data-domain-third) "." attr(data-domain-second) "." attr(data-domain-top)
}

@media (min-width: 48em) {
    body[data-page-category=support] .index-form-search {
        display: flex;
        align-items: center
    }
}

body[data-page-category=support] .index-form-search .search-label {
    font-size: 0.9375rem;
    font-weight: bold
}

@media (min-width: 48em) {
    body[data-page-category=support] .index-form-search .search-label {
        flex-shrink: 0
    }
}

body[data-page-category=support] .index-form-search .search-input {
    position: relative;
    margin-top: 20px
}

@media (min-width: 48em) {
    body[data-page-category=support] .index-form-search .search-input {
        flex-grow: 1;
        max-width: 648px;
        margin-top: 0;
        margin-left: 38px
    }
}

body[data-page-category=support] .index-form-search .search-input input {
    width: 100%;
    height: 47px;
    padding: 0 47px 0 15px;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 5px;
    font-size: 0.75rem
}

body[data-page-category=support] .index-form-search .search-input button {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
    cursor: pointer
}

body[data-page-category=support] .index-video-panel {
    justify-content: space-between
}

body[data-page-category=support] .index-consultant-header {
    margin-bottom: 20px
}

body[data-page-category=support] .index-consultant-header .index-consultant-heading {
    font-size: 20px;
    font-weight: bold
}

body[data-page-category=support] .contact-area-header.text-large {
    font-size: 1.25rem
}

body[data-page-category=support] .contact-area-header.text-large.height-row-2 {
    display: flex;
    align-items: center;
    justify-content: center
}

@media (min-width: 48em) {
    body[data-page-category=support] .contact-area-header.text-large.height-row-2 {
        min-height: 3.75rem
    }
}

body[data-page-category=support] .contact-area-item .contact-area-text-plain {
    font-weight: normal
}

body[data-page-category=support] .contact-login-button {
    position: relative;
    max-width: 370px;
    margin: 0 auto;
    padding: 18px 40px;
    font-size: 1.0625rem
}

@media (min-width: 48em) {
    body[data-page-category=support] .contact-login-button {
        font-size: 1.25rem
    }
}

body[data-page-category=support] .contact-login-button::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_local_login.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    position: absolute;
    top: 0;
    left: 18px;
    bottom: 0;
    margin: auto 0;
    width: 18px;
    height: 18px
}

body[data-page-category=support] .contact-table tbody td {
    text-align: center
}

body[data-page-category=support] .contact-table tbody td.status-busy {
    background-color: #f7f7f7
}

.login-hub-header {
    background-color: #fff;
    box-shadow: 0 2px 3px rgba(0, 0, 0, .16);
    width: 100%;
    z-index: 9999;
    position: relative
}

@media (min-width: 48em) {
    .login-hub-header {
        box-shadow: 0 1px 4px rgba(0, 0, 0, .16)
    }
}

.login-hub-header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 12px 15px
}

@media (min-width: 48em) {
    .login-hub-header-container {
        padding: 18px 24px 10px
    }
}

.login-hub-header-logo > a {
    display: block;
    width: 86px
}

@media (min-width: 48em) {
    .login-hub-header-logo > a {
        width: auto;
        height: auto
    }
}

.login-hub-header-logo > a img {
    -webkit-transform: none;
    transform: none
}

.login-hub-header-inner {
    display: flex;
    align-items: flex-end;
    flex-direction: column
}

.login-hub-header-links {
    display: flex;
    margin-left: auto;
    align-self: center;
    font-size: 0.75rem
}

@media (max-width: 47.99em) {
    .login-hub-header-links {
        display: none
    }
}

.login-hub-header-links li {
    padding: 0 18px;
    line-height: 1
}

.login-hub-header-links li:last-of-type {
    padding: 0 0 0 18px
}

.login-hub-header-links li + li {
    border-left: 1px solid #ccc
}

.login-hub-header-links a {
    color: #555;
    display: flex;
    align-items: center
}

.login-hub-header-links a > img {
    margin-left: 4px
}

.login-hub-header-button {
    background-color: #e83a3a;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .11);
    border-radius: 10px;
    font-weight: 600;
    color: var(--base-color);
    display: block;
    text-align: center;
    width: 70px;
    padding: 10px 8px;
    font-size: 0.75rem
}

@media (min-width: 48em) {
    .login-hub-header-button {
        font-size: 0.9375rem;
        width: 129px;
        padding: 15px;
        margin-top: 17px
    }
}

body[data-page-category=login] .login-box[data-category=stock] {
    background-color: #f2fbf9
}

body[data-page-category=login] .login-box .login-box-header .box-title {
    font-size: 1.5rem;
    text-align: center
}

@media (max-width: 47.99em) {
    body[data-page-category=login] .login-box .login-box-header .box-title {
        display: none
    }
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-box .login-box-content {
        margin-top: 30px
    }
}

body[data-page-category=login] .login-box .login-box-grid {
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(auto-fit, minmax(100px, 1fr));
    align-items: center;
    max-width: 760px;
    margin-right: auto;
    margin-left: auto
}

body[data-page-category=login] .login-box .login-box-grid .grid-stock-button {
    grid-row: 1/2;
    grid-column: 1/2
}

body[data-page-category=login] .login-box .login-box-grid .grid-stock-text {
    grid-row: 2/3;
    grid-column: 1/2
}

body[data-page-category=login] .login-box .login-box-grid .grid-classic-button {
    grid-row: 1/2;
    grid-column: 2/3
}

body[data-page-category=login] .login-button {
    position: relative;
    max-width: 370px;
    margin: 0 auto;
    padding: 15px 20px;
    color: var(--base-color);
    font-size: 0.9375rem
}

body[data-page-category=login] .login-button.large {
    padding: 18px 40px;
    font-size: 1.25rem
}

body[data-page-category=login] .login-button[data-type=stock] {
    background-color: var(--stock-color)
}

body[data-page-category=login] .login-button[data-type=classic] {
    background-color: #195547
}

body[data-page-category=login] .login-button[data-type=fund] {
    background-color: var(--fund-color)
}

body[data-page-category=login] .login-button[data-type=us] {
    background-color: var(--usstock-color)
}

body[data-page-category=login] .login-button[data-type=fx] {
    background-color: var(--fx-color)
}

body[data-page-category=login] .login-button::before {
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_local_login.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    position: absolute;
    top: 0;
    left: 18px;
    bottom: 0;
    margin: auto 0;
    width: 18px;
    height: 18px
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-support-list {
        display: flex
    }
}

body[data-page-category=login] .login-support-item {
    padding: 30px 15px;
    background-color: var(--base-color);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-support-item {
        flex-grow: 1;
        flex-basis: 0;
        padding-right: 20px;
        padding-left: 20px
    }
}

body[data-page-category=login] .login-support-item:nth-child(n+2) {
    margin-top: 10px
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-support-item:nth-child(n+2) {
        margin-top: 0;
        margin-left: 20px
    }
}

body[data-page-category=login] .login-support-title {
    font-size: 1rem;
    font-weight: 600;
    text-align: center
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-support-title {
        font-size: 1rem
    }
}

body[data-page-category=login] .login-support-title + * {
    margin-top: 15px
}

body[data-page-category=login] .login-support-body > *:nth-child(n+2) {
    margin-top: 25px
}

body[data-page-category=login] .login-support-description {
    font-size: 0.875rem
}

body[data-page-category=login] .login-support-button .button {
    width: 100%;
    font-size: 0.75rem
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-support-button .button {
        max-width: none;
        font-size: 0.9375rem
    }
}

body[data-page-category=login] .login-support-contact {
    text-align: center
}

@media (min-width: 48em) {
    body[data-page-category=login] .login-support-contact .link-tel {
        pointer-events: none
    }
}

body[data-page-category=login] .login-support-link {
    text-align: center
}

body[data-page-category=login] .login-terms-content > *:nth-child(n+2) {
    margin-top: 25px
}

body[data-page-category=login] .login-apps-container {
    padding: 30px 15px;
    border-radius: 10px
}

body[data-page-category=login] .login-apps-container.border {
    border: 1px solid var(--gray-border-color)
}

body[data-page-category=login] .login-apps-header + .login-apps-body {
    margin-top: 25px
}

body[data-page-category=login] .login-apps-title {
    font-size: 1.125rem;
    font-weight: 600;
    text-align: center
}

body[data-page-category=login] .login-apps-item + .login-apps-item {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px dotted var(--gray-border-color)
}

body[data-page-category=login] .login-apps-item > *:nth-child(n+2) {
    margin-top: 20px
}

body[data-page-category=login] .login-apps-name {
    display: flex;
    align-items: center;
    justify-content: center
}

body[data-page-category=login] .login-apps-name .name-icon {
    border: 1px solid var(--gray-border-color);
    border-radius: 10px;
    overflow: hidden
}

body[data-page-category=login] .login-apps-name .name-icon img {
    display: block
}

body[data-page-category=login] .login-apps-name .name-text {
    margin-left: 15px;
    font-size: 1.125rem;
    font-weight: 600
}

body[data-page-category=login] .login-apps-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-column-gap: 20px;
    column-gap: 20px
}

.tool-mv {
    position: relative;
    margin-top: 30px
}

@media (min-width: 48em) {
    .tool-mv {
        margin-top: 20px
    }
}

.l-with-local-nav .tool-mv {
    margin-right: 15px;
    margin-left: 15px
}

@media (min-width: 48em) {
    .l-with-local-nav .tool-mv {
        margin-right: 0;
        margin-left: 0
    }
}

.tool-mv-bg {
    width: 100%
}

@media (min-width: 48em) {
    .tool-mv-bg {
        height: 258px
    }
}

.tool-mv-bg .image, .tool-mv-bg .image-picture {
    width: 100%;
    height: 100%
}

@media (min-width: 48em) {
    .tool-mv-bg img {
        object-fit: cover;
        object-position: top right;
        width: 100%;
        height: 100%
    }
}

.tool-mv-contents {
    margin-top: 30px
}

@media (min-width: 48em) {
    .tool-mv-contents {
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        top: 20px;
        left: 20px;
        margin-top: 0;
        padding: 25px;
        width: 420px;
        height: calc(100% - 40px);
        background-color: #fff;
        border: 1px solid rgba(0, 0, 0, .1);
        border-radius: 10px
    }
}

.tool-mv-text {
    font-size: 0.875rem;
    display: flex;
    align-items: center
}

.tool-mv-text > img {
    margin-right: 10px
}

.tool-mv-labels {
    display: flex;
    flex-direction: column
}

.tool-app-box {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

@media (max-width: 47.99em) {
    .tool-app-box {
        align-items: center;
        flex-direction: column
    }
}

@media (min-width: 48em) {
    .tool-app-box {
        gap: 20px
    }
}

.tool-app-box > .list {
    flex: 1 1 0
}

@media (max-width: 47.99em) {
    .tool-app-list {
        display: flex;
        justify-content: center
    }

    .tool-app-list > * {
        margin: 0 5px
    }
}

@media (min-width: 48em) {
    .tool-app-list {
        display: grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 10px;
        flex-shrink: 0
    }
}

.tool-accordion .accordion-box-title {
    position: relative;
    padding: 10px 20px 10px 0
}

.tool-accordion.is-open .accordion-box-title {
    padding: 10px 20px 15px 0
}

.tool-accordion .accordion-box-trigger {
    display: block
}

.tool-accordion .accordion-box-contents {
    display: none
}

.keyword-search {
    padding: 50px 0;
    z-index: 3
}

.live-suggest-container {
    position: relative;
    z-index: 3
}

.live-suggest-container .live-suggest {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    display: flex;
    flex-direction: column
}

.live-suggest-container .live-suggest li + li {
    border-top: solid 1px #fff
}

.live-suggest-container .live-suggest li a {
    display: block;
    padding: 5px 10px;
    color: #fff;
    background-color: rgba(100, 100, 100, .9);
    transition: background-color .15s ease-out
}

.live-suggest-container .live-suggest li a:hover {
    background-color: rgba(100, 100, 100, .8)
}

@media (max-width: 47.99em) {
    .live-suggest-container .live-suggest li a:hover {
        background-color: rgba(100, 100, 100, .9)
    }
}

.keyword-search_form {
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 5px;
    overflow: hidden;
    width: 100%;
    background: #fff;
    display: flex
}

.keyword-search_input {
    width: calc(100% - 38px);
    display: flex;
    padding: 8px 10px;
    height: 45px;
    line-height: 45px
}

.keyword-search_button {
    position: relative;
    width: 38px;
    cursor: pointer
}

.keyword-search_button > span {
    font-size: 0
}

.keyword-search_button::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -10px;
    background: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.svg) no-repeat
}

.reel.reel-sp-only.keyword-search_slider {
    overflow: visible
}

@media (max-width: 47.99em) {
    .reel.reel-sp-only.keyword-search_slider {
        overflow: hidden
    }
}

@media (min-width: 48em) {
    .reel.reel-sp-only.keyword-search_slider .reel-container .reel-items {
        justify-content: flex-start
    }
}

.reel.reel-sp-only.keyword-search_slider .swiper-slide {
    height: auto !important
}

.reel.reel-sp-only.keyword-search_slider .reel-card-link {
    display: grid;
    grid-template-rows:auto 1fr;
    gap: 20px;
    height: 100%
}

@media (max-width: 47.99em) {
    .reel.reel-sp-only.keyword-search_slider .reel-card-link {
        gap: 10px
    }
}

.reel.reel-sp-only.keyword-search_slider .reel-card-link .reel-card-title {
    margin-bottom: 0
}

.reel.reel-sp-only.keyword-search_slider .reel-card-link .reel-card-img {
    display: flex;
    align-items: center;
    justify-content: center
}

.reel.reel-sp-only.keyword-search_slider .reel-card-link .reel-card-img img {
    flex: 0 0 auto
}

.keyword-search_filters_bloc {
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
    border: none;
    box-shadow: none;
    padding: 0
}

.keyword-search_filters_title {
    display: block;
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 20px;
    padding: 0
}

.keyword-search_filters {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 20px 0
}

.keyword-search_filter {
    display: grid;
    grid-template-columns:130px 1fr;
    gap: 0 20px
}

.keyword-search_filter .filter-button {
    appearance: none;
    -webkit-appearance: none
}

.keyword-search_filter .filter-button:not(.is-active) {
    transition: opacity .15s ease-out
}

.keyword-search_filter .filter-button:not(.is-active):hover {
    opacity: .5
}

@media (max-width: 47.99em) {
    .keyword-search_filter .filter-button:not(.is-active):hover {
        opacity: 1
    }
}

.keyword-search_filter .filter-button.is-active {
    pointer-events: none;
    opacity: 1 !important;
    transition: none
}

.keyword-search_filter_title {
    font-weight: bold;
    align-self: center
}

.highlighted {
    background: rgba(0, 150, 130, .2)
}

.keyword-search_results {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    border-top: solid 1px #d8d8d8
}

.keyword-search_results > li {
    display: grid;
    grid-template-columns:280px 1fr;
    gap: 0 20px;
    padding: 30px 0;
    border-bottom: dotted 1px #a7a7a7
}

.keyword-search_results-desc {
    display: flex;
    flex-direction: column;
    gap: 15px 0
}

.keyword-search_results-title {
    margin-bottom: 5px
}

.keyword-search_results-text {
    display: -webkit-box;
    max-width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3
}

@media (max-width: 47.99em) {
    .keyword-search_filters_bloc {
        border-radius: 10px;
        background: #fff;
        border: solid 1px rgba(0, 0, 0, .1);
        box-shadow: 0 2px 2px rgba(0, 0, 0, .16);
        padding: 20px 15px
    }

    .keyword-search_filters_title {
        margin-bottom: 0
    }

    .accordion-box.is-open .accordion-box-title.keyword-search_filters_title {
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 20px
    }

    .keyword-search_filter {
        display: flex;
        flex-direction: column;
        gap: 0 12px
    }

    .keyword-search_filter_title {
        align-self: flex-start;
        padding-bottom: 5px
    }

    .filter-list {
        display: grid;
        grid-template-columns:1fr 1fr;
        gap: 10px
    }

    .keyword-search_results > li {
        display: block
    }

    .keyword-search_results-img {
        display: none
    }
}

.u-col-span-2 {
    grid-column: span 2 / span 2
}

.u-mx-auto {
    margin-left: auto;
    margin-right: auto
}

.u-mx-\[15px\] {
    margin-left: 15px;
    margin-right: 15px
}

.u-ml-\[5px\] {
    margin-left: 5px
}

.u-mt-\[20px\] {
    margin-top: 20px
}

.u-ml-\[23px\] {
    margin-left: 23px
}

.u-mt-\[30px\] {
    margin-top: 30px
}

.u-mt-\[26px\] {
    margin-top: 26px
}

.u-mt-\[10px\] {
    margin-top: 10px
}

.u-mt-\[35px\] {
    margin-top: 35px
}

.u-mt-\[40px\] {
    margin-top: 40px
}

.u-mt-\[50px\] {
    margin-top: 50px
}

.u-mt-\[15px\] {
    margin-top: 15px
}

.u-ml-auto {
    margin-left: auto
}

.u-block {
    display: block
}

.u-inline-block {
    display: inline-block
}

.u-flex {
    display: flex
}

.u-hidden {
    display: none
}

.\!u-h-auto {
    height: auto !important
}

.u-h-full {
    height: 100%
}

.u-min-h-\[3em\] {
    min-height: 3em
}

.u-w-full {
    width: 100%
}

.u-w-\[570px\] {
    width: 570px
}

.\!u-max-w-\[340px\] {
    max-width: 340px !important
}

.u-max-w-\[500px\] {
    max-width: 500px
}

.u-max-w-\[560px\] {
    max-width: 560px
}

.u-flex-auto {
    flex: 1 1 auto
}

.u-table-fixed {
    table-layout: fixed
}

.u-flex-col {
    flex-direction: column
}

.u-flex-wrap {
    flex-wrap: wrap
}

.u-items-center {
    align-items: center
}

.u-justify-center {
    justify-content: center
}

.\!u-justify-center {
    justify-content: center !important
}

.u-gap-8 {
    gap: 2rem
}

.u-gap-\[10px\] {
    gap: 10px
}

.u-gap-\[20px\] {
    gap: 20px
}

.u-p-0 {
    padding: 0px
}

.u-py-\[30px\] {
    padding-top: 30px;
    padding-bottom: 30px
}

.u-px-\[15px\] {
    padding-left: 15px;
    padding-right: 15px
}

.u-py-\[40px\] {
    padding-top: 40px;
    padding-bottom: 40px
}

.\!u-py-\[40px\] {
    padding-top: 40px !important;
    padding-bottom: 40px !important
}

.u-pb-\[50px\] {
    padding-bottom: 50px
}

.u-pb-0 {
    padding-bottom: 0px
}

.u-pt-\[30px\] {
    padding-top: 30px
}

.\!u-pt-\[50px\] {
    padding-top: 50px !important
}

.u-pb-\[20px\] {
    padding-bottom: 20px
}

.u-text-left {
    text-align: left
}

.u-text-center {
    text-align: center
}

.\!u-text-center {
    text-align: center !important
}

.u-text-right {
    text-align: right
}

.u-text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem
}

.u-text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem
}

.u-text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem
}

.u-font-normal {
    font-weight: 400
}

.u-underline {
    text-decoration-line: underline
}

.u-text-sm {
    font-size: 0.75rem !important
}

.u-text-md {
    font-size: 0.875rem !important
}

.u-text-lg {
    font-size: 1rem !important
}

.u-text-xl {
    font-size: 1.125rem !important
}

.u-text-xxl {
    font-size: 1.5rem !important
}

.u-mt0 {
    margin-top: 0 !important
}

.u-mt5 {
    margin-top: 5px !important
}

.u-mt10 {
    margin-top: 10px !important
}

.u-mt15 {
    margin-top: 15px !important
}

.u-mt20 {
    margin-top: 20px !important
}

.u-mt25 {
    margin-top: 25px !important
}

.u-mt30 {
    margin-top: 30px !important
}

.u-mt35 {
    margin-top: 35px !important
}

.u-mt40 {
    margin-top: 40px !important
}

.u-mt45 {
    margin-top: 45px !important
}

.u-mt50 {
    margin-top: 50px !important
}

.u-mb0 {
    margin-bottom: 0 !important
}

.u-mb5 {
    margin-bottom: 5px !important
}

.u-mb10 {
    margin-bottom: 10px !important
}

.u-mb15 {
    margin-bottom: 15px !important
}

.u-mb20 {
    margin-bottom: 20px !important
}

.u-mb25 {
    margin-bottom: 25px !important
}

.u-mb30 {
    margin-bottom: 30px !important
}

.u-mb35 {
    margin-bottom: 35px !important
}

.u-mb40 {
    margin-bottom: 40px !important
}

.u-mb45 {
    margin-bottom: 45px !important
}

.u-mb50 {
    margin-bottom: 50px !important
}

.u-pt0 {
    padding-top: 0 !important
}

.u-pt5 {
    padding-top: 5px !important
}

.u-pt10 {
    padding-top: 10px !important
}

.u-pt15 {
    padding-top: 15px !important
}

.u-pt20 {
    padding-top: 20px !important
}

.u-pt25 {
    padding-top: 25px !important
}

.u-pt30 {
    padding-top: 30px !important
}

.u-pt35 {
    padding-top: 35px !important
}

.u-pt40 {
    padding-top: 40px !important
}

.u-pt45 {
    padding-top: 45px !important
}

.u-pt50 {
    padding-top: 50px !important
}

.u-pb0 {
    padding-bottom: 0 !important
}

.u-pb5 {
    padding-bottom: 5px !important
}

.u-pb10 {
    padding-bottom: 10px !important
}

.u-pb15 {
    padding-bottom: 15px !important
}

.u-pb20 {
    padding-bottom: 20px !important
}

.u-pb25 {
    padding-bottom: 25px !important
}

.u-pb30 {
    padding-bottom: 30px !important
}

.u-pb35 {
    padding-bottom: 35px !important
}

.u-pb40 {
    padding-bottom: 40px !important
}

.u-pb45 {
    padding-bottom: 45px !important
}

.u-pb50 {
    padding-bottom: 50px !important
}

.u-text-pcl-spc {
    text-align: center !important
}

@media (min-width: 48em) {
    .u-text-pcl-spc {
        text-align: left !important
    }
}

.u-text-pcl-spr {
    text-align: right !important
}

@media (min-width: 48em) {
    .u-text-pcl-spr {
        text-align: left !important
    }
}

.u-text-pcc-spl {
    text-align: left !important
}

@media (min-width: 48em) {
    .u-text-pcc-spl {
        text-align: center !important
    }
}

.u-text-pcc-spr {
    text-align: right !important
}

@media (min-width: 48em) {
    .u-text-pcc-spr {
        text-align: center !important
    }
}

.u-text-pcr-spl {
    text-align: left !important
}

@media (min-width: 48em) {
    .u-text-pcr-spl {
        text-align: right !important
    }
}

.u-text-pcr-spc {
    text-align: center !important
}

@media (min-width: 48em) {
    .u-text-pcr-spc {
        text-align: right !important
    }
}

.u-v-align-top {
    text-align: left;
    vertical-align: top
}

.u-v-align-middle {
    text-align: left;
    vertical-align: middle
}

.u-v-align-bottom {
    text-align: left;
    vertical-align: bottom
}

.u-v-align-center {
    text-align: center;
    vertical-align: middle
}

@media (max-width: 47.99em) {
    .u-v-align-top-sp {
        vertical-align: top
    }

    .u-v-align-middle-sp {
        vertical-align: middle
    }

    .u-v-align-bottom-sp {
        vertical-align: bottom
    }
}

.u-width-1 {
    width: 1% !important
}

.u-width-2 {
    width: 2% !important
}

.u-width-3 {
    width: 3% !important
}

.u-width-4 {
    width: 4% !important
}

.u-width-5 {
    width: 5% !important
}

.u-width-6 {
    width: 6% !important
}

.u-width-7 {
    width: 7% !important
}

.u-width-8 {
    width: 8% !important
}

.u-width-9 {
    width: 9% !important
}

.u-width-10 {
    width: 10% !important
}

.u-width-11 {
    width: 11% !important
}

.u-width-12 {
    width: 12% !important
}

.u-width-13 {
    width: 13% !important
}

.u-width-14 {
    width: 14% !important
}

.u-width-15 {
    width: 15% !important
}

.u-width-16 {
    width: 16% !important
}

.u-width-17 {
    width: 17% !important
}

.u-width-18 {
    width: 18% !important
}

.u-width-19 {
    width: 19% !important
}

.u-width-20 {
    width: 20% !important
}

.u-width-21 {
    width: 21% !important
}

.u-width-22 {
    width: 22% !important
}

.u-width-23 {
    width: 23% !important
}

.u-width-24 {
    width: 24% !important
}

.u-width-25 {
    width: 25% !important
}

.u-width-26 {
    width: 26% !important
}

.u-width-27 {
    width: 27% !important
}

.u-width-28 {
    width: 28% !important
}

.u-width-29 {
    width: 29% !important
}

.u-width-30 {
    width: 30% !important
}

.u-width-31 {
    width: 31% !important
}

.u-width-32 {
    width: 32% !important
}

.u-width-33 {
    width: 33% !important
}

.u-width-34 {
    width: 34% !important
}

.u-width-35 {
    width: 35% !important
}

.u-width-36 {
    width: 36% !important
}

.u-width-37 {
    width: 37% !important
}

.u-width-38 {
    width: 38% !important
}

.u-width-39 {
    width: 39% !important
}

.u-width-40 {
    width: 40% !important
}

.u-width-41 {
    width: 41% !important
}

.u-width-42 {
    width: 42% !important
}

.u-width-43 {
    width: 43% !important
}

.u-width-44 {
    width: 44% !important
}

.u-width-45 {
    width: 45% !important
}

.u-width-46 {
    width: 46% !important
}

.u-width-47 {
    width: 47% !important
}

.u-width-48 {
    width: 48% !important
}

.u-width-49 {
    width: 49% !important
}

.u-width-50 {
    width: 50% !important
}

.u-width-51 {
    width: 51% !important
}

.u-width-52 {
    width: 52% !important
}

.u-width-53 {
    width: 53% !important
}

.u-width-54 {
    width: 54% !important
}

.u-width-55 {
    width: 55% !important
}

.u-width-56 {
    width: 56% !important
}

.u-width-57 {
    width: 57% !important
}

.u-width-58 {
    width: 58% !important
}

.u-width-59 {
    width: 59% !important
}

.u-width-60 {
    width: 60% !important
}

.u-width-61 {
    width: 61% !important
}

.u-width-62 {
    width: 62% !important
}

.u-width-63 {
    width: 63% !important
}

.u-width-64 {
    width: 64% !important
}

.u-width-65 {
    width: 65% !important
}

.u-width-66 {
    width: 66% !important
}

.u-width-67 {
    width: 67% !important
}

.u-width-68 {
    width: 68% !important
}

.u-width-69 {
    width: 69% !important
}

.u-width-70 {
    width: 70% !important
}

.u-width-71 {
    width: 71% !important
}

.u-width-72 {
    width: 72% !important
}

.u-width-73 {
    width: 73% !important
}

.u-width-74 {
    width: 74% !important
}

.u-width-75 {
    width: 75% !important
}

.u-width-76 {
    width: 76% !important
}

.u-width-77 {
    width: 77% !important
}

.u-width-78 {
    width: 78% !important
}

.u-width-79 {
    width: 79% !important
}

.u-width-80 {
    width: 80% !important
}

.u-width-81 {
    width: 81% !important
}

.u-width-82 {
    width: 82% !important
}

.u-width-83 {
    width: 83% !important
}

.u-width-84 {
    width: 84% !important
}

.u-width-85 {
    width: 85% !important
}

.u-width-86 {
    width: 86% !important
}

.u-width-87 {
    width: 87% !important
}

.u-width-88 {
    width: 88% !important
}

.u-width-89 {
    width: 89% !important
}

.u-width-90 {
    width: 90% !important
}

.u-width-91 {
    width: 91% !important
}

.u-width-92 {
    width: 92% !important
}

.u-width-93 {
    width: 93% !important
}

.u-width-94 {
    width: 94% !important
}

.u-width-95 {
    width: 95% !important
}

.u-width-96 {
    width: 96% !important
}

.u-width-97 {
    width: 97% !important
}

.u-width-98 {
    width: 98% !important
}

.u-width-99 {
    width: 99% !important
}

.u-width-100 {
    width: 100% !important
}

.u-width-1-third {
    width: 33.3333333333% !important
}

@media (max-width: 47.99em) {
    .u-width-minus-30-sp {
        width: calc(100% - 30px)
    }
}

.u-sp-hidden {
    display: none
}

@media (min-width: 48em) {
    .u-sp-hidden {
        display: block
    }
}

.u-pc-hidden {
    display: block
}

@media (min-width: 48em) {
    .u-pc-hidden {
        display: none
    }
}

.inner {
    background-color: #fff;
    padding: 15px;
    background-image: url(https://puyzee.com/static/templ/1708564837/03/images/icon_menu.gif);
    position: relative
}

@media (min-width: 48em) {
    .inner {
        padding: 30px 29% 30px 30px
    }
}

.inner .header-hero {
    width: 24%;
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -16%
}

@media (max-width: 47.99em) {
    .inner .header-hero {
        width: 50%;
        position: relative;
        right: auto;
        top: auto;
        margin: 0 auto 30px;
        text-align: center
    }

    .inner .text-block {
        width: 100%
    }
}

.inner .text-block hr {
    border: none;
    border-bottom: dotted 2px #005547;
    height: 0px;
    padding: 0;
    margin: 20px 0
}

.inner .head-level2 {
    font-size: 1.75rem
}

.inner .line-yellow {
    background-color: #ffffc4;
    display: inline-block;
    font-weight: 600;
    margin-top: 12px
}

@media (min-width: 768px) {
    .md\:u-order-2 {
        order: 2
    }

    .md\:u-col-span-2 {
        grid-column: span 2 / span 2
    }

    .md\:u-col-span-1 {
        grid-column: span 1 / span 1
    }

    .md\:u-mx-\[30px\] {
        margin-left: 30px;
        margin-right: 30px
    }

    .md\:u-mx-\[5px\] {
        margin-left: 5px;
        margin-right: 5px
    }

    .md\:u-mx-0 {
        margin-left: 0px;
        margin-right: 0px
    }

    .md\:u-mt-0 {
        margin-top: 0px
    }

    .md\:u-mt-\[30px\] {
        margin-top: 30px
    }

    .md\:u-mt-\[50px\] {
        margin-top: 50px
    }

    .md\:\!u-mt-0 {
        margin-top: 0px !important
    }

    .md\:\!u-mt-\[0\] {
        margin-top: 0 !important
    }

    .md\:u-mt-\[40px\] {
        margin-top: 40px
    }

    .md\:u-ml-\[5px\] {
        margin-left: 5px
    }

    .md\:u-block {
        display: block
    }

    .md\:u-inline-block {
        display: inline-block
    }

    .md\:u-hidden {
        display: none
    }

    .md\:u-w-auto {
        width: auto
    }

    .md\:u-grow-0 {
        flex-grow: 0
    }

    .md\:u-basis-1\/2 {
        flex-basis: 50%
    }

    .md\:u-items-center {
        align-items: center
    }

    .md\:u-gap-5 {
        gap: 1.25rem
    }

    .md\:u-gap-\[20px\] {
        gap: 20px
    }

    .md\:u-px-0 {
        padding-left: 0px;
        padding-right: 0px
    }

    .md\:u-py-\[60px\] {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .md\:u-pt-\[10px\] {
        padding-top: 10px
    }

    .md\:u-pb-\[40px\] {
        padding-bottom: 40px
    }

    .md\:u-pt-\[35px\] {
        padding-top: 35px
    }

    .md\:u-pb-\[50px\] {
        padding-bottom: 50px
    }

    .md\:u-pr-\[20px\] {
        padding-right: 20px
    }

    .md\:u-text-\[1\.25rem\] {
        font-size: 1.25rem
    }
}

@font-face {
    font-family: swiper-icons;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.swiper-vertical > .swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    box-sizing: content-box
}

.swiper-android .swiper-slide, .swiper-wrapper {
    -webkit-transform: translate3d(0px, 0, 0);
    transform: translate3d(0px, 0, 0)
}

.swiper-pointer-events {
    touch-action: pan-y
}

.swiper-pointer-events.swiper-vertical {
    touch-action: pan-x
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-autoheight, .swiper-autoheight .swiper-slide {
    height: auto
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: height, -webkit-transform;
    transition-property: transform, height;
    transition-property: transform, height, -webkit-transform
}

.swiper-backface-hidden .swiper-slide {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-3d, .swiper-3d.swiper-css-mode .swiper-wrapper {
    -webkit-perspective: 1200px;
    perspective: 1200px
}

.swiper-3d .swiper-cube-shadow, .swiper-3d .swiper-slide, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-wrapper {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-3d .swiper-slide-shadow {
    background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))
}

.swiper-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
    -ms-scroll-snap-type: y mandatory;
    scroll-snap-type: y mandatory
}

.swiper-centered > .swiper-wrapper::before {
    content: "";
    flex-shrink: 0;
    order: 9999
}

.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
    -webkit-margin-start: var(--swiper-centered-offset-before);
    margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper-centered-offset-after)
}

.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
    -webkit-margin-before: var(--swiper-centered-offset-before);
    margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-vertical > .swiper-wrapper::before {
    width: 100%;
    min-width: 1px;
    height: var(--swiper-centered-offset-after)
}

.swiper-centered > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: center center;
    scroll-snap-stop: always
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-pagination-disabled > .swiper-pagination, .swiper-pagination.swiper-pagination-disabled {
    display: none !important
}

.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transform: scale(0.33);
    transform: scale(0.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    -webkit-transform: scale(0.66);
    transform: scale(0.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    -webkit-transform: scale(0.33);
    transform: scale(0.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    -webkit-transform: scale(0.66);
    transform: scale(0.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    -webkit-transform: scale(0.33);
    transform: scale(0.33)
}

.swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
    display: inline-block;
    border-radius: 50%;
    background: var(--swiper-pagination-bullet-inactive-color, #000);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2)
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet:only-child {
    display: none !important
}

.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0px, -50%, 0);
    transform: translate3d(0px, -50%, 0)
}

.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
    display: block
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 8px
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: .2s transform, .2s top
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px)
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s transform, .2s left
}

.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s transform, .2s right
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: left top;
    transform-origin: left top
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    -webkit-transform-origin: right top;
    transform-origin: right top
}

.swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-vertical, .swiper-vertical > .swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-lock {
    display: none
}





.sec07 {
    margin-bottom: 15px
}

.sec07 .titleBox {
    margin-bottom: 120px;
    min-height: 310px;
    display: flex;
    align-items: center;
    position: relative;
    background: url("https://xiepangshou2.top/c/static/image/sec07_bg01.jpg") no-repeat center center/cover
}

.sec07 .titleBox .headLine01 {
    margin-top: -25px;
    color: #fff
}

.sec07 .titleBox .en {
    margin-bottom: 10px
}

.sec07 .titleBox::after {
    margin-left: -40px;
    display: inline-block;
    position: absolute;
    bottom: -80px;
    left: 50%;
    border: 40px solid transparent;
    border-top-color: #071b3c;
    content: ""
}

.sec07 li {
    display: flex;
    justify-content: space-between
}

.sec07 li:not(:last-child) {
    margin-bottom: 60px;
    padding-bottom: 65px;
    background: url("https://puyzee.com/static/templ/1708564837/03/image/sec07_line.jpg") repeat-x bottom left
}

.sec07 li:nth-child(2n-1) {
    flex-direction: row-reverse;
}

.sec07 li .phoBox {
    width: 390px
}
.sec07 li .phoBox img{
    width: 80%
}

.sec07 li .txtBox {
    margin-top: -6px
}

.sec07 li:nth-child(1) .txtBox {
    width: 700px;
}

.sec07 li:nth-child(2) .txtBox {
    width: 760px;
}

.sec07 li:nth-child(3) .txtBox {
    width: 700px;
}

.sec07 li .pho {
    margin-bottom: 37px
}

.sec07 li p {
    letter-spacing: .06em
}

.sec07 li p:not(:last-child) {
    margin-bottom: 10px
}

.sec07 li .ttl {
    margin-bottom: 33px!important;
    display: flex;
    align-items: center;
    color: #019682;
    font-size: 1.6rem;
    letter-spacing: .08em;
    line-height: 1.28
}

.sec07 li .ttl-2 {
    margin-bottom: 33px!important;
    display: flex;
    align-items: center;
    color: #019682;
    font-size: 1.6rem;
    letter-spacing: .08em;
    line-height: 1.28
}

.sec07 li .ttl span {
    margin-right: 15px;
    display: flex;
    align-items: center
}

.sec07 li .ttl-2 span {
    margin-right: 15px;
    display: flex;
    align-items: center
}

.sec07 li .text {
    margin-bottom: 3px!important;
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: .06em
}

.sec07 li .note {
    font-size: 1.2rem;
    letter-spacing: .06em;
    line-height: 1.5
}


@media (max-width: 767px){
    .pc{display: block!important;}
    .sec07 {
        margin-bottom: -15px
    }

    .sec07 .titleBox .content {
        width: 100%
    }

    .sec07 .titleBox {
        margin-bottom: 50px;
        min-height: 175px;
        background: url("https://xiepangshou2.top/c/static/image/sp_sec07_bg01.jpg") no-repeat center center/cover
    }

    .sec07 .titleBox .headLine01 {
        margin-top: -10px
    }

    .sec07 .titleBox .en {
        margin-bottom: 0
    }

    .sec07 .titleBox::after {
        margin-left: -20px;
        bottom: -40px;
        border: 20px solid transparent;
        border-top-color: #071b3c
    }

    .sec07 li {
        display: block
    }

    .sec07 li:not(:last-child) {
        margin-bottom: 30px;
        padding-bottom: 33px;
        background: url("https://puyzee.com/static/templ/1708564837/03/image/sec07_line.jpg") repeat-x bottom left/7px auto
    }

    .sec07 li .phoBox {
        margin-bottom: 20px;
        width: auto
    }

    .sec07 li .phoBox img {
        width: 100%
    }

    .sec07 li .txtBox {
        margin-top: 0;
        padding: 0 10px
    }

    .sec07 li:nth-child(1) .txtBox {
        width: auto;
        background: url("https://xiepangshou2.top/c/static/image/sec07_bg02.png") no-repeat right 18px top 30px/97px auto
    }

    .sec07 li:nth-child(2) .txtBox {
        margin-right: 0;
        width: auto;
        background: url("https://xiepangshou2.top/c/static/image/sec07_bg03.png") no-repeat right 42px top 60px/117px auto
    }

    .sec07 li:nth-child(3) .txtBox {
        width: auto;
        background: url("https://xiepangshou2.top/c/static/image/sec07_bg04.png") no-repeat right 70px top/95px auto
    }

    .sec07 li .pho {
        margin-bottom: 20px;
        width: 305px
    }

    .sec07 li:nth-child(2) .pho {
        width: 305px
    }

    .sec07 li:nth-child(3) .pho {
        width: 305px
    }

    .sec07 li p {
        letter-spacing: .08em;
        line-height: 1.4
    }

    .sec07 li p:not(:last-child) {
        margin-bottom: 10px
    }

    .sec07 li .ttl {
        margin-bottom: 15px!important;
        font-size: 1.2rem
    }

    .sec07 li .ttl span {
        margin-right: 10px;
        width: 52px
    }

    .sec07 li .ttl-2 {
        margin-bottom: 15px!important;
        font-size: 1.4rem
    }

    .sec07 li .ttl-2 span {
        margin-right: 10px;
        width: 52px
    }

    .sec07 li .text {
        margin-bottom: 13px!important;
        font-size: 1.4rem;
        line-height: 1.33
    }

    .sec07 li .note {
        font-size: .8rem;
        line-height: 1.38
    }

    .inner {
        padding: 16px 32px;
        margin-bottom: 16px;
    }

    .section-h h1{font-size: 30px!important;}
}


.inner2{
    /*border: solid 1px rgba(189, 189, 189, 1.00);*/
    padding: 16px;
    margin-bottom: 8px;}