@charset "utf-8";
/* CSS Document */


/* ----------------------------------------------------
   index setting
------------------------------------------------------- */

/* main_v :
--------------------------------------------*/	


#main_visual {
	position: relative;
}

#main_visual .slideImg li {
	display: none;
}

#main_visual .slideImg li:first-child {
	display: block;
}

#main_visual .slideImg li .s {display: none;}


/* user:
--------------------------------------------*/

#user {
	padding: 0 1rem;
	margin-bottom: 3rem;
}

#user > ul {
	display: flex;
	position: relative;
	background: #fff;
	max-width: 1536px;
	min-height: 7rem;
	margin: -110px auto 0;
	border-top: 5px solid #bd3e27;
}

#user > ul > li {
	width: 33.3333%;
}

#user > ul > li > a {
	font-size: 1.1rem;
	display: block;
	width: 100%;
	min-height: 6.2rem;
	text-align: center;
	padding: 2rem 1rem 1.3rem;
	position: relative;
}

#user > ul > li > a:hover {background: #f9f8f7;}

#user > ul > li > a img {
	margin-right: 1.2rem;
	height: 45px;
}

#user > ul > li > a:after {
	content: "";
	display: block;
	position: absolute;
	right: 0;
	top: 2.2rem;
	height: 2rem;
	width: 1px;
	background: #c6bc9b;
}
#user > ul > li:first-child > a img {width: 40px;}
#user > ul > li:last-child a:after {display: none;}

@media screen and (max-width: 1366px){
	#user {
		margin-bottom: 2rem;
	}
}


@media screen and (max-width: 1366px){
	#user > ul {
		margin: -90px auto 0;
	}
	#user > ul > li > a {
		padding: 1.7rem 1rem 0.9rem;
		min-height: auto;
	}
	
	#user ul ul {
		padding: 1rem 2rem;
	}
	#user > ul > li > button {
		font-size: 1.1rem;
	}
}


/*---- important ----*/

#important {
	margin: 1rem 0 2rem;
	padding: 0 1rem;
}

#important ul {
	padding: 2rem 2rem 0.7rem;
	border: 1px solid #bd3e27;
}

#important ul li {
	position: relative;
	padding-left: 1.5rem;
	margin-bottom: 1rem;
	font-size: 1.1rem;
}

#important ul li::before{
	content: "";
	display: block;
	position: absolute;
	background: none;
	top: 35%;
    left: 0;
    width: 10px;
    height: 10px;
    border-top: 1px solid #bd3e27;
    border-right: 1px solid #bd3e27;
    transform: rotate(45deg);
}

#important ul li a {color: #bd3e27;}
#important ul li a:hover {text-decoration: underline;}

#important ul li a time {
	font-weight: bold;
	margin-right: 1rem;
}

#important ul li a .museums {
	margin-left: 1rem;
}


/* basic :
--------------------------------------------*/


/*---- section ----*/

main > section {
	padding-bottom: 3rem;
}


/*---- h2 ----*/

main > section > h2 {
	position: relative;
	background: #f0ede7;
	text-align: center;
	padding: 6rem 1rem 10rem;
}

main > section > h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 3rem;
	left: 50%;
	width: 4px;
	height: 30px;
	background: #bd3e27;
}

main .outline {
	position: relative;
	z-index: 1;
	background: #fff;
	margin-top: -7rem;
}


@media screen and (max-width: 1560px){
	main .outline {
		margin: -7rem 1rem 0;
	}
}

@media screen and (max-width: 1366px){
	main > section {
		padding-bottom: 2rem;
	}
	main > section > h2 {
		padding: 6rem 1rem 9rem;
	}
}

/*---- lnk ----*/

main .lnk2 {
	margin: 2rem 4rem;
	text-align: center;
}

main .lnk2 a {
	min-width: 16rem;
}

main .lnk2 a:hover {
	background-color: #f9f8f7;
}




/* topics :
--------------------------------------------*/

.tab_list {
	padding: 2rem 3rem;
}

.tab_list li {
	width: 25%;
}

/*---- list ----*/

.tab_panel {
	padding: 2rem 3rem 1rem;
}

.tab_panel .no_article{
	padding: 2rem 2rem 2rem 1rem;
}

.topics_link .lnk2:not(:first-child){
	display: none;
}

@media screen and (max-width: 1366px){
	.tab_list {
		padding: 1rem 2rem;
	}
	
	.tab_panel {
		padding: 1rem 2rem 1rem;
	}
}

/* museums :
--------------------------------------------*/

/*---- lead ----*/

#museums .outline > p {
	padding: 3rem 5rem 1rem;
	font-size: 1.1rem;
	line-height: 2rem;
}

