*, :before, :after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

html {
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  line-height: 1.15;
  font-feature-settings: 'palt' on;
}

body {
  margin: 0;
}

main {
  display: block;
}

p, table, blockquote, address, pre, iframe, form, figure, dl {
  margin: 0;
}

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

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

dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  clear: both;
  color: inherit;
  border-top-width: 1px;
  margin: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: inherit;
}

address {
  font-style: inherit;
}

a {
  color: inherit;
  background-color: rgba(0, 0, 0, 0);
  text-decoration: none;
}

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

b, strong {
  font-weight: bolder;
}

code, kbd, samp {
  font-family: monospace, monospace;
  font-size: inherit;
}

small {
  font-size: 80%;
}

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

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

svg, img, embed, object, iframe {
  vertical-align: bottom;
}

button, input, optgroup, select, textarea {
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  text-align: inherit;
  text-transform: inherit;
  background: none;
  border-radius: 0;
  margin: 0;
  padding: 0;
}

[type="checkbox"] {
  -webkit-appearance: checkbox;
  -ms-appearance: checkbox;
  appearance: checkbox;
}

[type="radio"] {
  -webkit-appearance: radio;
  -ms-appearance: radio;
  appearance: radio;
}

button, [type="button"], [type="reset"], [type="submit"] {
  cursor: pointer;
}

button:disabled, [type="button"]:disabled, [type="reset"]:disabled, [type="submit"]:disabled {
  cursor: default;
}

:-moz-focusring {
  outline: auto;
}

select:disabled {
  opacity: inherit;
}

option {
  padding: 0;
}

fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

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

label[for] {
  cursor: pointer;
}

details {
  display: block;
}

summary {
  display: list-item;
}

[contenteditable]:focus {
  outline: auto;
}

table {
  border-color: inherit;
  border-collapse: collapse;
}

caption {
  text-align: left;
}

td, th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: bold;
}

:root {
  --graph-100: #353535;
  --graph-70: #727272;
  --graph-40: #ccc;
  --graph-20: #eee;
  --snow-100: #fff;
  --sky-40: #cde8f5;
  --sky-20: #f3f9fc;
  --sun-100: #ffc918;
  --sun-40: #ffe9a3;
  --inSmartBank-blue: #057fba;
  --inSmartBnak-graph-50: #bbb;
  --inSmartBank-graph-30: #e5e5e5;
  --inSmartBank-graph-10: #f5f5f5;
  --inSmartBank-dsky: #a6b9c5;
  --spacing-xxxlarge: 64px;
  --spacing-xxlarge: 48px;
  --spacing-xlarge: 36px;
  --spacing-large: 24px;
  --spacing-medium: 16px;
  --spacing-small: 12px;
  --spacing-xsmall: 8px;
  --spacing-xxsmall: 4px;
  --fontSize-xxlarge: 36px;
  --fontSize-xlarge: 24px;
  --fontSize-large: 18px;
  --fontSize-medium: 16px;
  --fontSize-regular: 15px;
  --fontSize-small: 14px;
  --fontSize-xsmall: 13px;
  --fontSize-xxsmall: 11px;
  --lineHeight-large: 2;
  --lineHeight-default: 1.7;
  --lineHeight-small: 1.5;
  --letterSpacing-default: .05em;
  --fontFamily-default: -apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI","Hiragino Kaku Gothic ProN","Hiragino Sans",Arial,Meiryo,sans-serif;
  --fontFamily-monospaced: "SFMono-Medium", "SF Mono", "Segoe UI Mono", "Roboto Mono", "Ubuntu Mono", Menlo, Consolas, Courier, monospace;
  --fontWeight-default: normal;
  --fontWeight-bold: 500;
  --fontWeight-xbold: bold;
  --width-wrapper: 1300px;
  --width-articleWide: 900px;
  --width-article: 640px;
  --area-medium: 64px;
}

html {
  scroll-padding-top: calc(var(--area-medium)  + var(--spacing-xlarge) );
  scroll-behavior: smooth;
}

body {
  color: var(--graph-100);
  background: var(--snow-100);
  font-size: var(--fontSize-regular);
  line-height: var(--lineHeight-default);
  letter-spacing: var(--letterSpacing-default);
  cursor: default;
  font-family: var(--fontFamily-default);
  font-weight: var(--fontWeight-default);
  font-feature-settings: "palt";
  text-rendering: optimizelegibility;
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  
}

input, button {
  font-size: var(--fontSize-regular);
  line-height: var(--lineHeight-default);
  letter-spacing: var(--letterSpacing-default);
  font-family: var(--fontFamily-default);
  font-weight: var(--fontWeight-default);
  text-rendering: optimizelegibility;
}

.urllist-title-link {
  font-size: 100%;
}

.a11y-hidden {
  width: 1px;
  height: 1px;
  white-space: nowrap;
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  overflow: hidden;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

#sbHeader {
  width: 100%;
  z-index: 1;
  background: #eee url("https://cdn-ak.f.st-hatena.com/images/fotolife/s/smartbank/20220831/20220831121621_original.jpg") 100% 100% / cover no-repeat;
  position: fixed;
  top: 0;
  left: 0;
}

