@charset "UTF-8";
/* 制作： 大生仙 明已 */
/*  ＃main  ２カラム  */
/*  ＃main  ２カラム  */
/*  ＃main  ２カラム  */
/* ---  基本のCSS ---- */
/* ※HTMLページ内筆記 */
.wrapper { background-color: transparent; overflow: hidden; }

/* ファイアフォックスではoverflow: hidden; は必要 */
.inner0 { border-bottom: 1px solid rgba(195, 195, 195, 0.4); height: 500px; background-color: #353535; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin-right: calc(((100vw - 100%) / 2) * -2); margin-left: calc(((100vw - 100%) / 2) * -1); }
.inner0 .contentn0 { max-width: 1100px; box-shadow: 0 0 0 1px rgba(111, 111, 111, 0.5); margin: 0 auto; background: #ccc; height: 480px; }

@media screen and (min-width: 800px) { .inner0 { height: 500px; } }
.inner { background-color: #353535; min-height: 100px; width: 100%; margin: 0 -500%; padding: 0 500%; overflow: hidden; }

.inner2 { background-color: #353535; margin-right: calc(((100vw - 100%) / 2) * -1); background-color: rgba(0, 0, 0, 0.43); height: 385px; }

.about-site { max-width: 100%; min-height: 460px; margin: 0 auto; }

.bg-f333 { overflow: hidden; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #f3f3f3; background: linear-gradient(white, black, white); }

@media screen and (min-width: 480px) { .bg-f333 { height: 500px; border-bottom: 1px solid #a1a1a1; } }
.background-layer { background: radial-gradient(ellipse farthest-corner at bottom, rgba(220, 220, 220, 0.1) 70%, rgba(0, 0, 0, 0.7) 99%) repeat scroll 0% 0% rgba(255, 255, 255, 0.02); position: static; background-color: #f2f2f2; }

/* HTMLページ内 */
.page-body { margin: 0 auto; max-width: 1400px; }
.page-body h4 { text-align: center; color: #3ed2d2; }

/* ■ %%%%   ALL/文字基本リンク（主に記事ページ）    %%%% */
a { text-decoration: none; cursor: pointer; }
a:link { color: #50FCFD; font-weight: bold; }
a:hover { color: #50FCFD; }

@keyframes hurueru { 0% { transform: rotate(0deg) translate(0, 0); }
  12.5% { transform: rotate(0.4deg) translate(1px, -1px); }
  25% { transform: rotate(0.8deg) translate(0px, 1px); }
  37.5% { transform: rotate(0.4deg) translate(-1px, 0); }
  50% { transform: rotate(0deg) translate(0, 0); }
  62.5% { transform: rotate(-0.4deg) translate(1px, 0); }
  75% { transform: rotate(-0.8deg) translate(0, 1px); }
  87.5% { transform: rotate(-0.4deg) translate(-1px, -1px); }
  100% { transform: rotate(0deg) translate(0, 0); } }
/* ---  header のCSS ---- */
#header .box-rule { width: 100%; margin: 0 auto; position: relative; left: -2px; }
#header .box-rule .graphic { position: relative; height: 417px; visibility: hidden; }
@media screen and (min-width: 480px) { #header .box-rule .graphic { height: 500px; } }
#header .box-rule .graphic2 { position: relative; height: 417px; overflow: hidden; }
@media screen and (min-width: 800px) { #header .box-rule .graphic2 { height: 160px; } }
@media screen and (min-width: 480px) { #header .box-rule { left: auto; } }

/* ---  TOP とARCHIVE のロゴ (調整) ---- */
.logo { width: 100%; position: absolute; color: #f3f3f3; bottom: 40%; z-index: 999; text-shadow: 1px 1px 2px #333, -1px 1px 2px #333, 1px -1px 2px #333, -1px -1px 2px #333; }
.logo .since { text-align: center; }
.logo .name { text-align: center; font: bold 150%/1.2em Times New Roman,Helvetica, Arial,"メイリオ", sans-serif; text-transform: uppercase; /*←書式を全て大文字  */ }
.logo:before { position: absolute; top: 47px; left: 11px; content: none; opacity: .5; }
.logo h1 { margin: 0; }
.logo a { margin-top: -2px; color: #e6e6e6; display: block; }
.logo a:hover { color: #50FCFD; text-shadow: 1px 1px 2px #2e93ff, -1px 1px 2px #2e93ff, 1px -1px 2px #2e93ff, -1px -1px 2px #2e93ff; }

@media screen and (min-width: 480px) { .logo .name { line-height: 1.3em; font-weight: bold; margin-top: 5px; } }
@media screen and (min-width: 800px) { .logo { padding: 25px 0 38px; font-size: 100%; width: 240px; margin-top: 0; top: 0; bottom: 25%; }
  .logo .name { line-height: .8em; margin-top: 0; }
  .logo .name:before { content: url("https://animort.xyz/images/hp-line-white2.png"); } }
.logo2 { width: 100%; position: absolute; color: #f3f3f3; bottom: 40%; z-index: 999; text-shadow: 1px 1px 2px #333, -1px 1px 2px #333, 1px -1px 2px #333, -1px -1px 2px #333; }
.logo2 .since { text-align: center; }
.logo2 .name { text-align: center; font: bold 220%/1.0em Times New Roman,Helvetica, Arial,"メイリオ", sans-serif; text-transform: uppercase; /*←書式を全て大文字  */ }
.logo2:before { position: absolute; top: 47px; left: 11px; content: none; opacity: .5; }
.logo2 a { margin-top: -2px; color: #e6e6e6; display: block; }
.logo2 a:hover { color: #50FCFD; text-shadow: 1px 1px 2px #2e93ff, -1px 1px 2px #2e93ff, 1px -1px 2px #2e93ff, -1px -1px 2px #2e93ff; }

@media screen and (min-width: 480px) { .logo2 .name { font-size: 160%; font-weight: bold; margin-top: 5px; } }
@media screen and (min-width: 800px) { .logo2 { padding: 25px 0 38px; font-size: 100%; width: 240px; margin-top: 0; top: 0; bottom: 25%; }
  .logo2 .name { margin-top: 0; }
  .logo2 .name:before { content: url("https://animort.xyz/images/hp-line-white2.png"); } }
.menu-ruby { font-size: 55%; text-align: center; margin-top: -13px; }

/* ---  main & ext のCSS (調整) ---- */
/* ※メインカラム(800px でレスポンシブ) */
@media screen and (min-width: 1100px) { .main { width: 82.5%; display: inline-block; vertical-align: top; } }
.ext { display: none; z-index: 2; }

@media screen and (min-width: 1000px) { .ext { margin: 0 auto; float: right; display: inline-block; vertical-align: top; background-color: rgba(0, 0, 0, 0.3); padding-bottom: 32767px; margin-bottom: -32767px; box-shadow: 0 0 0 1px rgba(193, 193, 193, 0.2); }
  .ext .contents { backdrop-filter: blur(3px); padding-bottom: 55px; text-align: center; }
  .ext .drawer-menu { padding: 0; }
  .ext .drawer-menu h1 { text-align: center; font-size: 16px; margin: 8px 0 0; color: #efefef;}
  .ext .drawer-menu a { color: #f3f3f3; text-decoration: none; display: inline; }
  .ext .drawer-menu a .z-menu { border: 1px solid rgba(204, 204, 204, 0.53); width: 36%; height: 20px; display: inline-block; box-shadow: 0px 0px 0px 200px rgba(109, 68, 125, 0.24) inset; padding: 11px 8px; text-align: right; overflow: hidden; position: relative; }
  .ext .drawer-menu a .z-menu li { list-style: none; position: relative; z-index: 1; }
  .ext .drawer-menu a .z-menu:hover { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; background: rgba(0, 180, 250, 0.2); border-color: aqua; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }
  .ext .drawer-menu a .z-menu2 { border: 1px solid rgba(24, 93, 19, 0.9); width: 85.5%; height: 20px; display: inline-block; padding: 11px 8px; margin-bottom: 8px; box-shadow: 0px 0px 0px 1000px rgba(173, 150, 151, 0.5) inset; text-align: right; overflow: hidden; position: relative; }
  .ext .drawer-menu a .z-menu2:hover { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; background: rgba(0, 180, 250, 0.2); border-color: aqua; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }
  .ext .drawer-menu a .z-menu2 li { list-style: none; position: relative; z-index: 1; }
  .ext .drawer-menu a .z-menu2 .pass-i { font-size: 10px; position: relative; cursor: pointer; }
  .ext .drawer-menu a .z-menu2 .pass-i:before { background: #eee; border-radius: 50%; box-shadow: 1em 0 0 #eee, -1em 0 0 #eee; -webkit-box-shadow: 1em 0 0 #eee, -1em 0 0 #eee; content: ""; height: 0.6em; left: 0.6em; position: absolute; top: 0.5em; width: 0.6em; }
  .ext .drawer-menu a .home-i { cursor: pointer; }
  .ext .drawer-menu a .home-i:before { left: -6px; border-style: solid; border-color: transparent; border-width: 10px 15px; border-bottom-color: #fff; margin-top: -14px; background: transparent; }
  .ext .drawer-menu a .home-i:after { left: -1px; width: 8px; height: 8px; border-style: solid; border-color: #fff #fff transparent; border-width: 8px 6px 0; margin-top: 5px; background: transparent; }
  .ext .drawer-menu .buttom { list-style: none; background-color: rgba(45, 30, 68, 0.25); display: inline-block; margin-top: 9px; padding-bottom: 18px; padding-top: 18px; margin-bottom: 9px; width: 100%; overflow: hidden; text-align: center; border-top: 1px solid rgba(204, 204, 204, 0.5); border-bottom: 1px solid rgba(204, 204, 204, 0.5); } }
@media screen and (min-width: 1100px) { .ext { width: 17.5%; } }
/* ---  information (調整) ---- */
.information { background: transparent; width: 98%; z-index: 2; /*※comon.CSSは基本なのでHTMLでは一番上に設置。INFOは他のCSSで変更多い */ margin: 0 auto; position: relative; }

@media screen and (min-width: 320px) { .information { margin-top: 90px; } }
@media screen and (min-width: 600px) { .information { margin-top: 0; background: transparent; margin-bottom: 30px; } }
@media screen and (min-width: 767px) { .information { width: 86%; } }
.sub { display: none; }

.section { overflow: visible; position: relative; /* ← blur-container のabs位置指定のため */ }
.section h2 { font-size: 110%; text-align: center; color: #e8e8e8; margin-bottom: 8px; }
.section a { color: #ddd; }

.section2 { display: none; overflow: hidden; position: relative; /* ← blur-container のabs位置指定のため */ }
.section2 a { text-shadow: none; text-decoration: underline; color: rgba(47, 47, 47, 0.91); text-decoration: none; }
.section2 a:hover, .section2 a:active, .section2 a:focus { color: rgba(226, 226, 226, 0.91); text-shadow: 1px 1px 2px #f3f3f3, -1px 1px 2px #f3f3f3, 1px -1px 2px #f3f3f3, -1px -1px 2px #f3f3f3; }

@media screen and (min-width: 480px) { .section2 { display: block; } }
/* ---  アクセスカウンター ---- */
.Access { text-align: center; }

.Access-text { font-size: 60%; vertical-align: bottom; }

/* ---  サイドバーの中身 (調整) ---- */
/* script 使用のため、あまり入れ子にするな！ */
.flex, .flex1 { margin-bottom: 10px; overflow: hidden; }

@media screen and (min-width: 800px) { .flex, .flex1 {  margin-bottom: 25px; overflow: hidden; } }
@media screen and (min-width: 800px) { .brock { padding: 10px; display: block; background-color: rgba(103, 27, 27, 0.5); margin-bottom: 10px; overflow: hidden; }
  .brock h2 { font-size: 128%; padding: 18px 0; }
  .brock h3 { font-size: 120%; text-align: center; margin: 15px; }
  .brock p { padding-bottom: 15px; font-size: 90%; text-align: left; }
  .brock li { list-style: none; }
  .brock img { box-shadow: 0 0 0 1px #333, 0px 0px 0px 1000px rgba(255, 255, 255, 0.64) inset; }
  .brock .margin { font-size: 80%; color: #8995D4; display: inline-block; }
  .brock .small { font-size: 80%; olor: #efaaaa; } }
@media screen and (min-width: 800px) { .brock2 { margin-bottom: 10px; overflow: hidden; color: #dcdcdc; }
  .brock2 h2 { line-height: 2; font-size: 90%; }
  .brock2 li { list-style-type: none; margin-top: 8px; line-height: 4.5em; width: 100%; font-size: 70%; text-align: center; box-shadow: -1px 0px 0 1px rgba(134, 134, 134, 0.5), 0px 0px 0px 1000px rgba(152, 152, 152, 0.15) inset; }
  .brock2 li a { display: block; }
  .brock2 li a:hover { box-shadow: 0 0 0 1px aqua; color: #50FCFD; box-shadow: 0px 0px 0px 1000px rgba(230, 230, 230, 0.3) inset; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; } }
@media screen and (min-width: 800px) and (min-width: 800px) { .brock2 li { width: 100%; float: none; display: block; line-height: 1.7em; font-size: 80%; } }

.black { background-color: #52ad98; padding: 0 0 10px; }

.brock3 li { text-indent: .8em; text-align: left; width: 100%; float: none; line-height: 2.4em; font-size: 80%; list-style-type: none; margin-top: 8px; box-shadow: -1px 0px 0 1px rgba(134, 134, 134, 0.5), 0px 0px 0px 1000px rgba(152, 152, 152, 0.15) inset; }
.brock3 li a { display: block; background-color: rgba(45, 30, 68, 0.35); }
.brock3 li a:hover { box-shadow: 0 0 0 1px aqua; color: #50FCFD; box-shadow: 0px 0px 0px 1000px rgba(230, 230, 230, 0.3) inset; border-left: 5px solid aqua; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }

@media screen and (min-width: 800px) { .main-nav { margin-bottom: 252px; }
  .main-nav a { text-align: center; }
  .main-nav a:hover { color: #50FCFD; text-shadow: none; color: #50FCFD; }
  .main-nav li { position: relative; text-align: right; display: block; box-shadow: none; padding: 4px 0; border-bottom: solid 2px #1f7c86; }
  .main-nav li:hover { border-color: aqua; }
  .main-nav rb { font-size: 132%; line-height: 1.5em; font-weight: bold; position: relative; z-index: 2; }
  .main-nav ruby { position: relative; right: 7%; }
  .main-nav .en-ruby { margin: 5px 0 0 7px; color: rgba(61, 127, 255, 0.6); position: absolute; z-index: -1; top: 0; bottom: 0; left: 0; font: 135%/1.5em  Arial,Impact,Times New Roman, san-serif; text-shadow: 1px 1px 2px #333, -1px 1px 2px #333, 1px -1px 2px #333, -1px -1px 2px #333; }
  .main-nav .en-ruby2 { color: rgba(234, 241, 255, 0.4); position: absolute; z-index: 1; bottom: 3px; left: 8px; font: 135%/1.5em  Arial,Impact,Times New Roman, san-serif; } }
@media screen and (min-width: 480px) { .width-97 { display: block; width: 100%; float: none; } }
@media screen and (min-width: 800px) { .width-97 { width: 97%; float: right; } }
@media screen and (min-width: 800px) { .width-97-2 { width: 97%; float: right; margin-bottom: 10px; }
  .width-97-2 a { text-align: center; box-shadow: -1px 0px 0 1px rgba(165, 165, 165, 0.13), 0px 0px 0px 1000px rgba(230, 230, 230, 0.11) inset; }
  .width-97-2 a:hover { color: #50FCFD; box-shadow: 0px 0px 0px 1000px rgba(230, 230, 230, 0.3) inset; }
  .width-97-2 h1 { color: #f3f3f3; line-height: 2; text-align: right; padding-right: 5%; font-size: 130%; }
  .width-97-2 p { display: block; margin-bottom: 10px; overflow: hidden; line-height: 4.5em; width: 100%; font-size: 90%; list-style-type: none; } }
@media screen and (min-width: 800px) and (min-width: 800px) { .width-97-2 p { overflow: hidden; width: 100%; float: none; line-height: 1.7em; font-size: 100%; } }

/* サイドバーの開閉 (全部モバイルに読み込ませない)*/
@media screen and (min-width: 800px) { #acMenu1 dt { overflow: hidden; width: 96%; }
  #acMenu1 dd { margin-bottom: 13px; }
  #acMenu1 dd li { width: 100%; float: none; display: block; line-height: 1.2em; font-size: 80%; list-style-type: none; margin-top: 10px; text-align: center; list-style: none; /* …省略 */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; /* …省略 */ }
  #acMenu dt { display: block; height: 50px; line-height: 50px; background: url(/images/i_swich.png) 10px -69px no-repeat; overflow: hidden; }
  #acMenu dt.active { background: url("/images/i_swich.png") 10px 18px no-repeat; }
  #acMenu3 dt.active { background: url("/images/i_swich2.png") RGBA(230, 230, 230, 0.73) 50% 8px no-repeat; }
  #acMenu dd { display: none; }
  #acMenu dd li { width: 100%; float: none; display: block; line-height: 1.7em; font-size: 80%; list-style-type: none; margin-top: 10px; text-align: center; list-style: none; margin-top: 13px; box-shadow: -1px 0px 0 1px rgba(165, 165, 165, 0.9), 0px 0px 0px 1000px rgba(230, 230, 230, 0.3) inset; }
  .folder-col { height: 100%; padding: 20px 0; font-size: 130%; }
  .folder-col:before { display: none; }
  .folder-col .folder-i { display: none; }
  .folder-col .folder-p { display: none; } }
@media screen and (min-width: 800px) and (min-width: 420px) { .folder-col { height: 100%; padding: 11px; font-size: 120%; overflow: hidden; max-height: 23.5px; color: #f3f3f3; text-align: center; }
  .folder-col:before { width: 4px; height: 3px; margin-top: -10px; margin-left: -98px; background: #f3f3f3; border-radius: 0 0 1px 1px; }
  .folder-col .folder-i { cursor: pointer; margin: 6px 0 0 10px; position: absolute; width: 26px; height: 19px; background: #f3f3f3; border-radius: 1px 1px 0 0; display: block; }
  .folder-col .folder-p { margin-top: 4px; margin-left: 13px; position: absolute; width: 4px; height: 3px; background: #f3f3f3; border-radius: 0 0 1px 1px; display: block; } }
@media screen and (min-width: 800px) and (min-width: 550px) { .folder-col { padding: 11px; font-size: 120%; } }
input { display: inline-block; background-color: #505050; border: 1px solid #f3f3f3; padding: 10px; color: #f3f3f3; line-height: 2; margin: 15px 0 0; font-family: -apple-system,BlinkMacSystemFont,'ヒラギノ明朝 ProN W3',Hiragino Mincho ProN,源暎こぶり明朝,源ノ明朝,'Noto Serif Japanese','游明朝',YuMincho,Roboto,'Droid serif','メイリオ','Meiryo'; }
input:hover { background-color: #b4b4b4; border-color: aqua; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }

.post .cont-head2 { display: none; }
@media screen and (min-width: 767px) { .post .cont-head2 { display: block; overflow: hidden; white-space: normal; min-height: auto; max-width: 950px; margin: 40px auto 0; color: #3e3e3e; }
  .post .cont-head2 form { float: left; }
  .post .cont-head2 .input-text { padding: 0 8px; border: 1px solid #171717; }
  .post .cont-head2 .input-search { padding: 0 8px; border: 1px solid #171717; }
  .post .cont-head2 .input-check { top: -9px; }
  .post .cont-head2 img { float: left; margin: 10px 0px; text-align: center; }
  .post .cont-head2 .img_left2 { float: left; padding: 0 0 0 10px; width: 24%; position: relative; overflow: hidden; }
  .post .cont-head2 .updata { width: 100%; height: 61px; margin: 20px 0px; background-color: rgba(9, 47, 45, 0.68); width: 94%; padding: 70px 0; border: 1px solid rgba(97, 97, 97, 0.49); }
  .post .cont-head2 .updata rb { line-height: 1.4; font-size: 140%; }
  .post .cont-head2 .updata .board-ruby { font-size: 80%; text-align: center; }
  .post .cont-head2 .text_right2 { float: right; width: 74%; padding: 10px 0 0 0; overflow: hidden; display: block; color: #757575; }
  .post .cont-head2 .text_right2 .time { margin: 0px 20px 0 0; float: right; text-align: right; color: rgba(22, 97, 93, 0.6); font: 380%/1.7em Arial,Impact,Times New Roman, san-serif; }
  .post .cont-head2 .text_right2 .Google { text-align: right; color: rgba(22, 97, 93, 0.6); overflow: hidden; }
  .post .cont-head2 .text_right2 .osirase { height: auto; margin: 10px 0px; border: 1px solid rgba(0, 0, 0, 0.2); width: 90.8%; font-size: 90%; line-height: 1.75; background-color: rgba(0, 0, 0, 0.2); padding: 6px 0; /* ■タイトル枠■ */ /* ■本文枠■ */ /* ■本文■ */ }
  .post .cont-head2 .text_right2 .osirase h2 { width: 100%; float: none; line-height: 1.7em; font-size: 100%; }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox { overflow: hidden; }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .CollapsibleBoxTitle { position: relative; }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .CollapsibleBoxTitle p.cBoxTitle { font-size: 130%; }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .CollapsibleBoxBody { display: none; overflow-x: scroll; max-height: 100px; padding: 10px 0; /*スクロールバー全体*/ /*スクロールバーの軌道*/ /*スクロールバーの動く部分*/ }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .CollapsibleBoxBody ::-webkit-scrollbar { width: 10px; }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .CollapsibleBoxBody ::-webkit-scrollbar-track { border-radius: 10px; box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .CollapsibleBoxBody ::-webkit-scrollbar-thumb { background-color: #27587b; border-radius: 10px; }
  .post .cont-head2 .text_right2 .osirase .CollapsibleBox .cBoxTitle2 { float: right; DISPLAY: inline-flex; padding: 20px; }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBox div.CollapsibleBoxTitle { text-align: center; color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBox div.CollapsibleBoxTitle p.cBoxTitle:hover { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; background: rgba(0, 180, 250, 0.2); border-color: aqua; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBox div.CollapsibleBoxTitle p.cBoxButtons { margin: 0px; text-align: center; }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBox div.CollapsibleBoxTitle p.cBoxButtons a img { border-width: 0px; }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBoxBody { display: none; /* ←引き出し一括制御 on/off『display: none;』付けると本文が消える */ }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBoxBody p { overflow: hidden; text-align: left; }
  .post .cont-head2 .text_right2 .osirase div.CollapsibleBoxBody img { border: solid 1px #999; }
  .post .cont-head2 .text_right2 .osirase .cBoxTitle2 { float: right; } }

#update-board0 { width: 100%; display: block; margin-bottom: 50px; }
#update-board0 hr { display: block; }
#update-board0 ruby { margin: 0; }
#update-board0 .fade2 { display: block; border-width: 0 0 1px; border-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 100%) 0 0 100%; border-style: solid; }
#update-board0 rb { position: relative; top: 18px; }
@media screen and (min-width: 480px) { #update-board0 rb { top: 5px; font-size: 135%; } }
#update-board0 rt { display: none; }
#update-board0 h1 { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; font-size: 80%; position: relative; text-align: center; width: 100%; overflow: visible; z-index: 10; }
#update-board0 h1:before { content: url(/images/ct3.png); z-index: -1; position: absolute; top: -50px; left: 50%; margin-left: -228px; -webkit-transform: scale(0.6); transform: scale(0.6); }
@media screen and (min-width: 480px) { #update-board0 h1:before { -webkit-transform: scale(0.7); transform: scale(0.7); top: -60px; } }
@media screen and (min-width: 800px) { #update-board0 h1:before { content: url(/images/ct3.png); -webkit-transform: scale(0.75); transform: scale(0.75); top: -55px; } }
@media screen and (min-width: 800px) { #update-board0 h1 { font-size: 130%; margin-top: 0; display: none; } }
#update-board0 .board-ruby { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; font-size: 105%; text-align: center; position: relative; top: 25px; }
@media screen and (min-width: 480px) { #update-board0 .board-ruby { top: 8px; right: -5px; }
  #update-board0 ruby { margin: 4px 0 0 6px; } }

@media screen and (min-width: 767px) { #update-board0 { display: none; } }
#maso-wrap { position: relative; overflow: hidden; }

@media screen and (min-width: 480px) { #maso-wrap { width: 95%; } }
#maso-cont { width: 90%; margin: 0 auto; }

.maso-item { margin: 20px auto 0; width: 151px; overflow: hidden; position: relative; list-style: none; box-shadow: 0 0 0 1px #4a4a4a; }
.maso-item a { display: block; }
.maso-item a:link { color: #50FCFD; }
.maso-item a:hover { color: #50FCFD; text-shadow: 1px 1px 2px #2e93ff, -1px 1px 2px #2e93ff, 1px -1px 2px #2e93ff, -1px -1px 2px #2e93ff; }
.maso-item a:active { color: #8888ff; font-weight: bold; }
.maso-item h2 { font-size: 20px; text-align: center; position: relative; padding: 10px; }
.maso-item h2:before { content: url(/images/h2-line.png); position: absolute; bottom: -9px; left: 50%; margin-left: -75px; /* Half of my width. */ }
.maso-item p { text-align: center; display: block; }
.maso-item p a { box-shadow: 0 0 0 1px #4a4a4a; background-color: rgba(14, 28, 60, 0.76); font-size: 94%; line-height: 2.6em; padding: 0 13px; /* …省略 */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; /* …省略 */ }
.maso-item li { text-align: center; line-height: 1.8; font-size: 80%; background-color: #6c6c6c; box-shadow: 0 0 0 1px #373737; }
.maso-item .maso-item.kuro { box-shadow: 0 0 0 1px rgba(165, 165, 165, 0.5); filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.8)); background-color: rgba(255, 255, 255, 0.29); }
.maso-item .date { position: absolute; left: 0; top: 0; padding: 10px 0 0 15px; width: 20px; z-index: 1; }

@media screen and (min-width: 480px) { .maso-item { width: 145px; float: left; /*Lazy Load */ } }
.maso-item.x2 { height: 100px; width: 100%; text-shadow: 1px 1px 2px #333, -1px 1px 2px #333, 1px -1px 2px #333, -1px -1px 2px #333; }
.maso-item.x2 h1 img { width: auto; }
.maso-item.x2 li, .maso-item.x2 img { display: block; top: -1px; position: relative; }
.maso-item.x2 li:hover, .maso-item.x2 img:hover { transform: none; }

@media screen and (min-width: 480px) { .maso-item.x2 { width: 300px; min-height: 170px; } }
.maso-item.x3 { background-color: rgba(0, 0, 0, 0.2); }
.maso-item.x3 h1 img { width: auto; }
.maso-item.x3 li, .maso-item.x3 img { display: block; }
.maso-item.x3 li:hover, .maso-item.x3 img:hover { transform: none; }

@media screen and (min-width: 480px) { .maso-item.x3 { width: 300px; min-height: 170px; } }
.maso-item.x2.siro { box-shadow: 0 0 0 1px rgba(165, 165, 165, 0.5); filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.8)); background-color: rgba(255, 255, 255, 0.29); }

.maso-item.x2 li { text-align: left; text-indent: 1em; box-shadow: 0 0 0 1px rgba(165, 165, 165, 0.5); margin-top: 5px; font: 96%/3em Times New Roman,"Hiragino Maru Gothic W4 JIS2004",'游ゴシック体', 'Yu Gothic', YuGothic,"メイリオ", serif; }

@media screen and (min-width: 480px) { .maso-item.x2 li { font: 88%/2.0em "Hiragino Maru Gothic W4 JIS2004",'游ゴシック体', 'Yu Gothic', YuGothic,"メイリオ", serif; } }
.black { background-color: #52ad98; padding: 0 0 10px; }

/* @include absPosition(5px, 20px, 10px, 15px); */
/* HR 水平線を改造 */
.hr-text { line-height: 1em; position: relative; outline: 0; border: 0; text-align: center; height: 1.5em; opacity: .8; }
.hr-text:before { content: ''; background: -webkit-linear-gradient(left, transparent, #818078, transparent); background: linear-gradient(to right, transparent, #818078, transparent); position: absolute; left: 0; top: 50%; width: 100%; height: 1px; }
.hr-text:after { content: attr(data-content); position: relative; display: inline-block; padding: 0 .5em; line-height: 1.5em; }

.fade { border-width: 0 0 1px; border-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 100%) 0 0 100%; border-style: solid; }

.sousaku, .photo { margin: 0 auto; padding: 0; position: relative; }

.sousaku .sousaku-block { display: none; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; width: 260px; height: auto; margin: 20px auto 0; box-shadow: 0 0 0 1px #4a4a4a; overflow: hidden; min-height: 152.75px; }
.sousaku .sousaku-block img { display: block; top: -1px; position: relative; }
.sousaku .sousaku-block a { display: block; }
.sousaku .sousaku-block a:link { color: #50FCFD; }
.sousaku .sousaku-block a:hover { color: #50FCFD; text-shadow: 1px 1px 2px #2e93ff, -1px 1px 2px #2e93ff, 1px -1px 2px #2e93ff, -1px -1px 2px #2e93ff; }
.sousaku .sousaku-block a:active { color: #8888ff; font-weight: bold; }
.sousaku .sousaku-block h1 { position: absolute; right: 0px; padding: 6px 15px 4px; font-size: 120%; /* 見出し column-span:none;  まだ使えない*/ box-shadow: 0 0 0 1px #4a4a4a; background-color: #26738c99; z-index: 1; color: #e2e2e2; text-shadow: 1px 1px 2px #000, -1px 1px 2px #000, 1px -1px 2px #000, -1px -1px 2px #000; }
.sousaku .sousaku-block h2 { font-size: 20px; text-align: center; position: relative; padding: 10px; }
.sousaku .sousaku-block h2:before { content: url(/images/h2-line.png); position: absolute; bottom: -9px; left: 50%; margin-left: -75px; /* Half of my width. */ }
.sousaku .sousaku-block p { text-align: center; display: block; }
.sousaku .sousaku-block p a { box-shadow: 0 0 0 1px #4a4a4a; background-color: rgba(14, 28, 60, 0.76); line-height: 2.6em; padding: 0 13px; /* …省略 */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; /* …省略 */ }
.sousaku .sousaku-block li { text-align: center; line-height: 1.8; font-size: 80%; background-color: #6c6c6c; box-shadow: 0 0 0 1px #373737; }
.sousaku .sousaku-block .date { position: absolute; left: 0; top: 0; padding: 10px 0 0 15px; width: 20px; z-index: 1; color: #eaeaea; text-shadow: 1px 1px 2px #000, -1px 1px 2px #000, 1px -1px 2px #000, -1px -1px 2px #000; }

.photo .photo-block { display: none; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; width: 130px; min-height: 96.61px; height: auto; }

.photo .photo-block img { vertical-align: bottom; }

.sousaku .sousaku-block.x { height: 155px; min-height: 155px; }
.sousaku .sousaku-block.x li, .sousaku .sousaku-block.x img { display: block; top: -1px; position: relative; }
.sousaku .sousaku-block.x li:hover, .sousaku .sousaku-block.x img:hover { transform: none; }

body.category-all .item-all, body.category-kiji .item-kiji, body.category-comic .item-comic, body.category-novel .item-novel, body.category-link .item-link, body.category-illust .item-illust { display: block; -webkit-animation: show .5s linear 0s forwards; animation: show .5s linear 0s forwards; }

@media only screen and (min-width: 769px) { .category-btn li a:hover { box-shadow: 0 0 0 1px aqua; } }
@media only screen and (max-width: 568px) { .category-btn { margin: 10px auto 10px; margin-bottom: 2em; }
  .category-btn li { width: 48%; margin-bottom: .5em; float: left; } }
@-webkit-keyframes show { from { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
  to { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } }
@keyframes show { from { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
  to { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } }
/*--- ページャー   ----*/
.pager { overflow: hidden; margin: 60px auto 10px; width: 90%; line-height: 1.8em; text-align: center; background-color: #187b7b; padding: 5px; border: 1px solid rgba(255, 255, 255, 0.2); }
.pager a { padding: 7px 16px; float: left; margin-right: 5px; font-weight: bold; color: #ddd; }
.pager a:hover { text-shadow: 1px 1px 2px #333, -1px 1px 2px #333, 1px -1px 2px #333, -1px -1px 2px #333; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); display: inline-block; }
.pager p { font-size: 120%; float: right; margin-top: 10px; display: block; border-top: 1px solid #bbbbbb; width: 100%; text-shadow: none; }
@media screen and (min-width: 800px) { .pager p { display: inline; border-top: none; width: auto; } }

.current_page_number { background-color: rgba(25, 210, 176, 0.4) !important; }

.pager_item a:hover { background-color: lightgray; }

.pager_item a.current_page_number { font-weight: bold; font-size: 2em; }

@media screen and (min-width: 767px) { .pager_item a.current_page_number { font-size: .9em; } }
.navi { display: none; }
.navi .pre-navi { margin-right: 10px; }
.navi .end-navi { margin-left: 10px; }

@media screen and (min-width: 480px) { .navi { display: flex; font-size: 1em; text-shadow: none; text-align: center; padding: 12px 10px; display: block; font-size: 73%; } }
/* --- 二分割からむ(サイズ変換付き) ---- */
/* --- 基本 ----*/
.col2 { display: block; }

@media only screen and (min-width: 980px) { .col2 { display: flex; } }
.col2 li { width: 100%; }

@media only screen and (min-width: 980px) { .col2 li { width: 50%; width: -webkit-calc(100% / 2); width: calc(100% / 2); } }
.col2 ul, .col2 li { padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; }

.col2 li { text-align: center; padding: 20px 0; background-color: rgba(0, 0, 0, 0.2); box-shadow: 0 0 0 1px #757575; }

/* --- TOPお知らせ看板 ----*/
.col2-o { display: block; }

@media only screen and (min-width: 980px) { .col2-o { display: flex; } }
.col2-o li { width: 100%; }

@media only screen and (min-width: 980px) { .col2-o li { width: 50%; width: -webkit-calc(100% / 2); width: calc(100% / 2); } }
.col2-o ul, .col2-o li { padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; }

.col2-o li { text-align: center; }

/* --- 2枚画像 ----*/
.contents { white-space: normal; text-align: center; }
.contents .content2_1 { width: 49.5%; margin: 1% 0; float: left; box-shadow: 0 0 0 1px #c3c3c3; }
.contents .content2_2 { width: 49.5%; margin: 1% 0; float: right; box-shadow: 0 0 0 1px #c3c3c3; }

/*--- フッターの外身   ----*/
#footer { background-color: #2d2d2d; position: relative; color: #f2f2f2; z-index: 3; text-align: center; /* ← blur-container のabs位置指定のため */ }
#footer .about-bg { padding: 15px 0; }
#footer .about-bg .about-site { margin: 0 auto; overflow: hidden; }
#footer .about-bg .about-site h1 { font-size: 20px; text-align: center; padding: 20px 0px 20px 0px; background-color: rgba(0, 0, 0, 0.48); }
@media screen and (min-width: 767px) { #footer .about-bg .about-site h1 { background-color: transparent; } }
@media screen and (min-width: 767px) { #footer .about-bg .about-site { width: 85%; max-width: 1100px; min-height: 480px; } }
#footer .box-rule .about { width: 92%; margin: 0px auto 30px; overflow: hidden; }
@media screen and (min-width: 420px) { #footer .box-rule .about { width: 80%; } }

.foot_window { overflow: hidden; }

.foot_center { clear: both; overflow: hidden; }
.foot_center h1 { padding: 20px 0px 0px; font-size: 90%; text-align: center; }
.foot_center ul li:hover { background: rgba(222, 222, 222, 0.6); }

.foot_window ul li { float: left; width: 49.0%; text-align: center; margin-bottom: 10px; border: 1px solid rgba(0, 0, 0, 0.7); font-size: 90%; line-height: 3em; background: rgba(222, 222, 222, 0.4); -webkit-transition: all .3s; transition: all .3s; }
.foot_window ul li a { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; text-decoration: none; }
.foot_window ul li a:hover { background: rgba(222, 222, 222, 0.6); }

@media screen and (min-width: 767px) { .foot_window ul li { width: 33%; font-size: 100%; line-height: 2.6em; border: 1px solid rgba(68, 68, 68, 0.7); margin-bottom: 13px; } }
@media screen and (min-width: 1023px) { .foot_window ul li { width: 24.7%; font-size: 90%; line-height: 2.3em; margin-bottom: 0px; } }
.picture-item__description { font: normal 95%/220% Times New Roman,"メイリオ", sans-serif; }

.rss { float: left; text-align: center; display: block; margin-left: 1%; font: normal 130%/200% Times New Roman,"メイリオ", sans-serif; background: rgba(222, 222, 222, 0.4); width: 80px; }
.rss a:hover { text-shadow: 1px 1px 2px white, -1px 1px 2px white, 1px -1px 2px white, -1px -1px 2px white; text-decoration: underline; color: white; text-decoration: none; position: relative; display: block; color: #fff; background: rgba(43, 15, 16, 0.72); text-decoration: none; -webkit-transition: all .3s; transition: all .3s; }
.rss a:hover:hover, .rss a:hover:active, .rss a:hover:focus { color: white; }
.rss a:hover:hover, .rss a:hover:active, .rss a:hover:focus { background-color: rgba(119, 41, 44, 0.72); }

/*--- プロフィール ----*/
.col3 { display: block; }

@media only screen and (min-width: 980px) { .col3 { display: flex; } }
.col3 li { width: 100%; }

@media only screen and (min-width: 980px) { .col3 li { width: 33.33333%; width: -webkit-calc(100% / 3); width: calc(100% / 3); } }
.col3 ul, .col3 li { padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; }

.col3 li { text-align: center; padding: 20px 0; background-color: rgba(0, 0, 0, 0.2); box-shadow: 0 0 0 1px #757575; }

/*--- footerプロフィール ----*/
.footer-col3 { display: block; }

@media only screen and (min-width: 980px) { .footer-col3 { display: flex; min-height: 600px; max-width: 1200px; margin: 0 auto; padding: 50px 0 30px; } }
.footer-col3 li { width: 100%; }
.footer-col3 li .about { margin: 0 10px 20px 0; }
.footer-col3 li .name { font-size: 150%; margin: 30px 0 5px; }
.footer-col3 li img { margin: 0 auto; width: 250px; margin: 10px; }
.footer-col3 li p { text-align: center; display: inline-block; margin: 30px; line-height: 1.8; max-width: 320px; }
.footer-col3 li .link-a { padding: 15px; width: 80%; display: inline-block; box-shadow: 0 0 0 1px #757575; }

@media only screen and (min-width: 980px) { .footer-col3 li { width: 33.33333%; width: -webkit-calc(100% / 3); width: calc(100% / 3); } }
.footer-col3 ul, .footer-col3 li { padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; }

.footer-col3 li { text-align: center; padding: 20px 0; }

@media only screen and (min-width: 480px) { #update-board0 ruby { margin: 4px 0 0 6px; }
  #update-board0 .board-ruby { right: -5px; } }
#copyright { padding: 10px 0 10px 0; text-align: center; -webkit-box-shadow: 0px 0px 0px 1000px rgba(27, 20, 21, 0.7)inset; -moz-box-shadow: 0px 0px 0px 1000px rgba(27, 20, 21, 0.7)inset; box-shadow: 0px 0px 0px 1000px rgba(27, 20, 21, 0.7)inset; clear: both; }
#copyright #foot-text { margin-bottom: 10px; font-size: 80%; line-height: 1.6em; padding: 10px 10%; }
@media screen and (min-width: 767px) { #copyright #foot-text { font-size: 90%; padding: 0; } }
#copyright #foot { border-top: 1px solid #999; border-bottom: 1px solid #999; -webkit-box-shadow: 0px 0px 0px 1000px rgba(41, 41, 41, 0.2)inset; -moz-box-shadow: 0px 0px 0px 1000px rgba(41, 41, 41, 0.2)inset; box-shadow: 0px 0px 0px 1000px rgba(41, 41, 41, 0.2)inset; background-image: url("/images/kusa.png"); background-position: left bottom; background-repeat: repeat-x; padding: 10px 0; font-size: 77%; line-height: 1.6em; }
#copyright #foot a { color: whitesmoke; display: inline-block; }
@media screen and (min-width: 767px) { #copyright #foot { font: normal bold 100%/130% Times New Roman,"メイリオ", sans-serif; padding: 5px 0; } }

.black { background-color: #52ad98; padding: 0 0 10px; width: 80%; margin: 0 auto; }

.contents-title { text-align: center; line-height: 1.3; font-size: 90%; color: #333; }

.category-btn { padding: 0; margin-bottom: 4em; text-align: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }

.category-btn li { width: 22%; list-style: none; box-shadow: 0 0 0 1px #4a4a4a; margin-left: 5px; line-height: 2.75em; }

.category-btn li a { display: block; color: #454545; background-color: transparent; transition: background .3s ease; }

@media only screen and (min-width: 568px) { .category-btn { max-width: 830px; margin: 10px auto 10px; display: -webkit-flex; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-flex-pack: justify; -webkit-justify-content: space-between; }
  .category-btn li { width: 22%; } }
.category-btn li a:active { color: #16615d; }

.category-btn li a.is-current { pointer-events: none; background-color: rgba(22, 97, 93, 0.6); }

/* ■ %%%%       %%%% */
#category-post { padding: 30px 0 50px; background-color: rgba(22, 66, 77, 0.59); }
#category-post h1 { font-size: 28px; line-height: 2em; text-shadow: none; }
@media screen and (min-width: 800px) { #category-post h1 { font-size: 32px; } }

.navi { text-shadow: none; text-align: center; padding: 12px 10px 40px; line-height: 1.75; }
.navi a { color: #333; }
.navi .pre-navi { margin-right: 10px; }
.navi .end-navi { margin-left: 10px; }

@media screen and (min-width: 480px) { .navi { display: flex; font-size: 1em; text-shadow: none; text-align: center; padding: 12px 10px; font-size: 73%; } }
/* ■ %%%%   月別ポスト/    %%%% */
#line { overflow: hidden; margin: 0 auto; padding: 10px; }
#line .submit-button { overflow: VISIBLE; margin-bottom: 38px; text-align: right; }
#line .submit-button input { border: 1px solid rgba(0, 0, 0, 0.5); padding: 0  8px; width: 100%; line-height: 3.5; }
#line .submit-button input:hover { color: whitesmoke; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; }
@media screen and (min-width: 500px) { #line .submit-button input { width: 49%; margin: 8px 1px; } }
@media screen and (min-width: 800px) { #line .submit-button input { width: auto; } }
@media screen and (min-width: 480px) { #line img { margin: auto; position: absolute; top: 0; bottom: 0; right: 0; left: -62.5%; width: 174px; } }
#line .title a { display: block; width: 100%; line-height: 3.6; z-index: 99999; position: relative; text-shadow: 1px 1px 2px #454545, -1px 1px 2px #454545, 1px -1px 2px #454545, -1px -1px 2px #454545; /* …省略 */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; /* …省略 */ }
#line .title a:hover { transform: scale(1.1); -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.3s; opacity: .5; }
@media screen and (min-width: 800px) { #line .title a { line-height: 5.0; } }
#line .topic { margin: 0 0 15px 0; width: 100%; height: 50px; float: left; position: relative; overflow: hidden; background-color: rgba(22, 23, 35, 0.63); box-shadow: 0 0 0 1px rgba(165, 165, 165, 0.5); font-size: 80%; }
#line .topic img { visibility: hidden; }
@media screen and (min-width: 480px) { #line .topic img { visibility: visible; } }
#line .topic .text { margin-bottom: 4px; position: absolute; bottom: 0; right: 0; z-index: 100000; }
#line .topic .text p { text-align: right; font-size: x-small; }
#line .topic .text p a { display: inline-block; }
#line .topic .text .more_link { text-align: right; padding: 10px 20px; }
#line .topic .text .more_link a { display: block; }
@media screen and (min-width: 480px) { #line .topic { width: 50%; height: 100px; } }
@media screen and (min-width: 800px) { #line .topic { height: 70px; } }