#museums .outline > p.lnk2 {
	padding: 0 0 1rem;
}

#museums .map {
	margin-left: 1rem;
	width: 25px;
}

#museums .outline > p.lnk1 {
	padding: 0;
	margin-bottom: 3rem;
}
	
/*---- museums ----*/

#museums .clm4 {
	flex-wrap: wrap;
	justify-content: flex-start;
}

#museums .clm4 section {margin-right: 3%;}
#museums .clm4 section:nth-child(4),
#museums .clm4 section:nth-child(8) {margin-right: 0;}

#museums .clm4 section h3 {
	padding: 0.8rem 0.5rem;
	border-top: 4px solid #bd3e27;
}

#museums .clm4 section h3 img {
	margin-right: 1rem;
}

#museums .clm4 section:nth-child(1) h3 img {width: 130px;}
#museums .clm4 section:nth-child(3) h3 img {width: 130px;}
#museums .clm4 section:nth-child(4) h3 img {width: 55px;}
#museums .clm4 section:nth-child(5) h3 img {width: 80px;}
#museums .clm4 section:nth-child(6) h3 img {width: 55px;}
#museums .clm4 section:nth-child(7) h3 img {width: 50px;}
#museums .clm4 section:nth-child(8) h3 img {width: 50px;}

#museums .clm4 section h3 img.ncm_logo {
	margin: 10px 10px 5px 0;
	width: 100%;
	max-width: 200px;
	height: auto;
}

#museums .clm4 section ul {
	margin: 1rem 0;
	background: #f0ede7;
	display: flex;
	justify-content: space-between;
	padding: 1rem;
}

#museums .clm4 section:nth-child(8) ul {
	justify-content: flex-end;
}

#museums .clm4 section li {
	width: 40%;
}
#museums .clm4 section li:last-child {
	margin-left: 1rem;
	width: 60%;
}


#museums .clm4 section a {
	display: block;
	position: relative;
	padding: 0.5rem 10px 0.4rem 30px;
	background: #fff;
	text-decoration: none;
}

html[lang="en"] #museums .clm4 section a {
	word-break: break-all;
}

#museums .clm4 section a::before{
	content: "";
	display: block;
	position: absolute;
	top: 38%;
    left: 10px;
    width: 10px;
    height: 10px;
    border-top: 1px solid #c6bc9b;
    border-right: 1px solid #c6bc9b;
    transform: rotate(45deg);
}

#museums figure img {width: 100%;}

@media screen and (max-width: 1536px){

	html[lang="en"] #museums .clm4 section ul {
		display: block;
		padding: 0.5rem;
	}
	html[lang="en"] #museums section li {
		width: 100%;
	}
	html[lang="en"] #museums section li:last-child {
		margin: 10px 0 0;
		width: 100%;
	}
	html[lang="en"] #museums section:nth-child(8) li:last-child {
		margin: 0;
	}
}

@media screen and (max-width: 1366px){
	
	#museums .outline > p {
		padding: 3rem 4rem 1rem;
	}
	
	#museums .clm4 section,
	#museums .clm4 section:nth-child(4) {margin-right: 3%;width: 31.333%;}
	#museums .clm4 section:nth-child(3),
	#museums .clm4 section:nth-child(6) {margin-right: 0;}
}


/* support :
--------------------------------------------*/

/*---- lead ----*/

#support .outline > p {
	padding: 3rem 5rem 4rem;
	font-size: 1.1rem;
	line-height: 2rem;
}

#support .outline p.lnk2 {
	padding: 0;
	margin: 2rem 2rem 0;
}

@media screen and (max-width: 1366px){
	#support .outline > p {
		padding: 3rem 4rem 4rem;
	}
}

/*---- banner ----*/

#support .clm2 a {
	display: block;
	position: relative;
	box-shadow: 0px 8px 12px 2px rgba(10,10,10,0.1), 0px 0px 0px 1px rgba(10,10,10,0.02);
	text-decoration: none;
}

#support .clm2 a#crowdfunding {
	padding-bottom: 2rem;
}

#support .clm2 div {
	position: relative;
}
#support .clm2 div::after{
	content: "";
	display: block;
	position: absolute;
	top: 38%;
    right: 20px;
	bottom: 15px;
    width: 25px;
    height: 25px;
    border-top: 1px solid #c6bc9b;
    border-right: 1px solid #c6bc9b;
    transform: rotate(45deg);
}

#support .clm2 a h3 {
	font-size: 1.4rem;
	margin: 2rem 2rem 1rem;
	color: #bd3e27;
}

#support .clm2 a p {
	margin: 0 2rem 2rem;
	font-size: 1.1rem;
}

