@charset "utf-8";

/* Base Layout
======================================== */
html,
body {
	font-family: "中ゴシックBBB", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: 200;
	letter-spacing: 0.1em;
	height: 100%;
}
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;
	-webkit-transition: opacity 300ms;
	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: #3e3f3f;
	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;
}

/* Common Layout
======================================== */
html,
body {
  -webkit-overflow-scrolling: touch;
}
body {
	background-color: #f6f6f6;
	color: #3e3f3f;
  font-feature-settings: "palt";
}
.table {
	display: table;
}
.table > * {
	display: table-cell;
	vertical-align: middle;
}
.right {
	float: right;
}
.left {
	float: left;
}
.align-center {
	text-align: center;
}
br.hide,
.hide {
	display: none;
}
.btn {
  clear: both;
}
.btn a {
  background-color: #425f5c;
  box-sizing: border-box;
  color: #f3a6a0;
  display: block;
  font-family: Karla, "中ゴシックBBB", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  margin: auto;
  max-width: 18.75em;
  padding: 1.925em 0.5em;
  text-align: center;
  -webkit-transition: background-color 0.25s, color 0.25s;
  transition: background-color 0.25s, color 0.25s;
}
html[class*='desktop'] .btn a:hover {
  background-color: #f3a6a0;
  color: #425f5c;
}

/* Loader
======================================== */
body.start > * {
  visibility: hidden;
}
body.start #loader {
  visibility: visible;
}
#loader {
	background-color: #fff;
  bottom: 0;
  display: table;
  height: 100%;
  left: 0;
	overflow: hidden;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 100;
}
#loader .inner {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
#loader .logo,
#loader .credit {
	opacity: 0;
}
#loader .logo {
	overflow: hidden;
	position: relative;
}
#loader .logo img {
	position: relative;
	width: 10.6875em;
}
#loader .progress {
	color: transparent;
	margin: 2.25em auto 1.5em;
}
#loader .progress .bar {
	background-color: #425f5c;
	display: inline-block;
	height: 1px;
	width: 0;
}
#loader .credit img {
	height: 0.5em;
	width: 8.125em;
}

/* Header
======================================== */
#header {
  background-color: #fff;
	position: relative;
}
#current-time {
  position: absolute;
  left: 1.8em;
  top: 1.575em;
  z-index: 21;
}
#current-time p {
  color: #425f5c;
  font-family: bebas-neue, sans-serif;
  font-size: 0.875em;
  line-height: 1.1428;
  margin: 0;
  -webkit-transition: color 1200ms;
  transition: color 1200ms;
}
#switch_global:checked ~ #header #current-time p {
	color: #fff;
}
#hero {
  text-align: center;
}
#hero .logo h1 {
  font-size: 2em;
  height: 3.125em;
  left: 49.6%;
  margin: 0;
  margin-left: -5.3125em;
  position: absolute;
  top: 1.325em;
  width: 10.625em;
  z-index: 11;
}
#hero .logo h1 img {
  height: 100%;
  width: 100%;
}
@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;
  }
}
@media screen and ( max-width: 820px ) {
  .scrollStart #hero .logo h1 {
		overflow: hidden;
		height: 2.1em;
  }
	.scrollStart #hero .logo h1 img {
		width: auto;
	}
  .scrollStart #current-time {
    display: none;
  }
}
@media screen and ( max-width: 640px ) {
  #current-time {
    left: 1.5em;
    top: 1.45em;
    font-size: 80%;
  }
  #current-time p {
    letter-spacing: 0.1em;
  }
  #current-time p br {
    display: none;
  }
  #home #current-time {
    display: block;
  }
	.scrollStart .back-home {
    display: none;
  }
  #home:not(.scrollStart) #hero .logo h1 {
    top: 6em;
  }
  #home .scrollStart #hero .logo h1 {
    font-size: 105%;
  }
  #home:not(.scrollStart) #hero .logo {
    background-color: transparent;
    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: 100%;
		top: 0.7em;
  }
}

/* Home Hero
---------------------------------------- */
#home #hero .logo {
	position: absolute;
}
#home:not(.scrollStart) #hero .logo {
	display: none;
}
#main_visual {
  position: relative;
}
#home #main_visual {
	box-sizing: border-box;
	height: 100vh;
	min-height: 30em;
	padding: 4.375em 3.125em 3.125em;
	width: 100%;
}
#home #main_visual .title {
	left: 50%;
	margin-left: -13.125em;
	margin-top: -4.8125em;
	position: absolute;
	top: 50%;
	z-index: 2;
}
#home #main_visual .title h2 {
	margin: auto;
	max-width: 17.5em;
}
#home #main_visual .slide,
#home #main_visual .slide .swiper-container {
	height: 100%;
	width: 100%;
}
#main_visual figure {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}
#main_visual figure img {
	display: none;
}
#main_visual .credit {
	bottom: 0.6em;
	left: 0.75em;
	margin: 0;
	position: absolute;
	z-index: 2;
}
#main_visual .credit small {
	font-size: 10px;
}
#main_visual .credit small img {
	height: 8px;
	vertical-align: bottom;
}
#hero .scroll {
	font-size: 10px;
	bottom: -10em;
	margin-right: -2px;
	position: absolute;
	right: 50%;
	z-index: 3;
}
#hero .scroll a {
	display: block;
	overflow-x: visible;
	overflow-y: hidden;
	padding: 1em 1.1em 11.2em;
	position: relative;
}
#hero .scroll a::before,
#hero .scroll a::after {
	background-color: #425f5c;
	bottom: 0;
	content: "";
	display: block;
	position: absolute;
	right: 1px;
	top: 0;
	width: 1px;
}
#hero .scroll a::after {
	box-sizing: border-box;
	background-color: transparent;
	border-bottom: 5px solid #425f5c;
	-webkit-animation: scroll 4s infinite normal;
	animation: scroll 4s infinite normal;
	right: 0;
	width: 3px;
}
#hero .btn-contact {
	bottom: 0;
	position: fixed;
	right: 0;
	width: 22.125em;
	z-index: 3;
}
#hero .btn-contact a {
	display: block;
	position: relative;
}
#hero .btn-contact a::before {
	background: url(../img/btn_contact01_hover.png) no-repeat center;
	background-size: cover;
	bottom: 0;
	content: "";
	left: 0;
	opacity: 0;
	position: absolute;
	right: 0;
	top: 0;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
}
html[class*='desktop'] #hero .btn-contact a:hover::before {
	opacity: 1;
}
@-webkit-keyframes scroll {
  0% {
    -webkit-transform: translate3d(0,-100%,0);
	}
	15% {
		-webkit-transform: translate3d(0,-98%,0);
	}
	85% {
		-webkit-transform: translate3d(0,98%,0);
	}
	100% {
		-webkit-transform: translate3d(0,100%,0);
	}
}
@keyframes scroll {
  0% {
    transform: translate3d(0,-100%,0);
	}
	15% {
		transform: translate3d(0,-98%,0);
	}
	85% {
		transform: translate3d(0,98%,0);
	}
	100% {
		transform: translate3d(0,100%,0);
	}
}
#hero .scroll img {
	height: 2.8em;
	width: 0.8em;
}
@media screen and ( max-width: 780px ) {
	#hero .btn-contact {
		font-size: 80%;
	}
}
@media screen and ( max-width: 640px ) {
	#home #main_visual {
		padding: 3.28125em 2.34375em 2.34375em;
	}
	#home #main_visual .title,
	#hero .btn-contact {
		font-size: 75%;
	}
	#hero .scroll {
		display: none;
	}
}
@media screen and ( max-width: 380px ) {
	#home #main_visual {
		padding-bottom: 20px;
		padding-left: 20px;
		padding-right: 20px;
	}
	#home #main_visual .title,
	#hero .btn-contact {
		font-size: 70%;
	}
}

