@charset "UTF-8";
/* Art Library Dynamic Navigation — PC only (>=768px) */


@media screen and (min-width:768px) {
/* 旧PCマストヘッダのみ非表示。SP側では引き続き既存ナビを使用 */

.masthead {
display:none!important;
}




#pcd-root {
--pcd-ink:#252525;
--pcd-line:#dededb;
--pcd-serif:"hoefler-text",Georgia,"Times New Roman",serif;
--pcd-jp:YakuHanJPs,"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
color:var(--pcd-ink);
font-family:var(--pcd-jp);
font-weight:400;
}
#pcd-root *,
#pcd-root *::before,
#pcd-root *::after {
box-sizing:border-box;
}

#pcd-root a {
color:inherit;
text-decoration:none;
}

#pcd-root button {
cursor:pointer;
}

#pcd-root :focus-visible {
outline:2px solid #467cad;
outline-offset:3px;
}

/* 検索入力欄のみ、フォーカス時の青い枠線と影を消す。ボタンやリンクのフォーカス表示は維持。 */
#pcd-root .pcd-panel-top-search input:focus,
#pcd-root .pcd-search-popover-input:focus,
.pcd-search-popover .pcd-search-popover-input:focus {
outline: none !important;
box-shadow: none !important;
}

/* One single surface morphs between the wide header, island, and open menu. */
#pcd-island-shell {
position:fixed;
z-index:1001;
left:50%;
transform:translateX(-50%);
top:18px;
width:calc(100vw - 36px);
height:64px;
background:rgba(255,255,255,.96);
border:1px solid rgba(38,38,38,.14);
border-radius:10px;
box-shadow:0 3px 20px rgba(0,0,0,.032);
overflow:hidden;
isolation:isolate;
will-change:width,height,top,border-radius;
-webkit-backdrop-filter:blur(18px);
backdrop-filter:blur(18px);
}
/* 収束時：透過率を高め、背後の輪郭が少し残るすりガラスにする */
#pcd-island-shell.pcd-is-island {
background:rgba(255,255,255,.30);
-webkit-backdrop-filter:blur(10px);
backdrop-filter:blur(10px);
box-shadow:0 8px 30px rgba(20,20,20,.095),0 2px 5px rgba(0,0,0,.025);
}

/* 収束したカプセルのホバー反応（PCのみ）。サイズと位置は変えない。 */
#pcd-island-shell {
transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease;
}

@media (hover:hover) and (pointer:fine) {
/* 実際のメニューボタンにホバーしたときだけ反応 */
#pcd-island-shell.pcd-is-island:has(.pcd-morph-control:hover) {
background:rgba(255,255,255,1);
border-color:rgba(38,38,38,.30);
box-shadow:0 12px 34px rgba(20,20,20,.14),0 2px 6px rgba(0,0,0,.04);
}
#pcd-island-shell.pcd-is-island .pcd-morph-control:hover {
color:#666;
}
}

#pcd-island-shell.pcd-is-island:has(.pcd-morph-control:focus-visible) {
border-color:rgba(38,38,38,.30);
box-shadow:0 12px 34px rgba(20,20,20,.14),0 2px 6px rgba(0,0,0,.04);
}

#pcd-island-shell.pcd-is-open {
box-shadow:0 20px 80px rgba(0,0,0,.16),0 3px 18px rgba(0,0,0,.055);
}

/* Initial wide navigation. */
.pcd-wide-nav {
position:absolute;
inset:0;
display:flex;
align-items:center;
gap:0;
padding:0 0 0 28px;
opacity:0;
pointer-events:none;
transition:opacity .18s ease;
white-space:nowrap;
}
.pcd-is-bar .pcd-wide-nav {
opacity:1;
pointer-events:auto;
transition-delay:.13s;
}

.pcd-wide-brand {
font:normal clamp(15px,1.5vw,22.2px)/1 var(--pcd-serif);
letter-spacing:-.03em;
white-space:nowrap;
padding-right:29px;
border-right:none;


font-family: "minion-pro-display", serif;
font-weight: 400;
font-style: normal;

font-size:22px;

font-feature-settings: "palt";
letter-spacing: -0.001em;
color: #000;
}




