@charset "utf-8";
/*-----------------------------------------------
 * ONAIR
-------------------------------------------------*/
.c-onair{
	width: 100%;
	position: relative;
	padding-top: min(calc(40 / var(--vw-min) * 100vw), calc(40px * var(--max-percent)));
	padding-bottom: min(calc(140 / var(--vw-min) * 100vw), calc(140px * var(--max-percent)));
	overflow: hidden;
}
.c-onairContent{
	width: 100%;
	max-width: min(calc(1366 / var(--vw-min) * 100vw), calc(1366px * var(--max-percent)));
	padding: 0 min(calc(163 / var(--vw-min) * 100vw), calc(163px * var(--max-percent)));
	margin: 0 auto;
	position: relative;
}
.c-onairContentIn{
	width: 100%;
	padding-top: min(calc(64 / var(--vw-min) * 100vw), calc(64px * var(--max-percent)));
	position: relative;
}

@media screen and (max-width:768px){
	.c-onair{
		padding-top: calc(48 / var(--vw-min) * 100vw);
		padding-bottom: calc(128 / var(--vw-min) * 100vw);
	}
	.c-onair:before{
		top: calc(-52 / var(--vw-min) * 100vw);
		height: calc(54 / var(--vw-min) * 100vw);
	}
	.c-onairContent{
		max-width: 100%;
		padding: 0 calc(40 / var(--vw-min) * 100vw);
	}
	.c-onairContentIn{
		padding: calc(56 / var(--vw-min) * 100vw) 0 0 0;
	}
}


/*-----------------------------------------------
 * ONAIR - BLOCK
-------------------------------------------------*/
.onairCont{
	width: 100%;
	position: relative;
}
.onairCont:not(:first-child){
	padding-top: min(calc(94 / var(--vw-min) * 100vw), 94px);
}
.onair_h3{
	text-align: center;
	font-family: var(--font-en);
	font-size: min(calc(28 / var(--vw-min) * 100vw), 28px);
	font-weight: 700;
	line-height: 0.8;
	color: #916e49;
}
.onair_h3 > span{
	display: inline-block;
	padding: 0 min(calc(32 / var(--vw-min) * 100vw), 32px);
	position: relative;
	padding-top: min(calc(5 / var(--vw-min) * 100vw), 5px);
}
.onair_h3 > span:before,
.onair_h3 > span:after{
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask: url(../img/common/deco_star.svg) no-repeat center / contain;
	mask: url(../img/common/deco_star.svg) no-repeat center / contain;
	background-color: #916e49;
	-webkit-text-fill-color: initial;
}
.onair_h3 > span:before{
	left: 0;
}
.onair_h3 > span:after{
	right: 0;
}
.onairContIn{
	padding-top: min(calc(32 / var(--vw-min) * 100vw), 32px);
}

@media screen and (max-width:768px){
	.onairCont:not(:first-child){
		padding-top: calc(80 / var(--vw-min) * 100vw);
	}
	.onair_h3{
		font-size: calc(32 / var(--vw-min) * 100vw);
	}
	.onair_h3 > span{
		padding: 0 calc(40 / var(--vw-min) * 100vw);
		padding-top: calc(10 / var(--vw-min) * 100vw);
	}
	.onair_h3 > span:before,
	.onair_h3 > span:after{
		width: calc(20 / var(--vw-min) * 100vw);
		height: calc(20 / var(--vw-min) * 100vw);
	}
	.onairContIn{
		padding-top: calc(40 / var(--vw-min) * 100vw);
	}
}


/*-----------------------------------------------
 * ONAIR - CATCH / NOTE
-------------------------------------------------*/
.onairInfo__lead{
	position: relative;
	text-align: center;
	font-size: min(calc(26 / var(--vw-min) * 100vw), 26px);
	font-weight: 700;
	line-height: 2;
	padding-bottom: min(calc(50 / var(--vw-min) * 100vw), 50px);
}
.onairInfo__lead small{
	font-size: 76.9231%;
}
.onairInfo__subCatch{
	position: relative;
	text-align: center;
	font-size: min(calc(22 / var(--vw-min) * 100vw), 22px);
	font-weight: 700;
	line-height: 1.5;
	color: var(--color-main);
	padding-bottom: min(calc(32 / var(--vw-min) * 100vw), 32px);
}


.onairInfo__note{
	font-size: min(calc(13 / var(--vw-min) * 100vw), 13px);
	font-weight: 600;
	line-height: 2;
	margin-top: min(calc(48 / var(--vw-min) * 100vw), 48px);
	text-align: center;
}

