@import "https://fonts.googleapis.com/css2?family=BIZ+UDPGothic:wght@400;700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";

:root {
    --ff-jp: "BIZ UDPGothic", sans-serif;
    --ff-en: "BIZ UDPGothic", sans-serif;
    --ff-date: "Inter", sans-serif;
    --color-base: #000;
    --color-primary: #0F1B3E;
    --color-primary-light: #313e73;
    --color-premium: #caa846;
    --color-primary-hover: #57628c;
    --color-premium-light: #dac27d;
    --color-blue: #014099;
    --color-light: #444;
    --color-fav: #7B8CD5;
    --color-gold: #caa846;
    --color-silver: #9c9c9c;
    --color-bronze: #7e6210;
    --color-red: #D30000;
    --color-light-blue: #4A6CCB;
    --border-light: #dcdcdc;
    --border-dark: #bfbfbf;
    --border-darken: #aaa;
    --bg-light: #f0f0f0;
    --bg-primary-light: #4a546f;
    --bg-blue-light: #F2F5F9;
    --lineHeight-xl: 2.5;
    --lineHeight-lg: 2;
    --lineHeight-md: 1.75;
    --lineHeight-sm: 1.3333;
    --fw-black: 900;
    --fw-bold: 700;
    --fw-semibold: 600;
    --fw-medium: 500;
    --fw-normal: 400;
    --fw-light: 300;
    --leading-trim: calc((1em - 1lh) / 2);
    --width-default: 1200px;
    --mg-2xl: 7.5rem;
    --mg-xl: 5rem;
    --mg-lg: 4rem;
    --mg-md: 2.5rem;
    --mg-sm: 1.5rem;
    --mg-xs: 1rem;
    --mg-2xs: 0.5rem;
    --pad: 40px
}

@media screen and (max-width: 992px) {
    :root {
        --pad: 24px;
        --mg-2xl: 6rem;
        --mg-xl: 4rem
    }
}

@media screen and (max-width: 767px) {
    :root {
        --pad: 20px;
        --lineHeight-xl: 2;
        --mg-2xl: 5rem;
        --mg-xl: 3.5rem
    }
}

*,
*::before,
*::after {
    box-sizing: border-box
}

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
dialog,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
menu,
time,
mark,
audio,
video,
source {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: rgba(0, 0, 0, 0)
}

body {
    line-height: 1;
    color: #171717;
}

article,
aside,
dialog,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
menu,
main {
    display: block
}

ul,
ol {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote::before,
blockquote::after,
q::before,
q::after {
    content: "";
    content: none
}

ins {
    background-color: #ff9;
    text-decoration: none
}

mark {
    background-color: #ff9;
    font-style: italic;
    font-weight: 600
}

del {
    text-decoration: line-through
}

abbr[title],
dfn[title] {
    border-bottom: 1px dotted #000;
    cursor: help
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

@media screen and (max-width: 1279px) {
    table {
        border-spacing: 0
    }
}

@media screen and (max-width: 992px) {
    table {
        border-spacing: 0
    }
}

@media screen and (max-width: 767px) {
    table {
        border-spacing: 0
    }
}

th {
    text-align: left
}

input,
select {
    vertical-align: middle
}

* {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0
}

::-moz-selection {
    color: #fff;
    background: #87b1da
}

::selection {
    color: #fff;
    background: #87b1da
}

:root {
    --scroll-bar: 0px
}

b,
strong {
    font-weight: 700;
    font-weight: var(--fw-bold)
}

.a-article b,
.a-article strong {
    font-weight: 400;
    font-weight: var(--fw-normal);
    background: linear-gradient(to bottom, transparent 0%, transparent 45%, #f7fa9b 45.1%, #f7fa9b 90%, transparent 90.1%)
}

html {
    color: #171717;
    font-size: 16px;
    font-weight: var(--normal);
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    width: 100%;
    height: 100%
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "pkna" 1;
    font-feature-settings: "palt";
    overflow-wrap: anywhere;
    word-break: normal;
    line-break: strict;
    width: 100%;
    line-height: 1.75;
    line-height: var(--lineHeight-md);
    letter-spacing: 0.05em;
}

body.preload {
    animation: none !important
}

a {
    color: #171717;
    text-decoration: underline
}

a:hover {
    text-decoration: none
}

a:focus {
    outline: revert
}

a:not([class])[href^="tel:"],
a[class^=u-][href^="tel:"],
a[class^="-"][href^="tel:"],
a[class^=wp-][href^="tel:"] {
    text-decoration: none
}

h2:not([class]),
h2[class^=u-],
h2[class^="-"],
h2[class^=wp-] {
    font-size: 1.625rem;
    font-weight: 700;
    font-weight: var(--fw-bold);
    line-height: 1.5;
    background: #f0f0f0;
    background: var(--bg-light);
    margin-top: 64px;
    margin-bottom: 32px;
    padding: 18px 24px
}

@media screen and (max-width: 767px) {

    h2:not([class]),
    h2[class^=u-],
    h2[class^="-"],
    h2[class^=wp-] {
        font-size: 1.25rem;
        padding: 16px 20px;
        margin-top: 40px;
        margin-bottom: 24px
    }
}

h3:not([class]),
h3[class^=u-],
h3[class^="-"],
h3[class^=wp-] {
    position: relative;
    font-size: 1.3125rem;
    font-weight: 700;
    font-weight: var(--fw-bold);
    margin-top: calc(calc((1em - 1lh) / 2) + 56px);
    margin-top: calc(var(--leading-trim) + 56px);
    margin-bottom: 40px;
    padding-bottom: calc(calc((1em - 1lh) / 2) + 20px);
    padding-bottom: calc(var(--leading-trim) + 20px);
    border-bottom: 1px solid rgba(1, 64, 153, .1)
}

@media screen and (max-width: 767px) {

    h3:not([class]),
    h3[class^=u-],
    h3[class^="-"],
    h3[class^=wp-] {
        font-size: 1.125rem;
        margin-top: calc(calc((1em - 1lh) / 2) + 32px);
        margin-top: calc(var(--leading-trim) + 32px);
        padding-bottom: calc(calc((1em - 1lh) / 2) + 16px);
        padding-bottom: calc(var(--leading-trim) + 16px);
        margin-bottom: 24px
    }
}

h3:not([class])::before,
h3[class^=u-]::before,
h3[class^="-"]::before,
h3[class^=wp-]::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 60px;
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light)
}

h4:not([class]),
h4[class^=u-],
h4[class^="-"],
h4[class^=wp-] {
    position: relative;
    font-size: 1.125rem;
    font-weight: 700;
    font-weight: var(--fw-bold);
    margin-top: calc(calc((1em - 1lh) / 2) + 56px);
    margin-top: calc(var(--leading-trim) + 56px);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {

    h4:not([class]),
    h4[class^=u-],
    h4[class^="-"],
    h4[class^=wp-] {
        font-size: 1rem;
        margin-top: calc(calc((1em - 1lh) / 2) + 32px);
        margin-top: calc(var(--leading-trim) + 32px);
        margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
        margin-bottom: calc(var(--leading-trim) + 24px)
    }
}

p:not([class]),
p[class^=u-],
p[class^="-"],
p[class^=wp-] {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {

    p:not([class]),
    p[class^=u-],
    p[class^="-"],
    p[class^=wp-] {
        font-size: .875rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 32px);
        margin-bottom: calc(var(--leading-trim) + 32px)
    }
}

ul:not([class]),
ul[class^=u-],
ul[class^="-"],
ul[class^=wp-] {
    line-height: 1.75;
    line-height: var(--lineHeight-md);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {

    ul:not([class]),
    ul[class^=u-],
    ul[class^="-"],
    ul[class^=wp-] {
        font-size: .875rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 32px);
        margin-bottom: calc(var(--leading-trim) + 32px)
    }
}

ul:not([class])>li,
ul[class^=u-]>li,
ul[class^="-"]>li,
ul[class^=wp-]>li {
    position: relative;
    padding-left: 24px
}

ul:not([class])>li:not(:last-child),
ul[class^=u-]>li:not(:last-child),
ul[class^="-"]>li:not(:last-child),
ul[class^=wp-]>li:not(:last-child) {
    margin-bottom: 8px
}

ul:not([class])>li::before,
ul[class^=u-]>li::before,
ul[class^="-"]>li::before,
ul[class^=wp-]>li::before {
    content: "";
    display: block;
    position: absolute;
    top: 11px;
    left: 5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #000;
    background: var(--color-base)
}

@media screen and (max-width: 767px) {

    ul:not([class])>li::before,
    ul[class^=u-]>li::before,
    ul[class^="-"]>li::before,
    ul[class^=wp-]>li::before {
        top: 8px
    }
}

ol:not([class]),
ol[class^=u-],
ol[class^="-"],
ol[class^=wp-] {
    list-style: decimal outside;
    line-height: 1.75;
    line-height: var(--lineHeight-md);
    padding-left: 1.5em;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {

    ol:not([class]),
    ol[class^=u-],
    ol[class^="-"],
    ol[class^=wp-] {
        font-size: .875rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 32px);
        margin-bottom: calc(var(--leading-trim) + 32px)
    }
}

ol:not([class])>li,
ol[class^=u-]>li,
ol[class^="-"]>li,
ol[class^=wp-]>li {
    padding-left: 20px
}

ol:not([class])>li:not(:last-child),
ol[class^=u-]>li:not(:last-child),
ol[class^="-"]>li:not(:last-child),
ol[class^=wp-]>li:not(:last-child) {
    margin-bottom: 8px
}

ol:not([class])>li::marker,
ol[class^=u-]>li::marker,
ol[class^="-"]>li::marker,
ol[class^=wp-]>li::marker {
    color: #313e73;
    color: var(--color-primary-light)
}

dl:not([class]),
dl[class^=u-],
dl[class^="-"],
dl[class^=wp-] {
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

dl:not([class])>dt,
dl[class^=u-]>dt,
dl[class^="-"]>dt,
dl[class^=wp-]>dt {
    font-weight: 700;
    font-weight: var(--fw-bold);
    margin-bottom: 8px
}

dl:not([class])>dd:not(:last-of-type),
dl[class^=u-]>dd:not(:last-of-type),
dl[class^="-"]>dd:not(:last-of-type),
dl[class^=wp-]>dd:not(:last-of-type) {
    margin-bottom: calc(calc((1em - 1lh) / 2) + 1.5rem);
    margin-bottom: calc(var(--leading-trim) + var(--mg-sm))
}

table:not([class]),
table[class^=u-],
table[class^="-"],
table[class^=wp-],
table[class^=has-] {
    width: 100%;
    min-width: 600px;
    border-top: 1px solid #bfbfbf;
    border-top: 1px solid var(--border-dark);
    border-left: 1px solid #bfbfbf;
    border-left: 1px solid var(--border-dark);
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

@media screen and (max-width: 767px) {

    table:not([class]),
    table[class^=u-],
    table[class^="-"],
    table[class^=wp-],
    table[class^=has-] {
        font-size: .875rem
    }
}

table:not([class]) th,
table:not([class]) td,
table[class^=u-] th,
table[class^=u-] td,
table[class^="-"] th,
table[class^="-"] td,
table[class^=wp-] th,
table[class^=wp-] td,
table[class^=has-] th,
table[class^=has-] td {
    padding: 12px 16px;
    border-bottom: 1px solid #bfbfbf;
    border-bottom: 1px solid var(--border-dark);
    border-right: 1px solid #bfbfbf;
    border-right: 1px solid var(--border-dark)
}

table:not([class]) th,
table[class^=u-] th,
table[class^="-"] th,
table[class^=wp-] th,
table[class^=has-] th {
    color: #fff;
    font-weight: 400;
    font-weight: var(--fw-normal);
    background: #0F1B3E;
    background: var(--color-primary)
}

figure:has(img) {
    text-align: center
}

figcaption {
    display: block;
    color: #666;
    font-size: .75rem;
    text-align: left;
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc(calc((1em - 1lh) / 2) + 24px);
    margin-top: calc(var(--leading-trim) + 24px);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

blockquote {
    position: relative;
    margin-top: 40px;
    margin-bottom: 40px;
    padding: 64px;
    background: #f0f0f0;
    background: var(--bg-light)
}

@media screen and (max-width: 767px) {
    blockquote {
        padding: 60px 45px
    }
}

blockquote>:last-child {
    margin-bottom: 0
}

blockquote::before {
    content: "";
    display: block;
    position: absolute;
    top: 14px;
    left: 14px;
    width: 25px;
    height: 20px;
    background: rgba(0, 0, 0, .25);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="9.128" height="7.308" viewBox="0 0 9.128 7.308"><path d="M6.776-17.22c0,1.68.98,2.52,2.128,2.52a1.778,1.778,0,0,0,1.848-1.848A1.717,1.717,0,0,0,9.044-18.34a1.508,1.508,0,0,0-.308.028H8.652c-.084,0-.14-.028-.14-.14v-.056a1.969,1.969,0,0,1,.5-1.12,6.237,6.237,0,0,1,1.232-1.008.7.7,0,0,0,.28-.588,1.174,1.174,0,0,0-.112-.448.822.822,0,0,0-.644-.336.563.563,0,0,0-.364.112,6.059,6.059,0,0,0-1.932,1.932A5.45,5.45,0,0,0,6.776-17.22Zm-5.152,0c0,1.68.98,2.52,2.128,2.52A1.778,1.778,0,0,0,5.6-16.548,1.717,1.717,0,0,0,3.892-18.34a1.508,1.508,0,0,0-.308.028H3.5c-.084,0-.14-.028-.14-.14v-.056a1.969,1.969,0,0,1,.5-1.12A6.237,6.237,0,0,1,5.1-20.636a.7.7,0,0,0,.28-.588,1.174,1.174,0,0,0-.112-.448.822.822,0,0,0-.644-.336.563.563,0,0,0-.364.112,6.059,6.059,0,0,0-1.932,1.932A5.45,5.45,0,0,0,1.624-17.22Z" transform="translate(-1.624 22.008)"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="9.128" height="7.308" viewBox="0 0 9.128 7.308"><path d="M6.776-17.22c0,1.68.98,2.52,2.128,2.52a1.778,1.778,0,0,0,1.848-1.848A1.717,1.717,0,0,0,9.044-18.34a1.508,1.508,0,0,0-.308.028H8.652c-.084,0-.14-.028-.14-.14v-.056a1.969,1.969,0,0,1,.5-1.12,6.237,6.237,0,0,1,1.232-1.008.7.7,0,0,0,.28-.588,1.174,1.174,0,0,0-.112-.448.822.822,0,0,0-.644-.336.563.563,0,0,0-.364.112,6.059,6.059,0,0,0-1.932,1.932A5.45,5.45,0,0,0,6.776-17.22Zm-5.152,0c0,1.68.98,2.52,2.128,2.52A1.778,1.778,0,0,0,5.6-16.548,1.717,1.717,0,0,0,3.892-18.34a1.508,1.508,0,0,0-.308.028H3.5c-.084,0-.14-.028-.14-.14v-.056a1.969,1.969,0,0,1,.5-1.12A6.237,6.237,0,0,1,5.1-20.636a.7.7,0,0,0,.28-.588,1.174,1.174,0,0,0-.112-.448.822.822,0,0,0-.644-.336.563.563,0,0,0-.364.112,6.059,6.059,0,0,0-1.932,1.932A5.45,5.45,0,0,0,1.624-17.22Z" transform="translate(-1.624 22.008)"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-size: cover
}

blockquote::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 14px;
    right: 14px;
    width: 25px;
    height: 20px;
    background: rgba(0, 0, 0, .25);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="9.128" height="7.308" viewBox="0 0 9.128 7.308"><path d="M5.236-19.264c0-1.68-.98-2.52-2.128-2.52A1.778,1.778,0,0,0,1.26-19.936a1.717,1.717,0,0,0,1.708,1.792,1.508,1.508,0,0,0,.308-.028H3.36c.084,0,.14.028.14.14v.056a1.969,1.969,0,0,1-.5,1.12,6.237,6.237,0,0,1-1.232,1.008.7.7,0,0,0-.28.588,1.174,1.174,0,0,0,.112.448.822.822,0,0,0,.644.336.563.563,0,0,0,.364-.112A6.059,6.059,0,0,0,4.536-16.52,5.45,5.45,0,0,0,5.236-19.264Zm5.152,0c0-1.68-.98-2.52-2.128-2.52a1.778,1.778,0,0,0-1.848,1.848A1.717,1.717,0,0,0,8.12-18.144a1.508,1.508,0,0,0,.308-.028h.084c.084,0,.14.028.14.14v.056a1.969,1.969,0,0,1-.5,1.12,6.237,6.237,0,0,1-1.232,1.008.7.7,0,0,0-.28.588,1.174,1.174,0,0,0,.112.448.822.822,0,0,0,.644.336.563.563,0,0,0,.364-.112A6.059,6.059,0,0,0,9.688-16.52,5.45,5.45,0,0,0,10.388-19.264Z" transform="translate(-1.26 21.784)"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="9.128" height="7.308" viewBox="0 0 9.128 7.308"><path d="M5.236-19.264c0-1.68-.98-2.52-2.128-2.52A1.778,1.778,0,0,0,1.26-19.936a1.717,1.717,0,0,0,1.708,1.792,1.508,1.508,0,0,0,.308-.028H3.36c.084,0,.14.028.14.14v.056a1.969,1.969,0,0,1-.5,1.12,6.237,6.237,0,0,1-1.232,1.008.7.7,0,0,0-.28.588,1.174,1.174,0,0,0,.112.448.822.822,0,0,0,.644.336.563.563,0,0,0,.364-.112A6.059,6.059,0,0,0,4.536-16.52,5.45,5.45,0,0,0,5.236-19.264Zm5.152,0c0-1.68-.98-2.52-2.128-2.52a1.778,1.778,0,0,0-1.848,1.848A1.717,1.717,0,0,0,8.12-18.144a1.508,1.508,0,0,0,.308-.028h.084c.084,0,.14.028.14.14v.056a1.969,1.969,0,0,1-.5,1.12,6.237,6.237,0,0,1-1.232,1.008.7.7,0,0,0-.28.588,1.174,1.174,0,0,0,.112.448.822.822,0,0,0,.644.336.563.563,0,0,0,.364-.112A6.059,6.059,0,0,0,9.688-16.52,5.45,5.45,0,0,0,10.388-19.264Z" transform="translate(-1.26 21.784)"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-size: cover
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: top;
    min-height: auto;
    min-width: auto
}

sup {
    font-size: smaller;
    vertical-align: super
}

sub {
    font-size: smaller;
    vertical-align: sub
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--border-gray);
    margin: 7.5rem 0;
    margin: var(--mg-2xl) 0;
    padding: 0
}

hr+* {
    margin-top: 0
}

@keyframes reel {
    0% {
        transform: translateY(0);
        opacity: 1
    }

    75% {
        opacity: 0
    }

    100% {
        transform: translateY(-100%);
        opacity: 0
    }
}

@keyframes reel2 {
    0% {
        transform: translateY(0);
        opacity: 0
    }

    25% {
        opacity: 0
    }

    100% {
        transform: translateY(-100%);
        opacity: 1
    }
}

@keyframes reel-out {
    0% {
        transform: translateY(-100%);
        opacity: 0
    }

    25% {
        opacity: 0
    }

    100% {
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes reel2-out {
    0% {
        transform: translateY(-100%);
        opacity: 1
    }

    75% {
        opacity: 0
    }

    100% {
        transform: translateY(0);
        opacity: 0
    }
}

@keyframes reel-hor {
    0% {
        transform: translateX(0);
        opacity: 1
    }

    75% {
        opacity: 0
    }

    100% {
        transform: translateX(-100%);
        opacity: 0
    }
}

@keyframes reel2-hor {
    0% {
        transform: translateX(0);
        opacity: 0
    }

    25% {
        opacity: 0
    }

    100% {
        transform: translateX(-100%);
        opacity: 1
    }
}

@keyframes reel-hor-out {
    0% {
        transform: translateX(-100%);
        opacity: 0
    }

    25% {
        opacity: 0
    }

    100% {
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes reel2-hor-out {
    0% {
        transform: translateX(-100%);
        opacity: 1
    }

    75% {
        opacity: 0
    }

    100% {
        transform: translateX(0);
        opacity: 0
    }
}

.l-contents {
    max-width: 1200px;
    max-width: var(--width-default);
    margin: 0 auto;
    display: block;
    grid-template-columns: 1fr 28.3333%;
    gap: 0 30px
}

@media screen and (max-width: 992px) {
    .l-contents {
        display: block
    }
}

.l-contents:has(.l-main, .l-sub) {
    display: grid
}

@media screen and (max-width: 992px) {
    .l-contents:has(.l-main, .l-sub) {
        display: block
    }
}

.l-contents>* {
    grid-column: 1/3
}

.l-contents.-single {
    display: block
}

.l-contents.-mypage {
    grid-template-columns: 240px 1fr;
    gap: 0 60px
}

@media screen and (max-width: 1280px) {
    .l-contents.-mypage {
        gap: 0 calc(40px + (60 - 40)*(100vw - 993px)/(1280 - 993))
    }
}

@media screen and (max-width: 992px) {
    .l-contents.-mypage {
        display: block
    }
}

.l-contents.-independent,
.l-contents.-no-header {
    display: block
}

.l-main {
    grid-column: 1/2;
    max-width: 800px;
    margin-top: 30px;
    margin-bottom: 60px
}

@media screen and (max-width: 992px) {
    .l-main {
        grid-column: 1/3;
        max-width: none;
        margin-bottom: 0
    }
}

.l-main--top {
    max-width: 820px;
    margin-block: 20px 0;
}

@media screen and (max-width: 992px) {
    .l-main--top {
        margin-top: 10px;
        max-width: none;
    }
}

.l-contents.-single .l-main {
    max-width: none
}

.l-contents.-mypage .l-main {
    grid-column: 2/3;
    order: 4
}

.l-contents.-independent .l-main,
.l-contents.-no-header .l-main {
    max-width: none
}

@media screen and (max-width: 767px) {
    .l-main:last-child {
        margin-bottom: 40px
    }
}

.l-sub {
    grid-column: 2/3;
    margin-bottom: 60px;
    margin-top: 30px
}

@media screen and (max-width: 992px) {
    .l-sub {
        grid-column: 1/3;
        border-top: 1px solid #ccc;
        padding-top: 56px;
        margin-bottom: 40px
    }
}

@media screen and (max-width: 767px) {
    .l-sub {
        display: block;
        padding-top: 35px;
        margin-inline: -20px;
        padding-inline: 20px;
    }
}

.l-contents.-mypage .l-sub {
    grid-column: 1/2;
    order: 3
}

.l-sub.l-sub.l-sub>:first-child {
    margin-top: 0
}

.l-wrapper {
    padding: 135px 40px 0;
    padding: 135px var(--pad) 0
}

@media screen and (max-width: 992px) {
    .l-wrapper {
        padding-top: 120px
    }
}

@media screen and (max-width: 767px) {
    .l-wrapper {
        padding-top: 100px
    }
}

.c-about {
    padding: 60px 40px;
    background: var(--bg-light);
    margin: 64px -40px 0;
    box-sizing: border-box; 
}

@media screen and (max-width: 767px) {
    .c-about {
        padding: 24px;
        margin: 40px -20px 0;
    }
}

.c-about__inner {
    display: flex;
    align-items: flex-start ;
    gap: 60px;
    max-width: var(--width-default);
    margin: 0 auto
}

@media screen and (max-width: 767px) {
    .c-about__inner {
        display: block
    }
}

.c-about__content {
    display: flex;
    flex-direction: column;
}

.c-about__header {
    display: flex;
    align-items: center;
}

@media screen and (max-width: 767px) {
    .c-about__header {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}

.c-about__title {
    width: 178px;
    height: auto;
    margin-inline: 16px;
}

@media screen and (max-width: 767px) {
    .c-about__title {
        width: 146px;
        margin-inline: 0px;
    }
}

.c-about__title img {
    width: 100%;
    height: auto;
}

.c-about__desc {
    font-size: 14px;
    margin-top: 16px;
    line-height: 1.5;
}

.c-about__link {
    margin-top: 16px;
}

.c-about__link > a {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-size: 20px;
    text-decoration: none;
}

.c-about__link > a::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: #000;
    background: var(--color-base);
    transition: background-color 0.3s;
}

.c-about__link>a .c-icon {
    width: 6px;
    height: 11px
}

.c-about__link > a:hover::after {
    animation: slide-line .4s forwards;
}

.c-about__link-box {
    min-width: 340px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

@media screen and (max-width: 767px) {
    .c-about__link-box {
        min-width: auto;
        margin-top: 16px;
    }
}

.c-about-sns {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    padding: 20px;
    border-radius: 4px;
    transition: transform 0.3s;
}

.c-about-sns:hover {
    transform: scale(1.05);
}

.c-about-contact {
    background-color: #fff;
    padding: 16px;
    grid-column: span 2;
    border-radius: 4px;
}

.c-about-contact__title {
    font-weight: 700;
    line-height: 1.5;
}

.c-about-contact__text {
    font-size: 14px;
    margin-top: 6px;
    line-height: 1.5;
}

.c-about-contact__button-box {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.c-accordion__inner {
    max-height: 98px;
    overflow: hidden;
    transition: max-height .3s ease-out
}

.c-accordion__toggle {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: #fff;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    font-size: .875rem;
    padding: 4px;
    border: 0;
    border-radius: 4px;
    background: #000;
    background: var(--color-base);
    cursor: pointer;
    margin-top: 4px;
    transition: background-color .3s
}

.c-accordion.-button-hide .c-accordion__toggle {
    display: none
}

.c-accordion__toggle:hover {
    background: #313e73;
    background: var(--color-primary-light)
}

.c-author {
    display: flex;
    gap: 50px
}

@media screen and (max-width: 767px) {
    .c-author {
        position: relative;
        display: block
    }
}

.c-author__avatar {
    flex: 0 0 auto;
    width: 120px;
    height: 120px
}

@media screen and (max-width: 767px) {
    .c-author__avatar {
        position: absolute;
        top: 0;
        left: 0;
        width: 90px;
        height: 90px
    }
}

.c-author__avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 50%
}

.c-author__body {
    flex: 1 1 auto
}

.c-author__head {
    margin-bottom: 30px
}

@media screen and (max-width: 767px) {
    .c-author__head {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 90px;
        padding-left: 110px
    }
}

.c-author__name {
    font-size: 1.25rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .c-author__name {
        font-size: 1.125rem
    }
}

.c-author__position {
    font-size: .875rem;
    color: #a3a3a3;
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.c-author__desc {
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .c-author__desc {
        font-size: .875rem;
        line-height: 2;
        line-height: var(--lineHeight-lg)
    }
}

.c-banner {
    margin: 56px 0;
    text-align: center
}

@media screen and (max-width: 767px) {
    .c-banner {
        margin: 40px 0
    }
}

.c-banner>a {
    display: inline-block
}

.c-banner>a img {
    transition: opacity .3s
}

.c-banner>a:hover img {
    opacity: .7
}

.l-sub .c-banner {
    margin: 20px 0
}

.c-basic-title {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 1.5rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 28px);
    margin-bottom: calc(var(--leading-trim) + 28px)
}

@media screen and (max-width: 767px) {
    .c-basic-title {
        font-size: 1.125rem;
        gap: 16px
    }
}

.c-basic-title:not(:first-child) {
    margin-top: calc(calc((1em - 1lh) / 2) + 70px);
    margin-top: calc(var(--leading-trim) + 70px)
}

@media screen and (max-width: 767px) {
    .c-basic-title:not(:first-child) {
        margin-top: calc(calc((1em - 1lh) / 2) + 40px);
        margin-top: calc(var(--leading-trim) + 40px)
    }
}

.c-block.-c {
    text-align: center
}

.c-block.-more {
    text-align: right
}

.top-section__header .c-block.-more {
    margin-left: auto;
}

.c-slider+.c-block {
    margin-top: 20px
}

@media screen and (max-width: 767px) {
    .c-slider+.c-block {
        margin-top: 13px
    }
}

.c-feature .c-block {
    margin-top: 51px
}

@media screen and (max-width: 767px) {
    .c-feature .c-block {
        margin-top: 38px
    }
}

.c-box {
    background: #f0f0f0;
    background: var(--bg-light)
}

.page-section .c-box {
    padding: 20px
}

.c-box.-keyword {
    padding: 20px;
    margin-bottom: 2.5rem;
    margin-bottom: var(--mg-md)
}

.c-brand-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    padding: 32px 10px 24px;
    background: #fff
}

@media screen and (max-width: 767px) {
    .c-brand-card {
        padding: 20px 16px
    }
}

.c-brand-card .c-button {
    margin: auto auto 0
}

.c-brand-card:hover .c-button {
    background-color: #313e73;
    background-color: var(--color-primary-light)
}

.c-brand-card__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 240px;
    aspect-ratio: 240/64;
    margin: 0 auto 24px;
    transition: transform .3s
}

@media screen and (max-width: 992px) {
    .c-brand-card__logo {
        max-width: 160px
    }
}

@media screen and (max-width: 767px) {
    .c-brand-card__logo {
        max-width: 240px;
        margin-bottom: 20px;
    }
    .c-brand-card__logo.-agent {
        margin-bottom: 17px;
    }
}

.c-brand-card__logo__inner {
    width: 100%;
    height: 100%
}

.c-brand-card__logo.-axc .c-brand-card__logo__inner {
    max-height: 52px
}

.c-brand-card__logo.-advisors .c-brand-card__logo__inner {
    max-height: 64px
}

.c-brand-card__logo.-free-consul .c-brand-card__logo__inner {
    max-height: 64px
}

.c-brand-card__logo.-agent .c-brand-card__logo__inner {
	max-height: 64px;
}

.c-brand-card__logo.-solutions .c-brand-card__logo__inner {
	max-height: 67px;
}

.c-brand-card__logo img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.c-brand-card:hover .c-brand-card__logo {
    transform: scale(1.05)
}

.c-brand-card__desc {
    font-size: .9375rem;
    text-align: center;
    line-height: 1.75;
    margin: calc((1em - 1lh) / 2) 0;
    margin: var(--leading-trim) 0
}

@media screen and (max-width: 992px) {
    .c-brand-card__desc {
        font-size: .75rem
    }
}

@media screen and (max-width: 767px) {
    .c-brand-card__desc {
        font-size: .875rem;
        line-height: 1.75;
        line-height: var(--lineHeight-md)
    }
}

.c-brand-card .c-button {
    margin-top: 24px
}

@media screen and (max-width: 767px) {
    .c-brand-card .c-button {
        margin-top: 20px
    }
}

.c-brand {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    padding: 60px 40px;
    padding: 60px var(--pad);
    background: url("../img/common/bg_brand.webp") center center/cover no-repeat
}

@media screen and (max-width: 767px) {
    .c-brand {
        padding-top: 40px;
        padding-bottom: 40px
    }
}

.c-brand__inner {
    max-width: 1200px;
    max-width: var(--width-default);
    margin-left: auto;
    margin-right: auto
}

.c-brand__desc {
    font-size: .875rem;
    color: #fff;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {
    .c-brand__desc {
        margin-bottom: calc(calc((1em - 1lh) / 2) + 30px);
        margin-bottom: calc(var(--leading-trim) + 30px)
    }
}

.c-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    max-width: 240px;
    width: 100%;
    min-height: 40px;
    color: #fff;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    font-weight: 400;
    font-weight: var(--fw-normal);
    font-size: 1rem;
    text-align: center;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    text-decoration: none;
    margin: 0;
    padding: 8px 16px;
    background: #000;
    background: var(--color-base);
    border: 0;
    border-radius: 4px;
    transition: background-color .3s;
    cursor: pointer
}

.c-button::before {
    content: "";
    display: block;
    flex: 0 0 auto;
    width: 7px
}

.c-button:has(.c-icon.-arrow)::before {
    width: 7px
}

.c-button:has(.c-icon.-arrow).-sm::before {
    width: 4px
}

.c-button:has(.c-icon.-download)::before {
    width: 15px
}

.c-button .c-icon {
    flex: 0 0 auto
}

.c-button .c-icon.-arrow {
    width: 6px;
    height: 10px;
    fill: #fff
}

.c-button .c-icon.-download {
    width: 15px;
    height: 14px;
    fill: #fff
}

.c-material-card__body .c-button .c-icon {
    margin-top: 0;
    margin-left: 0
}

.c-button.-sm {
    max-width: 160px;
    min-height: 40px;
    font-size: .8125rem;
    padding-right: 16px;
    padding-left: 16px
}

.c-button.-sm .c-icon.-arrow {
    width: 4px;
    height: 8px
}

.c-button.-lg {
    max-width: 360px
}

.c-button.-primary {
    border: 1px solid #fff;
    background: #000;
    background: var(--color-base)
}

.c-button.-jp {
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    font-weight: 400;
    font-weight: var(--fw-normal)
}

.c-button.-white {
    color: #171717;
    background: #fff
}

.c-button.-white .c-icon {
    fill: #222;
}

.c-button.-premium {
    background: #caa846;
    background: var(--color-premium)
}

.c-button.-unsubscribe {
    background: #dcdcdc
}

.c-button.-unsubscribe::after {
    content: "";
    flex: 0 0 auto;
    display: block;
    width: 7px;
    height: 12px;
    background: #fff;
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40.305 73.539"><path d="M0,70,33.234,36.77,0,3.535,3.535,0,40.3,36.77,3.535,73.539Z" /></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40.305 73.539"><path d="M0,70,33.234,36.77,0,3.535,3.535,0,40.3,36.77,3.535,73.539Z" /></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain
}

a.c-button:hover,
button.c-button:hover {
    background-color: #0F1B3E;
    background-color: var(--color-primary)
}

a.c-button.-primary:hover,
button.c-button.-primary:hover {
    background-color: #0F1B3E;
    background-color: var(--color-primary)
}

.c-table-wrapper {
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.c-table-wrapper table {
    margin-bottom: 0
}

.c-cap-title {
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-bottom: 30px
}

@media screen and (max-width: 767px) {
    .c-cap-title {
        margin-bottom: 20px
    }
}

.top-section__header .c-cap-title {
    margin-bottom: 0;
}

.c-brand .c-cap-title {
    margin-bottom: 30px
}

@media screen and (max-width: 767px) {
    .c-brand .c-cap-title {
        margin-bottom: 20px
    }
}

.page-section .c-cap-title {
    margin-bottom: 0
}

.a-article .c-cap-title {
    margin-top: 64px
}

@media screen and (max-width: 767px) {
    .a-article .c-cap-title {
        margin-top: 40px
    }
}

.c-cap-title__en {
    display: block;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-size: 2.5rem;
    font-weight: 600;
    font-weight: var(--fw-semibold);
    margin-top: calc((1em - 1lh)/2);
    margin-bottom: calc((1em - 1lh)/2)
}

@media screen and (max-width: 767px) {
    .c-cap-title__en {
        font-size: 1.75rem
    }
}

.c-brand .c-cap-title__en {
    color: #fff
}

.page-section .c-cap-title__en,
.c-section .c-cap-title__en {
    font-size: 1.75rem;
    font-weight: 700;
    font-weight: var(--fw-bold)
}

.c-cap-title.-line .c-cap-title__en {
    position: relative
}

.c-cap-title.-line .c-cap-title__en::before {
    content: "";
    position: absolute;
    top: 50%;
    right: calc(100% + 21px);
    width: calc(100vw - 50% - 21px);
    height: 1px;
    background: #000;
    background: var(--color-base)
}

@media screen and (max-width: 992px) {
    .c-cap-title.-line .c-cap-title__en::before {
        content: none
    }
}

.c-brand .c-cap-title.-line .c-cap-title__en::before {
    background-color: #fff
}

.c-cap-title__label {
    display: block;
    font-size: .875rem;
    margin-top: calc(calc((1em - 1lh) / 2) + 12px);
    margin-top: calc(var(--leading-trim) + 12px);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 992px) {
    .c-cap-title.-line .c-cap-title__label {
        display: flex;
        align-items: center;
        gap: 8px
    }

    .c-cap-title.-line .c-cap-title__label::before {
        content: "";
        flex: 0 0 auto;
        display: block;
        width: 20px;
        height: 1px;
        background: #000;
        background: var(--color-base)
    }

    .c-brand .c-cap-title.-line .c-cap-title__label::before {
        background-color: #fff
    }
}

@media screen and (max-width: 767px) {
    .c-cap-title__label {
        font-size: .75rem
    }
}

.c-brand .c-cap-title__label {
    color: #fff
}

.c-card {
    position: relative;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    max-width: 380px;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .c-card {
        max-width: none
    }
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage .c-card {
        max-width: none;
        border: 0;
        flex-direction: row;
        align-items: flex-start;
        gap: 16px
    }
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage.-paged .c-card:first-child {
        flex-direction: row;
        align-items: flex-start;
        gap: 16px;
        margin-bottom: 0
    }
}

.c-card.-md {
    flex-direction: row;
    align-items: flex-start;
    gap: 30px;
    max-width: none
}

@media screen and (max-width: 992px) {
    .c-card.-md {
        gap: 20px
    }
}

@media screen and (max-width: 767px) {
    .c-card.-md {
        gap: 16px
    }
}

.c-card.-md:not(:last-child) {
    margin-bottom: 20px
}

@media screen and (max-width: 767px) {
    .c-card.-md:not(:last-child) {
        margin-bottom: 20px
    }
}

.c-card.-sm {
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
    max-width: none
}

.c-card.-sm:not(:last-child) {
    margin-bottom: 32px
}

@media screen and (max-width: 767px) {
    .c-card.-sm:not(:last-child) {
        margin-bottom: 22px
    }
}

.page-section .c-card.-sm:not(:last-child) {
    margin-bottom: 20px
}

.c-card.-xs {
    flex-direction: row;
    align-items: stretch;
    gap: 16px;
    max-width: none
}

@media screen and (max-width: 1280px) {
    .c-card.-xs {
        gap: calc(10px + (16 - 10)*(100vw - 993px)/(1280 - 993))
    }
}

@media screen and (max-width: 992px) {
    .c-card.-xs {
        gap: 16px
    }
}

.c-card.-xs:not(:last-child) {
    margin-bottom: 16px
}

@media screen and (max-width: 767px) {
    .c-card.-md-sp {
        flex-direction: row;
        align-items: flex-start;
        max-width: none;
        gap: 16px
    }

    .c-card.-md-sp:not(:last-child) {
        margin-bottom: 20px
    }
}

.c-card__ranking {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    aspect-ratio: 1/1;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-size: 1.375rem;
    font-weight: 500;
    font-weight: var(--fw-medium);
    color: #fff;
    background: #313e73;
    background: var(--color-primary-light);
    z-index: 2
}

@media screen and (max-width: 1280px) {
    .c-card-grid__main .c-card__ranking {
        width: calc(40px + (48 - 40)*(100vw - 769px)/(1280 - 769));
        font-size: calc(18px + (22 - 18)*(100vw - 769px)/(1280 - 769))
    }
}

@media screen and (max-width: 767px) {
    .c-card-grid__main .c-card__ranking {
        width: 24px;
        font-size: .75rem
    }
}

@media screen and (max-width: 1280px) {
    .c-card-grid__sub .c-card__ranking {
        width: calc(32px + (48 - 32)*(100vw - 769px)/(1280 - 769));
        font-size: calc(16px + (22 - 16)*(100vw - 769px)/(1280 - 769))
    }
}

@media screen and (max-width: 767px) {
    .c-card-grid__sub .c-card__ranking {
        width: 24px;
        font-size: .75rem
    }
}

.c-card.-sm .c-card__ranking {
    width: 24px;
    font-size: .75rem
}

@media screen and (max-width: 767px) {

    .c-grid.-mypage.-paged .c-card:first-child .c-card__ranking,
    .c-grid.-mypage .c-card:not(:first-child) .c-card__ranking {
        width: 24px;
        font-size: .75rem
    }
}

.c-card__thumb {
    flex: 0 0 auto;
    aspect-ratio: 380/250;
    overflow: hidden;
    margin-bottom: 16px
}

.c-card__thumb img {
    width: 100%;
    max-width: none;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform .3s
}

.c-card.-md .c-card__thumb {
    aspect-ratio: 240/160;
    width: 240px;
    max-width: 30%;
    margin-bottom: 0
}

@media screen and (max-width: 767px) {
    .c-card.-md .c-card__thumb {
        aspect-ratio: 90/60;
        width: 100px;
        max-width: none
    }
}

.c-card.-sm .c-card__thumb {
    aspect-ratio: 90/60;
    width: 100px;
    margin-bottom: 0
}

.c-card.-xs .c-card__thumb {
    align-self: flex-start;
    aspect-ratio: 140/94;
    max-width: 140px;
    width: 36.84%;
    margin-bottom: 0
}

@media screen and (max-width: 767px) {
    .c-card.-xs .c-card__thumb {
        aspect-ratio: 90/60;
        width: 100px;
        max-width: none
    }
}

@media screen and (max-width: 767px) {
    .c-card.-md-sp .c-card__thumb {
        aspect-ratio: 90/60;
        width: 100px;
        max-width: none;
        margin-bottom: 0
    }
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage .c-card .c-card__thumb {
        flex: 0 0 auto;
        aspect-ratio: 90/60;
        width: 90px;
        margin-bottom: 0
    }
}

.c-card:hover .c-card__thumb img {
    transform: scale(1.05)
}

.c-card__body {
    flex: 1 1 auto
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage .c-card .c-card__body {
        display: flex;
        flex-direction: column
    }
}

.c-card.-xs .c-card__body {
    display: flex;
    flex-direction: column
}

.c-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 4px 8px
}

.c-card.-xs .c-card__meta {
    flex: 0 0 auto;
    flex-wrap: nowrap;
    align-items: flex-start
}

.c-grid.-mypage .c-card__meta {
    margin-bottom: 20px
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage .c-card .c-card__meta {
        margin-bottom: 8px
    }
}

.c-card__categories {
    flex: 1 1 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 4px
}

.c-card__category {
    display: table;
    font-size: .75rem;
    color: #171717;
    line-height: 1.2;
    padding: 6px 14px;
    border: 1px solid var(--border-dark);
    border: 1px solid var(--border-dark);
    border-radius: 4px
}

@media screen and (max-width: 767px) {
    .c-card__category {
        font-size: .6875rem
    }
}

@media screen and (max-width: 767px) {
    .c-card.-md .c-card__category {
        font-size: .6875rem;
        padding: 3px 4px
    }
}

.c-card.-sm .c-card__category {
    font-size: .6875rem;
    padding: 3px 4px
}

.c-card.-xs .c-card__category {
    padding: 5px 14px
}

@media screen and (max-width: 1280px) {
    .c-card.-xs .c-card__category {
        font-size: calc(10px + (12 - 10)*(100vw - 993px)/(1280 - 993));
        padding-left: calc(8px + (14 - 8)*(100vw - 993px)/(1280 - 993));
        padding-right: calc(8px + (14 - 8)*(100vw - 993px)/(1280 - 993))
    }
}

@media screen and (max-width: 992px) {
    .c-card.-xs .c-card__category {
        font-size: .75rem;
        padding-left: 6px;
        padding-right: 6px
    }
}

@media screen and (max-width: 767px) {
    .c-card.-xs .c-card__category {
        font-size: .6875rem;
        padding: 3px 4px
    }
}

@media screen and (max-width: 767px) {
    .c-card.-md-sp .c-card__category {
        font-size: .6875rem;
        padding: 3px 4px
    }
}

.c-card__fav {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .875rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    color: #7B8CD5;
    color: var(--color-fav);
    line-height: 1;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim);
    margin-left: auto
}

@media screen and (max-width: 767px) {
    .c-card__fav {
        font-size: .75rem;
        gap: 4px
    }
}

.c-card__fav .c-icon {
    width: 16px;
    height: 16px;
    fill: #fff;
    stroke: #7B8CD5;
    stroke: var(--color-fav)
}

@media screen and (max-width: 767px) {
    .c-card__fav .c-icon {
        width: 9px;
        height: 9px
    }
}

.c-card.-sm .c-card__fav {
    font-size: .75rem;
    margin-left: 0
}

.c-card.-md .c-card__fav {
    margin-left: 0
}

.c-card.-xs .c-card__fav {
    margin-top: 5px
}

@media screen and (max-width: 767px) {
    .c-card.-md-sp .c-card__fav {
        margin-top: 0
    }
}

.c-card__title {
    font-size: 1.375rem;
    line-height: 2;
    line-height: var(--lineHeight-lg);
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-height: 1.5384;
    transition: color .3s;
    margin-top: calc(calc((1em - 1lh) / 2) + 12px);
    margin-top: calc(var(--leading-trim) + 12px);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 12px);
    margin-bottom: calc(var(--leading-trim) + 12px)
}

@media screen and (max-width: 767px) {
    .c-card__title {
        -webkit-line-clamp: 2
    }
}

.c-card.-md .c-card__title {
    font-size: 1.125rem;
    -webkit-line-clamp: 3
}

@media screen and (max-width: 767px) {
    .c-card.-md .c-card__title {
        font-size: .75rem;
        line-height: 1.5384;
        margin-top: calc(calc((1em - 1lh) / 2) + 10px);
        margin-top: calc(var(--leading-trim) + 10px);
        margin-bottom: calc(calc((1em - 1lh) / 2) + 10px);
        margin-bottom: calc(var(--leading-trim) + 10px)
    }
}

.c-card.-sm .c-card__title {
    font-size: .8125rem;
    line-height: 1.5384;
    -webkit-line-clamp: 2
}

@media screen and (max-width: 767px) {
    .c-card.-sm .c-card__title {
        margin-top: calc(calc((1em - 1lh) / 2) + 10px);
        margin-top: calc(var(--leading-trim) + 10px);
        margin-bottom: calc(calc((1em - 1lh) / 2) + 10px);
        margin-bottom: calc(var(--leading-trim) + 10px)
    }
}

.c-card.-xs .c-card__title {
    flex: 0 0 auto;
    font-size: 1rem;
    line-height: 1.5384;
    -webkit-line-clamp: 2;
    margin-top: calc(calc((1em - 1lh) / 2) + 10px);
    margin-top: calc(var(--leading-trim) + 10px);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 10px);
    margin-bottom: calc(var(--leading-trim) + 10px)
}

@media screen and (max-width: 767px) {
    .c-card.-xs .c-card__title {
        font-size: .75rem;
        margin-top: calc(calc((1em - 1lh) / 2) + 10px);
        margin-top: calc(var(--leading-trim) + 10px);
        margin-bottom: calc(calc((1em - 1lh) / 2) + 10px);
        margin-bottom: calc(var(--leading-trim) + 10px)
    }
}

.c-card.-xs .c-card__title:first-child {
    margin-top: 0
}

@media screen and (max-width: 767px) {
    .c-card.-md-sp .c-card__title {
        font-size: .75rem;
        line-height: 1.5384;
        -webkit-line-clamp: 2;
        margin-top: calc(calc((1em - 1lh) / 2) + 10px);
        margin-top: calc(var(--leading-trim) + 10px);
        margin-bottom: calc(calc((1em - 1lh) / 2) + 10px);
        margin-bottom: calc(var(--leading-trim) + 10px)
    }
}

.c-grid.-mypage .c-card__title {
    font-size: .875rem;
    -webkit-line-clamp: 2
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage .c-card .c-card__title {
        font-size: .8125rem;
        line-height: 1.5384;
        -webkit-line-clamp: 2;
        margin-top: 0;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 12px);
        margin-bottom: calc(var(--leading-trim) + 12px)
    }
}

.c-card:hover .c-card__title {
    color: #313e73;
    color: var(--color-primary-light)
}

.c-card__excerpt {
    font-size: .875rem;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    margin-top: calc(calc((1em - 1lh) / 2) + 12px);
    margin-top: calc(var(--leading-trim) + 12px);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 12px);
    margin-bottom: calc(var(--leading-trim) + 12px)
}