/* Global
---------------------------------------- */
input[name^="switch_"] {
	display: none;
}
#btn_menu {
	cursor: pointer;
	display: block;
  height: 1.3125em;
  position: absolute;
	right: 1.875em;
	top: 1.475em;
	-webkit-transition: 0.4s opacity;
	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: #425f5c;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transition: margin-top 400ms;
  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 {
  -webkit-animation: hbgAnime01 400ms linear;
  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 {
  -webkit-animation: none;
  animation: none;
}
html[class*='desktop'] #btn_menu:hover::before {
  -webkit-animation-delay: 250ms;
  animation-delay: 250ms;
}
html[class*='desktop'] #btn_menu:hover span::before {
  -webkit-animation-delay: 100ms;
  animation-delay: 100ms;
}
@-webkit-keyframes hbgAnime01 {
  0% {
    width: 100%;
  }
  40% {
    width: 0;
  }
  60% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@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;
}
@media screen and ( max-width: 640px ) {
  #btn_menu {
    font-size: 80%;
    position: absolute;
    right: 1.55em;
    top: 1.33em;
  }
  .scrollStart #btn_menu {
    position: fixed;
  }
}
#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;
  position: fixed;
  right: -100px;
  top: 0;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
	-webkit-transition: right 0.85s, width 0.85s;
	transition: right 0.85s, width 0.85s;
  width: 0;
}
#switch_global:checked ~ #global .scroll {
	right: 0;
  width: 100%;
}
#global .inner {
	background-color: rgba(83,210,187,0.95);
  color: #FFF;
	display: table;
	height: 100%;
	position: absolute;
	top: 0;
  width: 100%;
	z-index: 10;
}
#global .inner nav {
	display: table-cell;
	padding-bottom: 4em;
	text-align: center;
	vertical-align: middle;
}
#global .logo h1 {
  color: #FFF;
  font-size: 2em;
  height: 2.0625em;
  margin: 3.8em auto 0.75em;
	position: relative;
  width: 5.34375em;
}
#global .logo h1 img {
  height: 100%;
  width: 100%;
}
#global .inner nav .menu li {
	margin: 0 1.5em;
}
#global .inner nav .menu li a {
	color: #FFF;
	font-family: bebas-neue, sans-serif;
	font-size: 3em;
	font-weight: 400;
	letter-spacing: 0.075em;
	line-height: 1;
}
#global .inner nav .menu li a img {
	height: 0.75em;
}
html[class*='desktop'] #global .inner nav .menu li a:hover {
	opacity: 0.6;
}
@media screen and ( min-width: 641px ) and ( max-width: 940px ) {
  #global .logo h1 {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  #global .inner nav .menu {
    font-size: 80%;
  }
}
@media screen and ( max-width: 640px ) {
  #global .logo h1 {
    font-size: 150%;
  }
  #global .inner nav .menu {
    font-size: 60%;
  }
	#global .inner nav .menu li {
		margin: 1.5em;
	}
}
#global .logo,
#global .inner nav .menu li {
  opacity: 0;
  -webkit-transform: translateX(10%);
  transform: translateX(10%);
  -webkit-transition: 1200ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  transition: 1200ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -webkit-transition-property: transform;
  transition-property: transform;
}
#global .logo {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
#global .inner nav .menu li:nth-of-type(1) {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
#global .inner nav .menu li:nth-of-type(2) {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}
#global .inner nav .menu li:nth-of-type(3) {
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
}
#global .inner nav .menu li:nth-of-type(4) {
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
#global .inner nav .menu li:nth-of-type(5) {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}
#global .inner nav .menu li:nth-of-type(6) {
  -webkit-transition-delay: 0.7s;
  transition-delay: 0.7s;
}
#global .inner nav .menu li:nth-of-type(7) {
  -webkit-transition-delay: 0.8s;
  transition-delay: 0.8s;
}
#global .inner nav .menu li:nth-of-type(8) {
  -webkit-transition-delay: 0.9s;
  transition-delay: 0.9s;
}
#global .inner nav .menu li:nth-of-type(9) {
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
}
#switch_global:checked ~ #global .logo,
#switch_global:checked ~ #global .inner nav .menu li {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition-property: opacity, transform;
  transition-property: opacity, transform;
}
@media screen and ( min-width: 641px ) {
  .stickyStart body::before,
  .stickyStart #hero .logo h1,
  .stickyStart #current-time,
  .stickyStart .back-home,
  .stickyStart #btn_menu {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: transform 400ms;
    transition: transform 400ms;
  }
  body::before {
    background-color: #fff;
    content: "";
    display: block;
    height: 4.375em;
    position: fixed;
    top: 0;
    -webkit-transform: translateY(-5.0625em);
    transform: translateY(-5.0625em);
    -webkit-transition: transform 400ms;
    transition: transform 400ms;
    width: 100%;
    z-index: 11;
  }
  .scrollStart::before,
  .scrollStart #hero .logo h1,
  .scrollStart #current-time,
  .scrollStart .back-home,
  .scrollStart #btn_menu {
    -webkit-transform: translateY(-5.0625em);
    transform: translateY(-5.0625em);
    position: fixed;
  }
  #switch_global:checked ~ #global #btn_menu {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    position: fixed;
  }
  .scrollStart #hero .logo h1 {
    font-size: 1em;
		height: 2.4375em;
		overflow: hidden;
		text-indent: 0.75em;
    top: 1.125em;
  }
	.scrollStart #hero .logo h1 img {
		width: auto;
	}
  .scrollStart.stickyStart::before,
  .scrollStart.stickyStart #hero .logo h1,
  .scrollStart.stickyStart #current-time,
  .scrollStart.stickyStart .back-home,
  .scrollStart.stickyStart #btn_menu {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    position: fixed;
  }
}
@media screen and ( max-width: 640px ) {
  .scrollStart #hero .logo,
  .scrollStart #btn_menu {
    -webkit-transform: translateY(-3.25em);
    transform: translateY(-3.25em);
  }
  .stickyStart #hero .logo,
  .stickyStart #btn_menu {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: transform 400ms;
    transition: transform 400ms;
    position: fixed;
  }
  #home #btn_menu {
    position: absolute;
  }
  #switch_global:checked ~ #global #btn_menu,
  #home #switch_global:checked ~ #global #btn_menu,
  #home.scrollStart.stickyStart #btn_menu {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    position: fixed;
  }
}