#sbHeader-navigation {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

#sbHeader-regularNavigation {
  min-width: 0;
  flex: 1;
  justify-content: space-between;
  display: flex;
}

#sbHeader-regularNavigation a {
  color: var(--snow-100);
  font-weight: var(--fontWeight-bold);
  height: var(--area-medium);
}

#sbHeader-regularNavigation ul {
  display: none;
}

@media screen and (min-width: 769px) {
  #sbHeader-regularNavigation ul {
    display: flex;
  }
}

#sbHeader-regularNavigation ul li:first-of-type a {
  padding: 0 var(--spacing-xsmall) 0 var(--spacing-medium);
}

#sbHeader-regularNavigation ul li:last-of-type a {
  padding: 0 var(--spacing-medium) 0 var(--spacing-xsmall);
}

#sbHeader-regularNavigation ul a {
  line-height: var(--area-medium);
  padding: 0 var(--spacing-xsmall);
  display: block;
}

#sbHeader-regularNavigation ul.c-corporateLinks a {
  padding: 0 var(--spacing-xxsmall);
  font-size: var(--fontSize-small);
}

#sbHeader-regularNavigation .c-corporateLinks-positionsTrailing {
  display: none;
}

@media (min-width: 785px) {
  #sbHeader-regularNavigation .c-corporateLinks-positionsTrailing {
    display: inline;
  }
}

#sbHeader-primaryNavigation {
  display: flex;
}

#sbHeader-navigationTitle {
  align-items: center;
  gap: var(--spacing-xxsmall);
  padding: 0 0 0 var(--spacing-medium);
  display: flex;
  font-weight: var(--fontWeight-xbold) !important;
}

@media screen and (min-width: 769px) {
  #sbHeader-navigationTitle {
    padding: 0 var(--spacing-medium) 0 var(--spacing-medium);
    position: relative;
  }

  #sbHeader-navigationTitle:before {
    content: "";
    border-right: 1px solid var(--snow-100);
    height: 50%;
    width: 0;
    display: block;
    position: absolute;
    top: 25%;
    right: 0;
  }
}

#sbHeader-navigationTitle svg {
  width: 27px;
  height: 27px;
}

#sbHeader-search button {
  color: var(--snow-100);
  height: var(--area-medium);
  padding: 0 var(--spacing-xsmall);
}

#sbHeader-search svg {
  vertical-align: middle;
  transform: translateY(-.1em);
}

#sbHeader-largeLogo {
  text-align: center;
  padding: var(--spacing-xlarge) 0 calc(var(--spacing-xxlarge) * 2);
  margin: 0;
  display: none;
}

@media screen and (min-width: 769px) {
  #sbHeader-largeLogo {
    padding: var(--spacing-xxxlarge) 0 calc(var(--spacing-xxxlarge) * 2);
  }
}

#sbHeader-largeLogo a {
  display: inline-block;
}

#sbHeader-largeLogo svg {
  max-width: 57vw;
  height: auto;
}

@media screen and (min-width: 769px) {
  #sbHeader-largeLogo svg {
    max-width: 100%;
  }
}

#sbRegularSearch {
  width: 100%;
  height: 100%;
  z-index: 1;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
}

@media screen and (min-width: 769px) {
  #sbRegularSearch.is-open {
    display: block;
  }
}

#sbRegularSearch[aria-hidden="false"] {
  animation: fadeIn .2s cubic-bezier(0, 0, .2, 1);
}

#sbRegularSearch[aria-hidden="true"] {
  animation: fadeOut .2s cubic-bezier(0, 0, .2, 1);
}

#sbRegularSearch > div[data-micromodal-close] {
  height: 100%;
  background: rgba(0, 0, 0, .1);
}

#sbRegularSearch div[role="dialog"] {
  background: var(--inSmartBank-dsky);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  color: var(--snow-100);
}

#sbRegularSearch-content {
  max-width: var(--width-article);
  padding: 0 var(--spacing-large);
  justify-content: space-between;
  margin: 0 auto;
  display: flex;
}

#sbRegularSearch-content form {
  min-width: 0;
  flex-direction: row-reverse;
  flex: 1;
  display: flex;
}

#sbRegularSearch-content button {
  padding: 0 var(--spacing-small) 0 var(--spacing-large);
  align-items: center;
  display: flex;
}

#sbRegularSearch-content input {
  height: var(--area-medium);
  min-width: 0;
  font-weight: var(--fontWeight-bold);
  outline: none;
  flex: 1;
}

#sbRegularSearch-content input::-ms-input-placeholder {
  color: rgba(255, 255, 255, .5);
}

#sbRegularSearch-content input::placeholder {
  color: rgba(255, 255, 255, .5);
}

#sbCompactHeader {
  width: 100%;
  height: 100%;
  z-index: 1;
  background: var(--graph-100);
  color: var(--snow-100);
  display: none;
  position: fixed;
  top: 0;
  left: 0;
}

#sbCompactHeader.is-open {
  display: block;
}

@media screen and (min-width: 769px) {
  #sbCompactHeader.is-open {
    display: none;
  }
}

