@charset "UTF-8";

/*初期化*/
html {
	font-size: 12px;
	line-height: 1.6;
	font-family: 'Lato', 'Gothic Medium BBB', sans-serif;
	color: #333333;
	overflow-x: hidden;
	background-color: #fff;
	box-sizing: border-box;
}
body {
	margin-top: 0;
}
a {
	color: #000;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
ul {
	list-style-type: none;
	padding-left: 0;
}
ul.dots_list {
	list-style-type: disc;
	padding-left: 20px;
}
ol {
	padding-left: 0;
}
ol.no-style {
	list-style-type: none;
	margin-bottom: 35px;
}
ol.no-style li {
  text-indent: -1.5em;
  margin-left: 1.5em;
}
h1 {
	margin: 0;
}
dt {
	font-weight: bold;
	line-height: 2;
}
dd {
	padding-left: 20px;
	margin-left: 0;
	background: url(../img/icons/arrow_right.png) no-repeat left center;
	line-height: 2;
}
.arrow_right li {
	padding-left: 20px;
	line-height: 2;
	background: url(../img/icons/arrow_right.png) no-repeat left center;
}
/*snippets*/
.only-smalldevice {
	display: none;
}
.pull-right {
	float: right;
}

.pull-right img {
	margin-left: 50px;
}
.pull-left {
	float: left;
}
.lead {
	font-size: 14px;
	line-height: 2;
}
.large {
	font-size: 14px;
}
.small {
	font-size: 85%;
	margin-top: 0;
	font-weight: normal;
}
.bold {
	font-weight: bold;
}
.smaller {
	font-size: 70%;
	font-weight: normal;
}
.smallerest {
	font-size: 50%;
	font-weight: normal;
}
.clear {
	clear: both;
}
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}
.cf:after {
    clear: both;
}
/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.relative {
	position: relative;
}
dl dd {
	margin-bottom: 35px;
}
dl.no-style dd{
	background: none;
}

dl.dl_horizontal dt,
dl.dl_horizontal dd{
	display: inline-block;
}
dl.dl_horizontal dt {
	width: 53px;
	text-align: justify;
	vertical-align: top;
}
dl.dl_horizontal dd {
	margin-bottom: 0;
	padding-left: 30px;
	width: 570px;
	background: none;
}
.post_category span{
	font-weight: bold;
	background: url(../img/main_underline_1.png) bottom no-repeat;
	padding-bottom: 4px;
}
/*end snippets*/

/*レイアウトなど*/
.container {
	width: 1000px;
	margin: 0 auto;
}
#header {
	padding-top: 16px;
	background: url(../img/header_underline.png) repeat-x bottom left;
	padding-bottom: 15px;
}
h1 {
	margin-left: 35px;
}
#title {
	float: left;
}

#head_nav {
	float: right;
}
#head_nav ul {
	width: 500px;
	margin-top: 18px;
	margin-bottom: 6px;
}
#head_nav ul li{
	float: left;
	margin-right: 25px;
	height: 25px;
}
#head_nav ul li a{
	text-indent: -9999px;
	display: block;
	height: 25px;
}
#head_nav ul li.pull-right{
	float: right;
}
#head_nav_toggle {
	display: none;
}
li#nav_about a{
	width: 116px;
	background: url(../img/nav_about.png) no-repeat;
}
li#nav_access a{
	width: 78px;
	background: url(../img/nav_access.png) no-repeat;
}
li#nav_contact a{
	width: 91px;
	background: url(../img/nav_contact.png) no-repeat;
}
li#nav_news a{
	width: 200px;
	background: url(../img/nav_news.png) no-repeat;
}
#main_container {
	min-height: 1080px;
	background: url(../img/main_bg.png) repeat-y left top;
	padding-bottom: 50px;
}
#main {
	width: 732px;
	float: left;
	margin-top: 30px;
}
#main > div,
#main > iframe {
	/*margin-left: 0px;*/
	padding-left: 35px;
	padding-right: 35px;
}
#main > div[class^="main_underline"] {
	padding-bottom: 25px;
}
.main_underline_1 {
	background: url(../img/main_underline_1.png) no-repeat bottom right;
}
.main_underline_2 {
	background: url(../img/main_underline_2.png) no-repeat bottom right;
}
.main_underline_3 {
	background: url(../img/main_underline_3.png) no-repeat bottom right;
}
#main a:hover {
		background-color: #f2f100;
		text-decoration: none;
	}