/* Main
======================================== */
#main > div h3:first-child {
  color: #535454;
  font-family: EB Garamond, sans-serif;
  font-size: 2.25em;
  font-weight: normal;
  letter-spacing: 0.075em;
  margin-bottom: 1.09em;
  margin-top: 2.55em;
  text-align: center;
}
#main .inner {
  margin: 2em auto 0;
}
#main > div[id] {
  padding-bottom: 2.25em;
}
@media screen and ( max-width: 640px ) {
  #main > div[id] {
    padding-bottom: 1.3125em;
  }
  #home #main > div h3:first-child {
		font-size: 2.25em;
  }
}

/* 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;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
}
html[class*='desktop'] #main .related ul li.read-more a:hover {
  background-color: #535454;
}
@media screen and ( max-width: 640px ) {
  #main .related ul li.read-more a {
    padding: 0.675em;
  }
}
.related.articles {
  border-top: 1px solid #3e3f3f;
  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;
  -webkit-transition: background-color 0.5s;
  transition: background-color 0.5s;
}
.related.articles {
  overflow: hidden;
}
.related.articles ul li h4 {
  font-family: EB Garamond, "A1明朝", "游明朝体", 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;
  line-height: 1.714;
  margin: 1.4em auto 0.5em;
  min-height: 3.4em;
}
.related.articles ul li .subtitle p {
  margin: 0;
}
@media screen and ( min-width: 781px ) and ( max-width: 1120px ) {
  .related.articles ul > li h4 br,
  .related.articles ul > li .subtitle br {
    display: none;
  }
}
@media screen and ( min-width: 641px ) and ( max-width: 940px ) {
  .related.articles ul li h4 {
    font-size: 1.5em;
  }
}
@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: 640px ) {
  .related.articles {
    padding-bottom: 4.6em;
  }
  .related.articles ul li .img {
    padding-top: 87%;
  }
  .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;
  }
}
@media screen and ( min-width: 481px ) and ( max-width: 580px ) {
  .related.articles ul > li h4 br,
  .related.articles ul > li .subtitle br {
    display: none;
  }
}
@media screen and ( max-width: 480px ) {
  .related.articles ul li {
    width: 100%;
  }
}

/* Stadium
---------------------------------------- */
.stadium.related .inner > ul {
	margin-bottom: 0.75em;
}
.stadium.related .inner > ul::after {
	content: "";
	clear: both;
	display: block;
}
.stadium.related .inner > ul li {
	margin-bottom: 7.5em;
}
.stadium.related ul li .img {
  padding-top: 70%;
}
.stadium.related.articles ul li h4 {
	font-family: EB Garamond, "A1明朝", "游明朝体", YuMincho, 'Yu Mincho', "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
	font-size: 1.875em;
	margin: 1em auto 0.75em;
}
.stadium h4 .number {
	display: inline-block;
  font-family: bebas-neue, sans-serif;
	font-size: 2em;
	margin-right: 0.25em;
	position: relative;
	top: 0.05em;
	vertical-align: sub;
}
.stadium.related ul li a {
	color: #3e3f3f;
}
.stadium .rate dl {
	clear: right;
	float: left;
	font-size: 0.875em;
	overflow: hidden;
	width: 50%;
}
.stadium .rate > dl {
	box-sizing: border-box;
	margin: 0.15em auto;
	padding: 0 5%;
}
.stadium .rate > dl:nth-child(odd) {
	padding-right: 3%;
	width: 43.5%;
}
.stadium .rate > dl:nth-child(even) {
	padding-left: 3%;
	width: 56.5%;
}
.stadium .rate dl > * {
	float: left;
	text-align: left;
	width: 50%;
}
.stadium .rate dl dd {
	width: 30%;
}
.stadium .rate dl.type dd {
    word-break: break-all;
    max-width: 11em;
}
.stadium .rate dl dt {
  font-family: Karla, sans-serif;
	word-break: break-all;
	width: 70%;
}
/* retetype02 */
.stadium .rate.type02 > dl:nth-child(odd) {
	padding-right: 0;
	width: 53.5%;
}
.stadium .rate.type02 > dl:nth-child(even) {
	padding-left: 0;
	width: 46.5%;
}
.stadium .rate.type02 .rate_publicorder dt,
.stadium .rate.type02 .rate_happypeople dt,
.stadium .rate.type02 .rate_accomodationa dt {
	letter-spacing: 0.075em;
}
/* END retetype02 */
/* retetype03 */
.stadium .rate.type03 > dl:nth-child(odd) {
	padding-right: 0;
	width: 58.5%;
}
.stadium .rate.type03 > dl:nth-child(even) {
	padding-left: 0;
	width: 41.5%;
}
/* END retetype03 */
/* retetype05 */
.stadium .rate.type05 .rate_basketballpark dt {
	letter-spacing: 0.06em;
}
/* END retetype05 */
.stadium .rate .info {
	clear: both;
	padding-top: 1.5em;
}
.stadium .rate .info dl,
.stadium .rate .info dl > * {
	width: auto;
}
.stadium .rate .info .country {
	text-align: center;
	width: 43%;
}
.stadium .rate .info .country > * {
	display: inline-block;
	float: none;
}
.stadium .rate .info .country dd {
	font-size: 1.8em;
	vertical-align: middle;
}
.stadium .rate .info .type > *::before {
	content: "";
	display: inline-block;
	font-size: 1.8em;
	height: 1.2em;
	margin-right: 0.15em;
	vertical-align: middle;
}
.related.articles .sort {
	margin: 4.8em auto 4em;
}
.related.articles .sort ul {
    display: none;/**************************/
	text-align: center;
}
.related.articles .sort ul li {
	display: inline-block;
	float: none;
	width: auto;
}
.related.articles .sort > ul > li {
	margin-left: 2em;
	margin-right: 2em;
}
.related.articles .sort ul li span {
	color: #425f5c;
	cursor: pointer;
  font-family: Karla, sans-serif;
	font-size: 1.125em;
	font-weight: bold;
}
.related.articles .sort ul li span::after {
	background: url(../img/arrow02.png) no-repeat center;
	background-size: cover;
	content: "";
	display: inline-block;
	height: 0.6667em;
	margin-left: 0.5em;
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
	width: 0.6667em;
}
.related.articles .sort ul li span.active::after {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}
.related.articles .sort ul li a {
	border: 1px solid transparent;
  font-family: Karla, sans-serif;
	line-height: 1;
	margin: 0.25em;
	opacity: 0.6;
	padding: 3px;
  -webkit-transition: opacity 300ms;
  transition: opacity 300ms;
	white-space: nowrap;
}
.related.articles .sort ul li a:hover {
	opacity: 0.75;
}
.related.articles .sort ul li a::after {
	background-color: #000;
	content: "";
	display: block;
	height: 1px;
  -webkit-transition: width 300ms;
  transition: width 300ms;
	width: 0;
}
.related.articles .sort ul li a:hover::after {
	width: 100%;
}
.related.articles .sort ul li.sort_country a {
	opacity: 1;
  -webkit-transition: border-color 300ms;
  transition: border-color 300ms;
}
.related.articles .sort ul li.sort_country a:hover {
	border-color: rgba(0,0,0,0.6);
}
.related.articles .sort ul li.sort_country a::after {
	display: none;
}
.related.articles .sort ul li ul {
	font-size: 0.875em;
	height: 0;
	margin-left: -0.5em;
	margin-top: 0.3em;
	max-width: none;
	opacity: 0;
	overflow: hidden;
	padding: 0;
	position: absolute;
	-webkit-transition: 0.5s opacity;
	transition: 0.5s opacity;
}
.related.articles .sort ul li span.active + ul {
	height: auto;
	opacity: 1;
}
.post .stadium.related .inner > ul li {
	margin-bottom: 3.75em;
}
.post .stadium.related.articles {
	padding-bottom: 0;
}
@media screen and ( max-width: 1340px ) {
	.stadium.related.articles ul li h4 {
		margin-top: 0.5em;
	}
	.stadium h4 .number {
		display: block;
		margin-right: 0;
	}
	.stadium .rate > dl {
		padding: 0;
	}
	.stadium .rate > dl:nth-child(odd) {
		width: 42.5%;
	}
	.stadium .rate > dl:nth-child(even) {
		width: 57.5%;
	}
	.stadium .rate .info .country {
		width: 38%;
	}
}
@media screen and ( max-width: 1180px ) {
	.stadium .rate dl {
		font-size: 0.75em;
	}
	.stadium .rate .info dl {
		margin: auto;
	}
}
@media screen and ( min-width: 781px ) and ( max-width: 1040px ) {
	.stadium .rate dl {
		font-size: 0.875em;
	}
}
@media screen and ( min-width: 481px ) and ( max-width: 640px ), screen and ( min-width: 781px ) and ( max-width: 1040px ) {
	.stadium .rate {
		margin-left: auto;
		margin-right: auto;
		max-width:13.75em;
	}
	#main .stadium .rate > dl {
		float: none;
		padding: 0;
		width: 100%;
	}
	#main .stadium .rate > dl:nth-child(odd),
	#main .stadium .rate > dl:nth-child(even) {
		padding: 0;
		width: 100%;
	}
	#main .stadium .rate > dl:nth-child(odd) dt,
	#main .stadium .rate > dl:nth-child(even) dt {
		width: 70%;
	}
	#main .stadium .rate > dl:nth-child(odd) dd,
	#main .stadium .rate > dl:nth-child(even) dd {
		width: 30%;
	}
	.stadium .rate > dl dd {
		text-align: right;
	}
	.stadium .rate .info {
		padding-top: 0.5em;
	}
	.stadium .rate .info .country {
		text-align: left;
		width: 100%;
	}
	.stadium .rate .info .type > *:first-child::before {
		margin-right: 0;
	}
}
@media screen and ( max-width: 640px ) {
	.stadium.related .inner > ul li {
		margin-bottom: 2.5em;
	}
	.related.articles .sort {
		margin: 2.8em auto 2em;
	}
	.related.articles .sort ul {
		text-align: left;
	}
	.related.articles .sort > ul > li {
		display: block;
		margin-top: 0.5em;
	}
	.related.articles .sort ul li ul {
		position: relative;
	}
	.related.articles .sort ul li ul li {
		margin-bottom: 0;
	}
}

