
html{font-size: 62.5%;}
body{font-size:2rem;font-family: 'Shippori Mincho B1', serif;;font-weight: 400;font-style: normal;background: #2a2123;}
html {visibility: hidden;}
html.wf-active {visibility: visible;animation: fadeIn 1s ease 0s 1 normal;}
.fade{animation: fadeIn 0.5s ease 0.5s 1 normal;}
@keyframes fadeIn { 0% {opacity: 0;background: #ae3125;}100% {opacity: 1;background: #2a2123} }

/*setCss*/
h1{margin:0;}
h2{margin: 0;}
h3{margin: 0;}
p{margin: 0;}
figure{margin: 0;padding: 0;}
img{max-width:100%;}
p{line-height:1.6;word-break: break-all;text-align: justify;}
ul,dl,ol,dd{margin: 0;padding: 0;}
a{text-decoration:none;color:#000;word-break: break-all;text-align: justify;}
li,dd{list-style-type: none;line-height: 1.6;}
div{box-sizing:border-box;}
.pc{display:block;}
.sp{display:none;}
.inner{width: 800px;margin: 0 auto;position:relative;height: inherit;}
.shadow{filter: drop-shadow(0 0 5px rgba(0,0,0,1));}
.shadow2{filter: drop-shadow(0 0 5px rgba(86,49,12,1));}

/*Sites*/
#contents{min-width:1080px;}
#main_visual nav{min-width:1080px;}

section{padding: 10rem 0;}
section h2.ttl{font-size:5rem;line-height: 0.7;margin-bottom: 5rem;text-align:center;}
section h2.ttl span{font-size:30%;letter-spacing: 0.25em;font-family: sans-serif;font-weight:normal;}

#main_visual{background: #221a21;padding: 0;}
#main_visual #visual{padding: 0;height: 100vh;width: 100%;position:relative;max-width: 2000px;margin: 0 auto;background: url(../img/main_visual.jpg) center center #2a2123;background-size: cover;}
#main_visual #visual h1{width: 35vw;max-width:700px;left: 3vw;top:3vw;position: relative;}
#main_visual nav{width: 100%;background: #2a2123;color:#fff;bottom:0;position:absolute;}
#main_visual nav ul{display:flex;padding: 2em 0;max-width:1080px;margin: 0 auto;}
#main_visual nav ul li{width: 14.285%;border-right:1px solid #fff}
#main_visual nav ul li:nth-child(8){border-right: none;}
#main_visual nav ul li a{color:#fff;text-align:center;display:block;font-size: 1.7rem;position:relative;}
#main_visual nav ul li a:hover{background: #fff; transition: 0.3s;color:#2a2123; }
#main_visual nav ul li a:before{opacity:0;content: "";}
#main_visual nav ul li a:hover:before {transition: 0.3s;opacity:1;content: "";position: absolute;top: 100%;left: 50%;margin-left: -5px;border: 5px solid transparent;border-top: 5px solid #fff;}
#main_visual nav ul li a:not([href]){color:rgba(255,255,255,0.2)}
#main_visual nav ul li a:not([href]):hover{background: none;color:rgba(255,255,255,0.2);}
#main_visual nav ul li a:not([href]):hover:before{content:none;pointer: default;}

#main_visual .fixed{position:fixed;top:0;bottom:auto;z-index: 1;}

#about{background: #fff;;}
#about h3{font-size:7rem;text-align:center;margin: 0 0 4rem 0;}
#about h3 img{margin-bottom: 0.25em;width: 800px;}
#about p{margin: 0;}

#news{background: #f3f3f3;}
#news dl{width: ;margin-bottom: 1em;}
#news dl dd{display:flex;border-bottom:1px solid #ccc;padding: 0.75em 0;    align-items: center;}
#news dl dd date{width: 25%;}
#news dl dd span{width: 75%;}

#outline{background: #fff;;}
#outline ul{width: ;margin-bottom: 1em;}
#outline ul li{display:flex;border-bottom:1px solid #ccc;padding: 0.75em 0;    align-items: center;}
#outline ul li div:first-child{width: 20%;}
#outline ul li div:last-child{width: 80%;}
#outline ul li strong{font-size:150%;}
#outline ul li small{display:block;}

#stamprally{background: url(../img/bg1-2.jpg) center center;background-size: cover;color:#fff;}
#stamprally div>p{margin-bottom: 1.5em;}
#stamprally h3{font-size:3rem;text-align:center;margin: 0 0 4rem 0;line-height:1.4;}
#stamprally h3 i{font-style:normal;    transform: scale(3, 1);display: inline-block;margin: 0 0.5em;}
#stamprally ul{width: ;margin-bottom: 1em;}
#stamprally ul li{display:flex;border-bottom:1px solid #ccc;padding: 0.75em 0;    align-items: center;}
#stamprally ul li div:first-child{width: 20%;}
#stamprally ul li div:last-child{width: 80%;}
#stamprally ul li strong{font-size:150%;}
#stamprally ul li small{display:block;}
#stamprally ul li figure.ac{float:right;margin-left: 1em;width: 40%;}
#stamprally ul li p{text-indent:-1em;margin-left: 1em;margin-bottom: 0;}

#museum{background: url(../img/bg3.jpg) center center #fadedc;background-size: cover;}
#museum div>p{margin-bottom: 1.5em;}
#museum ul{width: ;margin-bottom: 1em;}
#museum ul li{display:flex;border-bottom:1px solid #ccc;padding: 0.75em 0;    align-items: center;}
#museum ul li div:first-child{width: 20%;}
#museum ul li div:last-child{width: 80%;}
#museum ul li strong{font-size:150%;}
#museum ul li small{display:block;}

#live{color:#fff;}
#live div>p{margin-bottom: 1.5em;}
#live h3{font-size:3rem;text-align:center;margin: 0 0 4rem 0;line-height:1.4;}
#live h3 i{font-style:normal;    transform: scale(3, 1);display: inline-block;margin: 0 0.5em;}
#live ul{width: ;margin-bottom: 1em;}
#live ul li{display:flex;padding: 0.75em 0;    align-items: center;}
#live ul li div:first-child{width: 20%;}
#live ul li div:last-child{width: 80%;}
#live ul li strong{font-size:150%;}
#live ul li small{display:block;}
#live ul li figure.ac{float:right;margin-left: 1em;width: 100%;}
#live ul li p{text-indent:-1em;margin-left: 1em;margin-bottom: 0;}
#live ul li.cast{display:block;}
#live ul li.cast div:first-child{border-top:1px solid #fff;border-bottom:1px solid #fff;text-align:center;padding: 0.25em 0;}
#live ul li.cast div{width: 100%;}
#live .cast ol{display:flex;}
#live .cast ol li {display:block;}
#live .cast ol li h2{font-size:1.8rem;margin-bottom: 1em;}
#live .cast  ol li h2 span{font-size:75%;}
#live .cast ol li p{font-size:1.4rem;text-indent:0;margin-left: 0;}
#live .cast ol li.prof{width: 75%;margin-right: 5%;}
#live .cast ol li.photo{width: 20%;}
#live .attention{}
#live .attention h3{margin-bottom: 1em;text-align:left;font-size:1.6rem;}
#live .attention p{font-size:1.4rem;margin-bottom: 1em;;}
#live .attention ol{padding: 0 0 0 1.5em;display:block;padding: 0;list-style-type:circle;margin-bottom: 1em;}
#live .attention ol li{list-style-type: circle;font-size:1.3rem;    margin-left: 2em;}
#live .attention ol li a{text-decoration:underline;}
#live .attention ol li a:hover{text-decoration:none;}

#goods{background: #f3f3f3;}
#goods div.products{display:flex;flex-wrap:wrap;justify-content:space-between;margin-bottom: 4em;}
#goods div.products >div.product_image{width: 50%;}
#goods div.products >div.product_detail{width:47.5%;}
#goods div.products >div.product_detail h2{margin-bottom: 1em;}
#goods div.products >div.product_detail p{margin-bottom: 1em;}
#goods div.products >div.product_detail ul{margin-bottom: 1em;}
#goods div.products >div.product_detail ul li{background: #303030;color: #fff;font-size: 1.4rem;display: inline-block;border-radius: 0.25em;padding: 0.25em 0.5em;}
#goods div.products >div.product_detail dl{}
#goods div.products >div.product_detail dl dd{padding-left: 1em;text-indent: -1em;}
#goods div.products >div.product_detail dl dt{margin-top: 1em;}

.thumbnail{
display:flex;flex-wrap:wrap;justify-content:space-between;
overflow: hidden;
width: 100%;}
.thumbnail li{width: 32%;float: left;list-style: none;}
.thumbnail::after {display: block;content:"";width: 32%;}
#pid8 .thumbnail::after {display: block;content:"";width: 66%;}
#pid3 .thumbnail li,
#pid5 .thumbnail li,
#pid8 .thumbnail li,
#pid9 .thumbnail li,#pid15 .thumbnail li{width: 16%;}

.thumbnail li:last-child{margin-right: 0; }
.thumbnail li img{width: 100%;opacity: 0.5;filter: alpha(opacity=50); }
.thumbnail li img:hover{width: 100%;opacity:1;filter: alpha(opacity=100); }
.thumbnail li.current img{opacity: 1;filter: alpha(opacity=100);}
.main_photo{position: relative;margin-bottom: 0.5em;}
.main_photo img{position: absolute;top:0;width: 100%;}
#goods .attention{}
#goods .attention h3{margin-bottom: 1em;}
#goods .attention ol{padding: 0 0 0 1.5em;}
#goods .attention ol li{list-style-type: circle;font-size:1.6rem;}
#goods .attention ol li a{text-decoration:underline;}
#goods .attention ol li a:hover{text-decoration:none;}
#goods .coming{color:red;font-size:3rem;text-align:center;border-top:1px solid red;border-bottom:1px solid red;padding: 0.25em 0;margin-bottom: 2em;}

.area_cart{padding: 1em 0 0;}
.area_cart select{width: 100%;margin-bottom: 0.5em;border:1px solid #ccc;border-radius: 0.25em;color:#000;font-size:80%;padding: 0.25em;margin-bottom: 1em;}
.area_cart a{width: 100%;background: #9e0032;text-align:center;display:block;padding: 0.75em;box-sizing:border-box;border-radius: 0.25em;color:#fff;font-weight:bold;}

.area_cart a {color: #fff;background-color: #9e0032;position:relative;}
.area_cart a:before {content: "";
    display: block;
    width: 8px;
    height: 8px;
    position: absolute;
    right: 2em;
    top: calc(50% - 1px);
    border-top: solid 1px;
    border-right: solid 1px;
    transform: rotate(45deg) translateY(-50%);
    color: inherit;}
.area_cart a:hover {color: #fff;background: #9e0032;}
.area_cart a {border-bottom: 5px solid #560720;}
.area_cart a:hover {margin-top: 3px;border-bottom: 2px solid #560720;}
.area_cart a {font-size: 1.8rem;position: relative;padding: 2rem 5rem 2rem 3rem;border-radius: 100vh;}
.area_cart a i.fa {margin-right: 1rem;}

#sch{text-align:center;border-top:1px solid #ccc;border-bottom:1px solid #ccc;color:#9e0032;padding: 1em 0;margin-bottom: 2em;line-height:1.6;}
#sch strong{background: yellow;}

#access{background: #fff;}
#access .inner > div{display:flex;flex-wrap:wrap;}
#access ul{width: ;margin-bottom: 1em;width: 100%;}
#access figure{width: 30%;overflow:hidden;margin-left: 5%;}
#access ul li{display:flex;border-bottom:1px solid #ccc;padding: 0.75em 0;    align-items: center;}
#access ul li div:first-child{width: 20%;}
#access ul li div:last-child{width: 80%;}
#access ul li strong{font-size:150%;}
#access small{margin-top: 1em;display: block}
#access iframe{margin-top: 2em;}
#access ul li a{text-decoration:underline;}
#access ul li a:hover{text-decoration:none;}

#movie{background: #fff;}
#movie iframe{margin-top: 2em;width: 100%;height: 450px;}

#twitter{background: #fff;padding: 0 0 10rem 0;}
#twitter .twitter-timeline{margin: 0 auto;}
#twitter h2 img{width: 1em;display:inline-block;margin-top: 1em;margin-right: 0.15em;}

#access2{background: #fff;padding: 0;}
#access2 iframe{width: 100%;}

/*footer*/
footer{background: #271f2b;color:#fff;padding: 5rem 0;font-size:1.4rem;}
footer .inner{display:flex;width: 1080px;}
footer figure{width: 250px;}
footer .inner div{margin-left: auto;text-align:right;}
footer .inner div p{text-align:right;}

/*******************************
 * *************************************************************************************************************/
/********************************************************************************************************************************************/
/*smp*/
/********************************************************************************************************************************************/
/********************************************************************************************************************************************/
@media screen and (max-width: 768px){
html{font-size: 45%;}
.pc{display:none;}
.sp{display:block;}
#contents{min-width:auto;}
#main_visual nav{min-width:auto;}

#nav-toggle {position: fixed;top: 25px;right: 25px;height: 32px;cursor: pointer;z-index: 1}
#nav-toggle > div {position: relative;width: 36px;}
#nav-toggle span {width: 100%;height: 1px;left: 0;display: block;background: #333;position: absolute;transition: top .5s ease, -webkit-transform .6s ease-in-out;transition: transform .6s ease-in-out, top .5s ease;transition: transform .6s ease-in-out, top .5s ease, -webkit-transform .6s ease-in-out;}
#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 14px;}
#nav-toggle span:nth-child(3) {top: 28px;}
#nav-toggle:hover span:nth-child(1) {top: 4px;}
#nav-toggle:hover span:nth-child(3) {top: 23px;}

#gloval-nav {background: #000;color: #fff;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 990;text-align: center;display: flex;visibility: hidden;flex-direction: column;justify-content: center;align-items: center;font-size: 29px;opacity: 0;transition: opacity .6s ease, visibility .6s ease;}
.white div span{background: #fff!important;}

#gloval-nav li{opacity:0;}
.open #gloval-nav {z-index: 11;background: #000;color: #fff;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 10;text-align: center;display: flex;visibility: hidden;flex-direction: column;justify-content: center;align-items: center;opacity: 0;transition: opacity .3s ease, visibility .3s ease;}
.open #gloval-nav a {font-size:2.5rem;height: auto;display: block;color: #fff;text-decoration: none;padding: 10px 0;transition: color .6s ease;}
.open #gloval-nav a:hover {color: #666;}
.open #gloval-nav ul {position: relative;list-style: none;left:0;margin:auto;    font-size: 2rem;right:0;top:5vw;}
.open #gloval-nav ul li {border:none;margin: 0;opacity:1;transform: translatey(-20px);transition: opacity .2s ease, -webkit-transform .6s ease;transition: transform .6s ease, opacity .2s ease;transition: transform .6s ease, opacity .2s ease, -webkit-transform .6s ease;}
.open #gloval-nav ul li:nth-child(2) {border:none;}
.open #gloval-nav ul li:first-child a{height: auto;margin: 0 auto;width: 50vw;}
.open #gloval-nav ul li:nth-child(2) {transition-delay: .05s;}
.open #gloval-nav ul li:nth-child(3) {transition-delay: .1s;}
.open #gloval-nav ul li:nth-child(4) {transition-delay: .15s;}
.open #gloval-nav ul li:nth-child(5) {transition-delay: .20s;}
.open #gloval-nav ul li:nth-child(6) {transition-delay: .25s;}
.open #gloval-nav ul li:nth-child(7) {transition-delay: .30s;}
.open #gloval-nav ul dlid:nth-child(8) {transition-delay: .35s;}
.open #gloval-nav .twitter img{width: 3rem;filter: invert(1);}

.open #nav-toggle{z-index:11;}
.open #nav-toggle span {background: #fff;}
.open #nav-toggle span:nth-child(1) {top: 15px;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.open #nav-toggle span:nth-child(2) {top: 15px;width: 0;left: 50%;}
.open #nav-toggle span:nth-child(3) {top: 15px;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}

/* open */
.open {overflow: hidden;}
.open #gloval-nav {visibility: visible;opacity: 1;margin:0;}
.open #gloval-nav li {opacity: 1;-webkit-transform: translateX(0); transform: translateX(0);transition: opacity .9s ease, -webkit-transform 0.3s ease;transition: transform 0.3s ease, opacity .9s ease;transition: transform 0.3s ease, opacity .9s ease, -webkit-transform 0.3s ease;}

	
#main_visual{background: #221a21;padding: 0;}
#main_visual #visual{padding: 0;height: auto;width: 100vw;position:relative;max-width: auto;background: #2a2123;background-size: auto;}
#main_visual #visual figure img{width: 100%;}
#main_visual #visual h1{width: 90vw;    max-width: auto;left:0;right:0;top:15vw;margin:auto;position:absolute;}
#main_visual #visual h2{color:#fff;position:absolute;bottom:5vw;text-align:center;font-size:8vw;left:0;right:0;margin: auto;}
#main_visual #visual h2 span{font-size:50%}
#main_visual nav ul{flex-wrap:wrap;}
#main_visual nav ul li{width:100%}

#news dl dd{display:flex;flex-wrap:wrap;}
#news dl dd date{width: 100%;}
#news dl dd span{width: 100%;}

#outline ul li{display:flex;flex-wrap:wrap;border-bottom:none;}
#outline ul li div:first-child{width: 100%;background: #f3f3f3;padding: 0.25em;margin-bottom: 0.5em;}
#outline ul li div:last-child{width: 100%;}

#stamprally{background: url(../img/bg1-2sp.jpg) center center;background-size: cover;color:#fff;}
#stamprally h3{font-size: 2.5rem;}
#stamprally h3 br{display:none;}
#stamprally ul li{display:flex;flex-wrap:wrap;border-bottom:none;}
#stamprally ul li div:first-child{width: 100%;background: #493c52;padding: 0.25em 0.5em;margin-bottom: 0.5em;}
#stamprally ul li div:last-child{width: 100%;}

#museum{background: url(../img/bg2sp.jpg) center center #fadedc;background-size: cover;}
#museum ul li{display:flex;flex-wrap:wrap;border-bottom:none;}
#museum ul li div:first-child{width: 100%;background: #e1cdcb;padding: 0.25em 0.5em;margin-bottom: 0.5em;}
#museum ul li div:last-child{width: 100%;}

#live h3{font-size:2.5rem;}
#live ul li{display:flex;flex-wrap:wrap;border-bottom:none;}
#live ul li div:first-child{width: 100%;background: #493c52;padding: 0.25em 0.5em;margin-bottom: 0.5em;}
#live ul li div:last-child{width: 100%;}
#live ul li.cast div:first-child{border:none;text-align:left;}

#goods div.products >div.product_image,
#goods div.products >div.product_detail{width: 100%;}
#goods div.products >div.product_image{margin-bottom: 2em;}

.area_cart select{width: 100%;margin-bottom: 0.5em;border:1px solid #ccc;border-radius: 0.25em;color:#000;font-size:100%;padding: 0.5em;margin-bottom: 1em;}

#movie iframe{height:30vh;}

#access ul li{display:flex;flex-wrap:wrap;border-bottom:none;}
#access ul li div:first-child{width: 100%;background: #f3f3f3;padding: 0.25em 0.5em;margin-bottom: 0.5em;}
#access ul li div:last-child{width: 100%;}

section{padding: 5rem 0;}
.inner{width: 100%;padding: 5vw;}
#access iframe{width: 100%!important;}
footer .inner{flex-wrap:wrap;}
footer .inner{width: 100%;}
footer figure{width: 50%;margin: 0 auto 1em;}
footer .inner div p{text-align:center;}
footer .inner div{text-align:center;margin-left: 0;width: 100%;}

}