@charset "utf-8";
/*
	MediaQuery Type = Parts Unit
	0 < size
	@media only screen and (max-width: 600px)
	@media only screen and (min-width: 601px)
	@media only screen and (min-width: 601px) and (max-width: 992px)
	@media only screen and (max-width: 992px)
	@media only screen and (min-width: 993px)
	@media only screen and (min-width: 993px)
*/
/* ! [.rilasumi_]の記述は番組ディレクトリ名等適切に変更 */
.rilasumi_wrapper {
	position: relative;
	background: #fff;
	color: #876b58;
	overflow: hidden;
}

@media only screen and (min-width: 993px) {
	.rilasumi_wrapper a {
		transition: opacity .1s ease;
	}
	.rilasumi_wrapper a:hover {
		opacity: 0.6;
	}
	.rilasumi_wrapper [id^="ntv_setAD"] a:hover {
		opacity: 1;
	}
}


/* mainvisual
========================================== */
#second .rilasumi_mainvisual_inner {
	width: 100%;
	margin: 0 auto;
}
#second .rilasumi_mainvisual_img a {
	display: block;
	width: 100%;
	padding-top: calc(410 / 1280 * 100%);
	background-image: url(../images/common/mainv_pc_img.png);
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	font-size: 0;
}


/* nav
========================================== */
.rilasumi_nav_area {
	width: 100%;
	margin: 0 auto;
	padding:10px 0;
	background-color: #fffbda;
	position: relative;
}
.rilasumi_nav_area::before, .rilasumi_nav_area::after {
	content: "";
	width: 100%;
	height: 3px;
	position: absolute;
	background-image: url(../images/common/manu_line_img.png);
	background-repeat: repeat;
	background-position: center;
	background-size: contain;
	overflow: hidden;
}
.rilasumi_nav_area::before {
	top: 7px;
}
.rilasumi_nav_area::after {
	bottom: 7px;
}
.rilasumi_nav_inner {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}


