@charset "utf-8";
/* ==================================================================
CSS information
style info : ミュージアム＆ハイライト
================================================================== */


/* --------------------------------------------------------
OVERWRITE
-------------------------------------------------------- */
#section-Area { padding-top: 9.375%;}
@media screen and (min-width: 641px) {
	#section-Area { padding-top: 1.428571%;}
}
@media screen and (min-width: 1401px) {
	#section-Area { padding-top: 20px; padding-bottom: 50px;}
}
/* --------------------------------------------------------
COMMON
-------------------------------------------------------- */
.chara-Block { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.chara-Block li { position: absolute; top: 0;}


/* --------------------------------------------------------
#section-Museum
-------------------------------------------------------- */
#section-Museum { position: relative; padding-bottom: 10%; }

#museum-conts { background: #610001 url(../_img/museum/bg_sp.jpg) top center no-repeat; background-size: contain; border-radius: 12px; 
	padding-top: 6.896551%; padding-bottom: 3.620689%; position: relative;}
#museum-conts .chara-Block { }
#museum-conts .chara-Block li { }
#museum-conts .chara-Block .cha1 { width: 19.827586%; left: -2.413793%; margin-top: 7.241379%; }
#museum-conts .chara-Block .cha2 { width: 21.034482%; right: -5%; margin-top: -2.586206%; }
#museum-conts .chara-Block .cha3 { width: 28.275862%; right: 0; margin-top: 53.103448%; }
#museum-conts .chara-Block .cha4 { width: 43.448275%; left: 0; margin-top: 101.896551%; }
#museum-conts .chara-Block .cha5 { width: 28.793103%; right: 0; margin-top: 155.172413%; }

#museum-conts .hl { margin-bottom: 2.413793%; position: relative; }
#museum-conts .readtext { margin-bottom: 5.172413%; position: relative;}

#museum-conts .ss-Block { width: 100%; margin-bottom: 3.448275%; }
#museum-conts .ss-Block li { position: relative; width: 66.896551%; }/* w388 */
#museum-conts .ss-Block li .text { margin-top: -9.536082%; position: relative;}/* mt37 */
#museum-conts .ss-Block .ss1 { margin-left: 3.448275%; margin-bottom: 2.758620%; }
#museum-conts .ss-Block .ss2 { margin-left: 29.655172%; margin-bottom: 2.758620%; }
#museum-conts .ss-Block .ss2 .text { width: 115.463917%; max-width: none; margin-left: -17.010309%; }
#museum-conts .ss-Block .ss3 { margin-left: 3.448275%; }
#museum-conts .ss-Block .ss3 .text { width: 103.092783%; max-width: none; margin-left: 4.639175%; }

#museum-conts .btn_4coma { width: 93.103448%; margin: 0 auto; position: relative;}

@media screen and (min-width: 641px) {
	#section-Museum { padding: 0 0 3.571428%; z-index: 99;}

	#museum-conts { background: #610001 url(../_img/museum/bg_pc.jpg) top center no-repeat; background-size: cover; width: 100%; margin: 0 auto; padding-top: 2.272727%; padding-bottom: 1.818181%; }
	#museum-conts .chara-Block { }
	#museum-conts .chara-Block li { }
	#museum-conts .chara-Block .cha1 { width: 9.242424%; max-width: 122px; left: 15.606060%; margin-top: -0.454545%; }
	#museum-conts .chara-Block .cha2 { width: 8.712121%; max-width: 115px; right: 14.469696%; margin-top: -2.5%; }
	#museum-conts .chara-Block .cha3 ,
	#museum-conts .chara-Block .cha4 ,
	#museum-conts .chara-Block .cha5 { display: none; }

	#museum-conts .hl { width: 54.545454%; max-width: 720px; margin: 0 auto 0.681818%; }
	#museum-conts .readtext { width: 40.530303%; max-width: 535px; margin: 0 auto 2.575757%; }

	#museum-conts .ss-Block { letter-spacing: -.45em; text-align: center; margin-bottom: 1.515151%;}
	#museum-conts .ss-Block li { letter-spacing: normal; display: inline-block; width: 29.393939%; max-width: 388px; }/* w388 */
	#museum-conts .ss-Block li .text { margin-top: -6.185567%; }
	#museum-conts .ss-Block .ss1 { margin-left: 0%; margin-bottom: 0; }
	#museum-conts .ss-Block .ss2 { margin: 0 2.878787%; }
	#museum-conts .ss-Block .ss2 .text { width: 100%; margin-left: 0; }
	#museum-conts .ss-Block .ss3 { margin-left: 0; }
	#museum-conts .ss-Block .ss3 .text { width: 100%; margin-left: 0; }
	
	#museum-conts .btn_4coma { max-width: 554px; width: 41.969696%; margin: 0 auto;}
	#museum-conts .btn_4coma { -webkit-transform: scale(1.0); transform: scale(1.0); -webkit-transition: .1s ease-in-out; transition: .1s ease-in-out; -webkit-backface-visibility: hidden;}
	#museum-conts .btn_4coma:hover { -webkit-transform: scale(1.03); transform: scale(1.03);}

}
@media screen and (min-width: 1401px) {
	#section-Museum { padding-bottom: 50px; }
	#museum-conts { padding-top: 30px; padding-bottom: 24px; }
}







