@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=IM+Fell+English&family=Metal&family=Noto+Serif+JP&family=Tangerine:wght@700&family=Zen+Antique+Soft&display=swap');

/*********************************************************************
°ʚ(*´꒳`*)ɞ°. ユーザー設定用CSS
----------------------------------------------------------------------
※「templates/header.html」23行目付近のコメントアウトを外すと有効になります。
----------------------------------------------------------------------
 0.0 非表示 
 1.0 背景・フォント
 2.0 横幅
 3.0 カスタマイズ
 4.0 スペース
 5.0 ヘッダー
 6.0 ホーム
 7.0 フッター
 8.0 エントリー
 9.0 ページ
 10.0 Comics
 11.0 レスポンシブ
*********************************************************************/

/*********************************************************************
	0.0 非表示
*********************************************************************/

/********* 0.1 一時的非表示 *********/
#page {
           display: none; /* Illustration用ページネーション。2０件以上になったら削除 */
}

/********* 0.2 常時非表示 *********/

#show-searchbox, .entry-view-image, .page-link, .page-id, .post-item ul.post-date li.fa-user-circle, .meta ul.post-date li.fa-user-circle {
           display: none;
}



/*********************************************************************
	1.0 背景・フォント
*********************************************************************/

/********* 1.1 全体 *********/
body {
	background-color: #FFF;
	color: #494848;
	font-family: 'Noto Serif JP',"Yu Mincho","YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", serif;
	font-size: 16px;
        line-height: 1.4;
}
#header,
#container,#footer {
        cursor: crosshair;
}

/********* 1.2 フォント指定 *********/
h1,h2 {
          font-family: 'Zen Antique Soft', "Yu Mincho","YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", serif;
          font-weight: normal;
}
#entry_link a, #nav-page, .order li, .direct li, .post-item .item-title, .post-item ul.relate-entries a {
        font-family: 'Zen Antique Soft', serif;
}
h3 {
          display:inline-block;
          padding: 10px 0 8px 0;
          color:#aaa;
          width: 100%;
          text-align: center;
          margin-top: 30px;
          margin-bottom: 30px;
          font-size: 1.6em;
          font-weight: normal;
          font-family:'Zen Antique Soft', serif;
          box-shadow: 0px 0px 5px 1px #ddd;
          border-radius: 20px;
}

#content #entry .entry .content p {
	font-size: 16px;
        line-height: 1.5;
        line-break: strict;
}

.icon-butterfly {
  display: inline-block;
  width: 1em;
  height: 1em;
  background: url("https://glass.moo.jp/tsuki/images/icon/butterfly.svg") no-repeat center / contain;
}
.icon-snowflake {
  display: inline-block;
  width: 1em;
  height: 1em;
  background: url("https://glass.moo.jp/tsuki/images/icon/snowflake.svg") no-repeat center / contain;
}


/********* 1.3 スクロールバー *********/

::-webkit-scrollbar {
          width: 15px;
}

::-webkit-scrollbar-track {
          background-color: #fff;
          border-radius: 6px;
}

::-webkit-scrollbar-thumb {
          background: linear-gradient(to bottom, #908dc4, #bbccd4);
          background: -webkit-linear-gradient(to bottom, #908dc4, #bbccd4);
          border-radius: 6px;
}

/********* 1.4 範囲選択 *********/

::selection {
          color: #fff; /* 選択したテキストの文字色 */
          background-color: #908dc4; /* 選択したテキストの背景色 */
}

/* Firefox用のスタイルも追加 */
::-moz-selection {
          color: #fff;
          background-color: #908dc4;
}

/* 日付などの英数字用フォント */
.alphanumeric {
	font-family:  'Noto Serif JP', serif;
}

/********* 1.5 センタリング指定 *********/

.center {
        text-align: center;
}



/*********************************************************************
	2.0 横幅
*********************************************************************/

/********* 2.1 全体 *********/

#header,
#container,
.nav-gallery,
.footer-content {
	width: 80%;
	max-width: 700px;
}

/********* 2.2 ギャラリー *********/

#gallery {
	width: 95%;
	max-width: 1600px;
}



/*********************************************************************
	3.0 カスタマイズ
*********************************************************************/
* { 
        tap-highlight-color: rgba(0, 0, 0, 0);
        -webkit-tap-highlight-color: rgba(0,0,0,0);
}


a {
         display: inline-block;
         text-shadow: 0 0 4px rgba(199,198,225,0.5);
}

a:hover {
         -webkit-animation: zoom 0.3s;
         animation: zoom 0.3s;
         opacity: 0.5;
}

@-webkit-keyframes zoom {
  50% {
    -webkit-transform: scale(1.05);
  }
}

@keyframes zoom {
  50% {
    transform: scale(1.05);
  }
}

.effect-fade {
    animation-name: fadein;
    animation-duration: 2s;
}
@keyframes fadein {
    from{
    opacity: 0;
    transform: translatesy(20px);
    }
    to{
    opacity: 1;
    transform: translatey(0);
    }
}

.special-effect {
animation: SlideIn 1.6s;
}
@keyframes SlideIn {
0% {    opacity: 0;    transform: translateY(-64px);
}
100% {
opacity: 1;    transform: translateY(0);
}
}
.vegas-wrapper {
           margin-top: 30px;
}
#vegas {
           position: relative;
           width: 100%; 
           padding-top: 70.3125%; 
           margin: 0 auto;
           overflow: hidden;
           border-radius: 10px;
}

