@charset "UTF-8";

/* アニメーション */
/* ========================================
	トップスクロール（アニメーション） 
======================================== */
@keyframes top_arrow {
  0%, 6% {
    -webkit-transform: translateY(-40px); /* for iOS and Chrome */
    -ms-transform: translateY(-40px); /* for IE */
    transform: translateY(-40px); }
  33%, 66% {
    -webkit-transform: translateY(0); /* for iOS and Chrome */
    -ms-transform: translateY(0); /* for IE */
    transform: translateY(0); }
  94%, 100% {
    -webkit-transform: translateY(40px); /* for iOS and Chrome */
    -ms-transform: translateY(40px); /* for IE */
    transform: translateY(40px); }
}
@-webkit-keyframes top_arrow {
  0%, 6% {
    -webkit-transform: translateY(-40px); /* for iOS and Chrome */
    -ms-transform: translateY(-40px); /* for IE */
    transform: translateY(-40px); }
  33%, 66% {
    -webkit-transform: translateY(0); /* for iOS and Chrome */
    -ms-transform: translateY(0); /* for IE */
    transform: translateY(0); }
  94%, 100% {
    -webkit-transform: translateY(40px); /* for iOS and Chrome */
    -ms-transform: translateY(40px); /* for IE */
    transform: translateY(40px); }
}



/* base
--------------------------------------------*/
html {
	width: 100%;
	height: 100%;
}
body {
	background-color: #fff;
	font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;
	line-height: 1.7;
	font-size: 1.0rem;
	color: #333;
	width: 100%;
	height: 100%;
}
h1,h2,h3,h4,h5,h6 {
	margin: 0;
	padding: 0;
}
p {
	font-size: 0.75rem; /*12px*/
	font-weight: 400;
	letter-spacing: 0.085em;
	margin: 0;
}
ul {
	list-style: none;
	padding:0;
	margin:0;
}
a,
a:link,
a:visited,
a:active,
a:hover {
	text-decoration: none;
	color: #333;
	outline: none !important;
}
.white {
	color: #fff;
}
.pink {
	color: #f22fbb; /* pink */
}
.light-pink {
	color: #efcacf; /* light pink */
}
.khaki {
	color: #9e8711; /* khaki */
}