/* Banner Link
---------------------------------------- */
.stadium .bnr_link {
	margin-top: -2.5em;
}
.bnr_link {
	background-color: #e2dcd6;
}
.bnr_link > * {
	margin: auto;
	padding: 1.9em 2%;
}
.bnr_link a {
	background-color: #53d2bb;
	box-sizing: border-box;
	display: block;
	margin: auto;
	max-width: 62.5em;
	padding: 3.375em 3%;
	position: relative;
	text-align: center;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.bnr_link a::after {
	background: url(../img/arrow01.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 0.75em;
	margin-top: -0.375em;
	position: absolute;
	right: 6%;
	top: 50%;
	width: 1.375em;
}
.bnr_link a:hover {
	background-color: #667372;
}
.bnr_link a span {
	display: block;
	margin: auto;
	max-width: 41.875em;
}
.bnr_link a img {
	position: relative;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
}
.bnr_link .sm a {
	background-color: #f3a6a0;
	padding-bottom: 1.2875em;
	padding-top: 2.0875em;
}
.bnr_link .sm a:hover {
	background-color: #425f5c;
}
.bnr_link a[target="_blank"]::before,
.bnr_link a[target="_blank"]::after {
	background: url(../img/icon_blank01.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 1.4375em;
	margin-top: 0;
	position: absolute;
	right: 0.625em;
	top: 0.8125em;
  -webkit-transition: opacity 0.25s;
  transition: opacity 0.25s;
	width: 1.5625em;
}
.bnr_link a[target="_blank"]::after {
	background-image: url(../img/icon_blank01_hover.png);
	opacity: 0;
}
.bnr_link a[target="_blank"]:hover::after {
	opacity: 1;
}
.bnr_link .sm a span {
	background: url(../img/stadium-michelin_logo01_hover.png) no-repeat center;
	background-size: contain;
	text-indent: 1px;
}
.bnr_link .sm a img {
	max-width: 20.4375em;
}
.bnr_link .sm a:hover img {
	opacity: 0;
}
@media screen and ( max-width: 880px ) {
	.bnr_link a::after {
		right: 50%;
		top: 80%;
	}
}
@media screen and ( max-width: 640px ) {
	.stadium .bnr_link {
		margin-top: -1em;
	}
	.bnr_link > * {
		padding-bottom: 0;
	}
	.bnr_link .sm a span {
		font-size: 90%;
	}
	.bnr_link a[target="_blank"]::before,
	.bnr_link a[target="_blank"]::after {
		font-size: 80%;
	}
}
@media screen and ( max-width: 480px ) {
	.bnr_link a {
		padding-bottom: 3em;
		padding-top: 3em;
	}
	.bnr_link a::after {
		font-size: 75%;
	}
	.bnr_link .sm a span {
		font-size: 70%;
	}
}

/* Home
---------------------------------------- */
#home .stadium.related {
	padding-bottom: 10.625em;
}
#home .related.articles {
  border-top: none;
}
#home .related.articles .inner > h4 {
  display: none;
}
#home #main > div[id] {
	position: relative;
}
#home #main > div[id]:not(:first-child)::before {
	background-color: #425f5c;
	content: "";
	display: block;
	height: 9.375em;
	position: absolute;
	right: calc(50% - 1px);
	top: -50px;
	width: 1px;
}
#home #contents {
	background-color: #e2dcd6;
  padding-bottom: 0;
}
#home #contents h3 {
	font-size: 3em;
	margin: 0 auto 1.45em;
	max-width: 14.7917em;
	padding-top: 4.15em;
}
#home #contents h3 .sp {
	display: none;
}
#home #contents .content {
	letter-spacing: 0;
  line-height: 2.142;
  margin: 4em auto -2em;
	padding: 0 4%;
  text-align: center;
}
#home #contents .content h4 {
  font-size: 1.5em;
	line-height: 1.75;
  margin: 0.5em auto;
}
#home #contents .content p {
  font-size: 0.875em;
	margin: 1.5em auto;
}
@media screen and ( max-width: 640px ) {
	#home .stadium.related {
		padding-bottom: 8em;
	}
	#home #contents h3 {
		max-width: 6.6111em;
	}
	#home #contents h3 .sp {
		display: inline-block;
	}
	#home #contents h3 .sp + img {
		display: none;
	}
	#home #contents .content h4 {
		font-size: 1.3125em;
	}
	#home #contents .content br.hide {
		display: inherit;
	}
}
@media screen and ( max-width: 360px ) {
	#home #contents .content h4 {
		font-size: 1.25em;
	}
}