/********* 3.1 Spotlight *********/

#spotlight {
        background: linear-gradient(322deg, #908dc4, #ccd4d4);
        background-size: 400% 400%;
        -webkit-animation: AnimationName 6s ease infinite;
        -moz-animation: AnimationName 6s ease infinite;
        -o-animation: AnimationName 6s ease infinite;
        animation: AnimationName 6s ease infinite;
}
@-webkit-keyframes AnimationName {
        0%{background-position:1% 0%}
        50%{background-position:99% 100%}
        100%{background-position:1% 0%}
}
@-moz-keyframes AnimationName {
        0%{background-position:1% 0%}
        50%{background-position:99% 100%}
        100%{background-position:1% 0%}
}
@-o-keyframes AnimationName {
        0%{background-position:1% 0%}
        50%{background-position:99% 100%}
        100%{background-position:1% 0%}
}
@keyframes AnimationName {
        0%{background-position:1% 0%}
        50%{background-position:99% 100%}
        100%{background-position:1% 0%}
}
.spotlight {
         text-align: center;
         margin-bottom: 10px;
         font-family: 'Zen Antique Soft', serif;
}
.spotlight img {
         box-shadow: 0px 0px 7px #908dc4;
}

.entry .content p img {
        display: block;
        text-align: center;
        margin: 0 auto;
}

.spl-title, .spl-description,.spl-button, .spl-header {
         font-family: 'Zen Antique Soft', serif;
}
#spotlight .spl-footer {
    transition: transform 0.35s ease !important; /* ヘッダー/矢印と同じスライド速度 */
    /* opacityも追加でフェード効果（任意、0.35sで同期） */
    transition: transform 0.35s ease, opacity 0.35s ease !important;
}

/* Spotlight Custom: autohideをフッターにも適用（ホバー無効化） */
#spotlight .spl-footer:hover {
    transform: translateY(100%) !important; /* ホバー時も非表示を強制（デフォルト位置に戻す） */
}

#spotlight:not(.menu) .spl-footer {
    transform: translateY(100%) !important; /* menuクラスなし時は常に非表示 */
    opacity: 0 !important; /* 追加でフェード効果（任意） */
}

#spotlight.menu .spl-footer {
    transform: translateY(0) !important; /* menuクラスあり時だけ表示 */
    opacity: 1 !important;
}

.slide-in-illust.slidein.is-animated {
  animation: slideIn 1s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

@keyframes slideIn {
  0% {
    transform: translateY(180px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
  }
  40%,100% {
    opacity: 1;
  }
}

/*********************************************************************
	4.0 スペース
*********************************************************************/
.space-comic-1 {
           display: block;
           margin-top: -25px;
}
.space-comic-2 {
           display: block;
           margin-top: -20px;
}
.space-comic-3 {
           display: block;
           margin-top: 40px;
}
.space-comic-4 {
           display: block;
           margin-top: -10px;
}
.space-comic-5 {
           display: block;
           margin-top: 0;
}
.space-comic-6 {
           display: block;
           margin-bottom: 30px;
}
.space-comic-7 {
           display: block;
           margin-top: 0px;
}
.space-comic-8 {
           display: block;
           margin-top: -25px;
}



/*********************************************************************
	5.0 ヘッダー
*********************************************************************/

#header {
	vertical-align: middle;
        align-items: center;
        text-align: center;
        padding: 30px 0 0;
}

/********* 5.1 メニューアイコン *********/

#menu li a {
        font-family: 'Metal', serif;
        font-size: 1.4rem;
}
#menu-toggle-label span {
	height: 1px; /* 太さ（～3px程度推奨） */
	background-color: #404146; /* 色 */
}