/* loading
--------------------------------------------*/
#loading {
	width: 100%;
	height: 100%;
	background-color: #fff;
	position: relative;
	z-index: 6;
}
#loading img{
	position: absolute;
	width: 150px;
	height: 150px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%); /* for iOS and Chrome */
	-moz-transform: translate(-50%, -50%); /* for Firefox */
	-ms-transform: translate(-50%, -50%); /* for IE */
	-webkit-backface-visibility:hidden; /* for iOS and Chrome */
	backface-visibility:hidden;	
}
.hidden {
	display: none;
}
.loading_inner{
	position: absolute;
	width: 240px;
	height: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%); /* for iOS and Chrome */
	-moz-transform: translate(-50%, -50%); /* for Firefox */
	-ms-transform: translate(-50%, -50%); /* for IE */
	animation: load1 1s ease-in-out;
	-webkit-animation: load1 1s ease-in-out; /* for iOS and Chrome */
	-moz-animation: load1 1s ease-in-out; /* for Firefox */
	-ms-animation: load1 1s ease-in-out; /* for IE */
}
@media screen and (max-width:767px){
	.loading_inner {
		width: 160px;
	}
}
#maru1 {
	animation: maru 1.2s ease-in-out infinite;
	animation-delay: 1s;
	-webkit-animation: maru 1.2s ease-in-out infinite; /* for iOS and Chrome */
	-webkit-animation-delay: 1s; /* for iOS and Chrome */
	-moz-animation: maru 1.2s ease-in-out infinite; /* for Firefox */
	-moz-animation-delay: 1s; /* for Firefox */
	-ms-animation: maru 1.2s ease-in-out infinite; /* for IE */
	-ms-animation-delay: 1s; /* for IE */
}
#maru2 {
	animation: maru 1.2s ease-in-out infinite;
	animation-delay: 1.2s;
	-webkit-animation: maru 1.2s ease-in-out infinite; /* for iOS and Chrome */
	-webkit-animation-delay: 1.2s; /* for iOS and Chrome */
	-moz-animation: maru 1.2s ease-in-out infinite; /* for Firefox */
	-moz-animation-delay: 1.2s; /* for Firefox */
	-ms-animation: maru 1.2s ease-in-out infinite; /* for IE */
	-ms-animation-delay: 1.2s; /* for IE */
}
#maru3 {
	animation: maru 1.2s ease-in-out infinite;
	animation-delay: 1.4s;
	-webkit-animation: maru 1.2s ease-in-out infinite; /* for iOS and Chrome */
	-webkit-animation-delay: 1.4s; /* for iOS and Chrome */
	-moz-animation: maru 1.2s ease-in-out infinite; /* for Firefox */
	-moz-animation-delay: 1.4s; /* for Firefox */
	-ms-animation: maru 1.2s ease-in-out infinite; /* for IE */
	-ms-animation-delay: 1.4s; /* for IE */
}
@keyframes load {
	0% {
		transform: translate(-50%, 0%);
		-webkit-transform: translate(-50%, 0%); /* for iOS and Chrome */
		-moz-transform: translate(-50%, 0%); /* for Firefox */
		-ms-transform: translate(-50%, 0%); /* for IE */
		opacity: 0;
	    -moz-opacity: 0; /* for Firefox */
	    -khtml-opacity: 0;
	    filter: alpha(opacity=0); /* for IE6 and IE7 */
	    -ms-filter: "alpha(opacity=0)"; /* for IE8 and IE9 */
	}
	100% {
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%); /* for iOS and Chrome */
		-moz-transform: translate(-50%, -50%); /* for Firefox */
		-ms-transform: translate(-50%, -50%); /* for IE */
		opacity: 1;
	    -moz-opacity: 1; /* for Firefox */
	    -khtml-opacity: 1;
	    filter: alpha(opacity=100); /* for IE6 and IE7 */
	    -ms-filter: "alpha(opacity=100)"; /* for IE8 and IE9 */
	}
}
@keyframes load1 {
	0% {
		opacity: 0;
	    -moz-opacity: 0; /* for Firefox */
	    -khtml-opacity: 0;
	    filter: alpha(opacity=0); /* for IE6 and IE7 */
	    -ms-filter: "alpha(opacity=0)"; /* for IE8 and IE9 */
	}
	100% {
		opacity: 1;
	    -moz-opacity: 1; /* for Firefox */
	    -khtml-opacity: 1;
	    filter: alpha(opacity=100); /* for IE6 and IE7 */
	    -ms-filter: "alpha(opacity=100)"; /* for IE8 and IE9 */
	}
}
@keyframes maru {
	0% {opacity:0;}
	50% {opacity:.5;}
	100% {opacity:1;}
}



/* main visual
--------------------------------------------*/
#contents {
	height: 100%;
}
#mv {
	position: relative;
	width: 100%;
	height: 100vh; /* fall back */
/* 	height: calc(var(--vh, 1vh) * 100); */
	overflow: hidden;
}
.mv_bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
	z-index: -3;
}
.mv_bg_1 {
	background-image: url("../images/img_mv-bg-1.png"); /* lion sara */
	background-color: #5d97b8; /* blue */
	background-size: 65% auto;
}
.mv_bg_2 {
	background-image: url("../images/img_mv-bg-2.png"); /* coara pot */
	background-color: #cef35e; /* yellow green */
	background-size: 65% auto;
}
.mv_bg_3 {
	background-image: url("../images/img_mv-bg-3.png"); /* mr. cut */
	background-color: #ebd5b7; /* light brown */
	background-size: 65% auto;
}
.mv_bg_4 {
	background-image: url("../images/img_mv-bg-4.png"); /* kuma base */
	background-color: #f0bf8c; /* orange */
	background-size: 65% auto;
}
.mv_bg_5 {
	background-image: url("../images/img_mv-bg-5.png"); /* kuma obje */
	background-color: #aac5c8; /* light blue */
	background-size: 65%;
}
.mv_bg_6 {
	background-image: url("../images/img_mv-bg-6.png"); /* kuma */
	background-color: #ececec; /* light gray */
	background-size: 35%;
}
@media screen and (max-width:767px){
	.mv_bg_1 {
		background-size: 100% auto;
	}
	.mv_bg_2 {
		background-size: 100% auto;
	}
	.mv_bg_3 {
		background-size: 100% auto;
	}
	.mv_bg_4 {
		background-size: 100% auto;
	}
	.mv_bg_5 {
		background-size: 100% auto;
	}
	.mv_bg_6 {
		background-size: 55% auto;
	}
}