@media screen and (max-width:768px){
	.onairInfo__lead{
		font-size: calc(36 / var(--vw-min) * 100vw);
		padding-bottom: calc(60 / var(--vw-min) * 100vw);
		line-height: 1.5;
	}
	.onairInfo__lead small{
		font-size: 75%;
	}
	.onairInfo__subCatch{
		font-size: calc(28 / var(--vw-min) * 100vw);
		padding-bottom: calc(40 / var(--vw-min) * 100vw);
		padding-left: calc(8 / var(--vw-min) * 100vw);
		padding-right: calc(8 / var(--vw-min) * 100vw);
	}
	.onairInfo__subCatch small{
		font-size: 71.4286%;
	}
	.onairInfo__note{
		font-size: calc(22 / var(--vw-min) * 100vw);
		margin-top: calc(24 / var(--vw-min) * 100vw);
		text-align: left;
		letter-spacing: 0;
	}
}


/*-----------------------------------------------
 * ONAIR - TV LIST
-------------------------------------------------*/
.onairTvLists,
.onairTvList{
	position: relative;
}
.onairTvLists:before,
.onairTvList:before{
	content: '';
	position: absolute;
	left: 0;
	right: min(calc(32 / var(--vw-min) * 100vw), 32px);
	height: 2px;
	background-image: linear-gradient(90deg,#86531f 0px, #86531f 2px, transparent 2px, transparent 4px);
	background-repeat: repeat;
	background-size: 4px 100%;
}
.onairTvLists:before{
	top: 0;
}
.onairTvList:before{
	bottom: 0;
}
.onairTvLists:after,
.onairTvList:after{
	content: '';
	position: absolute;
	width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	right: 0;
	-webkit-mask: url(../img/common/deco_star.svg) no-repeat center right / contain;
	mask: url(../img/common/deco_star.svg) no-repeat center right / contain;
	background-color: #86531f;
}
.onairTvLists:after{
	top: max(calc(-9 / var(--vw-min) * 100vw), -9px);
}
.onairTvList:after{
	bottom: max(calc(-9 / var(--vw-min) * 100vw), -9px);
}
.onairTvLists{
	display: flex;
	flex-direction: column;
	font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
	font-weight: 600;
	line-height: 2;
	color: var(--color-main);
}
.onairTvList{
	display: flex;
	flex-wrap: wrap;
	padding: min(calc(30 / var(--vw-min) * 100vw), 30px) min(calc(20 / var(--vw-min) * 100vw), 20px);
}
.onairTvList small{
	font-size: 81.25%;
}
.onairTvList__station{
	min-width: min(calc(200 / var(--vw-min) * 100vw), 200px);
	font-weight: 700;
	color: #916e49;
}
.onairTvList__info{
	display: flex;
	flex-direction: row;
}
.onairTvList__date{
	min-width: min(calc(280 / var(--vw-min) * 100vw), 280px);
}
.onairTvList__time{
	min-width: min(calc(280 / var(--vw-min) * 100vw), 280px);
}
.onairTvList__caption{
	width: 100%;
	margin-top: min(calc(8 / var(--vw-min) * 100vw), 8px);
	color: #916e49;
}

@media screen and (max-width:768px){
	.onairTvLists:before,
	.onairTvList:before{
		right: calc(48 / var(--vw-min) * 100vw);
	}
	.onairTvLists:after,
	.onairTvList:after{
		width: calc(36 / var(--vw-min) * 100vw);
		height: calc(36 / var(--vw-min) * 100vw);
	}
	.onairTvLists:after{
		top: calc(-16 / var(--vw-min) * 100vw);
	}
	.onairTvList:after{
		bottom: calc(-16 / var(--vw-min) * 100vw);
	}
	.onairTvLists{
		font-size: calc(28 / var(--vw-min) * 100vw);
	}
	.onairTvList{
		padding: calc(24 / var(--vw-min) * 100vw) calc(16 / var(--vw-min) * 100vw);
		display: flex;
		gap: calc(8 / var(--vw-min) * 100vw);
	}
	.onairTvList__info{
		display: flex;
		flex-direction: column;
		width: calc(390 / var(--vw-min) * 100vw);
	}
	.onairTvList__station{
		min-width: calc(184 / var(--vw-min) * 100vw);
	}
	.onairTvList__date,
	.onairTvList__time{
		min-width: unset;
	}
	.onairTvList__caption{
		margin-top: 0.5em;
		padding-left:0;
	}
}


/*-----------------------------------------------
 * ONAIR - STREAMING
-------------------------------------------------*/
.onairStreamingCont{
	padding-top: min(calc(56 / var(--vw-min) * 100vw), 56px);
	max-width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
	margin: 0 auto;
}
.onairStreamingCont.-npt{
	padding-top: 0;
}
.onairStreamingTitle{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: min(calc(12 / var(--vw-min) * 100vw), 12px);
	font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
	font-weight: 700;
	line-height: 1;
	color: var(--color-main);
	margin-bottom: min(calc(30 / var(--vw-min) * 100vw), 30px);
}
.onairStreamingTitle.-mt{
	margin-top: min(calc(48 / var(--vw-min) * 100vw), 48px);
}
.onairStreamingTitle:before,
.onairStreamingTitle:after{
	content: '';
	flex: 1;
	height: min(calc(5 / var(--vw-min) * 100vw), 5px);
	border-top: 1px solid #916e49;
	border-bottom: 1px solid #916e49;
	box-sizing: border-box;
}
.onairStreamingTitle > span{
	flex-shrink: 0;
	color: #916e49;
}
@media screen and (max-width:768px){
	.onairStreamingTitle{
		font-size: calc(32 / var(--vw-min) * 100vw);
		gap: calc(24 / var(--vw-min) * 100vw);
	}
	.onairStreamingTitle{
		margin-bottom: calc(48 / var(--vw-min) * 100vw);
	}
}
.onairStreamingLists{
	width:  min(calc(666 / var(--vw-min) * 100vw), 666px);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: min(calc(24 / var(--vw-min) * 100vw), 24px);
	justify-content: center;
}
.onairStreamingLists.-pt{
	padding-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
}
.onairStreamingList{
	width: calc((100% - min(calc(48 / var(--vw-min) * 100vw), 48px)) / 3);
}
/**
* linkBox copy → onairStreamingList__link
**/
.onairStreamingList__link{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: min(calc(56 / var(--vw-min) * 100vw), 56px);
	mask-image: url(../img/common/btn_mask-r.svg), linear-gradient(90deg, transparent 0px, transparent min(calc(7 / var(--vw-min) * 100vw), 7px), #000 min(calc(7 / var(--vw-min) * 100vw), 7px), #000 calc(100% - min(calc(7 / var(--vw-min) * 100vw), 7px)), transparent calc(100% - min(calc(8 / var(--vw-min) * 100vw), 8px)), transparent 100%), url(../img/common/btn_mask-l.svg);
	mask-size: min(calc(8 / var(--vw-min) * 100vw), 8px) 100%, 100% 100%, min(calc(8 / var(--vw-min) * 100vw), 8px) 100%;
	mask-position: right center, center, left center;
	mask-repeat: no-repeat;
	-webkit-mask-image: url(../img/common/btn_mask-r.svg), linear-gradient(90deg, transparent 0px, transparent min(calc(7 / var(--vw-min) * 100vw), 7px), #000 min(calc(7 / var(--vw-min) * 100vw), 7px), #000 calc(100% - min(calc(7 / var(--vw-min) * 100vw), 7px)), transparent calc(100% - min(calc(8 / var(--vw-min) * 100vw), 8px)), transparent 100%), url(../img/common/btn_mask-l.svg);
	-webkit-mask-size: min(calc(8 / var(--vw-min) * 100vw), 8px) 100%, 100% 100%, min(calc(8 / var(--vw-min) * 100vw), 8px) 100%;
	-webkit-mask-position: right center, center, left center;
	-webkit-mask-repeat: no-repeat;
	position: relative;
	background: linear-gradient(-135deg, #513111 0%, #a1784e 100%);
	color: #FFF;
	padding: min(calc(8 / var(--vw-min) * 100vw), 8px) min(calc(24 / var(--vw-min) * 100vw), 24px);
	text-decoration: none;
	font-size: min(calc(18	 / var(--vw-min) * 100vw), 18px);
	line-height: 1.4;
	text-align: center;
	box-sizing: border-box;
}
.onairStreamingList__linkFrames{
	position: absolute;
	top: min(calc(4 / var(--vw-min) * 100vw), 4px);
	left: min(calc(4 / var(--vw-min) * 100vw), 4px);
	right: min(calc(4 / var(--vw-min) * 100vw), 4px);
	bottom: min(calc(4 / var(--vw-min) * 100vw), 4px);
	background-image: url(../img/common/btn_frame-rt.svg), url(../img/common/btn_frame-rb.svg), url(../img/common/btn_frame-lb.svg), url(../img/common/btn_frame-lt.svg);
	background-size: 6px 6px;
	background-repeat: no-repeat;
	background-position: right top, right bottom, left bottom, left top;
}
.onairStreamingList__linkFrames:before{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 6px;
	right: 6px;
	border-top: 1px solid #c39e79;
	border-bottom: 1px solid #c39e79;
}
.onairStreamingList__linkFrames:after{
	content: '';
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 0;
	right: 0;
	border-left: 1px solid #c39e79;
	border-right: 1px solid #c39e79;
}
.onairStreamingList__txt{
	position: relative;
	z-index: 1;
}
.onairStreamingList__txt small{
	font-size: 80%;
	font-weight: 600;
}

@media screen and (hover:hover) and (pointer: fine){
	.onairStreamingList__link{
		background: linear-gradient(-135deg, #513111 0%, #a1784e 50%, #513111 100%);
		background-size: 200% 100%;
		background-position: 0% center;
		transition: background-position .6s ease;
	}
	.onairStreamingList__link:hover{
		background-position: 100% center;
	}
}

@media screen and (max-width:768px){
	.onairStreamingCont{
		padding-top: calc(72 / var(--vw-min) * 100vw);
	}
	.onairStreamingTitle{
		font-size: calc(28 / var(--vw-min) * 100vw);
		gap: calc(16 / var(--vw-min) * 100vw);
	}
	.onairStreamingTitle.-mt{
		margin-top: calc(56 / var(--vw-min) * 100vw);
	}
	.onairStreamingTitle:before,
	.onairStreamingTitle:after{
		height: calc(7 / var(--vw-min) * 100vw);
	}
	.onairStreamingLists{
		gap: calc(30 / var(--vw-min) * 100vw);
		justify-content: flex-start;
	}
	.onairStreamingLists.-pt{
		padding-top: calc(24 / var(--vw-min) * 100vw);
	}
	.onairStreamingList{
		width: calc((100% - calc(30 / var(--vw-min) * 100vw)) / 2);
	}
	.onairStreamingList__link{
		height: calc(88 / var(--vw-min) * 100vw);
		mask-image: url(../img/common/btn_mask-r.svg), linear-gradient(90deg, transparent 0px, transparent calc(10 / var(--vw-min) * 100vw), #000 calc(10 / var(--vw-min) * 100vw), #000 calc(100% - (10 / var(--vw-min) * 100vw)), transparent calc(100% - (10 / var(--vw-min) * 100vw)), transparent 100%), url(../img/common/btn_mask-l.svg);
		mask-size: calc(12 / var(--vw-min) * 100vw) 100%, 100% 100%, calc(12 / var(--vw-min) * 100vw) 100%;
		-webkit-mask-image: url(../img/common/btn_mask-r.svg), linear-gradient(90deg, transparent 0px, transparent calc(10 / var(--vw-min) * 100vw), #000 calc(10 / var(--vw-min) * 100vw), #000 calc(100% - (10 / var(--vw-min) * 100vw)), transparent calc(100% - (10 / var(--vw-min) * 100vw)), transparent 100%), url(../img/common/btn_mask-l.svg);
		-webkit-mask-size: calc(12 / var(--vw-min) * 100vw) 100%, 100% 100%, calc(12 / var(--vw-min) * 100vw) 100%;
		padding: calc(8 / var(--vw-min) * 100vw) calc(24 / var(--vw-min) * 100vw);
		font-size: calc(22 / var(--vw-min) * 100vw);
	}
	.onairStreamingList__linkFrames{
		top: calc(8 / var(--vw-min) * 100vw);
		right: calc(8 / var(--vw-min) * 100vw);
		bottom: calc(8 / var(--vw-min) * 100vw);
		left: calc(8 / var(--vw-min) * 100vw);
	}
}


/**
* ANIMATION
**/
.onair_h3{
	opacity: 0;
	transform: translateY(-0.5em);
	transition: opacity .3s ease, transform .3s ease;
}
.onairContIn{
	opacity: 0;
	transform: translateY(0.5em);
	transition: opacity .3s ease, transform .4s ease;
}
.--is-ani .onair_h3{
	opacity: 1;
	transform: translateY(0);
	transition-delay: .2s;
}
.--is-ani .onairContIn{
	opacity: 1;
	transform: translateY(0);
	transition-delay: .35s;
}
.onairCont:nth-child(2) .onair_h3{
	transition-delay: 0s;
}
.onairCont:nth-child(2) .onairContIn{
	transition-delay: 0s;
}
.--is-ani .onairCont:nth-child(2) .onair_h3{
	transition-delay: .45s;
}
.--is-ani .onairCont:nth-child(2) .onairContIn{
	transition-delay: .6s;
}