@charset "UTF-8";

/*
 * style_artist.css
 * description : THE GRAND SLAM [ ARTIST ]
 *
 * Created  2021/11/4.
 * Last Update 2021/11/4.
 */


/* =========================================================
   Artist List
   ========================================================= */

/* List */
.pages.p-artist .artist-list {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding: 0;
}

.pages.p-artist .artist-list .list-box {
	box-sizing: border-box;
	padding: 0;
}


/* -------------------------
   Desktop
   ------------------------- */

@media screen and (min-width: 992px) {

	/* List 5 */
	.pages.p-artist .artist-list.list-5 .list-box {
		width: calc(20% - 8px);
		margin: 0 10px 20px 0;
	}

	.pages.p-artist .artist-list.list-5 .list-box:nth-child(5n) {
		margin-right: 0;
	}

	/* List 4 */
	.pages.p-artist .artist-list.list-4 .list-box {
		width: calc(25% - 7.5px);
		margin: 0 10px 20px 0;
	}

	.pages.p-artist .artist-list.list-4 .list-box:nth-child(4n) {
		margin-right: 0;
	}
}


/* -------------------------
   Tablet
   ------------------------- */

@media screen and (min-width: 576px) and (max-width: 991px) {

	.pages.p-artist .artist-list.list-5 .list-box,
	.pages.p-artist .artist-list.list-4 .list-box {
		width: calc(25% - 7.5px);
		margin: 0 10px 20px 0;
	}

	.pages.p-artist .artist-list.list-5 .list-box:nth-child(4n),
	.pages.p-artist .artist-list.list-4 .list-box:nth-child(4n) {
		margin-right: 0;
	}
}


/* -------------------------
   Mobile
   ------------------------- */

@media screen and (max-width: 575px) {

	.pages.p-artist .artist-list.list-5 .list-box,
	.pages.p-artist .artist-list.list-4 .list-box {
		width: calc(50% - 5px);
		margin: 0 10px 16px 0;
	}

	.pages.p-artist .artist-list.list-5 .list-box:nth-child(2n),
	.pages.p-artist .artist-list.list-4 .list-box:nth-child(2n) {
		margin-right: 0;
	}
}


/* =========================================================
   Artist Link
   ========================================================= */

.pages.p-artist .artist-list .artist-link {
	text-decoration: none;
	cursor: pointer;
}

.pages.p-artist .artist-link:hover {
	text-decoration: none;
}

.pages.p-artist .artist-link .at-name {
	display: flex;
	justify-content: center;
	height: auto;
	box-sizing: border-box;
}

.pages.p-artist .artist-link .at-name p {
	width: auto;
}

.pages.p-artist .artist-link .content-image {
	position: relative;
}


/* Artist Name Size */

@media screen and (min-width: 992px) and (max-width: 1199px) {

	.pages.p-artist .artist-link .at-name p {
		font-size: 1.28vw;
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {

	.pages.p-artist .artist-link .at-name p {
		font-size: 1.48vw;
	}
}

@media screen and (min-width: 576px) and (max-width: 767px) {

	.pages.p-artist .artist-link .at-name p {
		font-size: 1.8vw;
	}
}

@media screen and (max-width: 575px) {

	.pages.p-artist .artist-link .at-name p {
		font-size: 3vw;
	}
}


/* =========================================================
   New Icon
   ========================================================= */

.pages.p-artist .artist-link .content-image .icn-new,
.pages.p-artist .artist-link .content-image .icn-new-day {
	position: absolute;
}


/* New Icon */

.pages.p-artist .artist-link .content-image .icn-new {
	top: -10px;
	left: -7px;
}


/* New Day Icon */

.pages.p-artist .artist-link .content-image .icn-new-day {
	right: 0;
	bottom: 0;
}


/* Icon Size */

@media screen and (min-width: 768px) {

	.pages.p-artist .artist-link .content-image .icn-new {
		width: 16%;
	}

	.pages.p-artist .artist-link .content-image .icn-new-day {
		width: 24%;
	}
}

@media screen and (max-width: 767px) {

	.pages.p-artist .artist-link .content-image .icn-new {
		width: 17%;
	}

	.pages.p-artist .artist-link .content-image .icn-new-day {
		width: 30%;
	}
}


/* =========================================================
   Artist Schedule
   ========================================================= */

/* Schedule List */

.pages.p-artist .artist-schedule-list {
	position: relative;
	width: auto;
	text-align: center;
}


/* Fixed */

.pages.p-artist .artist-schedule-list.is-fixed {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1;
	width: 100%;
	margin-left: auto;
	/* transform: translateY(112px); */
}


/* Schedule Navigation */

.pages.p-artist .artist-schedule-list ul {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

.pages.p-artist .artist-schedule-list ul li {
	flex-basis: auto;
	width: auto;
	margin-right: 12px;
	padding: 0;
}

.pages.p-artist .artist-schedule-list ul li:last-child {
	margin-right: 0;
}


/* Button */

.pages.p-artist .artist-schedule-list .candy {
	display: inline-block;
	text-align: center;
}

.pages.p-artist .artist-schedule-list .candy a.btn {
	border-top: 3px solid #D0C598;
	border-radius: 0;
}

.pages.p-artist .artist-schedule-list .candy a.active {
	color: #69560a;
	background: #ffffff;
}


/* -------------------------
   Mobile Schedule
   ------------------------- */

@media screen and (max-width: 767px) {

	.pages.p-artist .artist-schedule-list ul {
		flex-wrap: wrap;
		width: 100%;
	}

	.pages.p-artist .artist-schedule-list ul li {
		flex-basis: calc(25% - 7.5px);
		width: calc(25% - 7.5px);
		margin-right: 10px;
	}

	.pages.p-artist .artist-schedule-list .candy {
		display: block !important;
		width: 100%;
	}

	.pages.p-artist .artist-schedule-list .candy .sc-date {
		font-size: 0.9375rem;
	}

	.pages.p-artist .artist-schedule-list .candy .sc-week {
		font-size: 0.6875rem;
	}
}


/* Small Mobile Schedule */

@media screen and (max-width: 565px) {

	.pages.p-artist .artist-schedule-list ul li {
		flex-basis: calc(25% - 4.5px);
		width: calc(25% - 4.5px);
		margin-right: 6px;
	}
}