/********* 5.2 サイト名 *********/

#header .site-title a  img {
        max-width: 320px;  /* PCでの幅 */
        height: auto;      /* アスペクト比を維持 */
}

/********* 5.3 サイト説明 *********/

#header p {
	color: #ccd4d4;
	font-family: 'IM Fell English',Consolas, Courier, "Open Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", "Yu Gothic", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
	text-align: center;
}



/*********************************************************************
	6.0 ホーム
*********************************************************************/

/********* 6.1 更新履歴 *********/

.entry .entry-list-content {
         padding: 0 0 10px 0;
}
.entry-list-content .page-title {
        margin: 0 0 20px 0;
}
ul.entry-list {
        padding-top: 20px;
}
.entry .content .entry-list li {
	margin: 0;
	padding: 15px;
	border-bottom: 1px dotted #DDD;
	color: #808080;
        list-style: none;
}
.entry .content ul.entry-list li:first-child {
        padding-top: 5px; 
}

.entry .content .entry-list li a {
        margin-top: 2px;
        text-decoration: none;
        font-size:1.1em;
        font-family: 'Zen Antique Soft', serif;
}

.entry .content .entry-list li a::before{
        content: '\f004';
        font-weight: 900;
        font-family: 'Font Awesome 5 Free';
        margin-right: 5px;
        text-shadow:none;
        background: linear-gradient(to right, #ccd4d4 0%, #908dc4 70%); 
        background: -webkit-linear-gradient(to right, #ccd4d4 0%, #908dc4 70%);
        color: transparent;
        background-clip: text;
        -webkit-background-clip: text;
}
.entry .content .entry-more li{
	 margin: 0;
	 color: #808080;
         list-style: none;
         text-align: right;
}
.entry .content .entry-more li a{
         text-decoration: none;
         padding: 10px 4px 4px 12px;
         background-color: #f2f2f2;
         border-radius: 5px;
         color: #aaa;
         font-family:  'Tangerine', serif;
         font-size: 1.4em;
}
.entry .content .entry-more li a::after {
         content:"〉";
         padding-left: 16px;
         color: #bbb;
}
.entry-list-size {
         max-width: 500px;
         margin:0 auto;
         margin-top: 40px;
         padding-bottom: 20px;
         border: none;
         box-shadow: none;
}
.entry-list-size-wrapper {
         border: 1px solid #eee;
         background-color: #FFF;
         box-shadow: 0px 0px 5px 1px #ddd;
         margin-top: 30px;
}

/********* 6.2 検索結果 *********/

.page-result {
	margin: 20px 0 0 0;
	padding: 10px 0;
        border-bottom: 1px solid #ddd;
	background-color: #fff;
	color: #808080;
	font-size: 110%;
	text-align: center;
}
.result {
	margin: 30px 0;
	padding: 10px 0;
        border-radius: 20px;
        border-style:none;
        box-shadow: 0px 0px 5px 1px #ddd;
	background-color: #fff;
	color: #808080;
	font-size: 110%;
	text-align: center;
}
#main .page-excerpt a {
	display: block;
        padding: 20px 11px;
	border-bottom: 1px dotted #ddd;
	color: #606060;
}
#main .page-excerpt:last-child a {
	border-bottom-color: transparent;
}
#main .page-excerpt a:hover {
	background-color: #FAFAFA;
}
#main .page-excerpt .page-excerpt-title {
	margin: 0;
	padding: 0;
	border: none;
	color: #908dc4;
	font-size: 120%;
	text-decoration: underline;
}
#main .page-excerpt p {
	margin: 0;
        padding: 2px;
	font-size: 94%;
}
#main .page-excerpt p.page-url {
	color: #6D9285;
}

/*********************************************************************
	7.0 フッター
*********************************************************************/