/* rilasumi_nav_list
------------------------------ */
.rilasumi_nav_list {
	width: 100%;
	font-size: 0;
	text-align: center;
}
.rilasumi_nav_item {
	display: inline-block;
	width: 12%;
	vertical-align: top;
	position: relative;
}
.rilasumi_nav_item.comingsoon a{
	opacity: 0.1;
	pointer-events: none;
}
.rilasumi_nav_item.comingsoon::before {
	content: "";
	width: 64.17%;
	height: 0;
	padding-top: 32.5%;
	position: absolute;
	background: url(../images/common/manu_comingsoon_img.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	overflow: hidden;
	top: 0;
	bottom: 0;
	left: 0;
	right: 11px;
	margin: auto;
	z-index: 50;
}

.rilasumi_nav_item::after {
	content: "";
	width: 9.2%;
	height: 0;
	padding-top: 9.2%;
	position: absolute;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	overflow: hidden;
	right: -4.2%;
	top: 40%;
}
.rilasumi_nav_item.about::after { background-image: url(../images/common/manu_clover_img_pink.png) }
.rilasumi_nav_item.acsess::after { background-image: url(../images/common/manu_clover_img_green.png) }
.rilasumi_nav_item.content::after { background-image: url(../images/common/manu_clover_img_purple.png) }
.rilasumi_nav_item.ticket::after { background-image: url(../images/common/manu_clover_img_blue.png) }
.rilasumi_nav_item.attention::after { background-image: url(../images/common/manu_clover_img_orange.png) }
.rilasumi_nav_item.goods::after { background-image: url(../images/common/manu_clover_img_pink.png) }
.rilasumi_nav_item.specialsupporter::after { background-image: url(../images/common/manu_clover_img_green.png) }


.rilasumi_nav_item:not(:first-child) { margin-left: 0.56%; }
.rilasumi_nav_item a {
	display: block;
	width: 100%;
	padding-top: 52.5%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	position: relative;
	overflow: hidden;
}


/* rilasumi_nav - status */
.rilasumi_nav_item.is-new {}
.rilasumi_nav_item.is-new:before {
	content: '';
	display: block;
	width: 27.5%;
	height: 27.5%;
	background: url(../images/common/nav_icon_new.png) no-repeat center; /* NEWマーク　左上固定の場合は left top */
	background-size: contain;
	position: absolute;
	top: -10%;
	right: -3%;
	z-index: 30;
}
.rilasumi_nav_item.is-coming {}
.rilasumi_nav_item.is-coming a {
	opacity: 0.6;
	pointer-events: none;
}


/* rilasumi_nav - contents */
.rilasumi_nav_item.about a { background-image: url(../images/common/menu_about.png); }
.rilasumi_nav_item.acsess a { background-image: url(../images/common/menu_access.png); }
.rilasumi_nav_item.content a { background-image: url(../images/common/menu_contents.png); }
.rilasumi_nav_item.ticket a { background-image: url(../images/common/menu_ticket.png); }
.rilasumi_nav_item.attention a { background-image: url(../images/common/menu_attention.png); }
.rilasumi_nav_item.goods a {background-image: url(../images/common/menu_goods.png); }
.rilasumi_nav_item.specialsupporter a { background-image: url(../images/common/menu_specialsupporter.png); }
.rilasumi_nav_item.special a { background-image: url(../images/common/menu_special.png); }
.rilasumi_nav_item a span {
	width: 100%;
	font-size: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
/* rilasumi_footer_nav
------------------------------ */
#rilasumi_footer_nav {
	display: none;
}


/* for printer
========================================== */
@media print {
	.not_print {
		display: none;
	}
}


/* title
========================================== */
.rilasumi_title {
	position: relative;
}
.rilasumi_title_img {
	width: 277px;
	height: 0;
	padding-top: 54px;
	margin: 0 auto 25px;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
	position: relative;
}


/* btn
========================================== */
.rilasumi_btn {
	width: 245px;
	padding: 5px 0;
	margin: 30px auto;
	background-color: #7e634c;
	border-radius: 25px;
}
.rilasumi_btn_box {
	display: block;
	padding-right: 40px;
	font-size: 16px;
	color: #fff;
	text-align: center;
	position: relative;
}
.rilasumi_btn_box::after {
	content: "";
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto 50px;
}


/* banner
========================================== */
.banner_area {
	margin: 0 auto;
	padding: 35px 0;
	position: relative;
	background-color: #fff;
}
.banner_inner {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 20px;
	position: relative;
}
.banner_list {
	width: 100%;
	margin: 0 auto;
	font-size: 0;
	display: flex;
	justify-content: center;
}
.banner_item{
	width: 100%;
	max-width: 244px;
	border: solid 1px #eee;
}
.banner_item:nth-child(2) {
	margin: auto 20px;
}
.banner_item a{
	display: block;
}
.banner_item_img {
	width: 100%;
	height: 0;
	padding-top: calc(90 / 244 * 100%);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.san-x_banner_img { background-image: url(../images/common/san-x_banner_img_pc.png) }
.rilakkuma_banner_img { background-image: url(../images/common/rilakkuma_banner_img_pc.png) }
.sumikko_banner_img { background-image: url(../images/common/sumikko_banner_img_pc.png) }

.banner_item:nth-child(1) {
	margin-left: 0;
}


/* コンテンツ表示
========================================== */
.fadein_block {
	opacity: 0;
	transform : translate(0, 50px);
	transition : all 1200ms;
}
.fadein_block.run {
	opacity: 1;
	transform: translate(0, 0);
}

.pc-none{
	display: none;
}

/* pagetop
========================================== */
.ntv-pageTop {
	display: none;
}
.pagetop_area {
	position: fixed;
	width: 139px;
	height: 139px;
	right: 23px;
	bottom: 300px;
	z-index: 100;
	opacity: 0;
	-webkit-transition: all 0.5s 0.5s ease-out;
	transition: all 0.5s 0.5s ease-out;
}
.pagetop_area a {
	display: block;
	width: 139px;
	height: 139px;
	background: url(../images/common/pagetop_img.png) no-repeat top center transparent;
	background-size: contain;
	overflow: hidden;
	font-size: 0;
	text-indent: -99px;
	white-space: nowrap;
}
.pagetop_area.is-show {
	opacity: 1;
}
.pagetop_area.is-active {
	opacity: 0;
}

/* 下層ページコンテンツ
========================================== */
.rilasumi_second_area {
	width: 100%;
	padding: 115px 20px 80px;
	position: relative;
	background: #fffbda url(../images/common/rilasumi_topbg_img.png);
	background-repeat: repeat-x,repeat;
	background-position: top, center;
}
.rilasumi_second_area::before,.rilasumi_second_area::after {
	content: "";
	width: 464px;
	height: 0;
	padding-top: 71px;
	position: absolute;
	background: url(../images/common/rilasumi_flag_img.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
	overflow: hidden;
	top: 0;
}
.rilasumi_second_area::before {
	right: 50%;
	margin-right: 55px;
}
.rilasumi_second_area::after {
	left: 50%;
	margin-left: 55px;
}
.rilasumi_second_inner {
	width: 100%;
	max-width: 970px;
	margin: 0 auto;
	position: relative;
	z-index: 50;
}


/* 下層ページクローバー背景
========================================== */
.clover_bg_img {
	width: 7.891%;
	height: 0;
	padding-top: 16.485%;
	position: absolute;
	background: url(../images/common/rirasumi_clover_pc_img.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
	overflow: hidden;
}
.clover_bg_img_1{
	top: 95px;
	left: 40px;
}
.clover_bg_img_2{
	top: 95px;
	right: 40px;
	transform: rotatey(180deg);
}
.clover_bg_img_3{
	bottom: 40px;
	left: 40px;
}
.clover_bg_img_4{
	bottom: 40px;
	right: 40px;
	transform: rotatey(180deg);
}

/* ローディング
========================================== */
#loader {
	display: none;
	width: 100%;
	height: 100%;
	min-height: 900px;
	background: #fffbda;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
}
.loading {
	width: 121px;
	max-width: 121px;
	height: 0;
	padding-top: 105px;
	position: absolute;
	background: url(../images/top/loading_clover.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
	overflow: hidden;
	font-size: 0;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#loader::after {
	content: "";
	width: 206px;
	height: 0;
	padding-top: 20px;
	position: absolute;
	background: url(../images/top/loading_text.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
	overflow: hidden;
	top: -85%;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#loader::before {
	content: "";
	width: 510px;
	height: 0;
	padding-top: 510px;
	position: absolute;
	background: url(../images/top/loading_character.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: contain;
	overflow: hidden;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	animation: loatetion 8s linear infinite;
}
@keyframes loatetion {
	0% { transform: rotate(0); }
	100% { transform: rotate(360deg); }
}

/* フォントサイズ
========================================== */
.pcfont-18 {
	font-size: 18px;
}
.pcfont-16 {
	font-size: 16px;
}
.pcfont-14 {
	font-size: 14px;
}
.pcfont-12 {
	font-size: 12px;
}
.pcfont-10 {
	font-size: 10px;
}


/* ----------------------------------------------------------------------
 SP 〜 tablet（〜992px）
------------------------------------------------------------------------ */
@media screen and (max-width: 992px) {

	/* pagetop
	========================================== */
	.pagetop_area {
		opacity: 1;
		position: relative;
		width: 139px;
		height: 139px;
		top: 20px;
		left: 0;
		right: 0;
		margin: auto;
		transition: none;
		transform: none;
	}
	.pagetop_area.is-show {
		opacity: 1;
		transform: none;
	}
	.pagetop_area.is-active {
		opacity: 1;
		transform: none;
	}


	/* rilasumi_footer_nav
	------------------------------ */
	#rilasumi_footer_nav {
		display: block;
		position: relative;
	}
	#rilasumi_footer_nav.rilasumi_nav::before {
		content: "";
		width: 2px;
		height: calc( 100% - 20px );
		position: absolute;
		background-image: url(../images/common/rilasumi_border_vertical_img.png);
		background-repeat: repeat-y;
		background-position: center;
		background-size: contain;
		overflow: hidden;
		z-index: 50;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
	}
	#rilasumi_footer_nav .rilasumi_nav_inner:after {
		width: 0%;
		height: 100%;
		top: 50%;
		left: 49.8%;
		border-top: 0px;
		border-right: #d7d7d7 1px solid;
		border-left: 1px dotted;
	}
	#rilasumi_footer_nav .rilasumi_nav_area::before {
		content: "";
		width: 100%;
		height: 2px;
		position: absolute;
		background-image: url(../images/common/rilasumi_border_img.png);
		background-repeat: repeat;
		background-position: center;
		background-size: contain;
		overflow: hidden;
	}
	#rilasumi_footer_nav .rilasumi_nav_area::after{
		display: none;
	}
	#rilasumi_footer_nav .rilasumi_nav_list {
		margin: 0;
		padding: 0;
	}
	#rilasumi_footer_nav .rilasumi_nav_item {
		width: 50%;
		margin: 0;
	}
	#rilasumi_footer_nav .rilasumi_nav_item::after {
		content: "";
		width: 100%;
		height: 1px;
		padding-top: 2px;
		position: absolute;
		background-image: url(../images/common/rilasumi_border_img.png);
		background-repeat: repeat;
		background-position: center;
		background-size: contain;
		overflow: hidden;
		right: 0;
		top: auto;
		bottom: 0;
	}
	#rilasumi_footer_nav .rilasumi_nav_item:nth-child(1),
	#rilasumi_footer_nav .rilasumi_nav_item:nth-child(2) {
		margin-top: 0;
	}

	#rilasumi_footer_nav .rilasumi_nav_item:nth-child(even) {
		margin-left: 0;
	}
	#rilasumi_footer_nav .rilasumi_nav_item.comingsoon::before {
		width: 34%;
		padding-top: 23%;
		top: -10px;
		bottom: 0;
		left: 10px;
		right: 0;
		margin: auto;
	}

	#rilasumi_footer_nav .rilasumi_nav_item.about a { background-image: url(../images/common/menu_footer_about.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.acsess a { background-image: url(../images/common/menu_footer_access.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.content a { background-image: url(../images/common/menu_footer_contents.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.ticket a { background-image: url(../images/common/menu_footer_ticket.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.attention a { background-image: url(../images/common/menu_footer_attention.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.goods a {background-image: url(../images/common/menu_footer_goods.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.specialsupporter a { background-image: url(../images/common/menu_footer_specialsupporter.png); }
	#rilasumi_footer_nav .rilasumi_nav_item.special a { background-image: url(../images/common/menu_footer_special.png); }

	#rilasumi_footer_nav .rilasumi_nav_item a {
		width: 100%;
		padding-top: calc( 121 / 374 * 85% );
		padding-bottom: 10px;
		background-position: center;
		background-size: contain;
	}
	#rilasumi_footer_nav .rilasumi_nav_item a span { font-size: 0; }
	#rilasumi_footer_nav .rilasumi_nav_item a span.update { font-size: 0.7rem; top: 12%; }


	#rilasumi_footer_nav .rilasumi_nav_item.is-new:before {
		width: 30%;
		top: -10%;
	}

	#rilasumi_footer_nav .rilasumi_nav_vertical {
		width: 110%;
		height: 0;
		top: -15%;
		border-top: 1px dotted;
		border-bottom: #d7d7d7 1px solid;
		border-right: 0px;
	}

	#rilasumi_footer_nav .rilasumi_nav_item.intro .rilasumi_nav_vertical,
	#rilasumi_footer_nav .rilasumi_nav_item.story .rilasumi_nav_vertical {
		width: 0;
		height: 0;
	}

	#rilasumi_footer_nav .rilasumi_nav_item .is-update {
		font-size: 1.2rem;
		top: 11%;
	}


		/* 下層ページコンテンツ
	========================================== */
	.rilasumi_second_area {
		width: 100%;
		padding-bottom: 180px;
	}


	/* 下層ページクローバー背景
	========================================== */
	.clover_bg_img {
		width: 101px;
		padding-top: 211px;
	}
	.clover_bg_img_1{
		top: 95px;
		left: 20px;
	}
	.clover_bg_img_2{
		top: 95px;
		right: 20px;
		transform: rotatey(180deg);
	}
	.clover_bg_img_3{
		bottom: -65px;
		left: 20px;
	}
	.clover_bg_img_4{
		bottom: -65px;
		right: 20px;
		transform: rotatey(180deg);
	}


}