@media screen and (max-width: 767px) {
    .c-card__excerpt {
        display: none
    }
}

.c-card__date {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: .875rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-date);
    line-height: 1;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim);
    letter-spacing: 0;
}

@media screen and (max-width: 767px) {
    .c-card__date {
        font-size: .75rem
    }
}

@media screen and (max-width: 767px) {
    .c-card.-md .c-card__date {
        font-size: .75rem;
        gap: 8px;
        margin-top: auto
    }
}

.c-card.-sm .c-card__date {
    font-size: .75rem;
    margin-top: calc(calc((1em - 1lh) / 2) + 10px);
    margin-top: calc(var(--leading-trim) + 10px)
}

.c-card.-xs .c-card__date {
    font-size: .75rem;
    gap: 8px
}

@media screen and (max-width: 767px) {
    .c-card.-md-sp .c-card__date {
        font-size: .75rem;
        gap: 8px;
        margin-top: auto
    }
}

.c-grid.-mypage .c-card__date {
    font-size: .9375rem;
    margin-top: calc(calc((1em - 1lh) / 2) + 20px);
    margin-top: calc(var(--leading-trim) + 20px)
}

.c-card.-premium .c-card__date::after {
    content: "";
    display: block;
    width: 11px;
    height: 13px;
    background: #caa846;
    background: var(--color-premium);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    margin-top: -2px
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage .c-card .c-card__date {
        font-size: .75rem;
        margin-top: auto
    }
}

.c-categories__item {
    display: flex
}

.c-categories__item:not(:last-child) {
    margin-bottom: 8px
}

.c-categories__item::before {
    content: "・";
    flex: 0 0 auto;
    display: block;
    width: 18px;
    color: #313e73;
    color: var(--color-primary-light)
}

.c-categories__item>a {
    display: inline-block;
    text-decoration: none
}

.c-category-nav {
    margin: 0 calc(40px*-1);
    margin: 0 calc(var(--pad)*-1);
    padding: 0 40px 1px;
    padding: 0 var(--pad) 1px
}

.c-category-nav.simplebar-scrollable-x .simplebar-content {
    display: flex
}

.c-category-nav.simplebar-scrollable-x .simplebar-content::after {
    content: "";
    flex: 0 0 auto;
    display: block;
    width: 40px;
    width: var(--pad)
}

.c-category-nav .simplebar-track.simplebar-horizontal {
    left: 40px;
    left: var(--pad);
    right: 40px;
    right: var(--pad)
}

.c-category-nav__inner {
    flex: 0 0 auto;
    display: flex;
    gap: 10px
}

@media screen and (max-width: 767px) {
    .c-category-nav__inner {
        gap: 8px
    }
}

