@charset 'utf-8';


/* --------------------------------------------------------------------------------
スマートフォン
-------------------------------------------------------------------------------- */
/* ---------- ↓↓↓↓ここから↓↓↓↓ ---------- */
@media screen and (min-width:1px) and (max-width:539px) {
	
	/* --------------------------------------------------------------------------------
		デバイスごとの表示・非表示
	-------------------------------------------------------------------------------- */
	.device-sp{
		display:block;
	}
	.device-sp-inline{
		display:inline;
	}
	.device-pc{
		display:none;
	}
	.device-pc-inline{
		display:none;
	}	

	
	#artwork {
		padding: 13vw 0 0;
	}
	#artwork * {
		box-sizing: border-box;
	}
	#artwork .artwork-inner {
		font-size: 3.3vw;
		font-family: 'Noto Serif JP', serif;

		color: #000;
		background: #fff;
	}

	#artwork h2,
	#artwork h3,
	#artwork h4,
	#artwork h5,
	#artwork h6 {
		font-weight: 500;
	}
	
	
	/* ----------------------------------------
	メイン画像
	---------------------------------------- */
	#artwork .main-image {
		padding: 0 2vw 8vw;
	}
	
	
	/* ----------------------------------------
	artwork-contents
	---------------------------------------- */
	#artwork .artwork-contents {
		padding: 0 5vw 16vw;
	}

	
	/* ----------------------------------------
	作家アンカーリスト
	---------------------------------------- */
	
	/*アンカー位置*/
	#artwork .anchor {
		padding-top: 115px;
		margin-top: -115px;
	}
	
	#artwork .artist-list {
		margin-bottom: 5vw;
	}
	#artwork .artist-list ul{
		display: flex;
		flex-wrap: wrap;
	}
	#artwork .artist-list ul li{
		width : 48%;
		font-size: 4vw;
		text-align: center;
		font-weight: 500;
		background: #e7e7e7;
		padding: 2vw 0 ;
		border-radius: 4px;
		margin: 0 3vw 3vw 0;
	}
	#artwork .artist-list ul li:nth-child(2n){
		margin: 0 0 2vw 0;
	}
	#artwork .artist-list ul li a{
		display: block;
		text-decoration: none;
	}
	
	
	/* ----------------------------------------
	作家
	---------------------------------------- */
	#artwork .artist{
		border-bottom: 1px solid #ccc;
		padding-bottom: 7vw;
	}
	#artwork .artist .name{
		display: flex;
		align-items: center;
		margin-top: 10vw;
		margin-bottom: 3vw;
		color: #000033;
	}
	#artwork .artist .name h3{
		font-size: 6vw;
		letter-spacing: 0.1em;
	}
	#artwork .artist .name .label{
		font-size: 3vw;
		text-align: center;
		color: #fff;
		background: #000033;
		padding: 1vw 3vw;
		margin-left: 5vw;
	}
	/*経歴*/
	#artwork .artist .txt-box{
		font-size: 3.3vw;
		line-height:1.85;
		margin-bottom: 40px;
	}
	
	#artwork .artist .txt-box table{
		margin: 0 0 auto 0;
		font-size:  3.3vw;
	}
	#artwork .artist .txt-box table tr th{
		width: 10%;
	}
	#artwork .artist .txt-box table tr td{
		width: 80%;
	}
	
	/*商品*/
	#artwork .artist .product ul{
		display: flex;
		flex-wrap: wrap;
	}
	#artwork .artist .product ul li{
		width : 48%;
		margin: 0 3vw 5vw 0;
	}
	#artwork .artist .product ul li:nth-child(2n){
		margin: 0 0 5vw 0;
	}
	#artwork .artist .product ul li a .img{
		width : 100%;
	}
	#artwork .artist .product ul li a .img img{
		width: 40vw;
		height: 40vw;
		object-fit: cover;
	}
	#artwork .artist .product ul li a .txt{
		font-size: 3vw;
	}
	
	/*五十音順*/
	#artwork .txt-r{
		text-align: right;
		font-size: 3vw;
		margin-top: 3vw;
	}

	


}
/* ---------- ↑↑↑↑ここから↑↑↑↑ ---------- */