/* Related Hover
---------------------------------------- */
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%;
  -webkit-transition-property: height, width;
  transition-property: height, width;
  -webkit-transition-duration: 0.7s;
  transition-duration: 0.7s;
  width: 0;
  z-index: 3;
}
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'] .related ul li a:hover .img span::before,
html[class*='desktop'] .related ul li .img a:hover span::before {
  width: 70px;
}
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'] .related ul li a:hover .img span::after,
html[class*='desktop'] .related ul li .img a:hover span::after {
  height: 70px;
}
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: -1.25em;
  content: "";
  display: block;
  left: -1.25em;
  position: absolute;
  right: -1.25em;
  top: -1.25em;
  -webkit-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.7s;
  transition-duration: 0.7s;
  z-index: 2;
}
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);
}

/* About
---------------------------------------- */
#main #about {
	background-color: #f6f6f6;
	overflow: hidden;
	padding-bottom: 0;
}
#main #about article {
	padding: 0 4%;
}
#main #about h3 {
	font-size: 3em;
	margin: 4.15em auto 1.45em;
	max-width: 7.125em;
}
#about .content {
	letter-spacing: 0;
  line-height: 2.142;
  margin: 4em auto 12em;
  text-align: center;
}
#about .content h4 {
  font-size: 1.5em;
	line-height: 1.75;
  margin: 0.5em auto;
}
#about .content p {
  font-size: 0.875em;
	margin: 1.5em auto;
}
@media screen and ( max-width: 640px ) {
	#about .content {
		margin: 4em auto 8em;
	}
	#about .content h4 {
		font-size: 1.3125em;
	}
	#about br.hide {
		display: inherit;
	}
}
@media screen and ( max-width: 360px ) {
	#about .content h4 {
		font-size: 1.25em;
	}
}

/* Works
---------------------------------------- */
#main #works {
	background-color: #f6f6f6;
	padding-bottom: 16.5em;
}
#main #works h3 {
	font-size: 3em;
	margin: 0 auto 1.45em;
	max-width: 3.5625em;
	padding-top: 4.15em;
}
#works .articles ul {
	box-sizing: border-box;
	margin: auto;
	margin-top: -0.1875em;
	max-width: 85em;
	padding: 5px;
	overflow: hidden;
}
#works .articles ul li {
	box-sizing: border-box;
	float: left;
	padding: 5px;
	position: relative;
	width: 33.333%;
}
#works .articles ul li.no-link {
	float: none;
	width: 100%;
}
#works .articles ul li .img {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
#works .articles ul li .img figure {
	padding-top: 100%;
}
#works .articles ul li .img figure::before {
	background-color: #000;
	bottom: 0;
	content: "";
	left: 0;
	opacity: 0.5;
	position: absolute;
	right: 0;
	top: 0;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
