@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&display=swap');

/*reset*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

body {
background:#000000 url(../img/bg.jpg) repeat;
line-height:170%;
color:#fff;
font-size:16px;
}
article, aside, dialog, figure, footer, header,
hgroup, nav, section {
display:block;
}

nav ul {
list-style:none;
}

blockquote, q {
quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}

a {
margin:0;
padding:0;
border:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

abbr[title], dfn[title] {
border-bottom:1px dotted #000;
cursor:help;
}

table {
border-collapse:collapse;
border-spacing:0;
}

input, select {
vertical-align:middle;
}
li{
list-style:none;
}

a:link {
color:#fff;
}
a:visited {
color:#fff;
}
a:hover{
color:#999;
}


.wrapper{
width:960px;
margin:0 auto;
}

body > .wrapper::after{
content:"";
display:block;
clear:both;
}

.section article{
    margin-top: 60px;
}
header{background:url(../img/header-bg.jpg) repeat-x;height:90px;}
header h1{
float:left;
margin-top:10px;
}
header nav{
float:right;
margin-top:60px;
}
header nav{
float:right;
margin-top:50px;
}

header li{
font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
float:left;
margin-left:15px;
}

#page-top{
clear:both;
padding:80px 0 5px 0;
text-align: right;
}

#page-top a{
display:inline-flex;
align-items:center;
gap:6px;
color:#fff;
font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
font-size:14px;
line-height:1;
text-decoration:none;
}

#page-top a:before{
content:"";
display:inline-block;
width:20px;
height:20px;
background:url(../img/page-top-off.png) no-repeat 0 0 / 20px 20px;
flex:0 0 20px;
}

#page-top a:hover{
text-decoration:underline;
}

footer{
font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
background:url(../img/footer-bg.jpg) repeat-x;
height:100px;
padding-top:20px;
text-align:center;
color:#fff;
font-size:12px;
}

/*top*/
#top-left{
    min-width: 545px;
    padding-left:5px;
    margin-top:10px;
    max-width: 570px;
}
#top-left h2{
height:26px;
}

#top-news{float:right;position:relative;background-color:rgba(112,112,112,.72);background-size:7px 7px, 9px 9px, 100% 100%;height:195px;width: 336px;margin-top: 10px;overflow:visible;border:1px solid rgba(255,255,255,.45);}
#top-news:before,
#top-news:after{
content:"";
position:absolute;
width:83px;
height:151px;
background:url(../img/bg-info.png) no-repeat 0 0;
pointer-events:none;
}
#top-news:before{
top:-14px;
left:-24px;
}
#top-news:after{right: -18px;bottom: -18px;transform:rotate(180deg);}
#top-news h2{position:relative;z-index:1;padding: 15px 0 0px 10px;text-shadow: 4px 3px 3px rgb(21 21 21 / 35%);
    font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
}
#sc{position:relative;z-index:1;margin-left: 0;width: calc(100% - 30px);height: 100px;overflow:auto;}
#top-news dl{padding: 0 0 0 10px;display: flex;flex-direction: row;flex-wrap: wrap;font-size: 14px;}
#top-news dt{width: 82px;}

#top-news dd{width: calc(100% - 92px);}

.top-news-wrapper{display:flex;align-items:flex-start;gap:20px;clear:both;margin-top:10px;justify-content: space-between;max-width: 940px;}

.top-news-wrapper #top-left,
.top-news-wrapper #top-news{margin-top:0;}

.top-news-wrapper #top-left{flex:1 1 auto;min-width:0;padding-left:5px;max-width: calc(100% - 360px);}

.top-news-wrapper #top-news{flex:0 0 316px;width: 346px;height:195px;}

article h2{
padding-top:50px;
margin-bottom:10px;
height:80px;
clear:both;
font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
}

.f-left{
float:left;
}
.f-left li{
	margin-bottom: 10px;
}
.f-left img{
background-color:rgba(112,112,112,.72);
background-image:
radial-gradient(circle at 20% 15%, rgba(255,255,255,.13) 0 1px, transparent 1px),
radial-gradient(circle at 70% 45%, rgba(0,0,0,.14) 0 1px, transparent 1px),
linear-gradient(135deg, rgba(255,255,255,.08), rgba(0,0,0,.12));
background-size:7px 7px, 9px 9px, 100% 100%;
padding:3px;
border:1px solid #ccc;
}
figure.f-left{
line-height:1;
}
.lead-text{
    font-size: 17px;
    font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
    margin-bottom: 2em;
}
.book-txt{
float:right;
width:650px;
}
.book-txt h2{
margin-bottom:20px;
font-family:"Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
font-weight:700;
letter-spacing:0;
}

