@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Lato);
/*@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);*/
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans);
/* Reset */
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display:block;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:''; content:none;}
table {border-collapse:collapse; border-spacing:0;}

body {font-size:10px; line-height:2.25; color:#555; font-family:"NOW-GM", sans-serif}
a {color:#555; word-break:break-all;}
a i {font-family:serif;}
hr {height:1px; background-color:#ccc; width:100%; border:none; margin:30px auto 0px;}

@media (max-width:640px) {
	hr {width:96%;}
}

header {margin:5px auto 0; overflow:hidden; width:100%; max-width:600px; background-color:rgba(255, 255, 255, 0.8); position:fixed; top:0; left:0; right:0; z-index:3;}
header div {margin:0px 10px 5px;}
header h1 {float:left; display:inline-block; margin:0 10px 0 0; font-size:14px;}
nav li {float:left; display:inline-block; margin:0 5px; line-height:31.5px;}
/*nav a {text-decoration:none; border-bottom:1px solid #ccc; padding-bottom:2px;}*/

section {width:100%;}
#animation {position:fixed; margin:-30vh 0 0; height:200px; z-index:1;}
#contents {margin:50vh auto 50px; padding:50px 0; max-width:600px; background-color:rgba(255, 255, 255, 0.8); z-index:2; position:relative;}
#contents h2 {text-align:left; margin:0 10px 20px; font-weight:bold; padding:50px 0 0; font-size:14px;}
#contents em {font-family:"UD Shin Go Medium", sans-serif; font-weight:bold;}
#contents p {margin:0 10px 50px;}
#contents dl {margin:0 10px 50px;}
#contents dt {float:left; overflow:hidden; clear:both; margin-bottom:5px;}
#contents dt:first-child {display:block; float:none;}
#contents dd {margin-left:4.5em; overflow:hidden; margin-bottom:5px;}
#contents .exhibition dd {margin-left:5em;}
.btn {display:block;}
.xbtn {display:inline-block; padding:10px 20px; margin:0 10px 10px 0; border:1px solid #ccc; text-decoration:none; float:left; width:32vw;}
.xbtn:hover {background:#eee;}
#contents p span.more {display:none;}
#contents p a.more-btn {text-align:right; display:block;}
#contents p a.less-btn {text-align:right; display:block;}

/* Circle Animation */
.animation-001 {font-size:100px; width:1em; height:1em; margin:0; position:absolute; border-radius:50%; left:50%; top:150px;}
.animation-001 li {position:absolute; border-radius:50%; opacity:0.4;}
.animation-001 li:nth-child(1) {background:#ccc; transform-origin:30% -30%; -webkit-transform-origin:80% -80%; animation:animation-001-rotate 2.00s linear infinite; -webkit-animation:animation-001-rotate 2.50s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(2) {background:#ccc; transform-origin:35% -35%; -webkit-transform-origin:85% -85%; animation:animation-001-rotate 2.10s linear infinite; -webkit-animation:animation-001-rotate 2.60s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(3) {background:#ffff33; transform-origin:40% -40%; -webkit-transform-origin:90% -90%; animation:animation-001-rotate 2.20s linear infinite; -webkit-animation:animation-001-rotate 2.70s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(4) {background:#33ff66; transform-origin:45% -45%; -webkit-transform-origin:95% -95%; animation:animation-001-rotate 2.30s linear infinite; -webkit-animation:animation-001-rotate 2.80s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(5) {background:#ccc; transform-origin:50% -50%; -webkit-transform-origin:100% -100%; animation:animation-001-rotate 2.40s linear infinite; -webkit-animation:animation-001-rotate 2.90s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(6) {background:#cc33ff; transform-origin:55% -55%; -webkit-transform-origin:105% -105%; animation:animation-001-rotate 2.50s linear infinite; -webkit-animation:animation-001-rotate 3.00s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(7) {background:#6699ff; transform-origin:60% -60%; -webkit-transform-origin:110% -110%; animation:animation-001-rotate 2.60s linear infinite; -webkit-animation:animation-001-rotate 3.10s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(8) {background:#ff3399; transform-origin:65% -65%; -webkit-transform-origin:115% -115%; animation:animation-001-rotate 2.70s linear infinite; -webkit-animation:animation-001-rotate 3.20s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(9) {background:#ccc; transform-origin:70% -70%; -webkit-transform-origin:120% -120%; animation:animation-001-rotate 2.80s linear infinite; -webkit-animation:animation-001-rotate 3.30s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(10) {background:#ccc; transform-origin:75% -75%; -webkit-transform-origin:125% -125%; animation:animation-001-rotate 2.90s linear infinite; -webkit-animation:animation-001-rotate 3.40s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(11) {background:#ff9900; transform-origin:80% -80%; -webkit-transform-origin:130% -130%; animation:animation-001-rotate 3.00s linear infinite; -webkit-animation:animation-001-rotate 3.50s linear infinite; width:0.8em; height:0.8em;}
.animation-001 li:nth-child(12) {background:#ccc; transform-origin:185% -185%; -webkit-transform-origin:135% -135%; animation:animation-001-rotate 3.10s linear infinite; -webkit-animation:animation-001-rotate 3.60s linear infinite; width:0.8em; height:0.8em;}

@-webkit-keyframes animation-001-rotate {
	to {-webkit-transform:rotate(360deg);}
}

@keyframes animation-001-rotate {
	to {transform:rotate(360deg);}
}

/* Background Animation 
body {width:100%; height:100vh; background:linear-gradient(90deg, #3bade3,#9844b7,#44ea76); background-size:300% 300%; animation: bggradient 20s ease infinite;}
  
  @keyframes bggradient{
	0% {background-position:0% 50%;}
	50% {background-position:100% 50%;}
	100% {background-position:0% 50%;}
  }
*/