@charset "utf-8";


/*---------------------------------------------------------------------------
font
---------------------------------------------------------------------------*/
.english{
	font-family: 'Crimson Text', serif;
}

.mincho{
	font-family: "Kokoro",Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
}

.inter-ideograph{
	text-align: justify;
	text-justify: inter-ideograph;
}

/*---------------------------------------------------------------------------
ttl
---------------------------------------------------------------------------*/
.ttl{
	font-size:100%;
	line-height:1.2;
	margin:0 0 40px 0;
}

.ttl span{
	font-size:3.6rem;
	margin-bottom:10px;
}

@media(min-width:481px){
	.ttl span{
		font-size:4.6rem;
	}
}

/*---------------------------------------------------------------------------
color
---------------------------------------------------------------------------*/
body{
	background-color:#faf3da;
	color:#514109;
}

.header,.header .global{
	background-color:#799cd0;
	color:#fff;
}

.header .subNav{
	background-color:#fdd657;
}

.header .subNav a{
	color:#fff;
}

#topics .topicsList li a,a{
	color:#514109;
}

.btn a,.btn span,#topics .topicsList li .btn{
	color:#fff;
	background-color:#93b3e2;
}

.bgColor{
	background-color:#fdd657;
}

.btn a:hover,.profileBtn span:hover{
	background-color:#ddd;
	color:#514109;
	text-decoration:none;
}

#pageTop{
	background-color:#6f5c18;
	color:#fff;
}

footer,footer a,.drawer-hamburger{
	color:#fff;
}

footer .global{
	background-color:#6f5c18;
}

footer .btn a{
	background-color:#fff;
	color:#000;
}

footer .subNav ul li a {
	font-weight: bold;
	color: #000;
}

footer .caption{
	margin:0;
}

.header .global li span{
	color:#fff;
}

.blue{
	color:#93b3e2;
}

#loading{
	color:#715e1b;
	background-color:#fdd657;
}

@media(max-width:480px){
	body{
		background-size:100%;
	}
	
	.bg{
		background-size:150%;
	}
}


@media(min-width:1000px){
	.header .global li a:after{
		background-color: #ffffff;
	}
	
	footer a{
		color:#000;
	}

	.header h1{
		background-color:#fdd657;
	}
	
}

/*---------------------------------------------------------------------------

common

---------------------------------------------------------------------------*/
body{
	overflow-x: hidden;
}

.contentIn{
	max-width: 960px;
	margin:0 auto;
	box-sizing:border-box;
}

#snsBlock{
	margin:20px 0;
	float:right;
}

.btn{
	text-align:center;
}

.btn a,.btn span{
	display:inline-block;
	text-align:center;
	font-weight:bold;
	padding:3px 30px;
	margin:0 auto;
	text-decoration:none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}


	
.drawer-nav .subNav .btn {
	margin-bottom: 20px;
}

.profileBtn:hover{
	cursor:pointer;
}

.caption{
	margin-top:1rem;
}

.left{
	float:left;
}

.right{
	float:right;
}

.ttl{
	text-align:center;
}

.viewPC{
	display:none;
}

.viewS{
	display:block;
}

.ttl span{
	display:block;
}

@media(max-width:480px){
	.btn a{
		font-size:1.2rem;
	}
}

@media(max-width:767px){
	.left,.right{
		float:none;
	}
}

@media(max-width:999px){
	.subNav ul{
		margin-bottom:10px;
	}
	
	.subNav .btn a {
		display: block;
	}
}

@media(min-width:1000px){
	.viewPC{
		display:block;
	}

	.viewS{
		display:none;
	}

	.header .global li a:hover:after,#topics #nav_topics a:after,#ticket #nav_ticket a:after,#guide #nav_guide a:after,#point #nav_point a:after,#goods #nav_goods a:after,{
    	width: 100%;
	}

	.header ul li{
	}

}





/*---------------------------------------------------------------------------

top

---------------------------------------------------------------------------*/
/*
mainvisual
---------------------------------------------------------------------------*/
#mainvisual{
	background-color:#fdd657;
}

/*
countdown
---------------------------------------------------------------------------*/
#countdownBlock{
	justify-content:center;
	display:flex;
	background-color: #c8daf6;
	color: #5a7caf;
}

#countdown{
	font-weight:bold;
	text-align:center;
	font-size:2.0rem;
	line-height:1.2;
	display: inline-block;
	position: relative;
	text-align: center;
	box-sizing:border-box;
	vertical-align:bottom;
}

#countdown .english{
	font-size:5.0rem;
}

#countdown #last{
	font-size:3.0rem;
	margin-top:20px;
}

