/* ------------------------------------------------------
reset
---------------------------------------------------- */

html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}del,ins{text-decoration:none;}
a {
text-decoration: none;
}
p,h1 {
-webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}
body {
width:100%;
height:100%;
}
div, span, p {
-webkit-font-smoothing:antialiased;
}



/* ------------------------------------------------------
drawer
---------------------------------------------------- */

.open .drawer-menu-item{border:none;}
a {outline: none;}
a:focus, *:focus { outline:none; }

.drawer-nav{
 background-color:#fff;
}

.drawer-hamburger-icon, .drawer-hamburger-icon::after, .drawer-hamburger-icon::before{background: #000 !important;}
.drawer-open .drawer-hamburger-icon{background-color: transparent !important;}
.drawer-close .drawer-hamburger-icon{background-color: #000;}

.drawer-menu{
padding-top:3em;
}

.drawer-dropdown-menu {
width:100%;
background-color:#fff;
}

.drawer-dropdown-menu li{
padding:0 0 0 8%;
width:92%;
display:block;
margin:0;
}

.drawer-menu-item{
 margin:1em;
 color:#000;
}

/* @media ---------------------------*/
@media (max-width: 720px) {

.drawer-dropdown-menu li{
padding:0 0 0 1em;
width:40%;
}

.drawer-dropdown-menu li img{
width:100%;
}

.drawer-menu-item{
 margin:0 1em;
}

}



/* ------------------------------------------------------
font
---------------------------------------------------- */

.jp_b { 
font-family: 'Klee One', "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 600;
font-style: normal;
}

.jp_s { 
font-family: 'Klee One', "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 400;
font-style: normal;
font-size:80%;
}

.eng_b {
font-family: 'B612', sans-serif;
font-weight: 700;
font-style: normal;
}

.eng_s {
font-family: 'B612', sans-serif;
font-weight: 400;
font-style: normal;
}

a:link { color: #000;}
a:visited { color: #000; }
a:hover { color: #888; text-decoration:underline;}
a:active { color: #000; }



/* ------------------------------------------------------
base
---------------------------------------------------- */

html {
height: 100%;
width: 100%;
font-size:20px;
color:#000;
background-color:#fff;
line-height:1.8;
}

body {
-webkit-text-size-adjust: 100%;
display:none;
}

/* for IE 11 */
  @media all and (-ms-high-contrast:none) {
    *::-ms-backdrop, body {
-webkit-text-size-adjust: 100%;
display:block;
}
  }

/* for IE 10 */
  @media all and (-ms-high-contrast:none){
     body {
-webkit-text-size-adjust: 100%;
display:block;
  }
}

h2{

}

#content {
width: 100%;
}

main {

}

.outer {
width:94%;
margin:0.5em 3%;
padding:1em 0 5em 0;
background:url(../images/border_bold_loop.png) repeat-x top left 100%;
background-size: 1400px;
}

.inner {
width:100%;
margin:0 auto;
max-width:1000px;
padding-top:1em;
}

.breadcrumb{
width:94%;
padding:1em 3%;
font-size:70%;
}

.breadcrumb ul{
text-align:left;
width:100%;
margin:0 auto;
max-width:1000px;
}

.breadcrumb ul li{
margin:0 1em;
}

.breadcrumb ul{
display:flex;
}

.breadcrumb a{
text-decoration: underline;
}

.pn{
width:100%;
margin:0 auto 2em auto;
text-align:center;
padding:1em 0 3em 0;
max-width:1000px;
}

.pn ul{
display:flex;
justify-content: center;
align-items: center;
}

.pn li{
margin:0 1em;
}

.pn a{
text-decoration: underline;
}

.pagination{
width:100%;
margin:0 auto;
max-width:1000px;
padding-top:1em;
text-align:center;
}

.pagination a{
text-decoration: underline;
}

.pagination .page-numbers{
display:flex;
justify-content: center;
align-items: center;
}

.pagination .page-numbers li{
margin:0 0.5em;
}

#sns{
display:flex;
width:100%;
margin:0 auto 3em auto;
max-width:1000px;
text-align:center;
}

#sns{
display:flex;
justify-content: center;
align-items: center;
}

#sns div{
display:flex;
}

#sns #tw{
padding:0 1em;
}

#sns .line-it-button{
margin-left:1em;
}

#sns .fb-share-button{
margin-right:1em;
}

#sns .twitter-share-button{
font-size:80%;
}

