body .w80 {
  width: 80vw;
}

/* ----------------------------
mv
---------------------------- */
.mv {
  padding-top: calc(50px + 1.2vw);
  background-color: #d5d9db;
}

.mv_1 .mv_title {
  font-size: 3.8vw;
  top: 50%;
  left: 10%;
}

@media screen and (max-width: 880px) {
  .mv {
    padding-top: 13vw;
  }
  .mv img {
    height: unset;
  }
  .mv_1 .mv_title {
    font-size: 10vw;
    top: 58%;
  }
}
.section_ttl .section_ttl_sub {
  font-style: normal;
}

@media screen and (max-width: 880px) {
  .section_ttl .section_ttl_sub {
    font-size: 5vw;
    margin: 0.5em 0;
  }
  .styleguide .styleguide_desc p {
    font-size: 3.4vw;
    line-height: 2em;
  }
}
.styleguide {
  padding-top: 3.5vw;
  padding-bottom: 3.5vw;
}

.styleguide .section_ttl {
  text-align: center;
}

.styleguide .styleguide_desc {
  text-align: center;
  font-size: 0.84vw;
  line-height: 2.2em;
  margin-bottom: 5em;
}

.styleguide_nav {
  margin: 0 auto;
  padding: 0 2vw;
}
.styleguide_nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 2em;
  row-gap: 1.5em;
  width: 100%;
  justify-content: center;
}
.styleguide_nav ul li {
  flex: 0 1 calc((100% - 4em) / 3);
}
.styleguide_nav ul li a {
  display: block;
  border: 1px solid #fff;
  border-radius: 100em;
  padding: 1.3em 2em;
  line-height: 1;
  text-align: center;
  color: #fff;
  text-decoration: none;
  font-size: 0.84vw;
  background-color: #00a0e9;
  font-weight: 500;
  position: relative;
  transition: all ease 0.3s;
}
.styleguide_nav ul li a:hover {
  opacity: 0.7;
}
.styleguide_nav ul li a:after {
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  background-image: url(../img/styleguide/pointer_bottom.svg);
  background-size: contain;
  background-position: center;
  position: absolute;
  right: 1.5em;
  top: 39%;
  background-repeat: no-repeat;
}
.styleguide_nav.styleguide_navFixed {
  top: 4em;
  position: fixed;
  width: 100%;
  visibility: hidden;
  opacity: 0;
  transition: all ease 0.3s;
  transform: translate3d(0, -2em, 0);
}
.styleguide_nav.styleguide_navFixed.fixed {
  visibility: visible;
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.styleguide_nav.styleguide_navFixed ul {
  margin: 0 auto;
  width: 65vw;
  box-sizing: content-box;
  justify-content: center;
  gap: 0.3em;
}
.styleguide_nav.styleguide_navFixed ul li {
  flex: 1;
}
.styleguide_nav.styleguide_navFixed ul li a {
  font-size: 0.7vw;
  padding: 1.3em 0.5em;
}

@media screen and (max-width: 880px) {
  body .styleguide_nav.w65 {
    width: 100%;
    padding: 0 5vw;
  }
  .styleguide_nav ul {
    margin: 0 auto;
    width: 100%;
    box-sizing: content-box;
    justify-content: center;
    gap: 0.3em;
    flex-wrap: wrap;
    flex-direction: column;
  }
  .styleguide_nav ul li {
    flex: 0 1 calc((100% - 0.6em) / 3);
  }
  .styleguide_nav ul li a {
    font-size: 2.8vw;
    padding: 1.3em 0.5em;
    line-height: 1.3;
    font-size: 3.4vw;
  }
  .styleguide_nav.styleguide_navFixed {
    bottom: 5vw;
    position: fixed;
    width: 100%;
    transition: all ease 0.3s;
    margin: 0 auto;
    padding: 0 0;
    top: auto;
  }
  .styleguide_nav.styleguide_navFixed ul {
    margin: 0 auto;
    width: 100%;
    box-sizing: content-box;
    justify-content: center;
    gap: 0.3em;
    flex-wrap: wrap;
    flex-direction: row;
  }
  .styleguide_nav.styleguide_navFixed ul li {
    flex: 0 1 calc((100% - 4em) / 3);
  }
  .styleguide_nav.styleguide_navFixed ul li a {
    font-size: 2.8vw;
    padding: 1em 0.5em;
    line-height: 1.3;
  }
  .styleguide_nav.styleguide_navFixed ul li a:after {
    display: none;
  }
  .styleguide_nav.styleguide_navFixed {
    transform: translate3d(0, 2em, 0);
  }
}
.styleguide_list {
  padding-top: 2em;
}

.styleguide_list_group {
  padding-bottom: 3em;
}
.styleguide_list_group h2 {
  background-color: #000;
  color: #00afff;
  text-align: center;
  font-size: 160%;
  padding: 0.2em 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3em;
}
.styleguide_list_group h2 b {
  font-size: 52%;
  display: inline-block;
  border: 2px solid #00afff;
  padding: 0 0.5em;
}

.styleguide_list_group_item {
  padding-bottom: 4em;
  padding-top: 1.5em;
}
.styleguide_list_group_item h3 {
  background-color: #00afff;
  color: #fff;
  text-align: center;
  font-size: 112%;
  padding: 0.2em 1em;
  margin: 0 auto;
  margin-bottom: 1.5em;
  max-width: 22em;
}

.styleguide_list_group_item_in {
  margin-bottom: 1em;
}
.styleguide_list_group_item_in > p {
  text-align: center;
  margin-top: 0.3em;
  font-size: 0.84vw;
}
.styleguide_list_group_item_in ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 1em;
}
.styleguide_list_group_item_in ul li {
  flex: 1;
}

.sanchor {
  display: block;
  transform: translate3d(0, -6em, 0);
}

.sanchorF {
  transform: translate3d(0, -7.5em, 0);
}

@media screen and (max-width: 880px) {
  .styleguide_list_group h2 {
    font-size: 130%;
    padding: 0.5em 1em;
  }
  .styleguide_list_group h2 b {
    font-size: 68%;
  }
  .styleguide_list_group_item_in ul {
    flex-wrap: wrap;
  }
  .styleguide_list_group_item_in ul li {
    flex: 0 1 calc((100% - 1em) / 2);
  }
  .styleguide_list_group_item_in > p {
    font-size: 3vw;
  }
  .styleguide_list_group_item_in {
    margin-bottom: 2em;
  }
  .styleguide_list_group_item:last-child {
    padding-bottom: 0;
  }
  .sanchor {
    transform: translate3d(0, -1.5em, 0);
  }
  .sanchorF {
    transform: translate3d(0, -3.5em, 0);
  }
}/*# sourceMappingURL=gm_styleguide.css.map */