@charset "utf-8";

@import url("default.css");
@import url("assets.css");

/*
html { margin-top: 0px !important; }
* html body { margin-top: 0px !important; }
@media screen and ( max-width: 782px ) {
html { margin-top: 0px !important; }
* html body { margin-top: 0px !important; }
}
*/

html {
 overflow: auto;
}

body {
 margin: 0;
 color: #000;
 background: #fff;
}

#wrapper {
 width: 100%;
 margin: 0 auto;
 position: relative;
 background: #fff;
}

a {
 color: #999;
}

a:hover {
 color: #262626;
 text-decoration: none;
}

.meta {
 display: none;
}

/*  ---------------------------
			Header
---------------------------  */

#header {
 width: 940px;
 height: 105px;
 margin: 0 auto;
 padding: 25px 0 55px;
 z-index: 2;
 font-size: 0.93em;
 font-family: "Asap", sans-serif;
}

#gnav_btn {
 display: none;
}

hgroup {
 width: 155px;
 height: 105px;
 margin-right: 0px;
 float: left;
}

.siteTitle {
 display: block;
 padding: 0;
}

.siteTitle a {
 width: 155px;
 height: 105px;
 display: block;
 text-indent: -9999px;
 background: url(../img/logo.png?20180810) no-repeat 0 0;
 -moz-background-size: 100% auto;
 background-size: 100% auto;
}

.site-description {
 display: none;
}

#gnav {
 float: right;
 width: 720px;
 margin-top: 26px;
 overflow: hidden;
 position: relative;
}

.main-navigation {
 float: left;
 width: 400px;
}

.main-navigation div {
 float: left;
 overflow: hidden;
}

.main-navigation div span {
 font-size: 1em;
 display: block;
 width: auto;
 margin: 0 30px 14px 0;
 border-bottom: 1px solid #fff;
}

.main-navigation div span a {
 display: inline;
 cursor: pointer;
 padding: 4px 3px;
}

.main-navigation div span a:hover {
 border-bottom: 1px solid #333;
}

.main-navigation div span.current a {
 border-bottom: 1px solid #999;
}

#language {
 float: right;
 width: 80px;
 text-align: right;
 padding: 0px 0 0;
}
#language > span {
 color: #999;
 text-align: center;
 display: inline-block;
 margin: 2px 3px;
 border-bottom: none;
 font-size: 1em;
 text-align: center;
 display: inline-block;
 padding: 4px 1px;
 border-bottom: 1px solid #fff;
 background: none;
}
#language > span:hover {
 color: #333;
 border-bottom: 1px solid #333;
}
#language > span.current {
 border-bottom: 1px solid #999;
}
#language > span.current:hover {
 color: #999;
 border-bottom: 1px solid #999;
}

/*  ---------------------------
			Contents
---------------------------  */

#contents {
 width: 940px;
 margin: 0 auto 30px;
 padding: 0;
 zoom: 1;
 height: auto;
}
#contents::after {
 content: "";
 display: table;
 clear: both;
}
#contents #contents_title {
 color: #bfbfbf;
 font-size: 32px;
 font-weight: normal;
 font-family: "Gilda Display", serif;
 letter-spacing: 0.05em;
}

/* ------ Mainvisual ------ */

#mainvisual {
 position: relative;
 width: 100%;
 display: table;
 margin: 0 0 30px;
}

#mainvisual-inner {
 display: table-cell;
 text-align: center;
 vertical-align: middle;
}

#mainvisual-inner ul.img {
 max-width: 800px;
 max-height: 650px;
 margin: 0 auto;
 text-align: center;
}

#mainvisual-inner ul.img img {
 width: auto;
 height: auto;
 max-width: 800px;
 max-height: 650px;
}

/* ------ information ------ */

#information {
 width: 940px;
 height: 36px;
 margin: -30px auto 40px;
 overflow: hidden;
 position: relative;
 border-top: 1px solid #e5e5e5;
 border-bottom: 1px solid #e5e5e5;
}

#information .ticker {
 margin: 0 auto;
 padding: 10px;
 width: 100%;
 position: relative;
 overflow: hidden;
}

#information .news {
 position: absolute;
 left: 0;
 top: 0;
 width: 90px;
 height: 36px;
 display: block;
 color: #333;
 font-size: 14px;
 font-weight: 400;
 line-height: 36px;
 text-align: center;
}