.c-category-nav__button {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8125rem;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    text-decoration: none;
    min-height: 40px;
    padding: 8px 30px;
    border-radius: 30px;
    border: 1px solid #aaa;
    border: 1px solid var(--border-darken);
    transition: color .3s, border-color .3s, background-color .3s
}

@media screen and (max-width: 767px) {
    .c-category-nav__button {
        font-size: .625rem;
        padding: 8px 22px;
        min-height: 30px
    }
}

.c-category-nav__button:hover {
    color: #fff;
    border-color: #313e73;
    border-color: var(--color-primary-light);
    background-color: #313e73;
    background-color: var(--color-primary-light)
}

.c-center-title {
    font-size: 2rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 46px);
    margin-bottom: calc(var(--leading-trim) + 46px);
    text-align: center
}

@media screen and (max-width: 767px) {
    .c-center-title {
        font-size: 1.25rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
        margin-bottom: calc(var(--leading-trim) + 24px)
    }
}

.c-circle-number-list {
    counter-reset: circle-number;
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.c-circle-number-list>li {
    counter-increment: circle-number;
    padding-left: 1.5rem;
    text-indent: -1.5rem
}

.c-circle-number-list>li:not(:last-child) {
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.c-circle-number-list>li::before {
    content: counter(circle-number);
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    font-weight: var(--fw-medium);
    width: 1rem;
    height: 1rem;
    border: .5px solid #000;
    border: .5px solid var(--color-base);
    border-radius: 50%;
    text-indent: 0;
    margin-right: .5rem;
    padding: 1px 1px 0 0;
    vertical-align: 2px
}

li>.c-circle-number-list:last-child {
    margin-top: 1rem;
    margin-top: var(--mg-xs);
    margin-bottom: 0
}

li>.c-circle-number-list:last-child>li:not(:last-child) {
    margin-bottom: 1rem;
    margin-bottom: var(--mg-xs)
}

.c-comment {
    margin-top: 64px;
    margin-bottom: 64px
}

@media screen and (max-width: 767px) {
    .c-comment {
        margin-top: 40px;
        margin-bottom: 40px
    }
}

.c-comment__item {
    display: flex;
    align-items: flex-start;
    gap: 40px
}

@media screen and (max-width: 767px) {
    .c-comment__item {
        gap: 28px
    }
}

.c-comment__item:not(:last-child) {
    margin-bottom: 40px
}

@media screen and (max-width: 767px) {
    .c-comment__item:not(:last-child) {
        margin-bottom: 24px
    }
}

.c-comment__avatar {
    flex: 0 0 auto;
    width: 120px;
    text-align: center
}

@media screen and (max-width: 767px) {
    .c-comment__avatar {
        width: 60px
    }
}

.c-comment__avatar img {
    border-radius: 50%
}

.c-comment__item.-left .c-comment__avatar {
    order: 1
}

.c-comment__item.-right .c-comment__avatar {
    order: 2
}

.c-comment__name {
    text-align: center;
    font-size: .75rem;
    color: #444;
    margin-top: calc(calc((1em - 1lh) / 2) + 15px);
    margin-top: calc(var(--leading-trim) + 15px)
}

@media screen and (max-width: 767px) {
    .c-comment__name {
        font-size: .625rem;
        margin-top: calc(calc((1em - 1lh) / 2) + 10px);
        margin-top: calc(var(--leading-trim) + 10px)
    }
}

.c-comment__body {
    flex: 1 1 auto;
    position: relative;
    padding: 40px;
    background: #ecf2f9
}

@media screen and (max-width: 767px) {
    .c-comment__body {
        padding: 20px
    }
}

.c-comment__body>:last-child {
    margin-bottom: 0
}

.c-comment__body::before {
    content: "";
    display: block;
    position: absolute;
    top: 46px;
    width: 20px;
    height: 28px;
    background: #ecf2f9
}

@media screen and (max-width: 767px) {
    .c-comment__body::before {
        top: 16px
    }
}

.c-comment__item.-left .c-comment__body {
    order: 2
}

.c-comment__item.-left .c-comment__body::before {
    right: 100%;
    clip-path: polygon(0 50%, 100% 0, 100% 100%)
}

.c-comment__item.-right .c-comment__body {
    order: 1
}

.c-comment__item.-right .c-comment__body::before {
    left: 100%;
    clip-path: polygon(0 0, 100% 50%, 0 100%)
}

.c-company {
    margin-bottom: 60px
}

@media screen and (max-width: 767px) {
    .c-company {
        margin-bottom: 40px
    }
}

.c-company__item {
    display: flex;
    border: 1px solid #313e73;
    border: 1px solid var(--color-primary-light)
}

.c-company__item:not(:last-child) {
    margin-bottom: 40px
}

@media screen and (max-width: 767px) {
    .c-company__item {
        display: block;
        padding: 30px 20px
    }
}

.c-company__head {
    flex: 0 0 auto;
    padding: 40px 20px
}

@media screen and (max-width: 767px) {
    .c-company__head {
        padding: 0;
        margin-bottom: 30px
    }
}

.c-company__logo {
    width: 120px;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    .c-company__logo {
        flex: 0 0 auto;
        width: auto;
        text-align: center
    }
}

.c-company__logo img {
    display: block;
    width: 100%;
    height: auto
}

@media screen and (max-width: 767px) {
    .c-company__logo img {
        width: auto;
        max-width: 100%;
        margin: 0 auto
    }
}

.c-company__name {
    font-size: 1.25rem;
    color: #fff;
    margin-right: -40px;
    margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
    margin-bottom: calc(var(--leading-trim) + 20px);
    padding: calc(calc((1em - 1lh) / 2) + 20px) 20px;
    padding: calc(var(--leading-trim) + 20px) 20px;
    background: #313e73;
    background: var(--color-primary-light)
}

@media screen and (max-width: 767px) {
    .c-company__name {
        text-align: center;
        margin-left: -20px;
        margin-right: -20px
    }
}

.c-company__body {
    padding: 0 40px 40px
}

@media screen and (max-width: 767px) {
    .c-company__body {
        padding: 0
    }
}

.c-company__body p {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: 0;
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-company__body ul {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: 0;
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-company__body ul>li {
    margin-bottom: 0
}

.c-company__body ul>li:not(:last-child) {
    margin-bottom: 0
}

.c-company__body ol {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: 0;
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-company__body ol>li {
    margin-bottom: 0
}

.c-company__body ol>li:not(:last-child) {
    margin-bottom: 0
}

.c-company__body>:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.c-company__body>.u-no-margin.u-no-margin.u-no-margin:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.c-container {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    padding: 80px 40px 60px;
    padding: 80px var(--pad) 60px;
    margin-bottom: 60px;
    background: #f0f0f0;
    background: var(--bg-light)
}

@media screen and (max-width: 767px) {
    .c-container {
        padding-top: 40px;
        padding-bottom: 40px;
        margin-bottom: 40px
    }
}

.c-container__inner {
    max-width: 1200px;
    max-width: var(--width-default);
    margin: 0 auto
}

.l-contents.-single .c-container:first-child {
    margin-top: -80px
}

@media screen and (max-width: 767px) {
    .l-contents.-single .c-container:first-child {
        margin-top: -40px
    }
}

.c-cta-card {
    margin-bottom: 60px
}

@media screen and (max-width: 767px) {
    .c-cta-card {
        margin-bottom: 40px
    }
}

.c-cta-card__link {
    display: block;
    text-decoration: none;
    border: 1px solid #313e73;
    border: 1px solid var(--color-primary-light)
}

.c-cta-card__title {
    font-size: 1.25rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    color: #fff;
    text-align: center;
    padding: calc(calc((1em - 1lh) / 2) + 20px) 40px;
    padding: calc(var(--leading-trim) + 20px) var(--pad);
    background: #303d73
}

@media screen and (max-width: 767px) {
    .c-cta-card__title {
        text-align: left;
        line-height: 1.6
    }
}

.c-cta-card__body {
    padding: 40px 40px;
    padding: 40px var(--pad);
    background: #f6f6f6
}

@media screen and (max-width: 767px) {
    .c-cta-card__body {
        padding-top: 20px;
        padding-bottom: 30px
    }
}

.c-cta-card__desc {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .c-cta-card__desc {
        font-size: .875rem
    }
}

.c-cta-card__block {
    display: flex;
    justify-content: center;
    margin-top: 30px
}

@media screen and (max-width: 767px) {
    .c-cta-card__block {
        margin-top: 20px
    }
}

.c-cta-card__button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 300px;
    margin: 0 auto;
    padding: calc(calc((1em - 1lh) / 2) + 12px) 38px;
    padding: calc(var(--leading-trim) + 12px) 38px;
    background: #000;
    color: #fff;
    border-radius: 4px;
    transition: background-color .3s
}

.c-cta-card__button .c-icon {
    display: block;
    position: absolute;
    top: 50%;
    right: 19px;
    fill: #fff;
    width: 6px;
    height: 11px;
    transform: translateY(-50%)
}

.c-cta-card__link:hover .c-cta-card__button {
    background-color: #57628c;
    background-color: var(--color-primary-hover)
}

.c-cta {
    position: fixed;
    right: 0;
    bottom: 60px;
    z-index: 501
}

@media screen and (max-width: 767px) {
    .c-cta {
        left: 0
    }
}

.c-cta.-hidden {
    display: none
}

.c-cta__close {
    position: absolute;
    top: 0;
    right: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border: 0;
    border-radius: 0;
    background: #fff;
    cursor: pointer;
    transform-origin: top right;
    transition: transform .3s
}

@media screen and (max-width: 767px) {
    .c-cta__close {
        right: 3px
    }
}

.c-cta__close::before,
.c-cta__close::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 1px;
    background: #1f47a2
}

.c-cta__close::before {
    transform: translate(-50%, -50%) rotate(45deg)
}

.c-cta__close::after {
    transform: translate(-50%, -50%) rotate(-45deg)
}

.c-cta__close:hover {
    transform: scale(1.2)
}

.c-cta__banner {
    display: flex;
    flex-direction: column;
    width: 260px;
    height: 114px;
    padding: 0 3px 5px;
    background: rgba(0, 76, 190, .8);
    text-decoration: none;
    transition: background-color .3s
}

@media screen and (max-width: 767px) {
    .c-cta__banner {
        width: 100%;
        height: 75px;
        padding-bottom: 2px
    }
}

.c-cta__banner:hover {
    background-color: rgba(76, 129, 209, .8)
}

.c-cta__head {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    padding-top: 14px
}

@media screen and (max-width: 767px) {
    .c-cta__head {
        padding-top: 6px
    }
}

.c-cta__title {
    font-size: .75rem;
    text-align: center;
    color: #fff;
    width: 100%;
    line-height: 1.1667;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .c-cta__title {
        line-height: 1.6667;
        padding: 0 17px
    }
}

.c-cta__button {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: .625rem;
    color: #2047a9;
    min-height: 30px;
    margin-left: 2px;
    margin-right: 2px;
    padding: 8px;
    border-radius: 10px;
    background: #fff
}

@media screen and (max-width: 767px) {
    .c-cta__button {
        padding: 2px 8px;
        min-height: 25px
    }
}

.c-cta__button::before {
    content: "";
    display: block;
    width: 5px
}

.c-cta__button::after {
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    border-right: 1px solid #2047a9;
    border-bottom: 1px solid #2047a9;
    transform: rotate(-45deg)
}

.c-fav-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-size: .875rem;
    font-weight: 300;
    font-weight: var(--fw-light);
    color: #7B8CD5;
    color: var(--color-fav);
    text-decoration: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .c-fav-button {
        font-size: .75rem;
        gap: 6px
    }
}

.c-fav-button .c-icon {
    width: 16px;
    height: 16px;
    fill: #fff;
    stroke: #7B8CD5;
    stroke: var(--color-fav);
    transition: transform .3s
}

@media screen and (max-width: 767px) {
    .c-fav-button .c-icon {
        width: 11px;
        height: 11px
    }
}

.c-fav-button:hover .c-icon {
    transform: scale(1.2)
}

.c-card.-xs .c-fav-button {
    font-size: .75rem;
    gap: 4px
}

.c-card.-xs .c-fav-button .c-icon {
    width: 11px;
    height: 11px
}

.c-feature {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    padding: 64px 40px 89px;
    padding: 64px var(--pad) 89px;
    background: #f0f0f0;
    background: var(--bg-light)
}

@media screen and (max-width: 767px) {
    .c-feature {
        padding-top: 35px;
        padding-bottom: 45px
    }
}

.c-feature__inner {
    max-width: 1200px;
    max-width: var(--width-default);
    margin-left: auto;
    margin-right: auto
}

.c-feature-grid {
    display: flex;
    justify-content: space-between;
    gap: 30px
}

@media screen and (max-width: 992px) {
    .c-feature-grid {
        flex-direction: column;
        max-width: 720px;
        gap: 32px;
        margin: 0 auto
    }
}

@media screen and (max-width: 767px) {
    .c-feature-grid {
        gap: 22px
    }
}

.c-feature-grid__main {
    flex: 1 1 auto;
    max-width: 720px;
    width: 60%
}

@media screen and (max-width: 992px) {
    .c-feature-grid__main {
        width: 100%
    }
}

.c-feature-grid__sub {
    flex: 1 1 auto;
    max-width: 408px;
    min-width: 300px;
    width: 34%
}

@media screen and (max-width: 992px) {
    .c-feature-grid__sub {
        width: 100%;
        max-width: none
    }
}

.c-grid {
    display: grid
}

.a-article .c-grid {
    margin-bottom: 40px
}

.c-grid.-col-2 {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px
}

@media screen and (max-width: 767px) {
    .c-grid.-col-2 {
        grid-template-columns: repeat(1, 1fr);
        gap: 40px
    }
}

.c-grid.-col-3 {
    grid-template-columns: repeat(3, 1fr);
    gap: 30px
}

@media screen and (max-width: 767px) {
    .c-grid.-col-3 {
        grid-template-columns: repeat(1, 1fr);
        gap: 20px
    }
}

@media screen and (max-width: 767px) {
    .c-grid.-col-2-sp {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px
    }
}

.c-grid.-mypage {
    gap: 40px 20px;
    grid-template-columns: repeat(3, 1fr)
}

@media screen and (max-width: 767px) {
    .c-grid.-mypage {
        grid-template-columns: repeat(1, 1fr);
        gap: 20px
    }
}

.c-grid.-index {
    gap: 40px 30px;
    grid-template-columns: repeat(2, 1fr)
}

@media screen and (max-width: 767px) {
    .c-grid.-index {
        grid-template-columns: repeat(1, 1fr);
        gap: 20px
    }
}

.c-icon-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    padding: 86px 24px 46px;
    background: #f0f0f0;
    background: var(--bg-light)
}

@media screen and (max-width: 992px) {
    .c-icon-card {
        padding: calc(48px + (86 - 48)*(100vw - 769px)/(993 - 769)) calc(20px + (24 - 20)*(100vw - 769px)/(993 - 769)) calc(40px + (46 - 40)*(100vw - 769px)/(993 - 769))
    }
}

@media screen and (max-width: 767px) {
    .c-icon-card {
        padding: 11.1111111111% 24px 8.8888888889%
    }
}

.c-icon-card .c-button {
    margin: auto auto 0
}

.c-icon-card:hover .c-button {
    background-color: #313e73;
    background-color: var(--color-primary-light)
}

.c-icon-card__icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin: 0 auto 60px
}

@media screen and (max-width: 767px) {
    .c-icon-card__icon {
        width: 48px;
        height: 48px;
        margin-bottom: 24px
    }
}

.c-brand-card:hover .c-icon-card__icon {
    transform: scale(1.05)
}

.c-icon-card__icon .c-icon {
    width: 56px;
    height: 56px;
    fill: #313e73;
    fill: var(--color-primary-light)
}

@media screen and (max-width: 767px) {
    .c-icon-card__icon .c-icon {
        width: 48px;
        height: 48px
    }
}

.c-icon-card__icon .c-icon.-edit {
    width: 48px;
    height: 48px
}

@media screen and (max-width: 767px) {
    .c-icon-card__icon .c-icon.-edit {
        width: 40px;
        height: 40px
    }
}

.c-icon-card__title {
    font-size: 1.25rem;
    text-align: center;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 37px);
    margin-bottom: calc(var(--leading-trim) + 37px)
}

@media screen and (max-width: 992px) {
    .c-icon-card__title {
        font-size: 1rem
    }
}

@media screen and (max-width: 767px) {
    .c-icon-card__title {
        font-size: 1.25rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
        margin-bottom: calc(var(--leading-trim) + 24px)
    }
}

.c-interviewee {
    margin-bottom: 60px
}

@media screen and (max-width: 767px) {
    .c-interviewee {
        margin-bottom: 40px
    }
}

.c-interviewee__item {
    display: flex;
    border: 1px solid #313e73;
    border: 1px solid var(--color-primary-light)
}

.c-interviewee__item:not(:last-child) {
    margin-bottom: 40px
}

@media screen and (max-width: 767px) {
    .c-interviewee__item {
        display: block
    }

    .c-interviewee__item:not(:last-child) {
        margin-bottom: 30px;
        padding-bottom: 30px
    }
}

.c-interviewee__head {
    flex: 0 0 auto;
    padding: 40px 20px;
    background: #eaf2f8
}

@media screen and (max-width: 767px) {
    .c-interviewee__head {
        position: relative;
        padding: 30px 20px 0;
        margin-bottom: 20px;
        background: rgba(0, 0, 0, 0)
    }

    .c-interviewee__head::before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 90px;
        background: #eaf2f8;
        z-index: -1
    }
}

.c-interviewee__avatar {
    width: 120px;
    height: 120px;
    overflow: hidden;
    border-radius: 50%
}

@media screen and (max-width: 767px) {
    .c-interviewee__avatar {
        flex: 0 0 auto;
        margin: 0 auto
    }
}

.c-interviewee__avatar img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-position: center center;
    object-position: center center;
    -o-object-fit: cover;
    object-fit: cover
}

.c-interviewee__name {
    position: relative;
    font-size: 1.25rem;
    color: #313e73;
    color: var(--color-primary-light);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: 30px;
    padding-bottom: calc(calc((1em - 1lh) / 2) + 27px);
    padding-bottom: calc(var(--leading-trim) + 27px);
    border-bottom: 1px solid #e4ecf4
}

@media screen and (max-width: 767px) {
    .c-interviewee__name {
        padding-bottom: calc(calc((1em - 1lh) / 2) + 17px);
        padding-bottom: calc(var(--leading-trim) + 17px);
        margin-bottom: 20px
    }
}

.c-interviewee__name::before {
    content: "";
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 60px;
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light)
}

.c-interviewee__post {
    display: block;
    font-size: 1rem;
    color: #8e8e8e;
    margin: calc(calc((1em - 1lh) / 2) + 8px) 0 0;
    margin: calc(var(--leading-trim) + 8px) 0 0
}

.c-interviewee__body {
    padding: 40px
}

@media screen and (max-width: 767px) {
    .c-interviewee__body {
        padding: 0 20px 30px
    }
}

.c-interviewee__body p {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: 0;
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-interviewee__body ul {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: 0;
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-interviewee__body ul>li {
    margin-bottom: 0
}

.c-interviewee__body ul>li:not(:last-child) {
    margin-bottom: 0
}

.c-interviewee__body ol {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: 0;
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-interviewee__body ol>li {
    margin-bottom: 0
}

.c-interviewee__body ol>li:not(:last-child) {
    margin-bottom: 0
}

.c-interviewee__body>:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.c-interviewee__body>.u-no-margin.u-no-margin.u-no-margin:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.c-line-title {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 2rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {
    .c-line-title {
        font-size: 1.375rem;
        gap: 16px;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 32px);
        margin-bottom: calc(var(--leading-trim) + 32px)
    }
}

.c-line-title:not(:first-child) {
    margin-top: calc(calc((1em - 1lh) / 2) + 80px);
    margin-top: calc(var(--leading-trim) + 80px)
}

@media screen and (max-width: 767px) {
    .c-line-title:not(:first-child) {
        margin-top: calc(calc((1em - 1lh) / 2) + 56px);
        margin-top: calc(var(--leading-trim) + 56px)
    }
}

.c-line-title::before {
    content: "";
    flex: 0 0 auto;
    display: block;
    width: 100px;
    height: 1px;
    background: #000;
    background: var(--color-base)
}

@media screen and (max-width: 767px) {
    .c-line-title::before {
        width: 40px
    }
}

.c-link {
    display: inline-flex;
    align-items: center;
    gap: 8px
}

.c-link .c-icon.-arrow {
    width: 8px;
    height: 12px
}

.c-linkcard {
    margin: 64px 0
}

@media screen and (max-width: 767px) {
    .c-linkcard {
        margin: 40px 0
    }
}

.c-linkcard__link {
    display: flex;
    padding: 0;
    text-decoration: none;
    background: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .2);
    transition: box-shadow .3s
}

.c-linkcard__link:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3)
}

.c-linkcard__thumb {
    flex: 0 0 auto;
    display: flex;
    width: 240px;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    .c-linkcard__thumb {
        width: 38.8889%;
        max-width: 240px
    }
}

.c-linkcard__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform .3s
}

.c-linkcard:hover .c-linkcard__thumb img {
    transform: scale(1.05)
}

.c-linkcard__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 170px;
    padding: 8px 32px
}

.c-linkcard__title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.125rem;
    color: #313e73;
    color: var(--color-primary-light);
    text-decoration: underline;
    margin-bottom: 12px
}

.c-linkcard:hover .c-linkcard__title {
    text-decoration: none
}

.c-linkcard__desc {
    color: #444;
    font-size: .875rem;
    line-height: 1.7;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden
}

.c-material-card {
    display: flex;
    flex-direction: column;
    text-decoration: none
}

@media screen and (max-width: 767px) {
    .c-material-card.swiper-slide {
        max-width: 300px
    }
}

.c-slider__wrapper.swiper .c-material-card {
    visibility: hidden
}

.c-slider__wrapper.swiper .c-material-card:not(:first-child) {
    display: none
}

.c-slider__wrapper.swiper-initialized .c-material-card {
    visibility: visible
}

.c-slider__wrapper.swiper-initialized .c-material-card:not(:first-child) {
    display: flex
}

.c-grid.-index .c-material-card {
    border: 1px solid #dcdcdc;
    border: 1px solid var(--border-light)
}

.l-sub .c-material-card {
    margin-top: 20px;
    max-width: 340px;
    margin-left: auto;
    margin-right: auto
}

.l-sub .c-material-card:not(:last-child) {
    margin-bottom: 20px
}

.c-material-card.swiper-slide {
    display: flex;
    height: auto
}

.c-material-card__thumb {
    flex: 0 0 auto;
    position: relative;
    aspect-ratio: 380/250;
    overflow: hidden;
    border: 1px solid #dcdcdc;
    border: 1px solid var(--border-light)
}

.c-material-card__thumb img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform .3s
}

.c-material-card:hover .c-material-card__thumb img {
    transform: scale(1.05)
}

.c-material-card__body {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 7.8947368421%;
    background: #fff;
    border-left: 2px solid #f0f0f0;
    border-right: 2px solid #f0f0f0;
    border-bottom: 2px solid #f0f0f0
}

@media screen and (max-width: 767px) {
    .c-material-card__body {
        padding: 20px
    }
}

.c-material-card__body .c-button {
    display: flex;
    margin: auto auto 0
}

.c-material-card:hover .c-material-card__body .c-button {
    background-color: #313e73;
    background-color: var(--color-primary-light)
}

.c-material-card.-primary .c-material-card__body {
    background: #313e73;
    background: var(--color-primary-light)
}

.c-material-card.-primary .c-material-card__body .c-button {
    color: #0F1B3E;
    color: var(--color-primary);
    background: #fff;
    border: 1px solid #fff;
    transition: color .3s, background-color .3s
}

.c-material-card.-primary .c-material-card__body .c-button .c-icon {
    fill: #0F1B3E;
    fill: var(--color-primary);
    transition: fill .3s
}

.c-material-card.-gray .c-material-card__body {
    background: #f0f0f0
}

.c-material-card.-primary:hover .c-material-card__body .c-button {
    color: #fff;
    background-color: #5a658f
}

.c-material-card.-primary:hover .c-material-card__body .c-button .c-icon {
    fill: #fff
}

.c-material-card__title {
    width: 100%;
    font-size: 1.25rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 16px);
    margin-bottom: calc(var(--leading-trim) + 16px)
}

@media screen and (max-width: 767px) {
    .c-material-card__title {
        font-size: 1rem
    }
}

.c-material-card.-primary .c-material-card__title {
    color: #fff
}

.c-material-card__footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-top: auto
}

.c-material-card__footer .c-icon.-arrow {
    flex: 0 0 auto;
    display: block;
    width: 6px;
    height: 11px;
    margin-left: auto
}

@media screen and (max-width: 767px) {
    .c-material-card__footer .c-icon.-arrow {
        width: 4px;
        height: 8px;
        margin-bottom: 2px
    }
}

.c-material-card__tag {
    flex: 1 1 auto;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    font-size: .75rem;
    color: #a7a7a7;
    margin-top: auto;
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim);
    padding-left: 40px
}

.c-material-card__tag>dt {
    position: absolute;
    top: 0;
    left: 0
}

.c-material {
    margin: 56px 0
}

