﻿@charset "utf-8";

/* 基本レイアウト ここから↓ */
@import url(common.css);
body {
	background-color: #fff;
	color: #424749;
	font-size: 87.5%;
	line-height: 1.5;
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
header, nav, #breadcrumb, #contents, footer {
	margin: 0 auto 0 auto;
	width: 840px;
}
header h1 {
	text-align: left;
}
header h1 img {
	width: 400px;
}
nav ul {
	overflow: hidden;
	margin: 0 0 20px 0;
	padding: 0;
	list-style-type: none;
}
nav ul li {
	float: left;
	width: 100px;
}
nav ul li a {
	overflow: hidden;
	padding-top: 44px;
	height: 0;
	text-decoration: none;
}
header{
	background-color:#fff;
	width:840px;
	text-align:center;
	position:sticky;
	top:0;
}
#contents {
	overflow: hidden;
}
.clearfix::after {
	content: " ";
	display: block;
	clear: both;
	font-size: 0;
}
#main {
	display: block;
	float: left;
	width: 590px;
	padding-top: 50px;
}
figure {
	float: left;
}
figure img {
    border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */
    width:  180px;       /* ※縦横を同値に */
    height: 180px;       /* ※縦横を同値に */
}

#sub {
	float: right;
	width: 230px;
}
#twitter img{
	width: 200px;
	text-align: center;
}
footer {
	clear: both;
	padding-top: 70px;
}
#concept #nav_concept a,
#plan #nav_plan a,
#fair #nav_fair a,
#contact #nav_contact a,
nav ul li a:hover {
	background-position: 0 -45px;
}
/* 基本レイアウト ここまで↑ */

/* ページトップへスクロール ここから↓ */
.pagetop{
    display: none;
    position: fixed;
    right: 15px;
    bottom: 60px;
}
.pagetop a{
    display: block;
    font-size: 0;
    width: 50px;
    height: 50px;
    text-align: center;
    background: #698aab;
    line-height: 50px;
}
.pagetop a i{
    font-size: 20px;
    color:#ffffff;
    line-height: 50px;
}
/* ページトップへスクロール ここまで↑ */
.illust #photos img {
	/* Just in case there are inline attributes */
	width: 100% !important;
	height: auto !important;
  }
  @media (max-width: 2000px) {
	 #photos {
	 -moz-column-count:    4;
	 -webkit-column-count: 4;
	 column-count:         4;
	 }
   }
   @media (max-width: 1000px) {
	 #photos {
	 -moz-column-count:    3;
	 -webkit-column-count: 3;
	 column-count:         3;
	 }
   }
   @media (max-width: 800px) {
	 #photos {
	 -moz-column-count:    3;
	 -webkit-column-count: 3;
	 column-count:         3;
	 }
   }
   @media (max-width: 400px) {
	 #photos {
	 -moz-column-count:    3;
	 -webkit-column-count: 3;
	 column-count:         3;
	 }