@import https://fonts.googleapis.com/css?family=Arimo:400,700,400italic,700italic;
@font-face{font-family:'roman';src:url(../font/roman_font_7-webfont.woff2) format("woff2"),url(../font/roman_font_7-webfont.woff) format("woff");font-weight:400;font-style:normal;}
html{font-size:200%;}
body{color:#231F20;margin:0;padding:0;width:100vw;letter-spacing:-.025rem;overflow:hidden;overflow-y:scroll;-webkit-overflow-scrolling: touch}
body,input{font:.9em/1.2 Arimo,sans-serif;}
body{background:url(/lib/gfx/FINAL-star-white-RGB.png);background-attachment:fixed;background-position:center center;}
*,:before,:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;vertical-align:top;}
/* ----------- markup ----------- */
ul{list-style:none;}
a{color:#231F20;text-decoration:none;border-bottom:.1em solid transparent;}
a:hover, a.ul{border-bottom:.1em solid;}

a.ul:hover{border-bottom:.1em solid transparent; }
a.button{padding:.2rem .7rem;border:1px solid;border-radius:1rem;text-align:center;display:inline-block;}
.no-touch a {}
.touch a {}
h1,h2,h3,h4,h5{margin-bottom:1em;font-weight:400;}
h1{font-size:140%;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff;}
h2{font-size:120%;font-weight:700;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff;}
h3{font-size:120%;}
h4{font-size:100%;text-decoration:underline;}
h5{font-size:110%;}
h6{font-size:90%;}
strong{font-weight:700;}
em{font-style:italic;}
ul{list-style:none;}
small{font-size:80%;}
main{position:absolute;width:200vw;height:100vh;left:-8rem;transition:left .5s;}
main .hn{display:none;}
.show-nav main{left:0;}
.show-nav .hn{display:inline-block;}
.show-nav .sn{display:none;}
/* ----------- nav ----------- */
nav{display:inline-block;width:12rem;height:100vh;cursor:pointer;color:#fff;font-size:100%;position:relative;}
nav .nav-inner{position:fixed;width:12rem;height:100%;box-shadow:0 0 2em #000;background:url(/lib/gfx/full_menu_left.png) left bottom;z-index:12;top:0;}

nav .nav-inner a {opacity:0;transition:opacity .5s}
.show-nav nav .nav-inner a {opacity:1;}
#mbt {pointer-events: none}

nav #nav-wrapper a{color:#fff;}
nav .nav-header .sn{margin-left:.5rem;border-top:2px solid #fff;border-bottom:2px solid #fff;width:1rem;height:1rem;position:relative;}
nav .nav-header .sn:before{content:'';width:1rem;position:absolute;top:.4rem;border-top:2px solid #fff;left:0;}
nav .nav-header .hn{}
nav #home{position:absolute;bottom:3rem;left:1rem;width:2rem;}
article{display:inline-block;margin:1rem;padding-bottom:10em;width:100vw;}
header{text-align:center;width:30rem;line-height:1;}
/* ----------- footer ----------- */
footer{pointer-events:none;position:fixed;width:100%;bottom:0;height:5rem;background:#def;background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);z-index:5;}
@keyframes animatedBackground {
from{background-position:0 bottom;}
to{background-position:-1920px bottom;}
}
footer .mountains{position:absolute;width:100%;height:100%;bottom:0;}
.m1{background:url(../gfx/m1.svg) repeat-x -1px bottom;animation:animatedBackground 2400s linear infinite;}
.m2{background:url(../gfx/m2.svg) repeat-x -1px bottom;animation:animatedBackground 800s linear infinite;}
.m3{background:url(../gfx/m3.svg) repeat-x -1px bottom;animation:animatedBackground 400s linear infinite;}
.m1{background:url(../gfx/m1.svg) repeat-x -1px bottom;}
.m2{background:url(../gfx/m2.svg) repeat-x -1px bottom;}
.m3{background:url(../gfx/m3.svg) repeat-x -1px bottom;}
blockquote{padding-left:1rem;color:#000;position:relative;}
blockquote:before{position:absolute;content:'\2014';margin-left:-1rem;}
/* ----------- helpers ----------- */
.c0,.c1,.c2,.c3,.c4,.c-3,.c-6{display:inline-block;vertical-align:top;}
.c0{width:12.5%;}
.c1{width:25%;}
.c2{width:50%;}
.c3{width:75%;}
.c4{width:100%;}
.pd{padding:1rem;}
.ph{padding:0 1rem;}
.pv{padding:1rem 0;}
.pr{position:relative;}
.mb{margin-bottom:1rem;}
.pr{padding-right:1rem;}
.pl{padding-left:1rem;}
.pb{margin-bottom:.05rem;}
.bb{border-bottom:.1em solid;margin-bottom:.5rem;}
.m{font-size:200%;}
.l{font-size:400%;}
.el{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.small{font-size:90%;}
.big{font-size:120%;}
.xl{font-size:800%;}
.max{max-width:18em;}
.wbg{background:#fff;}
.rgt{text-align:right;}
.caption{display:block;font-size:90%;padding:.5em 0;}
.itmz{margin:1em 0;}
.itmz.txt{margin:0 0 2em;}
.read{}
.hidden{display:none;}
.show-mobile{visibility:hidden;}
.locs{margin:1em 0;}
.itmz{font-size:80%;}
.itmz.txt section.cols{column-count:2;column-gap:2rem;}
.itmz.txt section.big{font-size:125%;}
.itmz img{max-width:100%;}
.ctr{text-align:center;}
.bg-img{padding-top:75%;background-position:center center;background-size:contain;display:block;margin-bottom:.5rem;background-repeat:no-repeat;}
.shade{border:1px solid;background-size:cover;box-shadow:0 0 1em .2em #231F20;}


.prt.t2{position:relative;}
.prt.t2 .bg-img{background-size:contain;background-size:contain;border:0;box-shadow:none;}
.r50{padding-top:50%;}
.bx{height:8rem;margin-bottom:2rem;overflow-y:hidden;line-height:.9rem;}
.more{display:block;font-size:80%;text-align:center;}
.sv{width:29rem;}
.sv .itmz.img{padding:1.5rem 3rem;}
.sv .itmz.img img{box-shadow:0 0 1.5em .5em #231F20;display:block;margin-bottom:.5rem;}
.lv{width:30rem;}
.lv.prt{width:33rem;}
.lv.prt h3{margin:0;}
.lv .c1{width:14rem;font-size:80%;}
.lv.prt .c1{width:11rem;}
.lv.prt a:hover,.sb a:hover,#mnr a{border:none;}


#mnr a {padding: .5rem;
    display: block;
    margin-left: -.5rem;
    margin-top: -.5rem;
    border-radius: 1rem;}
    
   .shake-me {pointer-events: none;}
.lv.blg .c1{padding-right:0;}
.lv .itmz.img img{box-shadow:0 0 1em .2em #231F20;display:block;margin-bottom:.5rem;}
.glow{position:relative;z-index:1;}
.glow:after{content:'';position:absolute;width:calc(100% - 2rem);height:calc(100% - 2rem);top:1rem;left:1rem;background:rgba(255,255,255,.6);box-shadow:0 0 2rem 1rem rgba(255,255,255,.6);border-radius:2rem;z-index:-1;}
.fixdiv{position:relative;width:100%;overflow:hidden;margin:10px 0;}
.fixdiv-inner{position:absolute;top:0;bottom:0;left:0;right:0;}
.fixdiv-spacer{padding-top:75%;}
iframe{border:0;width:100%;height:100%;}
.schedule{border:1px solid;display:table;margin:2rem 0;position:relative}
.schedule .c1{border:1px solid;text-align:center;width:25%;height:5rem;position:relative;}
.schedule .c1.d {overflow:hidden;}

.schedule .month{font-family: roman,Arimo,sans-serif;
    text-transform: uppercase;
    background: #f4eacf;
    border-radius: 1em;
    border: 1px solid #ccc;
    height: 100%;
    box-shadow: inset -.5em -.3em 1em 0 #231F20;
    overflow: hidden;
    position: absolute;
    width: 100%;
    padding: 2rem;}
.schedule .day{    height: 100%;
    display: table-cell;
    vertical-align: middle;
    font-size: 80%;
    width: 100%;
    position: absolute;}
.schedule .day a {border:none;display:block;cursor:pointer;}

.no-touch .schedule .day a:hover {border:none;}
/*.no-touch .schedule .glow:hover:after{display:none;}*/
.mm {height:1.6rem;}
.mnb {background: url(../gfx/FINAL-star-white-RGB_mobile.png);
    background-attachment: fixed;
    background-position: top center;

    position: fixed;
    top: 0;
    left: 0;
    padding: 1rem 1rem 0;
    width: 100%;
    z-index: 10;transition:left .5s}
    
    .mnb a {border:0;}
    
    .show-nav .mnb{left:100vw;}
/* ----------- custom ----------- */
#grid{pointer-events:none;position:fixed;width:100vw;height:100vh;z-index:1000;background-size:1rem 1rem;background-image:linear-gradient(to right,rgba(0,255,0,.2) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,255,0,.2) 1px,transparent 1px);}
#nav-wrapper{}
#nav-wrapper ul li{min-height:1.2rem;}
#mnl{position:fixed;bottom:0;z-index:-1;width:10em;height:300px;}
#mnr{position:fixed;right:1em;top:1rem;z-index:100;width:7rem;font-size:90%;}
#mnl li,#mnr li{display:inline-block;padding:.5rem;margin:.1rem;background:#f4eacf;border-radius:4 rem;border:1px solid #000;}
#mnl a,#mnr a{}
#msg{position:absolute;bottom:0;right:20rem;padding:.5em;background:rgba(0,0,255,.1);font-size:75%;z-index:1000;}
#mbt{position:absolute;top:0;right:0;width:4rem;text-align:center;}
#hdr{position:fixed;right:1rem;top:.4rem;text-align:center;font-size:80%;line-height:1;}


a.file{    display: block;border:0;}
a.file em{    display: inline-block;
    height: 5em;
    width: 4em;
    margin-right: 1em;
    background: url(../gfx/png2-08.png) no-repeat;
    background-size: contain;
    vertical-align: middle;}


/* ----------- overlay ----------- */
#overlay{position:fixed;top:20vh;left:8rem;width:26rem;padding:1rem 0 0 1rem;border:1px solid;height:calc(80vh + 2rem);border-radius:1em;background:#f4eacf;box-shadow:inset -.5em -.3em 1em 0 #231F20;font-size:90%;overflow-y:auto;z-index:1;}
#overlay .overlay-header{min-height:8rem;margin-bottom:10rem}
#overlay .aside-image{width:10rem;float:right;padding-top:32.5%;margin-left:1rem;}
#overlay .aside-image.T2{background-size: contain;box-shadow: none;border:none}



#overlay .overlay-inner{height:100%;overflow:auto;margin:0 .5rem 0 1rem;padding-right:2.5rem;padding-top:.7rem;}
#overlay h4{margin-bottom:1rem;font-weight:400;display:inline-block;max-width:45%;}
/* ----------- viewbox ----------- */
#viewbox{position:fixed;top:calc(20vh - 1rem);left:9rem;width:26rem;padding:1rem 0 0 1rem;border:1px solid;height:calc(80vh + 2rem);border-radius:1em;background:#f4eacf;box-shadow:inset -.5em -.3em 1em 0 #231F20;font-size:90%;overflow-y:auto;z-index:10;display:none;}
#viewbox .viewbox-inner{margin-right:3rem;}
#viewbox img{width:100%;}
#alphabet{position:fixed;left:5.3rem;top:2.5rem;position:fixed;z-index:1;padding:.2em;width:32.3rem;text-align:center;transition:top .5s;}
#alphabet.scrolled{background:rgba(255,255,255,.1);background:url(/lib/gfx/FINAL-star-white-RGB.png);border-bottom:1px solid;left:5.3rem;top:0;}
#alphabet .c{display:inline-block;vertical-align:top;cursor:pointer;width:1.2rem;text-align:center;}
#alphabet .c.active{color:red;}
#alphabet .alphabet-cookie{position:absolute;z-index:-1;width:1.2rem;height:1.2rem;border-radius:1rem;background:rgba(244,234,207,1);box-shadow:inset -.1em -.1em .5em 0 #231F20;border:1px solid #231F20;transition:left .5s;margin-left:0;margin-top:-.1rem;}
#fortune-cookie{position:fixed;right:0;bottom:0;width:14em;background:url(../gfx/cookie.png);background-size:contain;background-repeat:no-repeat;z-index:10;}
#fortune-cookie .cookie-inner{font-family:roman,Arimo,sans-serif;text-align:center;border-radius:3em;padding:2em 3em 3em 3em;font-size:80%;}
.swpr{position:relative;padding-top:75%;overflow:hidden;}
.swiper-wrapper{position:absolute;top:0;}
.swiper-slide{background-size:cover;background-position:center center;background-repeat:no-repeat;background-color:#fafafa;height:auto;}
.swiper-slide .txt{position:absolute;bottom:0;padding:1em;background:#fff;margin:1em;display:none;}
.swiper-container-horizontal>.swiper-pagination{bottom:0;height:1em;}
.swiper-button-next,.swiper-button-prev{background-size:14px 20px;display:none;background-color:rgba(255,255,255,.5);width:3em;}
.swiper-button-next{right:0;}
.swiper-button-prev{left:0;}
.swpr:hover .swiper-button-next,.swpr:hover .swiper-button-prev{display:block;}
.swiper-pagination{padding-top:.5em;text-align:center;position:relative;}
.swiper-pagination-bullet{width:.5rem;height:.5rem;border:3px solid;margin:0 .1rem;background:none;}
#search-form{position:fixed;bottom:1em;left:1em;z-index:100;background:rgba(244,234,207,1);box-shadow:inset -.5em -.3em 1em 0 #231F20;height:2em;border:1px solid;width:11em;border-radius:1em;}
.close{position:absolute;right:1rem;top:1rem;content:'\d7';cursor:pointer;width:1rem;height:1rem;}
.close:before,.close:after{position:absolute;left:.5rem;top:-.2rem;content:' ';height:1.3rem;width:.05rem;background-color:#231F20;}
.close:before{transform:rotate(45deg);}
.close:after{transform:rotate(-45deg);}
.hn.close:before,.hn.close:after{background-color:#fff;}
.hn.close{right:1.5rem;}
/*img*/
.gs{filter:grayscale(100%);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);}
.gs:hover,.gs:focus{filter:grayscale(0%);-webkit-filter:grayscale(0%);-moz-filter:grayscale(0%);-ms-filter:grayscale(0%);-o-filter:grayscale(0%);}
.link-container:hover .shake-me{-webkit-animation-name:linkQuake;-moz-animation-name:linkQuake;animation-name:linkQuake;-webkit-animation-duration:.8s;-moz-animation-duration:.8s;animation-duration:.8s;-webkit-transform-origin:50% 50%;-moz-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;-moz-animation-timing-function:linear;animation-timing-function:linear;}
@keyframes linkQuake {
0%{transform:translate(2px,1px) rotate(0deg);}
10%{transform:translate(-1px,-2px) rotate(-1deg);}
20%{transform:translate(-3px,0px) rotate(1deg);}
30%{transform:translate(0px,2px) rotate(0deg);}
40%{transform:translate(1px,-1px) rotate(1deg);}
50%{transform:translate(-1px,1px) rotate(-1deg);}
60%{transform:translate(-3px,-2px) rotate(0deg);}
70%{transform:translate(2px,1px) rotate(-1deg);}
80%{transform:translate(-1px,-2px) rotate(1deg);}
90%{transform:translate(2px,-1px) rotate(0deg);}
100%{transform:translate(1px,-2px) rotate(-1deg);}
}
@-moz-keyframes linkQuake {
/* Firefox */
0%{-moz-transform:translate(2px,1px) rotate(0deg);}
10%{-moz-transform:translate(-1px,-2px) rotate(-1deg);}
20%{-moz-transform:translate(-3px,0px) rotate(1deg);}
30%{-moz-transform:translate(0px,2px) rotate(0deg);}
40%{-moz-transform:translate(1px,-1px) rotate(1deg);}
50%{-moz-transform:translate(-1px,1px) rotate(-1deg);}
60%{-moz-transform:translate(-3px,-2px) rotate(0deg);}
70%{-moz-transform:translate(2px,1px) rotate(-1deg);}
80%{-moz-transform:translate(-1px,-2px) rotate(1deg);}
90%{-moz-transform:translate(2px,-1px) rotate(0deg);}
100%{-moz-transform:translate(1px,-2px) rotate(-1deg);}
}
@-webkit-keyframes linkQuake {
/* Safari and Chrome */

0%{-webkit-transform:translate(2px,1px) rotate(0deg);}
10%{-webkit-transform:translate(-1px,-2px) rotate(-1deg);}
20%{-webkit-transform:translate(-3px,0px) rotate(1deg);}
30%{-webkit-transform:translate(0px,2px) rotate(0deg);}
40%{-webkit-transform:translate(1px,-1px) rotate(1deg);}
50%{-webkit-transform:translate(-1px,1px) rotate(-1deg);}
60%{-webkit-transform:translate(-3px,-2px) rotate(0deg);}
70%{-webkit-transform:translate(2px,1px) rotate(-1deg);}
80%{-webkit-transform:translate(-1px,-2px) rotate(1deg);}
90%{-webkit-transform:translate(2px,-1px) rotate(0deg);}
100%{-webkit-transform:translate(1px,-2px) rotate(-1deg);}
}

@keyframes blink {
    0% {opacity: .1;}
    50% {opacity: 1;}
    100% {opacity: .1;}
}
/* search*/

#search-form input{position:absolute;margin:.5em 1em;background:none;border:none;outline:none;width:7em;}
::-webkit-input-placeholder{color:#000;}
:-moz-placeholder{/* Firefox 18- */
color:#000;}
::-moz-placeholder{/* Firefox 19+ */
color:#000;}
:-ms-input-placeholder{color:#000;}
.sm{display:none;}

.blinker {
	position:fixed;
	width:1em;
	height:1em;
	background:#fff;
	border-radius:100%;
	z-index: -1;
	opacity:.5;
	box-shadow: 0 0 1em 1em #fff;
    animation-name:blink;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}

@media screen and (max-width: 1400px) {
	.sv, .lv, header{width:27em;}
	.lv.prt {width: 30rem;}
	.lv.prt .c1{width:8rem;}
	#overlay {z-index:1000;}
	#viewbox {z-index:1001;}
}

@media only screen and (max-width: 740px) {
	html{font-size:1.2em;}
	body{font-size:110%;}
	.hm{display:none;}
	.sm{display:block;}
	body{background-image:url(../gfx/FINAL-star-white-RGB_mobile.png);}
	#hdr,#fortune-cookie,#search-form,footer,#mnr{display:none;}
	a.active{font-weight:700;}
	main{left:-100vw;}
	h1{font-size:100%;font-weight:700;}
	h2{margin-top:.5rem;}
	article{padding:1rem;}
	.pd{padding:0;}
	nav,article{width:100vw;margin:0;}
	nav .nav-inner{box-shadow:none;width:100vw;    height: 100vh;overflow:hidden;}
	nav .hn{display:block;}
	nav .sn{display:none;}
	.sv .c2, .lv .c2{width:100%;padding:0}
	nav #nav-wrapper{padding:1rem;font-size:130%}
	#mnl a{font-size:130%}
	header{text-align:left;line-height:1.4;margin-top:1rem;}
	header,.sv,.lv{width:auto;padding:0;}
	#mnm{border-bottom:1px solid;margin-bottom:1rem;padding-bottom:.5rem;}
	#mnm a{display:block;white-space:nowrap;line-height:1.5rem;}
	#overlay,#viewbox{left:1rem;width:calc(100vw - 2rem);top:3rem;padding:0;height:calc(100vh - 1rem);border-radius:2em;}
	#overlay .overlay-inner,#viewbox .viewbox-inner{margin:1rem 1rem 1rem 1rem;padding:0;padding-right:.5rem;}
	#overlay .aside-image{width:80%;float:none;padding-top:60%;}
	#overlay h4{max-width:none;}
	.schedule .c1{width:50%;}
	.cols,.itmz.txt section.cols{column-count:1;}
	
	#alphabet{padding:0;}
	#alphabet,#alphabet.scrolled{left:0;width:100vw;padding-top:.5rem;}
	#alphabet.scrolled{display:block;top:2.5rem}
	#alphabet .c{font-size:50%;width:.7rem;}
	#alphabet .alphabet-cookie{width:.9rem;height:.9rem;box-shadow:inset -.1em -.1em .2em 0 #555;margin-left:-.1rem;}
	
	
	.lv.prt,.lv.prt .c1{width:100%;margin-top:1rem;}
	.c1.prt{margin-bottom:1rem;}
	.close:before,.close:after{height:1.3rem;}
	.bx{height:7.8rem;}
	#mnl{width: 100vw;position:absolute;}
	.sv .itmz.img {padding: 1rem;}
}

@media only screen and (max-width: 740px) and (orientation: landscape) {
	body.touch {overflow-x:hidden;}
	.touch main {left:0;width:100vw;}
	.touch nav {width:25vw;height:100%;}
	.touch .nav-header {display: none;}
	.touch nav .nav-inner { width: 25vw;    background-size: cover;}
		.touch nav li {     margin-bottom: 3px;line-height: 1;}

	.touch article {width:75vw}
	.touch .mnb, .touch #alphabet {width:75vw;left:25vw;}
	.touch #mnl {display:none;}
	.touch nav #nav-wrapper {    font-size: 90%;}
	.touch #home {bottom:1rem;}
	.touch #home img{width:1.5rem;}
	.touch #overlay, .touch #viewbox {width:75vw;}
	
}