/* ロゴ */
#site-logo {
	fill: transparent;
}
#site-logo.site-logo-1 { /* lion sara */
	fill: #ff5d12; /* deep orange */
}
#site-logo.site-logo-2 { /* coara pot */
	fill: #f22fbb; /* pink */
}
#site-logo.site-logo-3 { /* mr. cut */
	fill: #ff5d12; /* deep orange */
}
#site-logo.site-logo-4 { /* brz kuma */
/* 	fill: #9e8711; */ /* khaki */
	fill: rgba(0,188,212,0.69); /* light blue */
}
#site-logo.site-logo-5 { /* red kuma */
	fill: #f22fbb; /* pink */
}
#site-logo.site-logo-6 { /* shuyusashi kuma */
	fill: rgba(0,188,212,0.69); /* light blue */
}

/* ハンバーガーメニュー */
.top .icon_inner span.icon_inner-line-1 { /* lion sara */
	background: #ff5d12; /* deep orange */
}
.top .icon_inner span.icon_inner-line-2 { /* coara pot */
	background: #f22fbb; /* pink */
}
.top .icon_inner span.icon_inner-line-3 { /* mr. cut */
/* 	background: #f22fbb;  *//* pink */
	background: #ff5d12; /* deep orange */
}
.top .icon_inner span.icon_inner-line-4 { /* brz kuma */
	background: rgba(0,188,212,0.69); /* light blue */
}
.top .icon_inner span.icon_inner-line-5 { /* red kuma */
	background: #f22fbb; /* pink */
}
.top .icon_inner span.icon_inner-line-6 { /* shuyusashi kuma */
	background: rgba(0,188,212,0.69); /* light blue */
}
.icon.is-change .icon_inner span,#page .icon.is-change .icon_inner span {
	background: #222;
}
#page .icon_inner span {
	background: #222;
}
.site-title {
	position: absolute;
	top: 30px;
	left: 30px;
	width: auto;
    padding: 0;
	z-index: 5;
	margin:0;
}
.site-title h1{
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.075em;
	line-height: 20px;
	color: #ff5d12;
	margin:0;
}
.site-title p{
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.075em;
	line-height: 20px;
	margin:0;
}
@media screen and (max-width:767px){
	.site-title h1 {
		letter-spacing: 0.075em;
		line-height: 19px;
	}
	.site-title p {
		letter-spacing: 0.075em;
		line-height: 19px;
	}	
}

/* header
============================================*/

/* ナビゲーション
---------------------------------------- */
#header,
#header-top {
	padding-left: 30px;
	padding-right: 30px;
}
.navigation {
	letter-spacing: -1rem;
	z-index: 5;
    position: fixed;
    top: 20%;
    left: 30px;
    visibility: hidden;
    opacity: 0;
    -moz-opacity: 0; /* for Firefox */
    -khtml-opacity: 0;
    filter: alpha(opacity=0); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=0)"; /* for IE8 and IE9 */
    transition: all .3s;
    -webkit-transition: all .3s; /* for iOS and Chrome */
    -moz-transition: all .3s; /* for Firefox */
    -ms-transition: all .3s; /* for IE */
    display: block;
}
.navigation ul {
	display: inline-block;
	width: 100%;
	font-size: 0;
}
.navigation li {
	display: block;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
	position: relative;
	transition: all .4s;
	line-height: 40px;
	letter-spacing: normal;
}
.navigation li a,
.navigation li a:visited {
	color: #fff;
}
.grobal {
	margin-bottom: 40px;
}
.menu-overlay {
	z-index: 4;
}
.sns h3 {
	color: #333;
}
.sns p a,.sns p a:link,.sns p a:visited,.sns p a:active,.sns p a:hover {
	color: #fff;
}