#sbCompactHeader[aria-hidden="false"] {
  animation: fadeIn .2s cubic-bezier(0, 0, .2, 1);
}

#sbCompactHeader[aria-hidden="true"] {
  animation: fadeOut .2s cubic-bezier(0, 0, .2, 1);
}

#sbCompactHeader-header {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

#sbCompactHeader-search {
  min-width: 0;
  flex: 1;
}

#sbCompactHeader-search form {
  flex-direction: row-reverse;
  display: flex;
}

#sbCompactHeader-search button {
  padding: 0 var(--spacing-small) 0 var(--spacing-large);
  align-items: center;
  display: flex;
}

#sbCompactHeader-search input {
  min-width: 0;
  height: var(--area-medium);
  outline: none;
  flex: 1;
}

#sbCompactHeader-links {
  padding: 5vw 0 var(--spacing-xxlarge);
  max-height: calc(100vh - var(--area-medium) );
  overflow-y: auto;
}

#sbCompactHeader-categoryLinks {
  font-size: var(--fontSize-xxlarge);
  font-weight: var(--fontWeight-xbold);
  line-height: var(--lineHeight-small);
  margin: 0 0 0 15%;
}

#sbCompactHeader-corporateLinks {
  margin: var(--spacing-xlarge) 0 0 15%;
}

#sbCompactHeader-corporateLinks a {
  padding: var(--spacing-xxsmall) 0;
  display: inline-block;
}

#sbCompactHeader-symbol {
  opacity: .3;
  z-index: -1;
  position: absolute;
  bottom: 0;
  right: -35%;
}

#sbCompactHeader-symbol svg {
  min-width: min(120vw, 700px);
  height: auto;
}

#sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus], #sbCompactHeader-header button[data-micromodal-close-disable-focus], #sbRegularSearch button[data-micromodal-close] {
  width: var(--area-medium);
  height: var(--area-medium);
  position: relative;
}

#sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus]:before, #sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus]:after, #sbCompactHeader-header button[data-micromodal-close-disable-focus]:before, #sbCompactHeader-header button[data-micromodal-close-disable-focus]:after, #sbRegularSearch button[data-micromodal-close]:before, #sbRegularSearch button[data-micromodal-close]:after {
  content: "";
  width: 32px;
  height: 0;
  border-top: 2px solid var(--snow-100);
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%);
}

#sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus] > span:before {
  content: "";
  width: 32px;
  height: 0;
  border-top: 2px solid var(--snow-100);
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%)translateY(-1px);
}

#sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus]:before {
  transform: translateX(-50%)translateY(-11px);
}

#sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus]:after {
  transform: translateX(-50%)translateY(10px);
}

@media screen and (min-width: 769px) {
  #sbHeader-compactNavigation button[data-micromodal-trigger-disable-focus] {
    display: none;
  }
}

#sbCompactHeader-header button[data-micromodal-close-disable-focus]:before, #sbCompactHeader-header button[data-micromodal-close-disable-focus]:after {
  width: 36px;
}

#sbCompactHeader-header button[data-micromodal-close-disable-focus]:before {
  transform: translateX(-50%)rotate(34deg);
}

#sbCompactHeader-header button[data-micromodal-close-disable-focus]:after {
  transform: translateX(-50%)rotate(-34deg);
}

#sbRegularSearch button[data-micromodal-close]:before, #sbRegularSearch button[data-micromodal-close]:after {
  width: 16px;
}

#sbRegularSearch button[data-micromodal-close]:before {
  transform: translateX(-50%)rotate(45deg);
}

#sbRegularSearch button[data-micromodal-close]:after {
  transform: translateX(-50%)rotate(-45deg);
}

#wrapper {
  max-width: var(--width-wrapper);
  margin: 0 auto;
}

#box2 {
  background: var(--sky-20);
  padding: 0 0 var(--spacing-xsmall);
  margin: var(--spacing-small) 0 0;
}

@media screen and (min-width: 769px) {
  #box2 {
    margin: var(--spacing-xxlarge) 0 0;
  }
}

#box2-inner {
  max-width: var(--width-wrapper);
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  #box2-inner {
    padding: var(--spacing-xxlarge) var(--spacing-xlarge);
    gap: var(--spacing-medium);
    grid-template-columns: 2fr 1fr 1fr;
    display: grid;
  }
}

#box2-inner .hatena-module {
  padding: var(--spacing-large) var(--spacing-medium);
}

@media screen and (min-width: 769px) {
  #box2-inner .hatena-module {
    border: none;
    padding: 0;
  }
}

#box2-inner .hatena-module:not(:first-of-type) {
  border-top: 1px solid var(--inSmartBank-graph-30);
}

@media screen and (min-width: 769px) {
  #box2-inner .hatena-module:not(:first-of-type) {
    border: none;
  }
}

#box2-inner .hatena-module-title {
  font-weight: var(--fontWeight-xbold);
  font-size: var(--fontSize-xsmall);
}

@media screen and (min-width: 769px) {
  #box2-inner .hatena-module-title {
    font-size: var(--fontSize-medium);
  }
}