#totop {
position: fixed;
  bottom: 10%;
  right: 3%;
z-index: 5;
display:none;
}

#totop img{
max-width:100px;
}

.error{
width:100%;
margin:3em auto;
max-width:1000px;
text-align:center;
}

.error img{
width:50%;
margin:0 25%;
}

.error p{
width:100%;
padding:3em auto;
text-align:center;
font-size:120%;
}

.field .small_70{
font-size:75%;
}

.field .small_50{
font-size:55%;
}

.profile .name .small_70{
font-size:75%;
}

.profile .name .small_50{
font-size:55%;
}

.profile dt .small_50{
width:50%;
margin:0 25%;
}

.profile dt .small_70{
width:70%;
margin:0 15%;
}

.pic .small_50{
width:50%;
margin:0 25%;
}

.pic .small_70{
width:70%;
margin:0 15%;
}

.eventname .small_70{
font-size:75%;
}

.eventname .small_50{
font-size:55%;
}

/* @media ---------------------------*/
@media (max-width: 720px) {

html {
font-size:16px;
}

h1{
padding:25% 10% 10% 10%;
}

.outer {
width:94%;
margin:0.5em 3%;
padding:1em 0 5em 0;
background:url(../images/border_bold_loop.png) repeat-x top left 100%;
background-size: 1200px;
}

.inner {
width:100%;
margin:0 auto;
max-width:800px;
padding-top:1em;
}

.breadcrumb{
width:96%;
padding:0 2%;
font-size:60%;
margin-bottom:3em;
}

#sns #tw{
margin-top:0.6em;
display:block;
}

#totop img{
max-width:80px;
}

.pic .small_50{
width:60%;
margin:0 20%;
}

.pic .small_70{
width:80%;
margin:0 10%;
}

.profile dt .small_50{
width:60%;
margin:0 20%;
}

.profile dt .small_70{
width:80%;
margin:0 10%;
}


}



/* ------------------------------------------------------
title
---------------------------------------------------- */




/* for IE 11 */
@media all and (-ms-high-contrast:none) {

*::-ms-backdrop, .tit .wrap{
padding:0.2em 0 0.2em 0;
display:inline;
background:url(../images/border_BR.png) no-repeat bottom left 100%;
background-size: 1100px;
}

*::-ms-backdrop, ..tit .wrap .wrap2{
padding:0.2em;
display:inline;
background:url(../images/border_TL.png) no-repeat top right 100%;
background-size: 1100px;
}

.tit .wrap .wrap2 .wrap3{
display:inline;
}

}

/* for IE 10 */
@media all and (-ms-high-contrast:none){

.tit .wrap{
padding:0.2em 0 0.2em 0;
display:inline;
background:url(../images/border_BR.png) no-repeat bottom left 100%;
background-size: 1100px;
}

.tit .wrap .wrap2{
padding:0.2em;
display:inline;
background:url(../images/border_TL.png) no-repeat top right 100%;
background-size: 1100px;
}

.tit .wrap .wrap2 .wrap3{
display:inline;
}

}

/* chrome safari opera edge */
@media screen and (-webkit-min-device-pixel-ratio: 0) {

.tit .wrap{
padding:0.1em 0 0.2em 0;
display:inline;
background:url(../images/border_BR.png) no-repeat bottom 1px left 100%;
background-size: 1100px;
}

.tit .wrap .wrap2{
padding:0.2em 0.3em 0 0.3em;
display:inline;
background:url(../images/border_TL.png) no-repeat top right 100%;
background-size: 1100px;
}

.tit .wrap .wrap2 .wrap3{
display:inline;
background:url(../images/border_BR.png) no-repeat top right 100%;
background-size: 1100px;
}

}

.tit {
width: 90%;
margin: 0 auto 0 auto ;
max-width:1000px;
}

/* @media ---------------------------*/
@media (max-width: 720px) {

}



/* ------------------------------------------------------
exhibitions
---------------------------------------------------- */

#exhibitions{
margin-top:1em;
}

#exhibitions .tit_hosoku{
margin-left:1em;
font-size:70%;
}

#exhibitions p{
display:inline;
}

/* @media ---------------------------*/
@media (max-width:720px) {

#exhibitions{
margin-top:0;
}

#exhibitions .tit_hosoku{
display:block;
margin-left:0;
}

}


/* ------------------------------------------------------
exhibitionhistory
---------------------------------------------------- */


