@import url("//fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
@import url("//fonts.googleapis.com/css2?family=Noto+Sans");
@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: normal;
  src: url("font/fontawesome-webfont.eot?#iefix") format('embedded-opentype'), url("font/fontawesome-webfont.woff") format('woff'), url("font/fontawesome-webfont.ttf") format('truetype'), url("font/fontawesome-webfont.svg#FontAwesomeRegular") format('svg');
}
* {
  margin: 0;
  padding: 0;
}
body {
  background: #fff;
  background: #fff no-repeat -300px -400px/1454px url("/img/bg.png");
  color: #000;
  font-family: "Noto Sans", "Helvetica Neue", "Helvetica", Arial, sans-serif;
  font-size: 18px;
  text-shadow: 0 0 1px transparent;
}
@media screen and (max-width: 1260px) {
  body {
    margin: 0 16px;
  }
}
@media screen and (max-width: 600px) {
  body {
    font-size: 14px;
  }
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Montserrat", "Noto Sans JP", Helvetica Neue, Helvetica, Arial, sans-serif;
}
h1 {
  font-size: 1.8em;
}
@media screen and (max-width: 600px) {
  h1 {
    font-size: 1.3em;
  }
}
h2 {
  font-size: 1.5em;
}
@media screen and (max-width: 600px) {
  h2 {
    font-size: 1.3em;
  }
}
h3 {
  font-size: 1.3em;
}
a {
  text-decoration: none;
  color: #3579e4;
}
a:hover {
  text-decoration: underline;
}
.alignleft {
  float: left;
}
.alignright {
  float: right;
}
.clearfix {
  zoom: 1;
}
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
.inner {
  width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 1260px) {
  .inner {
    width: 100%;
  }
}
#main-col {
  width: calc(1200px - 300px);
}
@media screen and (max-width: 1260px) {
  #main-col {
    width: 100%;
    margin-right: -300px;
  }
}
@media screen and (max-width: 900px) {
  #main-col {
    margin-right: 0;
    float: none;
  }
}
@media screen and (max-width: 1260px) {
  #wrapper {
    margin-right: 300px;
  }
}
@media screen and (max-width: 900px) {
  #wrapper {
    margin-right: 0;
  }
}
*
#header {
  text-shadow: 0 0 1px #fff;
  margin: 20px auto;
}
#header a {
  color: #000;
}
#header a:hover {
  color: #000;
  text-decoration: none;
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter: alpha(opacity=70);
}
#header h1 {
  font-weight: 600;
  font-size: 1.6em;
  line-height: 1;
  padding: 5px 0;
}
#header h1 a {
  background: no-repeat left/231px 30px url("/img/ABlogo.png");
  padding-left: 240px;
}
@media screen and (max-width: 600px) {
  #header h1 a {
    background: no-repeat left/200px 26px url("/img/ABlogo.png");
    padding-left: 210px;
  }
}
#header h2 {
  font-weight: normal;
  font-size: 0.9em;
  line-height: 1;
  margin-top: 10px;
}
#header #main-nav {
  font-family: "Montserrat", "Noto Sans JP", Helvetica Neue, Helvetica, Arial, sans-serif;
  font-weight: 600;
  line-height: 2.5em;
  padding-right: 4px;
}
#header #main-nav ul {
  list-style: none;
}
#header #main-nav ul li {
  float: left;
  margin-left: 30px;
}
article {
  background: rgba(255,255,255,0.729);
  backdrop-filter: blur(24px);
  border-radius: 24px;
  -webkit-box-shadow: 1px 1px 8px #f2f2f2;
  box-shadow: 1px 1px 8px #f2f2f2;
}
article.page {
  padding-left: 20px;
}
article.page .icon {
  display: none;
}
article.post .icon:before {
  content: '\f016';
}
article.photo .icon:before {
  content: '\f030';
}
article.link .icon:before {
  content: '\f0c1';
}
article.link .title a:after {
  content: '\f08e';
  color: #999;
  font: 12px FontAwesome;
  padding-left: 10px;
  vertical-align: super;
}
article .post-content {
  padding: 60px 60px;
  margin-bottom: 50px;
  position: relative;
}
@media screen and (max-width: 600px) {
  article .post-content {
    padding: 24px;
    margin-bottom: 24px;
  }
}
article .gallery {
  overflow: hidden;
  position: relative;
}
article .gallery:hover .control {
  opacity: 1;
  -ms-filter: none;
  filter: none;
}
article .gallery img {
  min-width: 100%;
  max-width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}