#box2-inner .hatena-module-body {
  margin: var(--spacing-xsmall) 0 0;
  font-size: var(--fontSize-small);
}

@media screen and (min-width: 769px) {
  #box2-inner .hatena-module-body {
    font-size: var(--fontSize-small);
  }
}

#box2-inner .hatena-module-recent-entries {
  margin: 0 var(--spacing-large) 0 0;
}

#box2-inner .hatena-module-recent-entries .recent-entries-item {
  line-height: var(--lineHeight-small);
  gap: var(--spacing-xsmall);
  font-feature-settings: "palt";
  display: flex;
}

#box2-inner .hatena-module-recent-entries .recent-entries-item:before {
  content: "-";
  color: var(--graph-70);
}

#box2-inner .hatena-module-recent-entries .recent-entries-item + .recent-entries-item {
  margin: var(--spacing-xsmall) 0 0;
}

#box2-inner .hatena-module-archive .hatena-urllist li {
  line-height: var(--lineHeight-small);
  margin-top: var(--spacing-xxsmall);
}

#box2-inner .hatena-module-profile .hatena-module-body {
  column-gap: var(--spacing-medium);
  row-gap: var(--spacing-xxsmall);
  grid-template-columns: 64px 1fr;
  grid-template-areas: "thumb id"
                       "thumb follow";
  display: grid;
}

#box2-inner .hatena-module-profile .profile-icon-link {
  grid-area: thumb;
}

#box2-inner .hatena-module-profile .id {
  align-items: center;
  column-gap: var(--spacing-xxsmall);
  flex-wrap: wrap;
  display: flex;
}

#box2-inner .hatena-module-profile .id i, #box2-inner .hatena-module-profile .hatena-follow-button-box {
  margin: 0;
}

#box2-inner .hatena-module-profile .profile-about, #box2-inner .hatena-module-html, .breadcrumb {
  display: none;
}

#sbFooter {
  padding: var(--spacing-xxxlarge) var(--spacing-xxlarge);
  text-align: center;
  background: var(--graph-100);
  color: var(--snow-100);
}

#sbFooter .c-corporateLinks {
  gap: var(--spacing-medium);
  margin: var(--spacing-medium) 0 0;
  justify-content: center;
  display: flex;
}

#sbFooter-logo a {
  display: inline-block;
}

#sbFooter-logo svg {
  max-width: min(57vw, 200px);
  height: auto;
}

@media screen and (min-width: 769px) {
  #sbFooter-logo svg {
    max-width: 100%;
    max-width: 300px;
  }
}

#sbFooter-poem {
  max-width: 400px;
  margin: var(--spacing-xlarge) auto 0;
  font-size: var(--fontSize-xxsmall);
}

#sbFooter-poem div + div {
  margin: var(--spacing-medium) 0 0;
}

@media screen and (min-width: 769px) {
  #sbFooter-poem span {
    display: block;
  }
}

#sbFooter-smartBankLogo {
  margin: var(--spacing-xxlarge) 0 0;
}

#sbFooter-smartBankLogo a {
  display: inline-block;
}

#sbFooter-smartBankLogo svg {
  max-width: 150px;
  height: auto;
}

@media screen and (min-width: 769px) {
  #sbFooter-smartBankLogo svg {
    max-width: 200px;
  }
}

.archive-entries > .archive-entry:first-of-type {
  border: none;
}

.archive-entry {
  --thumbWidth: 100%;
  min-height: 230px;
  padding: calc(52.5% + var(--spacing-xsmall) ) var(--spacing-medium) var(--spacing-medium) var(--spacing-medium);
  position: relative;
}

@media screen and (min-width: 769px) {
  .archive-entry {
    --thumbWidth: 30%;
  }
}

@media screen and (min-width: 769px) {
  .archive-entry {
    border-top: 1px solid var(--graph-20);
    padding: var(--spacing-xlarge) calc(var(--spacing-xlarge) * 2 + var(--thumbWidth) ) var(--spacing-xlarge) var(--spacing-xlarge);
  }
}

@media screen and (min-width: 1301px) {
  .archive-entry {
    padding: var(--spacing-xlarge) calc(var(--spacing-xlarge)  + var(--thumbWidth) ) var(--spacing-xlarge) 0;
    margin: 0 var(--spacing-xlarge);
  }
}

.archive-entry:before {
  content: "";
  background: var(--graph-20);
  aspect-ratio: 1200 / 630;
  width: calc(100% - var(--spacing-medium) * 2);
  top: var(--spacing-medium);
  right: var(--spacing-medium);
  position: absolute;
}

@media screen and (min-width: 769px) {
  .archive-entry:before {
    max-width: 300px;
    width: var(--thumbWidth);
    top: var(--spacing-xlarge);
    right: var(--spacing-xlarge);
  }
}

@media screen and (min-width: 1301px) {
  .archive-entry:before {
    right: 0;
  }
}

.archive-entry .archive-entry-header {
  flex-direction: column-reverse;
  display: flex;
}

@media screen and (min-width: 769px) {
  .archive-entry .archive-entry-header {
    flex-direction: column;
  }
}