/* @media ---------------------------*/
@media (max-width:720px) {

}



/* ------------------------------------------------------
exhibitions exhibitionhistory
---------------------------------------------------- */

#exhibitions .inner a, #exhibitionhistory .inner a{
display:block;
}

#exhibitions .inner dl, #exhibitionhistory .inner dl{
width:960px;
margin:0 auto;
background:url(../images/border_thin_loop.png) repeat-x bottom left 100%;
background-size: 800px;
padding:0 20px 1em 20px;
margin-bottom:1.5em;
display: flex;
}

#exhibitions .inner dt, #exhibitionhistory .inner dt{
text-align:center;
width:44%;
padding:0 3% 0 3%;
line-height:1.2;
display: flex;
align-items: center;
    align-content: center;
    flex-direction: column;
    justify-content: center
}

.eventname{
margin:0.5em 0;
}

#exhibitions .inner dd, #exhibitionhistory .inner dd{
width:50%;
}

#exhibitions .inner dd img, #exhibitionhistory .inner dd img{
width:100%;
}

#exhibitions .inner .ichiran, #exhibitionhistory .inner .ichiran{
width:100%;
text-align:center;
margin-top:2em;
}

#exhibitions .inner .ichiran img, #exhibitionhistory .inner .ichiran img{
max-width:100px;
}


/* @media ---------------------------*/
@media (max-width: 840px) {

#exhibitions .inner dl, #exhibitionhistory .inner dl{
width:85%;
margin:0 2.5% 1.5em 2.5%;
padding:0 5% 1em 5%;;
display: block;
}

#exhibitions .inner dt, #exhibitionhistory .inner dt{
text-align:center;
width:100%;
padding:0;
}

#exhibitions .inner dd, #exhibitionhistory .inner dd{
width:100%;
padding-top:1em;
}

}

/* @media ---------------------------*/
@media (max-width: 720px) {

#exhibitions .inner dl, #exhibitionhistory .inner dl{
margin:0 2.5% 1.5em 2.5%;
padding:0 5% 1em 5%;;
background-size: 600px;
}

#exhibitions .inner .ichiran img, #exhibitionhistory .inner .ichiran img{
max-width:80px;
}

}

/* @media ---------------------------*/
@media (max-width: 1050px) {

#exhibitions .inner dl, #exhibitionhistory .inner dl{
width:85%;
margin:0 2.5% 1.5em 2.5%;
padding:0 5% 1em 5%;;
}

}



/* ------------------------------------------------------
faq
---------------------------------------------------- */

#faq{
margin-top:1em;
}

#faq .tit_hosoku{
margin-left:1em;
font-size:70%;
}

#faq p{
display:inline;
}

#faq .inner a{
display:block;
}

#faq .inner dl{
width:100%;
margin:0 auto;
background:url(../images/border_thin_loop.png) repeat-x bottom left 100%;
background-size: 800px;
padding:0 0 1em 0;
margin-bottom:1.5em;

}

#faq .inner dt{
width:98%;
padding:0 1%;
line-height:1.2;

align-items: center;
    align-content: center;
    flex-direction: column;
    justify-content: center
}

#faq .inner .faq_wrap dd{
width:98%;
padding:0 1%;
}

#faq .inner .faq_wrap .faq__row{
  display: grid;
  grid-template-columns: 1.2em 1fr; /* ←Q./A.の幅。好みで調整 */
  column-gap: .8em;
  align-items: start;
}

#faq .inner .faq_wrap .faq__label{
  font-weight: 700;
  line-height: 1.6;
}

#faq .inner .faq_wrap .faq__text{
  line-height: 1.6;
}

#faq .inner .faq_content p{
  font-size:150%;
  display:block;
  margin:2em 0;
  font-weight:bold;
}

/* dt/ddのデフォルト余白を整える（必要なら） */
.faq_wrap dt, .faq_wrap dd{
  margin: 0 0 1rem 0;
}


/* @media ---------------------------*/

@media (max-width: 720px) {

#faq{
margin-top:0;
}

#faq .tit_hosoku{
display:block;
margin-left:0;
}

#faq .inner dl{
width:94%;
margin:0 3% 1.5em 3%;
padding:0 0% 1em 0%;;
}

#faq .inner .faq_content p{
  font-size:130%;
  display:block;
  margin:2em 0 2em 2%;
  font-weight:bold;
}

}