/* ----------------------------------------------------------------------
 SP（〜600px）
---------------------------------------------------------------------- */
@media only screen and (max-width: 600px) {
	/* mainvisual
	========================================== */
	#second .rilasumi_mainvisual_img a {
		padding-top: calc(465 / 752 * 100%);
		background-image: url(../images/common/mainv_sp_img.png);
	}


	/* nav
	========================================== */
	.rilasumi_nav { position: relative; }
	.rilasumi_nav::before {
		content: "";
		width: 100%;
		height: 3px;
		position: absolute;
		background-image: url(../images/common/manu_line_img.png);
		background-repeat: repeat;
		background-position: center;
		background-size: contain;
		overflow: hidden;
		z-index: 50;
		top: 50%;
	}
	.rilasumi_nav_list { margin: auto; padding: 0 2%; }
	.rilasumi_nav_item { width: 24.25%; padding-right: 0px; }
	.rilasumi_nav_item a { padding-top: 49%; }
	.rilasumi_nav_item a span { font-size: 0; }
	.pc-none{
		display: block;
	}


	/* btn
	========================================== */
	.rilasumi_btn {
		width: 210px;
		margin: 15px auto;
	}
	.rilasumi_btn_box {
		padding-right: 20px;
		font-size: 13px;
	}


	/* title
	========================================== */
	.rilasumi_title_img {
		width: 170px;
		padding-top: 34px;
		margin: 0 auto 10px;
	}


	/* banner
	========================================== */
	.banner_area {
		padding: 20px 0;
	}
	.banner_list {
		display: block;
	}
	.banner_item {
		margin: 10px auto !important;
	}
	.banner_item_img {
		width: 100%;
		height: 0;
		padding-top: calc(162 / 440 * 100%);
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
	}
	.san-x_banner_img { background-image: url(../images/common/san-x_banner_img_sp.png) }
	.rilakkuma_banner_img { background-image: url(../images/common/rilakkuma_banner_img_sp.png) }
	.sumikko_banner_img { background-image: url(../images/common/sumikko_banner_img_sp.png) }


	/* 下層ページコンテンツ
	========================================== */
	.rilasumi_second_area {
		width: 100%;
		padding: 50px 20px 80px;
	}
	.rilasumi_second_area::before,.rilasumi_second_area::after {
		width: 232px;
		padding-top: 35px;
	}
	.rilasumi_second_area::before {
		margin-right: 25px;
	}
	.rilasumi_second_area::after {
		margin-left: 25px;
	}


		/* 下層ページクローバー背景
	========================================== */
	.clover_bg_img {
		width: 60px;
		padding-top: 120px;
	}
	.clover_bg_img_1{
		top: 35px;
		left: 20px;
	}
	.clover_bg_img_2{
		top: 35px;
		right: 20px;
		transform: rotatey(180deg);
	}
	.clover_bg_img_3{
		bottom: -40px;
		left: 20px;
	}
	.clover_bg_img_4{
		bottom: -40px;
		right: 20px;
		transform: rotatey(180deg);
	}
	/* ローディング
	========================================== */
	#loader {
    min-height: auto;
	}
	#loader::before {
		width: 70%;
		padding-top: 70%;
	}
	.loading {
    width: 18%;
		padding-top: 14%;
	}


	/* フォントサイズ
	========================================== */
	.spfont-18 {
		font-size: 18px;
	}
	.spfont-16 {
		font-size: 16px;
	}
	.spfont-14 {
		font-size: 14px;
	}
	.spfont-12 {
		font-size: 12px;
	}
	.spfont-10 {
		font-size: 10px;
	}

}