body {
  width: 100%;
  margin: 0px;
  padding: 0px;
  word-wrap: break-word;
  line-height: 1.7;
  zoom: 1;
  font-size: 16px;
  cursor: auto;
  width: 100% !important;
  min-width: 100% !important
}

html,
body {
  width: 100%;
  height: 100%
}

p {
  margin: 0
}

img {
  outline: none;
  border: none;
  text-decoration: none;
  -ms-interpolation-mode: bicubic
}

a img {
  border: none
}

table {
  table-layout: fixed
}

table .wrapper {
  border-collapse: separate
}

table .collapse {
  border-collapse: collapse
}

table .separate {
  border-collapse: separate
}

a[target="_blank"]:not(:has(i)):not(:has(img)):after {
  content: " \e914";
  font-family: 'Hobonichi-Icons';
  font-size: 12px;
}

@media only screen and (max-width: 640px) {
  .main {
    width: 100% !important;
    min-width: 100% !important
  }

  td.responsiveCell {
    width: 100% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    box-sizing: border-box !important
  }

  td.responsiveCell {
    display: block !important
  }

  img.flexible {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important
  }

  .will-button {
    max-width: 100% !important;
    width: 100% !important
  }

  .will-button a {
    display: block !important
  }
}

.will-image-link {
  text-decoration: none
}

@media(hover: hover) {
  .will-image-link {
    transition: opacity .3s
  }

  .will-image-link:hover {
    opacity: .5
  }
}

body {
  margin: 0;
  padding: 0
}

body * {
  box-sizing: border-box
}

nav.navi {
  display: flex;
  align-items: center;
  justify-content: space-around;
  max-width: 960px;
  margin: 1rem auto 0;
  padding: .5rem
}

nav.navi div {
  text-align: center;
  width: 72px
}

nav.navi div a {
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  color: #000;
  border-width: 1px;
  border-color: rgba(0, 0, 0, .1);
  border-radius: 50%;
  border-style: solid
}

nav.navi div a i {
  font-size: 2rem;
  display: block;
  width: 100%
}

nav.navi div a span {
  font-size: .75rem;
  display: block;
  width: 100%
}

@media(hover: hover) {
  nav.navi div a {
    transition: opacity .3s
  }

  nav.navi div a:hover {
    opacity: .5
  }
}

.date {
  font-family: Arial, Helvetica, sans-serif;
  font-size: .75rem;
  text-align: center;
  order: 2;
  margin: 1rem auto 0;
  padding: 0 .5rem
}

.shareCell {
  padding: 20px;
  vertical-align: top;
  width: 100%
}

.shareCell .label {
  text-align: center;
  padding: 0px 0px 5px
}

.shareCell .label b {
  color: dimgray;
  font-size: 12px
}

.shareCell .items {
  text-align: center;
  display: flex;
  justify-content: center
}

.shareCell .items .will-image-link {
  margin: 0 .5rem
}

.shareCell .items .will-image-link i {
  font-size: 32px
}

.shareCell .items .will-image-link i.hb-facebook {
  color: #1877f2
}

.shareCell .items .will-image-link i.hb-twitter {
  color: #000
}

.shareCell .items .will-image-link i.hb-line {
  color: #00b900
}