/* ------------------------------------------------------
access
---------------------------------------------------- */

#access dl{
width:1000px;
margin:0 auto;
}

#access dt iframe{
width:100%;
}

#access dd {
text-align:center;
margin-top:1em;
}


/* @media ---------------------------*/
@media (max-width:1050px) {

#access dl{
width:95%;
margin:0 2.5%;
}

}

/* @media ---------------------------*/
@media (max-width:720px) {

#access .inner {
font-size:90%;
}

}

/* @media ---------------------------*/
@media (max-width:320px) {

#access dl{
width:95%;
margin:0 2.5%;
}

#access .inner {
font-size:75%;
}

}



/* ------------------------------------------------------
about
---------------------------------------------------- */

#about .inner p{
text-align:center;
margin-top:1em;
}

#about ul{
margin:1em 20% 0 20%;
text-align:center;
width:60%;
}

#about .bar{
background:url(../images/border_thin_loop.png) repeat-x bottom left 100%;
background-size: 500px;
padding:1em;
}

#about .bnr a{
display:block;
width:100%;
padding:1em 0;
margin:1em 0;
background-color:#000;
color:#fff;
font-size:125%;
border-top-left-radius: 10px;
border-top-right-radius: 20px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 40px;
}


#about .bnr span{
display:block;
font-size:65%;
}

#about .bnr a:link { color: #fff;background-color:#000;}
#about .bnr a:visited { color: #fff;background-color:#000;}
#about .bnr a:hover { color: #fff; text-decoration:none;background-color:#555;}
#about .bnr a:active { color: #fff;background-color:#000;}

#about li a{
font-size:100%;
}


/* @media ---------------------------*/
@media (max-width: 720px) {

#about .inner {
font-size:90%;
}

#about ul{
margin:1em 10% 0 10%;
width:80%;
}

}

/* @media ---------------------------*/
@media (max-width: 320px) {

#about .inner {
font-size:75%;
}


}


/* ------------------------------------------------------
single
---------------------------------------------------- */

#single{
margin:2em 0;
}

#single a:link { color: #000; text-decoration:underline;}
#single a:visited { color: #888; }
#single a:hover { color: #888; text-decoration:underline;}
#single a:active { color: #000; }

#single .field{
max-width:100%;
margin:0 auto;
}

#single .field dl{
max-width:100%;
margin:0 auto;
}

#single .field dt{
text-align:center;
font-size:120%;
max-width:900px;
margin:0 auto 1em auto;
line-height:1.2;
}

#single .field .eyecatching{
max-width:100%;
max-width:1600px;
margin:0 auto;
}

#single .field .eyecatching img{
width:100%;
}

#single .field .read{
padding:2em 1em;
max-width:1000px;
margin:0 auto;
}

#single .inner{
padding-bottom:0em;
}

#single .inner div p{
padding-bottom:1.5em;
font-family: 'Klee One', cursive, "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 600;
font-style: normal;
}

#single .inner .info{
width:880px;
margin:0 auto 0 auto;
background:url(../images/border_thin_loop.png) repeat-x top left 100%;
background-size: 800px;
padding:2em 60px;
display: block;
}

#single .inner .info .pic{
display:block;
font-family: 'Klee One', cursive, "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 400;
font-style: normal;
font-size:70%;
}

#single .inner .info ul{
padding-bottom:0.5em;
font-family: 'Klee One', cursive, "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 400;
font-style: normal;
font-size:80%;
}

#single .inner .info ul li{
padding-bottom:1em;
}

#single .inner .info .text{
padding-bottom:0.5em;
font-family: 'Klee One', cursive, "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 400;
font-style: normal;
font-size:80%;
}

#single .inner .info img{
width:100%;
padding-top:2em;
}

#single .inner .artist{
width:920px;
margin:0 auto;
background:url(../images/border_thin_loop.png) repeat-x top left 100%;
background-size: 800px;
padding:2em 40px;
display: block;
}

#single .inner .artist p{
margin-left:20px;
}

#single .inner .artist .profile{
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: center;
}

#single .inner .artist dl{
width:420px;
margin:0 20px;
padding-bottom:1.5em;
}

#single .inner .artist dl dt img{
width:100%;
}

#single .inner .artist dl .name{
text-align:center;
margin-bottom:0.5em;
font-family: 'Klee One', cursive, "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 600;
font-style: normal;
line-height:1.5;
}

