/* CSS Document */
.hero {
/*	height: calc(100vh - 114px);*/
	position: relative;
}
@media screen and (max-width: 767px) {
.hero {
	height: 830px;
}
}
/** メインビジュアル **/
.ls_mainvisual {
	width: 100%;
  margin-bottom: 50px;
	position: relative;
	background-color: #fff;
}
.ls_mainvisual > .dummy_item {
	max-width: 100%;
	margin: 0 auto;
}
.ls_mainvisual > .dummy_item::before {
	width: 100%;
	margin: 0;
	padding: min(56.25%,calc(100vh - 114px)) 0 0;
	content: "";
	display: block;
}

@media screen and (max-width: 767px) {
.ls_mainvisual > .dummy_item::before {
	padding: 100vh 0 0;
}
}


.ls_mainvisual .item {
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	overflow: hidden;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	text-decoration: none;
	color: var(--color-text);
}
.ls_mainvisual .item .bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;	
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .bg {
	object-position: center top;
}
}



.ls_mainvisual .item .item_inner {
	max-width: 85%;
	height: 100%;
	margin: 0 auto;
	position: relative;
}
.ls_mainvisual .item .item_inner .summary {
	width: min(25vw,480px);
	height: min(25vw,480px);
	position: absolute;
	right: 0;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .item_inner {
	max-width: calc(100% - 30px);
}
.ls_mainvisual .item .item_inner .summary {
	width: 100%;
	height: auto;
  top: 220px;
  transform: translateY(0);
}
	
	
	
}


.ls_mainvisual .item .item_inner .summary .imgbox {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem;
  gap: 5px;             /* 画像の隙間 */
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .item_inner .summary .imgbox {
/*	display: block;*/
	width: 270px;
	margin: 0 0 15px auto;
}
}

.ls_mainvisual .item .item_inner .summary .imgbox img {
  max-width: 100%;       /* 親幅からはみ出さない */
	min-width: 0;          /* ← これが重要！縮小可能にする */
  height: auto;          /* 縦横比を維持 */
  flex-shrink: 1;    /* 狭ければ縮む */
  flex-grow: 0;      /* 広くても拡大しない */
}



.ls_mainvisual .item .item_inner .summary .txtbox {
  text-shadow:
    -1px -1px 0 #fff, /* 左上 */
     1px -1px 0 #fff, /* 右上 */
    -1px  1px 0 #fff, /* 左下 */
     1px  1px 0 #fff, /* 右下 */
    0   -1px 0 #fff,  /* 上 */
    1px  0   0 #fff,  /* 右 */
    0    1px 0 #fff,  /* 下 */
   -1px  0   0 #fff;  /* 左 */
/*	padding: 3px;*/
/*	background-color: rgba(0,0,0,0.7);*/
}


.ls_mainvisual .item .item_inner .summary .txtbox .txt_main{
	font-size: min(22/1900*100vw,var(--txt-size-xl));
	font-weight: bold;
	line-height: 1.4;
}
.ls_mainvisual .item .item_inner .summary .txtbox .txt_date {
	font-size: min(22/1900*100vw,var(--txt-size-xl));
	font-weight: bold;
	margin: 0.6em 0 0;
	color: var(--color-main);
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .item_inner .summary .txtbox .txt_main{
	font-size: var(--txt-size-l);
}
.ls_mainvisual .item .item_inner .summary .txtbox .txt_date {
	font-size: var(--txt-size-l);
}
}


.ls_mainvisual .item .item_inner img.sp {
	display: none;
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .item_inner img.pc {
	display: none;
}
.ls_mainvisual .item .item_inner img.sp {
	display: inline;
}
}

.ls_mainvisual .item .item_inner .mv_main {
	position: absolute;
	opacity: 0;
	
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .item_inner .mv_main {
}
}


.ls_mainvisual .item .item_inner .mv_rogo {
	position: absolute;
	opacity: 0;
}
@media screen and (max-width: 767px) {
.ls_mainvisual .item .item_inner .mv_rogo {
}
}



.ls_mainvisual .loading {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: var(--color-sub);
	top: 0;
	left: 0;
	
}
.ls_mainvisual .loading .bar {
	background-color: #fff;
	height: 1px;
	width: 0%;
	position: absolute;
    top: 60%;
    left: 0px;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);	
	color: #fff;
}
@media screen and (max-width: 767px) {
.ls_mainvisual .loading .bar {
    top: 50%;
}
}

.ls_mainvisual .loading .p {
	position: absolute;
	top: 5px;
	right: 0px;
}
.mv_nav {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	display: none;
}
@media screen and (max-width: 767px) {
	.mv_nav {
		bottom: inherit;
		top: 60px;
	}
}

.mv_nav_inner {
	width: 85%;
	margin: 0 auto;
	padding: 0 0 70px;
	display: flex;
	justify-content: flex-end;
	z-index: 100;
column-gap: 8px
}
@media screen and (max-width: 767px) {
.mv_nav_inner {
	padding-bottom: 0px;
}
}


.mv_nav > .mv_nav_inner > div {
  cursor: pointer;
	height: 12px;
	width: 75px;
	position: relative;	
	background-color: var(--color-text);
	border-radius: 99px;
	overflow: hidden;
	border: 2px solid #fff;
	opacity: 0.7;
}
.mv_nav > .mv_nav_inner > div:hover {
	border: 2px solid var(--color-sub);
}
.mv_nav > .mv_nav_inner > div > span {
	content: "";
	display: block;
	width: 100%;
	height: 100%;	
	top: 0px;
	left: 0px;
	position: absolute;
	background-color: var(--color-sub);
}

/** infoSlider **/
.mv_info {
	position: absolute;
	width: 100%;
	pointer-events: none;
	top: 0;
	left: 0;
	opacity: 0;
}
.mv_info::before {
	width: 100%;
	margin: 0;
	padding: min(56.25%,calc(100vh - 114px)) 0 0;
	content: "";
	display: block;
}

.mv_info .mv_info_inner {
	position: relative;
	width: 85%;
	height: 100%;
	margin: 0 auto;
}
.infoSliderCover {
	padding: 8px;
	background-color: var(--color-main);
	position: absolute;
	left: 0;
	bottom: 70px;
	box-shadow: 0px 1px 8px rgba(0,0,0,0.4); 
}

.mv_info .infoSlider {
	pointer-events: auto;	
	width: min(370/1920*100vw,370px);
	height: min(210/1920*100vw,210px);
}
.mv_info .infoSlider .item {
	width: 100%;
	height: 100%;
	aspect-ratio: 370 / 210;
}
.mv_info .infoSlider .item img {
	object-fit: cover;
	width: 100%;
	height: 100%;
/*	height: min(210/1920*100vw,210px);*/
}
@media screen and (max-width: 767px) {
.mv_info::before {
	padding: 100vh 0 0;
}
.mv_info .mv_info_inner {
	position: absolute;
	top: 0;
	width: 100%;
}
.infoSliderCover {
	bottom: inherit;
	top: 580px;
	left: 15px;
	width: calc(100% - 30px);
}
.mv_info .infoSlider {
	width: 100%;
	max-width: 100%;
	aspect-ratio: 370 / 210;
	height: auto;
}
}

/** サムネイルリストの最初を大きくする **/
.thumb_list .item:first-child {
/*	width: calc(50% - 28px);*/
}
@media screen and (max-width: 767px) {
.thumb_list .item:first-child {
/*	width: calc(100% - 16px);*/
}
}