/********* 7.1 著作権表示 *********/

#footer .copyright {
	font-family: 'IM Fell English',"Yu Mincho","YuMincho", " Sans", serif;
        color:#fff;
}

#footer .footer-content .footer-item .category-list,
#footer .footer-content .footer-item .tag-list, 
#footer .footer-content .footer-item .archives-list, 
#footer .footer-content .footer-item .feed-list {
          margin-bottom: 30px;
}
#footer {
          margin: 30px 0 0;
          padding: 30px 0 0;
}


#footer .footer-content .footer-item .category li {
          display: inline-block;
          padding: 9px 6px 9px 9px;
          border-radius: 3px;
          background-color: rgba(144,141,196,0.3);
          color:#fff;
          transition: background-color 0.3s ease;
}

.category li:hover {
          -webkit-animation: zoom 0.3s;
         animation: zoom 0.3s;
         opacity: 0.5;
}

#footer .footer-content .footer-item .category-list li,
#footer .footer-content .footer-item .feed-list li {
          list-style: none;
          display: inline-block;
}

#footer .footer-content .footer-item .feed-list li a {
          padding: 8px;
          border-radius: 3px;
          border: 1px solid #fff;
          color:#fff;
}

#footer .footer-content .footer-item .category-list ul,
#footer .footer-content .footer-item .tag-list ul,
#footer .footer-content .footer-item .archives-list ul,
#footer .footer-content .footer-item .feed-list ul {
           margin: 0 10px;
}

#footer .footer-content .footer-item .archives-list li a{
          padding: 5px;
}

#footer .footer-content .footer-item .tagcloud li a{
          display: inline-block;
          padding: 8px;
          border-radius: 3px;
          border: 1px solid #fff;
          color:#fff;
}

#footer .footer-content .footer-item-title{
          line-height: 1;
          vertical-align: middle;
          padding: 10px;
          background: linear-gradient(to right, #908dc4, #bbccd4);
          background: -webkit-linear-gradient(to right, #908dc4, #bbccd4);
          color:#fff;
          font-size: 1.3rem;
          font-weight: normal;
          font-family:'Metal', serif;
          border-radius: 20px;
}
.footer-item-title::before {
          display: inline-block;
          line-height: 1;
          vertical-align: middle;
          content: '\f004';
          color: rgba(255,255,255,0.3);
          font-family: 'Font Awesome 5 Free';
          font-size: 1rem;
          margin-right: 7px;
          font-weight: 900;
    }
.copyright {
          white-space: pre-line;
          line-height: 1.5;
          padding-bottom: 30px;
}
.footer-content ~ .copyright:before {
         margin: 0 auto;
}



/*********************************************************************
	8.0 エントリー
*********************************************************************/

.entry {
         padding-bottom: 30px;
}

/********* 8.1 記事リスト *********/

.entry-date {
          font-size: 16px;
         padding-bottom: 10px;
}
.entry .content {
          word-wrap: break-word; 
          overflow-wrap: break-word; 
          word-break: break-word; 
          white-space: normal;
}
.entry .content a {
          color:  #908dc4;
          text-decoration: underline;
          transition: all 0.6s ease;
}
.entry .content h2.entry-title a,
.entry .content .entry-file a,
.entry .content p.text-continue a,
.entry .content .entry-file, .entry .content .page-file-name a,
.entry .content .entry-file-name a {
         text-decoration:none;
}

/********* 8.2 記事タイトル *********/
.entry a.category {
          display: block;
          text-decoration: none;
          text-align: left;
          color: #fff;
          margin: 15px 0 -10px 0;
          max-width: 200px;
          padding-left:15px;
          background: linear-gradient(to right, #908dc4, #bbccd4);
          background: -webkit-linear-gradient(to right, #908dc4, #bbccd4);
          position: relative;
          height: 30px;
          line-height: 30px;
          box-sizing: border-box;
          font-family:  'Metal', serif;
          font-size: 1.3em;
}
.entry a.category:after {
          position: absolute;
          content: '';
          width: 0px;
          height: 0px;
          z-index: 1;
}

.entry a.category:after {
          top: 0;
          right: 0;
          border-width: 15px 7.5px 15px 0;
          border-color: transparent #fff transparent transparent;
          border-style: solid;
}

.entry .content .admin-edit li {
          list-style: none;
          text-align: right;
}
.entry-summary {
          background: linear-gradient(to bottom, #808080, #fff);
          background: -webkit-linear-gradient(to bottom, #808080, #fff);
          color: #808080;
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
}
#nav-page {
          margin: -10px 0;
}
#nav-page ul li.current {
          color: #d5d5d5;
}
#nav-page ul li a {
          color: #808080;
}

/********* 8.3 記事キャプション *********/

p.result, p.icon, p.fa-folder-open-o {
          color:#999;
}

.post-item .fa-chain {
           display:none;
}

.meta, .post-item {
           border: none;
           text-decoration: none;
           margin-bottom: 40px;
}

.post-item ul.post-date li a {
           text-decoration: none;
           border: none;
}

/********* 8.4 追記ボタン *********/

p.text-continue {
        display: inline-block;
	margin: 40px 0 15px;
      	font-size: 12px;
	text-align: center;
	letter-spacing: 1px;
}
p.text-continue + .share {
	margin-top: 20px;
}
#content #entry .entry .content p.text-continue a {
        width: 120px;
	margin: 0 auto;
	padding: 15px;
        color:#222;
	border: none;
	border-radius: 5px;
        border: 1px solid #222;
}

/********* 8.5 View More *********/

.view-more-content {
          text-align: right;
          margin-top: 20px;
}
.entry .content .view-more-content a.view-more {
          text-decoration:none;
          padding: 10px 1px 7px 12px;
          background-color: #f2f2f2;
          border-radius: 5px;
          color: #aaa;
          font-family:  'Tangerine', serif;
          font-size: 1.4em;
}
.entry .content .view-more-content a.view-more::after {
          content:"〉";
          padding-left: 16px;
          color: #bbb;
}

/********* 8.6 フィルターボタン *********/

.entry .content .right a {
         text-decoration:none;
         margin-bottom: 10px;
         padding: 10px 20px;
         border-radius: 5px;
         border: 1px solid #908dc4;
         font-size:12.4px;
}
.entry .content .right {
         text-align: right;
         margin: 20px 0;
}

#content #entry .entry .content h4 {
          margin-top: 1.5rem;
          padding: 10px;
          background-color: rgba(144,141,196,0.7);
          color: #fff;
          font-size: 1.2rem;
          font-weight: normal;
          font-family:'Zen Antique Soft', serif;
          border-radius: 5px;
}
#content #entry .entry .content h4::before {
          content: '\f004';
          font-family: 'Font Awesome 5 Free';
          margin-right: 7px;
          font-weight: 900;
    }