@media screen and (max-width: 767px) {
    .c-material {
        margin: 40px 0
    }
}

.c-material__link {
    display: block;
    text-decoration: none
}

.c-material__top {
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 40px;
    background: #0F1B3E;
    background: var(--color-primary)
}

@media screen and (max-width: 1279px) {
    .c-material__top {
        gap: calc(30px + (40 - 30)*(100vw - 992px)/(1279 - 992));
        padding: calc(30px + (40 - 30)*(100vw - 992px)/(1279 - 992))
    }
}

@media screen and (max-width: 992px) {
    .c-material__top {
        gap: 40px;
        padding: 40px
    }
}

@media screen and (max-width: 767px) {
    .c-material__top {
        flex-direction: column;
        gap: 20px;
        padding: 20px
    }
}

.c-material__thumb {
    flex: 0 0 auto;
    max-width: 40%;
    border-radius: 15px;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    .c-material__thumb {
        max-width: none;
        text-align: center
    }
}

.c-material__thumb img {
    border-radius: 15px;
    transition: transform .3s
}

.c-material__link:hover .c-material__thumb img {
    transform: scale(1.05)
}

.c-material__body {
    flex: 1 1 auto
}

.c-material__tag {
    display: table;
    font-size: .75rem;
    color: #fff;
    margin-bottom: 20px;
    padding: 4px 24px;
    border: 1px solid #fff;
    border-radius: 5px
}

.c-material__title {
    font-size: 1.625rem;
    color: #fff;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    margin: calc((1em - 1lh) / 2) 0 calc(calc((1em - 1lh) / 2) + 20px);
    margin: var(--leading-trim) 0 calc(var(--leading-trim) + 20px)
}

@media screen and (max-width: 1279px) {
    .c-material__title {
        font-size: calc(20px + (26 - 20)*(100vw - 992px)/(1279 - 992))
    }
}

@media screen and (max-width: 992px) {
    .c-material__title {
        font-size: 1.625rem
    }
}

@media screen and (max-width: 767px) {
    .c-material__title {
        font-size: .9375rem
    }
}

.c-material__list {
    font-size: .875rem;
    color: #fff;
    margin-top: calc(calc((1em - 1lh) / 2) + 24px);
    margin-top: calc(var(--leading-trim) + 24px)
}

.c-material__list>li {
    position: relative;
    padding-left: 17px;
    color: #fff;
    line-height: 1.8571
}

.c-material__list>li::before {
    content: "";
    display: block;
    position: absolute;
    top: 10px;
    left: 0;
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%
}

.c-material__bottom {
    text-align: center;
    padding: 20px 40px;
    background: #d6dee6
}

@media screen and (max-width: 767px) {
    .c-material__bottom {
        padding: 30px 20px
    }
}

.c-material__link:hover .c-material__bottom .c-button {
    background: #313e73;
    background: var(--color-primary-light)
}

.c-media {
    display: flex;
    gap: 40px;
    gap: var(--pad);
    margin-bottom: 2.5rem;
    margin-bottom: var(--mg-md)
}

@media screen and (max-width: 767px) {
    .c-media {
        flex-direction: column
    }
}

.c-media.-c {
    align-items: center
}

@media screen and (max-width: 767px) {
    .c-media.-c {
        align-items: stretch
    }
}

@media screen and (max-width: 992px) {
    .c-media.-col-tbl {
        flex-direction: column
    }
}

.c-media__object {
    flex: 0 0 auto;
    margin: 0;
    max-width: 42.1875%
}

@media screen and (max-width: 767px) {
    .c-media__object {
        max-width: none
    }
}

.c-media__object.-l {
    order: 1
}

@media screen and (max-width: 767px) {
    .c-media__object.-l {
        order: 2
    }
}

.c-media__object.-r {
    order: 2
}

@media screen and (max-width: 992px) {
    .c-media.-col-tbl .c-media__object {
        order: 2
    }
}

@media screen and (max-width: 767px) {

    .c-media.-rev-sp .c-media__object.-l,
    .c-media.-rev-sp .c-media__object.-r {
        order: 1
    }
}

.c-media__object.-col {
    display: flex;
    justify-content: center;
    gap: 40px;
    gap: var(--pad)
}

.c-media__object.-col>* {
    margin-bottom: 0
}

.c-media__body {
    flex: 1 1 auto
}

.c-media__object.-l+.c-media__body {
    order: 2
}

@media screen and (max-width: 767px) {
    .c-media__object.-l+.c-media__body {
        order: 1
    }
}

.c-media__object.-r+.c-media__body {
    order: 1
}

@media screen and (max-width: 992px) {
    .c-media.-col-tbl .c-media__body {
        order: 1
    }
}

@media screen and (max-width: 767px) {

    .c-media.-rev-sp .c-media__object.-l+.c-media__body,
    .c-media.-rev-sp .c-media__object.-r+.c-media__body {
        order: 2
    }
}

.c-media__body>:first-child {
    margin-top: 0
}

.c-media__body>:last-child {
    margin-bottom: 0
}

.c-more {
    position: relative;
    display: inline-flex;
    gap: 14px;
    align-items: center;
    font-size: 1.25rem;
    font-weight: 600;
    font-weight: var(--fw-semibold);
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    line-height: 1;
    text-decoration: none;
    padding-bottom: 8px;
    transition: color .3s;
    white-space: nowrap;
}

@media screen and (max-width: 767px) {
    .c-more {
        font-size: 14px;
        gap: 8px
    }
}

.c-more .c-icon {
    width: 7px;
    height: 11px;
    transition: fill .3s
}

.c-more::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: #000;
    background: var(--color-base);
    transition: background-color .3s
}

.c-more:hover {
    color: #313e73;
    color: var(--color-primary-light)
}

.c-more:hover .c-icon {
    fill: #313e73;
    fill: var(--color-primary-light)
}

.c-more:hover::after {
    animation: slide-line .4s forwards
}

.page-section .c-more {
    margin-left: auto;
}


@keyframes slide-line {
    0% {
        transform: scaleX(1);
        transform-origin: right top;
        background: #000;
        background: var(--color-base)
    }

    50% {
        transform: scaleX(0);
        transform-origin: right top
    }

    50.01% {
        transform: scaleX(0);
        transform-origin: left top
    }

    100% {
        transform: scaleX(1);
        transform-origin: left top;
        background: #313e73;
        background: var(--color-primary-light)
    }
}

.c-number-list {
    list-style: decimal outside;
    padding-left: 1.5em;
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.c-number-list>li {
    padding-left: 5px
}

.c-number-list>li:not(:last-child) {
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.c-number-list ul:not([class]),
.c-number-list ul[class^=u-],
.c-number-list ul[class^="-"],
.c-number-list ul[class^=wp-] {
    margin-top: 8px
}

.c-number-list ul:not([class]):last-child,
.c-number-list ul[class^=u-]:last-child,
.c-number-list ul[class^="-"]:last-child,
.c-number-list ul[class^=wp-]:last-child {
    margin-bottom: 0
}

.c-page-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(calc((1em - 1lh) / 2) + 16px);
    gap: calc(var(--leading-trim) + 16px);
    font-size: 2.25rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    color: #171717;
    margin: calc(calc((1em - 1lh) / 2) + 20px) 0 40px;
    margin: calc(var(--leading-trim) + 20px) 0 40px
}

@media screen and (max-width: 767px) {
    .c-page-title {
        font-size: 1.5rem
    }
}

.c-page-title::after {
    flex: 0 0 auto;
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: #000;
    background: var(--color-base)
}

@media screen and (max-width: 767px) {
    .c-page-title::after {
        width: 60px
    }
}

.c-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 100px
}

@media screen and (max-width: 767px) {
    .c-pagination {
        gap: 4px;
        margin-top: 40px
    }
}

.c-pagination__prev,
.c-pagination__next {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 43px;
    height: 43px
}

@media screen and (max-width: 767px) {

    .c-pagination__prev,
    .c-pagination__next {
        width: 32px;
        height: 32px
    }
}

.c-pagination__prev .c-icon,
.c-pagination__next .c-icon {
    display: block;
    fill: #000;
    fill: var(--color-base);
    width: 7px;
    height: 12px;
    transition: transform .3s, fill
}

.c-pagination__prev {
    margin-right: 10px
}

@media screen and (max-width: 767px) {
    .c-pagination__prev {
        margin-right: 0
    }
}

.c-pagination__prev .c-icon {
    transform: rotate(-180deg)
}

.c-pagination__prev:hover .c-icon {
    transform: rotate(-180deg) scale(1.4)
}

.c-pagination__next {
    margin-left: 10px
}

@media screen and (max-width: 767px) {
    .c-pagination__next {
        margin-left: 0
    }
}

.c-pagination__next:hover .c-icon {
    transform: scale(1.4)
}

.c-pagination__item {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    text-align: center;
    font-size: 1rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    width: 43px;
    height: 43px;
    border: 2px solid #f0f0f0;
    border: 2px solid var(--bg-light);
    color: #171717;
    transition: background-color .3s
}

@media screen and (max-width: 767px) {
    .c-pagination__item {
        font-size: 1rem;
        width: 32px;
        height: 32px
    }
}

.c-pagination__item:hover {
    background: #f0f0f0;
    background: var(--bg-light)
}

.c-pagination__item[aria-current=true] {
    background: #f0f0f0;
    background: var(--bg-light);
    cursor: default
}

.c-posted {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .875rem;
    color: #a3a3a3;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim);
    letter-spacing: 0;
    font-family: var(--ff-date);
}

@media screen and (max-width: 767px) {
    .c-posted {
        font-size: .75rem
    }
}

.c-posted .c-icon {
    width: 14px;
    height: 14px;
    fill: #7f7f7f
}

@media screen and (max-width: 767px) {
    .c-posted .c-icon {
        width: 11px;
        height: 11px
    }
}

.a-header .c-posted {
    flex: 0 0 auto
}

@media screen and (max-width: 767px) {
    .a-header .c-posted {
        order: 3;
        grid-column: 1/3
    }
}

.c-prev {
    display: flex
}

.c-ranking {
    padding: 20px;
    background: #f0f0f0;
    background: var(--bg-light)
}

.c-ranking--page {
    background-color: #fff;
    padding: 0;
}

.c-ranking-nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
    gap: 10px;
    margin-bottom: 24px
}

.c-ranking--page .c-ranking-nav {
    margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
    .c-ranking--page .c-ranking-nav {
        margin-bottom: 24px;
    }
}

.c-ranking-nav__button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    font-size: .875rem;
    color: #171717;
    height: 40px;
    margin: 0;
    padding: 4px;
    border: 1px solid #000;
    border: 1px solid var(--color-base);
    border-radius: 5px;
    cursor: pointer;
    transition: color .3s, background-color .3s
}

.c-ranking--page .c-ranking-nav__button {
    background-color: #fff;
}

.c-ranking-nav__button:hover {
    background: #000;
    background: var(--color-base);
    color: #fff
}

.c-ranking-nav__button[aria-selected=true] {
    background: #000;
    background: var(--color-base);
    color: #fff
}

.c-recruit {
    padding: 0 20px 10px;
    border: 1px solid #313e73;
    border: 1px solid var(--color-primary-light);
    margin-bottom: 60px
}

@media screen and (max-width: 767px) {
    .c-recruit {
        margin-bottom: 40px;
        padding-bottom: 6px
    }
}

.c-recruit__title {
    font-size: 1.625rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    line-height: 1.75;
    line-height: var(--lineHeight-md);
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: 10px;
    padding: calc(calc((1em - 1lh) / 2) + 23px) 40px;
    padding: calc(var(--leading-trim) + 23px) 40px;
    background: #f6f6f6
}

@media screen and (max-width: 767px) {
    .c-recruit__title {
        font-size: 1.25rem;
        padding: calc(calc((1em - 1lh) / 2) + 20px) 20px;
        padding: calc(var(--leading-trim) + 20px) 20px
    }
}

.c-recruit__table {
    border-spacing: 20px 0;
    border-collapse: separate
}

@media screen and (max-width: 767px) {
    .c-recruit__table {
        display: block;
        border-spacing: 0
    }
}

@media screen and (max-width: 767px) {
    .c-recruit__table tbody {
        display: block
    }
}

@media screen and (max-width: 767px) {
    .c-recruit__table tr {
        display: block;
        padding: calc(calc((1em - 1lh) / 2) + 24px) 0 24px;
        padding: calc(var(--leading-trim) + 24px) 0 24px
    }
}

.c-recruit__table th {
    font-weight: 400;
    font-weight: var(--fw-normal);
    width: 120px;
    padding: calc(calc((1em - 1lh) / 2) + 30px) 0;
    padding: calc(var(--leading-trim) + 30px) 0
}

@media screen and (max-width: 767px) {
    .c-recruit__table th {
        display: block;
        font-size: .875rem;
        width: 100%;
        padding: 0;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
        margin-bottom: calc(var(--leading-trim) + 20px)
    }
}

.c-recruit__table td {
    padding: 30px 0
}

@media screen and (max-width: 767px) {
    .c-recruit__table td {
        display: block;
        width: 100%;
        padding: 0
    }
}

.c-recruit__table td p {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-recruit__table td ul {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-recruit__table td ul>li {
    margin-bottom: 0
}

.c-recruit__table td ul>li:not(:last-child) {
    margin-bottom: 0
}

.c-recruit__table td ol {
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(1em*2);
    margin-bottom: calc(1em*var(--lineHeight-lg))
}

.c-recruit__table td ol>li {
    margin-bottom: 0
}

.c-recruit__table td ol>li:not(:last-child) {
    margin-bottom: 0
}

.c-recruit__table td>:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.c-recruit__table td>.u-no-margin.u-no-margin.u-no-margin {
    margin-bottom: calc(calc((1em - 1lh) / 2) + 16px);
    margin-bottom: calc(var(--leading-trim) + 16px)
}

.c-recruit__table td>.u-no-margin.u-no-margin.u-no-margin:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .c-recruit__table tr:not(:last-child) {
        border-bottom: 1px solid #dcdcdc
    }
}

.c-recruit__table tr:not(:last-child) th {
    border-bottom: 1px solid #313e73;
    border-bottom: 1px solid var(--color-primary-light)
}

@media screen and (max-width: 767px) {
    .c-recruit__table tr:not(:last-child) th {
        border-bottom: 0
    }
}

.c-recruit__table tr:not(:last-child) td {
    border-bottom: 1px solid #dcdcdc
}

@media screen and (max-width: 767px) {
    .c-recruit__table tr:not(:last-child) td {
        border-bottom: 0
    }
}

.c-related {
    margin-bottom: 60px
}

@media screen and (max-width: 767px) {
    .c-related {
        margin-bottom: 40px
    }
}

.c-related__control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 30px
}

@media screen and (max-width: 767px) {
    .c-related__control {
        margin-bottom: 20px
    }
}

.c-related__control .c-cap-title {
    margin-bottom: 0
}

.c-return {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    max-width: 160px;
    width: 100%;
    min-height: 40px;
    color: #171717;
    font-size: .8125rem;
    text-align: center;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    text-decoration: none;
    padding-right: 16px;
    padding-left: 16px;
    background: #fff;
    border-radius: 4px;
    border: 1px solid #000;
    border: 1px solid var(--color-base);
    transition: background-color .3s, color .3s
}

.c-return::before {
    content: "";
    display: block;
    width: 4px
}

.c-return .c-icon {
    width: 4px;
    height: 8px;
    transition: fill .3s
}

.c-return:hover {
    color: #fff;
    background: #000;
    background: var(--color-base)
}

.c-return:hover .c-icon {
    fill: #fff
}

.c-return.-black {
    color: #fff;
    background: #000;
    background: var(--color-base)
}

.c-return.-black .c-icon {
    fill: #fff
}

.c-return.-black:hover {
    color: #171717;
    background-color: #fff
}

.c-return.-black:hover .c-icon {
    fill: #000;
    fill: var(--color-base)
}

.c-section {
    margin-top: 120px
}

@media screen and (max-width: 767px) {
    .c-section {
        margin-top: 60px
    }
}

.c-share {
    flex: 0 0 auto;
    display: flex;
    gap: 20px
}

@media screen and (max-width: 767px) {
    .c-share {
        gap: 16px
    }
}

@media screen and (max-width: 767px) {
    .a-header .c-share {
        margin-left: auto
    }
}

.c-share__button {
    display: flex;
    align-items: center;
    width: 24px;
    height: 24px
}

.c-share__button .c-icon {
    fill: #000;
    fill: var(--color-base);
    transition: transform .3s, fill .3s
}

.c-share__button .c-icon.-mail {
    width: 21px;
    height: 17px
}

.c-share__button .c-icon.-facebook {
    width: 24px;
    height: 24px
}

.c-share__button .c-icon.-x {
    width: 21px;
    height: 21px
}

.c-share__button .c-icon.-hatena {
    width: 23px;
    height: 19px
}

.c-share__button .c-icon.-copy {
    width: 22px;
    height: 22px
}

.c-share__button:hover .c-icon {
    fill: #313e73;
    fill: var(--color-primary-light);
    transform: scale(1.2)
}

.c-slider {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    position: relative;
    padding: 0 40px;
    padding: 0 var(--pad);
    overflow: hidden;
    z-index: 1
}

.c-slider__wrapper {
    max-width: 1200px;
    max-width: var(--width-default)
}

.c-slider__wrapper.swiper {
    overflow: visible
}

.c-slider-card {
    position: relative;
    display: flex;
    flex-direction: column;
    max-width: 380px;
    text-decoration: none;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .c-slider-card {
        max-width: 300px
    }
}

.c-grid.-index .c-slider-card {
    border: 1px solid #dcdcdc;
    border: 1px solid var(--border-light)
}

@media screen and (max-width: 767px) {
    .c-grid.-index .c-slider-card {
        max-width: none;
        border: 0
    }

    .c-grid.-index .c-slider-card:first-child {
        margin-bottom: 12px
    }

    .c-grid.-index .c-slider-card:not(:first-child) {
        flex-direction: row;
        align-items: flex-start;
        gap: 16px
    }
}

@media screen and (max-width: 767px) {
    .c-grid.-index.-paged .c-slider-card:first-child {
        flex-direction: row;
        align-items: flex-start;
        gap: 16px;
        margin-bottom: 0
    }
}

.c-slider-card.swiper-slide {
    display: flex
}

.c-slider__wrapper.swiper .c-slider-card {
    visibility: hidden;
    height: auto
}

.c-slider__wrapper.swiper .c-slider-card:not(:first-child) {
    display: none
}

.c-slider__wrapper.swiper.swiper-initialized .c-slider-card {
    max-width: none;
    visibility: visible
}

@media screen and (max-width: 767px) {
    .c-slider__wrapper.swiper.swiper-initialized .c-slider-card {
        max-width: 300px
    }
}

.c-slider__wrapper.swiper.swiper-initialized .c-slider-card:not(:first-child) {
    display: flex
}

.c-slider-card__ranking {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    aspect-ratio: 1/1;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-size: 1.5rem;
    font-weight: 500;
    font-weight: var(--fw-medium);
    color: #fff;
    background: #313e73;
    background: var(--color-primary-light);
    z-index: 2
}

@media screen and (max-width: 767px) {

    .c-grid.-index.-paged .c-slider-card:first-child .c-slider-card__ranking,
    .c-grid.-index .c-slider-card:not(:first-child) .c-slider-card__ranking {
        width: 24px;
        font-size: .75rem
    }
}

.c-slider-card__thumb {
    position: relative;
    aspect-ratio: 380/250;
    overflow: hidden;
    z-index: 1
}

.c-slider-card__thumb img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform .3s
}

.c-slider-card:hover .c-slider-card__thumb img {
    transform: scale(1.05)
}

@media screen and (max-width: 767px) {
    .c-grid.-index .c-slider-card:first-child .c-slider-card__thumb {
        margin-bottom: 20px
    }
}

@media screen and (max-width: 767px) {

    .c-grid.-index.-paged .c-slider-card:first-child .c-slider-card__thumb,
    .c-grid.-index .c-slider-card:not(:first-child) .c-slider-card__thumb {
        flex: 0 0 auto;
        aspect-ratio: 90/60;
        width: 90px;
        margin-bottom: 0
    }
}

.c-slider-card__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 6.3157894737% 7.8947368421%;
    background: #fff
}

@media screen and (max-width: 767px) {
    .c-slider-card__body {
        padding: 8.3333333333% 6.6666666667% 10.3333333333%
    }
}

@media screen and (max-width: 767px) {
    .c-grid.-index .c-slider-card .c-slider-card__body {
        padding: 0
    }
}

.c-slider-card__meta {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
    .c-grid.-index .c-slider-card:first-child .c-slider-card__meta {
        margin-bottom: 16px
    }
}

@media screen and (max-width: 767px) {

    .c-grid.-index.-paged .c-slider-card:first-child .c-slider-card__meta,
    .c-grid.-index .c-slider-card:not(:first-child) .c-slider-card__meta {
        margin-bottom: 8px
    }
}

.c-slider-card__categories {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-self: center
}

.c-slider-card__category {
    flex: 0 0 auto;
    font-size: .8125rem;
    color: #171717;
    line-height: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: calc(calc((1em - 1lh) / 2) + 6px) 12px;
    padding: calc(var(--leading-trim) + 6px) 12px;
    border: 1px solid #bfbfbf;
    border: 1px solid var(--border-dark);
    border-radius: 4px
}

@media screen and (max-width: 767px) {
    .c-slider-card__category {
        font-size: .6875rem;
        padding: calc(calc((1em - 1lh) / 2) + 6px) 8px;
        padding: calc(var(--leading-trim) + 6px) 8px
    }
}

@media screen and (max-width: 767px) {

    .c-grid.-index.-paged .c-slider-card:first-child .c-slider-card__category,
    .c-grid.-index .c-slider-card:not(:first-child) .c-slider-card__category {
        padding: 3px 4px
    }
}

.c-slider-card__fav {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .875rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-weight: 300;
    font-weight: var(--fw-light);
    line-height: 1;
    color: #7B8CD5;
    color: var(--color-fav);
    margin-top: calc(calc((1em - 1lh) / 2) + 4px);
    margin-top: calc(var(--leading-trim) + 4px);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .c-slider-card__fav {
        gap: 3px;
        font-size: .75rem
    }
}

.c-slider-card__fav .c-icon {
    width: 15px;
    height: 15px;
    fill: #fff;
    stroke: #7B8CD5;
    stroke: var(--color-fav)
}

@media screen and (max-width: 767px) {
    .c-slider-card__fav .c-icon {
        width: 9px;
        height: 9px
    }
}

.c-slider-card__title {
    font-size: .875rem;
    line-height: 2;
    line-height: var(--lineHeight-lg);
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
    margin-bottom: calc(var(--leading-trim) + 24px);
    transition: color .3s
}

@media screen and (max-width: 767px) {
    .c-slider-card__title {
        margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
        margin-bottom: calc(var(--leading-trim) + 20px)
    }
}

.c-slider-card:hover .c-slider-card__title {
    color: #313e73;
    color: var(--color-primary-light)
}

@media screen and (max-width: 767px) {
    .c-grid.-index .c-slider-card:first-child .c-slider-card__title {
        margin-bottom: calc(calc((1em - 1lh) / 2) + 16px);
        margin-bottom: calc(var(--leading-trim) + 16px)
    }
}

@media screen and (max-width: 767px) {

    .c-grid.-index.-paged .c-slider-card:first-child .c-slider-card__title,
    .c-grid.-index .c-slider-card:not(:first-child) .c-slider-card__title {
        font-size: .8125rem;
        line-height: 1.5384;
        -webkit-line-clamp: 2;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 12px);
        margin-bottom: calc(var(--leading-trim) + 12px)
    }
}

.c-slider-card__date {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: .875rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-weight: 300;
    font-weight: var(--fw-light);
    line-height: 1;
    margin-top: auto;
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim);
    font-family: var(--ff-date);
}

@media screen and (max-width: 767px) {
    .c-slider-card__date {
        margin-top: auto
    }
}

.c-slider-card.-premium .c-slider-card__date::after {
    content: "";
    display: block;
    width: 13px;
    height: 15px;
    background: #caa846;
    background: var(--color-premium);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    margin-top: -2px
}

@media screen and (max-width: 767px) {

    .c-grid.-index.-paged .c-slider-card:first-child .c-slider-card__date,
    .c-grid.-index .c-slider-card:not(:first-child) .c-slider-card__date {
        font-size: .75rem
    }
}

.c-slider-nav {
    flex: 0 0 auto;
    display: flex;
    gap: 20px
}

@media screen and (max-width: 767px) {
    .c-slider-nav {
        display: none
    }
}

.c-slider-nav__prev,
.c-slider-nav__next {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0);
    border: 0;
    border-radius: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background: #000;
    background: var(--color-base);
    border-radius: 50%;
    transition: background-color .3s, opacity .3s
}

.c-slider-nav__prev .c-icon,
.c-slider-nav__next .c-icon {
    width: 9px;
    height: 15px;
    fill: #fff
}

.c-slider-nav__prev:hover,
.c-slider-nav__next:hover {
    background-color: #313e73;
    background-color: var(--color-primary-light)
}

.c-slider-nav__prev.swiper-button-disabled,
.c-slider-nav__next.swiper-button-disabled {
    opacity: .3
}

.c-slider-nav__prev.swiper-button-disabled:hover,
.c-slider-nav__next.swiper-button-disabled:hover {
    background-color: #000;
    background-color: var(--color-base)
}

