@charset "UTF-8";

.sec_4 .youtube_area_comment {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 40px;
	padding-bottom: 40px;
}
.sec_4 .youtube_area_comment .comment {
	width: 49%;
	height: 331px;
	margin-bottom: 80px;
}
.sec_4 .title_youtube {
	text-align: center;
	font-size: larger;
	font-weight: bold;
	margin-bottom: 10px;
}
.sec_4 iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 554 / 312;
}

@media screen and (max-width: 767px) {
	.sec_4 .youtube_area_comment {
		display: block;
		padding-top: 15px;
	}
	.sec_4 .youtube_area_comment .comment {
		width: 100%;
		margin-top: 60px;
		margin-bottom: 0;
		height: auto;
	}
	.sec_4 .youtube_area_comment .comment:first-child {
		margin-top: 10px;
	}
	.sec_4 .youtube_area_comment .comment iframe {
		height: auto;
		aspect-ratio: 330 / 186;
	}
	.sec_4 .title_youtube {
		font-size: 14px;
	}
}

.cast-img {
	max-width: 800px;
	margin: 0 auto;
}

.ticket-info > div,
#current-ticket > div {
	display: grid;
	grid-template-columns: auto auto;
	width: fit-content;
	margin: 0 auto;
	font-size: 18px;
	text-align: left;
	line-height: 1.5;
	gap: 0 1em;
}
.ticket-info > div > div:nth-child(odd),
#current-ticket > div > div:nth-child(odd) {
	display: flex;
	justify-content: flex-end;
}
.ticket-info span,
#current-ticket span {
	display: inline-block;
}
@media screen and (max-width: 767px) {
	.ticket-info > div,
	#current-ticket > div {
		font-size: 16px;
	}
}
@media screen and (max-width: 389px) {
	.sec_2 .access section.ticket-info p,
	.ticket-info > div,
	#current-ticket > div {
		font-size: 14px;
	}
}

#closed-ticket {
	padding: 30px;
}
#closed-ticket .title {
	cursor: pointer;
	position: relative;
}
.title::before, .title::after {
	position: absolute;
	top: 48%;
	right: 35px;
	content: '';
	width: 20px;
	height: 3px;
	background-color: #AF1E23;
}
.title::after {
	transform: rotate(90deg);
}
#closed-ticket .box {
	display: none;
}
.ticket-info h4 {
	text-align: center;
	font-size: 26px;
	font-weight: bold;
	margin-bottom: 40px;
}
#closed-ticket s {
	padding: 0 30px;
	display: block;
}
#closed-ticket section {
	margin-top: 30px;
}
#closed-ticket hr {
	margin: 30px 0;
}
#closed-ticket s * {
	text-decoration: line-through;
	text-decoration-color: #48070C;
}

@media screen and (max-width: 767px) {
	.title::before, .title::after {
		right: 15px;
	}
	#closed-ticket s {
		padding: 0;
	}
	.ticket-info h4 {
		margin-bottom: 24px;
		font-size: 24px;
	}
	.ticket-info h4,
	#closed-ticket h3 {
		line-height: 1.4;
	}
	.sec_2 .access section.ticket-info p {
		text-align: center;
	}
	.ticket-info > div > div:nth-child(odd), #current-ticket > div > div:nth-child(odd){
		justify-content: flex-start;
	}
}

/***************************************
10.GOODS sec_5
 ***************************************/

.sec_5 h3 {
	margin-top: 40px;
}
.sec_5 .inner ul.goods{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 40px;
}
.sec_5 .inner ul.goods li{
	width: 48%;
	background: white;
	border-radius: 20px;
	padding: 30px;
	box-sizing: border-box;
	margin-bottom: 40px;
	line-height: 1.5;
}
.sec_5 .inner ul.goods li img{
	padding-bottom: 10px;
}
.sec_5 .inner ul.goods li div.name_price{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0 20px;
}
.sec_5 .inner ul.goods li p.name{
	font-size: 20px;
	font-weight: bold;
}
.sec_5 .inner ul.goods li p.price{
	text-align: right;
	padding-bottom: 10px;
}
.sec_5 .inner ul.goods li p.price strong{
	font-size: 20px;
}
.sec_5 .inner ul.goods li p.size{
	padding-bottom: 10px;
	font-size: 14px;
}