.archive-entry .entry-title {
  font-feature-settings: "palt";
  margin: var(--spacing-xxsmall) 0 0;
}

@media screen and (min-width: 769px) {
  .archive-entry .entry-title {
    margin: var(--spacing-xsmall) 0 0;
  }
}

.archive-entry .entry-title-link {
  line-height: var(--lineHeight-small);
  font-weight: var(--fontWeight-xbold);
  font-size: var(--fontSize-large);
}

@media screen and (min-width: 769px) {
  .archive-entry .entry-title-link {
    font-size: var(--fontSize-xlarge);
  }
}

.archive-entry .categories {
  display: none;
}

.archive-entry .archive-date {
  font-size: var(--fontSize-small);
  margin: var(--spacing-xxsmall) 0 0;
}

@media screen and (min-width: 769px) {
  .archive-entry .archive-date {
    font-size: var(--fontSize-regular);
    margin: 0;
  }
}

.archive-entry .entry-thumb-link {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.archive-entry .entry-thumb {
  float: none;
  height: auto;
  aspect-ratio: 1200 / 630;
  width: calc(100% - var(--spacing-medium) * 2);
  top: var(--spacing-medium);
  right: var(--spacing-medium);
  margin: 0;
  position: absolute;
}

@media screen and (min-width: 769px) {
  .archive-entry .entry-thumb {
    max-width: 300px;
    width: var(--thumbWidth);
    top: var(--spacing-xlarge);
    right: var(--spacing-xlarge);
  }
}

@media screen and (min-width: 1301px) {
  .archive-entry .entry-thumb {
    right: 0;
  }
}

.archive-entry .archive-entry-body {
  display: none;
}

@media screen and (min-width: 769px) {
  .archive-entry .archive-entry-body {
    margin: var(--spacing-small) 0 0;
    display: block;
  }
}

.archive-entry .archive-entry-tags-wrapper, .archive-entry .social-buttons {
  display: none;
}

.pager {
  border-top: 1px solid var(--graph-20);
}

.pager.autopagerize_insert_before {
  text-align: center;
  margin: var(--spacing-small) 0 0;
}

@media screen and (min-width: 769px) {
  .pager.autopagerize_insert_before {
    margin: 0;
  }
}

@media screen and (min-width: 1301px) {
  .pager.autopagerize_insert_before {
    margin: 0 var(--spacing-xlarge);
  }
}

.pager.autopagerize_insert_before a {
  padding: var(--spacing-xlarge);
  display: inline-block;
}

.pager.pager-permalink {
  padding: var(--spacing-medium);
  font-feature-settings: "palt";
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .pager.pager-permalink {
    width: var(--width-article);
    align-items: center;
    gap: var(--spacing-large);
    display: flex;
  }
}

.pager.pager-permalink span {
  flex: 1;
}

.pager.pager-permalink .pager-prev a:before {
  transform: rotate(180deg);
}

.pager.pager-permalink .pager-next a {
  flex-direction: row-reverse;
}

.pager.pager-permalink a {
  align-items: center;
  gap: var(--spacing-medium);
  line-height: var(--lineHeight-small);
  padding: var(--spacing-small) 0;
  display: flex;
}

@media screen and (min-width: 769px) {
  .pager.pager-permalink a {
    padding: var(--spacing-xlarge) 0;
  }
}

.pager.pager-permalink a:before {
  content: "";
  width: 12px;
  height: 16px;
  opacity: .3;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20height%3D%2216%22%20viewBox%3D%220%200%2010%2016%22%20width%3D%2210%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m1%2015%207-7-7.000001-7%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%2F%3E%3C%2Fsvg%3E") 0 0 no-repeat;
  display: block;
}

.pager.pager-permalink a:focus:before {
  opacity: .5;
}

@media (hover: hover) and (pointer: fine) {
  .pager.pager-permalink a:hover:before {
    opacity: .5;
  }
}

.pager.pager-permalink .pager-arrow {
  display: none;
}

.entry {
  max-width: var(--width-article);
  padding: 0 var(--spacing-medium);
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .entry {
    padding: 0;
  }
}

.entry .entry-inner {
  position: relative;
}

.entry .entry-header {
  text-align: center;
  padding: var(--spacing-xxxlarge) var(--spacing-xlarge) calc(var(--spacing-xxlarge)  + var(--spacing-small) );
  flex-direction: column;
  display: flex;
}

@media screen and (min-width: 769px) {
  .entry .entry-header {
    padding: calc(var(--spacing-xxxlarge)  + var(--spacing-medium) ) 0 var(--spacing-xxxlarge);
  }
}

.entry .entry-header .entry-title {
  font-size: var(--fontSize-xlarge);
  font-weight: var(--fontWeight-xbold);
  line-height: var(--lineHeight-small);
  font-feature-settings: "palt";
  order: 0;
}

@media screen and (min-width: 769px) {
  .entry .entry-header .entry-title {
    font-size: var(--fontSize-xxlarge);
  }
}

.entry .entry-header .entry-date {
  margin: var(--spacing-medium) 0 0 0;
  font-size: var(--fontSize-xsmall);
  order: 1;
}

@media screen and (min-width: 769px) {
  .entry .entry-header .entry-date {
    font-size: var(--fontSize-regular);
  }
}

.entry .entry-header .entry-categories {
  flex-wrap: wrap;
  order: 1;
  justify-content: center;
  display: flex;
}

.entry .entry-header .entry-categories a {
  font-size: var(--fontSize-xsmall);
}

@media screen and (min-width: 769px) {
  .entry .entry-header .entry-categories a {
    font-size: var(--fontSize-regular);
  }
}

.entry .entry-header .entry-categories a:not(:last-child):after {
  content: "・";
}

.entry .entry-header .entry-header-menu {
  top: var(--spacing-small);
  margin: 0;
  position: absolute;
  right: 0;
}

.entry .entry-content {
  max-width: var(--width-article);
  font-size: var(--fontSize-medium);
  line-height: var(--lineHeight-large);
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .entry .entry-content {
    font-size: var(--fontSize-large);
  }
}

.entry .entry-content > :first-child, .entry .entry-content > :first-child > figure, .entry .entry-content > :first-child > span[itemtype="http://schema.org/Photograph"], .entry .entry-content > :first-child > .images-row, .entry .entry-content > :first-child pre.code {
  margin-top: 0 !important;
}

.entry .entry-content > p, .entry .entry-content > ul, .entry .entry-content > ol, .entry .entry-content dl, .entry .entry-content table, .entry .entry-content blockquote, .entry .entry-content .hatena-asin-detail, .entry .entry-content pre {
  margin: var(--spacing-large) 0;
}

.entry .entry-content a {
  color: var(--inSmartBank-blue);
}

.entry .entry-content a:focus {
  text-decoration: underline;
}

@media (hover: hover) and (pointer: fine) {
  .entry .entry-content a:hover {
    text-decoration: underline;
  }
}

.entry .entry-content hr {
  margin: var(--spacing-xlarge) 0;
  border: none;
}

.entry .entry-content hr:before {
  content: "";
  width: 4em;
  height: 0;
  border-top: 1px solid var(--graph-40);
  margin: 0 auto;
  display: block;
}

.entry .entry-content ul, .entry .entry-content ol {
  padding: 0 0 0 1.5em;
}

.entry .entry-content ul li {
  list-style-type: disc;
}

.entry .entry-content ol li {
  list-style-type: decimal;
}

.entry .entry-content dt {
  font-style: italic;
}

.entry .entry-content dd {
  margin: 0 0 0 1.5em;
}

.entry .entry-content .table-of-contents {
  margin: var(--spacing-xxlarge) 0;
  background: var(--inSmartBank-graph-10);
  font-size: var(--fontSize-medium);
  padding: calc(var(--spacing-xxlarge)  + var(--spacing-xsmall) ) var(--spacing-large) var(--spacing-large) calc(var(--spacing-xlarge)  + var(--spacing-xsmall) );
  position: relative;
}

.entry .entry-content .table-of-contents:before {
  content: "目次";
  top: var(--spacing-large);
  left: calc(var(--spacing-medium)  + var(--spacing-xsmall) );
  line-height: 1;
  font-weight: var(--fontWeight-xbold);
  position: absolute;
}

@media screen and (min-width: 769px) {
  .entry .entry-content .table-of-contents:before {
    left: var(--spacing-large);
  }
}

.entry .entry-content .table-of-contents a {
  color: currentColor;
}

.entry .entry-content .hatena-id-icon img {
  vertical-align: middle;
  margin: 0 var(--spacing-xsmall) 0 0;
  transform: translateY(-1.5px);
}

.entry .entry-content div.footnote {
  margin: var(--spacing-xxlarge) 0 0;
}

@media screen and (min-width: 993px) {
  .entry .entry-content div.footnote {
    margin: var(--spacing-xxxlarge) 0 0;
  }
}

.entry .entry-content p.footnote {
  font-size: var(--fontSize-small);
  line-height: var(--lineHeight-large);
  margin: 1em 0 0;
}

@media screen and (min-width: 769px) {
  .entry .entry-content p.footnote {
    font-size: var(--fontSize-small);
  }
}

.entry .entry-content img {
  vertical-align: bottom;
  margin: 0;
}

.entry .entry-content figure, .entry .entry-content span[itemtype="http://schema.org/Photograph"] {
  margin: var(--spacing-xxlarge) 0;
}

.entry .entry-content .images-row {
  gap: var(--spacing-medium);
}

@media screen and (min-width: 769px) {
  .entry .entry-content .images-row {
    gap: var(--spacing-large);
  }
}

.entry .entry-content span[itemtype="http://schema.org/Photograph"] {
  display: block;
}

.entry .entry-content figure span[itemtype="http://schema.org/Photograph"] {
  margin: 0;
}

.entry .entry-content figcaption {
  font-size: var(--fontSize-regular);
  line-height: var(--lineHeight-default);
  opacity: 1;
  text-align: left;
  text-align: center;
  margin: var(--spacing-medium) auto 0;
  width: 80%;
  font-style: italic;
}

@media screen and (min-width: 993px) {
  .entry .entry-content figcaption {
    width: calc(var(--width-article)  - var(--spacing-xxlarge) );
  }
}

.entry .entry-content blockquote {
  padding: 0 0 0 1.5em;
  position: relative;
}

.entry .entry-content blockquote:before {
  content: "";
  width: 8px;
  height: calc(100% - .8em);
  background: var(--graph-20);
  position: absolute;
  top: .4em;
  left: 0;
}

.entry .entry-content blockquote p + p {
  margin: var(--spacing-large) 0 0;
}

.entry .entry-content pre.code, .entry .entry-content code {
  background: var(--inSmartBank-graph-10);
  font-family: var(--fontFamily-monospaced);
  font-size: var(--fontSize-regular);
  line-height: var(--lineHeight-small);
  border-radius: 8px;
}

.entry .entry-content pre.code {
  padding: calc(var(--spacing-medium)  + var(--spacing-xsmall) );
  margin: var(--spacing-xxlarge) 0;
  border-radius: 0;
}

.entry .entry-content code {
  border: none;
  border-radius: 4px;
  padding: .25em .5em;
}

.entry .entry-content table {
  width: 100%;
  border-right: 1px solid var(--graph-40);
  border-bottom: 1px solid var(--graph-40);
  border-collapse: collapse;
  margin: var(--spacing-xxlarge) 0;
}

.entry .entry-content table th, .entry .entry-content table td {
  border-top: 1px solid var(--graph-40);
  border-left: 1px solid var(--graph-40);
  padding: var(--spacing-xsmall) var(--spacing-medium);
}

.entry .entry-content table th {
  font-weight: var(--fontWeight-normal);
  background: var(--inSmartBank-graph-10);
}

.entry .entry-content iframe {
  margin: var(--spacing-xxlarge) 0 0 !important;
}

.entry .entry-content iframe.speakerdeck-iframe {
  margin: var(--spacing-large) 0 !important;
}

.entry .entry-content .hatena-asin-detail {
  margin: var(--spacing-xxlarge) 0;
}

.entry .entry-content .hatena-asin-detail a {
  color: currentColor;
}

.entry.mode-markdown .entry-content h1, .entry.mode-markdown .entry-content h2, .entry.mode-markdown .entry-content h3, .entry.mode-markdown .entry-content h4, .entry.mode-markdown .entry-content h5, .entry.mode-markdown .entry-content h6 {
  font-weight: var(--fontWeight-xbold);
  line-height: var(--lineHeight-default);
  font-feature-settings: "palt";
  margin: var(--spacing-xxlarge) 0 0;
}

@media screen and (min-width: 993px) {
  .entry.mode-markdown .entry-content h1, .entry.mode-markdown .entry-content h2, .entry.mode-markdown .entry-content h3, .entry.mode-markdown .entry-content h4, .entry.mode-markdown .entry-content h5, .entry.mode-markdown .entry-content h6 {
    margin: var(--spacing-xxxlarge) 0 0;
  }
}

.entry.mode-markdown .entry-content h1 {
  font-size: var(--fontSize-xxlarge);
}

.entry.mode-markdown .entry-content h2 {
  font-size: var(--fontSize-xlarge);
}

.entry.mode-markdown .entry-content h3 {
  font-size: var(--fontSize-large);
  margin: var(--spacing-large) 0 0;
}

.entry.mode-markdown .entry-content h4, .entry.mode-markdown .entry-content h5, .entry.mode-markdown .entry-content h6 {
  font-size: var(--fontSize-large);
}

.entry .entry-footer {
  margin: var(--spacing-xxxlarge) 0 0;
}

.entry .entry-footer .social-buttons {
  margin: var(--spacing-large) auto;
}

.entry .entry-footer .hatena-module-title {
  font-size: var(--fontSize-xlarge);
  font-weight: var(--fontWeight-xbold);
}

.entry .entry-footer .hatena-module-body {
  margin: var(--spacing-large) 0 0;
}

.entry .entry-footer .related-entries-item {
  border-top: 1px solid var(--graph-20);
  padding: var(--spacing-medium) 0;
}

.entry .entry-footer .related-entries-item-inner {
  padding: 0 calc(100px + var(--spacing-large) ) 0 0;
  min-height: 80px;
  flex-direction: column-reverse;
  justify-content: flex-end;
  display: flex;
  position: relative;
}

.entry .entry-footer .related-entries-item-inner:before {
  content: "";
  width: 80px;
  height: 80px;
  background: var(--backgroundColor-placeholder);
  position: absolute;
  top: 0;
  left: 0;
}

.entry .entry-footer .related-entries-image-link {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.entry .entry-footer .related-entries-image {
  width: 80px;
  float: none;
  vertical-align: top;
  margin: 0;
  position: absolute;
  top: 0;
  right: 0;
}

.entry .entry-footer .related-entries-title {
  font-size: var(--fontSize-medium);
  line-height: var(--lineHeight-small);
  -webkit-line-clamp: 2;
  font-feature-settings: "palt";
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}

.entry .entry-footer .related-entries-entry-body {
  display: none;
}

.entry .entry-footer .related-entries-date-link {
  margin: var(--spacing-xxsmall) 0 0;
  font-size: var(--fontSize-small);
}

.entry.no-entry {
  margin: calc(var(--spacing-xxxlarge)  + var(--spacing-medium) ) auto;
}

.entry.no-entry p {
  margin: 0;
}

.entry.no-entry .entry-footer, #blog-title {
  display: none;
}

.cboxPhoto {
  border-radius: 0;
}

#content {
  padding: var(--area-medium) 0 0;
}