html[class*='desktop'] #works .articles ul li a:hover .img figure::before {
	opacity: 0.25;
}
#works .articles ul li.no-link .img figure {
	padding-top: 26.8657%;
}
#works .articles ul li .img figure img {
	display: none;
}
#works .articles ul li .inner {
	bottom: 0;
	left: 0;
	margin: auto;
	padding: 0 2em;
	position: absolute;
	right: 0;
	top: 0;
}
#works .articles ul li a .inner::after {
	background: url(../img/icon_blank02.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 1.1875em;
	margin-top: 0;
	position: absolute;
	right: 1.625em;
	top: 1.5625em;
	width: 1.3125em;
}
#works .articles ul li .inner .table {
	display: table;
	height: 100%;
	width: 100%;
}
#works .articles ul li .inner .table > * {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
#works .articles ul li .inner .table > * > * {
	color: #fff;
}
#works .articles ul li h4 {
	font-family: EB Garamond, "A1明朝", "游明朝体", YuMincho, 'Yu Mincho', "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", "serif";
	font-size: 3.125em;
	font-weight: 200;
	letter-spacing: 0.025em;
	line-height: 1.16;
	margin: 0.25em auto;
}
#works .articles ul li h4 small {
	font-size: 60%;
	display: block;
}
#works .articles ul li p {
	font-size: 0.875em;
	letter-spacing: 0.075em;
	line-height: 1.7143;
}
#works .articles ul li.no-link p {
	margin: 1em auto;
	max-width: 48em;
}
#main #works .other > h4 {
	font-size: 1.5em;
	margin: 5.8em auto 3em;
	max-width: 12.5em;
	text-align: center;
}
#works .articles .other ul {
	letter-spacing: -0.4em;
	text-align: center;
}
#works .articles .other ul li {
	display: inline-block;
	float: none;
	letter-spacing: normal;
}
#works .articles .other ul li .img figure {
	padding-top: 48.8636%;
}
#works .articles .other ul li .img figure::before {
	display: none;
}
#works .articles .other ul li h4 {
	display: none;
}
#works .articles .other ul li a {
	display: block;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
html[class*='desktop'] #works .articles .other ul li a:hover {
	opacity: 0.5;
}
#works .articles .other ul li a::after {
	background: url(../img/icon_blank03.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 1.1875em;
	margin-top: 0;
	position: absolute;
	right: 1.625em;
	top: 1.5625em;
	width: 1.3125em;
}
@media screen and ( max-width: 1180px ) {
	#works .articles ul li.no-link .img figure {
		padding-top: 34%;
	}
	#works .articles ul li h4 {
		font-size: 2.75em;
	}
}
@media screen and ( max-width: 980px ) {
	#works .articles ul li {
		font-size: 90%;
	}
	#works .articles ul li.no-link .img figure {
		padding-top: 38%;
	}
}
@media screen and ( max-width: 780px ) {
	#works .articles ul li {
		width: 50%;
	}
	#works .articles ul li.no-link .img figure {
		padding-top: 46%;
	}
}
@media screen and ( max-width: 640px ) {
	#main #works {
		padding-bottom: 10em;
	}
	#main #works h3 span {
		display: block;
		padding: 0 0.5em;
	}
	#works .articles ul li {
		font-size: 82%;
	}
	#works .articles ul li.no-link .img figure {
		padding-top: 62%;
	}
	#main #works .other > h4 {
		margin: 3.5em auto 2em;
	}
}
@media screen and ( max-width: 560px ) {
	#works .articles ul li.no-link .img figure {
		padding-top: 70%;
	}
}
@media screen and ( max-width: 480px ) {
	#works .articles ul li {
		width: 100%;
	}
	#works .articles ul li h4 {
		font-size: 2.5em;
	}
	#works .articles ul li.no-link .inner {
		padding: 0;
	}
	#works .articles ul li.no-link .img figure {
		padding-top: 100%;
	}
	#works .articles ul li.no-link h4 {
		padding: 0 0.5em;
	}
	#works .articles ul li.no-link p {
		padding: 0 2em;
	}
}
@media screen and ( max-width: 400px ) {
	#works .articles ul li.no-link .img figure {
		padding-top: 135%;
	}
}

/* News
---------------------------------------- */
#main #news {
	background-color: #fff;
	padding-bottom: 9.5em;
}
#main #news h3 {
	font-size: 3em;
	margin: 0 auto 1.45em;
	max-width: 9.375em;
	padding-top: 4.15em;
}
.facebook-feed {
	margin: auto;
	margin-top: -0.1875em;
	max-width: 63.75em;
}
.facebook-feed .feed-item {
	background-color: rgba(246,246,246,0.6);
	box-sizing: border-box;
	float: left;
	margin: 10px 10px 16px;
	padding: 20px;
	width: calc(50% - 20px);
}
.facebook-feed .feed-item a {
	display: block;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
html[class*='desktop'] .facebook-feed .feed-item a:hover {
	opacity: 0.6;
}
.facebook-feed .feed-item time {
	display: block;
  font-family: bebas-neue, sans-serif;
	font-size: 1.125em;
	letter-spacing: 0.025em;
	margin: 1.5em auto 0.5em;
	text-align: center;
}
.facebook-feed .feed-item p {
	font-size: 0.875em;
	letter-spacing: 0.2em;
	line-height: 2.1429;
	margin: 0.75em auto;
	padding: 0 0.75em;
}
.btn_link > * {
	margin: auto;
	padding: 0 15px;
}
.btn_link a {
	background-color: #53d2bb;
	box-sizing: border-box;
	display: block;
	margin: auto;
	max-width: 62.5em;
	padding: 1.359em 3%;
	position: relative;
	text-align: center;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.btn_link a::after {
	background: url(../img/arrow01.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 0.75em;
	margin-top: -0.375em;
	position: absolute;
	right: 4.25%;
	top: 50%;
	-webkit-transform: scale(0.6) rotate(-90deg);
	transform: scale(0.6) rotate(-90deg);
	width: 1.375em;
}
.btn_link a:hover {
	background-color: #667372;
}
.btn_link a img {
	max-width: 6.8125em;
}
#news .btn_link {
	margin: 3em auto;
}
@media screen and ( max-width: 640px ) {
	#main #news {
		padding-bottom: 8em;
	}
	.facebook-feed .feed-item {
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}
}
@media screen and ( max-width: 480px ) {
	.facebook-feed .feed-item p {
		font-size: 0.7635em;
		line-height: 1.95;
	}
}
@media screen and ( max-width: 360px ) {
	#main #news h3 {
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	.facebook-feed .feed-item p {
		padding: 0;
	}
}

/* Lectures
---------------------------------------- */
#main #lectures {
	background-color: #f6f6f6;
	padding: 0 5%;
	padding-bottom: 9.5em;
}
#main #lectures h3 {
	font-size: 3em;
	margin: 0 auto 1.45em;
	max-width: 5.1042em;
	padding-top: 4.15em;
}
#main #lectures ul {
	margin: 3em auto;
	max-width: 62.5em;
}
#main #lectures ul li {
	margin: 0.75em auto;
	overflow: hidden;
	position: relative;
}
#main #lectures ul li time,
#main #lectures ul li h4 {
	display: inline-block;
	font-size: 0.875em;
	font-weight: normal;
	letter-spacing: 0.075em;
	margin: auto;
	vertical-align: top;
}
#main #lectures ul li time {
	margin-right: 2em;
}
#main #lectures ul li h4 {
	max-width: 87%;
}
#main #lectures .btn a {
	background-color: #b0c2c1;
	border-radius: 2.8125em;
	color: #fff;
	max-width: 12.5em;
	padding: 0.83125em 0.5em;
	position: relative;
}
#main #lectures .btn a:hover {
	background-color: #667372;
}
#main #lectures .btn a::after {
	background: url(../img/arrow01.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 0.75em;
	margin-top: -0.375em;
	position: absolute;
	right: 12%;
	top: 50%;
	-webkit-transform: scale(0.4);
	transform: scale(0.4);
	width: 1.375em;
}
#main #lectures .btn a img {
	max-width: 3.5625em;
	vertical-align: baseline;
}
@media screen and ( max-width: 1080px ) {
	#main #lectures ul li {
		margin: 0.825em auto;
		line-height: 1.5;
		text-align: center;
	}
	#main #lectures ul li time {
		display: block;
		margin-right: auto;
	}
	#main #lectures ul li h4 {
		max-width: none;
	}
}
@media screen and ( max-width: 640px ) {
	#main #lectures {
		padding-bottom: 8em;
	}
	#main #lectures .btn a {
		font-size: 105%;
	}
}