#information .ticker ul {
 width: auto;
 position: relative;
}

#information .ticker ul li {
 width: 100%;
 margin: 0;
 list-style: none;
 font-size: 11px;
 line-height: 1.5;
 color: #999;
 padding-left: 100px;
 display: none;
}

#information .ticker ul li .time {
 display: inline-block;
 margin-right: 20px;
}

#information .ticker ul li a,
#information .ticker ul li span {
 text-decoration: none;
 color: #999;
}

#information .ticker ul li a:hover {
 text-decoration: underline;
}

/* ------ newsArea ------ */

#newsArea {
 width: auto;
 margin: 0px auto 50px;
 padding: 60px 60px 0;
 overflow: hidden;
 position: relative;
 border-top: 1px solid #e5e5e5;
}

#newsArea .news {
 display: block;
 color: #333;
 font-size: 14px;
 text-align: center;
 font-size: 28px;
 font-weight: normal;
 font-family: "Gilda Display", serif;
 letter-spacing: 0.05em;
 margin: 0 0 40px;
}

#newsArea .listNews ul {
 width: auto;
 position: relative;
}

#newsArea .listNews li {
 margin-bottom: 20px;
 min-height: 72px;
}

#newsArea .listNews li dl {
 display: table;
}

#newsArea .listNews li dt {
 display: table-cell;
 vertical-align: middle;
 width: 65px;
 height: 65px;
 background: #fff;
 font-size: 9px;
}

#newsArea .listNews li dt img {
 width: 65px;
 height: 65px;
 height: auto;
}

#newsArea .listNews li a:hover dt img {
 filter: alpha(opacity=50);
 -moz-opacity: 0.5;
 opacity: 0.5;
}

#newsArea .listNews li dd {
 width: auto;
 text-align: left;
 display: table-cell;
 letter-spacing: 0.1em;
 vertical-align: middle;
 padding: 0 0 0 20px;
}

#newsArea .listNews ul li .time {
 font-size: 11px;
 padding-bottom: 4px;
 color: #333 !important;
}

#newsArea .listNews ul li .title {
 font-size: 13px;
 font-weight: 400;
 padding-bottom: 4px;
 color: #333 !important;
}

#newsArea .listNews ul li a,
#newsArea .listNews ul li span {
 text-decoration: none;
 color: #999;
}

#newsArea .listNews ul li a:hover {
 text-decoration: none;
}

/* ------ place ------ */

#place {
 width: auto;
 padding: 60px 0px 0;
 position: relative;
 text-align: center;
 border-top: 1px solid #e5e5e5;
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}
#place article {
 display: inline-block;
 vertical-align: top;
 width: 23.5%;
 margin-bottom: 40px;
}
html.en #place {
 padding: 60px 140px 0;
}
html.en #place article {
 width: 46%;
}
#place article figure {
 margin: 0 0 10px;
}
#place article a:hover img {
 opacity: 0.5;
}
#place article p {
 text-align: left;
 font-size: 13px;
 color: #333;
}
#place article p.title {
 height: 11px;
 display: block;
 margin: 0 0 5px;
 line-height: 1.3;
}
#place article p.title img {
 height: 11px;
 vertical-align: top;
}
#place article p.address {
 font-size: 11px;
 font-family: "Asap", sans-serif;
 line-height: 1.3;
 color: #333;
 margin: 0 0 5px;
}
#place article:nth-of-type(3) figure img,
#place article:nth-of-type(4) figure img {
 border: 1px solid #999;
 box-sizing: border-box;
}
#place article:nth-of-type(3) p.title,
#place article:nth-of-type(4) p.title {
 font-size: 13.5px;
 font-weight: bold;
 height: inherit;
 letter-spacing: 0.1em;
}
#place article:nth-of-type(3) a:hover p.title,
#place article:nth-of-type(4) a:hover p.title {
 opacity: 0.5;
}

/* ------ left_column ------ */

#left_column {
 color: #333;
 float: left;
 width: 820px;
 padding-bottom: 20px;
}

#main {
 position: relative;
 padding-bottom: 40px;
}

/* ------ Right Column ------ */

#right_column {
 float: right;
 width: 60px;
 font-size: 12px;
 font-family: "Asap", sans-serif;
 letter-spacing: 0.05em;
 padding: 20px 0 0;
}