html[lang="en"] #support .clm2 a p {
	margin: 0 2rem 3rem;
}

#support .clm2 a#kifu div img {
	width: 70%;
	padding: 1rem 2rem 0.5rem;
}

#support .clm2 a#kifu div:before {
	content: "";
	display: block;
	height: 4px;
	top: 0;
	background: linear-gradient(to right,
      #f0bf30 20%, #e0007f 20% 40%, #009e96 40% 60%, #e6791e 60% 80%, #40a74a 80%);
}


#support .clm2 a#crowdfunding div {
	background: #ffef28;
	position: absolute;
	bottom: 0;
	width: 100%;
}

#support .clm2 a#crowdfunding div img {
	width: 80%;
	padding: 1.5rem 2rem;
}

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

/*---- lead ----*/

#about {
	background: url("../img/index/menu_bg.jpg") no-repeat;
	background-size: cover;
}

main #about h2 {padding: 6rem 1rem 7rem;}

main #about h2,
#about .outline {background: none;}
#about .outline {
	margin-top: -4rem;
}

#about .outline > p {
	padding: 3rem 5rem 3rem;
	font-size: 1.1rem;
	line-height: 2rem;
}

@media screen and (max-width: 1366px){
	#about .outline > p {
		padding: 3rem 4rem 3rem;
	}
}

#about .clm3 a {
	display: block;
	position: relative;
	background: #fff;
	padding: 2.2rem 2rem 2.5rem 3rem;
	margin-bottom: 2rem;
}

#about .clm3 a::after{
	content: "";
	display: block;
	position: absolute;
	right: 20px;
	bottom: 22px;
    width: 15px;
    height: 15px;
    border-top: 1px solid #c6bc9b;
    border-right: 1px solid #c6bc9b;
    transform: rotate(45deg);
}

#about .clm3 a h3 {
	position: relative;
}

#about .clm3 a h3:before {
	content: "";
	display: block;
	position: absolute;
	top: 0.5rem;
	left: -2rem;
    width: 1.3rem;
    height: 4px;
	background: #bd3e27;
}

#about .clm3 a p {
	margin: 1rem 0;
}



/* service :
--------------------------------------------*/

#service.outline {
	margin: 0 auto;
	padding: 3rem 1rem 2rem;
}

#service .clm2 li {
	align-items: center;
}

#service .clm2 a {
	display: block;
	position: relative;
	box-shadow: 0px 6px 10px 2px rgba(10,10,10,0.1), 0px 0px 0px 1px rgba(10,10,10,0.02);
	text-decoration: none;
	padding: 2rem 3rem;
	height: 100%;
}

#service .clm2 li:first-child a {
	padding: 1.5rem 9rem 1.5rem 2rem;
}

#service .clm2 a::after{
	content: "";
	display: block;
	position: absolute;
	top: 42%;
    right: 20px;
	bottom: 15px;
    width: 20px;
    height: 20px;
    border-top: 1px solid #c6bc9b;
    border-right: 1px solid #c6bc9b;
    transform: rotate(45deg);
}


/* search :
--------------------------------------------*/

#search .search1 {
	background: #f0ede7;
}

#about + #search {
	margin-top: 5rem;
}

#search .outline {
	background: transparent;
	margin: 0 auto;
	padding: 3rem 1rem 1rem;
}

/*---- banner ----*/

#search .clm2 a {
	display: block;
	position: relative;
	padding: 2.5rem 2rem 1rem 125px;
	background: #fff url("../img/common/icon_search.svg") no-repeat 30px 40px;
	background-size: 60px;
	margin-bottom: 2rem;
}

#search .search2 .clm2 a {
	border: 1px solid #c6bc9b;
}


#search .clm2 a.jps {
	padding: 2.5rem 2rem 1rem 125px;
	background: #fcfcfc url("../img/index/jps_bnr.gif") no-repeat 20px 40px;
}

#search .clm2 a h2 {
	color: #bd3e27;
	padding-right: 50px;
	font-size: 1.3rem;
	line-height: 2rem;
}

#search .clm2 a p {
	margin: 1rem 0;
	font-size: 1.1rem;
}

#search .clm2 a img.icon {
	position: absolute;
	top: 30px;
	right: 20px;
	width: 1.8rem;
}

@media screen and (max-width: 1366px){
	#search .clm2 a {
		padding: 2rem 2rem 0.5rem 100px;
		background-size: 50px;
	}
	
	#search .clm2 a.jps {
		padding: 2rem 2rem 0.5rem 100px;
		background-size: 70px;
	}
}

/* important :
--------------------------------------------*/

main #important .outline {
	margin: 0 auto;
}