.page-index #sbHeader {
  position: static;
}

.page-index #sbHeader-navigationTitle {
  display: none;
}

.page-index #sbHeader-regularNavigation ul li:first-of-type {
  margin: 0 0 0 var(--spacing-xsmall);
}

.page-index #sbHeader-regularNavigation .c-corporateLinks-positionsTrailing {
  display: inline;
}

.page-index #sbHeader-largeLogo {
  display: block;
}

.page-index #content {
  padding: 0;
}

.page-archive:not(.page-index).page-archive-category .archive-header-category {
  border-bottom: 1px solid var(--graph-20);
  padding: var(--spacing-xxxlarge) var(--spacing-xlarge);
  margin: 0;
}

@media screen and (min-width: 1301px) {
  .page-archive:not(.page-index).page-archive-category .archive-header-category {
    padding: var(--spacing-xxxlarge) 0;
    margin: 0 var(--spacing-xlarge);
  }
}

.page-archive:not(.page-index).page-archive-category .archive-description {
  font-size: var(--fontSize-large);
  color: var(--graph-70);
  margin: var(--spacing-large) 0 0;
}

@media screen and (min-width: 769px) {
  .page-archive:not(.page-index).page-archive-category .archive-description {
    width: 50%;
  }
}

.page-archive:not(.page-index):not(.page-archive-category) .archive-heading {
  border-bottom: 1px solid var(--graph-20);
  padding: var(--spacing-xxxlarge) var(--spacing-xlarge);
}

