@charset "utf-8";

/* Web言語　メニュー */
.web-language-menu {
  width: 300px;
  margin: 10px 20px;
}
  
.web-language-menu ul {
  display: flex;
  justify-content: space-between;
}

.web-language-menu li span {
  padding: 5px 6px;
}

.html-menu-active span, .web-html:hover span {
  border-bottom: solid 3px #ad2f6b;
}

.css-menu-active span, .web-css:hover span {
  border-bottom: solid 3px #a9b900;
}

.js-menu-active span, .web-js:hover span {
  border-bottom: solid 3px #2181BF;
}

.web-language-sub-menu {
  margin-bottom: 50px;
}

.web-language-sub-menu ul {
  margin: 20px;
}

.web-language-sub-menu li {
  padding: 5px;
}

.web-language-list ul {
  margin: 10px 10px 20px;
  list-style: none;
}

#jsSubMenu01 {
  display: none;
}

.definition-word {
  margin-bottom: 50px;
}

.definition-word th {
  text-align: left;
  color: #ffffff;
}

tr .th-135 {
  width: 135px;
}

tr .td-top {
  vertical-align: top;
}



/* メインコンテンツ */
code {
  font-size: large;
}

code i {
  font-size: small;
}

.code-i {
  padding-left: 20px;
}

.code-syntax {
  padding: 0 20px 0 10px;
}

.code-syntax::before {
  padding-right: 5px;
  content: '◉';
}

.syntax-title {
  margin-top: 20px;
  font-weight: bold;
}

.syntax-content {
  margin-top: 5px;
  padding: 5px 20px 10px;
  background-color: beige;
}


  /* メインコンテンツ　JavaScript */
  .web-js-main-content #menuLink span {
    background-color: #2181BF;
    color: #ffffff;
  }

  .web-js-main-content h3::before, .web-js-sub-content h4, .js-syntax .code-syntax::before, .web-js-main-content caption::before, .web-js-main-content caption::after {
    color: #2181BF;
  }

  .web-js-main-content h3 {
    border-bottom: solid 3px #2181BF;
  }

  .web-js-sub-content h4 span {
    border-bottom: solid 2px #2181BF;
  }

  .web-js-sub-content .definition-word th {
    background-color: #2181BF;
  }



/* 画面が390pxより小さい時 */
@media (max-width: 390px) {

  .web-language-menu {
    margin: 10px auto;
  }

}