

#main_images {
	position: relative;
	display: block;
	width: 100vw;
	height: 30em;
	padding: 0;
	list-style: none;
	margin: 0 auto;
	transition: all 1.5s ease 200ms;
	transform: none;
	overflow: hidden;
	opacity: 1;
}

#main_images.moving_l,
#main_images.moving_r
{

}



#main_images.moving_l {
	opacity: 0.7;
	transform: translateX(0.5em) scale(98%);
	transition: all 300ms;
}

#main_images.moving_r {
	opacity: 0.7;
	transform: translateX(-0.5em) scale(98%);
	transition: all 300ms;
}







#main_images > ul > li#main_image0{
	z-index: 10;
}

#main_images > ul:first-of-type  {

	height: 100%;

}

#main_images > ul:first-of-type > li {
	transition: all 1.5s;
	text-align: center;
	margin: 0;
	padding: 0;
	height: 100%;
	position: absolute;
	top: 0;
	left:0;
	z-index: 9;

	display: block;
	overflow: hidden;
}

#main_images > ul:first-of-type > li img:last-of-type {
	position: absolute;
	top: 0;
	left: 0;
	transition: opacity 0.5s;
}

#main_images > ul:first-of-type > li > picture,
#main_images > ul:first-of-type > li img {
	max-width: 100%;
	margin: auto;
	z-index: 10;
	list-style: none;
	display: block;
}

#main_images.cover > ul:first-of-type > li > picture,
#main_images.cover > ul:first-of-type > li img {
	object-fit: cover;
	width: 100vw;
	height: 30em;
}

#main_images.cover > ul:first-of-type > li > div {
	display: flex;
	width: 100%;
	max-width: 1200px;
	height: 100%;
	line-height: 1.4;
	margin: 0 auto;
	justify-content: center;
	align-items: center;
	vertical-align: middle;
	position: absolute;
	top: 0;
	left: calc(50% - 600px);


}

#main_images.cover > ul:first-of-type > li > div > p {
	font-size: 4rem;
	font-family: "M PLUS Rounded 1c", "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	white-space: normal;
}

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

	#main_images.cover > ul:first-of-type > li > div {
			left: 1rem;
			width: calc(100% - 2rem);
	}

}





ul#main_images_btn{
	position: absolute;
	display: inline-block;
	margin: auto;
	padding: 0;
	list-style: none;
	z-index: 20;
	bottom: 8%;
	left: 50%;
	width: auto;
	height: 12px;
	text-align: center;
	display: block;
}

ul#main_images_btn:after {
	content:".";
	display: block;
	height:0px;
	clear:both;
	visibility:hidden;
}

ul#main_images_btn{
	display: inline-block;
}

/*\*/
html ul#main_images_btn{ height:1%; }
ul#main_images_btn{ display:block; }
/**/

ul#main_images_btn li{
	position: relative;
	display: block;
	float: left;
	left: -50%;
	height: 12px;
	width: 12px;
	margin: 0 0 0 25px;
	padding: 0;
	z-index: 20;
}

ul#main_images_btn li a{
	display: block;
	height: 12px;
	width: 12px;
	margin: 0;
	padding: 0;
	/*text-indent: -9999px;*/
	overflow: hidden;
	background-color: #fff;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	z-index: 20;
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.1);
}


ul#main_images_btn li a.current{

	background-color: #000;

}

ul#main_images_btn li a span{
	display: none;
	height: 0;
	width: 0;
	margin: 0;
	padding: 0;
	/*text-indent: -9999px;*/
}

ul#main_images_btn li a:hover{
	background-position: left bottom;
}

/* p#main_element_arrow_l,
p#main_element_arrow_r
{
	position: absolute;
	top: 50%;
	margin-top: -25px;
	z-index: 11;

}

p#main_element_arrow_l
{
	left: 10px;
	width: 40px;
}

p#main_element_arrow_r
{
	right: 10px;
	width: 40px;
} */



.main_images_arrow{
	position: absolute;
	display: inline-block;
	top: calc(50% - 1.8em);
	width: 0.5em;
	height: 1.4em;
	z-index: 25;
}

.main_images_arrow#main_images_arrow_l{
	left: 3em;
}
.main_images_arrow#main_images_arrow_r{
	right: 3em;
}

.main_images_arrow a{
	position: relative;
	display: inline-block;
	width: 1.5em;
	height: 5em;
}

.main_images_arrow a::before,
.main_images_arrow a::after {
	content: "";
	position: absolute;
	top: calc(50% - 3px);
	width: 1.8em;
	height: 6px;
	border-radius: 9999px;
	background-color: #fff;
	transform-origin: calc(100% - 3px) 50%;
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
}


.main_images_arrow#main_images_arrow_l a::before
{
	transform: rotate(120deg);
	left: -1.2em;
}

.main_images_arrow#main_images_arrow_l a::after
{
	transform: rotate(-120deg);
	left: -1.2em;
}

.main_images_arrow#main_images_arrow_r a::before
{
	transform: rotate(60deg);
	left: -0.5em;
}

.main_images_arrow#main_images_arrow_r a::after
{
	transform: rotate(-60deg);
	left: -0.5em;
}

.main_images_arrow a span{
	display: none;
}



#main_images.cover.static > p {
	
	transition: all 1.5s;
	text-align: center;
	margin: 0;
	padding: 0;
	height: 100%;
	position: absolute;
	top: 0;
	left:0;
	z-index: 9;
	display: block;
	overflow: hidden;
}

#main_images.cover.static > div.strings {

	font-size: 3rem;
	display: flex;
	width: 100%;
	max-width: 1200px;
	height: 100%;
	line-height: 1.4;
	margin: 0 auto;
	justify-content: center;
	align-items: center;
	vertical-align: middle;
	position: absolute;
	top: 0;
	left: calc(50% - 600px);
	z-index: 10;
}