/* common
--------------------------------------------*/
.section {
	max-width: 100%;
	padding: 0 50px;
	margin: 0 auto;
	overflow: hidden;
}
.section_inner {
	max-width: 1440px;
	height: auto;
	padding: 120px 0;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
}
@media screen and (max-width:767px) {
	.section {
		padding: 0 30px;
	}
	.section_inner {
		padding: 80px 0;
	}
}
.section-title{
	font-size: 13px;
	padding: 0;
	letter-spacing: 0.1em;
	margin-bottom: 20px;
}
.more {
	display: block;
}
@media screen and (max-width:991px) {
	#blog .more {
		display: block;
		padding-right: 50px;
	}
}
@media screen and (max-width:767px) {
	#blog .more {
		display: block;
		padding-right: 30px;
	}
}
.more-btn {
	letter-spacing: .05em;
	font-size: 14px;
	width: 80px;
	float: right;
}
.more-btn img {
	transition: all .2s ease-out;
	-webkit-transition: all .2s ease-out; /* for iOS and Chrome */
	transform: translateX(0);
	-webkit-transform: translateX(0); /* for iOS and Chrome */
	-moz-transform: translateX(0); /* for Firefox */
	-ms-transform: translateX(0); /* for IE */
	vertical-align: middle;
	margin-left: 10px;
}
.more-btn:hover img {
	transform: translateX(10px);
	-webkit-transform: translateX(10px); /* for iOS and Chrome */
	-moz-transform: translateX(10px); /* for Firefox */
	-ms-transform: translateX(10px); /* for IE */
}
.prev-news-btn .more-btn {
	float: none;
}
.prev-news-btn .more-btn img {
	margin-left: 0;
	margin-right: 10px;
}
.prev-news-btn .more-btn:hover img {
	transform: translateX(-10px);
	-webkit-transform: translateX(-10px); /* for iOS and Chrome */
	-moz-transform: translateX(-10px); /* for Firefox */
	-ms-transform: translateX(-10px); /* for IE */
}
.prev-news-btn, .back-btn ,.next-news-btn {
	width: calc(100% / 3);
	display: inline-block;
}
.prev-news-btn{
	text-align: left;
}
.back-btn {
	text-align: center;
}
.back-btn a, .back-btn a:link, .back-btn a:visited, .back-btn a:active, .back-btn a:hover {
	color: #9e8711;
}
.back-btn a {
	width: 160px;
	border:1px #9e8711 solid;
	height:40px;
	display:block;
	margin-left:auto;
	margin-right:auto;
	padding: 5px 0 0 0;
}
@media screen and (max-width:575px) {
	.back-btn a {
		width: 100px;
	}
}
.next-news-btn{
	text-align: right;
}
.prev-news-btn a, .prev-news-btn a:link, .prev-news-btn a:visited, .prev-news-btn a:active, .prev-news-btn a:hover {
	color: #9e8711;
}
.next-news-btn a, .next-news-btn a:link, .next-news-btn a:visited, .next-news-btn a:active, .next-news-btn a:hover {
	color: #9e8711;
}
.next-news-btn .more-btn {
	text-align: right;
}
#blog-single.section,#blog-single .section_inner {
	overflow: visible;
}


/* blog
--------------------------------------------*/
#news {
	background: #efcacf;/*#ffc2e1;*/
}