/* Books
---------------------------------------- */
#main #books {
	background-color: #fff;
	padding-bottom: 9.5em;
}
#main #books .articles {
	padding: 0 5px;
}
#main #books h3 {
	font-size: 3em;
	margin: 0 auto 1.45em;
	max-width: 3.25em;
	padding-top: 4.15em;
}
#main #books ul {
	margin: auto;
	max-width: 56.25em;
	overflow: hidden;
}
#main #books ul li {
	float: left;
	margin: 5px;
	width: calc(50% - 10px);
}
#main #books ul li > * {
	background-color: #f6f6f6;
	display: block;
	overflow: hidden;
	padding: 3.3125em 2em 1.5em;
}
#main #books ul li a {
	display: block;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
html[class*='desktop'] #main #books ul li a:hover {
	opacity: 0.6;
}
#main #books ul li figure {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	margin: auto;
	max-width: 13.625em;
}
#main #books ul li figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}
#main #books ul li figure img {
	display: none;
}
#main #books ul li .content {
	letter-spacing: 0.025em;
	min-height: 8em;
	text-align: center;
}
#main #books ul li .content h4 {
	font-size: 1.25em;
	line-height: 1.2;
	margin-top: 0.75em;
	margin-bottom: -0.25em;
}
#main #books ul li .content h4 + * {
	font-size: 0.875em;
	line-height: 1.7143;
	margin: 0.5em auto;
}
@media screen and ( max-width: 640px ) {
	#main #books ul li > * {
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	#main #books ul li .content h4 {
		font-size: 1.125em;
	}
}
@media screen and ( max-width: 480px ) {
	#main #books ul li {
		width: calc(100% - 10px);
	}
}

/* Profile
---------------------------------------- */
#main #profile {
	background-color: #f6f6f6;
	padding-bottom: 8em;
}
#main #profile article {
	padding: 0 5%;
}
#main #profile h3 {
	font-size: 3em;
	margin: 0 auto 1.6em;
	max-width: 4.0625em;
	padding-top: 4.15em;
}
#profile .inner {
	margin: 3em auto;
	max-width: 62.5em;
	overflow: hidden;
}
#profile .inner figure {
	float: left;
	margin-right: 2em;
	max-width: 21.5em;
}
#profile .inner .content {
	margin-left: auto;
	max-width: 37.875em;
	overflow: hidden;
}
#profile .inner .content h4 {
	font-size: 1.125em;
	letter-spacing: 0.005em;
	line-height: 1.25;
	margin: 0 auto 0.75em;
}
#profile .inner .content p {
	font-size: 0.875em;
	letter-spacing: 0.005em;
	line-height: 2.1429;
}
@media screen and ( max-width: 880px ) {
	#profile .inner figure {
		float: none;
		margin-bottom: 3em;
		margin-left: auto;
		margin-right: auto;
		max-width: 21.5em;
	}
	#profile .inner .content {
		margin-right: auto;
		max-width: 37.875em;
	}
	#profile .inner .content h4 {
		font-size: 1.25em;
		margin-bottom: 2em;
		text-align: center;
	}
}
@media screen and ( max-width: 880px ) {
	#profile .inner {
		margin-bottom: 0;
	}
}
@media screen and ( max-width: 480px ) {
	#profile .inner .content p {
		font-size: 0.825em;
		line-height: 2;
	}
}