hr{
background:url(../img/line.png) repeat-x;
width:630px;
border:1px;
height:1px;
margin:30px 0;
}

.book-txt dl{
margin-bottom:20px;
}
.book-txt dt{font-weight:bold;color: #b4b406;}
.book-txt dd{
background:url(../img/ic.png) no-repeat 0 3px;
padding-left:14px;
}

.book-wrapper{
display:flex;
align-items:flex-start;
gap:30px;
clear:both;
margin-bottom:20px;
}

.book-wrapper .f-left{
float:none;
flex:0 0 286px;
margin:0;
}

.book-wrapper .book-txt{
float:none;
width:auto;
flex:1 1 auto;
min-width:0;
}

.spec p{
margin-bottom:1em;
}
.pics li{
float:left;
background-color:rgba(112,112,112,.72);
background-image:
radial-gradient(circle at 20% 15%, rgba(255,255,255,.13) 0 1px, transparent 1px),
radial-gradient(circle at 70% 45%, rgba(0,0,0,.14) 0 1px, transparent 1px),
linear-gradient(135deg, rgba(255,255,255,.08), rgba(0,0,0,.12));
background-size:7px 7px, 9px 9px, 100% 100%;
border:1px solid #ccc;
line-height:1;
height:160px;
width:160px;
padding:3px;
margin-right:40px;
margin-bottom:20px;
}
.kurotokage li{
float:left;
background-color:rgba(112,112,112,.72);
background-image:
radial-gradient(circle at 20% 15%, rgba(255,255,255,.13) 0 1px, transparent 1px),
radial-gradient(circle at 70% 45%, rgba(0,0,0,.14) 0 1px, transparent 1px),
linear-gradient(135deg, rgba(255,255,255,.08), rgba(0,0,0,.12));
background-size:7px 7px, 9px 9px, 100% 100%;
border:1px solid #ccc;
line-height:1;
padding:3px;
margin-right:40px;
margin-bottom:20px;

}
.kurotokage li p{
fotn-size:10px;
text-align:right;
}
.notice{
clear:both;
font-size:12px;
display:block;
}
.order_ct{
width:200px;
clear:both;
margin-left:310px;
text-align:left;
}


.order{width: 540px;clear:both;margin-left:310px;}
.order img{
float:left;
width:195px;
}
.order p{float:right;font-size:12px;width: 330px;padding:10px 0 0 10px;}


/*sub*/
section#sub{
display:block;
width:670px;
padding-left:280px;
box-sizing:content-box;
clear:both;
position:relative;
padding-top:10px;
}
section#sub:after{
content:"";
display:block;
clear:both;
}
section#sub > article{
box-sizing:border-box;
}

section#sub,
section#sub p,
section#sub dl,
section#sub dt,
section#sub dd,
section#sub table,
section#sub td,
section#sub th,
section#sub li,
section#sub a,
section#sub span,
section#sub div{
font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", verdana, sans-serif;
}

section#sub h2.image-heading,
section#sub h3,
section#sub .image-heading__text,
section#sub .image-heading__lead,
section#sub .image-heading__title{
font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

dl.info-grid{
display:grid !important;
grid-template-columns:150px minmax(0, 1fr);
align-items:start;
padding-bottom:40px;
}

table.info-grid{
width:680px;
}

.info-grid dt,
.info-grid dd,
.info-grid th,
.info-grid td{
box-sizing:border-box;
padding:5px 0 3px 0;
border-bottom:1px dotted #ccc;
}

.info-grid dd,
.info-grid td{
min-width:0;
}

.info-grid th{
text-align:left;
width:150px;
vertical-align:top;
}

article#greeting h2{
clear:none;
padding-top:0;
height:auto;
}
article#greeting h3,article#privacy h3{
margin-top:20px;
}

.mailform th{
text-align:left;
width:120px;
}