/* TOP スライド用 設定 */
#news.section {
	padding: 0 50px;
}
@media screen and (max-width:991px) {
	#news.section {
		padding: 60px 0 50px 60px;
	}
}
@media screen and (max-width:767px) {
	#news.section {
		padding: 0 0 0 30px;
	}
}
#news .more a, #news .more a:link, #news .more a:visited, #news .more a:active, #news .more a:hover {
	color: #9e8711;
}
#news .more-btn {
	text-align: right;
}
#blog-archive {
	background: #efcacf;/*#ffc2e1;*/
}
#blog-single {
	background: #efcacf;/*#ffc2e1;*/
}
#blog-single.section {
	padding: 60px 50px 0;
}
@media screen and (max-width:767px) {
	#blog-single.section {
		padding: 60px 30px 0;
	}
}
@media screen and (min-width:768px) {
	#blog-single .section_inner{
		max-width: 640px;
	}
}
#news h2{
 color: #ff0038; 
}
.blog-title {
	width:100%;
  margin: 0 auto;
}
.blog-title img {
	width: 150px;	
}
.blog-item {
	display: block;
	width: 25%;
	height: auto;
	float: left;
	padding: 0 25px;
	margin: 0 0 80px 0;
}
.main .blog-item {
	width: 100%;
	padding: 0;
}
.blog-item a{
	display: block;
	height: auto;
	text-decoration: none;
	color: #333;
}
.blog-item_txt{
	font-weight: 700;
}
.blog-item_txt .date {
	font-size: 12px;
	padding: 0 4px;
	color:#fff;
	background: #333;
}
.blog-item_txt .title {
	font-size: 14px;
	padding: 2px 4px;
	background: #fff;
}
.bg-white {
	background-color: #fff;
}
@media screen and (max-width:991px) {
	.blog-item {
		padding: 0 15px;
		width: 33.3333%;
	}
}
@media screen and (max-width:768px) {
	.blog-item {
		padding: 0 15px;
		width: 50%;
	}
}
@media screen and (max-width:539px) {
	.blog-item {
		padding: 0;
		width: 100%;
	}
}
#blog-archive .blog-item {
	height: 440px;
}
#blog-archive .blog-item img {
	width: 100%;
    height: 300px;
	object-fit: contain;
}
#news .blog-item img {
	width: 100%;
	height: 300px;
	object-fit: contain;
}

/* news_post */
.post-meta {
	margin: 10px 0 0 0;
	display: block;
	overflow: hidden;
}
.post-cat {
	display: block;
	float: left;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	color: #fff;/* black */
}
.post-date {
	display: block;
	float: right;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .04em;
	color: #fff;
}
.post-title h3 {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	color: #f22fbb;/* pink */
}
h2.post-title {
	color: #f22fbb;/* pink */	
}
.post-title-date {
	color: #9e8711; /* khaki */
}
.post-excerpt {
	font-size: 12px;
	letter-spacing: .04em;
	color: #333;
	font-feature-settings: "palt";
	text-align: justify;
	text-justify: inter-ideograph;/* IE */
}


/* news -- single */
.post-title {
	margin: 0;
	font-size: 24px;
	font-weight: 600;
	letter-spacing: .04em;
}
.prev-news-btn {
	float:left;
}
.next-news-btn {
	float:right;
}
.news-btn_txt{
	display: block;
	font-size: 11px;
}
@media screen and (max-width:767px) {
	.prev-news-btn {
		position: relative;
	    float:left;
	}
	.next-news-btn {
		position: relative;
		float: right;
	}
}


/* works	
--------------------------------------------*/
.works-item {
	display: block;
	width: 33.33%;
	padding: 30px 15px;
	float: left;
	overflow: hidden;
}
@media screen and (max-width:767px) {
	.works-item {
		display: block;
		width: 50%;
		padding: 30px 0;
		float: left;
		overflow: hidden;
	}
}
/* サムネイルサイズ */
.works-item div img {
	max-width: 300px;
	margin-left: auto;
	margin-right: auto;
}
.works-item_img {
	overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
	max-width: 300px;
	margin: 0 auto;
}
.works-item_img img {
	display: block;
	transition-duration: 0.3s;	/*変化に掛かる時間*/
	margin: 0 auto;
}
.works-item_img img:hover {
	transform: scale(1.1);	/*画像の拡大率*/
	-webkit-transform: scale(1.1); /* for iOS and Chrome */
	-moz-transform: scale(1.1); /* for Firefox */
	-ms-transform: scale(1.1); /* for IE */
	transition-duration: 0.3s;	/*変化に掛かる時間*/
	-webkit-transition-duration: 0.3s; /* for iOS and Chrome */
	-webkit-backface-visibility: hidden; /* for iOS and Chrome */
	backface-visibility: hidden;	
}
.buruburu-hover:hover {
    display: inline-block;
    animation: hurueru .4s  infinite;
}
@keyframes hurueru {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(2px, 2px) rotateZ(1deg)}
    50% {transform: translate(0px, 2px) rotateZ(0deg)}
    75% {transform: translate(2px, 0px) rotateZ(-1deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}


/* exhibitions
--------------------------------------------*/
#exhibitions {
	clear: both;
	min-height: 500px;
	background: #9e8711; /* khaki */
}
#exhibitions .section-title {
	color: #f3cbdf;
}
.exhibitions-item {
	display: block;
	width: 50.0%;
	padding: 30px 15px;
	float: left;
	overflow: hidden;
}
@media screen and (max-width:767px) {
	.exhibitions-item {
		display: block;
		width: 100%;
		padding: 30px 0;
		float: none;
		overflow: hidden;
	}
}
#exhibitons-archive {
	background: #9e8711; /* khaki */
}
#exhibitions .more-btn {
	color: #fff;
}