article .gallery .control {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
}
article .gallery .prev,
article .gallery .next {
  position: absolute;
  top: 0;
  width: 50%;
  height: 100%;
  cursor: pointer;
}
article .gallery .prev:before,
article .gallery .next:before {
  position: absolute;
  font: 24px/1 FontAwesome;
  text-align: center;
  width: 24px;
  text-shadow: 0 0 15px rgba(0,0,0,0.5);
  color: #fff;
  margin-top: -12px;
  top: 50%;
}
article .gallery .prev {
  left: 0;
}
article .gallery .prev:before {
  content: '\f053';
  left: 10px;
}
article .gallery .next {
  right: 0;
}
article .gallery .next:before {
  content: '\f054';
  right: 10px;
}
article header .icon {
  width: 32px;
  height: 32px;
  margin-right: 25px;
  position: absolute;
  top: 20px;
  left: 20px;
  color: #3579e4;
}
@media screen and (max-width: 600px) {
  article header .icon {
    display: none;
  }
}
article header .icon:before {
  position: absolute;
  font: 32px FontAwesome;
  top: 0;
  left: 0;
  width: 32px;
  text-align: center;
}
article header time {
  color: #999;
  font: 0.8em "Noto Sans", "Helvetica Neue", "Helvetica", Arial, sans-serif;
  margin-top: 10px;
  margin-bottom: 20px;
  display: block;
  line-height: 1;
}
article header time a {
  color: #000;
}
article header time a:hover {
  color: #3579e4;
  text-decoration: none;
}
article header .title {
  font-weight: bold;
  font-size: 2.2em;
}
@media screen and (max-width: 600px) {
  article header .title {
    font-size: 1.7em;
  }
}
article header .title a {
  color: #000;
}
article header .title a:hover {
  color: #3579e4;
  text-decoration: none;
}
article .entry {
  line-height: 1.6;
}
article .entry p,
article .entry blockquote,
article .entry ul,
article .entry ol,
article .entry dl,
article .entry table,
article .entry iframe,
article .entry h3,
article .entry h4,
article .entry h5,
article .entry h6,
article .entry .video-container {
  margin-top: 24px;
}
article .entry table {
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border: 1px solid #e2e2e2;
  width: 100%;
}
article .entry table th {
  white-space: nowrap;
  color: #000;
  font-weight: 600;
  background: #eee;
}
article .entry table td,
article .entry table th {
  border: 1px solid #e2e2e2;
  padding: 8px 16px;
  text-align: left;
}
article .entry figure.highlight table {
  border: none;
  width: auto;
  border-collapse: separate;
}
article .entry blockquote {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  font-style: italic;
  font-family: "Georgia", serif;
  font-size: 1.2em;
  padding: 0 30px 15px;
  text-align: center;
}
article .entry blockquote footer {
  border-top: none;
  font-size: 0.8em;
  line-height: 1;
  margin: 20px 0 0;
  padding-top: 0;
}
article .entry blockquote footer cite:before {
  content: '—';
  color: #ccc;
  padding: 0 0.5em;
}
article .entry code,
article .entry pre {
  font-family: Monaco, Menlo, Consolas, Courier New, monospace;
}
article .entry strong,
article .entry b {
  font-weight: 700;
}
article .entry code {
  background: #eee;
  color: #666;
  padding: 0 5px;
  margin: 0 2px;
  font-size: 0.9em;
  border: 1px solid #ddd;
  border-radius: 3px;
}
article .entry pre {
  background: #eee;
  border: 1px solid #ddd;
  margin-top: 15px;
  overflow: auto;
  padding: 7px 15px;
  border-radius: 2px;
}
article .entry pre code {
  background: none;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
}
article .entry ul,
article .entry ol,
article .entry dl {
  margin-left: 20px;
}
article .entry ul ul,
article .entry ol ul,
article .entry dl ul,
article .entry ul ol,
article .entry ol ol,
article .entry dl ol,
article .entry ul dl,
article .entry ol dl,
article .entry dl dl {
  margin-top: 0;
}
article .entry h1,
article .entry h2 {
  font-weight: bold;
  border-left: 4px solid #000;
  padding-left: 0.7em;
  margin-bottom: 10px;
  margin-top: 2em;
}
article .entry h3,
article .entry h4,
article .entry h5,
article .entry h6 {
  font-weight: bold;
}
article .entry img,
article .entry video {
  max-width: 100%;
  height: auto;
  border: none;
  margin: 24px auto 0;
  display: block;
}
article .entry iframe {
  border: none;
}
article .entry .caption {
  display: block;
  margin-top: 5px;
  color: #999;
  position: relative;
  font-size: 0.9em;
  padding-left: 25px;
}
article .entry .caption:before {
  content: '\f040';
  position: absolute;
  font: 1.3em FontAwesome;
  position: absolute;
  left: 0;
  top: 3px;
}
article .entry .video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}
article .entry .video-container iframe,
article .entry .video-container object,
article .entry .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin-top: 0;
}
article .entry .pullquote {
  float: right;
  border: none;
  padding: 0;
  margin: 1em 0 0.5em 1.5em;
  text-align: left;
  width: 45%;
  font-size: 1.5em;
}
article footer {
  margin-top: 32px;
  padding-top: 12px;
  border-top: 1px solid #ddd;
  color: #999;
  font-size: 0.9em;
  line-height: 16px;
  position: relative;
  min-height: 16px;
}
article footer a {
  color: #999;
}
article footer a:hover {
  color: #3579e4;
  text-decoration: none;
}
article footer a:before {
  font: 1.1em FontAwesome;
  padding-right: 10px;
  vertical-align: middle;
}
article footer a.more-link:before {
  content: '\f054';
}
article footer a.comment-link:before {
  content: '\f075';
}
article footer .categories,
article footer .tags {
  position: relative;
  padding-left: 25px;
  margin: 15px 0;
}
article footer .categories:before,
article footer .tags:before {
  position: absolute;
  font: 1.1em FontAwesome;
}
article footer .categories:before {
  content: '\f07b';
  top: 2px;
  left: 1px;
}
article footer .tags:before {
  content: '\f02b';
  top: 3px;
  left: 2px;
}
#comment {
  padding: 60px;
  background: #fff;
  -webkit-box-shadow: 1px 1px 8px #f2f2f2;
  box-shadow: 1px 1px 8px #f2f2f2;
  border-radius: 24px;
  margin-bottom: 50px;
}
#comment .title {
  font-weight: normal;
  margin-bottom: 15px;
}
#pagination a {
  display: block;
  padding: 5px 10px;
  background: #ddd;
  color: #999;
  font-family: "Montserrat", "Noto Sans JP", Helvetica Neue, Helvetica, Arial, sans-serif;
  text-shadow: 0 0 1px #fff;
  margin-bottom: 50px;
}
#pagination a:hover {
  background: #3579e4;
  color: #fff;
  text-decoration: none;
  text-shadow: none;
}
#pagination .prev:before {
  content: '\f053';
  padding-right: 10px;
  font-family: FontAwesome;
}
#pagination .next:after {
  content: '\f054';
  padding-left: 10px;
  font-family: FontAwesome;
}
.archive-title {
  color: #000;
  font-weight: 600;
  margin-bottom: 24px;
}
.archive-title:before {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  padding-right: 10px;
  display: inline-block;
}
.archive-title.tag:before {
  content: '\f02b';
}
.archive-title.category:before {
  content: '\f07b';
}
.archive {
  margin-bottom: 50px;
}
.archive article {
  -webkit-box-shadow: 1px 1px 8px #f2f2f2;
  box-shadow: 1px 1px 8px #f2f2f2;
}
#sidebar {
  width: 270px;
  line-height: 1.8em;
  margin-left: 24px;
}
@media screen and (max-width: 900px) {
  #sidebar {
    float: none;
    width: 100%;
    margin-left: 0;
  }
}
#sidebar .widget {
  background: rgba(255,255,255,0.729);
  backdrop-filter: blur(24px);
  border-radius: 24px;
  margin-bottom: 24px;
  word-wrap: break-word;
  -webkit-box-shadow: 1px 1px 8px #f2f2f2;
  box-shadow: 1px 1px 8px #f2f2f2;
}
#sidebar .widget .title {
  padding: 15px 20px;
  font-size: 1em;
  border-bottom: 1px solid #ddd;
  font-weight: normal;
}
#sidebar .widget .entry {
  font-size: 0.9em;
  padding: 15px 20px;
}
#sidebar .widget .entry a {
  color: #000;
}
#sidebar .widget .entry a:hover {
  color: #3579e4;
  text-decoration: none;
}
#sidebar .widget ul,
#sidebar .widget ol,
#sidebar .widget dl {
  list-style: none;
}
#sidebar .widget ul ul,
#sidebar .widget ol ul,
#sidebar .widget dl ul,
#sidebar .widget ul ol,
#sidebar .widget ol ol,
#sidebar .widget dl ol,
#sidebar .widget ul dl,
#sidebar .widget ol dl,
#sidebar .widget dl dl {
  list-style: disc;
  margin-left: 20px;
}
#sidebar .search {
  margin-bottom: 30px;
}
#sidebar .search input {
  background: #fff;
  font-family: "Montserrat", "Noto Sans JP", Helvetica Neue, Helvetica, Arial, sans-serif;
  font-style: italic;
  font-size: 1em;
  padding: 10px 15px;
  border: 1px solid #ddd;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: #999;
}
#sidebar .search input:focus {
  color: #000;
}
#sidebar .archive-list-count,
#sidebar .tag small {
  margin-left: 15px;
  color: #999;
}
#sidebar .archive-list-count:before,
#sidebar .tag small:before {
  content: '(';
}
#sidebar .archive-list-count:after,
#sidebar .tag small:after {
  content: ')';
}
#sidebar .twitter li {
  border-bottom: 1px solid #ddd;
  padding: 15px 20px;
  font-size: 0.9em;
}
#sidebar .twitter li:last-of-type {
  border-bottom: none;
}
#sidebar .twitter small {
  display: block;
  margin-top: 10px;
  color: #999;
  line-height: 1;
}
#sidebar .tagcloud .entry {
  padding-right: 5px;
}
#sidebar .tagcloud a {
  margin-right: 10px;
  display: inline-block;
}
#sidebar .widget-toc .entry {
  padding-right: 15px;
}
#sidebar .widget-toc .toc {
  list-style: none;
  margin: 0;
  padding-left: 0;
}
#sidebar .widget-toc .toc ol {
  list-style: none;
  margin: 4px 0 0;
  padding-left: 16px;
}
#sidebar .widget-toc .toc li {
  margin: 5px 0;
}
#sidebar .widget-toc .toc a {
  color: #000;
  text-decoration: none;
}
#sidebar .widget-toc .toc a:hover {
  color: #3579e4;
}
#footer {
  color: #000;
  padding-left: 4px;
  margin-bottom: 50px;
  font: 0.9em/1.6;
}
#footer a {
  color: #000;
}
#footer a:hover {
  text-decoration: none;
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter: alpha(opacity=70);
}
.entry .gist {
  background: #eee;
  border: 1px solid #ddd;
  margin-top: 15px;
  padding: 7px 15px;
  border-radius: 2px;
  text-shadow: 0 0 1px #fff;
  line-height: 1.6;
  overflow: auto;
  color: #666;
}
.entry .gist .gist-file {
  border: none;
  font-family: inherit;
  margin: 0;
  font-size: 0.9em;
}
.entry .gist .gist-file .gist-data {
  background: none;
  border-bottom: none;
}
.entry .gist .gist-file .gist-data pre {
  padding: 0 !important;
  font-family: Monaco, Menlo, Consolas, Courier New, monospace;
}
.entry .gist .gist-file .gist-meta {
  background: none;
  color: #999;
  margin-top: 5px;
  padding: 0;
  text-shadow: 0 0 1px #fff;
  font-size: 100%;
}
.entry .gist .gist-file .gist-meta a {
  color: #3579e4;
}
.entry .gist .gist-file .gist-meta a:visited {
  color: #3579e4;
}
figure.highlight {
  background: #eee;
  border: 1px solid #ddd;
  margin-top: 15px;
  padding: 7px 15px;
  border-radius: 2px;
  text-shadow: 0 0 1px #fff;
  line-height: 1.6;
  overflow: auto;
  position: relative;
  font-size: 0.9em;
}
figure.highlight figcaption {
  color: #999;
  margin-bottom: 5px;
  text-shadow: 0 0 1px #fff;
}
figure.highlight figcaption a {
  position: absolute;
  right: 15px;
}
figure.highlight pre {
  border: none;
  padding: 0;
  margin: 0;
}
figure.highlight table {
  margin-top: 0;
  border-spacing: 0;
}
figure.highlight .gutter {
  color: #999;
  padding: 0;
  padding-right: 15px;
  border: 0;
  border-right: 1px solid #ddd;
  text-align: right;
}
figure.highlight .code {
  padding-left: 15px;
  border: 0;
  border-left: 1px solid #fff;
  color: #666;
}
figure.highlight .line {
  height: 20px;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
figure.highlight .line.marked {
  background: #d6d6d6;
}
pre .comment,
pre .template_comment,
pre .diff .header,
pre .doctype,
pre .pi,
pre .lisp .string,
pre .javadoc {
  color: #93a1a1;
  font-style: italic;
}
pre .keyword,
pre .winutils,
pre .method,
pre .addition,
pre .css .tag,
pre .request,
pre .status,
pre .nginx .title {
  color: #859900;
}
pre .number,
pre .command,
pre .string,
pre .tag .value,
pre .phpdoc,
pre .tex .formula,
pre .regexp,
pre .hexcolor {
  color: #2aa198;
}
pre .title,
pre .localvars,
pre .chunk,
pre .decorator,
pre .built_in,
pre .identifier,
pre .vhdl,
pre .literal,
pre .id {
  color: #268bd2;
}
pre .attribute,
pre .variable,
pre .lisp .body,
pre .smalltalk .number,
pre .constant,
pre .class .title,
pre .parent,
pre .haskell .type {
  color: #b58900;
}
pre .preprocessor,
pre .preprocessor .keyword,
pre .shebang,
pre .symbol,
pre .symbol .string,
pre .diff .change,
pre .special,
pre .attr_selector,
pre .important,
pre .subst,
pre .cdata,
pre .clojure .title {
  color: #cb4b16;
}
pre .deletion {
  color: #dc322f;
}