.c-slider-nav__prev {
    transform: rotate(180deg)
}

.c-summary {
    margin-top: 64px;
    margin-bottom: 64px;
    padding: 40px;
    background: #f0f0f0;
    background: var(--bg-light)
}

@media screen and (max-width: 767px) {
    .c-summary {
        margin-top: 40px;
        margin-bottom: 40px;
        padding: 30px
    }
}

.c-summary__title {
    font-size: 1.625rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 32px);
    margin-bottom: calc(var(--leading-trim) + 32px)
}

@media screen and (max-width: 767px) {
    .c-summary__title {
        font-size: 1rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
        margin-bottom: calc(var(--leading-trim) + 24px)
    }
}

.c-summary>:last-child {
    margin-bottom: 0
}

.c-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 16px;
    font-size: .75rem;
    line-height: 1;
    height: 30px;
    color: #1b1b1b;
    text-decoration: none;
    border: 1px solid #aaa;
    border-radius: 5px;
    transition: border-color .3s, background-color .3s, color .3s
}

@media screen and (max-width: 767px) {
    .c-tag {
        font-size: .625rem;
        padding: 4px 12px
    }
}

.c-tag:hover {
    border-color: #313e73;
    border-color: var(--color-primary-light);
    background-color: #313e73;
    background-color: var(--color-primary-light);
    color: #fff
}

.c-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px
}

.c-tags__item>* {
    vertical-align: top
}

.c-title-center {
    font-size: 1.5rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    text-align: center;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 2.5rem);
    margin-bottom: calc(var(--leading-trim) + var(--mg-md))
}

@media screen and (max-width: 767px) {
    .c-title-center {
        font-size: 1.125rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 1.5rem);
        margin-bottom: calc(var(--leading-trim) + var(--mg-sm))
    }
}

.c-updated {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .875rem;
    color: #a3a3a3;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim);
    letter-spacing: 0;
    font-family: var(--ff-date);
}

@media screen and (max-width: 767px) {
    .c-updated {
        font-size: .75rem
    }
}

.c-updated .c-icon {
    width: 13px;
    height: 13px;
    fill: #7f7f7f
}

@media screen and (max-width: 767px) {
    .c-updated .c-icon {
        width: 11px;
        height: 11px
    }
}

.a-header .c-updated {
    flex: 0 0 auto
}

@media screen and (max-width: 767px) {
    .a-header .c-updated {
        order: 4;
        grid-column: 3/5
    }
}

.abt-contents {
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 40px;
    gap: var(--pad);
    margin-top: 80px;
    margin-bottom: 80px;
    padding-bottom: 40px
}

@media screen and (max-width: 992px) {
    .abt-contents {
        margin-bottom: 56px
    }
}

@media screen and (max-width: 767px) {
    .abt-contents {
        flex-direction: column;
        gap: 40px;
        margin-top: 40px;
        margin-bottom: 24px
    }
}

.abt-header+.abt-contents {
    margin-top: 80px
}

@media screen and (max-width: 992px) {
    .abt-header+.abt-contents {
        margin-top: 64px
    }
}

@media screen and (max-width: 767px) {
    .abt-header+.abt-contents {
        margin-top: 40px
    }
}

.abt-contents.-section1 {
    padding-bottom: 43px
}

.abt-contents::after {
    content: "";
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 438px;
    background: #f0f0f0;
    background: var(--bg-light);
    z-index: -1
}

.abt-contents.-section1::after {
    height: 315px
}

@media screen and (max-width: 1600px) {
    .abt-contents.-section1::after {
        height: calc(340px + (315 - 340)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-contents.-section1::after {
        height: 350px
    }
}

@media screen and (max-width: 767px) {
    .abt-contents.-section1::after {
        height: 300px
    }
}

.abt-contents.-section2::after {
    height: 415px
}

@media screen and (max-width: 992px) {
    .abt-contents.-section2::after {
        height: 390px
    }
}

@media screen and (max-width: 767px) {
    .abt-contents.-section2::after {
        height: 300px
    }
}

.abt-contents.-section3::after {
    height: 352px
}

@media screen and (max-width: 1200px) {
    .abt-contents.-section3::after {
        height: calc(290px + (330 - 290)*(100vw - 993px)/(1200 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-contents.-section3::after {
        height: 275px
    }
}

@media screen and (max-width: 767px) {
    .abt-contents.-section3::after {
        height: 300px
    }
}

.abt-contents__img {
    flex: 0 0 auto
}

.abt-contents.-section1 .abt-contents__img {
    order: 2;
    text-align: right;
    max-width: 250px
}

@media screen and (max-width: 767px) {
    .abt-contents.-section1 .abt-contents__img {
        max-width: none;
        width: 100%;
        text-align: center
    }
}

.abt-contents.-section2 .abt-contents__img {
    order: 1;
    max-width: 405px;
    width: 33.75%
}

@media screen and (max-width: 767px) {
    .abt-contents.-section2 .abt-contents__img {
        max-width: none;
        width: 100%;
        order: 2
    }
}

.abt-contents.-section3 .abt-contents__img {
    order: 2;
    max-width: 405px;
    width: 33.75%
}

@media screen and (max-width: 767px) {
    .abt-contents.-section3 .abt-contents__img {
        max-width: none;
        width: 100%
    }
}

.abt-contents__body {
    flex: 1 1 auto;
    padding-top: 20px
}

@media screen and (max-width: 767px) {
    .abt-contents__body {
        padding-top: 0
    }
}

.abt-contents.-section1 .abt-contents__body {
    order: 1;
    max-width: 840px
}

@media screen and (max-width: 767px) {
    .abt-contents.-section1 .abt-contents__body {
        max-width: none
    }
}

.abt-contents.-section2 .abt-contents__body {
    order: 2;
    max-width: 715px
}

@media screen and (max-width: 767px) {
    .abt-contents.-section2 .abt-contents__body {
        order: 1;
        max-width: none
    }
}

.abt-contents.-section3 .abt-contents__body {
    order: 1;
    max-width: 715px
}

@media screen and (max-width: 767px) {
    .abt-contents.-section3 .abt-contents__body {
        max-width: none
    }
}

.abt-contents__body p:not([class]) {
    font-size: 1rem;
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 992px) {
    .abt-contents__body p:not([class]) {
        font-size: .875rem
    }
}

.abt-header {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    display: flex
}

@media screen and (max-width: 767px) {
    .abt-header {
        flex-direction: column;
        gap: 40px
    }
}

.abt-header__img {
    flex: 0 0 auto;
    max-width: 1000px;
    width: 52.0833333333%
}

@media screen and (max-width: 992px) {
    .abt-header__img {
        width: 45%
    }
}

@media screen and (max-width: 767px) {
    .abt-header__img {
        width: 100%;
        aspect-ratio: 790/340
    }
}

.abt-header__img img {
    display: block;
    max-width: none;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center right;
    object-position: center right
}

.abt-header__body {
    align-self: center;
    display: flex;
    flex-direction: column;
    gap: 48px;
    padding: 40px 60px;
    max-width: 900px
}

@media screen and (max-width: 1600px) {
    .abt-header__body {
        gap: calc(32px + (48 - 32)*(100vw - 993px)/(1600 - 993));
        padding-left: calc(40px + (60 - 40)*(100vw - 993px)/(1600 - 993));
        padding-right: calc(40px + (60 - 40)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-header__body {
        padding: 40px 24px
    }
}

@media screen and (max-width: 767px) {
    .abt-header__body {
        max-width: none;
        padding: 0 40px;
        padding: 0 var(--pad);
        gap: 30px
    }
}

.abt-header-title {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.abt-header-title__en {
    display: flex;
    align-items: center;
    gap: 24px;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-weight: 400;
    font-weight: var(--fw-normal);
    font-size: 3rem;
    margin-top: calc((1em - 1lh)/2);
    margin-bottom: calc((1em - 1lh)/2)
}

@media screen and (max-width: 1600px) {
    .abt-header-title__en {
        font-size: calc(28px + (48 - 28)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-header-title__en {
        font-size: 1.625rem
    }
}

@media screen and (max-width: 767px) {
    .abt-header-title__en {
        font-size: 1.5rem;
        gap: 16px
    }
}

.abt-header-title__en::after {
    content: "";
    display: block;
    flex: 1 1 auto;
    height: 1px;
    background: #000;
    background: var(--color-base)
}

.abt-header-title__jp {
    display: block;
    font-size: .875rem;
    font-weight: 400;
    font-weight: var(--fw-normal)
}

.abt-header__lead {
    font-size: 1.5rem;
    line-height: 2;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 1600px) {
    .abt-header__lead {
        font-size: calc(18px + (28 - 18)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-header__lead {
        font-size: 1.125rem
    }
}

.abt-header p:not([class]) {
    font-size: 1.125rem;
    line-height: 2;
    line-height: var(--lineHeight-lg);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 1600px) {
    .abt-header p:not([class]) {
        font-size: calc(14px + (18 - 14)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-header p:not([class]) {
        font-size: .875rem
    }
}

.abt-image img {
    filter: drop-shadow(-10px -10px 50px rgba(0, 0, 0, 0.3))
}

@media screen and (max-width: 767px) {
    .abt-image img {
        filter: drop-shadow(0 0 20px rgba(0, 0, 0, 0.2))
    }
}

.abt-title {
    display: flex;
    flex-direction: column;
    margin-bottom: 70px
}

@media screen and (max-width: 992px) {
    .abt-title {
        margin-bottom: 60px
    }
}

@media screen and (max-width: 767px) {
    .abt-title {
        margin-bottom: 30px
    }
}

.abt-title__en {
    display: block;
    font-size: 5rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-weight: 700;
    font-weight: var(--fw-bold);
    color: #313e73;
    color: var(--color-primary-light);
    line-height: 82.6771653543%;
    margin-top: calc((1em - 1lh)/2);
    margin-bottom: calc((1em - 1lh)/2 + 24px)
}

@media screen and (max-width: 1600px) {
    .abt-title__en {
        font-size: calc(64px + (80 - 64)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 767px) {
    .abt-title__en {
        font-size: 2.5rem
    }
}

.abt-title__en::after {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light);
    margin-top: 20px
}

@media screen and (max-width: 767px) {
    .abt-title__en::after {
        width: 60px
    }
}

.abt-title__jp {
    display: block;
    font-size: 2rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 1600px) {
    .abt-title__jp {
        font-size: calc(24px + (32 - 24)*(100vw - 993px)/(1600 - 993))
    }
}

@media screen and (max-width: 992px) {
    .abt-title__jp {
        font-size: 1.375rem
    }
}

@media screen and (max-width: 767px) {
    .abt-title__jp {
        font-size: 1.25rem
    }
}

.abt-title2 {
    position: relative;
    display: flex;
    flex-direction: column;
    font-size: 1.125rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    padding-left: 18px;
    margin-top: calc(calc((1em - 1lh) / 2) + 40px);
    margin-top: calc(var(--leading-trim) + 40px);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
    margin-bottom: calc(var(--leading-trim) + 20px)
}

@media screen and (max-width: 767px) {
    .abt-title2 {
        font-size: 1rem
    }
}

.abt-title2::before {
    content: "";
    display: block;
    position: absolute;
    top: 12px;
    left: 0;
    width: 8px;
    height: 8px;
    background: #000;
    background: var(--color-base);
    border-radius: 50%
}

@media screen and (max-width: 767px) {
    .abt-title2::before {
        top: 10px
    }
}

.interviewee {
    color: #578a4a
}

.interviewer {
    color: #455c85
}

.a-download {
    text-align: center;
    margin-top: 60px;
    padding: 40px;
    background: #f0f0f0;
    background: var(--bg-light)
}

.a-footer {
    margin-top: 80px
}

@media screen and (max-width: 767px) {
    .a-footer {
        margin-top: 48px
    }
}

.a-footer__top {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    grid-gap: 20px 40px;
    gap: 20px 40px;
    margin-bottom: 25px
}

@media screen and (max-width: 1279px) {
    .a-footer__top {
        gap: 20px 24px
    }
}

@media screen and (max-width: 767px) {
    .a-footer__top {
        grid-template-columns: auto;
        margin-bottom: 32px
    }
}

.a-footer__date {
    order: 1;
    display: flex;
    align-items: center;
    gap: 40px
}

@media screen and (max-width: 1279px) {
    .a-footer__date {
        gap: 24px
    }
}

@media screen and (max-width: 767px) {
    .a-footer__date {
        gap: 30px
    }
}

.a-footer__meta {
    order: 3;
    grid-column: 1/3;
    display: flex;
    align-items: center;
    gap: 24px
}

@media screen and (max-width: 767px) {
    .a-footer__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        order: 2;
        grid-column: 1/2
    }
}

.a-footer__share {
    order: 2;
    display: flex;
    align-items: center;
    gap: 40px;
    margin-left: auto
}

@media screen and (max-width: 1279px) {
    .a-footer__share {
        gap: 24px
    }
}

@media screen and (max-width: 767px) {
    .a-footer__share {
        order: 3;
        justify-content: space-between;
        margin-left: 0
    }
}

.a-footer__category {
    font-size: .8125rem;
    color: #000;
    color: var(--color-base)
}

@media screen and (max-width: 767px) {
    .a-footer__category {
        margin-top: calc((1em - 1lh) / 2);
        margin-top: var(--leading-trim);
        margin-bottom: calc((1em - 1lh) / 2);
        margin-bottom: var(--leading-trim)
    }
}

.a-footer__category>a {
    display: inline-block;
    text-decoration: none
}

.a-footer__category>a:hover {
    text-decoration: underline
}

.a-footer__bottom {
    display: grid;
    grid-template-columns: 1fr 160px 1fr;
    align-items: center;
    border-top: 1px solid #ccc;
    padding-top: 56px
}

@media screen and (max-width: 767px) {
    .a-footer__bottom {
        gap: 20px;
        padding-top: 32px;
        grid-template-columns: 1fr 1fr
    }
}

.a-footer__bottom::before,
.a-footer__bottom::after {
    content: "";
    display: block
}

.a-footer__bottom:only-child {
    border-top: 0;
    padding-top: 0
}

.a-footer__bottom:has(.a-footer__prev)::before {
    content: none
}

.a-footer__bottom:has(.a-footer__next)::after {
    content: none
}

@media screen and (max-width: 767px) {
    .a-footer__bottom .c-return {
        order: 3;
        grid-column: 1/3;
        margin-left: auto;
        margin-right: auto
    }
}

.a-footer__prev {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    text-decoration: none;
    margin-right: auto;
    transition: color .3s
}

@media screen and (max-width: 767px) {
    .a-footer__prev {
        order: 1;
        font-size: .875rem
    }
}

.a-footer__prev .c-icon {
    flex: 0 0 auto;
    width: 5px;
    height: 9px;
    fill: #000;
    fill: var(--color-base);
    transform: rotate(180deg);
    transition: fill .3s
}

.a-footer__prev::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    right: 0;
    width: calc(100% - 20px - 5px);
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light);
    transform-origin: left top;
    transform: scaleX(0);
    transition: transform .3s
}

.a-footer__prev:hover {
    color: #313e73;
    color: var(--color-primary-light)
}

.a-footer__prev:hover .c-icon {
    fill: #313e73;
    fill: var(--color-primary-light)
}

.a-footer__prev:hover::after {
    transform: scaleX(1);
    transform-origin: right top
}

.a-footer__next {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    text-decoration: none;
    margin-left: auto;
    transition: color .3s
}

@media screen and (max-width: 767px) {
    .a-footer__next {
        order: 2;
        font-size: .875rem
    }
}

.a-footer__next .c-icon {
    flex: 0 0 auto;
    width: 5px;
    height: 9px;
    fill: #000;
    fill: var(--color-base);
    order: 2;
    transition: fill .3s
}

.a-footer__next::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    width: calc(100% - 20px - 5px);
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light);
    transform-origin: right top;
    transform: scaleX(0);
    transition: transform .3s
}

.a-footer__next:hover {
    color: #313e73;
    color: var(--color-primary-light)
}

.a-footer__next:hover .c-icon {
    fill: #313e73;
    fill: var(--color-primary-light)
}

.a-footer__next:hover::after {
    transform: scaleX(1);
    transform-origin: left top
}

.a-header {
    margin-bottom: 48px
}

@media screen and (max-width: 767px) {
    .a-header {
        margin-bottom: 20px
    }
}

.a-header__top {
    display: flex;
    align-items: center;
    gap: 36px;
    margin-bottom: 20px
}

@media screen and (max-width: 767px) {
    .a-header__top {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-gap: 12px 32px;
        gap: 12px 32px
    }
}

.a-header__category {
    flex: 1 1 auto;
    color: #171717;
    font-size: .8125rem;
    margin-right: auto;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.a-header__category>a {
    display: inline-block;
    text-decoration: none
}

.a-header__category>a:hover {
    text-decoration: underline
}

.a-header__date {
    flex: 0 0 auto;
    display: flex;
    gap: 36px
}

@media screen and (max-width: 767px) {
    .a-header__date {
        grid-column: 1/3;
        order: 3
    }
}

.a-header__title {
    font-size: 1.625rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    line-height: 1.5384;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .a-header__title {
        font-size: .9375rem;
        line-height: 2
    }
}

.a-header__title .c-icon.-key {
    width: 19px;
    height: 22px;
    margin-right: 4px;
    fill: #caa846;
    fill: var(--color-premium)
}

@media screen and (max-width: 767px) {
    .a-header__title .c-icon.-key {
        width: 14px;
        height: 18px;
        vertical-align: -2px
    }
}

.a-header__bottom {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-top: 20px
}

@media screen and (max-width: 767px) {
    .a-header__bottom {
        flex-direction: column;
        gap: 8px
    }
}

.a-mv {
    margin-bottom: 45px
}

@media screen and (max-width: 767px) {
    .a-mv {
        margin-bottom: 28px
    }
}

.mailpoet-unsubscribe {
    max-width: 800px;
    margin: 0 auto;
    padding: 40px;
    border: 4px solid #bfbfbf
}

@media screen and (max-width: 767px) {
    .mailpoet-unsubscribe {
        padding: 24px 20px;
        border-width: 2px
    }
}

.mailpoet-unsubscribe__desc {
    text-align: center;
    font-size: 1.5rem
}

@media screen and (max-width: 992px) {
    .mailpoet-unsubscribe__desc {
        font-size: 1.125rem
    }
}

@media screen and (max-width: 767px) {
    .mailpoet-unsubscribe__desc {
        font-size: .875rem
    }
}

.mailpoet-unsubscribe__desc:not(:last-child) {
    margin-bottom: 2.5rem;
    margin-bottom: var(--mg-md)
}

@media screen and (max-width: 767px) {
    .mailpoet-unsubscribe__desc:not(:last-child) {
        margin-bottom: 1.5rem;
        margin-bottom: var(--mg-sm)
    }
}

.mailpoet-unsubscribe__link {
    text-align: center
}

.mailpoet-unsubscribe__link>a {
    display: inline-block;
    font-size: 1.5rem
}

@media screen and (max-width: 992px) {
    .mailpoet-unsubscribe__link>a {
        font-size: 1.125rem
    }
}

@media screen and (max-width: 767px) {
    .mailpoet-unsubscribe__link>a {
        font-size: .875rem
    }
}

.mailpoet-unsubscribe .c-block {
    text-align: center
}

.mailpoet-unsubscribe .c-block>a {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    max-width: 300px;
    width: 100%;
    min-height: 70px;
    color: #fff;
    font-size: 1.25rem;
    text-align: center;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    text-decoration: none;
    margin: 0;
    padding: 8px 30px 8px 40px;
    background: #000;
    background: var(--color-base);
    border: 0;
    border-radius: 4px;
    transition: background-color .3s;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .mailpoet-unsubscribe .c-block>a {
        max-width: 240px;
        min-height: 50px;
        font-size: 1rem
    }
}

.mailpoet-unsubscribe .c-block>a::after {
    content: "";
    display: block;
    width: 7px;
    height: 12px;
    background: #fff;
    -webkit-mask: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40.305 73.539"><path d="M0,70,33.234,36.77,0,3.535,3.535,0,40.3,36.77,3.535,73.539Z" /></svg>') no-repeat 0 0/contain;
    mask: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40.305 73.539"><path d="M0,70,33.234,36.77,0,3.535,3.535,0,40.3,36.77,3.535,73.539Z" /></svg>') no-repeat 0 0/contain
}

.mailpoet-unsubscribe .c-block>a:hover {
    background-color: #0F1B3E;
    background-color: var(--color-primary)
}

.ms-account__message {
    text-align: center;
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.ms-account .c-block {
    text-align: center
}

.ms-expired {
    text-align: center;
    font-size: 1rem;
    color: #707070;
    max-width: 460px;
    margin-left: auto;
    margin-right: auto;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .ms-expired {
        font-size: .875rem
    }
}

.ms-expired>a {
    position: relative;
    display: inline-block;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    color: #707070;
    text-decoration: none
}

.ms-expired>a::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 1px;
    background: #707070;
}

.ms-expired>a:hover::after {
    display: none
}

.ms-agree {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 800px;
    margin: 40px auto 0;
    padding: 24px 40px;
    padding: 24px var(--pad);
    background: #f0f0f0;
    background: var(--bg-light)
}

@media screen and (max-width: 767px) {
    .ms-agree {
        margin-top: 24px;
        padding-top: 16px;
        padding-bottom: 16px
    }
}

.l-contents.-single .ms-agree {
    max-width: 460px
}

.ms-agree__desc {
    text-align: center
}

@media screen and (max-width: 767px) {
    .ms-agree__desc {
        font-size: .875rem
    }
}

.ms-agree__desc>a {
    color: #313e73;
    color: var(--color-primary-light)
}

.ms-benefits {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 40px;
    gap: 40px
}

@media screen and (max-width: 992px) {
    .ms-benefits {
        gap: 24px
    }
}

@media screen and (max-width: 767px) {
    .ms-benefits {
        grid-template-columns: repeat(1, 1fr)
    }
}

.ms-benefits__title {
    font-size: 1rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    text-align: center;
    margin-bottom: calc(calc((1em - 1lh) / 2) + 12px);
    margin-bottom: calc(var(--leading-trim) + 12px)
}

.ms-benefits__title>b {
    display: inline-block;
    font-size: 2rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-weight: 400;
    font-weight: var(--fw-normal);
    vertical-align: baseline;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.ms-benefits__img {
    margin-bottom: 20px
}

.ms-benefits__desc {
    font-size: 1.375rem;
    text-align: center;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 1279px) {
    .ms-benefits__desc {
        font-size: calc(15px + (22 - 15)*(100vw - 769px)/(1280 - 769))
    }
}

@media screen and (max-width: 767px) {
    .ms-benefits__desc {
        font-size: 1.125rem
    }
}

.ms-benefits__desc>b {
    font-weight: 400;
    font-weight: var(--fw-normal);
    color: #caa846;
    color: var(--color-premium)
}

.ms-form__item {
    max-width: 460px;
    margin: 0 auto 24px
}

.reg-contents .ms-form__item {
    max-width: 100%
}

.l-contents.-mypage .ms-form__item {
    max-width: 460px;
    margin-left: 0
}

@media screen and (max-width: 992px) {
    .l-contents.-mypage .ms-form__item {
        margin-left: auto
    }
}

.ms-form__header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 30px;
    margin-bottom: 10px
}

@media screen and (max-width: 767px) {
    .ms-form__header {
        flex-direction: column
    }
}

.l-contents.-mypage .ms-form__header {
    justify-content: flex-start
}

@media screen and (max-width: 992px) {
    .l-contents.-mypage .ms-form__header {
        justify-content: center
    }
}

.ms-form__header.-col {
    flex-direction: column;
    gap: 8px
}

.ms-form__label {
    display: block;
    font-size: 1.25rem;
    text-align: center;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 10px);
    margin-bottom: calc(var(--leading-trim) + 10px)
}

@media screen and (max-width: 767px) {
    .ms-form__label {
        font-size: 1rem
    }
}

.ms-form__header .ms-form__label {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .ms-form__header .ms-form__label {
        margin-bottom: calc((1em - 1lh) / 2);
        margin-bottom: var(--leading-trim)
    }
}

.l-contents.-mypage .ms-form__label {
    text-align: left
}

@media screen and (max-width: 992px) {
    .l-contents.-mypage .ms-form__label {
        text-align: center
    }
}

.ms-form__note {
    color: #707070;
    font-size: .75rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .ms-form__note {
        font-size: .75rem
    }
}

.ms-form__field-row {
    display: flex;
    gap: 8px;
}

.ms-form__field-row .ms-form__field-col {
    flex: 1;
    min-width: 0;
}

.ms-form__field input[type=text],
.ms-form__field input[type=password] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    font-size: 1rem;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    width: 100%;
    height: 45px;
    padding: 13px 16px 12px;
    border: 2px solid #dcdcdc;
    border: 2px solid var(--border-light);
    border-radius: 4px
}

.ms-form__field input[type=text]::-moz-placeholder,
.ms-form__field input[type=password]::-moz-placeholder {
    color: #9c9c9c
}

.ms-form__field input[type=text]::placeholder,
.ms-form__field input[type=password]::placeholder {
    color: #9c9c9c
}

.ms-form__field input[type=text]:-moz-read-only,
.ms-form__field input[type=password]:-moz-read-only {
    outline: 0
}

.ms-form__field input[type=text]:read-only,
.ms-form__field input[type=password]:read-only {
    outline: 0
}

.ms-form__field input[type=checkbox] {
    flex: 0 0 auto;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    margin: 2px 0 0;
    padding: 0;
    background: #fff;
    border: 2px solid #dcdcdc;
    border: 2px solid var(--border-light);
    border-radius: 2px
}

.ms-form__field input[type=checkbox]:checked {
    background: #fff url("../img/common/icon_checkbox.webp") no-repeat center/16px 12px
}

.ms-form__field select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    font-size: 1rem;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    width: 100%;
    height: 45px;
    color: #171717;
    line-height: 1;
    padding: 12px 40px 13px 16px;
    border: 2px solid #dcdcdc;
    border: 2px solid var(--border-light);
    border-radius: 4px;
    background: url("../img/common/icon_select.webp") no-repeat right 20px center/14px 7px
}

.ms-form__field.-password {
    position: relative
}

.ms-form__field.-password input {
    padding-right: 70px
}

@media screen and (max-width: 767px) {
    .ms-form__field.-password input {
        padding-right: 59px
    }
}

.ms-form__field.-error input,
.ms-form__field.-error select {
    border-color: #D30000;
    border-color: var(--color-red)
}

.ms-form__field.-date {
    display: flex;
    gap: 13px
}

@media screen and (max-width: 767px) {
    .ms-form__field.-date {
        display: grid;
        grid-template-columns: repeat(2, 1fr)
    }
}

.ms-form__field.-date #year {
    flex: 1 1 auto
}

@media screen and (max-width: 767px) {
    .ms-form__field.-date #year {
        grid-column: 1/3
    }
}

.ms-form__field.-date #month {
    flex: 0 0 auto;
    width: 120px
}

@media screen and (max-width: 767px) {
    .ms-form__field.-date #month {
        width: auto
    }
}

.ms-form__field.-date #day {
    flex: 0 0 auto;
    width: 120px
}

@media screen and (max-width: 767px) {
    .ms-form__field.-date #day {
        width: auto
    }
}

.ms-form__field.-date.-error select {
    border-color: #000;
    border-color: var(--color-base)
}

.ms-form__field.-date.-error select.is-empty {
    border-color: #D30000;
    border-color: var(--color-red)
}

.ms-form__field.-checkbox {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 6px
}

.ms-form__field.-checkbox label {
    display: block;
    font-size: .9375rem
}

@media screen and (max-width: 992px) {
    .ms-form__field.-username {
        text-align: center;
    }
}

.ms-form__error {
    display: none
}

.ms-form__error.-show {
    display: block;
    text-align: center;
    color: #D30000;
    color: var(--color-red);
    margin-top: calc(calc((1em - 1lh) / 2) + 16px);
    margin-top: calc(var(--leading-trim) + 16px);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.l-contents.-mypage .ms-form__error {
    text-align: left
}

@media screen and (max-width: 992px) {
    .l-contents.-mypage .ms-form__error {
        text-align: center
    }
}

.ms-form-visible {
    position: absolute;
    top: 50%;
    right: 24px;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    color: #171717;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
    transform: translateY(-50%)
}

.ms-form-visible__icon {
    position: relative;
    display: block;
    width: 26px;
    height: 26px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;
    background-image: url("../img/common/icon_password.webp");
}

@media screen and (max-width: 767px) {
    .ms-form-visible__icon {
        width: 24px;
        height: 24px
    }
}

.ms-form-visible__icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 1px;
    background: #000;
    background: var(--color-base);
    transform: translate(-50%, -50%) rotate(45deg)
}

@media screen and (max-width: 767px) {
    .ms-form-visible__icon::before {
        width: 28px
    }
}

.ms-form-visible[aria-pressed=true] .ms-form-visible__icon::before {
    visibility: hidden
}

.ms-form-visible__balloon {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    white-space: nowrap;
    color: #fff;
    opacity: 0;
    font-size: .75rem;
    visibility: hidden;
    padding: 8px 12px;
    transform: translate(-50%, 4px);
    background: #0F1B3E;
    background: var(--color-primary);
    border-radius: 5px;
    transition: transform .3s, opacity .3s, visibility .3s;
    z-index: 1
}

@media screen and (max-width: 767px) {
    .ms-form-visible__balloon {
        left: calc(50% - 40px);
        font-size: .625rem;
        padding: 4px 8px
    }
}

.ms-form-visible:hover .ms-form-visible__balloon {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0)
}

.ms-form-visible__balloon::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 10px;
    height: 6px;
    background: #0F1B3E;
    background: var(--color-primary);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    margin: 0 auto
}