/* profile
--------------------------------------------*/
#profile {
	position: relative;
	background-color: #373737;
	background-image: url("../images/bg_gray3.png");
	background-size: auto;
	background-repeat: repeat;
	background-position: 0 0;
	overflow: hidden; /* float高さ認識 */
}
#profile.section {
	padding: 0;
}
#profile .bg-layer {
	position: relative;
	background-image: url("../images/img_bg-5.png");
	background-size: 1200px auto;
	background-repeat: no-repeat;
	background-position: -320px 30px;
	overflow: hidden; /* float高さ認識 */
	padding: 0 50px;
	z-index: 1;
}
@media screen and (min-width:1440px) {
	#profile .bg-layer {
		background-size: 80% auto;
	}
}
@media screen and (max-width:767px) {
	#profile .bg-layer {
		background-position: -500px 30px,0 0;
		padding: 0 30px;
	}
}
#profile h2{
	color: #fff;
	margin-top: 60px;
}
@media screen and (max-width:575px) {
	#profile h2{
		margin-top: 40px;
	}
}
.profile_text {
	float: left;
	display: block;
	width: 50%;
/* 	background-color: #fff; */
	padding:20px 20px 20px 0;
}
@media screen and (max-width:767px){
	.profile_text {
		float: none;
		width: 100%;
		padding-bottom: 40px;
	}
}

.profile_img {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 60%;
	height: 300px;
	overflow: hidden;
}
.profile_img img {
	width: 100%;
	position: absolute;
	top: 47%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%); /* for iOS and Chrome */
	-moz-transform: translate(-50%,-50%); /* for Firefox */
	-ms-transform: translate(-50%,-50%); /* for IE */
	vertical-align: bottom;
}
@media screen and (max-width:991px){
	.profile_img {
		width: 100%;
	}
	.profile_img img {
		width: 100%;
	}
}
/*
.bg {
	animation:slide 3s ease-in-out infinite alternate;
	background-image: linear-gradient(-60deg, #f5f7c8,50%, #e98ebc 50%);
	bottom:0;
	left:-50%;
	opacity:.5;
	position:absolute;
	right:-50%;
	top:0;
	z-index:-1;
}
.bg2 {
  animation-direction:alternate-reverse;
  animation-duration:4s;
}

.bg3 {
  animation-duration:5s;
}
*/

@keyframes slide {
	0% {
		transform:translateX(-25%);
		-webkit-transform:translateX(-25%); /* for iOS and Chrome */
		-moz-transform:translateX(-25%); /* for Firefox */
		-ms-transform:translateX(-25%); /* for IE */
	}
	100% {
		transform:translateX(25%);
		-webkit-transform:translateX(25%); /* for iOS and Chrome */
		-moz-transform:translateX(25%); /* for Firefox */
		-ms-transform:translateX(25%); /* for IE */
	}
}

/* 200331  cloud animation */
.cloud-sm {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
}
.cloud-lg {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
}

/* SVG */
.fuwa-lg {
	position: absolute;
	top: -300px;
	right: -200px;
	width: 500px;
	height: 500px;
}
.fuwa-sm {
	position: absolute;
	bottom: -200px;
	left: -200px;
	width: 400px;
	height: 400px;
}
@media screen and (min-width:768px) {
	.fuwa-lg {
		position: absolute;
		top: -350px;
		right: -200px;
		width: 600px;
		height: 600px;
	}
	.fuwa-sm {
		position: absolute;
		bottom: -250px;
		left: -200px;
		width: 500px;
		height: 500px;
	}
}
.fuwa-lg-1 {
	width: 500px;
	height: 500px;
}
.fuwa-sm-1 {
	width: 400px;
	height: 400px;
}
.fuwa-lg-2,
.fuwa-sm-2 {
	visibility: hidden;
	-moz-visibility: hidden; /* for Firefox */
	-webkit-visibility: hidden; /* for iOS and Chrome */
}

