@charset "UTF-8";
/*スマホ開始*/




/*ヘッダー：SPはART HISTORYと同じ左右20px・上48px */
.artist_archive_header{
padding: 48px 20px 48px 20px;
margin: 0 auto 0 auto;
border-bottom: 1px solid #d8d8d8;
}


h1.artist_archive_h1 {
margin: 0 0 0 0;

font-family: "trajan-pro-3", serif;
font-weight: 400;
font-style: normal;

font-size: 26px;
line-height: 1.0;
letter-spacing: -0.03em;
}

.artist_archive_header_lead{
margin: 10px 0 0 0;
font-size: 14px;
line-height: 1.5;
}



.noaru-artist-index {
width: 92%;
margin: 0 auto;
}


.artist_archive_intro{
margin: 10px 0 0 0;
max-width: 100%;
font-size: 14px;
line-height: 1.5;
}







.noaru-directory-grid {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
}

.noaru-directory-card__media {
display: block;
overflow: hidden;
aspect-ratio: 1.35;
background: #e6e4df;
text-decoration: none;
}

.noaru-directory-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform .25s;
}

.noaru-directory-card__media:hover img {
transform: scale(1.02);
}

.noaru-directory-card__text h2 {

/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 1.2rem;
line-height: 1.5;
margin: 14px 0 4px;
overflow-wrap: anywhere;
}

.noaru-directory-card__text h2 a {
text-decoration: none;
}

.noaru-directory-card__sub {
font-size: .91rem;
color: #626761;
margin: 0 0 4px;
}

.noaru-directory-card__meta {
font-size: .76rem;
color: #626761;
margin: 0;
}

.noaru-directory-pagination {
padding: 35px 0 5px;
}

.noaru-directory-pagination ul {
display: flex;
flex-wrap: wrap;
gap: 10px;
list-style: none;
padding: 0;
}

.noaru-directory-pagination a,
.noaru-directory-pagination .current {
display: block;
text-decoration: none;
padding: 5px 12px;
border: 1px solid #d9dbd5;
}

.noaru-directory-pagination .current {
background: #171918;
color: #fff;
}

/* ARTIST archive：アーティスト固有部分 */
.noaru-artist-archive-head {
margin-bottom: 42px;
}

.noaru-artist-section-head {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 18px;
border-bottom: 1px solid #1a1a1a;
padding: 0 0 12px;
margin-bottom: 22px;
}

.noaru-artist-section-head h2 {
/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: clamp(1.35rem, 2.8vw, 2rem);
margin: 0;
}

.noaru-artist-section-head span {
font-size: .73rem;
color: #626761;
}

.noaru-artist-featured-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 23px 12px;
}

.noaru-artist-featured-visual {
display: flex;
aspect-ratio: 1.28;
background: #eae9e4;
align-items: center;
justify-content: center;
overflow: hidden;
text-decoration: none;
}

.noaru-artist-featured-visual img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.noaru-artist-monogram {
/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

color: #b3b1ab;
font-size: clamp(4rem, 8vw, 9rem);
line-height: 1;
}

.noaru-artist-featured-kicker {
font-size: .7rem;
letter-spacing: .06em;
text-transform: uppercase;
color: #626761;
margin: 15px 0 4px;
}

.noaru-artist-featured-card h3 {

/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: clamp(1.1rem, 2vw, 1.5rem);
line-height: 1.3;
margin: 0;
}

.noaru-artist-featured-card h3 a {
text-decoration: none;
}

.noaru-artist-ja {
font-size: .85rem;
margin: 2px 0 0 0;
}

.noaru-artist-index {
margin-top: 65px;
}

.noaru-index-modes {
display: flex;
gap: 8px;
margin: 20px 0 22px;
}

.noaru-index-modes a {
display: inline-block;
min-width: 80px;
padding: 7px 20px;
border: 1px solid #ccc;
text-decoration: none;
text-align: center;
font-size: .85rem;
}

.noaru-index-modes a.active {
background: #1a1a1a;
color: #fff;
border-color: #1a1a1a;
}



/*ABCDE......のナビゲーション*/
.noaru-index-jump {
margin: 24px 0 39px 0;
display: flex;
gap: 12px 15px;
flex-wrap: wrap;

/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

line-height: 1.7;
font-size: 1rem;
}



.noaru-index-jump a {
text-decoration: none;
border-bottom: 1px solid #1a1a1a;
}

.noaru-index-jump span {
color: #a9aaa6;
}

.noaru-artist-letter {
display: grid;
grid-template-columns: 36px 1fr;
gap: 8px;

padding: 25px 0 30px 0;
scroll-margin-top: 25px;
}

.noaru-artist-letter h3 {
margin: 0;
padding: 0;
/*Google Noto Serif*/
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 600;
font-style: normal;

/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 20px;
}






.noaru-artist-letter-row {
display: grid;
grid-template-columns: minmax(0, 1fr) 18px;
gap: 6px;
padding: 10px 0;
border-bottom: 1px solid #ccc;
align-items: baseline;
text-decoration: none;
}

.noaru-artist-letter-row:hover {
background: rgba(128, 128, 128, .035);
}

.noaru-artist-letter-name {
margin: 0;
padding: 0;

/*Adobe Fonts*/
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
line-height: 1.1;
}

/*日本語*/
.noaru-artist-letter-ja,
.noaru-artist-letter-years {
margin: 0;
padding: 0;
font-size: 14px;
line-height: 1.1;
}

.noaru-artist-letter-ja {
grid-column: 1;
grid-row: 2;
font-size: 12px;
font-feature-settings: "palt" 1;
letter-spacing: 0.03em;
}

.noaru-artist-letter-years {
display: none;
white-space: nowrap;
}