table#contact,table#order{
width:660px;
margin-top:20px;
}
#contact th,#contact td,#order th,#order td{
padding:5px 0px 20px 0;
}
#contact th{
width:140px;
text-align:left;
vertical-align:top;
font-weight:normal;
}
#order th{
width:100px;
text-align:left;
vertical-align:top;
font-weight:normal;
}


#contact td span,#order td span{
font-size:12px;
}

#order label{
display:inline-flex;
align-items:center;
min-height:44px;
margin-right:10px;
}

#order input[size="2"]{
min-width:3.5em;
text-align:center;
}
#ct{
text-align:center;
}

ul#flow{
margin:20px 0 10px 0;
}
#flow li{
margin-bottom:10px;
text-indent:-1em;
padding-left:1em;
}

#flow:after {
content: "";
display: block;
clear: both;
height: 1px;
overflow: hidden;
}
/*\*/
* html #flow{
height: 1em;
overflow: visible;
}
section#magazine{
overflow:hidden;
}


#magazine{
background:url(../img/magazinebg.png) no-repeat 0 0;
background-size:100% 100%;
min-height:210px;
width:945px;
max-width:100%;
padding:26px 28px 24px 155px;
margin:30px auto 0 auto;
display:block;
clear:both;
}
#magazine_s{
    background:url(../img/magazinebg.png) no-repeat 0 0;
    height: 100%;
    width: 944px;
    padding: 10px 28px 24px 155px;
    margin:30px auto 0 auto;
    display:block;
    line-height: 1.3;
    aspect-ratio: 9 / 2;
}

#magazine aside,#magazine_s aside{
padding-left:0;

margin-bottom:10px;
color:#4B2806;
font-weight:bold;
}

.magazine-headline{
        font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
        display:flex;
        align-items:baseline;
        justify-content: flex-start;
        gap:16px;
        margin-bottom:10px;
        padding-bottom:4px;
        border-bottom: 1px solid #fff;
        font-size:24px;
        font-weight:600;
        color: #fff;
        }

.magazine-headline .magazine-date{
flex:0 0 auto;
font-size:14px;
font-weight:600;
white-space:nowrap;
}

#magazine #rt,#magazine_s #rt{
text-align:right;
}
#magazine a:link,#magazine a:visited,
#magazine_s a:link,#magazine_s a:visited{
text-decoration:none;
}
#magazine a:hover,#magazine_s a:hover{
text-decoration:underline;
color:#fff;
}

body > .wrapper:has(> section#sub.magazine-page){
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:0 30px;
}

body > .wrapper:has(> section#sub.magazine-page) > .page-visual{
flex:0 0 100%;
}

section#sub.magazine-page{
order:2;
flex:1 1 0;
width:auto;
min-width:0;
padding-left:0;
clear:none;
}

section#sub.magazine-page article{
float:none;
margin-left:0;
}
section#sub.magazine-page article h2.image-heading{
margin:0;
padding:0;
height:auto;
margin-bottom:5px;
text-align:left;
font-weight:700;
}

section#sub.magazine-page article p{
margin-bottom:1em;
}
.magazine-entry-date{
text-align:right;
font-weight:normal;
margin-right: 1em;
}

#archive{
width:240px;
float:none;
order:1;
flex:0 0 240px;
margin-left:0;
position:static;
}

body > .wrapper:has(> section#sub.magazine-page) > #page-top{
order:3;
flex:0 0 100%;
}

.magazine-archive-heading{
font-family:"Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
font-size:16px;
font-weight:700;
line-height:1.5;
color:#fff;
margin-bottom:10px;
}

#archive li{
background:none;
padding-left:0;
}

#magazine-archive li{
display:flex;
align-items:center;
gap:8px;
}

#magazine-archive li::before{
content:"";
flex:0 0 8px;
width:8px;
height:1.5em;
background:url(../img/ic.png) no-repeat center center;
}

#magazine-archive a{
display:inline-block;
padding:3px 0;
line-height:1.5;
}
.rt{
text-align: right;
margin-right: 1em;
}
.ct{
text-align: center;
}

* {
box-sizing:border-box;
}

img {
max-width:100%;
height:auto;
}

.wrapper {
width:calc(100% - 32px);
max-width:960px;
}

.site-logo {
display:block;
width:163px;
height:64px;
overflow:hidden;
background:url(../img/logo.png) no-repeat 0 0 / contain;
text-indent:101%;
white-space:nowrap;
}

