@charset "UTF-8";
/* Scss Document
*****************************************************************/
/* mixin
*********************************************************************/
/* カラー */
/* media query */
/* SP縦から */
/* SP横から */
/* タブレット縦から */
/* フルワイド */
/* 1650 */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;400;600;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap");
/* サイトマップ
*****************************************************************/
.main_upage {
  background: url("../images/main.jpg") no-repeat center center/cover;
}

.area_content {
  display: flex;
}
@media all and (max-width: 480px) {
  .area_content {
    display: block;
  }
}
.area_content > ul {
  width: calc(33.3333% - 20px);
  margin: 10px;
}
@media all and (max-width: 480px) {
  .area_content > ul {
    width: 100%;
    margin: 0;
  }
}
.area_content > ul > li {
  padding: 15px 0;
  box-sizing: border-box;
}
.area_content > ul > li > a {
  background-color: #0081CC;
  color: #fff;
  padding: 15px 10px;
  box-sizing: border-box;
  display: block;
}
.area_content > ul > li > a:hover {
  opacity: 0.5;
}
.area_content > ul > li > ul {
  margin: 10px 0 0 1em;
}
.area_content > ul > li > ul > li {
  padding: 5px 0;
  box-sizing: border-box;
}
.area_content > ul > li > ul > li::before {
  content: "-";
  font-size: 2rem;
}
.area_content > ul > li > ul > li > a {
  color: #000;
  padding: 10px;
  box-sizing: border-box;
}
.area_content > ul > li > ul > li > a:hover {
  color: #0081CC;
}