@charset "Shift_JIS";
/* 個人出版 詳細　『前世で聖女様の兄だった僕が騎士団長様の最愛になるまで』 */
a { color: var(--color-p2026-01); }
a:hover { border-color: var(--color-p2026-01);  }
.BuyButton { width: 50%; margin: 100px auto; }
.PasscodeButton { width: 50%; margin: 30px auto; border-color: var(--color-p2026-01); }
.PasscodeButton:hover { color: #ffffff; background-color: var(--color-p2026-01); }


.top-contents { position: relative; }
.top-contents img { width: 100%; height: auto; }
.top-text1 { position: absolute; top: 7%; left: 10%; color: #ffffff; font-size: 1.5rem;
    text-shadow: 0px 0px 10px #ffac00, 1px 1px 10px #ffac00, -1px 1px 10px #ffac00, 1px -1px 10px #ffac00, -1px -1px 10px #ffac00; }
.top-text2 { position: absolute; top: 40%; right: 35%; color: #6e3f00; font-size: 1.25rem;
    text-shadow: 1px 1px 0px #ffffff, -1px 1px 0px #ffffff, 1px -1px 0px #ffffff, -1px -1px 0px #ffffff; }
.top-text2 span { color: #ffffff; font-size: 1.5rem; margin: 0px 5px;
    text-shadow: 0px 0px 10px #6e3f00, 1px 1px 10px #6e3f00, -1px 1px 10px #6e3f00, 1px -1px 10px #6e3f00, -1px -1px 10px #6e3f00,
        0px 1px 10px #6e3f00, 1px 0px 10px #6e3f00, -1px 0px 10px #6e3f00, 0px -1px 10px #6e3f00, -1px -1px 10px #6e3f00; }
.top-text3 { position: absolute; bottom: 25%; left: 10%; color: #ffffff; font-size: 4rem;
    text-shadow: 0px 0px 20px #00beff, 1px 1px 20px #00beff, -1px 1px 20px #00beff, 1px -1px 20px #00beff, -1px -1px 20px #00beff,
        0px 1px 20px #00beff, 1px 0px 20px #00beff, -1px 0px 20px #00beff, 0px -1px 20px #00beff, 0px 0px 20px #00beff; }
.top-text4 { position: absolute; bottom: 10%; right: 30%; color: #ffffff; font-size: 3rem;
    text-shadow: 0px 0px 10px #ff89b6, 1px 1px 10px #ff89b6, -1px 1px 10px #ff89b6, 1px -1px 10px #ff89b6, -1px -1px 10px #ff89b6,
        0px 1px 10px #ff89b6, 1px 0px 10px #ff89b6, -1px 0px 10px #ff89b6, 0px -1px 10px #ff89b6, -1px -1px 10px #ff89b6; }

.BookInformationOutlineText { display: grid; grid-template-columns: 35% 1fr; column-gap: 1em; margin-top: 30px; }
.title-text { font-size: 1.5rem; text-align: center; margin-top: 100px; }
.title-text span { background: radial-gradient(var(--color-p2026-01-sub), transparent 75%); }

.outline-title { color: var(--color-p2026-01); font-weight: bold; font-size: 1.25rem; margin: 10px 0px; }

.BookInformationOutlineText .BuyButton { width: 80%; margin: 50px auto 30px; }

.BookInformationTable { width: 80%; margin: 50px auto 0px; }
.BookInformationTable td { border-color: var(--color-p2026-01-sub); }

.BookSample { border: 2px solid var(--color-p2026-01-sub); }
.BookSampleTitle { border: 2px solid var(--color-p2026-01-sub); padding: 10px; margin: 50px; }
.novel-box { padding: 30px 80px 50px; }





/* ---------------------------------------------------------------------------------------------------- */
/* スマホ対応用 */
@media (max-width: 480px) { 
    .top-text1 { top: 5%; left: 3%; color: #000000; font-size: 1rem;
        text-shadow: 1px 1px 0px #ffffff, -1px 1px 0px #ffffff, 1px -1px 0px #ffffff, -1px -1px 0px #ffffff; }
    .top-text2 { top: 30%; right: 5%; color: #000000; font-size: 1rem; }
    .top-text2 span { color: #000000; font-size: 1rem; margin: 0px;
        text-shadow: 1px 1px 0px #ffffff, -1px 1px 0px #ffffff, 1px -1px 0px #ffffff, -1px -1px 0px #ffffff; }
    .top-text3 { bottom: 30%; left: 10%; font-size: 3rem; }
    .top-text4 { bottom: 15%; right: 15%; font-size: 2rem; }
    
    .BookInformationOutlineText { display: inline; }
    .title-text { background: radial-gradient(var(--color-p2026-01-sub), transparent 75%);
        font-size: 1.25rem; padding: 10px 0px; margin: 50px 0px 10px; }
    .title-text span { background: none; }
    .outline-title { margin: 20px 0px 5px; }
    
    .BookInformationTable { width: auto; margin: 100px 10px; }
    
    .BookSample { padding: 10px; }
    .BookSampleTitle { margin: 30px 10px 20px; }
    .novel-box { padding: 20px 10px 50px; }
    
    .Footer { margin-top: 50px; }
}
/* ---------------------------------------------------------------------------------------------------- */