@media screen and (max-width: 767px) {
    .ms-form-visible__balloon::after {
        left: 80px
    }
}

.ms-form__link {
    text-align: center;
    margin-top: calc(calc((1em - 1lh) / 2) + 8px);
    margin-top: calc(var(--leading-trim) + 8px);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.ms-form__link>a {
    display: inline-block;
    font-size: 1.25rem;
    color: #707070;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .ms-form__link>a {
        font-size: .875rem
    }
}

.ms-form__buttons {
    margin-top: 40px;
    margin-bottom: 40px;
    text-align: center
}

.l-contents.-mypage .ms-form__buttons {
    margin: 40px 0 0;
    text-align: left
}

@media screen and (max-width: 992px) {
    .l-contents.-mypage .ms-form__buttons {
        text-align: center
    }
}

.l-contents.-mypage .ms-form__buttons:not(:last-child) {
    margin-bottom: 40px
}

.ms-form__buttons>:last-child {
    margin-bottom: 0
}

.wpmem_msg {
    font-size: 1.25rem;
    max-width: 510px;
    padding: 24px;
    text-align: center;
    border: 4px solid #bfbfbf;
    border: 4px solid var(--border-dark);
    margin: 0 auto 40px;
    margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
    .wpmem_msg {
        font-size: 1rem;
        padding: 16px;
        margin-bottom: 20px
    }
}

.wpmem_msg+ul:not([class]) {
    display: none
}

.login_status {
    max-width: 510px;
    padding: 32px;
    border: 4px solid #bfbfbf;
    border: 4px solid var(--border-dark);
    margin: 0 auto 40px
}

@media screen and (max-width: 767px) {
    .login_status {
        padding: 16px;
        margin-bottom: 20px
    }
}

.ms-title {
    font-size: 1.5rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 30px);
    margin-bottom: calc(var(--leading-trim) + 30px);
    text-align: center
}

@media screen and (max-width: 767px) {
    .ms-title {
        font-size: 1.25rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
        margin-bottom: calc(var(--leading-trim) + 24px)
    }
}

.ms-toggle {
    text-align: center;
    font-size: 1.25rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .ms-toggle {
        font-size: 1rem
    }
}

.ms-toggle>a {
    position: relative;
    display: inline-block;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    color: #313e73;
    color: var(--color-primary-light);
    text-decoration: none
}

.ms-toggle>a::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light)
}

.ms-toggle>a:hover::after {
    display: none
}

.ms-wrapper fieldset {
    position: absolute;
    height: 0;
    visibility: hidden
}

.mailpoet-manage-subscription {
    position: absolute;
    height: 0;
    visibility: hidden
}

.mp-alert {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    max-width: 510px;
    width: 100%;
    margin: 0;
    margin-bottom: 40px;
    padding: 24px;
    border: 4px solid #bfbfbf;
    border: 4px solid var(--border-dark)
}

@media screen and (max-width: 992px) {
    .mp-alert {
        margin-left: auto;
        margin-right: auto
    }
}

@media screen and (max-width: 767px) {
    .mp-alert {
        gap: 20px;
        padding: 20px;
        margin-bottom: 40px
    }
}

.mp-alert__icon {
    text-align: center
}

@media screen and (max-width: 767px) {
    .mp-alert__icon img {
        width: 40px
    }
}

.mp-alert__desc {
    font-size: 1.5rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .mp-alert__desc {
        font-size: 1rem
    }
}

.mp-alert__desc strong {
    font-weight: 400;
    font-weight: var(--fw-normal)
}

.mp-list {
    display: flex;
    gap: 40px;
    margin-bottom: 40px
}

.mp-nav__item:not(:last-child) {
    border-bottom: 1px solid #fff
}

.mp-nav__item>a {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 1rem;
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    padding: 12px 16px 12px 44px;
    text-decoration: none;
    min-height: 60px;
    background: #f0f0f0;
    transition: color .3s, background-color .3s
}

.mp-nav__item>a .c-icon {
    position: absolute;
    top: 50%;
    left: 16px;
    fill: #000;
    fill: var(--color-base);
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    transition: transform .3s, fill .3s
}

.mp-nav__item>a .c-icon.-fav {
    fill: rgba(0, 0, 0, 0);
    stroke: #000;
    stroke: var(--color-base);
    stroke-linejoin: round;
    stroke-width: 1px;
    transition: transform .3s, stroke .3s
}

.mp-nav__item>a .c-icon.-fav use {
    display: block;
    transform: scale(0.9);
    transform-origin: center center
}

.mp-nav__item>a:hover {
    color: #fff;
    background-color: #000;
    background-color: var(--color-base)
}

.mp-nav__item>a:hover .c-icon {
    fill: #fff;
    transform: translateY(-50%) scale(1.2)
}

.mp-nav__item>a:hover .c-icon.-fav {
    fill: rgba(0, 0, 0, 0);
    stroke: #fff
}

.mp-nav__item>a[aria-current=page] {
    color: #fff;
    background-color: #000;
    background-color: var(--color-base)
}

.mp-nav__item>a[aria-current=page] .c-icon {
    fill: #fff;
    transform: translateY(-50%) scale(1.2)
}

.mp-nav__item>a[aria-current=page] .c-icon.-fav {
    fill: rgba(0, 0, 0, 0);
    stroke: #fff
}

.mp-title {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 2rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 40px);
    margin-bottom: calc(var(--leading-trim) + 40px)
}

@media screen and (max-width: 767px) {
    .mp-title {
        font-size: 1.5rem;
        gap: 16px;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
        margin-bottom: calc(var(--leading-trim) + 20px)
    }
}

.mp-title::before {
    content: "";
    flex: 0 0 auto;
    display: block;
    width: 100px;
    height: 1px;
    background: #000;
    background: var(--color-base)
}

@media screen and (max-width: 767px) {
    .mp-title::before {
        width: 40px
    }
}

.mp-radio {
    display: inline-flex;
    align-items: center;
    gap: 16px
}

.mp-radio__input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    background: #fff;
    border: 2px solid #dcdcdc;
    border-radius: 50%
}

.mp-radio__input:checked {
    box-shadow: 0 0 0 3px #fff inset;
    background: #313e73;
    background: var(--color-primary-light);
    border-color: #313e73;
    border-color: var(--color-primary-light)
}

.mp-radio__label {
    display: inline-block;
    font-size: 1.25rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.page-header {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    padding: 0 40px;
    padding: 0 var(--pad);
    background: #F2F5F9;
    background: var(--bg-blue-light);
    margin-bottom: 2.5rem;
    margin-bottom: var(--mg-md);
    order: 2
}

.l-contents.-mypage .page-header {
    grid-column: 1/3;
    margin-bottom: 100px
}

@media screen and (max-width: 767px) {
    .l-contents.-mypage .page-header {
        margin-bottom: 40px
    }
}

.page-header__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    font-size: 2.5rem;
    font-weight: 400;
    font-weight: var(--fw-normal);
    color: #171717;
    padding-top: 50px;
    padding-bottom: 58px;
    height: 188px
}

@media screen and (max-width: 767px) {
    .page-header__title {
        font-size: 1.5rem;
        gap: 16px;
        height: 128px;
        padding: 16px 0 20px
    }
}

.page-header__title::after {
    flex: 0 0 auto;
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: #000;
    background: var(--color-base)
}

@media screen and (max-width: 767px) {
    .page-header__title::after {
        width: 60px
    }
}

.page-ranking {
    margin-top: 56px
}

.page-section {
    margin-top: 14px
}

.page-section__title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
    gap: 10px
}

@media screen and (max-width: 767px) {
    .page-section__title {
        align-items: flex-end;
    }
}

.page-section.-sticky {
    position: sticky;
    top: 140px;
    left: 0
}

.page-topicpath {
    width: calc(100vw - 0px);
    width: calc(100vw - var(--scroll-bar));
    margin-left: calc((100vw - 0px - 100%)/-2);
    margin-left: calc((100vw - var(--scroll-bar) - 100%)/-2);
    padding: 20px var(--pad) 10px;
}

@media screen and (max-width: 767px) {
    .page-topicpath {
       padding-bottom: 0;
    }
}

.page-topicpath__inner {
    max-width: 1200px;
    max-width: var(--width-default);
    font-size: .9375rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: calc((1em - 1lh) / 2) auto;
    margin: var(--leading-trim) auto
}

@media screen and (max-width: 767px) {
    .page-topicpath__inner {
        font-size: .75rem
    }
}

.page-topicpath__list {
    display: inline;
    line-height: 1
}

.page-topicpath__list>li {
    display: inline
}

.page-topicpath__list>li:not(:last-child) {
    padding-right: 16px
}

@media screen and (max-width: 767px) {
    .page-topicpath__list>li:not(:last-child) {
        padding-right: 8px
    }
}

.page-topicpath__list>li:not(:last-child)::after {
    content: "";
    display: inline-block;
    width: 5px;
    height: 9px;
    background: #000;
    background: var(--color-base);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40.305 73.539"><path d="M0,70,33.234,36.77,0,3.535,3.535,0,40.3,36.77,3.535,73.539Z" /></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40.305 73.539"><path d="M0,70,33.234,36.77,0,3.535,3.535,0,40.3,36.77,3.535,73.539Z" /></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    margin-top: -1px;
    margin-left: 16px
}

@media screen and (max-width: 767px) {
    .page-topicpath__list>li:not(:last-child)::after {
        width: 4px;
        height: 8px;
        margin-left: 8px
    }
}

.page-topicpath__list>li a {
    text-decoration: none
}

.reg-box {
    margin-top: 60px;
    padding: 40px 40px;
    padding: 40px var(--pad);
    background: #f0f0f0
}

@media screen and (max-width: 992px) {
    .reg-box {
        margin-left: calc(40px*-1);
        margin-left: calc(var(--pad)*-1);
        margin-right: calc(40px*-1);
        margin-right: calc(var(--pad)*-1);
        padding: 40px 40px;
        padding: 40px var(--pad)
    }
}

.site-button {
    display: none
}

@media screen and (max-width: 992px) {
    .site-button {
        flex: 0 0 auto;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: .875rem;
        min-width: 80px;
        height: 40px;
        padding: 0 8px;
        white-space: nowrap;
        text-decoration: none;
        border: 1px solid #bfbfbf;
        border-radius: 4px;
        background: #fff;
        transition: background-color .3s, color .3s;
        z-index: 1100
    }

    .site-button:hover {
        background-color: #0F1B3E;
        background-color: var(--color-primary);
        color: #fff
    }
}

@media screen and (max-width: 767px) {
    .site-button {
        font-size: .625rem;
        min-width: 50px;
        padding: 0 4px;
        height: 24px
    }
}

.site-categories {
    max-width: 1200px;
    max-width: var(--width-default);
    margin: 0 auto
}

@media screen and (max-width: 992px) {
    .site-categories {
        max-width: calc(1200px + 40px*2);
        max-width: calc(var(--width-default) + var(--pad)*2);
        padding: 80px 40px 0;
        padding: 80px var(--pad) 0
    }
}

@media screen and (max-width: 767px) {
    .site-categories {
        padding-top: 60px
    }
}

.site-categories__slider {
    opacity: 0;
    height: 59px
}

@media screen and (max-width: 992px) {
    .site-categories__slider {
        height: 40px
    }
}

.site-categories__slider.swiper-initialized {
    opacity: 1
}

.site-categories__slider .swiper-wrapper {
    display: flex;
    height: 100%
}

.site-categories__slider:has(.site-categories__prev.swiper-button-disabled):has(.site-categories__next.swiper-button-disabled) .swiper-slide:last-child {
    margin-right: 0 !important
}

.site-categories__item {
    position: relative;
    display: flex;
    font-size: 14px;
    text-decoration: none
}

@media screen and (max-width: 992px) {
    .site-categories__item {
        font-size: .875rem
    }
}

@media screen and (max-width: 767px) {
    .site-categories__item {
        font-size: .8125rem
    }
}

.site-categories__item.swiper-slide {
    display: flex;
    align-items: center;
    width: auto
}

.site-categories__label {
    position: relative;
    display: inline-block;
    transition: color .3s
}

.site-categories__label::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 1px;
    background: #4A6CCB;
    background: var(--color-light-blue);
    transform-origin: right top;
    transform: scaleX(0);
    transition: transform .3s
}

.site-categories__item:hover .site-categories__label {
    color: #4A6CCB;
    color: var(--color-light-blue)
}

.site-categories__item:hover .site-categories__label::after {
    transform: scaleX(1);
    transform-origin: left top
}

.site-categories__item.-current .site-categories__label {
    color: #4A6CCB;
    color: var(--color-light-blue)
}

.site-categories__item.-current .site-categories__label::after {
    transform: scaleX(1);
    transform-origin: left top
}

.site-categories__nav {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 10;
    transition: visibility .3s, opacity .3s
}

.site-categories__nav.-prev {
    left: 0
}

.site-categories__nav.-prev::after {
    left: 0;
    background: linear-gradient(to right, #fff 0%, #fff 25%, transparent 100%)
}

.site-categories__nav.-next {
    right: 0
}

.site-categories__nav.-next::after {
    right: 0;
    background: linear-gradient(to left, #fff 0%, #fff 25%, transparent 100%)
}

.site-categories__nav:has(.swiper-button-disabled) {
    opacity: 0;
    pointer-events: none;
    visibility: hidden
}

.site-categories__nav::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 56px;
    pointer-events: none
}

@media screen and (max-width: 767px) {
    .site-categories__nav::after {
        width: 56px
    }
}

.site-categories__next,
.site-categories__prev {
    position: absolute;
    top: 50%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    margin: -10px 0 0;
    padding: 0;
    border-radius: 50%;
    border: 0;
    background: #bfbfbf;
    cursor: pointer;
    z-index: 5
}

.site-categories__next .c-icon,
.site-categories__prev .c-icon {
    fill: #fff;
    width: 5px;
    height: 9px
}

.site-categories__next {
    right: 0
}

.site-categories__prev {
    left: 0;
    transform: rotate(180deg)
}

.site-copyright {
    font-size: .75rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .site-copyright {
        font-size: .625rem
    }
}

.site-copyright small {
    font-size: .75rem;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    color: #aaa
}

@media screen and (max-width: 767px) {
    .site-copyright small {
        font-size: .625rem
    }
}

.site-footer {
    padding: 40px 40px;
    padding: 40px var(--pad)
}

@media screen and (max-width: 767px) {
    .site-footer {
        padding-bottom: 24px
    }
}

.site-footer__inner {
    max-width: 1200px;
    max-width: var(--width-default);
    margin: 0 auto
}

.site-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 24px;
    border-top: 1px solid #e5e5e5;
    gap:32px;
}

.site-footer__bottom::before {
    content: "";
    display: block;
    width: 60px
}

@media screen and (max-width: 767px) {
    .site-footer__bottom::before {
        content: none
    }
}

.site-global {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(11, auto);
    grid-template-columns: max-content;
    grid-gap: 0 40px;
    gap: 0 40px;
    margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
    margin-bottom: calc(var(--leading-trim) + 20px)
}

@media screen and (max-width: 767px) {
    .site-global {
        gap: 0 32px
    }
}

.site-global__item:not(:nth-child(11n)) {
    margin-bottom: calc(calc((1em - 1lh) / 2) + 20px);
    margin-bottom: calc(var(--leading-trim) + 20px)
}

.site-global__item:not(:nth-child(11n)):last-child {
    margin-bottom: 0
}

.site-global__link {
    position: relative;
    display: inline-block;
    font-size: 1rem;
    font-weight: 500;
    font-weight: var(--fw-medium);
    color: #171717;
    text-decoration: none
}

.site-global__link::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 1px;
    background: #0F1B3E;
    background: var(--color-primary);
    transform-origin: right top;
    transform: scaleX(0);
    transition: transform .3s
}

.site-global__link.-premium {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #caa846;
    color: var(--color-premium)
}

.site-global__link.-premium .c-icon {
    fill: #caa846;
    fill: var(--color-premium);
    width: 14px;
    height: 16px
}

.site-global__link.-premium::after {
    left: 19px;
    background: #caa846;
    background: var(--color-premium)
}

.site-global__link:hover::after {
    transform: scaleX(1);
    transform-origin: left top
}

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 0 40px;
    padding: 0 var(--pad);
    z-index: 900;
    background: #fff;
    box-shadow: 0 0 6px rgba(0, 0, 0, .1)
}

@media screen and (max-width: 992px) {
    .site-header {
        position: absolute;
        padding: 0;
        box-shadow: 0 0 0 rgba(0, 0, 0, 0)
    }
}

.site-header__inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    gap: var(--pad);
    width: 100%;
    max-width: 1200px;
    max-width: var(--width-default);
    margin: 0 auto;
    padding-top: 20px
}

@media screen and (max-width: 992px) {
    .site-header__inner {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        padding: 15px 40px;
        padding: 15px var(--pad);
        background: #fff;
        box-shadow: 0 0 6px rgba(0, 0, 0, .1);
        z-index: 1100
    }
}

.site-header__main {
    display: flex;
    align-items: center;
    gap: 15px
}

.site-header__utility {
    display: flex;
    align-items: center;
    gap: 20px
}

@media screen and (max-width: 767px) {
    .site-header__utility {
        gap: 10px
    }
}

.site-header__logo {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 11px;
    position: relative;
    z-index: 1100
}

@media screen and (max-width: 992px) {
    .site-header__logo {
        gap: 5px
    }
}

.site-header__logo>a {
    display: block;
    text-decoration: none;
}

@media screen and (max-width: 992px) {
    .site-header__logo>a {
        padding-top: 0
    }
}

.site-header__logo > a img {
	display: block;
	width: auto;
	height: 35px;
}

@media screen and (max-width: 992px) {
	.site-header__logo > a img {
		height: 29px;
	}
}

@media screen and (max-width: 767px) {
	.site-header__logo > a img {
		height: 20px;
	}
}

.site-header__logo>a .u-logo {
    display: block
}

.site-header__lead {
    display: block;
    font-size: .75rem;
    font-weight: bold;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .site-header__lead {
        font-size: .5rem
    }
}

.site-info {
    margin-top: 152px
}

@media screen and (max-width: 992px) {
    .site-info {
        margin-top: 90px
    }
}

@media screen and (max-width: 767px) {
    .site-info {
        margin-top: 28px
    }
}

.site-info__top {
    display: flex;
    align-items: center;
    gap: 31px;
    margin-bottom: 4px
}

@media screen and (max-width: 767px) {
    .site-info__top {
        flex-direction: column;
        align-items: flex-start;
        gap: 42px;
        margin-bottom: 30px
    }
}

@media screen and (max-width: 767px) {
    .site-info__top .site-search {
        order: 1
    }
}

.site-info__logo {
    flex: 0 0 auto
}

@media screen and (max-width: 767px) {
    .site-info__logo {
        order: 2
    }
}

.site-info__logo svg {
    vertical-align: top
}

.site-info__middle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px
}

@media screen and (max-width: 767px) {
    .site-info__middle {
        flex-direction: column;
        align-items: flex-start;
        gap: 37px
    }
}

.site-info__bottom {
    margin-top: 19px;
    padding-top: 54px;
    border-top: 1px solid #e5e5e5
}

@media screen and (max-width: 767px) {
    .site-info__bottom {
        margin-top: 27px;
        padding-top: 23px
    }
}

.site-link {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 22px 45px;
    margin-bottom: 40px
}

@media screen and (max-width: 992px) {
    .site-link {
        gap: 20px 32px
    }
}

@media screen and (max-width: 767px) {
    .site-link {
        flex-direction: column;
        gap: 20px
    }
}

.site-link__item {
    font-size: .875rem;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .site-link__item {
        font-size: .75rem
    }
}

.site-link__item>a {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 13px;
    text-decoration: none;
    transition: color .3s
}

.site-link__item>a::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    width: calc(100% - 14px - 13px);
    height: 1px;
    background: #313e73;
    background: var(--color-primary-light);
    transform-origin: right top;
    transform: scaleX(0);
    transition: transform .3s
}

.site-link__item>a .c-icon {
    transition: fill .3s
}

.site-link__item>a .c-icon.-blank {
    width: 14px;
    height: 13px
}

.site-link__item>a:hover {
    color: #313e73;
    color: var(--color-primary-light)
}

.site-link__item>a:hover .c-icon {
    fill: #313e73;
    fill: var(--color-primary-light)
}

.site-link__item>a:hover::after {
    transform: scaleX(1);
    transform-origin: left top
}

.site-link__item>a:not(:has(.c-icon.-blank))::after {
    width: 100%
}

.site-login {
    display: none;
    font-size: .9375rem;
    text-decoration: none;
    transition: color .3s
}

@media screen and (max-width: 992px) {
    .site-login {
        display: block
    }
}

@media screen and (max-width: 767px) {
    .site-login {
        display: .8571428571rem
    }
}

.site-login:hover {
    color: #57628c;
    color: var(--color-primary-hover)
}