.is-fixed {
	position: fixed;
}

/* ハンバーガーメニュー（）
============================================*/
.icon {
	position: fixed;
	right: 20px;
	top: 20px;
	width: 48px;
	height: 48px;
	z-index: 5;
}
.icon a {
	width: 48px;
	height: 48px;
	z-index: 5;
}
.icon_inner {
	position: absolute;
	top: 15.5px;
	left: 0;
	right: 0;
	width: 36px;
	height: 17px; 
	margin: 0 auto;
}
.icon_inner span {
	position: absolute;
	width: 100%;
	height: 1px;
	background: transparent;
	border-radius: 1px;
	transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out; /* for iOS and Chrome */
}
#header-top .icon_inner span {
	background: #222;
}
.icon_inner span:nth-of-type(1) {
	top: 0;
}
.icon_inner span:nth-of-type(2),
.icon_inner span:nth-of-type(3) {
	top: 8px;
}
.icon_inner span:nth-of-type(4) {
	bottom: 0;
}
#menubtn.is-change .icon_inner span:nth-of-type(1) {
	opacity: 0;
    -moz-opacity: 0; /* for Firefox */
    -khtml-opacity: 0;
    filter: alpha(opacity=0); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=0)"; /* for IE8 and IE9 */
}
#menubtn.is-change .icon_inner span:nth-of-type(2) {
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg); /* for iOS and Chrome */
	-ms-transform: rotate(45deg); /* for IE */
	-moz-transform: rotate(45deg); /* for Firefox */
	transform-origin: center;
	-webkit-transform-origin: center; /* for iOS and Chrome */
	-ms-transform-origin: center; /* for IE */
	-moz-transform-origin: center; /* for Firefox */
}
#menubtn.is-change .icon_inner span:nth-of-type(3) {
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg); /* for iOS and Chrome */
	-ms-transform: rotate(-45deg); /* for IE */
	-moz-transform: rotate(-45deg); /* for Firefox */
	transform-origin: center;
	-webkit-transform-origin: center; /* for iOS and Chrome */
	-ms-transform-origin: center; /* for IE */
	-moz-transform-origin: center; /* for Firefox */
}
#menubtn.is-change .icon_inner span:nth-of-type(4) {
	opacity: 0;
    -moz-opacity: 0; /* for Firefox */
    -khtml-opacity: 0;
    filter: alpha(opacity=0); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=0)"; /* for IE8 and IE9 */
}


/* javascript
---------------------------------------- */
.is-hidden {
	display: none;
}
.is-fadeout {
	opacity: 0;
    -moz-opacity: 0; /* for Firefox */
    -khtml-opacity: 0;
    filter: alpha(opacity=0); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=0)"; /* for IE8 and IE9 */	
}
.is-fadein {
	opacity: 1;
    -moz-opacity: 1; /* for Firefox */
    -khtml-opacity: 1;
    filter: alpha(opacity=100); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=100)"; /* for IE8 and IE9 */
}
.is-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #efcacf;
	transition: all .3s;
	-webkit-transition: all .3s; /* for iOS and Chrome */
}
.navigation.is-open {
	opacity: 1;
    -moz-opacity: 1; /* for Firefox */
    -khtml-opacity: 1;
    filter: alpha(opacity=100); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=100)"; /* for IE8 and IE9 */
	pointer-events: auto;
	visibility: visible;
}
#page #site-logo.is-brond,
#mv #site-logo.is-brond {
	fill: #9e8711;
}