/*********************************************************************
	9.0 ページ
*********************************************************************/
/********* 9.1ページタイトル *********/

.entry .page-content {
margin-top: 0;
padding-top: 20px;
}

.entry .page-content h2 {
font-size: 1.3rem;
padding-top: 30px;
}

.entry-title {
        background: linear-gradient(to bottom, #908dc4, #ccd4d4);
        background: -webkit-linear-gradient(to bottom, #908dc4, #ccd4d4);
        color: transparent;
        background-clip: text;
        -webkit-background-clip: text;
	font-size: 1.4rem;
        margin-top: 5px;
}
.entry .content h2.entry-title a {
       background: linear-gradient(to bottom, #908dc4, #ccd4d4);
       background: -webkit-linear-gradient(to bottom, #908dc4, #ccd4d4);
       color: transparent;
       -webkit-background-clip: text;
       transition: all 0.3s ease;
       font-family: 'Zen Antique Soft', serif;
       font-weight: normal;
}
.page-title {
	position: relative;
	padding-top: 60px;
        margin-top: 15px;
        margin-bottom:20px;
	font-size: 1.2em;
        font-weight: normal;
        color: #908dc4;
        text-align: center;
        text-shadow: 0 0 2px rgba(199,198,225,0.5);
        overflow: hidden;
}
.page-title span {
	position: relative;
	z-index: 2;
}
.page-title::before {
	content: attr(data-en);
	position: absolute;
	top: 50%;
	left: 50%;
        background: linear-gradient(to bottom,  #ccd4d4 0%, #908dc4 70%); 
        background: -webkit-linear-gradient(to bottom,  #ccd4d4 0%, #908dc4 70%);
        color: transparent;
        background-clip: text;
        -webkit-background-clip: text;
        font-size: 2.5em;
	font-weight: 400;
        font-family:  'Tangerine', serif;
	font-style: italic;
        transform: translate(-50%, -50%) ;
        white-space: nowrap;
        padding: 0 0.2em;
}
.page-title-gallery {
	padding-top: 60px;
        margin-bottom:30px;
}

/********* 9.2 Illustration / Gallery *********/
 
.img-title-wrapper {
         position: relative;
         overflow: hidden;
         border-radius: 5px;
         box-shadow: 0px 0px 7px #908dc4;
}
.img-title-wrapper .img-caption {
         position: absolute;
         bottom: 0;
         left: 0;
         width: 100%;
         text-align: center;
          background-color: rgba(144,141,196,0.7);
          color:#fff;
         padding: 4px 0;
}
#page {
         padding: 10px;
         margin-bottom: 0;
         text-align: center; /* 中央寄せ */
}

.order, .direct {
         list-style: none; /* 箇条書きスタイルを削除 */
         padding: 0; /* パディングを削除 */
         margin: 0; /* マージンを削除 */
         color: #d5d5d5;
}

.order li, .direct li {
         display: inline-block;
         margin-left: 15px; /* 任意のマージンを指定 */
}

.order li a, .direct li a {
         color: #808080;
}

.order li a:hover, .direct li a:hover {
         color: #c0c0c0;
}

.order li:last-child, .direct li:last-child,
 .page-number li:last-child {
         margin-right: 0; /* 最後の要素のマージンを削除 */
}

#page .order li:not(:last-child), #page .direct li:not(:last-child) {
         margin-left: 15px; /* 任意のマージンを指定 */
}
 .number-space {
         display: inline-block;
         margin:15px; /* 任意のマージンを指定 */
}

.grid {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 15px;
        margin: 0;
        padding: 0;
}

.grid-img {
        overflow: hidden;
        aspect-ratio: 1 / 1.4142;
        border-radius: 5px;
        box-shadow: 0px 0px 7px #908dc4;
}
#media img {
	width: 100%;
	height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
}
#content #entry .entry .content img {
        margin-bottom:-10px;
        border-radius: 5px;
}

.grid a {
	width: 100%;
	height: 100%;
        display: block;
        margin-bottom: 1rem;
}

#media a.spotlight img {
    border-radius: 3px;
}



/*********************************************************************
	10.0 Comics 
*********************************************************************/
.page-contents-title {
	color: #aaa;
	text-align: center;
        font-size: 1.2rem;
}

#comics .comics-title {
          display:inline-block;
          padding: 10px 0 8px 0;
          color:#aaa;
          width: 100%;
          text-align: center;
          margin-top: 35px;
          margin-bottom: 20px;
          font-size: 1.3rem;
          font-weight: normal;
          font-family:'Zen Antique Soft', serif;
          box-shadow: 0px 0px 5px 1px #ddd;
          border-radius: 20px;
          overflow: hidden;
}