#main h2 {
	margin-top: 0;
}
#main h3 {
	margin-top: 30px;
}
#main h4 {
	font-size: 16px;
	font-weight: bold;
	margin: 10px 0 0;
}
#sub {
	width: 262px;
	margin-right: 5px;
	float: right;
}
#sub > div {
	padding: 0 29px;
}
#sub_nav {
	padding-top: 5px;
}
#sub_nav .sub_nav_header {
	display: block;
	height: 25px;
}
#sub_nav ul {
	padding-left: 0;
}
#sub_nav li {
	text-indent: -9999px;
	position: relative;
	margin-top: 35px;
}
#sub_nav li > ul {
	margin-top: 10px;
	padding-left: 20px;
}
#sub_nav li > ul > li {
	margin-top: 2px;
}
#sub_nav li >ul >li >a {
	display: block;
	width: 184px;
	height: 21px;
}
#sub_nav li[id^=sub_nav] a,
#sub_nav li[id^=sub_nav] .sub_nav_header
{
	background: url(../img/sub_nav.png) no-repeat left top;
}
#sub_nav li[id^=sub_nav] a:hover{
	background: url(../img/sub_nav_on.png) no-repeat left top;
}
#sub_nav li#sub_nav_join .sub_nav_header{
	background-position: 0 2px;
}
#sub_nav li#sub_nav_join_event_school a {
	background-position: -18px -32px;
}
#sub_nav li#sub_nav_join_bukatsu a {
	background-position: -18px -54px;
}
#sub_nav li#sub_nav_use .sub_nav_header {
	background-position: 0 -106px;
}
#sub_nav li#sub_nav_use_rental_space a {
	background-position: -18px -140px;
}
#sub_nav li#sub_nav_use_work_lounge a {
	background-position: -18px -352px;
}
#sub_nav li#sub_nav_use_bushitsu a {
	background-position: -18px -376px;
}

#sub_nav li#sub_nav_know .sub_nav_header{
	background-position: 0 -426px;
}
#sub_nav li#sub_nav_know_news a {
	background-position: -18px -461px;
}
#sub_nav li#sub_nav_know_report a {
	background-position: -18px -485px;
}
#sub_nav li#sub_nav_know_about a {
	background-position: -18px -508px;
}
#sub_nav li#sub_nav_know_access a {
	background-position: -18px -531px;
}
#sub_nav li#sub_nav_know_contact a {
	background-position: -18px -555px;
}
#sub_nav li.opened:before {
	display: block;
	content:"";
	width: 16px;
	height: 16px;
	top: 2px;
	left: -4px;
	position: absolute;
	background: url(../img/icons/arrow_bottom.png) no-repeat;
}
#sub_nav .sub_list {
	margin-top: 0;
	max-height: 0;
	overflow: hidden;
	transition: max-height ease .3s;
}
#sub_nav .opened .sub_list {
	margin-top: 0;
	max-height: 1000px;
	transition: max-height ease 1s;
}
#sub_nav li >ul >li > .sub_list > li > a {
	width: 137px;
}
#sub_nav li#sub_nav_rental_space_flow a {
	background-position: -44px -164px;
}
#sub_nav li#sub_nav_rental_space_kitchen a {
	background-position: -44px -164px;
}
#sub_nav li#sub_nav_rental_space_kitchen a{
	background-position: -44px -188px;
}
#sub_nav li#sub_nav_rental_space_hall a{
	background-position: -44px -211px;
}
#sub_nav li#sub_nav_rental_space_studio a{
	background-position: -44px -234px;
}
#sub_nav li#sub_nav_rental_space_atelier a{
	background-position: -44px -257px;
}
#sub_nav li#sub_nav_rental_space_booth a{
	background-position: -44px -281px;
}
#sub_nav li#sub_nav_rental_space_room a{
	background-position: -44px -304px;
}
/*#sub_nav li#sub_nav_rental_space_storage a{
	background-position: -44px -304px;
}*/


#sub > div[class^="sub_underline"]{
	padding-bottom: 40px;
}
.sub_underline_1 {
	background: url(../img/sub_underline_1.png) no-repeat bottom;
}
.sub_underline_2 {
	background: url(../img/sub_underline_2.png) no-repeat bottom;
}
#sub h3 {
	margin: 25px 0 0;
}
#sub h4 {
	margin: 25px 0 0;
}
#sub dd{
	margin-bottom: 0;
}