header nav a {
display:block;
color:#fff;
font-size:14px;
font-weight:600;
line-height:1;
text-decoration:none;
}

.main-visual {
display:flex;
align-items:center;
justify-content:center;
min-height:146px;
margin:0 0 18px;
padding:28px 36px;
background-color:rgba(112,112,112,.72);
background-image:
radial-gradient(circle at 20% 15%, rgba(255,255,255,.13) 0 1px, transparent 1px),
radial-gradient(circle at 70% 45%, rgba(0,0,0,.14) 0 1px, transparent 1px),
linear-gradient(135deg, rgba(255,255,255,.08), rgba(0,0,0,.12));
background-size:7px 7px, 9px 9px, 100% 100%;
border:0;
text-align:center;
}

.main-visual {min-height:222px;padding:28px 70px 30px 245px;background:url(../img/bg-main.png) no-repeat 50% 0;background-size: contain;justify-content:flex-start;box-sizing:border-box;aspect-ratio: 479 /111;}

.main-visual p,
.page-visual p {
font-size:24px;
font-weight:600;
line-height:1.65;
font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
position: relative;
}
.page-visual {display:flex;align-items:center;justify-content:center;min-height:146px;margin: 30px auto;padding:28px 36px;background: url(../img/bg-main-page.png) no-repeat;background-size:100% 100%;border:0;text-align:center;}

.main-visual p {color:#4b2806;text-shadow: 4px 3px 3px rgb(21 21 21 / 35%);text-align:left;letter-spacing:.08em;}

.page-visual p {
color:#775229;
font-family:"Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif !important;
font-weight:700;
text-shadow:3px 3px 3px rgba(57,57,57,.51);
}

.main-visual span {
color:#b20000;
}

.image-heading {position:relative;height:auto !important;margin: 0 0 18px;padding:0;font-size:20px;font-weight:600;line-height:1.7;color:#fff;}

article h2.image-heading {display:flex;align-items:flex-end;gap:12px;padding-bottom:8px;border-bottom:0;box-sizing:border-box;}

article h2.image-heading:before {
content:"";
flex:0 0 45px;
height:66px;
background:url(../img/headnline.png) no-repeat 50% 50%;
background-size:45px 66px;
position:relative;
z-index:1;
margin-bottom:-8px;
}

article h2.image-heading:after {
content:"";
position:absolute;
left:0;
right:0;
bottom:0;
display:block;
height:1px;
background:#ffbf00;
}

article h2.image-heading {font-size:20px;line-height:1.2;}

.image-heading__text,
.image-heading__lead,
.image-heading__title {
display:block;
}

.image-heading__lead {
font-size:16px;
line-height:1.25;
}

.image-heading__title {
font-size:30px;
line-height:1.22;
}

#top-left h2.image-heading,
#top-news h2.image-heading,
section#sub h2.image-heading,
article#greeting h2.image-heading {
font-size:18px;
line-height:1.5;
font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
}

.book-txt h2.image-heading {
width:var(--heading-image-width, auto);
min-height:var(--heading-image-height, auto);
font-size:17px;
line-height:1.6;
text-shadow:0 1px 0 rgba(0,0,0,.65);
}

#nenpu_shusei .book-txt h2.image-heading { --heading-image-width:579px; --heading-image-height:128px; }
#nekomachi .book-txt h2.image-heading { --heading-image-width:615px; --heading-image-height:103px; }
#poe-watanabe .book-txt h2.image-heading { --heading-image-width:556px; --heading-image-height:103px; }
#inju .book-txt h2.image-heading { --heading-image-width:629px; --heading-image-height:134px; }
#kitan .book-txt h2.image-heading { --heading-image-width:629px; --heading-image-height:187px; }
#gensou .book-txt h2.image-heading { --heading-image-width:620px; --heading-image-height:114px; }
#onibi .book-txt h2.image-heading { --heading-image-width:629px; --heading-image-height:78px; }
#kurotokage .book-txt h2.image-heading { --heading-image-width:627px; --heading-image-height:88px; }
#sanpo .book-txt h2.image-heading { --heading-image-width:495px; --heading-image-height:57px; }
#akaki .book-txt h2.image-heading { --heading-image-width:627px; --heading-image-height:114px; }

.status-label,
.text-button {
    font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;

display:inline-block;
min-width:195px;
min-height:73px;
padding:20px 22px 16px;
border:0;
background:url(../img/btn.png) no-repeat 50% 50%;
background-size:100% 100%;
color:#ffbf00;
font-size:20px;
font-weight:600;
line-height:1.4;
text-align:center;
text-decoration:none;
}

a .text-button {
cursor:pointer;
}

input,
textarea,
select {
width:auto;
max-width:100%;
font-family:inherit;
font-size:16px;
box-sizing:border-box;
}

input[type="text"],
input[type="email"],
input[type="tel"] {
width:100%;
}

input[size="2"],
input[size="4"],
input[size="6"] {
width:auto;
}

input:not([type]),
input[type="text"],
input[type="email"],
input[type="tel"],
select {
min-height:44px;
padding:9px 10px;
line-height:1.4;
}

textarea {
min-height:140px;
padding:10px;
line-height:1.7;
}

input[type="checkbox"],
input[type="radio"] {
width:20px;
height:20px;
margin:0 6px 0 0;
vertical-align:middle;
}

input[type="submit"],
input[type="button"],
button {
min-height:44px;
padding:9px 22px;
font-size:16px;
line-height:1.4;
cursor:pointer;
}

input:focus,
textarea:focus,
select:focus {
outline:2px solid #ffbf00;
outline-offset:2px;
}

textarea {
width:100%;
}

@media screen and (max-width: 900px) {
header {height: 140px;padding:14px 0 16px;background-size: cover;}

header h1,
header nav {
float:none;
margin:0;
text-align:center;
}

header h1 a {
display:inline-block;
}

header nav ul {
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:12px 18px;
margin-top:14px;
}

header li {
float:none;
margin-left:0;
}

header nav a {
text-align:center;
}

#top-left,
#top-news,
.book-txt,
.f-left,
#sub.magazine-page,
#sub.magazine-page article,
#archive {width:100%;}

body > .wrapper:has(> section#sub.magazine-page){
display:flex;
flex-direction:column;
gap:0;
}

body > .wrapper:has(> section#sub.magazine-page) > .page-visual{
order:0;
}

section#sub.magazine-page{
order:1;
flex:0 0 auto;
}

#archive{
order:2;
flex:0 0 auto;
margin-left:0;
}