#right_column .widget-area {
 display: block;
}

#right_column #archiveBtn {
 display: none;
}

#right_column h3 {
 display: none;
}

#right_column ul {
 overflow: hidden;
}

#right_column ul li {
 margin: 0 0 5px;
}

#right_column ul li a {
 font-size: 12px;
 display: block;
 padding: 5px;
}

#right_column ul li a br {
 display: block;
}

/*  ---------------------------
			Footer
---------------------------  */

#footer {
 width: 940px;
 margin: 0 auto;
 padding: 30px 0 50px;
 position: relative;
 border-top: 1px solid #e5e5e5;
 display: flex;
 flex-flow: row-reverse;
 align-items: center;
 justify-content: space-between;
}
/*
body.home #footer {
	padding: 0px 0 30px;
}
*/
#copyright {
 color: #333;
 font-size: 10px;
 display: inline-block;
}
#sns {
 display: flex;
 align-items: center;
 padding: 0;
}
#sns p {
 display: inline-block;
 margin: 0px;
 font-size: 12px;
 font-weight: bold;
}
#sns > div.artsy {
 width: 58px;
 height: 20px;
 position: relative;
 margin-left: 16px;
}
#sns > div.artsy a {
 width: 58px;
 height: 20px;
 opacity: 0.6;
}
#sns .btn {
 display: flex;
 justify-content: center;
 align-items: center;
 width: 25px;
 height: 25px;
 margin-left: 16px;
}
#sns .btn a {
 display: block;
 width: 25px;
 height: 25px;
}
#sns .btn a .icon {
 max-width: 100%;
 max-height: 100%;
 fill: #666;
}

#anchorArea {
 position: fixed;
 z-index: 3;
 right: 0;
 bottom: 30px;
 -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
 -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
 box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
}

#anchorArea a {
 width: 36px;
 height: 36px;
 background-color: #fff;
 background-position: 50% 50%;
 background-repeat: no-repeat;
 display: block;
 text-indent: -9999px;
}

#anchorArea #page-top a {
 background-image: url(../img/anchor_01.png);
}

#anchorArea #page-bottom a {
 background-image: url(../img/anchor_02.png);
}