@media screen and (max-width: 992px) {
    .site-menu {
        flex: 0 0 auto
    }
}

.site-menu-button {
    display: none
}

@media screen and (max-width: 992px) {
    .site-menu-button {
        flex: 0 0 auto;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 56px;
        height: 50px;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: #fff;
        cursor: pointer
    }
}

@media screen and (max-width: 767px) {
    .site-menu-button {
        width: 40px;
        height: 30px
    }
}

.site-menu-button__icon {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 12px
}

.site-menu-button__bar {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background: #000;
    background: var(--color-base);
    transition: transform .3s
}

.site-menu-button__bar:first-child {
    top: 0
}

.site-menu-button__bar:last-child {
    bottom: 0
}

.site-menu-button:hover .site-menu-button__bar:first-child {
    transform: translateY(-2px)
}

.site-menu-button:hover .site-menu-button__bar:last-child {
    transform: translateY(2px)
}

.site-menu-close {
    display: none
}

@media screen and (max-width: 992px) {
    .site-menu-close {
        position: absolute;
        top: 0;
        right: 0;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: rgba(0, 0, 0, 0);
        visibility: hidden;
        cursor: pointer;
        transition: opacity .3s, visibility .3s;
        z-index: 1100
    }
}

@media screen and (max-width: 767px) {
    .site-menu-close {
        width: 40px;
        height: 60px
    }
}

.site-menu__container[aria-hidden=false] .site-menu-close {
    visibility: visible;
    opacity: 1;
    transition: opacity .3s linear .1s, visibility .3s linear .1s
}

.site-menu-close__icon {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .site-menu-close__icon {
        width: 24px;
        height: 24px
    }
}

.site-menu-close__bar {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 1px;
    margin-left: -16px;
    background: #fff;
    transition: transform .3s
}

@media screen and (max-width: 767px) {
    .site-menu-close__bar {
        width: 24px;
        margin-left: -12px
    }
}

.site-menu-close__bar:first-child {
    transform: rotate(45deg)
}

.site-menu-close__bar:last-child {
    transform: rotate(-45deg)
}

.site-menu__container[aria-hidden=false] .site-menu-close:hover .site-menu-close__bar:first-child {
    transform: rotate(45deg) scaleX(1.1)
}

.site-menu__container[aria-hidden=false] .site-menu-close:hover .site-menu-close__bar:last-child {
    transform: rotate(-45deg) scaleX(1.1)
}

.site-menu__container {
    display: none
}

@media screen and (max-width: 992px) {
    .site-menu__container {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: calc(1vh*100);
        height: calc(var(--vh, 1vh)*100);
        min-height: calc(1vh*100);
        min-height: calc(var(--vh, 1vh)*100);
        z-index: 1000;
        visibility: hidden;
        transition: visibility .7s;
        z-index: 1
    }

    .site-menu__container::after {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, .8);
        visibility: hidden;
        opacity: 0;
        transition: visibility .1s linear 0s, opacity .1s linear 0s;
        z-index: 900
    }

    .site-menu__container[aria-hidden=false] {
        visibility: visible
    }

    .site-menu__container[aria-hidden=false]::after {
        visibility: visible;
        opacity: 1;
        transition: visibility .3s linear .2s, opacity .3s linear .2s
    }
}

@media screen and (max-width: 992px) {
    .site-menu__body {
        position: relative;
        display: block;
        width: calc(100% - 60px);
        height: 100%;
        padding-top: 80px;
        overflow: hidden;
        background: #fff;
        transform: translateX(-100%);
        transition: transform .7s cubic-bezier(0.165, 0.84, 0.44, 1);
        z-index: 1000
    }

    .site-menu__container[aria-hidden=false] .site-menu__body {
        transform: translateX(0)
    }
}

@media screen and (max-width: 767px) {
    .site-menu__body {
        padding-top: 60px;
        width: calc(100% - 40px)
    }
}

@media screen and (max-width: 992px) {
    .site-menu__body__inner {
        display: flex;
        flex-direction: column;
        height: 100%;
        padding: 8px 40px 0;
        padding: 8px var(--pad) 0;
        overflow: auto
    }
}

.site-menu__top {
    position: absolute;
    top: 0;
    left: 40px;
    left: var(--pad);
    right: 40px;
    right: var(--pad);
    max-width: 1200px;
    max-width: var(--width-default);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 40px;
    height: 60px;
    margin: 0 auto;
    padding: 20px 45px 0 0
}

@media screen and (max-width: 1279px) {
    .site-menu__top {
        padding-right: calc(41px + (45 - 41)*(100vw - 992px)/(1279 - 992));
        gap: calc(20px + (40 - 20)*(100vw - 992px)/(1279 - 992))
    }
}

@media screen and (max-width: 992px) {
    .site-menu__top {
        flex: 0 0 auto;
        position: static;
        display: block;
        width: 100%;
        height: auto;
        padding: 0 40px 40px;
        padding: 0 var(--pad) 40px
    }
}

@media screen and (max-width: 767px) {
    .site-menu__top {
        padding-bottom: 32px
    }
}

@media screen and (max-width: 992px) {
    .site-menu__bottom {
        flex: 1 0 auto;
        padding: 40px 40px;
        padding: 40px var(--pad);
        background: #F2F5F9;
        background: var(--bg-blue-light)
    }
}

@media screen and (max-width: 767px) {
    .site-menu__bottom {
        padding-top: 32px;
        padding-bottom: 32px
    }
}

.site-menu__bottom__inner {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    max-width: var(--width-default);
    gap: 24px;
    height: 60px;
    margin: 0 auto
}

@media screen and (max-width: 1279px) {
    .site-menu__bottom__inner {
        gap: calc(16px + (33 - 16)*(100vw - 992px)/(1279 - 992))
    }
}

@media screen and (max-width: 992px) {
    .site-menu__bottom__inner {
        flex: 1 0 auto;
        display: block;
        height: auto
    }
}

.site-mypage {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 180px;
    height: 40px;
    padding: 14px 24px 14px 16px;
    background: #000;
    background: var(--color-base);
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    transition: background-color .3s
}

@media screen and (max-width: 767px) {
    .site-mypage {
        justify-content: center
    }
}

.site-mypage:hover {
    background-color: #57628c;
    background-color: var(--color-primary-hover)
}

@media screen and (max-width: 992px) {
    .site-header__utility .site-mypage {
        display: none
    }
}

.site-mypage__icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #fff;
    border-radius: 50%
}

.site-mypage__icon .c-icon {
    width: 14px;
    height: 14px;
    fill: #0F1B3E;
    fill: var(--color-primary);
    transition: fill .3s
}

.site-mypage:hover .site-mypage__icon .c-icon {
    fill: #57628c;
    fill: var(--color-primary-hover)
}

.site-page2top {
    position: sticky;
    right: 0;
    bottom: 50px;
    height: 0;
    z-index: 500
}

.site-page2top>a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    text-align: center;
    margin-left: auto;
    background: #000;
    background: var(--color-base);
    transition: background-color .3s
}

.site-page2top>a .c-icon {
    fill: #fff;
    width: 7px;
    height: 50px;
    transform: rotate(-90deg);
    transition: transform .3s, fill .3s
}

.site-page2top>a:hover {
    background-color: #313e73;
    background-color: var(--color-primary-light)
}

.site-premium {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
    color: #caa846;
    color: var(--color-premium);
    font-size: 1rem;
    text-decoration: none
}

@media screen and (max-width: 992px) {
    .site-header__utility .site-premium {
        display: none
    }
}

.site-premium .c-icon {
    fill: #caa846;
    fill: var(--color-premium);
    width: 14px;
    height: 16px
}

.site-premium::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 2px;
    left: 19px;
    right: 0;
    height: 1px;
    background: #caa846;
    background: var(--color-premium);
    transform-origin: right top;
    transform: scaleX(0);
    transition: transform .3s
}

.site-premium:hover::after {
    transform: scaleX(1);
    transform-origin: left top
}

.site-privacy {
    order: 2;
    display: block
}

@media screen and (max-width: 767px) {
    .site-privacy {
        width: 48px
    }
}

.site-registration {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 180px;
    height: 40px;
    padding: 8px 10px;
    background: #000;
    background: var(--color-base);
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color .3s
}

.site-registration:hover {
    background-color: #57628c;
    background-color: var(--color-primary-hover)
}

@media screen and (max-width: 992px) {
    .site-header__utility .site-registration {
        display: none
    }
}

.site-registration__tag {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 24px;
    font-size: .875rem;
    font-weight: 700;
    font-weight: var(--fw-bold);
    color: #171717;
    padding-left: .2em;
    letter-spacing: .2em;
    background: #fff;
    border-radius: 4px
}

@media screen and (max-width: 992px) {
    .site-utility .site-registration__tag {
        font-size: 1rem;
        width: 54px
    }
}

@media screen and (max-width: 767px) {
    .site-utility .site-registration__tag {
        font-size: 1.125rem;
        width: 62px;
        height: 37px
    }
}

@media screen and (max-width: 400px) {
    .site-utility .site-registration__tag {
        font-size: calc(16px + (18 - 16)*(100vw - 375px)/(400 - 375));
        width: calc(54px + (62 - 54)*(100vw - 375px)/(400 - 375));
        height: calc(32px + (37 - 32)*(100vw - 375px)/(400 - 375))
    }
}

.site-registration__label {
    font-size: 10px;
    font-weight: 700;
    font-weight: var(--fw-bold);
    line-height: 1.4285714286
}

@media screen and (max-width: 992px) {
    .site-utility .site-registration__label {
        font-size: .9375rem
    }
}

@media screen and (max-width: 767px) {
    .site-utility .site-registration__label {
        font-size: .9375rem
    }
}

@media screen and (max-width: 400px) {
    .site-utility .site-registration__label {
        font-size: calc(13px + (15 - 13)*(100vw - 375px)/(400 - 375))
    }
}

.site-search-button {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
    cursor: pointer;
    z-index: 100
}

@media screen and (max-width: 992px) {
    .site-header__utility .site-search-button {
        display: none
    }
}

.site-header.-open-menu .site-search-button {
    z-index: 0
}

.site-search-button__inner {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 25px;
    height: 25px;
    overflow: hidden;
    transition: transform .3s
}

.site-search-button:hover .site-search-button__inner {
    transform: scale(1.2)
}

.site-search-button__item {
    flex: 0 0 auto;
    position: relative;
    display: block;
    width: 25px;
    height: 25px;
    transition: transform .3s
}

.site-search-button[aria-pressed=true] .site-search-button__item {
    transform: translateY(-100%)
}

.site-search-button__item .c-icon.-search {
    width: 25px;
    height: 25px;
    fill: #000;
    fill: var(--color-base)
}

.site-search-button__item.-close::before,
.site-search-button__item.-close::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 27px;
    height: 1px;
    background: #000;
    background: var(--color-base)
}

.site-search-button__item.-close::before {
    transform: translate(-50%, -50%) rotate(45deg)
}

.site-search-button__item.-close::after {
    transform: translate(-50%, -50%) rotate(-45deg)
}

.site-search {
    position: relative
}

.site-search__button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: absolute;
    top: 50%;
    left: 16px;
    margin: 0;
    padding: 0;
    transform: translateY(-50%);
    background: none;
    border-radius: 0;
    border: 0
}

.site-search__button .c-icon {
    width: 17px;
    height: 17px;
    vertical-align: top
}

.site-menu .site-search__button {
    left: auto;
    right: 12px
}

.site-search__input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 16px;
    width: 220px;
    height: 40px;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    color: #171717;
    padding: 0 16px 0 43px;
    background: #fff;
    border: 2px solid #dcdcdc;
    border: 2px solid var(--border-light);
    border-radius: 4px
}

.site-search__input::-moz-placeholder {
    color: #9c9c9c
}

.site-search__input::placeholder {
    color: #9c9c9c
}

.site-menu .site-search__input {
    width: 100%;
    height: 40px;
    padding: 0 40px 0 12px;
    border-width: 1px
}

@media screen and (max-width: 767px) {
    .site-menu .site-search__input {
        font-size: .875rem;
        height: 32px
    }
}

.site-sns {
    display: flex;
    gap: 23px
}

@media screen and (max-width: 992px) {
    .site-sns {
        gap: 16px
    }
}

@media screen and (max-width: 767px) {
    .site-sns {
        gap: 23px
    }
}

.site-sns__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px
}

.site-sns__button .c-icon {
    transition: transform .3s
}

.site-sns__button .c-icon.-facebook {
    width: 28px;
    height: 28px
}

.site-sns__button .c-icon.-x {
    width: 22px;
    height: 22px
}

.site-sns__button .c-icon.-instagram {
    width: 25px;
    height: 25px
}

.site-sns__button .c-icon.-youtube {
    width: 26px;
    height: 18px
}

.site-sns__button:hover .c-icon {
    transform: scale(1.2)
}

.site-widget {
    position: fixed;
    top: 120px;
    left: 0;
    right: 0;
    height: calc(1vh*100);
    height: calc(var(--vh, 1vh)*100);
    visibility: hidden;
    transition: visibility .4s;
    z-index: 899
}

@media screen and (max-width: 992px) {
    .site-widget {
        top: 80px
    }
}

@media screen and (max-width: 767px) {
    .site-widget {
        top: 60px
    }
}

.site-widget[aria-hidden=false] {
    visibility: visible
}

.site-widget__body {
    padding: 0 40px;
    padding: 0 var(--pad);
    height: 0;
    overflow: hidden;
    background: #fff;
    transition: height .4s cubic-bezier(0.165, 0.84, 0.44, 1)
}

.site-widget[aria-hidden=false] .site-widget__body {
    height: 100%
}

.site-widget__body__inner {
    max-height: 100%;
    overflow: auto
}

.site-widget__inner {
    max-width: 1200px;
    max-width: var(--width-default);
    margin: 0 auto;
    padding: 80px 0
}

@media screen and (max-width: 992px) {
    .site-widget__inner {
        padding: 56px 0
    }
}

@media screen and (max-width: 767px) {
    .site-widget__inner {
        padding: 40px 0
    }
}

.site-widget .site-search__input {
    font-size: 20px;
    width: 100%;
    height: 70px;
    padding: 0 80px 0 30px
}

@media screen and (max-width: 767px) {
    .site-widget .site-search__input {
        font-size: 16px;
        height: 60px;
        padding: 0 60px 0 20px
    }
}

.site-widget .site-search__input::-moz-placeholder {
    color: #9c9c9c
}

.site-widget .site-search__input::placeholder {
    color: #9c9c9c
}

.site-widget .site-search__button {
    left: auto;
    right: 30px
}

@media screen and (max-width: 767px) {
    .site-widget .site-search__button {
        right: 20px
    }
}

.site-widget .site-search__button .c-icon {
    width: 25px;
    height: 25px
}

@media screen and (max-width: 767px) {
    .site-widget .site-search__button .c-icon {
        width: 20px;
        height: 20px
    }
}

.site-widget__close {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* font-family: "FP-ヒラギノUD丸ゴ StdN W4", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", sans-serif; */
    font-family: var(--ff-jp);
    font-size: 1.25rem;
    color: #171717;
    width: 100%;
    max-width: 300px;
    height: 70px;
    margin: 100px auto 0;
    padding: 0 30px 0 40px;
    background: #fff;
    border-radius: 4px;
    border: 1px solid #000;
    border: 1px solid var(--color-base);
    cursor: pointer;
    transition: background-color .3s, color .3s
}

@media screen and (max-width: 767px) {
    .site-widget__close {
        font-size: 1rem;
        max-width: 160px;
        height: 50px;
        padding: 20px;
        margin-top: 60px
    }
}

.site-widget__close .c-icon {
    position: relative;
    display: block;
    width: 11px;
    height: 11px
}

.site-widget__close .c-icon::before,
.site-widget__close .c-icon::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 15px;
    height: 1px;
    background: #000;
    background: var(--color-base);
    transition: background-color .3s
}

.site-widget__close .c-icon::before {
    transform: translate(-50%, -50%) rotate(45deg)
}

.site-widget__close .c-icon::after {
    transform: translate(-50%, -50%) rotate(-45deg)
}

.site-widget__close:hover {
    color: #fff;
    background: #000;
    background: var(--color-base)
}

.site-widget__close:hover .c-icon::before,
.site-widget__close:hover .c-icon::after {
    background: #fff
}

@media screen and (max-width: 992px) {
    .top-hero {
        background-color: var(--bg-blue-light);
        margin-inline: -20px;
        padding: 20px;
    }
}

.top-hero__title {
    font-size: 32px;
    font-weight: 600;
    font-family: var(--ff-en);
}

@media screen and (max-width: 992px) {
    .top-hero__title {
        font-size: 20px;
    }
}

.top-hero__inner {
    display: flex;
    gap: 20px;
    margin-top: 24px;
    position: relative;
}

@media screen and (max-width: 992px) {
    .top-hero__inner {
        margin: 20px -20px 0;
    }
}

.top-hero-slider-sp {
    display: none;
}

@media screen and (max-width: 992px) {
    .top-hero-slider-sp {
    display: block;
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider-pc {
    display: none;
    }
}

@media screen and (min-width: 993px) {
    .top-hero-slider__wrapper {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, auto);
        gap: 8px 24px;
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__wrapper.swiper-wrapper {
        height: auto;
    }
}


@media screen and (max-width: 992px) {
    .top-hero-slider__card {
        max-width: 70%;
        min-width: 250px;
    }
}

.top-hero-slider__card:first-child {
    grid-column: 1 / 2;
    grid-row: 1 / 5;
}

.top-hero-slider__link {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    text-decoration: none;
}

.top-hero-slider__card:first-child .top-hero-slider__link {
    flex-direction: column;
}

@media screen and (max-width: 992px) {
    .top-hero-slider__link {
        flex-direction: column;
        gap: 6px;
    }
}

.top-hero-slider__thumb {
    flex-shrink: 0;
    width: 130px;
    aspect-ratio: 3 / 2;
    overflow: hidden;
}

.top-hero-slider__card:first-child .top-hero-slider__thumb {
    width: 100%;
}

@media screen and (max-width: 992px) {
    .top-hero-slider__thumb {
        width: 100%;
    }
}

.top-hero-slider__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.top-hero-slider__link:hover .top-hero-slider__thumb img {
    transform: scale(1.05);
}

.top-hero-slider__title {
    font-weight: 700;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    font-size: 14px;
    line-height: 1.5;
}

.top-hero-slider__card:first-child .top-hero-slider__title {
    font-size: 16px;
}

.top-hero-slider__link:hover .top-hero-slider__title {
    color: var(--color-primary-light);
}

@media screen and (max-width: 992px) {
    .top-hero-slider__title {
        font-weight: 300;
        font-size: 12px;
        -webkit-line-clamp: 2;
    }
}

.top-hero-slider__description {
    margin-top: 6px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 14px;
    line-height: 1.5;
}

.top-hero-slider__card:not(:first-child) .top-hero-slider__description {
    display: none;
}

@media screen and (max-width: 992px) {
    .top-hero-slider__description {
        display: none;
    }
}

.top-hero-slider__date {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    margin-top: 6px;
    line-height: 1.5;
    letter-spacing: 0;
    font-family: var(--ff-date);
}

@media screen and (max-width: 992px) {
    .top-hero-slider__date {
        margin-top: 0;
        font-size: 12px;
    }
}

.top-hero-slider__card.-premium .top-hero-slider__date::after {
    content: "";
    display: block;
    width: 13px;
    height: 15px;
    background: #caa846;
    background: var(--color-premium);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    margin-top: -2px
}

@media screen and (max-width: 767px) {
    .top-hero-slider__card.-premium .top-hero-slider__date::after {
        width: 9px;
        height: 11px
    }
}

.top-hero-slider__controls {
    display: none;
}

@media screen and (max-width: 992px) {
    .top-hero-slider__controls {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 12px;
        margin-top: 20px;
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__pagination {
        display: flex;
        justify-content: center;
        gap: 12px;
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__pagination .swiper-pagination-bullet {
        display: block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #c8c8c9
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background-color: #0f1b3e;
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__button {
        border: 0;
        font-size: 0;
        width: 24px;
        height: 24px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        background-color: transparent;
    }

    .top-hero-slider__button.is-pause {
        background-image: url('../img/common/icon_pause.svg');
    }

    .top-hero-slider__button.is-play {
        background-image: url('../img/common/icon_play.svg');
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__button.is-pause .top-hero-slider__stop {
        display: block;
    }

    .top-hero-slider__button.is-play .top-hero-slider__stop {
        display: none;
    }
}

@media screen and (max-width: 992px) {
    .top-hero-slider__button.is-pause .top-hero-slider__play {
        display: none;
    }

    .top-hero-slider__button.is-play .top-hero-slider__play {
        display: block;
    }
}


#ez-toc-container,
.ez-toc-counter {
    position: relative;
    margin-top: calc(calc((1em - 1lh) / 2) + 50px);
    margin-top: calc(var(--leading-trim) + 50px);
    margin-bottom: 40px;
    padding: 40px;
    border: 1px solid #000;
    border: 1px solid var(--color-base)
}

@media screen and (max-width: 767px) {

    #ez-toc-container,
    .ez-toc-counter {
        padding: 25px;
        margin-top: calc(calc((1em - 1lh) / 2) + 30px);
        margin-top: calc(var(--leading-trim) + 30px);
        margin-bottom: 20px
    }
}

#ez-toc-container>nav,
.ez-toc-counter>nav {
    max-height: 200px;
    transition: max-height .3s ease-out;
    overflow: hidden
}

#ez-toc-container>nav>.ez-toc-list,
.ez-toc-counter>nav>.ez-toc-list {
    padding-bottom: 40px
}

#ez-toc-container.-button-hide>nav>.ez-toc-list,
.ez-toc-counter.-button-hide>nav>.ez-toc-list {
    padding-bottom: 0
}

.ez-toc-title-container {
    margin-bottom: 24px
}

@media screen and (max-width: 767px) {
    .ez-toc-title-container {
        margin-bottom: 16px
    }
}

.ez-toc-title {
    font-size: 1.5rem;
    font-weight: 600;
    font-weight: var(--fw-semibold);
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    color: #acb0c1;
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
    margin-bottom: calc(var(--leading-trim) + 24px)
}

@media screen and (max-width: 767px) {
    .ez-toc-title {
        font-size: 1.25rem;
        margin-bottom: calc(calc((1em - 1lh) / 2) + 16px);
        margin-bottom: calc(var(--leading-trim) + 16px)
    }
}

.ez-toc-title-container .ez-toc-title {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.ez-toc-title-toggle {
    display: none
}

.ez-toc-list-level-1 {
    counter-reset: toc
}

.ez-toc-heading-level-2 {
    counter-increment: toc;
}

.ez-toc-heading-level-2:not(:last-child) {
    margin-bottom: calc(calc((1em - 1lh) / 2) + 24px);
    margin-bottom: calc(var(--leading-trim) + 24px)
}

@media screen and (max-width: 767px) {
    .ez-toc-heading-level-2:not(:last-child) {
        margin-bottom: 16px
    }
}

.ez-toc-heading-level-2:last-child {
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

.ez-toc-heading-level-2>.ez-toc-link {
    display: inline-flex;
    align-items: baseline;
    gap: 16px;
    text-decoration: none;
    transition: color .3s
}

@media screen and (max-width: 767px) {
    .ez-toc-heading-level-2>.ez-toc-link {
        font-size: .875rem
    }
}

.ez-toc-heading-level-2>.ez-toc-link::before {
    flex: 0 0 auto;
    content: "0" counter(toc);
    display: block;
    font-size: 1.25rem;
    font-weight: 600;
    font-weight: var(--fw-semibold);
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    text-align: left;
    color: #313e73;
    color: var(--color-primary-light);
    width: fit-content;
    text-indent: 0;
    line-height: 1
}

@media screen and (max-width: 767px) {
    .ez-toc-heading-level-2>.ez-toc-link::before {
        font-size: .9375rem
    }
}

.ez-toc-heading-level-2>.ez-toc-link:hover {
    color: #313e73;
    color: var(--color-primary-light)
}

.ez-toc-heading-level-2:nth-child(n+10)>.ez-toc-link::before {
    content: counter(toc)
}

.ez-toc-list-level-3 {
    margin-top: 8px;
    padding-left: 45px
}

.ez-toc-heading-level-3>.ez-toc-link {
    position: relative;
    display: inline-block;
    font-size: .875rem;
    padding-left: 24px;
    text-decoration: none;
    transition: color .3s
}

@media screen and (max-width: 767px) {
    .ez-toc-heading-level-3>.ez-toc-link {
        font-size: .75rem
    }
}

.ez-toc-heading-level-3>.ez-toc-link::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 2px;
    display: block;
    width: 12px;
    height: 2px;
    background: #00479d
}

.ez-toc-heading-level-3>.ez-toc-link:hover {
    color: #313e73;
    color: var(--color-primary-light)
}

.ez-toc-cssicon-toggle-label {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .875rem;
    height: 40px;
    color: #fff;
    background: #000;
    background: var(--color-base);
    z-index: 1;
    cursor: pointer;
    transition: background-color .3s
}

.ez-toc-cssicon-toggle-label::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(to bottom, transparent 0%, #fff 100%);
    transition: height .3s
}

.ez-toc-cssicon-toggle-label:hover {
    background: #313e73;
    background: var(--color-primary-light)
}

.ez-toc-cssicon-toggle-label .ez-toc-cssicon {
    display: none
}

.ez-toc-counter.-button-hide .ez-toc-cssicon-toggle-label {
    display: none
}

.ez-toc-counter.-show .ez-toc-cssicon-toggle-label::before {
    height: 0
}

.page-numbers {
    margin-top: 2.5rem;
    margin-top: var(--mg-md);
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.page-numbers .post-page-numbers {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    width: 100%;
    max-width: 200px;
    min-height: 44px;
    margin: 0 auto;
    padding: 7px 16px 8px;
    border-radius: 0;
    color: #171717;
    font-size: 1rem;
    font-weight: 500;
    font-family: "Noto Sans JP", sans-serif;
    background: rgba(0, 0, 0, 0);
    cursor: pointer;
    z-index: 0;
    transition: color .3s
}

@media screen and (max-width: 767px) {
    .page-numbers .post-page-numbers {
        min-height: 48px
    }
}

.page-numbers .post-page-numbers::before {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    background: #fff;
    border-radius: 40px;
    border: 2px solid #222;
    z-index: -1;
    transition: transform .3s, background-color .3s
}

.page-numbers .post-page-numbers:hover {
    color: #222
}

.page-numbers .post-page-numbers:hover::before {
    transform: scale(1.025, 1.05);
    background: #94d5f7
}

.linkcard {
    margin: 64px 0
}

@media screen and (max-width: 767px) {
    .linkcard {
        margin: 40px 0
    }
}

.lkc-info {
    display: none
}

.lkc-link {
    display: block;
    padding: 0;
    text-decoration: none;
    background: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .2);
    transition: box-shadow .3s
}

.lkc-link:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3)
}

.lkc-card {
    margin: 0
}

.lkc-content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 8px 32px 8px 272px;
    min-height: 170px
}

@media screen and (max-width: 767px) {
    .lkc-content {
        padding: 8px 20px 8px calc(38.8889% + 20px)
    }
}

.lkc-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.125rem;
    color: #313e73;
    color: var(--color-primary-light);
    text-decoration: underline;
    margin-bottom: 12px
}

.lkc-link:hover .lkc-title {
    text-decoration: none
}

.lkc-url {
    display: none
}

.lkc-excerpt {
    color: #444;
    font-size: .875rem;
    line-height: 1.7;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden
}

.lkc-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    width: 240px;
    height: 100%;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    .lkc-thumbnail {
        width: 38.8889%;
        max-width: 240px
    }
}

.lkc-thumbnail-img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform .3s
}