#comics .comics-top-title {
          display:inline-block;
          padding: 10px 0 8px 0;
          width: 100%;
          text-align: center;
          margin-top: 35px;
          margin-bottom: 20px;
          font-size: 1.3rem;
          font-weight: normal;
          font-family:'Zen Antique Soft', serif;
          box-shadow: 0px 0px 5px 1px rgba(144,141,196,0.5);
          border-radius: 20px;
          overflow: hidden;
}
ul.relate-entries {
          font-size: 1.1rem;
}
ul.relate-entries li a::before{
        content: '\f004';
        font-weight: 900;
        font-family: 'Font Awesome 5 Free';
        margin-right: 7px;
}

#comics {
         margin: 0 0 60px;
         padding: 0;
}
#comics ul {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 15px;
        margin: 0;
        padding: 0;
}

#comics li {
        list-style: none;
}

#comics img {
	width: 100%;
	height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
}

#comics .grid-comic li a img {
        overflow: hidden;
        border-radius: 5px;
        box-shadow: 0px 0px 7px #908dc4;
}

.comics-page-title {
         margin-bottom: -20px;
}

dl.entry-option {
	margin: 20px 0;
	border: 1px solid #c7c6e1;
	border-radius: 5px;
        background-color :#e3e2f0;
}

dl.entry-option dt {
	padding: 0 15px;
	border-top: 1px solid #c7c6e1;
	color: #908dc4;
        font-family: 'Zen Antique Soft', serif;
        font-size: 1.2em;
}

