body.tn-inner-header-managed #header-container,
body.tn-inner-header-managed #header-container-in {
background: var(--tn-inner-paper, #f5f9fc);
} body.tn-inner-header-managed #header-container-in {
display: block;
}
body.tn-inner-header-managed #header {
position: relative;
display: block;
width: 100%;
min-height: 0;
height: auto;
aspect-ratio: auto;
margin: 0;
padding: 0;
border: 0;
background: none;
box-shadow: none;
}
body.tn-inner-header-managed #header-in {
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 6px;
width: min(calc(100% - 40px), 1120px);
max-width: 1120px;
min-height: 90px;
height: auto;
margin: 0 auto;
padding: 20px 0;
background: none;
}
body.tn-inner-header-managed #header .logo-header {
box-sizing: border-box;
width: auto;
max-width: 100%;
max-height: none;
margin: 0;
padding: 0;
border: 0;
background: none;
text-align: center;
box-shadow: none;
}
body.tn-inner-header-managed #header .logo-header::after {
content: none;
}
body.tn-inner-header-managed #header .site-name-text-link {
display: block;
max-width: 100%;
margin: 0;
padding: 0;
color: var(--tn-inner-ink, #1f3540);
text-decoration: none;
}
body.tn-inner-header-managed #header .site-name-text {
color: inherit;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", sans-serif;
font-size: clamp(20px, 2.2vw, 27px);
font-weight: 650;
line-height: 1.5;
letter-spacing: .035em;
overflow-wrap: anywhere;
white-space: normal;
text-wrap: balance;
text-shadow: none;
-webkit-text-stroke: 0;
}
body.tn-inner-header-managed.tn-font-mincho #header .site-name-text {
font-family: "Yu Mincho", "Hiragino Mincho ProN", "BIZ UDPMincho", Georgia, serif;
}
body.tn-inner-header-managed #header .tagline {
max-width: 100%;
margin: 0;
padding: 0;
color: var(--tn-inner-muted, #52646c);
font-size: 11px;
font-weight: 400;
line-height: 1.65;
letter-spacing: .06em;
text-align: center;
overflow-wrap: anywhere;
text-shadow: none;
}
body.tn-inner-header-managed #header .site-name img { width: auto;
height: auto;
max-width: min(100%, 420px);
max-height: 64px;
margin-inline: auto;
object-fit: contain;
}
body.tn-inner-header-managed #header .site-name-text-link:focus-visible,
body.tn-inner-header-managed #header .site-name a:focus-visible {
outline: 2px solid var(--tn-inner-accent, #286b87);
outline-offset: 5px;
border-radius: 3px;
} body.tn-inner-header-managed.tn-inner-header-image #header::after {
content: "";
box-sizing: border-box;
display: block;
width: min(calc(100% - 40px), 1120px);
height: clamp(170px, 20vw, 224px);
margin: 0 auto 22px;
border-radius: var(--tn-inner-radius, 14px);
background-color: var(--tn-inner-paper-deep, #e6eff4);
background-image: var(--tn-inner-header-image, none);
background-position: center 58%;
background-size: cover;
background-repeat: no-repeat;
}
body.tn-inner-header-managed.tn-inner-header-plain #header::after,
body.tn-inner-header-managed.tn-inner-header-hidden #header::after {
content: none;
} body.tn-inner-header-managed .fixed-header #header::after {
display: none;
} body.tn-inner-header-managed.tn-inner-header-hidden #header {
display: none;
}
body.tn-inner-header-managed #navi {
border-top: 1px solid var(--tn-inner-rule, #dbe4e8);
border-bottom: 1px solid var(--tn-inner-rule, #dbe4e8);
background: var(--tn-inner-surface, #fff);
color: var(--tn-inner-ink, #1f3540);
}
body.tn-inner-header-managed #navi a {
color: inherit;
} body.tn-inner-header-managed.tn-article-design:not(.tn-article-simple) #main {
margin-top: 0;
}
@media (max-width: 600px) {
body.tn-inner-header-managed #header-in {
width: calc(100% - 32px);
min-height: 76px;
padding: 15px 0;
}
body.tn-inner-header-managed #header .site-name-text {
font-size: 20px;
}
body.tn-inner-header-managed.tn-inner-header-image #header::after {
width: calc(100% - 32px);
height: clamp(136px, 36vw, 170px);
margin-bottom: 16px;
background-position: center 58%;
}
body.tn-inner-header-managed #header .site-name img {
max-height: 52px;
}
}
@media print {
body.tn-inner-header-managed #header::after {
display: none;
}
}  body.tn-inner-header-managed #navi .tn-nav__cta-item > a.tn-nav__cta {
box-sizing: border-box;
height: 40px;
margin: 10px 8px;
align-items: center;
justify-content: center;
line-height: 1.2;
padding-inline: 18px;
border-radius: 999px;
background: var(--tn-inner-accent, #286b87);
color: #fff;
font-weight: 600;
} body.tn-inner-header-managed.tn-design-night #header-container,
body.tn-inner-header-managed.tn-design-night #header-container-in {
background: linear-gradient(180deg, #1d1a3d, #15132c);
}
body.tn-inner-header-managed.tn-design-night #header .site-name-text-link {
color: #fff;
}
body.tn-inner-header-managed.tn-design-night #header .tagline {
color: rgba(236, 232, 255, .72);
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-image #header::after {
background-color: #2a2556;
box-shadow: 0 14px 40px rgba(10, 8, 30, .35);
}
body.tn-inner-header-managed.tn-design-night #navi {
border-color: rgba(236, 232, 255, .12);
background: #15132c;
color: #ece8ff;
}
body.tn-inner-header-managed.tn-design-night #navi .tn-nav__cta-item > a.tn-nav__cta {
background-color: #ece8ff;
background-image: linear-gradient(110deg, transparent 38%, rgba(178, 160, 255, .55) 46%, #fff 50%, rgba(178, 160, 255, .55) 54%, transparent 62%);
background-size: 300% 100%;
background-repeat: no-repeat;
color: #231d4f;
}
@media (prefers-reduced-motion: no-preference) {
body.tn-inner-header-managed.tn-design-night #navi .tn-nav__cta-item > a.tn-nav__cta {
animation: tn-inner-cta-shine 4s ease-out infinite both;
}
}
@keyframes tn-inner-cta-shine {
0% { background-position: 100% 0; }
18%, 100% { background-position: 0% 0; }
}
body.tn-inner-brand.tn-design-night #footer {
border-top: 0;
background:
radial-gradient(1px 1px at 12% 30%, rgba(255, 255, 255, .8), transparent),
radial-gradient(1px 1px at 28% 72%, rgba(255, 255, 255, .6), transparent),
radial-gradient(1.5px 1.5px at 46% 22%, rgba(236, 232, 255, .9), transparent),
radial-gradient(1px 1px at 63% 64%, rgba(255, 255, 255, .7), transparent),
radial-gradient(1.5px 1.5px at 82% 34%, rgba(236, 232, 255, .85), transparent),
linear-gradient(180deg, #1d1a3d, #120f26);
color: rgba(236, 232, 255, .72);
}
body.tn-inner-brand.tn-design-night #footer a,
body.tn-inner-brand.tn-design-night #footer .copyright {
color: rgba(236, 232, 255, .86);
} body.tn-inner-brand.tn-design-night :is(.sns-share, .sns-follow) a.sns-button {
border: 1px solid var(--tn-inner-accent, #4b3f8f) !important;
border-radius: 999px !important;
background: transparent !important;
color: var(--tn-inner-accent-dark, #352b6e) !important;
box-shadow: none !important;
filter: none !important;
font-family: system-ui, -apple-system, sans-serif;
letter-spacing: .08em;
}
body.tn-inner-brand.tn-design-night :is(.sns-share, .sns-follow) a.sns-button :is(span, .social-icon, [class*="icon"]) {
color: inherit !important;
}
body.tn-inner-brand.tn-design-night :is(.sns-share, .sns-follow) a.sns-button:hover {
background: var(--tn-inner-accent-soft, #ebe8f7) !important;
transform: none;
}
body.tn-inner-brand.tn-design-night :is(.sns-share-message, .sns-follow-message) {
color: var(--tn-inner-muted, #5b5875);
font-family: system-ui, -apple-system, sans-serif;
font-size: 12px;
letter-spacing: .16em;
} body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container {
position: relative;
isolation: isolate;
overflow: hidden;
background: radial-gradient(ellipse at 70% -20%, #2c2763 0%, transparent 60%), linear-gradient(180deg, #1b1838, #121027);
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container-in {
position: relative;
z-index: 1;
background: none;
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container::before,
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container::after {
content: "";
position: absolute;
z-index: 0;
inset: 0;
pointer-events: none;
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container::before {
background:
radial-gradient(1px 1px at 6% 22%, #fff, transparent),
radial-gradient(1px 1px at 14% 68%, rgba(255, 255, 255, .8), transparent),
radial-gradient(1.5px 1.5px at 23% 38%, #e9e4ff, transparent),
radial-gradient(1px 1px at 31% 82%, rgba(255, 255, 255, .7), transparent),
radial-gradient(1px 1px at 42% 16%, #fff, transparent),
radial-gradient(1px 1px at 55% 58%, rgba(255, 255, 255, .75), transparent),
radial-gradient(1.5px 1.5px at 66% 28%, #e9e4ff, transparent),
radial-gradient(1px 1px at 74% 74%, rgba(255, 255, 255, .7), transparent),
radial-gradient(1px 1px at 86% 18%, #fff, transparent),
radial-gradient(1px 1px at 94% 52%, rgba(255, 255, 255, .8), transparent);
opacity: .85;
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container::after {
background:
radial-gradient(2px 2px at 10% 46%, #fff, transparent 70%),
radial-gradient(1.5px 1.5px at 27% 14%, #f3f0ff, transparent 70%),
radial-gradient(2px 2px at 48% 76%, #fff, transparent 70%),
radial-gradient(1.5px 1.5px at 61% 12%, #f3f0ff, transparent 70%),
radial-gradient(2px 2px at 79% 44%, #fff, transparent 70%),
radial-gradient(1.5px 1.5px at 91% 80%, #f3f0ff, transparent 70%);
filter: drop-shadow(0 0 3px rgba(214, 206, 255, .9));
opacity: .35;
}
@media (prefers-reduced-motion: no-preference) {
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container::before {
animation: tn-stars-a 7s ease-in-out infinite alternate;
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header-container::after {
animation: tn-stars-b 5s ease-in-out infinite alternate;
}
}
@keyframes tn-stars-a {
from { opacity: .55; }
to { opacity: .95; }
}
@keyframes tn-stars-b {
0%, 40% { opacity: .15; }
100% { opacity: .9; }
} body.tn-article-design .article-header > .eye-catch-wrap {
display: block;
margin-inline: 0;
padding: 0;
transform: none;
border: 0;
border-radius: var(--tn-article-radius, 14px);
background: transparent;
box-shadow: none;
}
body.tn-article-design .article-header > .eye-catch-wrap > .eye-catch {
position: relative;
width: 100%;
max-width: none;
margin: 0;
}
body.tn-article-design .article-header > .eye-catch-wrap img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 3 / 2;
object-fit: cover;
border-radius: var(--tn-article-radius, 14px);
box-shadow: 0 18px 40px rgba(31, 29, 54, .14);
}
body.tn-article-design .article-header > .eye-catch-wrap .cat-label {
top: 14px;
left: 14px;
max-width: calc(100% - 28px);
padding: 3px 12px;
border: 1px solid var(--tn-article-accent, #4b3f8f);
border-radius: 999px;
background: rgba(255, 255, 255, .92);
color: var(--tn-article-accent-dark, #352b6e);
font: 700 11px/1.6 system-ui, -apple-system, sans-serif;
letter-spacing: .14em;
opacity: 1;
} @media (max-width: 1023px) {
body.tn-inner-header-managed #navi {
display: block !important;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc {
display: flex !important;
justify-content: center;
flex-wrap: nowrap;
overflow-x: auto;
scrollbar-width: none;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc::-webkit-scrollbar {
display: none;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li {
flex: 0 0 auto;
width: auto;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li > a {
height: 48px;
padding: 0 14px;
}
body.tn-inner-header-managed #navi .tn-nav__cta-item > a.tn-nav__cta {
height: 34px;
margin: 7px 8px;
}
}
@media (max-width: 600px) {
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc {
justify-content: flex-start;
}
} body.tn-inner-header-managed #navi .navi-in > ul.menu-pc {
display: flex;
justify-content: center;
align-items: center;
gap: 4px 10px;
min-height: 60px;
padding-block: 8px;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li {
flex: 0 0 auto;
width: auto;
height: auto;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li > a {
display: flex;
align-items: center;
justify-content: center;
height: 40px;
padding: 0 14px;
border-radius: 999px;
font-family: var(--tn-inner-font, system-ui, sans-serif);
font-size: 14px;
font-weight: 500;
letter-spacing: .08em;
line-height: 1;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li > a :is(.caption-wrap, .item-label) {
font: inherit;
letter-spacing: inherit;
line-height: inherit;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li:not(.tn-nav__cta-item) > a:hover {
background: rgba(127, 127, 127, .12);
}
body.tn-inner-header-managed #navi .tn-nav__cta-item > a.tn-nav__cta {
height: 40px;
margin: 0 0 0 6px;
padding: 0 20px;
font-size: 13px;
font-weight: 600;
}
body.tn-inner-header-managed.tn-design-night #navi .navi-in > ul.menu-pc > li:not(.tn-nav__cta-item) > a {
color: rgba(236, 232, 255, .88);
}
body.tn-inner-header-managed.tn-design-night #navi .navi-in > ul.menu-pc > li:not(.tn-nav__cta-item) > a:hover {
background: rgba(236, 232, 255, .1);
color: #fff;
}
@media (max-width: 600px) {
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc {
justify-content: flex-start;
padding-inline: 12px;
}
} body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header {
min-height: 0;
background: none;
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header :is(.site-name-text-link, .site-name-text) {
color: #fff;
}
body.tn-inner-header-managed.tn-design-night.tn-inner-header-plain #header .tagline {
color: rgba(236, 232, 255, .72);
} .tn-mobile-cta {
display: none;
}
.tn-mobile-cta[hidden] {
display: none !important;
}
@media (max-width: 834px) {
.tn-mobile-cta:not([hidden]) {
position: fixed;
z-index: 9990;
right: 16px;
bottom: calc(16px + env(safe-area-inset-bottom, 0px));
left: 16px;
display: flex;
justify-content: center;
transition: opacity .2s ease, transform .2s ease;
}
body.mblt-footer-mobile-buttons .tn-mobile-cta {
bottom: calc(66px + env(safe-area-inset-bottom, 0px));
}
.tn-mobile-cta.is-hidden {
opacity: 0;
transform: translateY(12px);
pointer-events: none;
}
.tn-mobile-cta__button {
display: flex;
width: min(100%, 360px);
min-height: 50px;
align-items: center;
justify-content: center;
border-radius: 999px;
background-color: var(--tn-inner-accent, #4b3f8f);
background-image: linear-gradient(110deg, transparent 38%, rgba(255, 255, 255, .35) 50%, transparent 62%);
background-size: 300% 100%;
background-repeat: no-repeat;
box-shadow: 0 10px 26px rgba(21, 19, 44, .35);
color: #fff !important;
font: 700 15px/1.3 system-ui, -apple-system, sans-serif;
letter-spacing: .06em;
text-decoration: none !important;
}
body.tn-design-night .tn-mobile-cta__button {
background-color: #ece8ff;
background-image: linear-gradient(110deg, transparent 38%, rgba(178, 160, 255, .55) 46%, #fff 50%, rgba(178, 160, 255, .55) 54%, transparent 62%);
color: #231d4f !important;
}
body.tn-has-mobile-cta #footer {
padding-bottom: 80px;
}
}
@media (max-width: 834px) and (prefers-reduced-motion: no-preference) {
.tn-mobile-cta__button {
animation: tn-inner-cta-shine 4s ease-out infinite both;
}
} body.tn-inner-brand.tn-article-simple .article-header > .entry-title {
font-size: clamp(22px, 3.2vw, 30px);
line-height: 1.55;
letter-spacing: .03em;
} .mobile-footer-menu-buttons .tn-mail-menu-button .menu-icon {
color: var(--tn-inner-accent, #4b3f8f);
}
.mobile-footer-menu-buttons .tn-mail-menu-button .menu-caption {
color: var(--tn-inner-accent-dark, #352b6e);
font-weight: 700;
} body.tn-article-design .article-header > .eye-catch-wrap {
width: auto;
max-width: 100%;
} .mobile-footer-menu-buttons {
display: flex;
box-sizing: border-box;
width: 100%;
padding-bottom: env(safe-area-inset-bottom, 0px);
}
.mobile-footer-menu-buttons > li.menu-button {
flex: 1 1 0;
width: auto;
min-width: 0;
}
.mobile-footer-menu-buttons .menu-caption {
white-space: nowrap;
} body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li.menu-item-home > a {
min-width: 44px;
padding: 0 10px;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li.menu-item-home > a :is(.caption-wrap, .item-label) {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li.menu-item-home > a::before {
content: "";
width: 20px;
height: 20px;
background: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M3.5 10.5 12 3.5l8.5 7'/%3E%3Cpath d='M5.5 9v11h4.8v-6h3.4v6h4.8V9'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M3.5 10.5 12 3.5l8.5 7'/%3E%3Cpath d='M5.5 9v11h4.8v-6h3.4v6h4.8V9'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (max-width: 600px) {
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc {
justify-content: space-between;
gap: 2px;
overflow-x: visible;
padding-inline: 8px;
}
body.tn-inner-header-managed #navi .navi-in > ul.menu-pc > li > a {
padding: 0 8px;
font-size: 12.5px;
letter-spacing: .04em;
}
body.tn-inner-header-managed #navi .tn-nav__cta-item > a.tn-nav__cta {
margin: 0;
padding: 0 12px;
font-size: 12.5px;
}
}