@charset "UTF-8";
/* Base Layout
======================================== */
html,
body {
  font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 200;
  height: 100%;
  letter-spacing: 0.1em;
}
figure {
  margin: 0;
  overflow: hidden;
  position: relative;
  text-align: left;
}
img {
  max-width: 100%;
  vertical-align: top;
  width: auto;
}
a {
  color: #535454;
  outline: none;
  text-decoration: none;
  transition: opacity 300ms;
}
a:focus,
*:focus {
  outline: none;
}
ul,
ol,
dl > * {
  list-style: none;
  margin: 0;
  padding: 0;
}
table {
  margin: 1.5em 0;
}
table th {
  font-weight: normal;
  padding-right: 2em;
  text-align: left;
  vertical-align: top;
}
table tr > th,
table tr > td {
  padding-bottom: 0.375em;
  padding-top: 0.375em;
}
hr {
  background-color: #C0C0C0;
  border: 0;
  height: 1px;
  margin: 4em 0;
}
blockquote {
  border-left: 1px solid #7E7E7E;
  font-style: italic;
  margin: 2em auto 2em 2.5em;
  padding-left: 1.4334em;
}
b,
strong {
  font-weight: bold;
}
::-moz-selection {
  background: #535454;
  color: #FFF;
}
::selection {
  background: #535454;
  color: #FFF;
}
#main_visual::-moz-selection {
  background: transparent;
}
#main_visual::selection {
  background: transparent;
}
/* Common Layout
======================================== */
html,
body {
  -webkit-overflow-scrolling: touch;
}
body {
  font-feature-settings: "pwid";
  overflow-x: hidden;
}
.table {
  display: table;
}
.table > * {
  display: table-cell;
  vertical-align: middle;
}
.right {
  float: right;
}
.left {
  float: left;
}
.align-center {
  text-align: center;
}
br.hide {
  display: none;
}
.btn {
  clear: both;
}
.btn a {
  background-color: #535454;
  border-radius: 1.0625em;
  box-sizing: border-box;
  color: #FFF;
  display: block;
  font-family: Karla, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  margin: auto;
  max-width: 15.875em;
  padding: 0.5em;
  text-align: center;
  transition: opacity 0.25s;
}
html[class*=desktop] .btn a:hover {
  opacity: 0.8;
}
br.sp-only {
  display: none;
}
/* Loader
======================================== */
body.hide > * {
  visibility: hidden;
}
body.hide #loader {
  visibility: visible;
}
#loader {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  bottom: 0;
  display: table;
  height: 100%;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 100;
}
#loader .inner {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
#loader figure {
  margin: auto;
  max-width: 13.6875em;
}
#loader p {
  color: #FFF;
  font-family: Karla, sans-serif;
  font-size: 0.875em;
  letter-spacing: 0.1em;
  margin: 2.5em 0 0;
  position: relative;
}
#loader p span {
  display: inline-block;
  letter-spacing: 0.1em;
  overflow: hidden;
  padding-left: 0.075em;
  position: absolute;
  -webkit-animation: loading01 5s linear infinite;
  -webkit-animation-delay: 0.5s;
  animation: loading01 5s linear infinite;
  animation-delay: 0.5s;
  text-align: left;
  width: 0;
}
#loader .credit {
  bottom: 1.5%;
  color: #FFF;
  font-family: "EB Garamond", serif;
  font-size: 10px;
  position: absolute;
  right: 1%;
  text-align: right;
  width: 100%;
}
@keyframes loading01 {
  0% {
    width: 0;
  }
  24% {
    width: 0;
  }
  25% {
    width: 0.275em;
  }
  49% {
    width: 0.275em;
  }
  50% {
    width: 0.55em;
  }
  74% {
    width: 0.55em;
  }
  75% {
    width: 0.775em;
  }
  100% {
    width: 0.775em;
  }
}
/* Header
======================================== */
#header {
  background-color: #F2F2F2;
  overflow: hidden;
  position: relative;
}
#current-time {
  left: 1.875em;
  position: absolute;
  top: 1.65em;
  z-index: 11;
}
#current-time p {
  color: #535454;
  font-family: "EB Garamond", serif;
  font-size: 0.8125em;
  line-height: 1.25;
  margin: 0;
}
#hero {
  text-align: center;
}
#hero .logo h1 {
  font-size: 2em;
  height: 1.0625em;
  left: 50%;
  margin: 0;
  margin-left: -9.953125em;
  position: absolute;
  top: 1.875em;
  width: 19.90625em;
  z-index: 11;
}
#hero .logo h1 img {
  height: 100%;
  width: 100%;
}
#hero .catch {
  color: #535454;
  font-family: "EB Garamond", serif;
  font-size: 1.0625em;
  font-weight: normal;
  margin: 6.5em auto 2.25em;
}
#hero .title {
  margin-bottom: 1.875em;
  position: relative;
}
#hero .title figure,
#hero .header_img figure {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin: auto;
  position: relative;
}
#hero .title figure::before,
#hero .header_img figure::before {
  content: "";
  display: block;
  padding-top: 53.732%;
  width: 100%;
}
#hero .title figure img,
#hero .header_img figure img {
  display: none;
}
#hero .title h3 {
  font-family: "EB Garamond", serif;
  font-size: 3em;
  font-weight: normal;
  letter-spacing: 0.05em;
}
#hero .title h3 {
  color: #000;
}
#hero .title .table {
  height: 45em;
  margin-top: -22.5em;
  position: absolute;
  top: 50%;
  width: 100%;
  z-index: 1;
}
/* Home Hero
---------------------------------------- */
#home #header::before {
  content: "";
  display: block;
  height: 0.01px;
}
#main_visual {
  margin-top: 3.375em;
  position: relative;
  text-align: left;
}
.mobile #main_visual {
  overflow: hidden;
}
#main_visual .slide.sp {
  display: none;
}
#main_visual .slick-list {
  overflow: visible;
}
#main_visual .slick-slide {
  border-right: 1px solid #C0C0C0;
}
#main_visual .slick-slide ul li {
  position: relative;
}
#main_visual .img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: none;
  padding-top: 16.75em;
  position: absolute;
  width: 31.25em;
}
#main_visual .img img {
  display: none;
}
#main_visual .slick-base {
  z-index: 0;
}
#main_visual .slick-hover {
  mix-blend-mode: difference;
  z-index: 2;
}
#main_visual .slick-hover .slick-list {
  opacity: 0;
}
#main_visual .slick-hover.is-active .slick-list {
  opacity: 1;
}
#main_visual .hover-img {
  position: absolute;
  z-index: 1;
}
#main_visual .hover-img .img {
  display: block;
}
#main_visual a {
  box-sizing: border-box;
  display: block;
  margin: 0.625em;
  overflow: hidden;
  position: relative;
  z-index: 2;
}
#main_visual a .wrap {
  height: 100%;
  padding: 0 0.5em;
  position: relative;
}
#main_visual .big a {
  height: 30em;
}
#main_visual ul li .small li:first-child {
  border-bottom: 1px solid #C0C0C0;
  margin-bottom: -1px;
}
#main_visual .small a {
  height: 14.375em;
}
#main_visual .type11 li:first-child a {
  height: 5.1875em;
}
#main_visual .type11 li:first-child + li a {
  height: 23.5625em;
}
#main_visual .type02 li:first-child a,
#main_visual .type06 li:first-child a,
#main_visual .type12 li:first-child a {
  height: 18.75em;
}
#main_visual .type02 li:first-child + li a,
#main_visual .type06 li:first-child + li a,
#main_visual .type12 li:first-child + li a {
  height: 10em;
}
#main_visual .type03 li:first-child a,
#main_visual .type07 li:first-child a,
#main_visual .type10 li:first-child a {
  height: 11.25em;
}
#main_visual .type03 li:first-child + li a,
#main_visual .type07 li:first-child + li a,
#main_visual .type10 li:first-child + li a {
  height: 17.5em;
}
#main_visual .type04 li:first-child a,
#main_visual .type08 li:first-child a {
  height: 20.8125em;
}
#main_visual .type04 li:first-child + li a,
#main_visual .type08 li:first-child + li a {
  height: 7.9375em;
}
#main_visual h4 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.6875em;
  font-weight: normal;
  line-height: 1.5556;
  margin: 0;
  overflow: hidden;
}
#main_visual .type03 li:first-child + li h4,
#main_visual .type07 li:first-child + li h4,
#main_visual .type10 li:first-child + li h4,
#main_visual .big h4 {
  float: right;
  font-size: 1.5em;
  line-height: 1.375;
  padding-bottom: 0.5em;
  position: relative;
  right: -0.5em;
  top: 6px;
  writing-mode: vertical-rl;
}
#main_visual .big h4 {
  padding-bottom: 0.375em;
}
html[class*=ie] #main_visual .type03 li:first-child + li h4,
html[class*=ie] #main_visual .type07 li:first-child + li h4,
html[class*=ie] #main_visual .type10 li:first-child + li h4,
html[class*=ie] #main_visual .big h4 {
  right: -0.25em;
}
#main_visual h4 br {
  display: none;
}
#main_visual .type02 h4,
#main_visual .type06 h4 {
  font-size: 1.125em;
  line-height: 1.5;
  min-height: 1.75em;
}
#main_visual .type03 li:first-child h4,
#main_visual .type07 li:first-child h4,
#main_visual .type10 li:first-child h4 {
  font-size: 1.5em;
  line-height: 1.375;
  max-height: 2.75em;
}
#main_visual .type12 li:first-child h4 {
  max-height: 4.75em;
}
#main_visual .type03 li:first-child + li h4,
#main_visual .type07 li:first-child + li h4,
#main_visual .type10 li:first-child + li h4 {
  font-size: 1.125em;
  line-height: 1.5;
  margin-left: 0.5em;
  right: -0.375em;
}
#main_visual .type04 li:first-child h4,
#main_visual .type08 li:first-child h4 {
  line-height: 1.3704;
  max-height: 4em;
  min-height: 3.1em;
}
#main_visual .type04 li:first-child + li h4,
#main_visual .type08 li:first-child + li h4 {
  min-height: 3.5em;
}
#main_visual .type11 li:first-child + li h4 {
  max-height: 4.75em;
}
#main_visual h4 .new {
  float: left;
  height: 32px;
  margin-right: 4px;
  width: 32px;
}
#main_visual .type03 .is-new h4,
#main_visual .type07 .is-new h4,
#main_visual .type10 .is-new h4,
#main_visual .big .is-new h4 {
  top: -6px;
}
#main_visual .type03 h4 .new,
#main_visual .type07 h4 .new,
#main_visual .type10 h4 .new,
#main_visual .big h4 .new {
  margin-bottom: 5px;
}
#main_visual .feature {
  bottom: 0;
  height: 3.875em;
  position: absolute;
  right: 0;
  width: 3.875em;
  z-index: 1;
}
#main_visual .type03 .feature,
#main_visual .type07 .feature,
#main_visual .type10 .feature,
#main_visual .big .feature {
  bottom: 0.4375em;
  left: 0;
  right: inherit;
}
#main_visual .type03 li:first-child .feature,
#main_visual .type07 li:first-child .feature,
#main_visual .type10 li:first-child .feature {
  bottom: 0;
  left: inherit;
  right: 0;
}
#main_visual .content {
  font-size: 0.875em;
  font-weight: normal;
  letter-spacing: 0.05em;
  line-height: 1.72;
  margin: 0.4286em 0;
  overflow: hidden;
  position: relative;
  text-align: justify;
  word-break: break-all;
}
html[class*=ie] #main_visual .content {
  line-height: 1.77;
}
#main_visual .big .content {
  line-height: 1.69;
  top: -0.2858em;
}
html[class*=ie] #main_visual .big .content {
  line-height: 1.71;
}
#main_visual .type03 li:first-child .content,
#main_visual .type07 li:first-child .content,
#main_visual .type10 li:first-child .content {
  line-height: 1.5;
}
html[class*=ie] #main_visual .type03 li:first-child .content,
html[class*=ie] #main_visual .type07 li:first-child .content,
html[class*=ie] #main_visual .type10 li:first-child .content {
  line-height: 1.53;
}
#main_visual .type03 li:first-child + li .content,
#main_visual .type07 li:first-child + li .content,
#main_visual .type10 li:first-child + li .content {
  line-height: 1.65;
}
#main_visual .slick-hover {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 31.25em;
  margin-top: -31.25em;
  position: absolute;
  width: 100%;
}
#main_visual .slick-hover h4,
#main_visual .slick-hover .content {
  color: transparent;
}
#main_visual .slick-hover.is-active h4,
#main_visual .slick-hover.is-active .content {
  color: #FFF;
}
#main_visual .slick-hover ul li {
  border-color: transparent !important;
}
#main_visual .slide button {
  display: none !important;
}
#hero .next a {
  display: inline-block;
  margin-top: 0.75em;
  max-width: 4em;
  position: relative;
  top: 1.25em;
  transition: opacity 0.3s;
}
html[class*=desktop] #hero .next a:hover {
  opacity: 0.6;
}
#main_visual .sp ul li ul li {
  border-bottom: 1px solid #C0C0C0;
  border-right: 1px solid #C0C0C0;
  box-sizing: border-box;
  float: left;
  height: 8.5625em;
  overflow: hidden;
  width: 50%;
}
#main_visual .sp {
  overflow: hidden;
}
#main_visual .sp ul li ul li:nth-child(odd) {
  border-left: 1px solid #C0C0C0;
}
#main_visual .sp ul li ul li:last-child,
#main_visual .col-6 li:nth-child(5) {
  border-bottom: none;
}
#main_visual .sp a {
  height: 6.9625em;
  margin: 0.8em;
}
#main_visual .sp a .wrap {
  position: relative;
  top: 0.15em;
}
#main_visual .sp ul li ul li h4 {
  font-size: 1.1875em;
  line-height: 1.3;
  max-height: 2.5em;
  min-height: 1.9em;
  word-wrap: break-word;
}
#main_visual .sp ul li ul li.is-new h4 {
  word-break: break-all;
}
#main_visual .sp h4 .new {
  height: 26px;
  margin-right: 3px;
  width: 26px;
}
#main_visual a.feature-link {
  display: inline;
  height: auto;
  margin: auto;
  position: static;
}
#main_visual .sp .feature {
  bottom: 0.25em;
  height: 45px;
  right: 0;
  width: 45px;
  z-index: 3;
}
#main_visual .sp ul li ul li .content {
  font-size: 0.6875em;
  line-height: 1.55;
  margin: 0.75em 0;
}
#main_visual .col-5 li:nth-child(1) {
  width: 42.5%;
}
#main_visual .col-5 li:nth-child(2) {
  width: 57.5%;
}
#main_visual .col-5 li:nth-child(3) {
  width: 61.25%;
}
#main_visual .col-5 li:nth-child(4) {
  width: 38.75%;
}
#main_visual .col-5 li:nth-child(5) {
  width: 100%;
}
#main_visual .col-6 li:nth-child(1) {
  width: 61.25%;
}
#main_visual .col-6 li:nth-child(2) {
  width: 38.75%;
}
#main_visual .col-6 li:nth-child(3) {
  width: 42.5%;
}
#main_visual .col-6 li:nth-child(4) {
  width: 57.5%;
}
#main_visual .col-6 li:nth-child(5) {
  width: 39.25%;
}
#main_visual .col-6 li:nth-child(6) {
  width: 60.75%;
}
#main_visual .col-5 li:nth-child(2) a,
#main_visual .col-5 li:nth-child(5) a,
#main_visual .col-6 li:nth-child(4) a {
  top: -3px;
}
#main_visual .col-5 li:nth-child(2) h4,
#main_visual .col-5 li:nth-child(5) h4,
#main_visual .col-6 li:nth-child(4) h4 {
  box-sizing: border-box;
  float: left;
  font-feature-settings: "palt";
  font-size: 14px;
  left: -0.5em;
  letter-spacing: 0;
  line-height: 1.15;
  margin-right: 0.5em;
  max-height: none;
  max-width: 2.25em;
  padding-bottom: 0.76em;
  position: relative;
  top: 2px;
  writing-mode: vertical-rl;
}
#main_visual .col-5 li:nth-child(2) h4 .new,
#main_visual .col-5 li:nth-child(5) h4 .new,
#main_visual .col-6 li:nth-child(4) h4 .new {
  margin-bottom: 4px;
}
#main_visual .col-5 li:nth-child(5) h4 {
  font-size: 1.375em;
  letter-spacing: 0.075em;
  line-height: 1.2;
  margin-right: 0.25em;
  max-height: 4.5em;
  min-width: 2.55em;
  padding-bottom: 0;
}
#main_visual .col-6 li:nth-child(3) h4 {
  font-size: 1.625em;
  line-height: 1.35;
  max-height: 4em;
  text-align: justify;
  word-break: break-all;
}
/* Global
---------------------------------------- */
input[name^=switch_] {
  display: none;
}
#btn_menu {
  cursor: pointer;
  display: block;
  height: 1.3125em;
  position: absolute;
  right: 1.875em;
  top: 1.8125em;
  transition: 0.4s opacity;
  width: 3.1875em;
  z-index: 11;
}
#btn_menu span {
  display: block;
  overflow: hidden;
  text-indent: 200%;
  white-space: nowrap;
}
#btn_menu::before,
#btn_menu::after,
#btn_menu span::before {
  background-color: #535454;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  right: 0;
  top: 50%;
  transition: margin-top 400ms;
  width: 100%;
}
html[class*=desktop] #btn_menu:hover::before,
html[class*=desktop] #btn_menu:hover::after,
html[class*=desktop] #btn_menu:hover span::before {
  animation: hbgAnime01 400ms linear;
}
html[class*=desktop] #switch_global:checked ~ #global #btn_menu:hover::before,
html[class*=desktop] #switch_global:checked ~ #global #btn_menu:hover::after,
html[class*=desktop] #switch_global:checked ~ #global #btn_menu:hover span::before {
  animation: none;
}
html[class*=desktop] #btn_menu:hover::before {
  animation-delay: 250ms;
}
html[class*=desktop] #btn_menu:hover span::before {
  animation-delay: 100ms;
}
@keyframes hbgAnime01 {
  0% {
    width: 100%;
  }
  40% {
    width: 0;
  }
  60% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
#btn_menu::before {
  margin-top: -0.625em;
}
#btn_menu::after {
  margin-top: 0.625em;
}
#switch_global:checked ~ #global #btn_menu {
  opacity: 1;
}
html[class*=desktop] #btn_menu:hover {
  opacity: 0.75 !important;
}
#switch_global:checked ~ #global #btn_menu::before,
#switch_global:checked ~ #global #btn_menu::after,
#switch_global:checked ~ #global #btn_menu span::before {
  background-color: #FFF;
  margin-top: 0;
}
#global {
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  z-index: 20;
}
#global .scroll {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  right: 0;
  -ms-overflow-style: none;
  position: fixed;
  top: 0;
  transform: translateZ(0);
  transition: width 0.85s;
  width: 0;
}
#switch_global:checked ~ #global .scroll {
  width: 100%;
}
#global .inner {
  background-color: rgba(133, 134, 135, 0.95);
  color: #FFF;
  display: table;
  height: 100%;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
}
#global .inner nav {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
#global .logo h1 {
  color: #FFF;
  font-size: 2em;
  height: 1.0625em;
  margin: 2em auto auto;
  width: 19.90625em;
}
#global .logo h1 img {
  height: 100%;
  width: 100%;
}
#global .catch {
  color: #FFF;
  font-family: "EB Garamond", serif;
  font-size: 1.0625em;
  font-weight: normal;
  margin: 1em auto 3.5em;
}
#global .inner nav .menu li {
  margin: 2em 1.5em;
}
#global .inner nav .menu li a {
  color: #FFF;
  font-family: Karla, sans-serif;
  font-size: 3em;
  letter-spacing: 0.1em;
}
#html[class*=desktop] global .inner nav .menu li a:hover {
  opacity: 0.6;
}
#global .inner nav .sns {
  margin-bottom: 4em;
}
#global .inner nav .sns li a {
  color: #FFF;
}
#global .logo,
#global .catch,
#global .inner nav .menu li,
#global .sns {
  opacity: 0;
  transform: translateX(10%);
  transition: 1200ms cubic-bezier(0.19, 1, 0.22, 1);
  transition-property: opacity, transform;
}
#global .logo {
  transition-delay: 0.1s;
}
#global .catch {
  transition-delay: 0.1s;
}
#global .inner nav .menu li:nth-of-type(1) {
  transition-delay: 0.2s;
}
#global .inner nav .menu li:nth-of-type(2) {
  transition-delay: 0.3s;
}
#global .inner nav .menu li:nth-of-type(3) {
  transition-delay: 0.4s;
}
#global .inner nav .menu li:nth-of-type(4) {
  transition-delay: 0.5s;
}
#global .inner nav .menu li:nth-of-type(5) {
  transition-delay: 0.6s;
}
#global .sns {
  transition-delay: 0.7s;
}
#switch_global:checked ~ #global .logo,
#switch_global:checked ~ #global .catch,
#switch_global:checked ~ #global .inner nav .menu li,
#switch_global:checked ~ #global .sns {
  opacity: 1;
  transform: translateX(0);
}
/* Breadcrumb
---------------------------------------- */
.breadcrumb ul {
  letter-spacing: 0.05em;
  margin: 0.85em;
  text-align: center;
}
.breadcrumb ul li {
  display: inline-block;
  font-size: 0.625em;
}
.breadcrumb ul li::after {
  content: ">";
  padding: 0 0.5em;
}
.breadcrumb ul li:last-child::after {
  display: none;
}
html[class*=desktop] .breadcrumb ul li a {
  transition: opacity 300ms;
}
html[class*=desktop] .breadcrumb ul li a:hover {
  opacity: 0.8;
}
/* Main
======================================== */
#main > div h3:first-child {
  color: #535454;
  font-family: Karla, sans-serif;
  font-size: 1.875em;
  font-weight: normal;
  letter-spacing: 0.075em;
  margin-bottom: 0.49em;
  margin-top: 3.15em;
  text-align: center;
}
#main .inner {
  margin: 2em auto 0;
}
#main > div[id] {
  border-top: 1px solid #C0C0C0;
  padding-bottom: 2.25em;
}
#main > .inner:first-child {
  max-width: 43.75em;
}
.date {
  font-family: EB Garamond, serif;
  margin-top: 5.65em;
  text-align: center;
}
#main > .inner > article > h3 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.875em;
  font-weight: normal;
  letter-spacing: 0.075em;
  line-height: 1.6;
  margin-bottom: 1.3em;
  margin-top: 1.3em;
  text-align: center;
}
.meta {
  line-height: 1.5;
  margin-bottom: 3.9em;
  margin-top: -1.8em;
  padding-left: 1em;
  padding-right: 1em;
}
.meta .credit {
  font-family: EB Garamond, serif;
  font-size: 0.75em;
  letter-spacing: 0.075em;
  text-align: center;
}
#main > .inner > article .content h4 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.25em;
  font-weight: normal;
  line-height: 1.875;
  text-align: center;
}
#main > .inner > article .content > h4 {
  margin: 2.8em auto -1.4em;
}
#main > .inner > article .content h5,
#main > .inner > article .content strong {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.1428em;
  font-weight: normal;
  line-height: 1.875;
}
#main > .inner > article .content h6,
#main > .inner > article .content > p {
  font-size: 0.875em;
  letter-spacing: 0.12em;
  line-height: 2;
  margin: 2.5em auto;
}
#main > .inner > article .content h6 {
  font-weight: bold;
  margin: 2em auto;
}
#main > .inner > article .content > p {
  font-feature-settings: "palt";
}
#main > .inner > article .content img {
  height: auto;
}
#main > .inner > article .content p img[width^="900"] {
  font-size: 1.14285em;
  position: relative;
}
#main > .inner > article .content .wp-caption-text {
  font-size: 0.625em;
  letter-spacing: 0.1em;
  margin-top: 1.5em;
}
.alignleft {
  float: left;
  margin: 0.5em 1em 0.5em 0;
}
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.alignright {
  float: right;
  margin: 0.5em 0 0.5em 1em;
}
#main > .inner > article .content > blockquote {
  background-color: #F2F2F2;
  border: none;
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-style: normal;
  letter-spacing: 0.04em;
  line-height: 1.875;
  margin: 4em auto;
  padding: 3.35em 3.3em;
  position: relative;
}
#main > .inner > article .content > blockquote:before,
#main > .inner > article .content > blockquote:after {
  background: url(../img/blockquote01.png) no-repeat center;
  background-size: cover;
  content: "";
  display: block;
  height: 1em;
  position: absolute;
  width: 1.25em;
}
#main > .inner > article .content > blockquote:before {
  left: 1.25em;
  top: 1.75em;
}
#main > .inner > article .content > blockquote:after {
  bottom: 1.75em;
  right: 1.25em;
  transform: rotate(180deg);
}
#main > .inner > article .content ul,
#main > .inner > article .content ol {
  margin: 4em auto;
}
#main > .inner > article .content li {
  font-size: 0.875em;
  letter-spacing: 0.04em;
  line-height: 1.75;
  list-style-position: inside;
  margin: 0.75em auto;
  padding-left: 1.5em;
  text-indent: -1.65em;
}
#main > .inner > article .content ul li {
  list-style-type: square;
  text-indent: -1em;
}
#main > .inner > article .content ol li {
  list-style-type: decimal-leading-zero;
}
#main > .inner > article .content table {
  border-collapse: collapse;
  font-size: 1em;
  letter-spacing: 0.04em;
  width: 100%;
}
#main > .inner > article .content > table {
  font-size: 0.875em;
  width: 100%;
}
#main > .inner > article .content > table tr > th,
#main > .inner > article .content > table tr > td {
  border-bottom: 1px solid #C0C0C0;
  border-top: 1px solid #C0C0C0;
  padding-bottom: 0.75em;
  padding-top: 0.75em;
}
#main > .inner > article .content a {
  text-decoration: underline;
}
#main > .inner > article .content a:hover {
  opacity: 0.8;
  text-decoration: none;
}
#main > .inner > article .content > .profile {
  border-top: 1px solid #C0C0C0;
  margin: 5em auto 0;
}
#main > .inner > article .content > .profile + .profile {
  margin-top: 1em;
}
#main > .inner > article .content > .profile tr > * {
  border: none;
  padding-bottom: 4em;
  padding-top: 4em;
  vertical-align: top;
}
#main > .inner > article .content .profile h5 {
  display: inline-block;
  font-family: Karla, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  letter-spacing: 0.075em;
  margin: 0.5em 1.25em 0 0;
  text-decoration: underline;
  vertical-align: top;
}
#main > .inner > article .content .profile .img {
  display: inline-block;
  margin-top: 1.5em;
  width: 10.7142em;
}
#main > .inner > article .content .profile td {
  width: 62.5%;
}
#main > .inner > article .content .profile h6 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.1428em;
  font-weight: normal;
  letter-spacing: 0.075em;
  margin: 0.5em 0 1em;
}
#main > .inner > article .content .profile p {
  line-height: 1.8;
  text-align: justify;
}
.page-links {
  border-top: 1px solid #C0C0C0;
  margin-top: -0.15em;
  padding: 3.25em 1.5em;
  text-align: center;
}
.page-links h4 {
  font-size: 0.875em;
  font-weight: normal;
  letter-spacing: 0.04em;
}
.page-links h4 .next {
  display: inline-block;
  margin-right: 0.35em;
  max-width: 6.571em;
  vertical-align: middle;
}
.page-links h4 .title {
  text-decoration: underline;
}
.page-links ul {
  padding: 0.25em 0 0.75em;
}
.page-links ul li {
  border: 1px solid #535454;
  display: inline-block;
  font-family: EB Garamond, serif;
  font-size: 1.125em;
  height: 2em;
  line-height: 1.65em;
  margin: 0.38em 0.56em;
  text-align: center;
  width: 2em;
}
.page-links ul li .current {
  display: block;
  height: 2em;
  width: 2em;
}
.page-links ul li a {
  background-color: #535454;
  color: #FFF;
  display: block;
  height: 2em;
  line-height: 1.75;
  width: 2em;
}
.page-links .page-numbers:not(.next):not(.prev) {
  align-items: center;
  display: flex;
  justify-content: center;
}
html[class*=desktop] .view_all a,
html[class*=desktop] .index-link a {
  transition: opacity 300ms;
}
html[class*=desktop] .view_all a:hover,
html[class*=desktop] .index-link a:hover {
  opacity: 0.8;
}
.tag-list {
  border-top: 1px solid #C0C0C0;
  padding: 2em 2.75em 3.3em;
  text-align: center;
}
.tag-list h4 {
  color: #535454;
  font-family: Karla, sans-serif;
  font-size: 1.5em;
  font-weight: normal;
  letter-spacing: 0.1em;
  margin-bottom: 0.8em;
}
.tag-list ul {
  margin-bottom: 0.8em;
  text-align: left;
}
.tag-list ul li {
  display: inline-block;
  font-size: 0.75em;
  letter-spacing: 0.04em;
  line-height: 1.2;
  margin: 0.35em 1.25em 0.35em 0;
}
.tag-list ul li a:before {
  content: "#";
}
html[class*=desktop] .tag-list ul li a {
  transition: opacity 300ms;
}
html[class*=desktop] .tag-list ul li a:hover {
  opacity: 0.6;
}
/* Archive
---------------------------------------- */
.archive .title h3 {
  margin: 2.76em auto 2.96em;
}
.archive #main .inner {
  margin-top: 3.25em;
}
.archive .related.articles {
  border-top: none;
}
.taxonomy .related.articles h3 {
  display: block;
}
.taxonomy .title .category {
  font-family: EB Garamond, serif;
  letter-spacing: 0.025em;
  margin-bottom: -1em;
  margin-top: 6.2em;
  text-indent: -1em;
}
.taxonomy #hero .title h3 {
  color: #000;
  font-size: 1.875em;
  margin: 1em auto;
}
.taxonomy .title .description {
  font-size: 0.75em;
  line-height: 2;
  margin: 3.5em auto 7.8em;
  max-width: 46em;
  text-align: left;
}
.taxonomy .related.news + .related.articles {
  border-top: 1px solid #C0C0C0;
}
.taxonomy #main > div:first-child {
  border-top: none;
}
/* Tag
---------------------------------------- */
.archive.tag .title h3::before {
  content: "#";
}
.taxonomy.tag #hero .title h3 {
  font-size: 3em;
  margin: 2.76em auto 2.96em;
}
.tag .related.articles h3 {
  display: none;
}
/* Post
---------------------------------------- */
.post #hero .title .hide h3 {
  display: none;
}
.post #hero .title h3 {
  color: #FFF;
}
.post #hero .title .black h3 {
  color: #000;
}
/* Share Link
---------------------------------------- */
.share-link {
  border-top: 1px solid #C0C0C0;
  padding: 2em 0;
  text-align: center;
}
.share-link h4 {
  color: #535454;
  font-family: Karla, sans-serif;
  font-size: 1.5em;
  font-weight: normal;
  letter-spacing: 0.1em;
  margin-bottom: 1.1em;
}
.share-link ul {
  display: table;
  table-layout: fixed;
  width: 100%;
}
.share-link ul li {
  display: table-cell;
}
.share-link ul li a {
  color: #FFF;
  display: block;
  font-family: Karla, sans-serif;
  font-size: 0.9375em;
  padding: 0.75em;
  position: relative;
  text-align: center;
  z-index: 0;
}
.share-link ul li a::before {
  background-color: #FFF;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.4s;
  z-index: -1;
}
html[class*=desktop] .share-link ul li a:hover::before {
  opacity: 0.9;
}
.share-link .twitter a::before {
  background-color: #5EA9DD;
}
.share-link .facebook a::before {
  background-color: #3B5998;
}
.share-link .line a::before {
  background-color: #6ECB30;
}
.share-link .pinterest a::before {
  background-color: #BD081C;
}
.share-link ul li a::after {
  background-color: #000;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -2;
}
.share-link .url.table {
  margin: 1.25em auto 4.25em;
  width: 100%;
}
.share-link .url .icon {
  padding-right: 0.75em;
  width: 8%;
}
.share-link .url .icon img {
  max-width: 3.75em;
}
.share-link .url input {
  -webkit-appearance: none;
  border: 1px solid #535454;
  border-radius: 0;
  color: #535454;
  font-family: Karla, sans-serif;
  font-size: 0.75em;
  letter-spacing: 0.075em;
  padding: 0.675em 1em;
  width: 96%;
}
.share-link {
  margin-top: 5.75em;
}
.page-links + .share-link,
.tag-list + .share-link {
  margin-top: 0;
}
/* Related Articles
======================================== */
.related ul li .img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 100%;
  position: relative;
}
.related ul li .img img {
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
}
#main .related ul li.read-more {
  clear: both;
  float: none;
  margin-bottom: 0;
  width: 100%;
}
#main .related ul li.read-more a {
  color: #FFF;
  padding: 0.5em;
  top: 1.5em;
  transition: opacity 0.25s;
}
html[class*=desktop] #main .related ul li.read-more a:hover {
  background-color: #535454;
}
.related.articles {
  border-top: 1px solid #C0C0C0;
  padding-bottom: 6em;
}
.related.articles ul {
  margin: auto;
  max-width: 87.5em;
  padding: 1.75%;
}
.related.articles ul li {
  box-sizing: border-box;
  float: left;
  margin-bottom: 0.5em;
  width: 33.333%;
}
.related.articles ul li:nth-child(3n+1) {
  clear: both;
}
.related.articles ul li a {
  color: #000;
  display: block;
  padding: 5.6%;
  position: relative;
  text-align: center;
  transition: background-color 0.5s;
}
.related ul li .date {
  font-size: 0.75em;
  letter-spacing: 0.09em;
  margin: 2.4em auto 2em;
}
.related ul li .date .new {
  display: inline-block;
  margin: -2.75em 0.75em -2.75em 0;
  max-width: 2.75em;
  vertical-align: middle;
}
.related ul li .feature {
  position: absolute;
  right: 2.125em;
  top: 0.875em;
  z-index: 2;
}
.related ul li .feature img {
  width: 3.75em;
}
.related.articles {
  overflow: hidden;
}
.related.articles ul li h4 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.8125em;
  font-weight: normal;
  line-height: 1.2;
  margin: 0.45em auto 0.65em;
}
.related.articles ul li .subtitle {
  font-size: 0.875em;
  font-weight: normal;
  letter-spacing: 0.05em;
  line-height: 1.714;
  margin: 1.4em auto 0.5em;
  min-height: 3.4em;
}
.related.articles ul li .subtitle p {
  margin: 0;
}
/* Tag Cloud
---------------------------------------- */
.tagcloud {
  letter-spacing: 0;
  line-height: 1.57;
  margin: 3.65em auto;
  max-width: 68.75em;
  padding: 0 4em;
}
.tagcloud a {
  margin-right: 0.75em;
  transition: opacity 300ms;
}
html[class*=desktop] .tagcloud a:hover {
  opacity: 0.6;
}
.tagcloud a::before {
  content: "#";
}
/* Instagram
---------------------------------------- */
#instagram p {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  margin-top: -0.25em;
  text-align: center;
}
#instagram p img {
  max-width: 1.25em;
  vertical-align: bottom;
}
html[class*=desktop] #instagram p a {
  transition: opacity 300ms;
}
html[class*=desktop] #instagram p a:hover {
  opacity: 0.8;
}
#instagram .feed {
  margin: 4.5em auto 4em;
  overflow: hidden;
}
#instagram .feed li li {
  overflow: hidden;
}
#instagram .feed li li a span {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  transition: 0.4s transform;
}
#instagram .feed li li a span::before {
  content: "";
  display: block;
  padding-top: 100%;
  width: 25em;
}
html[class*=desktop] #instagram .feed li li a:hover span {
  transform: scale(1.1);
}
#instagram .feed li li a img {
  display: none;
}
#instagram .big {
  max-width: 25em;
}
#instagram .small {
  max-width: 12.5em;
}
#instagram .big > li {
  margin-right: 2px;
}
#instagram .small > li {
  margin: 0 2px 2px 0;
}
#instagram .small > li + li {
  margin: 2px 2px 0 0;
}
.slide {
  position: relative;
}
#instagram .slide::before {
  background: url("../css/ajax-loader.gif") no-repeat center #FFF;
  background-size: 32px 32px;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  opacity: 1;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.5s 0.5s, z-index 0.5s 0.5s;
  z-index: 1;
}
#instagram .slide.js-loaded::before {
  opacity: 0;
  z-index: -1;
}
.slick-track {
  min-width: 7700px;
}
.slick-slider {
  position: static;
}
.slide-nav .prev,
.slide-nav .next,
.slick-arrow {
  background: url(../img/arrow02.png) no-repeat center;
  background-size: cover;
  cursor: pointer;
  height: 3.125em;
  left: 0;
  margin-top: -1.5625em;
  position: absolute;
  top: 50%;
  transition: opacity 0.25s;
  width: 3.125em;
  z-index: 3;
}
.slick-arrow {
  font-size: 1em;
  transform: none;
}
.slick-arrow::before,
.slick-arrow::after {
  display: none;
}
.slide-nav .next,
.slick-next {
  left: inherit;
  right: 0;
  transform: rotate(180deg);
}
.slide-nav .prev:hover,
.slide-nav .next:hover,
.slick-arrow:hover {
  background: url(../img/arrow02.png) no-repeat center;
  background-size: cover;
  opacity: 0.8;
}
.slick-next:focus,
.slick-prev:focus {
  background: url(../img/arrow02.png) no-repeat center;
  background-size: cover;
}
/* News
---------------------------------------- */
.related.news {
  border-top: 1px solid #C0C0C0;
  padding-bottom: 0.5em;
  position: relative;
}
.view_all {
  margin: 0 auto -2em;
  max-width: 59.2em;
  position: relative;
  text-align: right;
  top: -2.25em;
}
.index {
  font-family: Karla, sans-serif;
  font-size: 1.125em;
}
.index img {
  max-width: 0.888em;
  position: relative;
  top: 0.1em;
}
.related.news .inner > ul,
.related.news .inner .slide > ul {
  margin: 2.8em auto 0;
  max-width: 68.5em;
  overflow: hidden;
  text-align: left;
}
.related.news .inner > ul li,
.related.news .inner .slide > ul li {
  box-sizing: border-box;
  display: inline-block;
  margin: 1.523%;
  vertical-align: top;
  width: 14.6875em;
}
.related.news .inner .slide > ul {
  max-width: 68.78em;
}
.related.news .inner .slide > ul li {
  box-sizing: inherit;
  margin: 0.2598%;
  width: auto;
}
.related.news ul li .img {
  padding-top: 65.125%;
}
.related.news ul li .date {
  margin: 1.25em auto -0.4em;
  text-align: left;
}
.related.news ul li h4 {
  color: #000;
  font-size: 0.875em;
  font-weight: normal;
  letter-spacing: 0.05em;
  line-height: 1.714;
  margin-bottom: -2em;
  min-height: 10em;
  text-align: left;
}
.related.news .slide-nav .prev,
.related.news .slide-nav .next,
.related.news .slick-arrow {
  margin-top: -6.25em;
}
#news .related.news ul li h4 {
  margin-bottom: 1.5em;
  min-height: 2em;
}
#news .page-links {
  margin-top: 2em;
}
#news #hero .title {
  margin-bottom: 3.25em;
}
#news #hero .title .table {
  height: 15em;
  margin-top: auto;
  position: relative;
  top: auto;
}
#news #hero .title h3 a {
  color: #000;
}
.index-link {
  margin: -0.25em auto 6.1em;
  text-align: center;
}
#news .related.news {
  border-top: none;
}
.related.news .category-list ul,
.related.news .category-list ul li {
  display: inline;
  word-break: keep-all;
}
.category-list ul li li::before {
  content: "/ ";
}
.category-list .current-cat > a,
html[class*=desktop] .category-list a:hover {
  background-color: #50F2AE;
  display: inline-block;
  line-height: 1;
}
.category-list > ul > li {
  font-family: Karla, sans-serif;
  font-size: 1.125em;
  line-height: 1.55;
}
.related.news .category-list > ul {
  display: block;
  margin: 5.85em auto -0.15em;
  max-width: 66.2em;
}
/* Magazine
---------------------------------------- */
#main .magazine div h3 {
  margin-bottom: -1.2em;
  margin-top: 2.9em;
}
.related.magazine ul {
  margin: 4em auto 0;
}
.related.magazine ul li {
  box-sizing: border-box;
  float: left;
  margin-bottom: 0.5em;
  margin-left: 0.3125em;
  margin-right: 0.3125em;
  width: 19.9375em;
}
.related.magazine ul li .img {
  padding-top: 152.664%;
}
.related.magazine ul li .date {
  margin: 1.25em auto -0.4em;
  text-align: left;
}
.related.magazine ul li h4 {
  font-size: 0.875em;
  font-weight: normal;
  letter-spacing: 0.05em;
  line-height: 1.714;
  margin-bottom: -2.4em;
  min-height: 10em;
}
.related.magazine .slide-nav .prev,
.related.magazine .slide-nav .next,
.related.magazine .slick-arrow {
  margin-top: -6.25em;
}
.related.magazine.archive {
  margin-bottom: 8em;
  overflow: hidden;
}
.related.magazine.archive ul {
  margin-inline: auto;
  margin-top: 6.625em;
  max-width: 82em;
}
.related.magazine.archive ul li {
  margin-bottom: 2.5em;
  margin-inline: 0.40625em;
  width: 19.6875em;
}
#main .related.magazine.archive ul li.read-more a {
  position: relative;
  top: 1.75em;
}
/* Home
---------------------------------------- */
#sticky-news {
  background-color: #535454;
  border: 1px solid #C0C0C0;
  border-right: 0;
  bottom: 1.125em;
  padding: 0.75em 0.9375em 0.9375em;
  position: fixed;
  right: 0;
  width: 9.0625em;
  z-index: 19;
}
#sticky-news h3 {
  color: #FFF;
  font-family: Karla, sans-serif;
  font-size: 1.4em;
  font-weight: normal;
  letter-spacing: 0.075em;
  margin-block: 0 0.4em;
  text-indent: -0.175em;
}
#sticky-news .date {
  color: #FFF;
  font-size: 8px;
  letter-spacing: 0.075em;
  margin-block: 0.5em;
  text-align: left;
}
#sticky-news .date .new {
  display: none;
}
#sticky-news h4 {
  color: #FFF;
  font-size: 10px;
  letter-spacing: 0.075em;
  line-height: 1.8;
  margin-block: 0;
}
#sticky-news h4 br {
  display: none;
}
#sticky-news .index {
  border-top: 1px solid #C0C0C0;
  color: #FFF;
  font-size: 1em;
  letter-spacing: 0.075em;
  line-height: 1;
  margin-top: 0.675em;
  padding-top: 0.9em;
}
#sticky-news .index a {
  color: currentColor;
}
#sticky-news .index img {
  filter: brightness(0) invert(1);
  margin-right: -0.2em;
  max-width: 0.75em;
  top: 0.15em;
}
#home #main > div[id]:first-child {
  border-top: none;
}
#home .magazine,
#home .news {
  background-color: #F2F2F2;
  overflow: hidden;
}
#home .magazine .slide {
  padding-top: 3em;
}
#home .magazine .view_all {
  top: 0.625em;
  z-index: 1;
}
#home .related.articles {
  border-top: none;
}
#home .related.articles .inner > h4 {
  display: none;
}
#home #contents {
  /* background-color: #F2F2F2; */
  /* padding-bottom: 0; */
}
label.panel-label {
  -webkit-user-select: none;
  -moz-user-select: none;
  background-color: #535454;
  color: #959595;
  cursor: pointer;
  display: block;
  font-family: Karla, sans-serif;
  font-size: 1.5em;
  margin-top: 0.25em;
  padding: 0.55em 0;
  transition-duration: 200ms;
  transition-property: background-color, color;
  user-select: none;
  width: 100%;
}
html[class*=desktop] label.panel-label:hover {
  background-color: #5F5F5F;
}
#panels {
  background-color: #FFF;
  margin-top: 7.6875em;
  overflow: hidden;
  padding-top: 1.3em;
}
#panels .inner {
  margin-top: 0;
}
#panels > div {
  display: none;
}
#panel-1-ctrl:checked ~ #panels .all,
#panel-2-ctrl:checked ~ #panels .projects {
  display: block;
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 .panel-label,
#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 .panel-label {
  background-color: #FFF;
  color: #535454;
  cursor: default;
  margin-top: 0;
  padding: 0.75em 0 0.55em;
  pointer-events: none;
}
ul#tabs-list {
  height: 3.6875em;
  margin-top: 3.125em;
  overflow: hidden;
  position: absolute;
  transform: translateY(0);
  transition: transform 400ms;
  width: 100%;
}
ul#tabs-list.sticky {
  background-color: #FFF;
  margin-top: 0;
  position: fixed;
  top: 0;
  z-index: 4;
}
ul#tabs-list.sticky li::after {
  display: none;
}
.stickyStart ul#tabs-list.sticky {
  transform: translateY(5.0625em);
}
ul#tabs-list.sticky.end {
  transform: translateY(-3.6875em);
}
ul#tabs-list li {
  float: left;
  position: relative;
  text-align: center;
  width: 50%;
}
ul#tabs-list li::after {
  background-color: #FFF;
  bottom: -1px;
  content: "";
  display: block;
  height: 2px;
  position: absolute;
  width: 100%;
}
.panel-radios {
  display: none;
}
.projects.related.articles ul {
  overflow: hidden;
}
/* Related Hover
---------------------------------------- */
html[class*=desktop] #us-recent a .img span:before,
html[class*=desktop] #us-recent a .img span:after,
html[class*=desktop] .related ul li a .img span::before,
html[class*=desktop] .related ul li .img a span::before,
html[class*=desktop] .related ul li a .img span::after,
html[class*=desktop] .related ul li .img a span::after {
  background-color: #FFF;
  content: "";
  display: block;
  height: 0;
  left: 50%;
  position: absolute;
  top: 50%;
  transition-duration: 0.7s;
  transition-property: height, width;
  width: 0;
  z-index: 3;
}
html[class*=desktop] #us-recent a .img span:before,
html[class*=desktop] .related ul li a .img span::before,
html[class*=desktop] .related ul li .img a span::before {
  height: 1px;
  margin-left: -35px;
}
html[class*=desktop] #us-recent a:hover .img span:before,
html[class*=desktop] .related ul li a:hover .img span::before,
html[class*=desktop] .related ul li .img a:hover span::before {
  width: 70px;
}
html[class*=desktop] #us-recent a .img span:after,
html[class*=desktop] .related ul li a .img span::after,
html[class*=desktop] .related ul li .img a span::after {
  margin-top: -35px;
  width: 1px;
}
html[class*=desktop] #us-recent a:hover .img span:after,
html[class*=desktop] .related ul li a:hover .img span::after,
html[class*=desktop] .related ul li .img a:hover span::after {
  height: 70px;
}
html[class*=desktop] #us-recent a .img:after,
html[class*=desktop] .related ul li a .img::after,
html[class*=desktop] .related ul li .img a::after {
  background-color: rgba(0, 0, 0, 0);
  bottom: 0;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition-duration: 0.7s;
  transition-property: background-color;
  width: 100%;
  z-index: 2;
}
html[class*=desktop] #us-recent a:hover .img:after,
html[class*=desktop] .related ul li a:hover .img::after,
html[class*=desktop] .related ul li .img a:hover::after {
  background-color: rgba(0, 0, 0, 0.5);
}
/* Map
---------------------------------------- */
#gmap {
  background-color: #F2F2F2;
  height: 33.125em;
  margin: 4em auto;
}
#gmap > div {
  bottom: 0;
}
/* About
---------------------------------------- */
#about .content {
  font-size: 0.875em;
  letter-spacing: 0;
  line-height: 2.142;
  margin: 4em auto;
  text-align: center;
}
#about .content h6 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 0.875em;
  font-weight: normal;
}
/* 404
---------------------------------------- */
#error #hero .title .table {
  height: auto;
  margin-top: auto;
  position: relative;
  top: inherit;
}
#error #hero .title .catch {
  font-family: Karla, sans-serif;
  font-size: 1.125em;
  margin-top: 5.75em;
}
#error #hero h3 {
  margin: 0.75em auto;
}
#error #hero h3 + p {
  font-size: 0.875em;
  font-weight: bold;
  line-height: 1.75;
}
#error #hero .btn {
  margin: 1.5em auto 6.5em;
}
#error #footer {
  padding-bottom: 5em;
}
/* Urban Science
---------------------------------------- */
#us-recent .img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
#us-recent .img::before {
  content: "";
  display: block;
  padding-top: 53.7%;
}
#us-recent .img img {
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
}
#us-recent .date {
  font-size: 75%;
  margin-top: 0;
  padding: 1.5em 0 0.5em;
  text-align: left;
}
#us-recent .date .new {
  display: inline-block;
  margin: -2.75em 0.75em -2.75em 0;
  max-width: 2.75em;
  vertical-align: middle;
}
#us-recent .content {
  font-size: 0.875em;
  line-height: 2;
  margin-bottom: 0;
  overflow: hidden;
}
#home .us-area {
  box-sizing: border-box;
  float: left;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0 3.6%;
  position: relative;
  width: 31%;
}
#home .us-area::before {
  background-color: #C0C0C0;
  content: "";
  height: 100vh;
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
}
#home .nt-area {
  margin-bottom: 0;
  margin-left: auto;
  margin-right: 0;
  margin-top: 0;
  position: relative;
  width: 69%;
}
#home .nt-area .inner {
  padding: 0 8.25%;
}
#home .related.news .nt-area .inner .slide > ul {
  margin-top: 2.6em;
}
#home .nt-area .slick-prev {
  margin-left: -9.85%;
}
#home .nt-area .slick-next {
  margin-right: -9.85%;
}
/**************************************/
#home .related.special-edition {
  background-color: #F2F2F2;
  border-top: 1px solid #C0C0C0;
  overflow: hidden;
}
#home .se-area {
  margin-bottom: 0;
  margin-left: auto;
  margin-right: 0;
  margin-top: 0;
  position: relative;
  width: 100%;
}
#home .se-area .inner {
  padding: 0 0;
}
#home .related.special-edition .se-area .inner .slide > ul {
  margin-top: 2.6em;
}
#home .se-area .slick-list {
  margin-inline: auto;
  max-width: 67.8125em;
  overflow: visible;
  width: 77.5%;
}
#home .se-area .slick-prev,
#home .se-area .slick-next {
  top: calc(6.75em + 15%);
}
#home .se-area .slick-prev {
  margin-left: 0;
}
#home .se-area .slick-next {
  margin-right: 0;
}
#home .se-area .wrap {
  align-items: center;
  box-sizing: content-box;
  -moz-column-gap: 2.7649769585%;
       column-gap: 2.7649769585%;
  display: flex;
  justify-content: center;
  padding-block: 1.375em 6.25em;
  padding-inline: 2.7649769585%;
}
#home .se-area .wrap .block.image {
  flex-basis: 55.3170731707%;
}
#home .se-area .wrap .block.text {
  flex-basis: 41.756097561%;
}
#home .related.special-edition .se-area ul li .img {
  padding-top: 53.75%;
}
#home .related.special-edition .se-area ul li h4 {
  font-family: "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.8125em;
  font-weight: normal;
  line-height: 1.2;
  margin: 0 auto 0.5em;
  /* padding-inline: 5.6%; */
  padding-inline-start: 1.5em;
}
#home .related.special-edition .se-area h3 + ul > li {
  margin-bottom: 2.5em;
}
#home .related.special-edition .se-area ul.post-list {
  /* padding: 0 5.6% 5.6%; */
}
#home .related.special-edition .se-area ul.post-list li {
  clear: both;
  float: none;
  margin-block: 0.5em;
  width: 100%;
}
#home .related.special-edition .se-area ul.post-list li:not(.btn) a {
  display: inline;
  padding: 0;
  text-align: left;
}
#home .related.special-edition .se-area ul.post-list li .date,
#home .related.special-edition .se-area ul.post-list li h5 {
  display: inline-block;
  margin: 0;
}
#home .related.special-edition .se-area ul.post-list li .date {
  box-sizing: border-box;
  float: left;
  padding-left: 3.75em;
  text-align: left;
  width: 30%;
}
#home .related.special-edition .se-area ul.post-list li .date .new {
  margin-left: -3.5em;
}
#home .related.special-edition .se-area ul.post-list li .date time {
  font-size: 91.6667%;
}
#home .related.special-edition .se-area ul.post-list li h5 {
  box-sizing: border-box;
  overflow: hidden;
  width: 70%;
}
#home .related.special-edition .se-area ul.post-list li.read-more {
  margin-top: 1.5em;
}
/**************************************/
#home #us-recent .recent-post {
  margin-top: 3.8em;
}
#home #us-recent h4 {
  color: #000;
  font-size: 0.875em;
  font-weight: normal;
  letter-spacing: 0.05em;
  line-height: 1.714;
  text-align: left;
}
#home #us-recent .date {
  margin-bottom: -0.4em;
  padding-bottom: 0;
}
.urban-science #us-recent {
  border-bottom: 1px solid #C0C0C0;
  border-top: 1px solid #C0C0C0 !important;
  overflow: hidden;
  padding: 6.25em 0 !important;
}
.urban-science #us-recent .inner {
  margin: 0 auto;
  max-width: 84.5em;
  padding: 0 3.6%;
}
.urban-science #us-recent .img {
  float: left;
  margin-right: 3.8%;
  max-width: 53%;
  width: 100%;
}
.urban-science #us-recent h4 {
  font-family: EB Garamond, "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
  font-size: 1.8125em;
  font-weight: normal;
  line-height: 1.2;
  margin: 0.45em auto 0.65em;
}
.urban-science .related.articles ul li .img {
  padding-top: 53.75%;
}
.urban-science .related.articles ul li h4 {
  margin: 0.85em auto -0.2em;
}
.urban-science .related.articles h3 + ul > li {
  margin-bottom: 2.5em;
}
.urban-science .related.articles ul.post-list {
  padding: 0 5.6% 5.6%;
}
.urban-science .related.articles ul.post-list li {
  clear: both;
  float: none;
  width: 100%;
}
.urban-science .related.articles ul.post-list li:not(.btn) a {
  display: inline;
  padding: 0;
  text-align: left;
}
.urban-science .related.articles ul.post-list li .date,
.urban-science .related.articles ul.post-list li h5 {
  display: inline-block;
  margin: 0;
}
.urban-science .related.articles ul.post-list li .date {
  box-sizing: border-box;
  float: left;
  padding-left: 3.75em;
  text-align: left;
  width: 30%;
}
.urban-science .related ul.post-list li .date .new {
  margin-left: -3.5em;
}
.urban-science .related.articles ul.post-list li .date time {
  font-size: 91.6667%;
}
.urban-science .related.articles ul.post-list li h5 {
  box-sizing: border-box;
  overflow: hidden;
  width: 70%;
}
.urban-science .related.articles ul.post-list li.read-more {
  margin-top: -0.75em;
}
html[class*=desktop] .urban-science .related.articles ul.post-list li:not(.btn) a {
  transition: opacity 0.25s;
}
html[class*=desktop] .urban-science .related.articles ul.post-list li:not(.btn) a:hover {
  opacity: 0.6;
}
/* Footer
======================================== */
#footer {
  border-top: 1px solid #C0C0C0;
  padding-bottom: 10.5em;
  padding-top: 2.85em;
  text-align: center;
}
.sns {
  font-family: Karla, sans-serif;
  font-size: 0.9375em;
  letter-spacing: 0.05em;
  margin: 3em auto;
}
.sns > *,
.sns ul li {
  display: inline-block;
}
.sns h3 {
  font-size: 1em;
  font-weight: normal;
  margin: 0.5em 4.5em 0.5em 1.5em;
  text-decoration: underline;
}
.sns h3::after {
  content: ":";
  display: inline-block;
  padding-left: 3em;
  position: absolute;
}
.sns ul li {
  margin: 0.5em 1.5em;
}
.sns img {
  height: 1.333em;
  margin-right: 0.25em;
  vertical-align: text-bottom;
  width: 1.333em;
}
.sns img[src*=youtube] {
  width: 1.8667em;
}
html[class*=desktop] .sns a {
  transition: opacity 300ms;
}
html[class*=desktop] .sns a:hover {
  opacity: 0.8;
}
#pagetop a {
  display: block;
  font-family: Karla, sans-serif;
  font-size: 10px;
  height: 60px;
  letter-spacing: 0.05em;
  margin: auto;
  overflow: hidden;
  transition: opacity 0.25s;
  width: 60px;
}
html[class*=desktop] #pagetop a:hover {
  opacity: 0.8;
}
#pagetop a::before {
  background: url(../img/arrow04.png) no-repeat center;
  background-size: cover;
  content: "";
  display: block;
  height: 7px;
  margin: 20px auto 18px;
  width: 12px;
}
#copyright {
  font-family: Karla, sans-serif;
  font-size: 10px;
  margin-top: -7.55em;
  position: absolute;
  right: 1.05em;
  top: 50%;
}
#copyright small {
  font-size: 1em;
}
#copyright img {
  height: 23.85em;
  width: 1em;
}
/* Font Setting Add 20171102
---------------------------------------- */
.related.articles ul li h4,
.taxonomy #hero .title h3,
#main > .inner > article > h3 {
  font-family: "游明朝体", YuMincho, "Yu Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
}
/* Media Query
======================================== */
@media screen and (max-width: 1340px) {
  .related.magazine.archive ul li {
    margin-inline: 0.5%;
    width: 24%;
  }
  #home .us-area {
    width: 50%;
  }
  #home .us-area .inner {
    max-width: 20em;
  }
  #home .nt-area {
    width: 50%;
  }
}
@media screen and (max-width: 1280px) {
  #home .se-area .slick-list {
    max-width: 27.5em;
  }
  #home .se-area .slick-prev,
  #home .se-area .slick-next {
    top: calc(4em + 10%);
  }
  #home .se-area .wrap {
    flex-direction: column;
    padding-block: 0.675em 6em;
    padding-inline: 1.49%;
    row-gap: 1.125em;
  }
  #home .se-area .wrap .block.image {
    width: 100%;
  }
  #home .se-area .wrap .block.text {
    width: 100%;
  }
  #home .related.special-edition .se-area ul.post-list li .date time::after {
    content: " update";
  }
  #home .related.special-edition {
    padding-bottom: 1.6em;
  }
  /* #home .related.special-edition .se-area ul li h4 {
    margin: 0 auto -0.3em;
  } */
  #home .related.special-edition .se-area ul.post-list li .date {
    font-size: 0.6875em;
    width: 100%;
  }
  #home .related.special-edition .se-area ul.post-list li .date .new {
    margin-top: -1.25em;
  }
  #home .related.special-edition .se-area ul li h4 {
    font-size: 1.40625em;
    font-weight: normal;
    margin: 0 auto 0.575em;
    padding-inline-start: 0;
    text-align: center;
  }
  #home .related.special-edition .se-area ul.post-list li h5 {
    font-size: 0.75em;
    font-weight: normal;
    margin: 0.4em 0 0.3em;
    padding-left: 3.43725em;
    width: 100%;
  }
  #home .related.special-edition .se-area ul.post-list li.read-more {
    margin-top: -0.25em;
  }
  #home .related.special-edition .se-area ul.post-list li.read-more a {
    position: relative;
  }
  .urban-science #us-recent .date time::after,
  .urban-science .related.articles ul.post-list li .date time::after {
    content: " update";
  }
  .urban-science #us-recent h4 {
    font-size: 1.40625em;
    line-height: 1.4222;
    margin-bottom: -0.1em;
    padding: 0 0.75em;
  }
  .urban-science .related.articles {
    padding-bottom: 1.6em;
  }
  .urban-science .related.articles ul li h4 {
    margin: 0.75em auto -0.3em;
  }
  .urban-science .related.articles ul.post-list li .date {
    font-size: 0.6875em;
    width: 100%;
  }
  .urban-science .related ul.post-list li .date .new {
    margin-top: -1.25em;
  }
  .urban-science .related.articles ul.post-list li h5 {
    font-size: 0.75em;
    margin: 0.4em 0 0.3em;
    padding-left: 3.43725em;
    width: 100%;
  }
  .urban-science .related.articles ul.post-list li.read-more {
    margin-top: -0.25em;
  }
}
@media screen and (max-width: 1120px) {
  .related ul li .feature {
    font-size: 90%;
  }
  #news .related.news .inner {
    margin-left: auto;
    margin-right: auto;
    max-width: 49.462em;
  }
  .related.news .category-list > ul {
    padding: 0 0.8em;
  }
}
@media screen and (max-width: 1080px) {
  .related.magazine.archive ul {
    margin-top: 3.75em;
    max-width: 980px;
  }
  .related.magazine.archive ul li {
    margin-bottom: 0.5em;
    margin-inline: 0.65%;
    width: 32%;
  }
  #us-recent .content {
    font-size: 0.6875em;
    line-height: 1.772;
    padding: 0 1.5em 0 2em;
    text-align: left;
  }
  .urban-science #us-recent .inner {
    max-width: 40em;
  }
  .urban-science #us-recent .inner > a {
    display: block;
    padding: 3.8%;
    position: relative;
    text-align: center;
  }
  .urban-science #us-recent .img {
    float: none;
    margin-right: 0;
    max-width: inherit;
    width: 100%;
  }
  .urban-science #us-recent .date {
    font-size: 0.6875em;
    padding-top: 2em;
    text-align: center;
  }
}
@media screen and (max-width: 940px) {
  .wp-caption {
    font-size: 80%;
  }
  #main > .inner > article .content p img[width^="900"] {
    font-size: 92%;
  }
  #main > .inner > article .content .wp-caption-text {
    font-size: 9px;
    margin-top: 1em;
  }
  #copyright {
    background: url(../img/copyright02.png) no-repeat center;
    background-size: cover;
    height: 1em;
    margin: 6em auto;
    position: relative;
    right: inherit;
    top: inherit;
    width: 22.65em;
  }
  #copyright img {
    display: none;
  }
}
@media screen and (max-width: 860px) {
  #about .content br.hide {
    display: inherit;
  }
  #about .content .signature {
    margin-top: 2em;
  }
  #about .content .signature br {
    display: none;
  }
}
@media screen and (max-width: 840px) {
  #news .related.news .inner {
    max-width: 31.75em;
  }
}
@media screen and (max-width: 820px) {
  .scrollStart #hero .logo h1 {
    left: 1.25em;
    margin-left: inherit;
  }
  .scrollStart #current-time {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  .related.articles ul li {
    width: 50%;
  }
  .related.articles ul li:nth-child(3n+1) {
    clear: inherit;
  }
  .related.articles ul li:nth-child(2n+1) {
    clear: both;
  }
}
@media screen and (max-width: 760px) {
  br.pc-only {
    display: none;
  }
  br.sp-only {
    display: inherit;
  }
  .wp-caption {
    font-size: 70%;
  }
  #main > .inner > article .content > h4,
  #main > .inner > article .content > h5,
  #main > .inner > article .content > h6,
  #main > .inner > article .content > p,
  #main > .inner > article .content > blockquote,
  #main > .inner > article .content > table,
  #main > .inner > article .content ul,
  #main > .inner > article .content ol,
  #main > .inner > article .content hr {
    margin-left: auto;
    margin-right: auto;
    max-width: 40em;
  }
  #main > .inner > article .content h4 {
    font-size: 1.071em;
    line-height: 1.4;
  }
  #main > .inner > article .content h5,
  #main > .inner > article .content strong {
    font-size: 1.076em;
    line-height: 1.75;
  }
  #main > .inner > article .content h5 {
    max-width: 32em;
  }
  #main > .inner > article .content h6,
  #main > .inner > article .content > p {
    font-size: 0.8571em;
    line-height: 1.85;
    margin: 3.5em auto;
  }
  #main > .inner > article .content ul,
  #main > .inner > article .content ol {
    max-width: 37em;
  }
  #main > .inner > article .content hr {
    max-width: 35.2em;
  }
  #main > .inner > article .content > blockquote {
    font-size: 0.857em;
    margin: 3em auto;
    padding: 1.75em 1.75em 1.25em;
  }
  #main > .inner > article .content > blockquote:before,
  #main > .inner > article .content > blockquote:after {
    font-size: 66%;
  }
  .page-links,
  .tag-list,
  .share-link {
    margin-left: 5.5%;
    margin-right: 5.5%;
    padding-left: 0;
    padding-right: 0;
  }
  .share-link .url input {
    width: 95%;
  }
}
@media screen and (max-width: 640px) {
  .btn a {
    border-radius: 1.25em;
    font-size: 0.75em;
    max-width: 18.25em;
    padding: 0.675em;
  }
  #current-time {
    display: none;
    font-size: 80%;
    left: 1.5em;
    top: 1.45em;
  }
  #current-time p {
    letter-spacing: 0.1em;
  }
  #current-time p br {
    display: none;
  }
  #home #current-time {
    display: block;
  }
  #home:not(.scrollStart) #hero .logo h1 {
    font-size: 105%;
    left: 50%;
    margin-left: -9.953125em;
    position: absolute;
    top: 4.5em;
  }
  #home .scrollStart #hero .logo h1 {
    font-size: 105%;
  }
  #home:not(.scrollStart) #hero .logo {
    background-color: transparent;
    padding-top: 1.75em;
    position: absolute;
  }
  #hero .logo {
    background-color: #FFF;
    padding-top: 3.25em;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10;
  }
  .scrollStart #hero .logo {
    position: fixed;
  }
  #hero .logo h1 {
    font-size: 77%;
    left: 1.25em;
    margin-left: inherit;
    top: 1.5em;
  }
  .scrollStart #hero .logo h1 {
    font-size: 77%;
  }
  #hero .catch {
    display: none;
    font-size: 0.65em;
    letter-spacing: 0.1em;
    margin: 7.3em auto 2.75em;
  }
  #home:not(.scrollStart) #hero .catch {
    display: block;
  }
  #hero .title,
  .taxonomy #hero .header_img {
    margin-bottom: 0;
    padding: 7em 0.6em 0.6em;
  }
  #hero .title figure,
  .taxonomy #hero .header_img figure {
    padding-top: 72.1%;
  }
  #hero .title figure::before,
  #hero .header_img figure::before {
    display: none;
  }
  #hero .title figure img,
  .taxonomy #hero .header_img figure img {
    display: none;
  }
  #hero .title h3,
  .taxonomy #hero .title h3 {
    font-size: 1.375em;
  }
  #hero .title .table {
    height: 29.25em;
    left: 0;
    margin-top: -11.25em;
  }
  .taxonomy #hero .header_img {
    margin-bottom: 0;
    padding: 7em 0.6em 0.6em;
  }
  .taxonomy #hero .header_img figure img {
    display: none;
  }
  #main_visual {
    margin-top: 9.375em;
  }
  #main_visual .slide.pc {
    display: none;
  }
  #main_visual .slide.sp {
    display: block;
  }
  #hero .next a {
    margin-top: 1.25em;
    max-width: 3.5em;
    top: -0.25em;
  }
  #btn_menu {
    font-size: 80%;
    position: absolute;
    right: 1.55em;
    top: 1.33em;
  }
  .scrollStart #btn_menu {
    position: fixed;
  }
  #global .logo h1 {
    font-size: 100%;
  }
  #global .logo h2 {
    font-size: 77%;
  }
  #global .inner nav .menu {
    font-size: 60%;
  }
  .scrollStart #hero .logo,
  .scrollStart #btn_menu {
    transform: translateY(-3.25em);
  }
  .stickyStart #hero .logo,
  .stickyStart #btn_menu {
    position: fixed;
    transform: translateY(0);
    transition: transform 400ms;
  }
  #home #btn_menu {
    position: absolute;
  }
  #switch_global:checked ~ #global #btn_menu,
  #home #switch_global:checked ~ #global #btn_menu,
  #home.scrollStart.stickyStart #btn_menu {
    position: fixed;
    transform: translateY(0);
  }
  .breadcrumb ul {
    line-height: 0.9;
    margin-bottom: 0.3em;
    margin-top: 0.3em;
  }
  .breadcrumb ul li {
    font-size: 0.5625em;
  }
  #main > div[id] {
    padding-bottom: 1.3125em;
  }
  #main > div h3:first-child {
    font-size: 1.3125em;
    margin-top: 2.5em;
  }
  #main > .inner > article > h3 {
    font-size: 1.3125em;
  }
  .meta {
    margin-bottom: 4.5em;
    margin-top: -1.5em;
  }
  .meta .credit {
    font-size: 0.6875em;
  }
  .page-links {
    font-size: 71.5%;
    padding-bottom: 4em;
  }
  .page-links ul {
    font-size: 94%;
  }
  .page-links ul li {
    margin: 0.38em 0.9em;
  }
  .tag-list {
    padding-bottom: 2.3em;
    padding-top: 0.9em;
  }
  .tag-list h4 {
    font-size: 0.9375em;
  }
  .tag-list ul {
    line-height: 0.75;
    margin-left: 1em;
    margin-right: 1em;
    margin-top: 1em;
  }
  .tag-list ul li {
    font-size: 0.625em;
    margin: 0 1.25em 0 0;
  }
  .archive #hero .title,
  .taxonomy.tag #hero .title {
    margin-bottom: 0;
    padding-top: 3.25em;
  }
  .archive #hero .title h3 {
    font-size: 1.5em;
    margin: 2.175em auto;
  }
  .taxonomy #hero .title {
    padding-top: 0;
  }
  .taxonomy #hero .title h3 {
    font-size: 1.3125em;
    margin: 1em auto;
  }
  .taxonomy .title .category {
    font-size: 0.6875em;
    margin-bottom: -1.5em;
    margin-top: 3.75em;
  }
  .taxonomy .title .description {
    font-size: 0.6875em;
    letter-spacing: 0.1em;
    line-height: 1.75;
    margin: 1em auto 3.8em;
    max-width: 25em;
  }
  .taxonomy #main .related.news h3 {
    margin-top: -0.75em;
  }
  .taxonomy.tag #hero .title h3 {
    font-size: 1.5em;
    margin: 2.175em auto;
  }
  .post .date {
    font-size: 0.6875em;
    letter-spacing: 0.1em;
    margin: 6.5em auto -1.35em;
  }
  .post #main > .inner > article > h3 {
    font-size: 1.40625em;
    line-height: 1.4;
    padding-left: 1em;
    padding-right: 1em;
  }
  .post article .content {
    font-size: 87.5%;
    padding: 0 1.9em;
  }
  .post #main > div h3:first-child {
    margin-bottom: 1.25em;
  }
  .share-link {
    margin-top: 3em;
    padding: 1em 0 1.25em;
  }
  .share-link h4 {
    font-size: 0.9375em;
    margin-bottom: 1.5em;
  }
  .share-link ul {
    font-size: 0.625em;
  }
  .share-link ul li a {
    padding: 1.4em 0.75em;
  }
  .share-link .url.table {
    font-size: 60%;
    margin-top: 1.5em;
  }
  .share-link .url input {
    font-size: 104.166%;
    padding: 0.15em 0.5em;
    width: 95.5%;
  }
  #main .related ul li.read-more a {
    padding: 0.675em;
  }
  .related ul li .date {
    font-size: 0.625em;
  }
  .related.articles {
    padding-bottom: 4.6em;
  }
  .related.articles ul li .img {
    padding-top: 87%;
  }
  .related.articles ul li .date {
    margin-bottom: 1.6em;
    margin-top: 1.8em;
  }
  .related.articles ul li h4 {
    font-size: 1.375em;
    margin-bottom: 0.4em;
  }
  .related.articles ul li .subtitle {
    font-size: 0.75em;
    line-height: 1.5;
    margin-bottom: 0;
    margin-top: 0.3em;
    min-height: inherit;
  }
  .related.articles ul > li:nth-child(6) ~ li {
    width: 100%;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li a {
    overflow: hidden;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li a > * {
    text-align: left;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li .img {
    float: left;
    margin-right: 1em;
    padding-top: 7em;
    width: 8em;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li .date {
    margin-top: 0.8em;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li .feature {
    left: 2.125em;
    right: auto;
    transform: scale(0.6);
    transform-origin: top left;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li h4 {
    font-size: 1.1875em;
    overflow: hidden;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li .subtitle {
    overflow: hidden;
  }
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li h4 br,
  .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li .subtitle br {
    display: none;
  }
  .tagcloud {
    font-size: 72%;
    line-height: 1.675;
    text-align: center;
  }
  #instagram h3 + p {
    font-size: 72%;
    letter-spacing: 0.1em;
    margin-top: -0.1em;
  }
  #instagram h3 + p img {
    max-width: 1em;
    vertical-align: top;
  }
  #instagram .feed {
    margin: 2.8em auto;
  }
  #instagram .slick-list {
    font-size: 62%;
  }
  .slick-arrow {
    font-size: 60%;
  }
  .view_all {
    margin: 0 auto -2em;
    top: -1.7em;
  }
  .view_all a {
    display: block;
    margin-left: auto;
    overflow: hidden;
    position: relative;
    right: 7%;
    white-space: nowrap;
    width: 0.83em;
  }
  .view_all a img {
    max-width: none;
    width: 100%;
  }
  .related.news .inner > ul,
  .related.news .inner .slide > ul {
    margin-bottom: 0.3em;
  }
  .related.news .inner .slide > ul li {
    margin: 0.07%;
  }
  .related.news ul li .date {
    margin-bottom: -0.75em;
  }
  .related.news ul li h4 {
    margin-bottom: -3.55em;
  }
  .related.news .slick-arrow {
    margin-top: -7.45em;
  }
  #main .related.news ul li a > * {
    text-align: center;
  }
  .related.news ul li h4 {
    font-size: 0.75em;
  }
  #news #hero .title {
    margin-bottom: 0;
    padding-top: 3.25em;
  }
  #news #hero .title .table {
    height: 8.25em;
  }
  #news #hero .title h3 {
    font-size: 1.5em;
  }
  .category-list ul {
    text-align: center;
  }
  .category-list > ul > li {
    font-size: 0.8125em;
    line-height: 1.75;
  }
  .related.news .category-list > ul {
    margin-top: 3.5em;
    padding: 0 1em;
  }
  .related.news .category-list > ul li ul {
    display: block;
  }
  .category-list ul li li:first-child::before {
    content: none;
  }
  .related.news .inner > ul {
    max-width: 20.6em;
    text-align: left;
  }
  .related.news .inner > ul li {
    margin: 0.65%;
    width: 9.8125em;
  }
  #news .related.news ul li .img {
    padding-top: 75.477%;
  }
  #news.post .date {
    margin-top: 5.5em;
  }
  #news .related.news {
    padding-bottom: 3.75em;
  }
  #news.archive .page-links {
    margin-bottom: -5.5em;
    margin-top: 2em;
  }
  .index-link {
    font-size: 66.7%;
    letter-spacing: 0.1em;
    margin-bottom: 5.5em;
    margin-top: -2.25em;
  }
  .index-link .index img {
    font-size: 150%;
    margin-top: -0.25em;
    vertical-align: bottom;
  }
  #main .magazine div h3 {
    margin-bottom: -0.6em;
    margin-top: 2em;
  }
  .related.magazine ul {
    margin-bottom: 0.3em;
  }
  .related.magazine ul li h4 {
    font-size: 0.75em;
    margin-bottom: -6em;
  }
  .related.magazine .slick-arrow {
    margin-top: -5.6em;
    top: 50%;
  }
  .related.magazine ul li,
  .related.magazine ul li .date {
    text-align: center;
  }
  .related.magazine.archive ul {
    max-width: 330px;
  }
  .related.magazine.archive ul li {
    margin-bottom: 0.45em;
    margin-inline: 1%;
    width: 48%;
  }
  #sticky-news {
    align-items: center;
    border-bottom: 0;
    border-left: 0;
    bottom: 0;
    box-sizing: border-box;
    -moz-column-gap: 8px;
         column-gap: 8px;
    display: flex;
    justify-content: space-between;
    padding: 8px 15px 8px 25px;
    width: 100%;
  }
  #sticky-news h3 {
    flex-shrink: 0;
    font-size: 0.75em;
    line-height: 1.0458333333;
    margin-block: 0;
    text-indent: 0;
    width: 50px;
  }
  #sticky-news .date {
    font-size: 10px;
    /* letter-spacing: 0.075em; */
    margin-block: 0 0.5em;
    /* text-align: left; */
  }
  #sticky-news h4 {
    font-size: 11px;
    font-weight: normal;
    /* letter-spacing: 0.075em; */
    line-height: 1.5;
    margin-block: 0;
  }
  #sticky-news .index {
    border-left: 1px solid #C0C0C0;
    border-top: 0;
    display: block;
    flex-shrink: 0;
    height: 28px;
    /* font-size: 1em;
    letter-spacing: 0.075em;
    line-height: 1; */
    margin-top: 0;
    overflow: hidden;
    padding-left: 20px;
    padding-top: 12px;
    position: relative;
    white-space: nowrap;
    width: 25px;
  }
  #sticky-news .index a {
    aspect-ratio: 1/1;
    display: block;
    pointer-events: none;
    width: 30px;
  }
  #sticky-news .index img {
    margin-right: 0;
    max-width: none;
    pointer-events: auto;
    top: 0;
    width: 15px;
  }
  #home .magazine .slide {
    padding-top: 0.75em;
  }
  #home .magazine .view_all {
    top: -0.5em;
  }
  label.panel-label {
    font-size: 0.9375em;
  }
  ul#tabs-list {
    height: auto;
    margin-top: 2.3em;
  }
  #panels {
    margin-top: 5.15em;
  }
  .projects.related.articles .btn {
    margin-bottom: -0.25em;
    padding-top: 0.5em;
  }
  .stickyStart ul#tabs-list.sticky {
    transform: translateY(3.25em);
  }
  ul#tabs-list.sticky.end {
    transform: translateY(-3em);
  }
  #gmap {
    font-size: 66.6%;
  }
  #about .content {
    font-size: 0.75em;
    line-height: 2.1;
    margin-bottom: 2.75em;
    margin-top: 3.25em;
  }
  #error #hero h3 {
    font-size: 1.75em;
  }
  #error #hero h3 + p {
    font-size: 0.75em;
  }
  #error #hero .catch {
    font-size: 0.8125em;
  }
  #error #footer {
    padding-bottom: 0;
  }
  #home .se-area .slick-list {
    width: 89.5%;
  }
  #home .se-area .wrap {
    padding-block-end: 2em;
  }
  #home .us-area {
    border-bottom: 1px solid #C0C0C0;
    margin-bottom: 2.5em;
    padding-bottom: 2.5em;
    width: 100%;
  }
  #home .us-area::before {
    display: none;
  }
  #home .nt-area {
    width: 100%;
  }
  #home #us-recent .recent-post {
    margin-top: 2em;
  }
  .urban-science #us-recent {
    padding: 3em 0 !important;
  }
  .urban-science .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li h4 {
    align-content: center;
    display: grid;
    height: 5.875em;
    margin-top: 0;
  }
  .urban-science .related.articles:not(.sp-all-normal) ul > li:nth-child(6) ~ li .date {
    margin-top: 0;
  }
  #footer {
    padding-bottom: 2em;
  }
  .sns {
    left: -0.5em;
    margin: 0.75em auto 1.75em;
    position: relative;
  }
  .sns > *,
  .sns ul li {
    vertical-align: middle;
  }
  .sns h3 {
    font-size: 0.625em;
    margin-right: 3.5em;
  }
  .sns h3::after {
    padding-left: 2em;
  }
  .sns a {
    display: inline-block;
    height: 1.333em;
    overflow: hidden;
    white-space: nowrap;
    width: 1.333em;
  }
  .sns a[href*=youtube] {
    margin-left: 0.25em;
    width: 1.8667em;
  }
  .sns ul li {
    margin: 0.2em;
  }
  #pagetop a {
    transform: scale(1.15);
  }
}
@media screen and (max-width: 580px) {
  .wp-caption {
    font-size: 60%;
  }
  #main > .inner > article .content div[id^=attachment] {
    left: inherit !important;
    margin-left: inherit !important;
    width: auto !important;
  }
  #main > .inner > article .content p img[width^="900"] {
    font-size: 69%;
  }
  #main > .inner > article .content .wp-caption-text {
    font-size: 8px;
    line-height: 1.5;
    margin-top: 1em;
  }
}
@media screen and (max-width: 480px) {
  .wp-caption {
    font-size: 50%;
  }
  #main > .inner > article .content p img[width^="900"] {
    font-size: 57%;
  }
  #main > .inner > article .content > .profile tr {
    display: block;
    padding-bottom: 3em;
    padding-top: 3em;
  }
  #main > .inner > article .content > .profile tr > * {
    display: block;
    padding: 0;
    width: 100%;
  }
  #main > .inner > article .content > .profile tr th {
    text-align: center;
  }
  #main > .inner > article .content .profile h5 {
    display: block;
    margin-right: 0;
    text-align: left;
  }
  #main > .inner > article .content .profile h6 {
    text-align: center;
  }
  .related.articles ul li {
    width: 100%;
  }
  .urban-science .related.articles ul li h4 {
    margin-top: 0.85em;
  }
}
@media screen and (max-width: 400px) {
  .wp-caption {
    font-size: 45%;
  }
  #main > .inner > article .content p img[width^="900"] {
    font-size: 50%;
  }
}
@media screen and (max-width: 360px) {
  .wp-caption {
    font-size: 40%;
  }
  #main > .inner > article .content p img[width^="900"] {
    font-size: 52%;
  }
}
@media all and (max-width: 360px) {
  body {
    font-size: 90%;
  }
}
@media screen and (min-width: 481px) and (max-width: 580px) {
  .related.articles:not(.sp-all-normal) ul > li h4 br,
  .related.articles:not(.sp-all-normal) ul > li .subtitle br {
    display: none;
  }
}
@media screen and (min-width: 580px) and (max-width: 760px) {
  #main > .inner > article .content p img[width^="900"] {
    left: inherit;
    margin-left: auto;
    width: auto;
  }
}
@media screen and (min-width: 640px) and (max-width: 820px) {
  #home .related.news h3 {
    font-size: 1.5em;
  }
  .view_all a {
    top: 0.3em;
  }
}
@media screen and (min-width: 640px) and (max-width: 1340px) {
  .view_all a {
    display: block;
    margin-left: auto;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    width: 0.9em;
  }
}
@media screen and (min-width: 641px) and (max-width: 940px) {
  #hero .logo h1 {
    font-size: 1.6em;
    top: 2.65em;
  }
  .scrollStart #hero .logo h1 {
    top: 1.875em;
  }
  #home:not(.scrollStart) #hero .logo h1 {
    top: 4.15em;
  }
  #home #hero .catch {
    position: relative;
    top: 2em;
  }
  #hero .title {
    font-size: 84%;
  }
  #main_visual {
    margin-top: 6em;
  }
  #global .logo h1 {
    transform: scale(0.8);
  }
  #global .inner nav .menu {
    font-size: 80%;
  }
  .related.articles ul li h4 {
    font-size: 1.5em;
  }
}
@media screen and (min-width: 641px) and (max-width: 760px) {
  #main_visual {
    font-size: 117.648%;
  }
}
@media screen and (min-width: 641px) {
  #hero .title,
  #hero .header_img {
    margin-left: 1.875em;
    margin-right: 1.875em;
  }
  .stickyStart body::before,
  .stickyStart #hero .logo h1,
  .stickyStart #current-time,
  .stickyStart #btn_menu {
    transform: translateY(0);
    transition: transform 400ms;
  }
  body::before {
    background-color: #FFF;
    content: "";
    display: block;
    height: 5.0625em;
    position: fixed;
    top: 0;
    transform: translateY(-5.0625em);
    transition: transform 400ms;
    width: 100%;
    z-index: 10;
  }
  .scrollStart::before,
  .scrollStart #hero .logo h1,
  .scrollStart #current-time,
  .scrollStart #btn_menu {
    position: fixed;
    transform: translateY(-5.0625em);
  }
  #switch_global:checked ~ #global #btn_menu {
    position: fixed;
    transform: translateY(0);
  }
  .scrollStart #hero .logo h1 {
    font-size: 1.25em;
    top: 1.5em;
  }
  .scrollStart.stickyStart::before,
  .scrollStart.stickyStart #hero .logo h1,
  .scrollStart.stickyStart #current-time,
  .scrollStart.stickyStart #btn_menu {
    position: fixed;
    transform: translateY(0);
  }
  .view_all {
    padding: 0 1em;
  }
}
@media all and (min-width: 641px) and (max-width: 760px) {
  body {
    font-size: 85%;
  }
}
@media screen and (min-width: 781px) and (max-width: 1120px) {
  .related.articles ul > li h4 br,
  .related.articles ul > li .subtitle br {
    display: none;
  }
}