@charset "utf-8";

/* ---------------------------------------------------------
   全体
   --------------------------------------------------------- */

#main-box {}
#archive-single-wrap { max-width: 100%; }
#sub-index { padding:0 5.13vw 15.38vw; }

@media screen and (min-width:900px){
#main-box {}
#archive-single-wrap {}
#sub-index { width:72.46vw; margin:0 auto; padding:0 0 5.8vw; }
}
@media screen and (min-width:1380px){
#main-box {}
#archive-single-wrap { max-width:100%; }
#sub-index { width:1000px; padding:0 0 80px; }
}




/* リニューアル中の暫定措置 */
#main-wrap:has(#sub_mainview) #sub-mainview { display:none; }
#sub_mainview { margin:0 auto 10.25vw; }
#sub_mainview img { width:100%; height:auto; }

@media screen and (min-width:900px){
#sub_mainview { width:46.37vw; margin:0 auto 2.9vw; }
#sub_mainview img {}

}
@media screen and (min-width:1380px){
#sub_mainview { width:640px; margin:0 auto 40px; }
#sub_mainview img {}

}




/* ----------------------------------------------
 ! パンくず
 ---------------------------------------------- */

#nav-breadcrumb { padding:4.1vw 5.13vw;}
#nav-breadcrumb ul { display:flex; flex-flow:row wrap; }
#nav-breadcrumb li { line-height:1.4; margin:0 1.03vw 0 0; font-size:3.08vw; list-style:none; position:relative; }
#nav-breadcrumb li:after { content:">"; margin:0 0 0 1.03vw; }
#nav-breadcrumb li:last-child::after { display:none; }
#nav-breadcrumb li a { font-size:3.08vw; }
#nav-breadcrumb li a:hover {}

@media screen and (min-width:900px){
#nav-breadcrumb { padding:1.16vw 1.45vw; }
#nav-breadcrumb ul {}
#nav-breadcrumb li { margin:0 0.72vw 0 0; font-size:0.87vw; }
#nav-breadcrumb li:after { margin:0 0 0 0.72vw; }
#nav-breadcrumb li:last-child::after {}
#nav-breadcrumb li a { font-size:0.87vw; }
#nav-breadcrumb li a:hover { text-decoration:none; }
}
@media screen and (min-width:1380px){
#nav-breadcrumb { padding:16px 20px; }
#nav-breadcrumb ul {}
#nav-breadcrumb li { margin:0 10px 0 0; font-size:12px; }
#nav-breadcrumb li:after { margin:0 0 0 10px; }
#nav-breadcrumb li:last-child::after {}
#nav-breadcrumb li a { font-size:12px; }
#nav-breadcrumb li a:hover { text-decoration:none; }
}




/* ---------------------------------------------------------
   タイトル
   --------------------------------------------------------- */

#sub-title { line-height:1.4; text-align:center; margin:0 0 10.25vw; padding:10.25vw 5.13vw 7.69vw; font-size:6.15vw; color:var(--kyoto-purple-dark); font-weight:600; letter-spacing:0.12em; position:relative; }
#sub-title::before { content:""; position:absolute; left:calc(50% - 7.69vw); bottom:0; width:15.38vw; height:0.51vw; background:var(--kyoto-gold); }
#sub-mainview { margin:0 5.13vw 7.69vw; }
#sub-mainview figure {}
#sub-mainview img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
#sub-excerpt { padding:0 5.13vw 12.82vw; }
#sub-excerpt dt { line-height:1.5; font-size:4.1vw; color:#514a53; font-weight:600; }
#sub-excerpt dd { line-height:1.8; font-size:3.85vw; color:#514a53; }