/* fancybox */
.fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, .fancybox-show-caption .fancybox-caption, .fancybox-show-nav .fancybox-navigation .fancybox-button {
	transition: .25s linear;
	-webkit-transition: .25s linear; /* for iOS and Chrome */
}
.fancybox-show-infobar:hover .fancybox-infobar:hover, .fancybox-show-toolbar:hover .fancybox-toolbar:hover, .fancybox-show-caption:hover .fancybox-caption:hover, .fancybox-show-nav:hover .fancybox-navigation:hover .fancybox-button:hover {
	opacity: 0.8;
    -moz-opacity: 0.8; /* for Firefox */
    -khtml-opacity: 0.8;
    filter: alpha(opacity=80); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=80)"; /* for IE8 and IE9 */
}

#page #site-logo {
	fill: #efcacf;
}
.fancybox-caption__body {
	height: auto;
	min-height: 42px;
}
.fancybox-caption {
	color: #efcacf;
}


/*	トップスクロール
--------------------------*/
aside#fix-scroller,
aside#fix-scroller-top {
	display: block;
	color: #333;
    position: absolute;
    top: auto;
    left: 50%;
    bottom: 15px;
    width: 10px;
    height: 77px;
    background-color: transparent;
    z-index: 2;
    -webkit-backface-visibility: "hidden"; /* for iOS and Chrome */
    backface-visibility: "hidden";
    -webkit-tap-highlight-color: transparent; /* for iOS and Chrome */
    opacity: 1;
    -moz-opacity: 1; /* for Firefox */
    -khtml-opacity: 1;
    filter: alpha(opacity=100); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=100)"; /* for IE8 and IE9 */
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%); /* for iOS and Chrome */
    -ms-transform: translateX(-50%); /* for IE */
    -moz-transform: translateX(-50%); /* for Firefox */
    overflow: hidden;
    cursor: pointer;
	transition: .6s ease-in-out;
}
#aside-anim {
    position: absolute;
    top: 0;
    left: 5px;
    width: 1px;
    height: 40px;
    background-color: transparent;
    z-index: 1;
    overflow: hidden;
}
#aside-anim-in {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 40px;
    background-color: #333;
    z-index: 1;
    opacity: .4;
    -moz-opacity: .4; /* for Firefox */
    -khtml-opacity: .4;
    filter: alpha(opacity=40); /* for IE6 and IE7 */
    -ms-filter: "alpha(opacity=40)"; /* for IE8 and IE9 */
}
#aside-anim-in::before {
	content: '';
	display: block;
	width: 1px;
	height: 100%;
	background: #666;
	margin: 0 auto;
	padding: 0;
}
#aside-anim-in::after {
	content: '';
	display: block;
	padding: 0;
	width: 1px;
	height: 100%;
	background: #333;
	margin: -40px auto 0;
	-webkit-animation: top_arrow 2.2s cubic-bezier(0.42, 0, 0.58, 1) infinite; /* for iOS and Chrome */
	animation: top_arrow 2.2s cubic-bezier(0.42, 0, 0.58, 1) infinite;	
}
#aside-title {
    position: absolute;
    left: 2px;
    top: 47px;
    -webkit-writing-mode: vertical-rl; /* for iOS and Chrome */
    -ms-writing-mode: tb-rl; /* for IE */
    -moz-writing-mode: vertical-rl; /* for Firefox */
    writing-mode: vertical-rl; /* for Opera */
    font-size: 10px;
    line-height: 10px;
    letter-spacing: .04em;
    color: #333;
}


/* #blog swiper - init
============================================*/
#blog .swiper-container {
	display: none;
}
#blog .swiper-container-initialized {
	display: block;
}
.fancy-exhibitions .fancy-stage{
	background-color: #f3cbdf;
}

/* footer */
#footer {
	background-color:#f22fbb;
	overflow:hidden;
	padding-top:30px;
	padding-bottom:30px;
}
#footer .section-title {
	color: #fff;
	margin-bottom: 10px;
	font-size: 12px;
}
#footer a{
	color: #fff; /* white */
}
#footer .section_inner_left {
	width:50%;
	float:left;
}
#footer .section_inner_right {
	width:50%;
	float:left;
}
@media screen and (max-width:767px){
	#footer .section_inner_left {
		width:65%;
		float:left;
		padding: 0;
	}
	#footer .section_inner_right {
		width:35%;
		float:left;
		padding: 0;
	}
}
.copyright {
  margin-top:30px;
}