/* CSS Document */

header.loaded{transition: background-color 0.3s;}
header.bg{background-color: #FFF;}

.top_slide{
	position: relative;
	width:100%;
	padding-top: calc(100% * 9 / 16);
}
@media screen and (max-width: 999px) {
	.top_slide{padding-top: min(100vh,calc(100% * 667 / 375));}
	.top_slide > * img{object-position: center 60%;}
}
.top_slide > *,
.top_slide > * img{
	width:100%;
	height: 100%;
}
.top_slide > *{
	position: absolute;
	top:0;
	left:0;
	opacity: 0;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	/*
	-webkit-backface-visibility: hidden;
  -webkit-animation: anime_top_slide 12s linear infinite 0s;
  -moz-animation: anime_top_slide 12s linear infinite 0s;
  -o-animation: anime_top_slide 12s linear infinite 0s;
  -ms-animation: anime_top_slide 12s linear infinite 0s;
  animation: anime_top_slide 12s linear infinite 0s;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -o-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  transition: all 0.3s ease 0s;
	*/
}
.top_slide > *.now{
	opacity: 1;
	transition: opacity 4s ease;
	z-index: 3;
}
.top_slide > *.old{z-index: 2;}
/*
.top_slide > *:nth-child(2){
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -o-animation-delay: 6s;
  -ms-animation-delay: 6s;
  animation-delay: 6s;
}
.top_slide > *:nth-child(3){
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  -ms-animation-delay: 12s;
  animation-delay: 12s;
}
*/
/*
@-webkit-keyframes anime_top_slide {
  0%{opacity: 0;-webkit-animation-timing-function: ease-in;}
  8%{opacity: 1;-webkit-animation-timing-function: ease-out;}
  17%{opacity: 1;}
  25%{opacity: 0;}
  100%{opacity: 0;}
}
@-moz-keyframes anime_top_slide {
	0%{opacity: 0;-moz-animation-timing-function: ease-in;}
  8%{opacity: 1;-moz-animation-timing-function: ease-out;}
  17%{opacity: 1;}
  25%{opacity: 0;}
  100%{opacity: 0;}
}
@-o-keyframes anime_top_slide {
	0%{opacity: 0;-o-animation-timing-function: ease-in;}
  8%{opacity: 1;-o-animation-timing-function: ease-out;}
  17%{opacity: 1;}
  25%{opacity: 0;}
  100%{opacity: 0;}
}
@-ms-keyframes anime_top_slide {
	0%{opacity: 0;-ms-animation-timing-function: ease-in;}
  8%{opacity: 1;-ms-animation-timing-function: ease-out;}
  17%{opacity: 1;}
  25%{opacity: 0;}
  100%{opacity: 0;}
}
*/
/*
@keyframes anime_top_slide {
	0%{opacity: 0;animation-timing-function: ease-in;z-index: 1;}
  25%{opacity: 1;animation-timing-function: ease-out;z-index: 2;}
  50%{opacity: 1;}
  75%{opacity: 0;z-index: 1;}
  100%{opacity: 0;}
}
*/
/* .top_slide > *:nth-child(3){opacity:1;z-index: 2;} */
.top_slide > * > .t{
	position: absolute;
	font-size: calc(1vw * 25 / 16);
	font-weight: 700;
	line-height: 2.4em;
	opacity: 0;
}
.top_slide > *.now > .t{
	opacity: 1;
	transition: opacity 4s ease;
	transition-delay: 4s;
}
.top_slide > * .caution{
	position: absolute;
	bottom:0.5em;
	left:0.75em;
	font-size: 0.9rem;
	writing-mode: initial;
	letter-spacing: 0;
}
@media screen and (min-width: 1000px) {
	.top_slide .n01 .t{margin-top: 2.4em;}
	.top_slide .n02 .t{
		top: 6em;
		right: 5.2em;
	}
	.top_slide .n03 .t{
		top: 6.6em;
		left: 5.8em;
	}
}
@media screen and (max-width: 999px) {
	.top_slide > * > .t{font-size: calc(1vw * 22 / 3.75);}
	.top_slide .n01 .t{margin-bottom: max(-6.2em,calc(-6.2em + ((1vw * 667 / 375) - 1vh) * 22));}
	.top_slide .n02 .t{margin-bottom: max(-4.2em,calc(-4.2em + ((1vw * 667 / 375) - 1vh) * 22));}
	.top_slide .n03 .t{
		margin-bottom: max(-5em,calc(-5em + ((1vw * 667 / 375) - 1vh) * 22));
		text-shadow
		: 0 0 calc(1em * 10 / 22) #FFF
		, 0 0 calc(1em * 10 / 22) #FFF
		, 0 0 calc(1em * 10 / 22) #FFF
		, 0 0 calc(1em * 10 / 22) #FFF
		, 0 0 calc(1em * 10 / 22) #FFF
		;
	}
}

.top_slide + *{
	position: relative;
	z-index: 5;
	display: flex;
	justify-content: center;
}
.top_slide + * > *{
	height: 110px;
	margin-top: -60px;
	border-left: solid 1px #000000;
	position: relative;
	opacity: 0;
	-webkit-backface-visibility: hidden;
  -webkit-animation: anime_top_slide_arrow 2s ease infinite 0s;
  -moz-animation: anime_top_slide_arrow 2s ease infinite 0s;
  -o-animation: anime_top_slide_arrow 2s ease infinite 0s;
  -ms-animation: anime_top_slide_arrow 2s ease infinite 0s;
  animation: anime_top_slide_arrow 2s ease infinite 0s;
}
.top_slide + * > * > *{
	position: absolute;
	left: -1px;
	bottom: 0;
	height: 20px;
	border-left: solid 1px #000000;
	transform: rotate(45deg);
	transform-origin: left bottom;
}
@keyframes anime_top_slide_arrow {
	0%{opacity: 0;transform: translateY(-20px);}
  /* 25%{opacity: 1;transform: translateY(-20px);} */
  40%{opacity: 1;}
  80%{opacity: 0;transform: translateY(20px);}
  100%{opacity: 0;transform: translateY(20px);}
}
@media screen and (max-width: 999px) {
	.top_slide + * > *{margin-top: -130px;}
}

.top_catch{
	display: flex;
	justify-content: center;
}
.top_catch .tate_set h2{font-size: min(34px,max(26px,3.4vw));}
.top_pic1{
	width: 794px;
	max-width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}
.top_pic1 > * > *{position: relative;}
.top_pic1 > * > * .caution{
	position: absolute;
	bottom:0.5em;
	left:0.75em;
	font-size: 0.8rem;
}
@media screen and (min-width: 1000px) {
	.top_catch .tate_set h2{margin-left: 1.75em;}
	.top_catch .tate_set h2 + *{line-height: calc(1em * 57 / 19);}
	.top_pic1 > *:nth-child(2){margin-top: 122px;}
}
@media screen and (max-width: 999px) {
	.top_catch{text-align: justify;}
	.top_pic1{
		gap: 40px;
		flex-direction: column;
	}
	.top_pic1 > *{
		width: 100%;
		display: flex;
		justify-content: center;
	}
	.top_pic1 > *:nth-child(1) > *{margin-right: min(190px,calc(1vw * 102 / 3.75),calc(1% * 102 / 3.4));}
	.top_pic1 > *:nth-child(2) > *{margin-left: min(190px,calc(1vw * 102 / 3.75),calc(1% * 102 / 3.4));}
	.top_pic1 img{
		width: min(320px,calc(1vw * 174 / 3.75));
		max-height: calc(1vw * 159 / 3.75);
	}
}

.top_kodawari{}
.top_kodawari ul{
	gap: 50px;
	display: flex;
	flex-direction: column;	
}
.top_kodawari ul li{
	display: flex;
	justify-content: center;
}
.top_kodawari ul li .pic{position: relative;}
.top_kodawari ul li .pic .caution{
	position: absolute;
	bottom:0.5em;
	left:0.75em;
	font-size: 0.8rem;
}
@media screen and (min-width: 1000px) {
	.top_kodawari ul li{align-items: flex-start;}
	.top_kodawari ul li.L .tate_set{
		margin-right: auto;
		padding-right: min(50px,calc((1vw - 10px) * 15 / 6 + 35px));
	}
	.top_kodawari ul li.R .tate_set{
		margin-left: auto;
		padding-left: min(50px,calc((1vw - 10px) * 15 / 6 + 35px));
	}
	.top_kodawari ul li[class] .tate_set h2 + *{margin-bottom: -2em;}
	.top_kodawari ul li[class] img{
		width: 100%;
		height: 340px;
	}
	.top_kodawari ul li .pic{max-width: calc(1% * 970 / 16);}
	.top_kodawari ul li.L .pic{margin-right: min(50px,calc((1vw - 10px) * 15 / 6 + 35px));}
	.top_kodawari ul li.R .pic{margin-left: min(50px,calc((1vw - 10px) * 15 / 6 + 35px));}
}
@media screen and (max-width: 999px) {
	.top_kodawari ul{
		gap: max(60px,min(8vw,calc(1vw * 60 / 3.75)));
		text-align: justify;
	}
	.top_kodawari ul li{		
		gap: 40px;
		flex-direction: column;
		align-items: center;
	}
	.top_kodawari ul li[class] img{width: 100%;}
	.top_kodawari ul li .pic{order:1;}
	.top_kodawari ul li .tate_set{order:2;min-width: 295px;}
}

.top_menu{display: flex;}
.top_menu .p{
	position: relative;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_menu .p img{
	width:100%;
	height:100%;
}
.top_menu .p .maru{
	background-color: #333;
	color:#FFF;
	font-size: min(12px,max(8.5px,1.2vw));
	font-weight: 700;
	line-height: calc(1em * 16 / 14);
	text-align: center;
	white-space: pre-wrap;
	border-radius: 100%;
	position: absolute;
	top:1em;
	left:1em;
	width:6em;
	height:6em;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_menu .p .maru.br2{line-height: calc(1em * 18 / 14);}
.top_menu .p .caution{
	position: absolute;
	bottom:0.5em;
	left:0.75em;
	font-size: 0.8rem;
}
.top_menu h3{margin-top: 1.25em;}
.top_menu h3:not(:last-child){margin-bottom: 1em;}
.top_menu h3 + *{
	text-align: justify;
	line-height: calc(1em * 25 / 16);
}
@media screen and (min-width: 1000px) {
	.top_menu{gap: calc(1% * 40 / 11);}
	.top_menu li{width: calc(1% * 340 / 11);}
	.top_menu .p{height: 270px;}
}
@media screen and (max-width: 999px) {
	.top_menu{
		gap: 40px;
		flex-direction: column;
		align-items: center;
	}	
	.top_menu li{width:min(680px,calc(1vw * 300 / 3.75));}
	.top_menu .p{height: min(540px,max(238px,calc(1vw * 238 / 3.75)));}
}

.top_other_bnr{
	color:#FFF;
	display: flex;
}
.top_other_bnr > *{
	flex-grow: 1;
	position: relative;	
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_other_bnr img{width:100%;}
.top_other_bnr h2{
	font-size: min(30px, max(26px, 3vw));
	line-height: 1.25em;
	position: absolute;
	top: 1em;
	right: 1em;
	z-index: 2;
}
.top_other_bnr .cs{
	position: absolute;
	background-color: rgba(0,0,0,0.8);
	gap: 4px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.top_other_bnr .cs span{font-size: min(21px,max(13px,2.1vw));}
.top_other_bnr .cs span.font_size2{
	font-size: min(31px,max(19px,3.1vw));
	font-weight: 700;
	line-height: 1.25em;
}
.top_other_bnr > * .caution{
	position: absolute;
	bottom:0.5em;
	left:0.75em;
	font-size: 0.9rem;
}
@media screen and (min-width: 1000px) {
	.top_other_bnr img{height: 453px;}
	.top_other_bnr .cs{
		width: min(338px,30vw);
		height: 120px;
	}
}
@media screen and (max-width: 999px) {
	.top_other_bnr{flex-direction: column;}
	.top_other_bnr img{max-height: calc(1vw * 208 / 3.75);}
	.top_other_bnr .cs{padding: calc(1em * 13.75 / 15) calc(1em * 25.5 / 15);}
}