/* --------------------------------------------------------
#section-Highlight
-------------------------------------------------------- */
#section-Highlight { position: relative; }

#highlight-conts { background: #a34701 url(../_img/highlight/bg_sp.jpg) top center no-repeat; background-size: 100%; border-radius: 12px; 
	padding-top: 6.896551%; padding-bottom: 3.620689%; position: relative;}
#highlight-conts .chara-Block { }
#highlight-conts .chara-Block li { }
#highlight-conts .chara-Block .mark { width: 32.931034%; left: -4.827586%; margin-top: -5.862068%; }
#highlight-conts .chara-Block .cha1 { width: 36.034482%; right: -3.103448%; margin-top: 164.310344%; }

#highlight-conts .hl { margin-bottom: 2.413793%; position: relative; }
#highlight-conts .readtext { margin-bottom: 5.172413%; position: relative;}

#highlight-conts .ss-Block { width: 100%; }
#highlight-conts .ss-Block li { position: relative; width: 66.896551%; }/* w388 */
#highlight-conts .ss-Block li .text { margin-top: -9.536082%; position: relative;}/* mt37 */
#highlight-conts .ss-Block .ss1 { margin-left: 3.448275%; margin-bottom: 2.758620%; }
#highlight-conts .ss-Block .ss1 .text { width: 103.092783%; max-width: none; margin-left: 4.639175%; }
#highlight-conts .ss-Block .ss2 { margin-left: 29.655172%; margin-bottom: 2.758620%; }
#highlight-conts .ss-Block .ss2 .text { width: 108.247422%; max-width: none; margin-left: -10.567010%; }
#highlight-conts .ss-Block .ss3 { margin-left: 3.448275%; }
#highlight-conts .ss-Block .ss3 .text { width: 103.092783%; max-width: none; margin-left: 4.639175%; }

@media screen and (min-width: 641px) {
	#section-Highlight { padding: 0; z-index: 9;}

	#highlight-conts { background: #a34701 url(../_img/highlight/bg_pc.jpg) top center no-repeat; background-size: 100%; width: 100%; margin: 0 auto; padding-top: 2.272727%; padding-bottom: 1.818181%; }
	#highlight-conts .chara-Block { }
	#highlight-conts .chara-Block li { }
	#highlight-conts .chara-Block .mark { width: 17.651515%; max-width: 233px; left: 6.742424%; margin-top: -1.666666%; }
	#highlight-conts .chara-Block .cha1 { width: 19.015151%; max-width: 251px; right: 2.878787%; margin-top: 2.121212%; }

	#highlight-conts .hl { width: 41.439393%; max-width: 547px; margin: 0 auto 0.681818%; }
	#highlight-conts .readtext { width: 52.5%; max-width: 693px; margin: 0 auto 2.575757%; }

	#highlight-conts .ss-Block { letter-spacing: -.45em; text-align: center; }
	#highlight-conts .ss-Block li { letter-spacing: normal; display: inline-block; width: 29.393939%; max-width: 388px; }/* w388 */
	#highlight-conts .ss-Block li .text { margin-top: -6.185567%; }
	#highlight-conts .ss-Block .ss1 { margin-left: 0%; margin-bottom: 0; }
	#highlight-conts .ss-Block .ss2 { margin: 0 2.878787%; }
	#highlight-conts .ss-Block .ss2 .text { width: 100%; margin-left: 0; }
	#highlight-conts .ss-Block .ss3 { margin-left: 0; }
	#highlight-conts .ss-Block .ss3 .text { width: 100%; margin-left: 0; }
	

}
@media screen and (min-width: 1401px) {
	#section-Highlight {  }
	#highlight-conts { padding-top: 30px; padding-bottom: 24px; }
}