@media screen and (min-width:900px) {
#sub-title { margin:0 0 2.9vw; padding:2.9vw 2.9vw 2.17vw; font-size:2.17vw; }
#sub-title::before { left:calc(50% - 2.17vw); width:4.35vw; height:0.14vw; }
#sub-mainview { width:46.37vw; margin:0 auto 2.9vw; }
#sub-mainview figure {}
#sub-mainview img {}
#sub-excerpt { width:72.46vw; margin:0 auto; padding:0 0 5.8vw; }
#sub-excerpt dt { font-size:1.3vw; }
#sub-excerpt dd { font-size:1.16vw; }
}
@media screen and (min-width:1380px) {
#sub-title { margin:0 0 40px; padding:40px 40px 30px; font-size:30px; }
#sub-title::before { left:calc(50% - 30px); width:60px; height:2px; }
#sub-mainview { width:640px; margin:0 auto 40px; }
#sub-mainview figure {}
#sub-mainview img {}
#sub-excerpt { width:1000px; margin:0 auto; padding:0 0 80px; }
#sub-excerpt dt { font-size:18px; }
#sub-excerpt dd { font-size:16px; }
}




/* ---------------------------------------------------------
   目次
   --------------------------------------------------------- */

.sub-mokuji { background:var(--kyoto-purple-pale); border:1px solid var(--border); box-shadow:var(--shadow); margin:0 5.13vw 15.38vw; padding:5.13vw 5.13vw 0; }
.sub-mokuji p { border-bottom:1px var(--border) solid; padding:0 0 5.13vw 3.07vw; color:var(--kyoto-purple-dark); font-size:3.85vw; font-weight:600; letter-spacing:0.08em; position:relative; }
.sub-mokuji p::before { content: ""; position:absolute; top:0; left:0; width:0.51vw; height:3.85vw; background:var(--kyoto-red); }
.sub-mokuji ul {}
.sub-mokuji li { list-style:none; }
.sub-mokuji li:not(:last-of-type) { border-bottom:1px rgba(227, 220, 229, 0.8) dashed; }
.sub-mokuji li a { display:flex; align-items:center; height:15.38vw; line-height:1.6; padding:2.05vw 0 2.05vw 4.61vw; font-size:3.85vw; color:var(--text); text-decoration:none; position:relative; }
.sub-mokuji li a:before { content:""; position:absolute; top:50%; left:0; width:2vw; height:2vw; border-top:0.6vw var(--kyoto-gold) solid; border-right:0.6vw var(--kyoto-gold) solid; transform:translateY(-50%) rotate(45deg); }
article[id] { scroll-margin-top: 2rem; }

@media screen and (min-width:900px) {
.sub-mokuji { width:72.46vw; margin:0 auto 5.8vw; padding:1.45vw 1.45vw 0; }
.sub-mokuji p { padding:0 0 1.45vw 0.87vw; font-size:1.16vw; }
.sub-mokuji p::before { width:0.14vw; height:1.16vw; }
.sub-mokuji ul {}
.sub-mokuji li {}
.sub-mokuji li:not(:last-of-type) {}
.sub-mokuji li a { height:3.98vw; padding:0.58vw 0 0.58vw 1.3vw; font-size:1.16vw; 
  transition:color 0.2s ease, background-color 0.2s ease, padding-left 0.2s ease; }
.sub-mokuji li a:before { width:0.58vw; height:0.58vw; border-top:0.14vw var(--kyoto-gold) solid; border-right:0.14vw var(--kyoto-gold) solid; transition:padding-left 0.2s ease; }
.sub-mokuji li a:hover { color: var(--kyoto-purple); background:rgba(255, 255, 255, 0.65); padding-left:1.16vw; }
.sub-mokuji li a:hover::before { left:-0.14vw; }
}
@media screen and (min-width:1380px) {
.sub-mokuji { width:1000px; margin:0 auto 80px; padding:20px 20px 0; }
.sub-mokuji p { padding:0 0 20px 12px; font-size:16px; }
.sub-mokuji p::before { width:2px; height:16px; }
.sub-mokuji ul {}
.sub-mokuji li {}
.sub-mokuji li:not(:last-of-type) {}
.sub-mokuji li a { height:55px; padding:8px 0 8px 18px; font-size:16px; }
.sub-mokuji li a:before { width:8px; height:8px; border-top:2px var(--kyoto-gold) solid; border-right:2px var(--kyoto-gold) solid; }
.sub-mokuji li a:hover { padding-left:16px; }
.sub-mokuji li a:hover::before { left:-2px; }
}