@media(min-width:480px){
	#countdownBlock{
		padding:2%;
	}
	
	#countdown{
		font-size:3.0rem;
	}
	
	#countdown br{
		display:none;
	}

	#countdown .english{
		font-size:7.0rem;
	}
}

/*
slider
---------------------------------------------------------------------------*/
#slider {
	background: #fff;
}

#slider img{
	height:150px;
}

.lg-toolbar{
	background:none!important;
}

@media(min-width:768px){
	#slider img{
		height:300px;
	}
}

/*
news
---------------------------------------------------------------------------*/

#news{
	background-color:#c8daf6;
}

.stitch_top{
	height:4px;
	background-color:#c8daf6;
	border-bottom:dashed 2px #fff;
}

.stitch_bottom{
	height:4px;
	background-color:#c8daf6;
	border-top:dashed 2px #fff;
}


/*
intro
---------------------------------------------------------------------------*/

#intro h3{
	line-height:1.6;
}

#intro h3 span{
	display:block;
}

@media(max-width:767px){
	#intro h3 span{
		display:block;
		text-align:center;
	}
}

@media(min-width:768px){
	#intro h2{
		font-size:4.2rem;
	}
	
	#intro #character #characterList > div:first-child{
		width:42.3%;
		margin-right:8%;
	}
}


/*
point
---------------------------------------------------------------------------*/
#pointTop{
    position: relative;
}

#svg-bg{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: -1;
}

#pointTop #character #characterList{
	padding-top:30px;
}

.tape{
	position:absolute;
	top:-30px;
	left: 0;
	right: 0;
	margin: auto;
	width:150px;
}

.memo{
  position: relative;
  background-color:#fff;
  padding:8%;
}

.memo:before, .memo:after{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #ababab;
  -moz-box-shadow: 0 15px 10px #ababab;
  box-shadow: 0 15px 10px #ababab;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.memo:after{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

@media(max-width:767px){
	#pointTop h2{
		margin-bottom:0;
	}
	
	#pointTop #character #characterList > div{
		display:block;
		width:auto;
		float:none;
	}

	#pointTop #character #characterList{
		padding-top:20px;
	}
	
	.tape{
		width:100px;
		top:-20px;
	}
}

@media(min-width:768px){
	#pointTop h2{
		font-size:4.2rem;
	}
	
	#pointTop #character #characterList > div:last-child{
		margin-top:-10px;
	}
	
	#pointTop .memo{
		margin-top:10px;
	}
}

/*---------------------------------------------------------------------------

point

---------------------------------------------------------------------------*/
#point h3{
	font-size:3.0rem;
	margin-top:40px;
	margin-bottom:40px;
	text-align:center;
	clear:both;
}

#point h3 span{
	font-size:60%;
	display:block;
}

#point h4{
	font-size:1.8rem;
	margin-bottom:30px;
}

#point .tenten{
	border:dashed 2px #93b3e2;
	padding:5%;
	border-radius:10px;
}

@media(max-width:480px){
	#point h2{
		margin-bottom:0;
	}
	
	#point .naminami{
		text-align:center;
		margin-left:-300px;
		margin-top:30px;
	}

	#point .naminami2{
		margin-left:-500px;
		margin-top:0;
	}
}

@media(min-width:481px){
	#point .naminami{
		margin-top:50px;
	}
}

@media(max-width:767px){
	.memo{
		margin-top:30px;
	}
	
	#point h4{
		text-align:center;
	}

	#point .tenten{
		margin:20px 0;
	}
	
}

@media(min-width:768px){
	#point h3{
		font-size:3.2rem;
	}
	
	#point h4{
		font-size:2.4rem;
	}

	#point .block{
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		justify-content:center;
	}

	#point .block.reverse{
		flex-flow: row-reverse;
	}
	
	#point .right{
		margin-left:5%;
	}
}


/*---------------------------------------------------------------------------

guide

---------------------------------------------------------------------------*/
#guide h3{
	text-align:center;
	font-size:2.0rem;
}

#guide .cf{
	margin-top:30px;
}

#guide .pricetime {
	margin-bottom: 1.0rem;
	font-weight: bold;
	color: #93b3e2;
	border:dashed 2px #93b3e2;
	padding:5%;
	border-radius:10px;
	text-align:center;
}

#guide .pricetime dt {
	font-size: 3.2rem;
}

#guide .pricetime dd {
	font-size: 2.0rem;
}

#guide .pricetime dd:last-child {
	font-size: 1.6rem;
}

#guide .memo{
	margin-top:40px;
}

@media(max-width:480px){
	#guide .pricetime dt {
		font-size:2.2rem;
	}
}

/*---------------------------------------------------------------------------

character

---------------------------------------------------------------------------*/
#character .content .content{
	background-color:#fff;
}

