@charset "utf-8";

/*-- ARTIST --*/
	
	#artist-list
	{
	}
		
		#artist-list ul
		{
			display: flex;
			flex-flow: wrap;
			list-style: none;
		}
			
			#artist-list li
			{
			}
			#artist-list li a
			{
				display: flex;
				flex-flow: column;
				border-radius: 0 !important;
				background: #F9F9F9;
				box-shadow: .1rem .1rem .3rem rgba(0, 0, 0, .3);
				text-decoration: none;
				transform: rotate(3deg);
			}
			#artist-list li a[href]:hover
			{
				background: #F9F9F9 !important;
				box-shadow: 0 0 1rem rgba(242, 71, 96, .7);
			}
				
				#artist-list li .bromide
				{
					position: relative;
					display: block;
					width: 100%;
					border-style: solid;
					border-width: .5rem .5rem 0;
					border-color: #FFF;
					text-decoration: none;
					box-shadow: .1rem .1rem .3rem rgba(0, 0, 0, .3);
					transform: rotate(-6deg);
				}
					
					#artist-list li img
					{
						display: block;
						width: 100%;
						object-fit: contain;
					}
					
					#artist-list li .name
					{
						padding: .2rem 0;
						background: #FFF;
						color: #F83;
						text-shadow:
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7),
							0 0 .2rem rgba(255, 255, 255, .7);
						text-align: center;
						font-size: 1.2rem;
						font-weight: bold;
					}
					
			
			#artist-list .supplement
			{
				margin: 1rem auto;
				text-align: right;
				color: #494;
				font-size: .8rem;
			}
			
	/*-- サイズ毎の処理 --*/
		
		@media screen and (min-width: 1225px)
		{
			#artist-list ul
			{
				justify-content: space-around;
				margin: -2rem 0 0 0;
				padding: 2rem 1% 0;
			}
			#artist-list li
			{
				width: 26%;
				margin: 2rem 0 0 0;
			}
		}
		@media screen and (max-width: 1224px) and (min-width: 725px)
		{
			#artist-list ul
			{
				justify-content: space-around;
				margin: -2rem 0 0 0;
				padding: 1rem 1% 0;
			}
			#artist-list li
			{
				width: 26%;
				margin: 2rem 0 0 0;
			}
		}
		@media screen and (max-width: 724px)
		{
			#artist-list ul
			{
				justify-content: space-around;
				margin: -2rem 0 0 0;
				padding: 1rem 1% 0;
			}
			#artist-list li
			{
				width: 42%;
				margin: 2rem 0 0 0;
			}
			#artist-list li .name
			{
				font-size: 1rem;
			}
		}