/* --------------------------------------------------------------------------------
PC
-------------------------------------------------------------------------------- */
/* ---------- ↓↓↓↓ここから↓↓↓↓ ---------- */
@media only screen and (min-width: 540px) {
	
	/* --------------------------------------------------------------------------------
		デバイスごとの表示・非表示
	-------------------------------------------------------------------------------- */
	.device-sp{
		display: none;
	}
	.device-sp-inline{
		display: none;
	}
	.device-pc{
		display: block;
	}
	.device-pc-inline{
		display: inline;
	}
	
	
	#artwork {
		font-size: 18px;
		font-family: 'Noto Serif JP', serif;

		padding:0;
		color: #000;
		background: #fff;
	}
	#artwork .artwork-inner {
		width: 980px;
		margin: 0 auto 100px auto;
	}

	#artwork h2,
	#artwork h3,
	#artwork h4,
	#artwork h5,
	#artwork h6 {
		font-weight: 500;
	}


	/* ----------------------------------------
	メイン画像
	---------------------------------------- */
	#artwork .main-image {
		padding: 0 0 50px;
	}


	/* ----------------------------------------
	作家アンカーリスト
	---------------------------------------- */
	#artwork .artist-list {
		margin-bottom: 85px;
	}
	#artwork .artist-list ul{
		display: flex;
		flex-wrap: wrap;
	}
	#artwork .artist-list ul li{
		width : calc(100% / 4 - 12px);
		font-size: 20px;
		text-align: center;
		color: #000;
		font-weight: 500;
		background: #e7e7e7;
		padding: 10px 0 ;
		border-radius: 4px;
		margin: 0 15px 15px 0;
	}
	#artwork .artist-list ul li:nth-child(4n){
		margin: 0 0 15px 0;
	}
	#artwork .artist-list ul li a{
		display: block;
		text-decoration: none;
	}
	
	
	/* ----------------------------------------
	作家
	---------------------------------------- */
	#artwork .artist{
		border-bottom: 1px solid #ccc;
		padding-bottom: 30px;
		margin-top: 55px;
	}
	#artwork .artist .name{
		display: flex;
		align-items: center;
		margin-bottom: 15px;
		color: #000033;
	}
	#artwork .artist .name h3{
		font-size: 28px;
		letter-spacing: 0.1em;
	}
	#artwork .artist .name .label{
		font-size: 16px;
		text-align: center;
		color: #fff;
		background: #000033;
		padding: 3px 15px;
		margin-left: 30px;
	}
	/*経歴*/
	#artwork .artist .txt-box{
		font-size: 16px;
		line-height:1.85;
		margin-bottom: 40px;
	}
	
	#artwork .artist .txt-box table{
		margin: 0 0 auto 0;
		font-size: 16px;		
	}
	#artwork .artist .txt-box table tr th{
		width: 10%;
	}
	#artwork .artist .txt-box table tr td{
		width: 80%;
	}
	
	/*商品*/
	#artwork .artist .product ul{
		display: flex;
		flex-wrap: wrap;
	}
	#artwork .artist .product ul li{
		width : 222px;
		margin: 0 30px 30px 0;
	}
	#artwork .artist .product ul li:nth-child(4n){
		margin: 0 0 30px 0;
	}
	#artwork .artist .product ul li a .img{
		width : 100%;
		margin-bottom: 10px;
	}
	#artwork .artist .product ul li a .img img{
		width: 220px;
		height: 220px;
		object-fit: cover;
	}
	#artwork .artist .product ul li a .txt{
		font-size: 15px;
	}
	
	/*五十音順*/
	#artwork .txt-r{
		text-align: right;
		font-size: 15px;
		margin-top: 10px;
	}

}
/* ---------- ↑↑↑↑ここから↑↑↑↑ ---------- */