@charset "UTF-8";
.flets-manual {
  position: relative;
  width: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #333;
  line-height: 1.7;
  font-size: 1.6rem;
  font-family: 'Roboto', 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  background-color: #fff; }
  @media screen and (max-width: 768px) {
    .flets-manual {
      font-size: 1.4rem; } }
  .flets-manual__service-name .wrap {
    text-align: center;
    padding: 60px 20px; }
    @media screen and (max-width: 768px) {
      .flets-manual__service-name .wrap {
        padding: 25px 20px; } }
  .flets-manual__service-name .service-logos {
    display: inline-grid;
    grid-template-columns: repeat(2, auto);
    grid-template-rows: repeat(2, auto);
    gap: 30px;
    place-items: center; }
    @media screen and (max-width: 768px) {
      .flets-manual__service-name .service-logos {
        gap: 16px; } }
    .flets-manual__service-name .service-logos__logo img {
      width: auto; }
      @media screen and (max-width: 768px) {
        .flets-manual__service-name .service-logos__logo img {
          width: 100%; } }
      @media screen and (max-width: 768px) {
        .flets-manual__service-name .service-logos__logo img.dtihikari-logo {
          width: 60%; } }
  .flets-manual__howto {
    padding: 80px 0;
    background-color: #F5F7F9; }
    @media screen and (max-width: 768px) {
      .flets-manual__howto {
        padding: 50px 0; } }
    .flets-manual__howto .wrap {
      display: flex;
      flex-direction: column;
      gap: 80px; }
    .flets-manual__howto .manual-title {
      margin-bottom: 15px;
      padding: 0 0 10px 30px;
      font-size: 2.0rem;
      width: 100%;
      background: url(/common/image/setting_title_mail.png) no-repeat left 7px/22px auto, url(/common/image/title_line.png) no-repeat bottom; }
    .flets-manual__howto .manual-links__label {
      border-left: 1px solid #CCCCCC;
      border-top: 1px solid #CCCCCC;
      border-bottom: 1px solid #CCCCCC;
      width: 300px;
      vertical-align: middle;
      background-color: #DBF4FF; }
      @media screen and (max-width: 768px) {
        .flets-manual__howto .manual-links__label {
          width: 25%; } }
    .flets-manual__howto .manual-links__links {
      border-right: 1px solid #CCCCCC;
      border-top: 1px solid #CCCCCC;
      border-bottom: 1px solid #CCCCCC;
      padding: 20px; }

/*# sourceMappingURL=flets-manual.css.map */