.thumbnails {
	margin-top: 20px;
	margin-left: -31px;
	letter-spacing: -0.4em;
}
.thumbnail_container {
	margin-left: 28px;
	width: 202px;
	display: inline-block;
	vertical-align: top;
	margin-bottom: 50px;
	position: relative;
	letter-spacing: normal;
}
.thumbnail_image:before {
	content: "";
	display: block;
	padding-top: 62.2%;
}
.thumbnail_image {
	/*overflow: hidden;*/
	position: relative;
}
.thumbnail_image .img {
	/*margin: 0.5px;*/
	position: absolute;
	display: block;
	/*height: auto;*/
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
	background-position: center center;
}
.thumbnail_image img {
  /* height: 127px; */
	overflow: hidden;
}
#main .thumbnail_image a:hover {
	background-color:none;
}
.thumbnail_image:after {
	pointer-events:none;
	display: block;
	content: "";
	background: url(../img/thumbnail_frame0.png) no-repeat;
	top: -1px;
	left: -1px;
	right: -1px;
	bottom: -1px;
	position: absolute;
	z-index: 2;
}
#main .thumbnail_text h4 {
	min-height: 69px;
	padding-bottom: 16px;
}
#main .thumbnail_text p {
	margin-top: 0;
}
.thumbnail_container:hover h4 a{
	background: #f2f100;

}
.thumbnail_link a{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	cursor: pointer;
}
#main .thumbnail_link a:hover {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: transparent;
}
.col_2_container {
	margin-left: -20px;
	letter-spacing: -.4em;
}
.col_2 {
	vertical-align: top;
	display: inline-block;
	box-sizing: border-box;
	width: 50%;
	padding-left: 20px;
	letter-spacing: normal;
}
#main .col_2 h4 {
	font-size: 12px;
}
.readmore {
	text-align: right;
	vertical-align: bottom;
}
#main .readmore a {
	text-align: left;
	text-indent: -9999px;
	overflow: hidden;
	display: inline-block;
	background: url(../img/icons/icon_readmore.png) no-repeat;
	width: 79px;
	height: 59px;
}
#main .readmore a:hover {
	background: url(../img/icons/icon_readmore_on.png) transparent no-repeat;
}
.readmore.side {
	position: relative;
	display: block;
	width: 79px;
	bottom: 74px;
	float: right;
	left: auto;
	margin-bottom: -54px;
}

#main div.back_to_top {
	margin-top: 150px;
	text-align: right;
}
#main div.back_to_top a {
	position: relative;
	text-align: left;
	text-indent: -9999px;
	overflow: hidden;
	display: inline-block;
	background: url(../img/icons/icon_back.png) transparent no-repeat;
	background-size: 100% auto;
	width: 68px;
	height: 94px;
}
#main div.back_to_top a img {
	width: 100%;
}
#main div.back_to_top a:after {
	position: absolute;
	content: "ページ上部へ";
	display: block;
	bottom: 0;
	text-indent: 0;
	text-align: center;
	font-size: 11px;
}
#main div.back_to_top a:hover {
	/*background: url(../img/icons/icon_back_on.png) transparent no-repeat;*/
}
#main div.back_to_top a:hover:after {
	background-color: #f2f100;
}
#pager {
	position: relative;

}
#pager li {
	display: inline-block;
}
#pager ul {
	text-align: center;
}
.page-numbers.current {
	background-color: #f2f100;
}
.pager_index {
	text-align: center;
}
.page-numbers {
	padding: 2px 6px;
}
.pager_later a,
a.prev.page-numbers{
	position: absolute;
	left:20px;
	top:0;
	padding-left: 20px;
	background : url(../img/icons/arrow_left.png) no-repeat left center;
}
.pager_older a,
.pager_resume_download a,
.pager_schedule a,
.pager_reserve a,
a.next.page-numbers
{
	padding-right: 20px;
	background : url(../img/icons/arrow_right.png) no-repeat right center;
}
.pager_older,
a.next.page-numbers {
	position: absolute;
	right: 20px;
	top: 0;
}
#pager .pager_resume_download,
#pager .pager_schedule,
#pager .pager_reserve {
	display: inline-block;
}
#pager .pager_schedule,
#pager .pager_reserve {
	float: right;
	margin-left: 20px;
}
#pager_responsive li[class^="pager"] {
	font-size: 14px;
	display: block;
	line-height: 3;
	float: none;
}
#main table.table {
	width: 100%;

}
#main table.table thead {
	letter-spacing: .5em;
}
#main table.table tbody tr {
	background: url(../img/main_underline_1.png) no-repeat top left;
}
#main table.table th,
#main table.table td {
	padding: 10px;
}
#main table.table tr.dots_line {
	background: url(../img/main_underline_3.png) no-repeat top left;
}
#field-event-description {
	margin-bottom: 35px;
}
.eyecatch {
	margin-top: 0;
}
.eyecatch img {
	width: 100%;
	height: auto;
}
/* 2016/3/31追加 */
.photo {
	margin-top: 30px;
	margin-left: -19px;
}
.photo li {
	position: relative;
	display: inline-block;
	width: 209px;
	margin-left: 16px;
	margin-bottom: 12px;
}
.photo li img {
	position: absolute;
	top: 0px;
	left: 0px;
	display: block;
	width: 100%;
}
.photo li:after {
	position: absolute;
	content: "";
	display: block;
	background: url(/common/img/thumbnail_frame2.png) no-repeat left top;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-size: contain;
}
.photo li:before {
	content: "";
	padding-top: 68%;
	display: block;
}