@media screen and (min-width: 1301px) {
  .page-archive:not(.page-index):not(.page-archive-category) .archive-heading {
    padding: var(--spacing-xxxlarge) 0 var(--spacing-xxxlarge);
    margin: 0 var(--spacing-xlarge);
  }
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result {
  border-bottom: 1px solid var(--graph-20);
  padding: var(--spacing-xxxlarge) var(--spacing-xlarge);
  margin: 0;
}

@media screen and (min-width: 1301px) {
  .page-archive:not(.page-index):not(.page-archive-category) .search-result {
    padding: var(--spacing-xxxlarge) 0 var(--spacing-xxxlarge);
    margin: 0 var(--spacing-xlarge);
  }
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .archive-heading {
  border: none;
  margin: 0;
  padding: 0;
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form {
  background: var(--inSmartBank-graph-10);
  margin: var(--spacing-large) 0 0;
  border: none;
  border-radius: 0;
  display: flex;
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form:hover, .page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form:focus-within {
  border-color: var(--inSmartBank-graph-50);
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form input {
  height: auto !important;
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form input[type="text"] {
  padding: var(--spacing-xsmall) var(--spacing-small);
  font-weight: var(--fontWeight-bold);
  background: none !important;
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form input[type="submit"] {
  background: url("https://cdn.blog.st-hatena.com/images/theme/search@2x.png?version=d7cec8b380578bd4c4bdd2c0c5a214") center / 20px 20px no-repeat;
  position: static;
  width: 44px !important;
  padding: 0 !important;
}

.page-archive:not(.page-index):not(.page-archive-category) .search-result .search-result-form input[type="submit"]:focus {
  opacity: 1;
}

.page-archive:not(.page-index) .archive-heading {
  font-size: var(--fontSize-xxlarge);
  line-height: var(--lineHeight-small);
  font-weight: var(--fontWeight-xbold);
  margin: 0;
}

.page-archive:not(.page-index) span.highlight {
  background: var(--sun-40);
}

.page-about .entry {
  margin: calc(var(--spacing-xxxlarge)  + var(--spacing-medium) ) auto;
}

.page-about .entry-content {
  font-size: var(--fontSize-medium);
}

.page-about .entry-content h1 {
  font-size: var(--fontSize-xlarge);
  font-weight: var(--fontWeight-xbold);
  line-height: var(--lineHeight-default);
  font-feature-settings: "palt";
  text-align: center;
}

.page-about .entry-content dt {
  margin: var(--spacing-xlarge) 0 0;
  font-style: normal;
}

.page-about .entry-content dd {
  margin: 0;
}

.page-about .entry-content .profile-icon {
  vertical-align: text-bottom;
}

/* TwitterをPCでは横並びにする */
.flex {
	display: flex; /* これで横並びになる */
}
.twitter-tweet {
	padding: 5px; /* 1つのツイートの周りに5pxの余白をつける */
	margin: 10px auto; /* ツイートを中央寄せにする */
}

/* 画面サイズ960px以下ではTwitterを縦並びに変える */
@media (max-width: 960px) {
.flex {
	display: block; /* 横並びを解除 */
}
.twitter-tweet {
	padding: 0; /* 縦並びでは余白なし */
}
}