@charset "utf-8";

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

#subPage{ background:#fbf4f4 url(/asset/images/sub/bg_contents.jpg) no-repeat center top 0; background-size:100%;}

#subPage #contents_inner{margin-top:239px; }
#pageHeader{text-align: center; margin-bottom: 53px;position: relative; z-index: 3;}

#pageHeader img{ width: 450px;}

.whiteContBody{width: 1000px; margin: 0 auto;background: #fff; border: 2px solid #a11419; border-radius: 15px;margin-bottom: 100px; position: relative; min-height: 200px;padding: 70px; box-sizing: border-box; height: 100%;}

@media(max-width:750px){
.whiteContBody{width: auto; margin: 0 20px;}
}


#subPage.largeVisual #contents_inner{margin-top:600px; }
#subPage.largeVisual #pageHeader{text-align: center; margin-bottom: -40px;}

#subPage.access{background:#fbf4f4 url(/asset/images/sub/bg_access.jpg) no-repeat center top 0; background-size:100%;}
#subPage.museum{background:#fbf4f4 url(/asset/images/sub/bg_museum.jpg) no-repeat center top 0; background-size:100%;}
#subPage.about{background:#fbf4f4 url(/asset/images/sub/bg_about.jpg) no-repeat center top 0; background-size:100%;}
#subPage.contact{background:#fbf4f4 url(/asset/images/sub/bg_contact.jpg) no-repeat center top 0; background-size:100%;}
#subPage.shop{background:#fbf4f4 url(/asset/images/sub/bg_shop.jpg) no-repeat center top 0; background-size:100%;}

@media(max-width:750px){
#subPage #contents_inner{margin-top:329px; }
#subPage{ background:#fbf4f4 url(/asset/images/sub/bg_contents.jpg) no-repeat center top 150px; background-size:100%;}
#subPage.largeVisual #contents_inner{margin-top:600px; }
#subPage.largeVisual #pageHeader{text-align: center; margin-bottom: -40px;}

#subPage.access{background:#fbf4f4 url(/asset/images/sub/bg_access.jpg) no-repeat center top 180px; background-size:100%;}
#subPage.museum{background:#fbf4f4 url(/asset/images/sub/bg_museum.jpg) no-repeat center top 180px; background-size:100%;}
#subPage.about{background:#fbf4f4 url(/asset/images/sub/bg_about.jpg) no-repeat center top 180px; background-size:100%;}
#subPage.contact{background:#fbf4f4 url(/asset/images/sub/bg_contact.jpg) no-repeat center top 180px; background-size:100%;}
#subPage.shop{background:#fbf4f4 url(/asset/images/sub/bg_shop.jpg) no-repeat center top 180px; background-size:100%;}
}



@media(max-width:750px){

}


.whiteContBody >.inner{position: relative;z-index: 2;}
.whiteContBody h2{ color: #a11419; margin-bottom: 50px;}
.whiteContBody h3{ color: #a11419; margin-bottom: 30px;}
.whiteContBody p{ font-size: 19px;}

@media(max-width:750px){
.whiteContBody{margin-bottom: 45px;}
.whiteContBody p{ font-size: 22px;}

}



.sec.about01{}
.sec.about01 .secBody{display: flex;}
.sec.about01 p{width: 60%;}
.sec.about01 .imgBox{width: 40%; text-align: center;}
.sec.about01 .imgBox img{ width: 70%;}

.whiteContBody .sec{ margin-bottom: 100px;}
.whiteContBody .sec.last{ margin-bottom: 20px;}

.messageMore{padding-top: 50px;}
.messageMore h3 {margin-bottom: 20px;}
.messageMore h3 div {display: inline-block; padding: 5px 10px; background: #d98f9f; line-height: 1.2em; color: #fff;border-radius: 10px;}

@media(max-width:750px){
.messageMore h3 div {display: block; padding: 15px 15px; background: #d98f9f; line-height: 1.2em; color: #fff;border-radius: 10px;}

}


.sec .wideImgBox{margin-bottom: 30px;}

.grayBox{
background: ;
border: 1px dashed #f4dcd7;border-radius: 0;
border-width:1px 0 0 0;
}
.grayBox >.inner{padding: 30px 0 0 0;}

@media(max-width:750px){
.sec.about01 p{width: auto;}
.sec.about01 .secBody{display: block;}

}



.wideImgBox img{ border-radius: 10px;}






.swiper-wrapper {width: 0 !important;height: auto;}
.swiper-slide {color: #ffffff;width: auto;height: 100%;text-align: center;}

.mySwiper1_main {height: auto;width: 100%; margin-bottom: 1px;}
.mySwiper1_thumb {height: auto;box-sizing: border-box;padding: 10px 0;}
.mySwiper1_thumb .swiper-slide {opacity: 0.4;}
.mySwiper1_thumb .swiper-slide-thumb-active {opacity: 1;}

.mySwiper1_main img{border-radius: 10px 10px 0 0;}
.mySwiper1_thumb .swiper-slide:nth-child(5) img{border-radius: 0 0 0 10px;}
.mySwiper1_thumb .swiper-slide:last-child img{border-radius: 0 0 10px 0;}

.mySwiper1_txt p{ color: #333; text-align: left;}

.mySwiper1_thumb .swiper-wrapper{
    width: auto;
    margin: 0 auto ;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 1px;
    row-gap: 1px;
position: relative;
min-width: 0;
margin: 0;
height: auto;
}


.mySwiper2_main {height: auto;width: 100%; margin-bottom: 1px;}
.mySwiper2_thumb {height: auto;box-sizing: border-box;padding: 10px 0;}
.mySwiper2_thumb .swiper-slide {opacity: 0.4;}
.mySwiper2_thumb .swiper-slide-thumb-active {opacity: 1;}

.mySwiper2_main img{border-radius: 10px 10px 0 0;}
.mySwiper2_thumb .swiper-slide:nth-child(4) img{border-radius: 0 0 0 10px;}
.mySwiper2_thumb .swiper-slide:last-child img{border-radius: 0 0 10px 0;}

.mySwiper2_txt p{ color: #333; text-align: left;}

.mySwiper2_thumb .swiper-wrapper{
    width: auto;
    margin: 0 auto ;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 1px;
    row-gap: 1px;
position: relative;
min-width: 0;
margin: 0;
height: auto;
}











.qaBox{ cursor: pointer;margin-bottom: 20px;  box-shadow: rgba(187, 139, 139, 0.5) 0px 0px 3px 0.3px; border-radius: 15px;}

.accordion-title {
color: #fff;
cursor: pointer;
padding:20px 20px 20px 20px;
text-align: center;
display: table; width: 100%;
font-weight: 900;
	padding-right:70px;
border-radius: 15px;
background: #fcf7f8;
transition: all  0.5s ease; 
}
.accordion-title.open{ border-radius: 15px 15px 0 0;transition: all  0.5s ease; }

.accordion-title .qbtn{display: table-cell; vertical-align: top; width: 50px;}
.accordion-title .qbtn span{ display: table-cell;background: #d11823;width: 50px; height:50px; text-align:center; font-size: 16px; vertical-align: middle;color: #fff; border-radius: 100px;}
.accordion-title h4{display: table-cell; text-align: left;padding: 12px; vertical-align: middle; font-size: 20px; color: #85230e; line-height: 1.3em;}

.accordion-content {
display: none; 
padding: 20px 20px 30px;
background: #fff;
border-radius: 15px;
}

@media(max-width:750px){

}

.accordion-content >.inner{ display: table; width: 100%;}
.accordion-content header{ display: table-cell; width: 65px}
.accordion-content .answerBody{ display: table-cell;padding-right: 60px; vertical-align: top;padding-top: 10px;}

.accordion-content header h5{ display: table-cell; vertical-align: middle; font-size: 20px; background: #FF808E; color: #fff;text-align: center; width: 50px; height: 50px; border-radius: 100px; line-height: 1em;}

.accordion-content p{font-size: 16px; font-weight: bold;}


@media(max-width:750px){

.accordion-title h4{display: table-cell; text-align: left;padding: 12px; vertical-align: middle; font-size: 24px; color: #85230e; line-height: 1.3em;}
.accordion-content p{font-size: 22px; font-weight: bold;}
}


.accordion-title {
  position: relative;
}
.accordion-title::after {
    content: '';
    display: inline-block;
    width: 20px;
    height: 2px;
    background-color: #ba3f3f;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: transform 0.3s;
}
.accordion-title::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 2px;
    background-color: #ba3f3f;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 0.3s;
}
.accordion-title.open::before {
    opacity: 0;
}
.accordion-title.open::after {
    transform: translateY(-50%) rotate(180deg);
}



@media(max-width:750px){

}








.museumDetail{ width: 800px;margin:0 auto;background: #f2e3e9; border-radius: 15px;padding: 10px;}
.museumDetail >.inner{ background: #fff; border-radius:7px;padding:10px;}

.museumDetail header{ position: relative;}
.museumDetail header img{ position: absolute; left: 10px; top: -80px; height: 200px; width: auto;}
.museumDetail header h3{padding: 30px 0; text-align: center; color: #c64b6c; font-size: 25px; font-weight: normal; line-height: 1.4em;}

.tableArea{ width:auto;margin: 0 10px 10px;}
.tableArea table{ border-collapse: collapse; width: 100%;}
.tableArea table th{ background: #f2e3e9; width: 28%; vertical-align: middle;border-collapse: collapse; border: 1px solid #fff; color: #444; font-weight: normal;}
.tableArea table td{ background: #faf6f8;padding: 30px;border: 1px solid #fff; font-weight: normal; color: #444; font-size: 87%;}

.tableArea table td span.large{ font-size: 140%;}
.tableArea table td span.middle{ font-size: 120%;}


@media(max-width:750px){
.museumDetail{ width: auto;margin:0 auto;background: #f2e3e9; border-radius: 15px;padding: 10px;}
.museumDetail header img{ position: absolute; left: -10px; top: -80px; height: 200px; width: auto;}
.museumDetail header h3{padding: 30px 0; margin:0 0 0 50px; text-align: center; color: #c64b6c; font-size: 23px; font-weight: normal; line-height: 1.4em;}
.museumDetail table{ font-size: 110%;}
.tableArea table th{  width: 20%;}
.small_pc{ font-size: 90%; letter-spacing: -0.1em;}


.tableArea{ width:auto;margin: 0 0 10px;}


}











.privacyOverflowBox{ border: 2px solid #d98f9f; padding: 30px; border-radius: 20px;}
.privacyOverflowBox >.inner{height: 600px; overflow-y: scroll; padding: 10px; }


#privacy{ margin: 0 auto; max-width: auto;}
#privacy h3{ text-align: left; font-weight: 400;font-size: 120%; letter-spacing: 0.1em; margin-bottom: 1em;
 position: relative;margin-left: 50px; line-height: 1.4em;}
#privacy h3 span{ display: inline; position: absolute; left: -50px; }


#privacy h4{ text-align: left; font-weight: 400;font-size: 110%; letter-spacing: 0.1em; margin-bottom: 1em;
 position: relative;margin-left: 50px; line-height: 1.4em; font-weight: normal;}

#privacy h4 + ul,
#privacy h4 + ol,
#privacy h4 + p {padding-left: 75px;}

.pp-enclosure {margin-bottom: 50px;}
.pp-enclosure p{ margin-left: 50px; margin-right: 50px; margin-bottom: 1em;}

.pp-enclosure ul{
    margin-left: 50px; margin-right: 50px; position: relative;
    margin-bottom: 1em;
}
.pp-enclosure ol{
    margin-left: 50px; margin-right: 50px; position: relative;
    margin-bottom: 1em; ;list-style: decimal;padding-left: 25px;
}
.pp-enclosure ul li{ padding-left: 20px; display: block;position: relative; margin-bottom: 1em;}
.pp-enclosure ul li:after{
    content:"";
	display: block;
	width:6px;
	height:6px;
	border-top:2px solid #555;
	border-right:2px solid #555;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	left:5px;
	top:13px;
	margin-top:-4px;
}

@media(max-width:750px){

#privacy h3{ text-align: left;font-weight: 400;font-size: 150%; letter-spacing: 0.1em; margin-bottom: 1em;
 position: relative;margin-left: 50px; line-height: 1.4em;}
    
.pp-enclosure {margin-bottom: 100px;}
    
.pp-enclosure ul li{ padding-left: 30px; display: block;position: relative; margin-bottom: 1em;}
    .pp-enclosure ul li:after{
    content:"";
	display: block;
	width:10px;
	height:10px;
	border-top:2px solid #555;
	border-right:2px solid #555;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	left:5px;
	top:20px;
	margin-top:-4px;
}

    
}










.ticketList{
    width: 50%;
    margin: 0 auto 100px;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    column-gap: 30px;
    row-gap: 30px;
}
.ticketList li.min{width:80%; margin: 0 auto;}

@media(max-width:750px){


.ticketList{width: 100%;padding-top: 20px;}
}





.ticketCautionArea{ background: #fbfbfb; border:1px solid #a86134; border-radius: 5px; margin-bottom: 50px;}
.ticketCautionArea >.inner{padding: 50px;}

.ticketCautionArea h3{ text-align: center; margin-bottom: 50px; font-size: 26px;}


.ticketCautionArea dl{ margin-bottom: 50px;}
.ticketCautionArea dt{margin-bottom: 10px;}
.ticketCautionArea dt h4{ display: block; font-size: 120%;}
.ticketCautionArea dt p{ }
.ticketCautionArea dt p span{ padding: 3px 10px; color: #fff; background: #444; font-size: 10px; border-radius: 5px; margin-left: 5px;}
.ticketCautionArea dt p span.ippan{background: #8aafd1;}
.ticketCautionArea dt p span.goods{background: #d18aa5;}

.ticketCautionArea ul{margin-left: 20px;}
.ticketCautionArea ul li{ list-style: circle; margin-bottom: 5px; font-size: 14px; line-height: 1.7em;}
.ticketCautionArea ul li:last-child{margin-bottom: 0;}

@media(max-width:750px){
.ticketCautionArea >.inner{padding: 30px;}

.ticketCautionArea ul li{ font-size: 18px;}
.ticketCautionArea dt p span{ padding: 3px 10px; color: #fff; background: #444; font-size: 18px; border-radius: 5px; margin-left: 5px;}


}











.infoEntryPage{}
.infoEntryPage header h1{ font-size: 23px; text-align: left; margin-bottom: 0px; padding-bottom: 20px; border-bottom: 2px dashed #eaeaea; line-height: 1.4em; line-height: 1.4em; margin-bottom: 30px;}
.infoEntryPage header .entryDate{ font-size: 20px; text-align: right; margin-bottom: 20px;}

 .mainEntryBody p{ margin-bottom: 50px;}
 .mainEntryBody p{ margin-bottom: 50px;}


.mainEntryBody b{font-size: 120%; font-weight: 900; }
.mainEntryBody strong{ font-size: 120%; font-weight: 900;}

.infoPhotoArea01{ display: table; margin-bottom: 50px; width: 100%;}
.infoPhotoArea01 .imgBox{ display: table-cell; vertical-align: top; width: 40%;}
.infoPhotoArea01 .imgBox img{ border-radius: 20px;}
.infoPhotoArea01 .txtBox{ display: table-cell; vertical-align: top; padding-left: 30px;}

.infoPhotoArea01 .txtBox.leftTxt{ vertical-align: middle; padding-left: 0; padding-right: 10px;}
.infoPhotoArea01 .txtBox.leftTxt p{ margin-bottom: 0;}



#INFORMATION.entryPage h2 {
  position: relative;
  padding: 1em 0;
    margin-bottom: 1.5em;
    line-height: 1.4em;
}
#INFORMATION.entryPage h2::before,
#INFORMATION.entryPage h2::after {
  position: absolute;
  left: 0;
  content: '';
  width: 100%;
  height: 6px;
  box-sizing: border-box;
}
#INFORMATION.entryPage h2::before {
  top: 0;
  border-top: 2px solid #92541c;
  border-bottom: 1px solid #92541c;
}
#INFORMATION.entryPage h2::after {
  bottom: 0;
  border-top: 1px solid #92541c;
  border-bottom: 2px solid #92541c;
}


#INFORMATION.entryPage hr{ height: 4px; margin-bottom: 20px !important;}


@media(max-width:750px){
    
#INFORMATION.entryPage header h1{ font-size: 40px; text-align: left;  padding-bottom: 20px; border-bottom: 4px dashed #eaeaea; }
#INFORMATION.entryPage header .entryDate{ font-size: 28px; text-align: right; margin-bottom: 20px;}
    
.infoPhotoArea01{ display: block; margin-bottom: 50px;}
.infoPhotoArea01 .imgBox{ display: block; vertical-align: top; width: 100%;}
.infoPhotoArea01 .txtBox{ display: block; vertical-align: top; padding-left: 0;}
.infoPhotoArea01 .txtBox.leftTxt{ padding-left: 0; padding-right: 0;}
.infoPhotoArea01 .txtBox.leftTxt p{ margin-bottom: 20px;}
#INFORMATION.entryPage hr{ height: 4px;}
}






.photo3line{
    width: auto;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 25px;
row-gap: 25px; 
    margin-bottom: 30px;
}

.photo3line.grid3{grid-template-columns: repeat(3, 1fr);}
.photo3line.grid2{grid-template-columns: repeat(2, 1fr);}
.photo3line.grid1{grid-template-columns: repeat(1, 1fr);}

@media(min-width:751px){
.photo3line.w90per{ width: 90%;}
.photo3line.w80per{ width: 80%;}
.photo3line.w70per{ width: 70%;}
.photo3line.w60per{ width: 60%;}
.photo3line.w50per{ width: 50%;}
}

.photo3line.freeHeight li img{ height: auto;}




.mainEntryBody .photo3line p{ margin-bottom: 10px;}


.photo3line li img{ 
  width: 100%;
  height: 200px;
  object-fit: cover;  border-radius: 10px
    
}
.photo3line li{ }
.photo3line li p{ padding: 10px;}

.fullWideImageBox{}
.fullWideImageBox img{ border-radius: 20px;}

.imgBoxw90 img{ width: 90%;}
.imgBoxw80 img{ width: 80%;}
.imgBoxw70 img{ width: 70%;}
.imgBoxw60 img{ width: 60%;}
.imgBoxw90,
.imgBoxw80,
.imgBoxw70,
.imgBoxw60{text-align: center;}

@media(max-width:750px){

.imgBoxw90 img{ width: 100%;}
.imgBoxw80 img{ width: 100%;}
.imgBoxw70 img{ width: 100%;}
.imgBoxw60 img{ width: 100%;}

.photo3line{
    width: auto;
margin: 0;
display: grid;
grid-template-columns: repeat(2, 1fr);
column-gap: 25px;
row-gap: 25px; 
    margin-bottom: 40px;
}
.photo3line.grid3{grid-template-columns: repeat(3, 1fr);}
.photo3line.grid2{grid-template-columns: repeat(2, 1fr);}
.photo3line.grid1{grid-template-columns: repeat(1, 1fr);}

.photo3line li img{ 
  width: 100%;
  height: 170px;
  object-fit: cover; 
}

.photo3line li p{ padding: 10px; margin-bottom: 10px !important;}
    
}












.contactList{margin: 0 auto 30px; max-width: 600px;}
.contactList >.inner{ display: block; width: 100%; }

.contactList .contactBtnArea{ display: block; margin: 0; }
.contactList .contactBtnArea ul li{margin-bottom: 23px; }
.contactList .contactBtnArea ul li:last-child{ margin-bottom: 0;}
.contactList .contactBtnArea ul li a{ display: block; text-align: center; width: auto; color: #fff;border: 1px solid #de6a89; border-radius: 10px;padding: 10px 0;transition: all  0.5s ease; font-size: 20px;}
.contactList .contactBtnArea ul li a:hover{transform: scale(0.98); opacity: 1;}


.contactList .contactBtnArea ul li.ippan a{
  background:
    url(/asset/images/contact/icon_mail_white.webp) no-repeat left 20px center,
    url(/asset/images/top/arrow.png) no-repeat right 30px center,
    url(/asset/images/contact/bnrArea_bg.png) no-repeat left -10px center;
  background-size:80px, 30px, auto 130%;
  background-color: #b5263f;
}

.contactList .contactBtnArea ul li a span{ font-size: 80%;}

.contactList .contactBtnArea ul li.press {width: 80%; margin: 0 auto;}
.contactList .contactBtnArea ul li.press a{ background:#8ea8be;border: 1px solid #6396c3;}


.contactList .contactBtnArea ul li.ippan a{padding: 40px 40px 40px 60px; text-align: center; }
.contactList .contactBtnArea ul li.press a{padding: 20px 20px 20px 20px; text-align: center; }

.contactList .contactBtnArea ul li.ippan span{ display: block; background: #fff; color: #c46c7f;border-radius: 10px; width: 60%; margin: 0 auto; margin-top: 5px;}

.contactMoreArea{ max-width: 600px; margin: 0 auto; border: 1px solid #eee; background: #f8f8f8;padding: 30px; border-radius: 10px; box-sizing: border-box;}
.contactMoreArea p{margin-bottom: 20px;}
.contactMoreArea p:last-child{margin-bottom: 0;}



@media(max-width:750px){

.contactList .contactBtnArea ul li.ippan span{ display: block; background: #fff; color: #c64b6c;border-radius: 10px; width: 80%; margin: 0 auto;}


.contactList .contactBtnArea ul li.ippan a{
  background:
    url(/asset/images/contact/icon_mail_white.webp) no-repeat left 20px center,
    url(/asset/images/top/arrow.png) no-repeat right 30px center,
    url(/asset/images/contact/bnrArea_bg.png) no-repeat left -70px center;
  background-size:50px, 20px, auto 130%;
  background-color: #b5263f;
}
.contactList .contactBtnArea ul li.ippan a{padding: 40px 40px 40px 50px; text-align: center; font-size: 100%;}
.contactList .contactBtnArea ul li.press a{padding: 20px 20px 20px 20px; text-align: center; font-size: 100%;}
.contactList .contactBtnArea ul li.press {width: 90%; margin: 0 auto;}
}






.mainForm{padding:;}

.mainForm dl{ width: 100%; display: table; border-top: 1px dashed #ddd;}
.mainForm dt{ width: 30%; display: table-cell;padding:20px 0; vertical-align: middle; color: #252658;}
.mainForm dd{ display: table-cell; padding: 20px 0; vertical-align: top; line-height: 3.5em;}
@media(max-width:750px){
.mainForm dl{ width: auto; display: block; border-top: 1px dashed #ddd;}
.mainForm dt{ width: auto; display: block;padding:30px 0 0; vertical-align: top; font-size: 30px;margin-bottom: 10px;}
.mainForm dd{ display: block; padding: 0px 0 30px ;vertical-align: top; padding-left: 20px;}

}



.mainForm input[type="text"]{ padding: 1em; width: 50%;box-sizing: border-box;border-radius: 10px; border:1px solid #9a9a9a;}
.mainForm select{ padding: 1em; width: auto;box-sizing: border-box;border-radius: 10px; border:1px solid #9a9a9a;}
.mainForm textarea{ padding: 1em; width: 100%; box-sizing: border-box; border-radius: 10px;border:1px solid #9a9a9a;}
.mainForm p.radioList{ line-height: 2em;padding: 20px 0;}
.nameControl{ margin-bottom: 0.5em;}
.submitArea{ text-align: center;}

.formBtn{ padding: 20px 100px; border: none;}

@media(max-width:750px){
.mainForm input[type="text"]{ padding: 0.5em; font-size: 30px;width: 100%;box-sizing: border-box; border: 2px solid #ccc;}
.mainForm select{ padding: 0.5em; font-size: 30px;width: 70%; border: 2px solid #ccc;}
.mainForm textarea{ padding: 0.5em;font-size: 30px; width: 100%; box-sizing: border-box; border:2px solid #ccc;}
.mainForm p.radioList{ line-height: 2em;padding: 20px 0; font-size: 30px;}

}