/* メニュー項目間と、最後の項目から検索アイコン左罫線までを同じ余白にする */
.pcd-wide-links {
--nav-item-gap:clamp(18px,2vw,34px);
flex:0 1 auto;
display:flex;
align-items:center;
justify-content:flex-end;
gap:var(--nav-item-gap);
min-width:0;
margin-left:auto;
margin-right:var(--nav-item-gap);
font-feature-settings: "palt";
}


.pcd-wide-links a {
font-size:14px;
font-weight: 500;
white-space:nowrap;
transition:opacity .2s;
}


.pcd-wide-links a:hover {
opacity:.5;
}

/* 初期の横長グロナビ：現在閲覧中のカテゴリだけ青い下線を常時表示 */
.pcd-wide-links a.pcd-is-current {
position:relative;
}
.pcd-is-bar .pcd-wide-links a.pcd-is-current::after {
content:"";
position:absolute;
left:0;
right:0;
bottom:-4px;
height:2px;
background:#4683a5;
pointer-events:none;
}
/* 選択中の項目では、ホバーしても青い下線の濃さを維持 */
.pcd-wide-links a.pcd-is-current:hover {
opacity:1;
}
.pcd-wide-cta {
height:36px;
width:78px;
border:0;
border-left:1px solid var(--pcd-line);
padding:0;
background:none;
/* iPad Safari: prevent the default blue button tint from coloring the lines. */
color:var(--pcd-ink);
-webkit-appearance:none;
appearance:none;
-webkit-tap-highlight-color:transparent;
display:grid;
place-items:center;
flex:0 0 78px;
}
.pcd-small-menu-icon {
display:block;
width:22px;
height:12px;
position:relative;
}
.pcd-small-menu-icon::before,
.pcd-small-menu-icon::after {
content:"";
height:1.5px;
background:currentColor;
position:absolute;
left:0;
right:0;
}
.pcd-small-menu-icon::before {
top:3px;
}
.pcd-small-menu-icon::after {
bottom:3px;
}
/* The search and hamburger icons share equal-width action zones. */
/* Both are optically centred; the magnifier handle needs a slight offset. */

/* Wide-header-only floating search, inspired by the supplied reference. */
.pcd-wide-search-trigger {
display:grid;
place-items:center;
flex:0 0 78px;
width:78px;
height:36px;
margin:0;
padding:0;
color:#252525;
background:transparent;
border:0;
border-left:1px solid var(--pcd-line);
transition:color .2s ease;
}
.pcd-wide-search-trigger svg {
display:block;
width:18.7px;
height:18.7px;
stroke:currentColor;
stroke-width:1.9;
fill:none;
stroke-linecap:round;
stroke-linejoin:round;
transform:translate(-1px,-.5px);
}
.pcd-wide-search-trigger:hover,
.pcd-wide-search-trigger[aria-expanded="true"] {
color:#777;
}
.pcd-wide-cta {
border-left:1px solid var(--pcd-line);
padding:0;
}
.pcd-search-popover {
position:fixed;
z-index:1210;
top:calc(18px + 64px + 12px);
right:18px;
width:min(550px,calc(100vw - 32px));
padding:10px 20px;
background:#fff;
border:1px solid #e6e6e3;
border-radius:7px;
box-shadow:0 10px 36px rgba(0,0,0,.11);
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translateY(-7px);
transition:opacity .22s ease,transform .32s cubic-bezier(.2,.8,.2,1),visibility 0s linear .32s;
}
.pcd-search-popover.pcd-is-visible {
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateY(0);
transition-delay:0s;
}
.pcd-search-popover::before {
content:"";
position:absolute;
top:-9px;
right:calc(var(--arrow-right, 83px) - 8px);
width:16px;
height:16px;
transform:rotate(45deg);
background:#fff;
border-top:1px solid #e6e6e3;
border-left:1px solid #e6e6e3;
}
.pcd-search-popover-form {
display:flex;
align-items:center;
gap:13px;
width:100%;
height:40px;
}
.pcd-search-popover-input {
flex:1 1 auto;
min-width:0;
height:100%;
padding:0 8px;
border:0;
outline:0;
background:transparent;
color:#252525;
font-family:var(--pcd-jp);
font-size:14px;
}
.pcd-search-popover-input::placeholder {
color:#aaa;
opacity:1;
}
.pcd-search-popover-submit {
flex:none;
display:flex;
align-items:center;
justify-content:center;
gap:7px;
height:30px;
min-width:96px;
border:0;
border-radius:24px;
background:#2c2c2c;
color:#fff;
padding:0 14px;
font:12px/1.3 var(--pcd-jp);
transition:background .2s;
}
.pcd-search-popover-submit svg {
width:15px;
height:15px;
stroke:currentColor;
fill:none;
stroke-width:1.7;
stroke-linecap:round;
}
.pcd-search-popover-submit:hover {
background:#626262;
}
@media(prefers-reduced-motion:reduce) {
.pcd-search-popover {
transition-duration:.01ms;
}
}