#character #characterList h4{
	line-height:1.4;
}

#character #characterList h4 span{
	display:block;
	font-size:1.5rem;
}

#character #characterList p{
	font-size:90%;
	line-height:1.6;
}

#character #characterList img{
	-webkit-backface-visibility:visible;
}

@media(max-width:480px){
	#character #characterList > li{
		margin-top:20px;
	}
}

@media(min-width:481px) and (max-width:767px){

	#character #characterList{
		overflow:hidden;
		display:flex;
		flex-wrap:wrap;
		align-items: stretch;
	}
	
	#character #characterList > div,#character #characterList > li,#character #characterList > article{
		float:left;
		width:48.25%;
		margin-right:3.5%;
		margin-bottom:3.5%;
	}

	#character #characterList > div:nth-child(even),#character #characterList > li:nth-child(even),#character #characterList > article:nth-child(even){
		margin-right:0;
	}

	#character #characterList:after{
		content: " ";
		clear: both;
	}
}

@media(min-width:768px){
	#character #characterList{
		display:flex;
		flex-wrap:wrap;
	}
	
	#character #characterList:after{
		content: " ";
		clear: both;
	}
	
	#character #characterList > div,#character #characterList > li,#character #characterList > article{
		box-sizing:border-box;
	}

	#character #characterList > div,#character #characterList > li,#character #characterList > article{
		width:22.375%;
		margin-right:3.5%;
		margin-bottom:3.5%;
		float:left;
	}

	#character #characterList > div:nth-child(4n),#character #characterList > li:nth-child(4n),#character #characterList > article:nth-child(4n){
		margin-right:0;
	}
}

/*---------------------------------------------------------------------------

goods

---------------------------------------------------------------------------*/
#goods #catalogue_area{
	margin-bottom: 40px;
}

#goods .cf{
	margin-top:30px;
}

#goods .memo{
	margin-top:40px;
}

#goods #goods_area {
	text-align:center;
	line-height:1.4;
}

#goods #goods_area h3{
	margin-bottom:40px;
}

#goods #goods_area h3 span{
	border-bottom:solid 1px #514109;
	padding-bottom:10px;
}

#goods #goods_area .column3 > li{
	margin-bottom:30px;
}

#goods #goods_area .column3 > li p{
	margin-top:20px;
}

#goods .text{
	color: #514109;
	/*border:dashed 2px #514109;*/
	background-color:#fff;
	padding:20px;
	border-radius:10px;
	text-align:center;
}

#goods .kome{
	margin-left:1em;
	text-indent:-1em;
	text-align:left;
	font-size:90%;
	letter-spacing:0.8px;
}

#goods .kome li{
	margin-bottom:0.5rem;
}

#goods .kome li:last-child{
	margin-bottom:0;
}

@media(max-width:480px){
	#goods #goods_area .column3 > li{
		float:left;
		width:48.25%;
		margin-right:3.5%;
		margin-bottom:3.5%;
	}

	#goods #goods_area .column3 > li:nth-child(even){
		margin-right:0;
	}

	#goods #goods_area h3{
		font-size:100%;
	}

	#goods #goods_area li{
		font-size:80%;
	}
	
}

/*---------------------------------------------------------------------------

ticket

---------------------------------------------------------------------------*/
#ticket .block{
	border-bottom: solid 1px #846b12;
	margin-bottom:30px;
	padding-bottom:30px;
}

#ticket .ticketPageLinkTtl h4{
	border:none;
	margin:0;
	padding:0;
}

#ticket .info, #information .info{
	background-color:#fdd657;
}

#ticket .admissionfeeList{
	background-color:#fff;
}

#ticket .admissionfeeList th{
	background-color:#fdd657;
}

/*---------------------------------------------------------------------------

topics

---------------------------------------------------------------------------*/
#topics .topicsList li > a,#topics .topicsList li > div,#topics #topicsEntry .text{
	padding:5%;
	border:solid 2px #000;
}

#topics .topicsList li{
	margin-bottom:15px;
}

#topics #topicsEntry h3{
	font-size:2.2rem;
}

/*---------------------------------------------------------------------------

footer

---------------------------------------------------------------------------*/
#Anniversary{
	text-align:center;
	padding:15px 0;
	clear:both;
}

/*---------------------------------------------------------------------------
lightgallery
---------------------------------------------------------------------------*/
.lg-outer .lg-image{
	padding-bottom:150px!important;
}
.lg-sub-html{
	padding:10px 10px 100px 10px!important;
 	background-color: rgba(0, 0, 0, 0.25)!important;
}


.lg-sub-html p{
	font-size:10px!important;
	margin-top:0!important;
}

.lg-backdrop.in {
    opacity: 0.8;
}