.noaru-artist-letter-arrow {
grid-column: 2;
grid-row: 1;
font-size: 14px;
}



/* Art Movement navigation
------------------------------------------------------------------------------------------- */
.artist-movement-browser {
width: 92%;
margin: 0 auto;
padding: 24px 0 30px 0;
border-bottom: 1px solid #d8d8d8;
}

.artist-movement-browser__head {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 20px;
margin: 0 0 20px 0;
}

.artist-movement-browser__head h2 {
margin: 0;

font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 18px;
line-height: 1.2;
}

.artist-movement-browser__head span {
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 10px;
line-height: 1.2;
color: #777;
white-space: nowrap;
}

.artist-movement-group + .artist-movement-group {
margin-top: 28px;
}

.artist-movement-group__head {
position: relative;
display: block;
padding: 0 0 8px 0;
border-bottom: 1px solid #d8d8d8;
}

.artist-movement-group__head h3 {
margin: 0;

font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 16px;
line-height: 1.2;
}

.artist-movement-group__label {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 7px;
min-width: 0;
}

.artist-movement-group__label p {
margin: 0;

font-family: YakuHanJPs, "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 600;
font-style: normal;

font-size: 16px;
line-height: 1.3;
color: inherit;
white-space: normal;
overflow-wrap: anywhere;
}

.artist-movement-group__head > span {
position: absolute;
top: 0;
right: 0;
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 10px;
line-height: 1.2;
color: #777;
white-space: nowrap;
}

.artist-movement-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 18px;
}

.artist-movement-link {
display: block;
min-width: 0;
padding: 10px 0 12px 0;
border-bottom: 1px solid #e0e0e0;
text-decoration: none;
transition: opacity 0.4s ease;
}

.artist-movement-link:hover {
opacity: 0.5;
}

.artist-movement-link__period {
display: block;
margin-bottom: 5px;
font-family: "hoefler-text", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 14px;
line-height: 1.2;
color: #666;
white-space: normal;
}

.artist-movement-link__name {
display: block;
min-width: 0;
overflow: visible;
text-overflow: clip;
white-space: normal;
overflow-wrap: anywhere;

font-family: YakuHanJPs, "Noto Serif JP", serif;
font-feature-settings: "palt" 1;
letter-spacing: 0.03em;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;

font-size: 15px;
line-height: 1.25;
}

/* Movement nav の直後なので、A-Z / 五十音との間隔を詰める */
.artist-movement-browser + .noaru-artist-index {
margin-top: 0;
}


/* スマホ終了
------------------------------------------------------------------------------------------- */
@media screen and (min-width: 768px) {





/* PCでは late と年代を同じ行に表示 */
.artist-movement-period-br {
display: none;
}


/* Art Movement navigation PC */
.artist-movement-group__head {
position: static;
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 20px;
}

.artist-movement-group__label {
flex-direction: row;
align-items: baseline;
gap: 12px;
}

.artist-movement-group__label p {
white-space: nowrap;
}

.artist-movement-group__head > span {
position: static;
}

.artist-movement-browser {
width: 94%;
padding: 28px 0 34px 0;
}

.artist-movement-browser__head {
margin-bottom: 22px;
}

.artist-movement-browser__head h2 {
font-size: 19px;
}

.artist-movement-group + .artist-movement-group {
margin-top: 30px;
}

.artist-movement-group__head h3 {
font-size: 26px;
}

.artist-movement-group__label p {
font-size: 22px;
}

.artist-movement-group__head span {
font-size: 14px;
}

.artist-movement-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
column-gap: 40px;
}

.artist-movement-link {
display: block;
padding: 9px 0 10px 0;
transition: background-color .25s ease, opacity .25s ease;
}

.artist-movement-link:hover {
opacity: 1;
background: #fff;
}

.artist-movement-link__period {
margin-bottom: 5px;
font-size: 14px;
}

.artist-movement-link__name {
font-size: 17px;
}






/*ヘッダー*/
.artist_archive_header{
padding: 100px 32px 35px 32px;
margin: 0 auto 0 auto;
border-bottom: 1px solid #d8d8d8;
}


h1.artist_archive_h1 {
margin: 0 0 0 0;

font-family: "trajan-pro-3", serif;
font-weight: 400;
font-style: normal;

font-size: 25px;
line-height: 1.0;
letter-spacing: -0.03em;
}

.artist_archive_header_lead{
margin: 10px 0 0 0;
font-size: 14px;
line-height: 1.5;
}

.noaru-artist-index {
width: 94%;
margin: 0 auto;
}


.artist_archive_intro{
margin: 10px 0 0 0;
max-width: 70%;
font-size: 14px;
line-height: 1.5;
}



.noaru-directory-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 38px 25px;
}

/* ARTIST archive：アーティスト固有部分 */
.noaru-artist-featured-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
}

.noaru-artist-letter {
grid-template-columns: 100px minmax(0, 1fr);
gap: 10px;
}

.noaru-artist-letter h3 {
font-size: 2rem;
}

.noaru-artist-letter-row {
grid-template-columns: minmax(145px, 1.4fr) minmax(120px, 1fr) minmax(80px, .6fr) 16px;
gap: 20px;
transition: background-color .25s ease, opacity .25s ease;
}

.noaru-artist-letter-row:hover {
opacity: 1;
background: #fff;
}

.noaru-artist-letter-name {
font-size: 1.08rem;
}

.noaru-artist-letter-ja {
grid-column: auto;
grid-row: auto;
font-size: 15px;
}

.noaru-artist-letter-years {
display: block;
}

.noaru-artist-letter-arrow {
grid-column: auto;
grid-row: auto;
}

}/*PC 終了*/