/* Contact
---------------------------------------- */
#main #contact {
	background-color: #fff;
	padding-bottom: 6.5em;
}
#main #contact h3 {
	font-size: 3em;
	margin: 0 auto 2em;
	max-width: 6.2709em;
	padding-top: 4.15em;
}
#contact .inner {
	margin: 3em auto;
	max-width: 62.5em;
	overflow: hidden;
	padding: 0 5%;
}
form dl {
	border-top: 1px solid #000;
	margin: auto;
}
form dl dt,
form dl dd {
	font-size: 0.875em;
	margin: 0;
}
form dl.col-2 {
	box-sizing: border-box;
	float: left;
	width: 50%;
}
form dl dt label {
	display: block;
  font-family: bebas-neue, sans-serif;
	letter-spacing: 0.1em;
	padding: 0.75em;
}
form .email {
	border-left: 1px solid #000;
}
form .title {
	clear: both;
}
form .message {
	border-bottom: 1px solid #000;
}
form input,
form textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: none;
	border: none;
	border-radius: 0;
	box-shadow: none;
	box-sizing: border-box;
	letter-spacing: 0.082em;
	line-height: 1.5;
	outline: none;
	padding: 0.75em 0;
	-webkit-transition: border-color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
	transition: border-color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
	width: 100%;
}
form input:focus,
form textarea:focus {
  background-color: rgba(0,0,0,0.02);
}
form input,
form textarea {
	padding: 1.1785em 0.75em;
}
form textarea {
	height: 8.75em;
	overflow: auto;
  resize: vertical;
}
button,
[type="button"],
[type="date"],
[type="datetime"],
[type="datetime-local"],
[type="email"],
[type="month"],
[type="number"],
[type="password"],
[type="reset"],
[type="search"],
[type="submit"],
[type="tel"],
[type="text"],
[type="time"],
[type="url"],
[type="week"],
select,
textarea {
   min-height: 1.5em;
}
.btn.submit .wpcf7-submit {
	background: url(../img/btn_submit01.png) no-repeat center #53d2bb;
	background-size: 35.25em 3.8125em;
	color: transparent;
	cursor: pointer;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.btn.submit .wpcf7-submit:hover {
	background-color: #667372;
}
.btn.submit {
	margin: 3em auto;
	position: relative;
}
.btn.submit::after {
	background: url(../img/arrow01.png) no-repeat center;
	background-size: cover;
	content: "";
	height: 0.75em;
	margin-top: -0.375em;
	position: absolute;
	right: 6.25%;
	top: 50%;
	-webkit-transform: scale(0.6) rotate(-90deg);
	transform: scale(0.6) rotate(-90deg);
	width: 1.375em;
}
#main .ajax-loader {
	background: url('../img/ajax-loader.gif') no-repeat center;
	background-size: cover;
	border: none;
	display: inline-block;
	height: 16px;
	margin: 0 -20px 0 4px;
	padding: 0;
	vertical-align: middle;
	visibility: hidden;
	width: 16px;
}
#main .ajax-loader.is-active,
#main .transmit + .ajax-loader {
	visibility: visible;
}
#contact .wpcf7-response-output {
	font-size: 0.8125em;
	margin: 2em 0 1em;
	padding: 1.75em 2em;
}
#main .wpcf7-validation-errors,
#main .wpcf7-acceptance-missing {
	border-color: #ff4e4e;
}
#contact span.wpcf7-not-valid-tip {
	font-size: 0.875em;
	padding: 0.75em;
}
@media screen and ( min-width: 761px ) and ( max-width: 840px ) {
	.btn.submit .wpcf7-submit {
		background-image: url(../img/btn_submit01_sp.png);
		background-size: 17.625em 3.3125em;
		padding: 2.357em 0.75em;
	}
}
@media screen and ( max-width: 700px ) {
	.btn.submit .wpcf7-submit {
		background-image: url(../img/btn_submit01_sp.png);
		background-size: 17.625em 3.3125em;
		padding: 2.357em 0.75em;
	}
}
@media screen and ( max-width: 640px ) {
	form dl.col-2 {
		float: none;
		width: 100%;
	}
	form .email {
		border-left: none;
	}
	form input,
	form textarea {
		padding: 0.75em;
	}
}
@media screen and ( max-width: 480px ) {
	.btn.submit .wpcf7-submit {
		background-size: 14.1em 2.65em;
		padding: 1.8856em 0.75em;
	}
}
@media screen and ( max-width: 360px ) {
	.btn.submit::after {
		right: 4.5%;
	}
}

/* 404
---------------------------------------- */
#error:not(.scrollStart) #hero .logo {
  display: none;
}
#error #hero .title {
	padding-top: 2em;
}
#error #hero .title .table {
  height: auto;
  position: relative;
	text-align: center;
  top: inherit;
	width: 100%;
}
#error #hero .title h2 {
	color: #425f5c;
	font-size: 2em;
	height: 2.0625em;
	margin: 3.8em auto 1.5em;
	position: relative;
	width: 5.34375em;
}
#hero .title h3 {
	font-family: "EB Garamond", serif;
	font-size: 3.75em;
	font-weight: normal;
	letter-spacing: 0.05em;
}
#hero .title h3 .number {
	font-family: bebas-neue, sans-serif;
	font-size: 2.4667em;
	font-weight: 200;
	display: inline-block;
	margin-bottom: -0.025em;
	margin-top: -0.35em;
}
#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: 2.5em auto 6.5em;
}
@media screen and ( max-width: 640px ) {
	#error #hero .title h2 {
		margin-top: 2em;
	}
	#error #hero .catch {
		font-size: 75%;
	}
  #error #hero h3 {
    font-size: 2em;
  }
  #error #hero h3 + p {
    font-size: 0.75em;
  }
}

/* Footer
======================================== */
#footer {
	background-color: #f6f6f6;
  padding-top: 9.375em;
	padding-bottom: 13em;
  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;
}
html[class*='desktop'] .sns a {
  -webkit-transition: opacity 300ms;
  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;
  -webkit-transition: opacity 0.25s;
  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: bebas-neue, sans-serif;
  font-size: 10px;
  left: 1.05em;
  margin-top: -8.75em;
  position: absolute;
  top: 50%;
	z-index: 10;
}
#copyright small {
  font-size: 1em;
}
#copyright img {
  height: 17.5em;
  width: 0.75em;
}
@media screen and ( max-width: 940px ) {
  #copyright {
    background: url(../img/copyright02.png) no-repeat center;
    background-size: contain;
    height: 0.8em;
    margin: 6em auto;
    position: relative;
    left: inherit;
    top: inherit;
    width: 22.5em;
  }
	#copyright a {
		display: block;
    height: 0.8em;
	}
  #copyright img {
    display: none;
  }
}
@media screen and ( max-width: 640px ) {
  #footer {
    padding-bottom: 9em;
  }
  .sns {
    margin: 0.75em auto 1.75em;
    position: relative;
    left: -0.5em;
  }
  .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 ul li {
    margin: 0.2em;
  }
  #pagetop a {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
  }
}

/* Media Query
======================================== */
@media all and ( min-width: 641px ) and ( max-width: 760px ) {
	body {
		font-size: 85%;
	}
}
@media all and ( max-width: 360px ) {
	body {
		font-size: 90%;
	}
}