/*-----------------------------------------------------	*/
/*	for - 979px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 979px) {
 #wrapper {
  width: 960px;
 }
}

/*-----------------------------------------------------	*/
/*	for - 819px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 819px) {
 body {
  background: #fff;
 }

 #wrapper {
  width: auto;
  margin: 0;
  position: relative;
  background: #ffffff;
  z-index: 2;
  top: 0px;
  left: 0px;
  width: 100%;
  transition: transform 0.6s;
  -webkit-transition: -webkit-transform 0.6s;
 }

 #header {
  width: 99.5%;
  height: auto;
  padding: 0px;
  z-index: 2;
 }

 hgroup {
  width: 165px;
  height: 115px;
  margin-right: 0px;
  float: none;
 }

 .siteTitle {
  display: block;
  padding: 10px 0 0 10px;
 }

 .siteTitle a {
  width: 130px;
  height: 105px;
  display: block;
  text-indent: -9999px;
  background: url(../img/logo.png?20180810) no-repeat 0 0;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
 }

 #gnav_btn {
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 3;
  display: block;
  width: 40px;
  height: 40px;
 }

 #gnav_btn a {
  display: block;
  height: 40px;
  width: 40px;
  cursor: pointer;
  z-index: 300;
 }

 #gnav_btn a.open {
  background: url(../img/btn_gnav.png) no-repeat 50% 50%;
 }

 #gnav_btn a.close {
  background: url(../img/btn_close.png) no-repeat 50% 50%;
 }

 .perspective {
  position: fixed !important;
  top: 0;
  left: 0;
  transform: translateX(-276px) rotateY(0deg) translateZ(0px);
  -webkit-transform: translateX(-276px) rotateY(0deg) translateZ(0px);
  transition: transform 0.6s;
  -webkit-transition: -webkit-transform 0.6s;
 }

 .menuopen {
  position: fixed !important;
  -webkit-transform: translate3d(0px, 0, 0) !important;
  -moz-transform: translate3d(0px, 0, 0) !important;
  transform: translate3d(0px, 0, 0) !important;
  transition: transform 0.6s;
  -webkit-transition: -webkit-transform 0.6s;
 }

 /*
#gnav {
	display: block;
	margin:0px;
	position: fixed;
	float:right;
	top: 0px;
	right: 0px;
	width:276px;
	background:#eee;
	z-index:300 !important;
}
*/

 #gnav {
  display: block;
  overflow-x: hidden;
  overflow-y: scroll;
  position: fixed;
  margin: 0px;
  top: 0;
  right: 0px;
  width: 276px;
  height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #eee;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translate3d(276px, 0, 0);
  -moz-transform: translate3d(276px, 0, 0);
  transform: translate3d(276px, 0, 0);
  transition: transform 0.6s;
  -webkit-transition: -webkit-transform 0.6s;
  z-index: 200;
 }

 .main-navigation {
  float: left;
  width: 276px;
  margin: 40px 0;
 }

 .main-navigation div {
  float: none;
  overflow: hidden;
 }

 .main-navigation div span {
  font-size: 1em;
  display: block;
  width: auto;
  margin: 0;
  border-bottom: none;
 }

 .main-navigation div span a {
  color: #333;
  font-size: 1.1em;
  display: block;
  cursor: pointer;
  padding: 12px 18px;
 }

 .main-navigation div span a:hover {
  border-bottom: none;
 }

 .main-navigation div span.current a {
  border-bottom: none;
 }

 #language {
  float: none;
  width: 80px;
  padding: 18px;
  text-align: left;
 }

 #language > span {
  color: #333;
  text-align: center;
  display: inline-block;
  margin: 2px 1px;
  border-bottom: none;
  font-size: 1.1em;
  text-align: center;
  display: inline-block;
  padding: 4px 2px;
  border-bottom: none;
  background: none;
 }

 #language > span:hover {
  color: #333;
  border-bottom: none;
 }

 #language > span.current {
  border-bottom: 1px solid #999;
 }

 #language > span.current:hover {
  color: #999;
 }

 /*  ---------------------------
			Contents
---------------------------  */

 #contents {
  width: auto;
  margin: 20px 20px 30px;
  padding: 0px;
  min-height: auto;
 }

 body.home #contents {
  overflow: inherit;
 }

 #contents #contents_title {
  color: #bfbfbf;
  font-size: 24px;
  font-weight: normal;
  font-family: "Gilda Display", serif;
  letter-spacing: 0.05em;
 }

 /* ------ Mainvisual ------ */

 #mainvisual {
  position: relative;
  width: 90%;
  display: table;
  margin: 15px auto 0;
 }

 #mainvisual-inner {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
 }

 #mainvisual-inner ul.img {
  max-width: 100%;
  max-height: 300px;
  margin: 0 auto;
  text-align: center;
 }

 #mainvisual-inner ul.img img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 300px;
 }

 #left_column {
  float: none;
  width: auto;
  padding-bottom: 0px;
 }

 #main {
  position: relative;
  padding-bottom: 60px;
 }

 /* ------ information ------ */

 #information {
  position: relative;
  left: 0;
  bottom: 0;
  overflow: hidden;
  width: 90%;
  margin: 0px auto 0;
  height: auto;
  background: none;
 }

 #information .ticker {
  margin: 0 auto;
  padding: 10px 0;
  width: 100%;
  position: relative;
  overflow: hidden;
 }

 #information .news {
  position: absolute;
  left: 0;
  top: 0px;
  width: 90px;
  height: 36px;
  display: block;
  color: #333;
  font-size: 14px;
  font-weight: 400;
  line-height: 36px;
  text-align: left;
 }

 #information .ticker ul {
  width: auto;
  position: relative;
 }

 #information .ticker ul li {
  width: 100%;
  margin: 0;
  list-style: none;
  font-size: 12px;
  line-height: 1.6em;
  color: #999;
  padding-left: 0px;
  display: none;
 }

 #information .ticker ul li .time {
  display: block;
  margin: 0 0 5px 90px;
 }

 #information .ticker ul li a,
 #information .ticker ul li span {
  text-decoration: none;
  color: #999;
 }

 #information .ticker ul li a:hover {
  text-decoration: underline;
 }

 /* ------ newsArea ------ */

 #newsArea {
  width: auto;
  margin: 0px auto 0px;
  padding: 40px 40px 0;
 }

 #newsArea .news {
  margin: 0 0 30px;
 }

 #newsArea .listNews li {
  margin-bottom: 30px;
  min-height: 72px;
 }

 #newsArea .listNews li dt {
  display: table-cell;
  vertical-align: middle;
  width: 75px;
  height: 75px;
  background: #fff;
  font-size: 9px;
 }

 #newsArea .listNews li dt img {
  width: 75px;
  height: 75px;
  height: auto;
 }

 #newsArea .listNews li a:hover dt img {
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
 }

 #newsArea .listNews ul li .time {
  font-size: 11px;
  padding-bottom: 4px;
  color: #333 !important;
 }

 #newsArea .listNews ul li .title {
  font-size: 12.5px;
  font-weight: 400;
  padding-bottom: 4px;
  color: #333 !important;
 }

 #newsArea .listNews ul li a,
 #newsArea .listNews ul li span {
  text-decoration: none;
  color: #999;
 }

 #newsArea .listNews ul li a:hover {
  text-decoration: none;
 }

 /* ------ place ------ */

 #place,
 html.en #place {
  width: auto;
  margin: 0px auto 0px;
  padding: 60px 0px 0;
 }
 #place article,
 html.en #place article {
  display: block;
  width: 48%;
  margin: 0px 0 20px;
  padding: 0;
 }

 #place article a:hover img {
  opacity: 1;
 }
 #place article p.title {
  font-size: 16px;
  font-weight: bold;
  font-family: "Asap", sans-serif;
  color: #333;
  margin: 0 0 5px;
 }
 #place article p.address {
  font-size: 11.5px;
 }

 /* ------ Right Column ------ */

 #right_column {
  float: none;
  width: auto;
  font-size: 1em;
  font-family: "Asap", sans-serif;
  letter-spacing: 0.05em;
  padding: 0px 0 0px;
  position: relative;
 }

 #right_column h3 {
  display: none;
 }

 #right_column .widget-area {
  display: none;
  background: #fff;
  padding: 10px 0;
  margin: 0;
 }

 #right_column #archiveBtn {
  display: block;
  position: absolute;
  top: -22px;
  right: 0px;
  text-align: right;
  z-index: 3;
 }

 #right_column #archiveBtn a {
  width: auto;
  position: relative;
  margin-top: -160px;
  display: inline-block;
  border: 1px solid #ccc;
  border-top: none;
  padding: 8px 10px;
  cursor: pointer;
  font-size: 11px;
  color: #000;
 }

 #right_column ul {
  clear: both;
  overflow: hidden;
 }

 #right_column ul li {
  margin: 0 0px;
  border-bottom: 1px dotted #ccc;
 }

 #right_column ul li a {
  color: #333 !important;
  font-size: 14px;
  display: block;
  padding: 12px 4px;
 }

 #right_column ul li a br {
  display: none;
 }

 /*  ---------------------------
			Footer
---------------------------  */
 #footer {
  width: 100%;
  padding: 40px 0 20px;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: space-between;
 }
 #copyright {
  color: #333;
  font-size: 10px;
  display: inline-block;
  padding: 0;
  margin-top: 20px;
 }
 #sns {
  flex-wrap: wrap;
  justify-content: center;
  padding: 0;
 }
 #sns p {
  display: block;
  text-align: center;
  width: 100%;
  margin-bottom: 20px;
 }
 #sns > div.artsy {
  width: 58px;
  height: 20px;
  position: relative;
  margin-inline: 12px;
 }
 #sns > div.artsy a {
  width: 58px;
  height: 20px;
  opacity: 0.6;
 }
 #sns .btn {
  margin-inline: 12px;
 }

 #anchorArea {
  position: relative;
  z-index: 3;
  right: 0;
  bottom: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
 }

 #anchorArea #page-top a {
  width: 60px;
  height: 50px;
  margin: 0 auto;
  display: block;
  text-indent: -9999px;
  background: url(../img/anchor_01.png) no-repeat 50% 50%;
 }
}

/*-----------------------------------------------------	*/
/*	for - 480px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 340px) {
 #sns > div.artsy {
  margin-inline: 10px;
 }
 #sns .btn {
  margin-inline: 10px;
  width: 20px;
  height: 20px;
 }
 #sns .btn a {
  width: 20px;
  height: 20px;
 }
}