/*以下はレスポンシブ対応*/
@media screen and (max-width: 663px) {
	.no-smalldevice {
		display: none;
	}
	.only-smalldevice {
		display: inherit;
	}
	.container {
		width: 100%;
	}
	.pull-right.img {
		max-width: 50%;
		box-sizing: border-box;
		padding-left: 20px;
	}
	.pull-right img {
		margin-left:0;
	}
	h1#title {
		margin-left: 0;
		float: none;
		text-align: center;
	}
	#main h4 {
		font-size: 12px;
	}
	ol.no-style {
		font-weight: normal;
	}
	dl.dl_horizontal {
		letter-spacing: -.4em;
	}
	dl.dl_horizontal dt {
		clear: both;
		width: 30%;
		max-width: 53px;
		letter-spacing: normal;
	}
	dl.dl_horizontal dd {
		width: 70%;
		letter-spacing: normal;
		box-sizing: border-box;
	}
	dl.dl_horizontal.flex_dt dt {
		max-width: none;
	}
	#head_nav {
		display: none;
	}
	#head_nav_toggle {
		display: block;
		width: 49px;
		height: 39px;
		cursor: pointer;
		background: url(../img/icons/icon_responsive_menu.png) no-repeat;
		position: absolute;
		top: 15px;
		left: 10px;
	}

	#main_container {
		padding-bottom: 0;
		min-height: 0;
		background: none;
	}
	#main {
		margin-top: 10px;
		padding-top: 0;
		width: 100%;
		float: none;
	}

	#main img {
		max-width: 100%;
		height: auto;
	}
	#main > div {
		padding-right: 20px;
		padding-left: 20px;
	}
	#main > iframe {
		padding-right: 0;
		padding-left: 0;
		width: 100%;
	}
	.thumbnails {
		margin-left: -20px;
	}
	.thumbnail_container {
		width: 50%;
		padding-left: 20px;
		margin-left: 0;
		margin-bottom: 20px;
		box-sizing: border-box;
		/*float: left;*/
	}
	.thumbnail_image {
		margin: -1px;
	}
	.thumbnail_image img {
		margin: 1px;
		width: 100%;
		height: auto;
	}
	.thumbnail_image:after {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background-size: contain;
	}
	.thumbnail_link {
		margin-left: 20px;
		box-sizing: border-box;
	}
	#main .thumbnail_text h4 {
		height: 40px;
	}
	.thumbnail_container.readmore {
		clear: both;
		float: none;
		width: 100%;
		text-align: center;
	}
	.col_2 {
		width: auto;
		display: block;
	}
	.readmore.side {
		position: static;
		clear: both;
		float: none;
		width: 100%;
		text-align: center;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#main_container {
		position: relative;
	}
	#sub {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		height: 100%;
		max-width: 0;
		overflow:hidden;
		z-index: 9999;
		background: url(../img/sub_responsive_border.png) repeat-y right;
		transition: max-width .4s ease ;
	}
	#sub.show {
		width: auto;
		max-width: 100%;
		/* overflow-y: auto; */

		transition: max-width .4s ease ;
	}
	#sub.show > div {
		margin-right: 1px;
	}
	#sub_coffee,
	#sub_tweets,
	#sub_facebook {
		display: none;
	}
	.eyecatch {
		margin-left: -24px;
		margin-right: -24px;
	}
	#main div.back_to_top {
		margin-top: 50px;
	}
	/* 2016/3/31追加 */
	.photo li {
		width: 47%;
		margin-left: 2.5%;
	}
	.calendar {
    padding-bottom: 75%;
  }
}