#page-top{
order:3;
}

.top-news-wrapper {
display:flex;
flex-direction:column;
gap:18px;
}

.top-news-wrapper #top-left {padding-left:0;margin-bottom:24px;min-width: 100%;width: 100%;max-width: 100%;}

.top-news-wrapper #top-news {height:auto;width: 100%;flex:0 0 auto;padding:22px;/* background-color:rgba(112,112,112,.72); *//* background-image:
radial-gradient(circle at 20% 15%, rgba(255,255,255,.13) 0 1px, transparent 1px),
radial-gradient(circle at 70% 45%, rgba(0,0,0,.14) 0 1px, transparent 1px),
linear-gradient(135deg, rgba(255,255,255,.08), rgba(0,0,0,.12)); */background-size:7px 7px, 9px 9px, 100% 100%;}

#top-news:before,
#top-news:after {display:block;width:72px;height:131px;background-size:72px 131px;}

#top-news:before {
top:-8px;
left:-12px;
}

#top-news:after {right: -15px;bottom: -14px;}

#top-news h2 {
padding:0;
}

#sc {
width:100%;
height:auto;
max-height:180px;
margin-left:0;
}

#top-news dl {
padding:0;
}

#top-news dt,
#top-news dd {
float:none;
width:auto;
}

#top-news dd {
margin-bottom:12px;
}


.f-left {
display:table;
width:auto;
max-width:100%;
margin:0 auto 24px;
}

.book-wrapper {
flex-direction:column;
align-items:center;
gap:18px;
}

.book-wrapper .f-left {
display:block;
width:auto;
max-width:100%;
margin:0 auto;
}

.book-wrapper .book-txt {
width:100%;
}

.f-left li {
max-width:300px;
}

hr {
width:100%;
}

.order{
    width:100%;
    margin: 10px auto;
    display: block;
    text-align: center;
}
section#sub {
display:block;
width:100%;
padding-left:0;
}

dl.info-grid {
display:block !important;
}