.sec_5 .inner .online{
	background: #fff;
	border-radius: 20px;
	padding: 30px 70px;
	color: #273A55;
	margin: 30px auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.sec_5 .inner .online h3{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	width: 100%;
	margin-bottom: 30px;
}
.sec_5 .inner .online ul{
	width: 100%;
	margin-top: 30px;
}
.sec_5 .inner .online ul li{
	list-style: none;
	text-indent: -0.5em;
	padding-left: 0.5em;
}
.sec_5 .inner .online ul li:before{
	content: "※";
	display: inline-block;
}

.slick-slider img{
	width: 482px;
	height: 482px;
	padding: 0 2px;
}

.slick-list{
	padding: 0!important;
}
.slick-prev, .slick-next {
	width: 20px;
	height: 20px;
}
.slick-next {
	right: -10px!important;
}
.slick-prev {
	left: -16px!important;
}
.slick-next:before{
	border-top: solid 4px #AF1E23;
	border-right: solid 4px #AF1E23;
	width: 20px;
	height: 20px;
	transform: rotate(45deg);
}
.slick-prev:before{
	border-bottom: solid 4px #AF1E23;
	border-left: solid 4px #AF1E23;
	width: 20px;
	height: 20px;
	transform: rotate(45deg);
}
.slick-dots li{
	width: 10px!important;
	height: 10px!important;
}
.slick-dots li.slick-active{
	background: #AF1E23!important;	
}

@media screen and (max-width:767px) {
	.sec_5 .inner .online{
		padding: 20px;
	}
	.sec_5 .inner .online ul{
		margin-top: 20px;
	}
	.sec_5 .inner ul.goods li{
		width: 100%;
		padding: 15px;
	}
	.sec_5 .inner ul.goods li div.name_price p.comp{
		width: 100%;
	}
	.sec_5 .inner ul.goods li p.name{
		font-size: 18px;
	}
	.sec_5 .inner ul.goods li p.price strong{
		font-size: 18px;
	}
}
@media screen and (max-width:480px) {
	.slick-slider img{
		width: 320px;
		height: 320px;
		padding: 0 10px;
	}
	.slick-next:before,
	.slick-prev:before{
		width: 15px;
		height: 15px;
	}
	.slick-next {
		right: -5px!important;
	}
	.slick-prev {
		left: -5px!important;
	}
}

.white-box {
	background: #fff;
	border-radius: 20px;
	padding: 20px 80px;
}
.border-red-box {
	border: solid 4px red;
}
.goods-ad {
	text-align: center;
	line-height: 20px;
	width: fit-content;
	margin: 0 auto;
	font-size: 18px;
	line-height: 30px;
}
.goods-ad > span {
	font-size: 22px;
	display: inline-block;
	margin-bottom: 10px;
	font-weight: bold;
}
@media screen and (max-width: 767px) {
	.white-box {
		padding: 15px;
	}
	.goods-ad {
		font-size: 14px;
		line-height: 24px;
	}
	.goods-ad span {
		font-size: 20px;
	}
}
@media screen and (max-width: 389px) {
	.goods-ad > span {
		font-size: 18px;
	}
}

.sec_5 .inner ul.goods li img:not(:first-child) {
	display: none;
}
.sec_5 .inner ul.goods li img.slick-slide:not(:first-child) {
	display: block;
}
.sec_5 .inner ul.goods li p.size span {
	font-weight: bold;
}
.goods-notice {
	margin-top: 40px;
}
.goods-notice p {
	margin-bottom: 10px;
}
.goods-notice ul {
	line-height: 26px;
}
.sec_5 .emphasis {
	color: red;
	margin: 0;
}