.lkc-link:hover .lkc-thumbnail-img {
    transform: scale(1.05)
}

.lkc-info {
    display: none
}

.simplefavorite-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-size: .875rem;
    font-weight: 300;
    font-weight: var(--fw-light);
    color: #7B8CD5;
    color: var(--color-fav);
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .simplefavorite-button {
        font-size: .75rem;
        gap: 6px
    }
}

.simplefavorite-button::before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background: #7B8CD5;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.5 16.5'%3E%3Cpath fill='none' stroke='black' stroke-width='1.5' d='M8.25 0c.33 0 .62.2.76.51l1.94 4.09 4.04.63a.99.99 0 0 1 .53 1.68l-2.99 2.98.86 4.28a.98.98 0 0 1-1.44 1.03l-3.85-2.13-3.84 2.13a.98.98 0 0 1-1.44-1.03l.85-4.28-2.99-2.98a.99.99 0 0 1 .53-1.68l4.05-.63 1.94-4.09A.77.77 0 0 1 8.25 0z'/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-size: cover;
    mask-position: center;
}

@media screen and (max-width: 767px) {
    .simplefavorite-button::before {
        width: 11px;
        height: 11px
    }
}

.simplefavorite-button.active::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.5 16.5'%3E%3Cpath fill='black' d='M8.25 0c.33 0 .62.2.76.51l1.94 4.09 4.04.63a.99.99 0 0 1 .53 1.68l-2.99 2.98.86 4.28a.98.98 0 0 1-1.44 1.03l-3.85-2.13-3.84 2.13a.98.98 0 0 1-1.44-1.03l.85-4.28-2.99-2.98a.99.99 0 0 1 .53-1.68l4.05-.63 1.94-4.09A.77.77 0 0 1 8.25 0z'/%3E%3C/svg%3E");
}

.simplefavorite-button-count {
    padding-top: 1px;
}


.simplefavorite-button .c-icon {
    width: 16px;
    height: 16px;
    fill: #fff;
    stroke: #7B8CD5;
    stroke: var(--color-fav);
    transition: transform .3s
}

@media screen and (max-width: 767px) {
    .simplefavorite-button .c-icon {
        width: 11px;
        height: 11px
    }
}

.simplefavorite-button.active .c-icon {
    fill: #7B8CD5;
    fill: var(--color-fav)
}

.simplefavorite-button.loading {
    position: relative;
    display: block;
    width: 27px;
    height: 27px;
    padding-left: 27px;
    white-space: nowrap;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    .simplefavorite-button.loading {
        width: 24px;
        height: 24px;
        padding-left: 24px
    }
}

.simplefavorite-button.loading::after {
    content: "";
    display: block;
    position: absolute;
    inset: 4px;
    border: 3px solid #ced0d7;
    border-top-color: #7B8CD5;
    border-top-color: var(--color-fav);
    border-radius: 50%;
    animation: spin 1s infinite linear
}

@media screen and (max-width: 767px) {
    .simplefavorite-button.loading::after {
        inset: 2px
    }
}

.simplefavorite-button:hover .c-icon {
    transform: scale(1.2)
}

.a-header .simplefavorite-button {
    flex: 0 0 auto
}

@media screen and (max-width: 767px) {
    .a-header .simplefavorite-button {
        order: 2;
        margin-left: auto;
        grid-column: 2/5
    }
}

.c-card.-xs .simplefavorite-button {
    font-size: .75rem;
    gap: 4px
}

.c-card.-xs .simplefavorite-button .c-icon {
    width: 11px;
    height: 11px
}

@keyframes spin {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.top-section {
    margin-top: 64px;
}

@media screen and (max-width: 767px) {
    .top-section {
        margin-top: 40px
    }
}

.top-section__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    gap: 8px;
    flex-wrap: wrap;
}

@media screen and (max-width: 767px) {
    .top-section__header {
        margin-bottom: 16px;
        align-items: flex-end;
    }
}

@media screen and (max-width: 767px) {
    .top-section__desc {
        font-size: 12px;
        line-height: 1.5;
    }
}

.top-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px 16px;
}

@media screen and (max-width: 767px) {
    .top-card-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

.top-card {
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
}

@media screen and (max-width: 767px) {
    .top-card {
        flex-direction: row;
        gap: 16px;
    }
}

.top-card--main {
    grid-column: span 3;
    flex-direction: row;
    gap: 16px;
}

@media screen and (max-width: 767px) {
    .top-card--main {
        grid-column: span 1;
    }
}

.top-card__link {
    position: absolute;
    width: 100%;
    height: 100%;
}

.top-card__thumb {
    flex-shrink: 0;
    width: 100%;
    aspect-ratio: 3 / 2;
    overflow: hidden;
}

@media screen and (max-width: 767px) {
    .top-card__thumb {
        width: 100px;
    }
}

.top-card--main .top-card__thumb {
    width: 400px;
    flex-direction: row;
}

@media screen and (max-width: 767px) {
    .top-card--main .top-card__thumb {
        width: 100px;
    }
}

.top-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.top-card:has(.top-card__link:hover) .top-card__thumb img {
    transform: scale(1.05);
}

.top-card__body {
    flex: 1;
    width: 100%;
    padding-bottom: 20px;
}

.top-card--main .top-card__body {
    padding-bottom: 0;
}

@media screen and (max-width: 767px) {
    .top-card__body {
        padding-bottom: 0;
    }
}


.top-card__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-card__categories {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.top-card__category {
    font-size: 11px;
    line-height: 1.2;
    padding: 6px 14px;
    border: 1px solid var(--border-dark);
    border-radius: 4px
}

@media screen and (max-width: 767px) {
    .top-card__category {
        font-size: 10px;
        padding: 3px 4px;
    }
}

.top-card__fav {
    z-index: 1;
}

.top-card__title {
    margin-top: 8px;
    font-weight: 700;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 1.5;
}

@media screen and (max-width: 767px) {
    .top-card__title {
        font-weight: 300;
        font-size: 12px;
        margin-top: 7px;
    }
}

.top-card--main .top-card__title {
    font-size: 18px;
     -webkit-line-clamp: 3;
}

@media screen and (max-width: 767px) {
    .top-card--main .top-card__title {
        font-size: 12px;
        -webkit-line-clamp: 2;
    }
}

.top-card:has(.top-card__link:hover) .top-card__title {
    color: var(--color-primary-light);
}

.top-card__excerpt {
    margin-top: 8px;
    font-size: 14px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-height: 1.5;
}

@media screen and (max-width: 767px) {
    .top-card__excerpt {
        display: none;
    }
}

.top-card__date {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0;
    font-family: var(--ff-date);
}

@media screen and (max-width: 767px) {
    .top-card__date {
        gap: 8px;
        margin-top: 7px;
        font-size: 12px;
    }
}

.top-card.-premium .top-card__date::after {
    content: "";
    display: block;
    width: 11px;
    height: 13px;
    background: #caa846;
    background: var(--color-premium);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    margin-top: -2px
}

.top-download {
    margin-top: 24px;
}

@media screen and (max-width: 767px) {
    .top-download {
        margin: 12px -16px 0;
        overflow-x: auto;
    }
}

.top-download__list {
    display: flex;
    gap: 16px;
}

@media screen and (max-width: 767px) {
    .top-download__list {
        display: flex;
        width: fit-content;
        gap: 20px;
    }

    .top-download__list::before {
        content: "";
        background-color: transparent;
    }

    .top-download__list::after {
        content: "";
        background-color: transparent;
    }
}

@media screen and (max-width: 767px) {
    .top-download__list {
        gap: 20px;
    }
}

.top-download-card {
    flex: 1;
    border: 1px solid var(--border-light);
    box-sizing: border-box;
}

@media screen and (max-width: 767px) {
    .top-download-card {
        width: 300px;
    }
}

.top-download-card__link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    width: 100%;
    height: 100%;
}

.top-download-card__thumb {
    width: 100%;
    aspect-ratio: 3 / 2;
    overflow: hidden;
}

.top-download-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.top-download-card__link:hover .top-download-card__thumb img {
    transform: scale(1.05);
}

.top-download-card__body {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    border-top: 1px solid var(--border-light);
    padding: 16px; 
}

@media screen and (max-width: 767px) {
    .top-download-card__body {
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 22px 22px;
    }
}

.top-download-card__arrow {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 16px;
    width: 7px;
    height: 11px;
}

@media screen and (max-width: 767px) {
    .top-download-card__arrow {
        margin: auto 0 0 auto;
    }
}

.top-download-card__arrow svg {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
}

.top-download-card__title {
    font-weight: 700;
    line-height: 1.5;
}

@media screen and (max-width: 767px) {
    .top-download-card__title {
        font-weight: 400;
    }
}

.wp-block-embed {
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.wp-block-embed__wrapper {
    overflow: hidden;
    border-radius: 4px
}

.wp-embed-aspect-16-9 .wp-block-embed__wrapper {
    aspect-ratio: 16/9
}

.wp-block-embed__wrapper iframe {
    width: 100%;
    height: 100%
}

h2.wp-block-heading {
    font-size: 1.5rem;
    font-weight: 500;
    padding-top: 16px;
    padding-bottom: 16px;
    border-top: 2px solid #222;
    border-bottom: 2px solid #222;
    letter-spacing: .04em;
    margin-top: 4rem;
    margin-top: var(--mg-lg);
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

@media screen and (max-width: 767px) {
    h2.wp-block-heading {
        font-size: 1.5714285714rem;
        padding-top: 12px;
        padding-bottom: 12px
    }
}

h2.wp-block-heading strong {
    color: #171717;
    font-weight: 500
}

h3.wp-block-heading {
    position: relative;
    font-size: 1.25rem;
    font-weight: 500;
    letter-spacing: .04em;
    padding-left: 16px;
    margin-top: 2.5rem;
    margin-top: var(--mg-md);
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

@media screen and (max-width: 767px) {
    h3.wp-block-heading {
        font-size: 1.2857142857rem
    }
}

h3.wp-block-heading::before {
    content: "";
    display: block;
    position: absolute;
    top: .2em;
    bottom: .2em;
    left: 0;
    width: 6px;
    background: #222
}

h3.wp-block-heading strong {
    color: #171717;
    font-weight: 500
}

h4.wp-block-heading {
    font-size: 1.125rem;
    font-weight: 500;
    margin-top: 32px;
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm);
    letter-spacing: .04em;
    padding-bottom: 12px;
    border-bottom: 1px solid #222
}

@media screen and (max-width: 767px) {
    h4.wp-block-heading {
        font-size: 1.0714285714rem
    }
}

h4.wp-block-heading strong {
    color: #171717;
    font-weight: 500
}

.wp-block-image {
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.wp-block-image img {
    border-radius: 4px
}

.wp-block-image .alignleft {
    text-align: left
}

.wp-block-image .aligncenter {
    text-align: center
}

.wp-block-image .alignright {
    text-align: right
}

img.alignnone {
    display: block;
    margin: 0 auto
}

img.alignleft {
    display: block;
    margin-right: auto
}

img.aligncenter {
    display: block;
    margin: 0 auto
}

img.alignright {
    display: block;
    margin-left: auto
}

.wp-caption {
    width: auto !important;
    margin-bottom: 1.5rem;
    margin-bottom: var(--mg-sm)
}

.wp-caption-text {
    margin-top: 12px
}

.a-article #wpmem_restricted_msg {
    margin-top: 30px;
    padding: 24px 24px 0;
    border-top: 4px solid #bfbfbf;
    border-top: 4px solid var(--border-dark);
    border-left: 4px solid #bfbfbf;
    border-left: 4px solid var(--border-dark);
    border-right: 4px solid #bfbfbf;
    border-right: 4px solid var(--border-dark)
}

@media screen and (max-width: 767px) {
    .a-article #wpmem_restricted_msg {
        margin-top: 20px
    }
}

.a-article #wpmem_restricted_msg>:last-child {
    margin-bottom: 0
}

.a-article #wpmem_restricted_msg+.ms-wrapper {
    padding: 24px;
    border-bottom: 4px solid #bfbfbf;
    border-bottom: 4px solid var(--border-dark);
    border-left: 4px solid #bfbfbf;
    border-left: 4px solid var(--border-dark);
    border-right: 4px solid #bfbfbf;
    border-right: 4px solid var(--border-dark)
}

@media screen and (max-width: 767px) {
    .a-article #wpmem_restricted_msg+.ms-wrapper {
        padding: 24px
    }
}

.u-center {
    text-align: center
}

@media screen and (max-width: 767px) {
    .u-center.-sp-left {
        text-align: left
    }
}

.u-right {
    text-align: right
}

@media screen and (max-width: 992px) {
    .u-right-tbl {
        text-align: right
    }
}

.u-left {
    text-align: left
}

@media screen and (min-width: 993px) {
    .u-left-tbl-up {
        text-align: left
    }
}

.u-caution {
    display: inline-block;
    font-size: .875rem;
    text-indent: -1.15em;
    padding-left: 1.15em
}

.c-button.-l.-md+.u-caution {
    max-width: 340px;
    width: 100%;
    text-align: center;
    margin-top: calc(calc((1em - 1lh) / 2) + 1rem);
    margin-top: calc(var(--leading-trim) + var(--mg-xs))
}

@media screen and (max-width: 767px) {
    .c-button.-l.-md+.u-caution {
        max-width: none
    }
}

th.u-oblique-line.u-oblique-line.u-oblique-line {
    background-image: linear-gradient(to right top, #E1E1E1 calc(50% - 0.5px), #fff 50%, #fff calc(50% + 0.5px), #E1E1E1 calc(50% + 1px))
}

.u-red.u-red.u-red {
    color: #D30000;
    color: var(--color-red)
}

@media screen and (min-width: 768px) {
    .u-sp {
        display: none
    }
}

@media screen and (max-width: 767px) {
    .u-pc {
        display: none
    }
}

@media screen and (min-width: 993px) {
    .u-tbl {
        display: none
    }
}

@media screen and (max-width: 992px) {
    .u-tbl-up {
        display: none
    }
}

@media screen and (max-width: 767px) {
    .u-sp-up {
        display: none
    }
}

.u-fw-black.u-fw-black.u-fw-black {
    font-weight: 900;
    font-weight: var(--fw-black)
}

.u-fz-sm.u-fz-sm.u-fz-sm {
    font-size: .875rem
}

@media screen and (max-width: 767px) {
    .u-fz-sm-sp.u-fz-sm-sp.u-fz-sm-sp {
        font-size: .75rem
    }
}

.u-lh-xl.u-lh-xl.u-lh-xl {
    line-height: 2.5;
    line-height: var(--lineHeight-xl)
}

.u-logo {
    display: inline-block;
    white-space: nowrap;
    font-family: "Inter", sans-serif;
    font-family: var(--ff-en);
    font-size: 29px;
    font-weight: 300;
    font-weight: var(--fw-light);
    margin-top: calc((1em - 1lh) / 2);
    margin-top: var(--leading-trim);
    margin-bottom: calc((1em - 1lh) / 2);
    margin-bottom: var(--leading-trim)
}

@media screen and (max-width: 767px) {
    .u-logo {
        font-size: 20px
    }
}

.u-logo>b {
    font-weight: 600;
    font-weight: var(--fw-semibold)
}

@media screen and (max-width: 992px) {
    .site-header .u-logo {
        font-size: 29px
    }
}

@media screen and (max-width: 767px) {
    .site-header .u-logo {
        font-size: 16px
    }
}

.u-mt-sm.u-mt-sm.u-mt-sm {
    margin-top: 20px
}

@media screen and (max-width: 992px) {
    .u-mt-sm-tbl.u-mt-sm-tbl.u-mt-sm-tbl {
        margin-top: 20px
    }
}

@media screen and (max-width: 767px) {
    .u-mt-sm-sp.u-mt-sm-sp.u-mt-sm-sp {
        margin-top: 20px
    }
}

.u-mt-md.u-mt-md.u-mt-md {
    margin-top: 40px
}

@media screen and (max-width: 992px) {
    .u-mt-md-tbl.u-mt-md-tbl.u-mt-md-tbl {
        margin-top: 40px
    }
}

@media screen and (max-width: 767px) {
    .u-mt-md-sp.u-mt-md-sp.u-mt-md-sp {
        margin-top: 40px
    }
}

.u-no-margin.u-no-margin.u-no-margin {
    margin: 0
}

.u-message {
    position: fixed;
    top: 40px;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 300px;
    height: 60px;
    width: 100%;
    margin: 0 auto;
    background: #fff;
    border-radius: 30px;
    z-index: 2000;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .2);
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: visibility .4s, opacity .4s, transform .4s
}

.u-message.-show {
    visibility: visible;
    opacity: 1;
    transform: translateY(0)
}

.u-note {
    display: inline-block;
    font-size: .875rem;
    font-weight: 400;
    font-weight: var(--fw-normal)
}

.u-with-note {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 16px
}

.u-reel {
    line-height: 1.3333;
    line-height: var(--lineHeight-sm);
    height: calc(1em*1.3333 + 2px);
    height: calc(1em*var(--lineHeight-sm) + 2px);
    overflow: hidden
}

.u-reel__inner {
    display: block;
    padding-bottom: 2px
}

.u-reel__inner:first-child {
    opacity: 1
}

.u-reel__inner:last-child {
    opacity: 0
}

.u-svg-holder {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    overflow: hidden
}

.u-w-20per {
    width: 20%
}


/* label */

span.new_label {
    color: #ffffff;
    font-size: 10px;
    /* background: #f35b69; */
    background: #000;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 3px 5px;
    z-index: 1;
}

.a-excerpt {
    position: relative;
}

.a-excerpt::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 10%;
    background: linear-gradient(to bottom, transparent, #fff);
    z-index: 10;
}

.a-excerpt > :first-child {
    margin-top: 0;
}

.a-excerpt > :last-child {
    margin-bottom: 0;
}

.heading {
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 24px;
}

@media screen and (max-width: 767px) {
    .heading {
        font-size: 20px;
        margin-bottom: 16px;
    }
}

.card-list {
    display: grid;
    gap: 32px;
}

@media screen and (max-width: 767px) {
    .card-list {
        gap: 24px;
    }
}

.card-list__item {
    position: relative;
}

.card-list__link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.card-list__rank {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    background: var(--color-primary-light);
    line-height: 1;
    min-width: 40px;
    min-height: 40px;
    box-sizing: border-box;
    z-index: 1;
}

@media screen and (max-width: 767px) {
    .card-list__rank {
        font-size: 12px;
        min-width: 24px;
        min-height: 24px;
        padding: 2px;
    }
}

.card-list__item:first-child .card-list__rank {
    background: #caa846;
}

.card-list__item:nth-child(2) .card-list__rank {
    background: #9c9c9c;
}

.card-list__item:nth-child(3) .card-list__rank {
    background: #7e6210;
}


.card-list__head {
    display: flex;
    align-items: start;
    gap: 16px
}

.card-list__thumb {
    width: 230px;
    aspect-ratio: 3 / 2;
    flex-shrink: 0;
    overflow: hidden;
}

@media screen and (max-width: 767px) {
    .card-list__thumb {
        width: 100px;
    }
}

.card-list__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.card-list__item:has(.card-list__link:hover) .card-list__thumb img {
    transform: scale(1.05);
}

.card-list__info {
    flex: 1;
}

.card-list__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}

.card-list__categories {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.card-list__category {
    font-size: 13px;
    color: var(--color-base);
    line-height: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border: 1px solid var(--border-dark);
    border-radius: 4px;
    padding: 6px 12px;
}

@media screen and (max-width: 767px) {
    .card-list__category {
        font-size: 11px;
        padding: 3px 4px;
    }
}

.card-list__fav {
    z-index: 1;
}

.card-list__title {
    font-weight: 700;
    font-size: 20px;
    margin-top: 8px;
    line-height: 1.5;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

@media screen and (max-width: 767px) {
    .card-list__title {
        font-size: 14px;
        margin-top: 4px;
    }
}

.card-list__item:has(.card-list__link:hover) .card-list__title {
    color: var(--color-primary-light);
}

.card-list__date {
    display: flex;
    gap: 16px;
    align-items: center;
    font-size: 14px;
    margin-top: 8px;
    line-height: 1.5;
    letter-spacing: 0;
    font-family: var(--ff-date);
}

@media screen and (max-width: 767px) {
    .card-list__date {
        font-size: 12px;
        margin-top: 4px;
    }
}

.card-list__item.-premium .card-list__date::after {
    content: "";
    display: block;
    width: 13px;
    height: 15px;
    background: #caa846;
    background: var(--color-premium);
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 13.6 15.8"><path d="M12.4,5.8h-1.7v-1.4C10.6,1.6,9.3,0,6.8,0s-3.9,1.7-3.9,4.5v1.4H.9c-.6,0-1,.6-1,1.2v7.6c0,.6.6,1.1,1.2,1.2h11.4c.6,0,1-.6,1-1.2v-7.6c0-.6-.6-1.1-1.2-1.2ZM7.8,13.1h-2.2l.5-2.2c-.5-.2-.8-.7-.8-1.2,0-.7.6-1.3,1.3-1.3.7,0,1.3.6,1.3,1.3h0c0,.5-.3,1-.8,1.2l.6,2.2ZM8.7,5.8h-3.9v-1.7c-.1-1,.6-2,1.6-2.1.1,0,.2,0,.3,0,1,0,1.9.8,1.9,1.8,0,.1,0,.2,0,.4v1.7h0,0Z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    margin-top: -2px
}

.card-list__description {
    margin-top: 8px;
    line-height: 1.5;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

@media screen and (max-width: 767px) {
    .card-list__description {
        font-size: 12px;
    }
}

.list-section + .list-section {
    margin-top: 40px;
}

@media screen and (max-width: 767px) {
    .list-section + .list-section {
        margin-top: 16px;
    }
}

.list-section__heading {
    font-size: 20px;
    font-weight: 700;
    border-bottom: 1px solid #dcdcdc;
    padding-bottom: 8px;
    margin-bottom: 40px;
    line-height: 1.5;
    letter-spacing: 0;
    font-family: var(--ff-date);
}

@media screen and (max-width: 767px) {
    .list-section__heading {
        margin-bottom: 24px;
    }
}

.category-link-list {
    flex: 1;
    display: flex;
    gap: 15px;
    margin-bottom: 24px;
    overflow-x: auto;
}

@media screen and (max-width: 767px) {
    .category-link-list {
        margin-bottom: 16px;
    }
}

.category-link-list__item {
    flex-shrink: 0;
}

.category-link-list__link {
    display: inline-block;
    text-decoration: none;
    padding: 8px;
    height: 100%;
    border-bottom: 1px solid var(--border-darken);
    box-sizing: border-box;
    text-wrap: nowrap;
}

.category-link-list__link[aria-current="page"] {
    font-weight: 700;
    color: var(--color-primary-light);
    border-bottom: 3px solid var(--color-primary-light);
}

.video {
    width: 100%;
    aspect-ratio: 16 / 9;
}

.video iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
}