dl.info-grid dt,
dl.info-grid dd {
display:block !important;
width:100%;
}

table.info-grid,
table#contact,
table#order {
width:100%;
}

.info-grid th,
.info-grid td,
#contact th,
#contact td,
#order th,
#order td {
display:block;
width:100%;
padding:5px 0 10px;
}

.info-grid dt,
.info-grid th {
border-bottom:0;
padding:5px 0 0 0;
}

#magazine,
#magazine_s {width:100%;padding: 20px 22px 14px 150px;background: url(../img/magazinebg.png) no-repeat 0 0;aspect-ratio:  9 / 2;}

.lightbox {
box-sizing:border-box;
padding:0 12px;
}

.lb-outerContainer,
.lb-dataContainer {
box-sizing:border-box;
max-width:calc(100vw - 24px) !important;
}

.lightbox .lb-image {
box-sizing:border-box;
max-width:calc(100vw - 40px) !important;
max-height:calc(100vh - 130px) !important;
width:auto !important;
height:auto !important;
}

@media screen and (max-width:520px) {
.lightbox {
padding:0 8px;
}

.lb-outerContainer,
.lb-dataContainer {
max-width:calc(100vw - 16px) !important;
}

.lightbox .lb-image {
max-width:calc(100vw - 32px) !important;
max-height:calc(100vh - 120px) !important;
}
}

#magazine aside,
#magazine_s aside {
padding-left:0;
color:#e5e0c8;
}

#archive {
margin:30px 0 0;
position:static;
float:none;
width:100%;
}

#magazine-archive a{
display:block;
padding:8px 0;
line-height:1.6;
}
}

@media screen and (max-width: 768px) {
body {
font-size:16px;
}

.wrapper {
width:100%;
padding:0 20px;
}

.site-logo {width:122px;height:48px;display: block;margin: 0 auto;}

header nav ul {
gap:10px 14px;
}

.main-visual {
min-height:120px;
padding:22px 18px;
}

.main-visual::after{
    content: "";
    position: absolute;
    top: 4vw;
    right: 4vw;
    background: url(../img/main_rampousha_logo.png);
    width: 21vw;
    background-size: contain;
    height: auto;
    aspect-ratio: 1 / 1;
}

.main-visual {
    min-height:222px;padding: 10px 30px;
    background-image: url(../img/bg-main-sp.png);
    background-size: cover;
    aspect-ratio: 257 / 157;
    position: relative;
}

.main-visual p,
.page-visual p {
    font-size: 5vw;
    line-height:1.75;
    text-align:left;
    }

.main-visual p {
font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
text-align:left;
padding-left:0;
letter-spacing:0;
}

.image-heading__lead {
font-size:14px;
}

.image-heading__title {
font-size:22px;
}

article h2.image-heading:before {
flex-basis:30px;
height:44px;
background-size:30px 44px;
}

.book-txt h2.image-heading {
font-size:17px;
width:auto;
min-height:0;
}


.pics li,
.kurotokage li {
float:none;
margin-right:0;
}

[class~="pics"].gallery01,
[class~="pics"].gallery02,
.gallery03,
[id^="gallery_"] {
display:flex;
flex-wrap:wrap;
gap:12px;
}

[class~="pics"].gallery01 > li,
[class~="pics"].gallery02 > li,
.gallery03 > li,
[id^="gallery_"] li {
box-sizing:border-box;
flex:0 0 calc(50% - 6px);
height:auto;
margin:0;
}

[class~="pics"].gallery01 img,
[class~="pics"].gallery02 img,
.gallery03 img,
[id^="gallery_"] img {
display:block;
width:100%;
height:auto;
}
footer {
height:auto;
padding-bottom:20px;
}
footer .wrapper{
    display: flex;
    flex-direction: column;
}
#magazine,
#magazine_s {padding:30px 22px 24px;background-image:url(../img/magazinebg-sp.png);background-size: cover;height: 340px;aspect-ratio: 710 / 799;}

.magazine-headline{font-size:22px;line-height:1.4;display: flex;flex-direction: column;align-content: space-around;align-items: flex-start;}

.magazine-headline .magazine-date{font-size:13px;margin-left: auto;display: block;}

}

#top-news,
.f-left img,
.pics li,
.kurotokage li {background-color:rgba(106,106,106,.72);background-size:100% 100%;}