@charset "UTF-8";
/*
編集はscssで行うこと
*/
html {
  overflow-y: scroll; }

.lead-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 20px 10px 40px; }
  .lead-text p {
    font-size: 1.1em; }
    @media screen and (min-width: 768px) {
      .lead-text p {
        font-size: 1.2em; } }

.filter-box {
  margin: 10px;
  text-align: center; }
  .filter-box input[type="radio"] {
    display: none; }
  .filter-box label {
    margin: 5px;
    padding: 16px 20px 14px;
    background-color: #ddd;
    color: #999;
    font-size: 1.2em;
    font-weight: normal; }
  .filter-box input[type="radio"]:checked + label {
    background-color: #666;
    color: #fff; }

#user-comments {
  position: relative;
  margin-top: -180px;
  padding-top: 180px;
  pointer-events: none;
  margin-bottom: 100px; }

#sns-container {
  overflow: hidden;
  position: relative;
  box-sizing: content-box;
  margin: 0 auto;
  pointer-events: auto; }
  @media screen and (max-width: 767px) {
    #sns-container {
      padding-left: 16px;
      padding-right: 16px; } }
  #sns-container .grid {
    overflow: hidden;
    box-sizing: content-box;
    width: 380px;
    margin: 8px;
    box-shadow: 0 2px 10px #ddd; }
    @media screen and (max-width: 767px) {
      #sns-container .grid {
        width: 100%;
        margin: 10px 0; } }
    #sns-container .grid.dummy {
      margin-top: 0;
      margin-bottom: 0; }
      @media screen and (max-width: 767px) {
        #sns-container .grid.dummy {
          display: none; } }
    @media screen and (max-width: 1266px) {
      #sns-container .grid.dummy3 {
        display: none; } }
  #sns-container a {
    display: block;
    transition: 0.3s;
    transition-timing-function: ease-in-out; }
    #sns-container a:hover {
      text-decoration: none;
      opacity: 0.7;
      transition: 0.3s;
      transition-timing-function: ease-in-out; }
    #sns-container a p {
      transition: 0.3s;
      transition-timing-function: ease-in-out; }
    #sns-container a:hover p {
      opacity: 0.8;
      transition: 0.3s;
      transition-timing-function: ease-in-out; }
  #sns-container figure {
    overflow: hidden;
    max-height: 400px;
    margin-bottom: 3px; }
    #sns-container figure img {
      width: 100%; }
  #sns-container .sns-logo {
    max-width: 30px;
    float: left;
    margin: 7px 5px 3px 5px; }
  #sns-container p {
    margin: 0;
    min-height: 38px;
    padding: 4px 8px;
    font-size: 0.9em;
    text-align: justify;
    word-break: break-all; }
    #sns-container p img {
      width: 1.1em;
      vertical-align: middle;
      margin: 2px;
      position: relative;
      bottom: 1px; }
  #sns-container .hashtag {
    color: #999; }

#sns-loading {
  box-sizing: border-box;
  display: block;
  position: absolute;
  top: 180px;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top: 200px;
  background-color: #fff;
  color: rgba(0, 0, 0, 0.5);
  font-size: 5em;
  text-align: center; }

@media screen and (min-width: 768px) {
  /* to-page-top */
  div#wrap-to-page-top > div > div {
    width: 130px; } }
@media print {
  body {
    -webkit-print-color-adjust: exact; }

  #wrap-to-page-top {
    display: none; }

  .spectable-fixedcol-wrapper {
    display: none !important; } }