dl.entry-option dt:first-child {
	border: none;
}

dl.entry-option dd {
	margin: 0;
	padding: 4px 16px;
        font-family: 'Zen Antique Soft', serif;
	border-top: 1px dotted #c7c6e1;
}

.offline-next::before {
          margin-right: 5px;
          content: '\f0a1';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}

.offline-event::before {
          margin-right: 5px;
          content: '\f073';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}

.offline-newbooks::before {
          margin-right: 7px;
          content: '\e0bb';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}

.offline-backnumber::before {
          margin-right: 7px;
          content: '\f02d';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}
.offline-goods::before {
          margin-right: 5px;
          content: '\f86d';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}

.comics-serialized::before {
          margin-right: 5px;
          content: '\f56b';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}

.comics-completed::before {
          margin-right: 5px;
          content: '\f02d';
          font-family: 'Font Awesome 5 Free';
          font-weight: 700;
}

.comics-serialized,.comics-completed {
         font-size: 1.3rem;
}

#comic-pager ul {
         display: flex;
}

#comic-pager ul li.middle {
         margin: 0 auto;
         padding: 0;
}



/*********************************************************************
	11.0 レスポンシブ
*********************************************************************/
@media only screen and (max-width: 768px) {
	body {
		font-size: 14px; /* スマホの文字サイズ */
                line-height: 1.5;
	}
       #header, #container, .nav-gallery, .footer-content {
	width: 91%;
        }
        #menu {
		background-color: transparent; /* 背景色 */
	}
        #header {
                padding: 60px 0 0;
        }
        #header p {
                padding: 0 0 10px;
        }
        #container {
        padding-bottom: 10px;
}
        .entry {
        margin: 0 0 20px 0;
        padding-bottom: 1rem;
        }
    .entry .content {
        padding: 30px 30px 25px;
    }
        #content #entry .entry .content p {
	        font-size: 15px;
                line-height: 1.4;
                line-break: strict;
        }
	
        #header .site-title a  img {
                 width: 216px; 
                 height: auto; 
         }

       .vegas-wrapper {
                 margin-top: 14px;
        }
        #vegas {
                 position: relative;
                 width: 100%; 
                 padding-top: 70.3125%; 
                 margin: 0 auto;
                 overflow: hidden;
                 border-radius: 5px;
         }
        .entry .entry-list-content {
                 padding: 0;
         }
        .entry-list-size {
                 margin: 0 auto;
         }
.entry-list-content .page-title {
    margin: 10px 0 20px 0;
}
ul.entry-list {
        padding-top: 10px;
}
         .entry .content .entry-list li {
                 font-size:1em;
	         padding: 10px;
          }
          .entry-list-size-wrapper {
                 margin-top: 16px;

           }
#content #entry .entry .content h4 {
          font-size: 1rem;
}
.spl-footer {
    line-height: 14px;
    padding: 5px 12px -5px;
  }
.spl-title {
    font-size: 15px !important;
}
.meta, .post-item {
          margin-top: -2px;
           margin-bottom: 40px;
}
.entry-date {
          font-size: 14px;
}
.entry-title {
	font-size: 1.2rem;
}
.view-more-content {
          margin-bottom: -20px;
}
p.text-continue {
    display: inline-block;
    margin: 20px 0 0;
    font-size: 12px;
}
#nav-page {
          margin: -10px 0 20px;
}
.page-title {
        margin-top: 10px;
}
.entry .page-content h2 {
	font-size: 1.2rem;
        padding-top: 0;
}
.grid {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 12px;
}
#comics ul {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 12px;
}
.comics-serialized, .comics-completed, 
#comics .comics-title, #comics .comics-top-title {
         font-size:  1.1rem;
}
#footer {
          margin-top: -12px;
}
.space-illust-1 {
           display: block;
           margin-top: 40px;
}
.space-comic-3 {
           display: block;
           margin-top: 20px;
}
.space-comic-4 {
           display: block;
           margin-top: -22px;
}
.space-comic-6 {
           display: block;
           margin-top: 5px;
}
.page-contents-title {
        font-size: 1.1rem;
}
ul.relate-entries {
          font-size: 0.9rem;
}
}

/* ^o^ */