/* The wide logo → compact capsule motion is unchanged.
   During expansion the compact title and lines retain their exact size and screen
   position until they fade; the distinct upper-left close control then fades in. */
.pcd-morph-control,
.pcd-panel-close {
position:absolute;
z-index:9;
display:flex;
align-items:center;
gap:14px;
white-space:nowrap;
background:transparent;
border:0;
color:#252525;
opacity:0;
pointer-events:none;
transition:opacity .18s ease;
}
.pcd-morph-control {
left:50%;
top:16px;
transform:translate(-50%,-50%);
padding:4px 7px;
gap:9px;
}
.pcd-morph-control {
transition:opacity .18s ease,color .25s ease;
}
.pcd-is-island .pcd-morph-control {
/* カプセル全体をクリック・ホバー領域にする */
width:100%;
height:100%;
top:50%;
padding:0;
justify-content:center;
opacity:1;
pointer-events:auto;
transition-delay:.15s;
}
/* When closing, keep the compact handle hidden until the surface has shrunk. */
.pcd-is-island.pcd-is-returning .pcd-morph-control {
transition-delay:.36s;
}

.pcd-morph-control .pcd-control-lines {
width:22px;
height:18px;
transform:translateY(0px);
}
.pcd-morph-control .pcd-control-lines i {
width:22px;
}

.pcd-morph-control .pcd-control-brand {
font-size:14px;
transform:translateY(1px);
}

