@charset "UTF-8";
:root { --bg-color-light: #fafafa; --bg-color-dark: #1f1f20; --sub-bg-color-light: #f0f0f0; --sub-bg-color-dark: #2a2a2b; --text-color-light: #232324; --text-color-dark: #ffffff; --sub-text-color-light: #6e6e6f; --sub-text-color-dark: #929293; --link-color-light: #232324; --link-color-dark: #ffffff; --primary-color-light: #757575; --primary-color-dark: #999999; --mobile-column-count: 1; --body-width: 960px; --border-color-light: #e5e5ea; --border-color-dark: #3a3a3c; --box-color-light: #c7c7cc; --box-color-dark: #48484a; --alert-color-light: #bf1419; --alert-color-dark: #ff5555; --color-logo-primary: #737373; }

:root, * { --bg-color: var(--bg-color-light); --sub-bg-color: var(--sub-bg-color-light); --text-color: var(--text-color-light); --sub-text-color: var(--sub-text-color-light); --link-color: var(--link-color-light); --primary-color: var(--primary-color-light); --border-color: var(--border-color-light); --box-color: var(--box-color-light); --alert-color: var(--alert-color-light); --logo-color: var(--color-logo-primary); }

@media (prefers-color-scheme: light) { :root, * { --bg-color: var(--bg-color-light); --sub-bg-color: var(--sub-bg-color-light); --text-color: var(--text-color-light); --sub-text-color: var(--sub-text-color-light); --link-color: var(--link-color-light); --primary-color: var(--primary-color-light); --border-color: var(--border-color-light); --box-color: var(--box-color-light); --alert-color: var(--alert-color-light); --logo-color: var(--color-logo-primary); } }

@media (prefers-color-scheme: dark) { :root, * { --bg-color: var(--bg-color-dark); --sub-bg-color: var(--sub-bg-color-dark); --text-color: var(--text-color-dark); --sub-text-color: var(--sub-text-color-dark); --link-color: var(--link-color-dark); --primary-color: var(--primary-color-dark); --border-color: var(--border-color-dark); --box-color: var(--box-color-dark); --alert-color: var(--alert-color-dark); --logo-color: var(--text-color-dark); } }

html, body { margin: 0; padding: 0; background: #fff; }

html *, body * { box-sizing: border-box; }

.nol-common-footer { color: var(--text-color); font-family: ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ W3,Hiragino Kaku Gothic,メイリオ,Meiryo,Avenir,Helvetica Neue,Helvetica,Arial,sans-serif; font-size: 16px; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; box-sizing: border-box; margin: 0; -webkit-overflow-scrolling: touch; outline: none; }

.nol-common-footer *, .nol-common-footer *:before, .nol-common-footer *:after { box-sizing: border-box; margin: 0; -webkit-overflow-scrolling: touch; outline: none; }

.nol-common-footer a { color: var(--link-color); text-decoration: none; }

.nol-common-footer { width: 960px; margin: 0 auto; padding: 40px 0; background: #f0f0f0; background: var(--sub-bg-color); }

.nol-common-footer-wrapper { width: 100%; background: #f0f0f0; background: var(--sub-bg-color); overflow-x: hidden; }

.nol-common-footer-group { display: inline-block; margin-left: 50px; vertical-align: top; }

.nol-common-footer-group:nth-of-type(1) { margin-left: 0; }

.nol-common-footer-logo { width: 60px; height: 16px; background-size: 60px 16px; text-indent: -9999px; position: relative; z-index: 1; background-image: url(../images/logo_nhk_type_gray.svg); }

.nol-common-footer-logo:hover { background-image: url(../images/logo_nhk_type_black.svg); }

.nol-common-footer-logo.plus { width: 78px; height: 20px; background-size: 78px 20px; background-image: url(../images/logo_nhk_plus_type_gray.svg); }

.nol-common-footer-logo.plus:hover { background-image: url(../images/logo_nhk_plus_type_black.svg); }

.nol-common-footer-logo a { width: 100%; height: 100%; display: block; }

.nol-common-footer-items { width: 450px; position: relative; z-index: 1; margin-top: 20px; border-top: 1px solid #e5e5ea; border-top: 1px solid var(--border-color); }

.nol-common-footer-item { font-size: 12px; font-weight: bold; margin: 0 37px 0 0; padding: 13px 0; color: #737373; color: var(--logo-color); display: inline-block; }

.nol-common-footer-item a { color: #737373; color: var(--logo-color); }

.nol-common-footer-item a:hover { color: #232324; color: var(--text-color); opacity: 1}

.nol-common-footer-copyright { font-size: 12px; line-height: 1.4; color: #6e6e6f; color: var(--sub-text-color); margin-top: 60px; display: block; }

@media (prefers-color-scheme: light) { .nol-common-footer-logo { background-image: url(../images/logo_nhk_type_gray.svg); }
  .nol-common-footer-logo:hover { background-image: url(../images/logo_nhk_type_black.svg); }
  .nol-common-footer-logo.plus { background-image: url(../images/logo_nhk_plus_type_gray.svg); }
  .nol-common-footer-logo.plus:hover { background-image: url(../images/logo_nhk_plus_type_black.svg); } }

@media (prefers-color-scheme: dark) { .nol-common-footer-logo { background-image: url(../images/logo_nhk_type_white.svg); }
  .nol-common-footer-logo:hover { background-image: url(../images/logo_nhk_type_white.svg); }
  .nol-common-footer-logo.plus { background-image: url(../images/logo_nhk_plus_type_white.svg); }
  .nol-common-footer-logo.plus:hover { background-image: url(../images/logo_nhk_plus_type_white.svg); } }

@media (max-width: 960px) { .nol-common-footer { width: 100%; padding: 32px 20px; }
  .nol-common-footer-group { display: inline-block; margin: 30px 0 0; }
  .nol-common-footer-group:nth-of-type(1) { margin-top: 0; }
  .nol-common-footer-items { width: 100%; display: inline-block; margin-top: 10px; }
  .nol-common-footer-item { font-size: 13px; padding: 10px 0; display: inline-block; margin-right: 20px; }
  .nol-common-footer-copyright { font-size: 10px; margin-top: 40px; } }