#single .inner .artist dl .text{
font-family: 'Klee One', cursive, "Yu Mincho Medium", "游明朝 Medium", YuMincho, "游明朝体";
font-weight: 400;
font-style: normal;
font-size:70%;
}

#single .inner .movie{
width:880px;
margin:0 auto;
background:url(../images/border_thin_loop.png) repeat-x top left 100%;
background-size: 800px;
padding:2em 60px 0 60px;
display: block;
}

#single .inner .movie div {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  margin-bottom: 50px;
  z-index:1;
}

#single .inner .movie div iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index:1;
}

/* @media ---------------------------*/
@media (max-width: 1050px) {

#single .field dt{
max-width:90%;
}

#single .field .read{
padding:2em 5%;
}

#single .inner .info{
width:84%;
margin:0 4%;
padding:2em 4% 0 4%;
}

#single .inner .artist{
width:84%;
margin:0 4%;
padding:2em 4% 0 4%;
}

#single .inner .artist dl{
width:46%;
margin:0 2%;
padding-bottom:1.5em;
}

#single .inner .artist p{
margin-left:0;
}

#single .inner .movie{
width:84%;
margin:0 4%;
padding:2em 4% 0 4%;
}

}

/* @media ---------------------------*/
@media (max-width: 720px) {

#single{
margin:0 0 0em 0;
}

#single .inner{
padding-bottom:1.5em;
}


#single .field dt{
max-width:85%;
margin:0 auto 1em auto;
line-height:1.2;
}

#single .inner .info{
width:84%;
margin:0 4%;
padding:2em 4% 2em 4%;
background-size: 600px;
line-height:1.5;
}

#single .inner .artist{
background-size: 600px;
}

#single .inner .artist .profile{
padding-bottom:2em;
}

#single .inner .artist .profile{
display: block;
}

#single .inner .artist dl{
width:96%;
margin:0;
padding:0 2% 2em 2%;
padding-bottom:1.5em;

}

#single .inner .artist dl dt{
width:80%;
margin:0 10%;
padding-bottom:0em;
}

#single .inner .artist dl .text{
font-size:70%;
}

#single .inner .movie{
background-size: 600px;
}

}

/* @media ---------------------------*/
@media (max-width: 360px) {

#single .inner .artist dl .name{
font-size:80%;
}

}



/* ------------------------------------------------------
footer
---------------------------------------------------- */

#footer {
width: 100%;
margin-top:3em;
background:url(../images/border_bold_loop.png) repeat-x top left 100% #fff;
background-size: 1400px;
}

#footer .sns {
text-align:center;
margin:0 auto;
padding-top:3em;
}

#footer .sns li {
display:inline;
padding:1em;
}

#footer .sns li img{
width:50px;
}

#footer .footer-menu {
text-align: center;
margin-top:1em;
}

#footer .footer-menu {
text-align: center;
padding: 3em 0 2em 0;
line-height: 1.9;
}

#footer .footer-menu li {
display: block;
margin: 0 2em;
font-size:90%;
}

#footer .foot {
width: 100%;
text-align: center;
padding: 1em 0 ;
}

#footer .foot {
width: 100%;
margin: 0 auto;
margin: 0 0 0 0;
}

#footer .foot .shibuya_san img {
width: 300px;
}

#footer .foot .cr {
margin: 4em 0 1em 0;
text-align: center;
color:#000;
}


/* @media ---------------------------*/
@media (max-width: 840px) {

#footer {
background-size: 1000px;
}

#footer .footer-menu {
display: block;
margin-top:1em;
}
#footer .footer-menu li {
display: block;
margin: 1.5em 0 0 0;
}

#footer .sns li img{
width:40px;
}

#footer .foot .shibuya_san img {
width: 200px;
}

#footer .foot .cr {
margin: 5em 0 1em 0;
font-size:75%;
}

}

/* @media ---------------------------*/
@media (max-width: 320px) {

}



/* ------------------------------------------------------
clearfix
---------------------------------------------------- */

.clearfix:before,
.clearfix:after {
  : " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}




/* ------------------------------------------------------
media
---------------------------------------------------- */

@media screen { 
  div#preloader { 
    position: absolute; 
    left: -9999px; 
    top: -9999px; 
  } 
  div#preloader img { 
    display: block; 
  } 
}

@media print { 
  div#preloader, 
  div#preloader img { 
    visibility: hidden; 
    display: none; 
  } 
}