/* The capsule's logo and lines fade immediately as the surface opens. */
.pcd-is-open .pcd-morph-control {
opacity:0;
pointer-events:none;
transition-delay:0s;
}
.pcd-panel-topbar {
position:absolute;
z-index:9;
left:29px;
right:29px;
top:20px;
display:flex;
align-items:center;
gap:0;
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translateY(13px);
transition:opacity .31s ease,transform .5s cubic-bezier(.2,.8,.2,1),visibility 0s linear .31s;
}
.pcd-is-open .pcd-panel-topbar {
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateY(0);
transition-delay:0s,0s,0s;
}
.pcd-panel-close {
position:relative;
z-index:2;
display:inline-flex;
align-items:center;
justify-content:center;
width:0;
height:0;
padding:0;
background:transparent;
border:0;
color:#252525;
flex:0 0 0;
overflow:hidden;
opacity:0;
pointer-events:none;
}
.pcd-panel-close .pcd-control-lines i:first-child {
transform:rotate(45deg);
}
.pcd-panel-close .pcd-control-lines i:last-child {
transform:rotate(-45deg);
}
.pcd-control-lines {
width:29px;
height:22px;
display:block;
position:relative;
flex:none;
}
.pcd-control-lines i {
position:absolute;
left:0;
top:50%;
height:1.5px;
width:29px;
background:currentColor;
display:block;
transform-origin:50% 50%;
transition:transform .42s cubic-bezier(.18,.85,.2,1);
}
.pcd-control-lines i:first-child {
transform:translateY(-2.25px);
}
.pcd-control-lines i:last-child {
transform:translateY(2.25px);
}
/* Only the upper-left close icon is an X. The capsule lines fade without rotating. */
.pcd-control-brand {
font:normal 26px/1 var(--pcd-serif);
letter-spacing:-.045em;
}
.pcd-panel-close .pcd-control-brand {
font-size:26px;
}
.pcd-panel-top-search {
flex:1 1 auto;
display:flex;
align-items:center;
gap:14px;
min-width:0;
width:100%;
height:44px;
padding:0 0 2px;
border:0;
border-bottom:1px solid #e1e1dd;
background:transparent;
}
.pcd-panel-top-search input {
flex:1 1 auto;
min-width:0;
height:100%;
border:0;
outline:0;
background:transparent;
padding:0 4px;
color:#252525;
font-family:var(--pcd-jp);
font-size:14px;
line-height:1.4;
}
.pcd-panel-top-search input::placeholder {
color:#aaa;
opacity:1;
}
.pcd-panel-top-search button {
flex:0 0 96px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:7px;
width:96px;
height:30px;
padding:0 12px;
border:0;
border-radius:999px;
background:#2c2c2c;
color:#fff;
font:400 12px/1.3 var(--pcd-jp);
transition:background .2s ease;
}
.pcd-panel-top-search button:hover {
background:#626262;
}
.pcd-panel-top-search button svg {
display:block;
flex:0 0 15px;
width:15px;
height:15px;
fill:none;
stroke:currentColor;
stroke-width:1.7;
stroke-linecap:round;
}

/* Keep the menu content at the FINAL expanded dimensions throughout the spring.
   Only #pcd-island-shell changes size; it clips the fixed-width inner menu.
   This prevents the description and utility links from reflowing during expansion. */
.pcd-panel-view {
position:absolute;
top:0;
left:50%;
width:var(--expanded-width,850px);
height:var(--expanded-height,448px);
padding:80px 32px 28px 32px;
overflow-x:hidden;
overflow-y:auto;
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translate(-50%,13px);
transition:opacity .31s ease,transform .5s cubic-bezier(.2,.8,.2,1),visibility 0s linear .31s;
}
.pcd-is-open .pcd-panel-view {
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translate(-50%,0);
transition-delay:0s,0s,0s;
}
.pcd-panel-view::before {
content:none;
}
.pcd-panel-grid {
display:grid;
grid-template-columns:1.38fr .82fr;
gap:34px;
}
/* PC: menu width 850 -> 780px. Shrink the left column by 70px;
   retain the previous 850px layout's 280px right column and the 34px gap. */
@media (min-width:701px) {
.pcd-panel-grid {
grid-template-columns:minmax(0,1fr) 280.3px;
}
.pcd-panel-grid > div:first-child {
min-width:0;
}
}
/* 展開メニュー内の文字選択を防止。検索入力欄は通常どおり入力・選択可能。 */
.pcd-is-open .pcd-panel-view,
.pcd-is-open .pcd-panel-topbar {
-webkit-user-select:none;
user-select:none;
}
.pcd-is-open .pcd-panel-top-search input {
-webkit-user-select:text;
user-select:text;
}

/* Expanded menu section headings: aligned in tone with the menu text. */
.pcd-panel-eyebrow,
.pcd-panel-side-logo {
font-family:"hoefler-text","Hoefler Text",Georgia,serif;
font-size:13px;
font-weight:400;
font-style:normal;
line-height:1.3;
letter-spacing:0;
margin:0 0 15px;
}
.pcd-panel-side-logo {
margin-bottom:23px;
}
.pcd-panel-overview {
margin:0 0 34px;
font-family:var(--pcd-jp);
font-size:14px;
font-weight:400;
line-height:1.5;
}
.pcd-panel-link {
position:relative;
display:grid;
grid-template-columns:25px 1fr auto;
align-items:baseline;
gap:10px;
padding:9px 0;
border-bottom:1px solid #e8e8e5;
transition:padding-left .25s, color .25s;
}

.pcd-panel-link:hover {
padding-left:6px;
color:#000;
}

.pcd-panel-count {
font:11px/1.4 var(--pcd-serif);
color:#999;
}

.pcd-panel-ja {
font-size:clamp(12px,calc(2.2vw - 5px),18px);
font-weight:normal;
line-height:1.35;
white-space:nowrap;
}

.pcd-panel-en {
font:12px/1.3 var(--pcd-serif);
color:#777;
white-space:nowrap;
}

.pcd-panel-link:first-child .pcd-panel-count,
.pcd-panel-link[data-world] .pcd-panel-count {
color:#4683a5;
}

.pcd-panel-link[data-jp] .pcd-panel-count {
color:#983636;
}

.pcd-panel-side {
border-left:1px solid var(--pcd-line);
padding-left:33px;
}

.pcd-panel-sub {
display:flex;
flex-wrap:wrap;
gap:10px 15px;
margin-top:22px;
}

.pcd-panel-sub a {
font-size:12px;
text-decoration:underline;
text-decoration-color:#bbb;
text-underline-offset:4px;
white-space:nowrap;
}

.pcd-panel-foot {
display:flex;
align-items:center;
justify-content:space-between;
margin-top:20px;
color:#252525;
font:400 10px/1.3 "hoefler-text","Hoefler Text",Georgia,serif;
letter-spacing:0;
}

/* Backdrop belongs to expanded state. */
#pcd-island-scrim {
position:fixed;
z-index:1000;
inset:0;
background:rgba(20,25,27,.13);
-webkit-backdrop-filter:blur(0);
backdrop-filter:blur(0);
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity .4s ease,backdrop-filter .4s ease,visibility 0s linear .4s;
}
body.pcd-menu-open #pcd-island-scrim {
opacity:1;
visibility:visible;
pointer-events:auto;
-webkit-backdrop-filter:blur(5px);
backdrop-filter:blur(5px);
transition-delay:0s;
}
body.pcd-menu-open {
overflow:hidden;
}




/* PC widths between 768 and 1050px: keep header controls usable. */
@media (max-width:1050px) {
.pcd-wide-nav {
padding-left:19px;
}
.pcd-wide-brand {
font-size:22px;
padding-right:19px;
}

.pcd-wide-links {
--nav-item-gap:clamp(10px,1.6vw,20px);
}

.pcd-wide-links a {
font-size:12px;
}

.pcd-wide-links a:nth-child(5) {
display:none;
}

.pcd-wide-search-trigger,
.pcd-wide-cta {
width:64px;
flex-basis:64px;
}

}/*end*/



@media (max-width:900px) {
.pcd-wide-links a:nth-child(4) {
display:none;
}
.pcd-panel-grid {
grid-template-columns:minmax(0,1fr) 240px;
gap:18px;
}
.pcd-panel-ja {
font-size:14px;
}
.pcd-panel-en {
font-size:10px;
}
.pcd-panel-side {
padding-left:20px;
}
}
} /* >=768px */
@media screen and (max-width:767px) {
#pcd-root {
display:none!important;
}
}
@media (prefers-reduced-motion:reduce) {
#pcd-root *,
#pcd-root *::before,
#pcd-root *::after {
transition-duration:.01ms!important;
transition-delay:0s!important;
animation-duration:.01ms!important;
}
}

@media screen and (min-width:768px) {
#pcd-island-shell {
z-index:1200;
}
#pcd-island-scrim {
z-index:1190;
}
.pcd-search-popover {
z-index:1210;
}
/* Visible close button intentionally omitted from menu, as in approved demo. */
.pcd-panel-close:focus-visible {
width:38px;
height:38px;
flex-basis:38px;
overflow:visible;
opacity:1;
pointer-events:auto;
}
}