body {
  background: #e3feaf;
  background: url("../../../howto/common/img/bg.jpg") repeat;
  background-size: 766px auto; }

.howtoWrapper .howto {
  margin: 50px auto;
  padding: 30px 0 50px;
  width: calc(min(98vw, 640px));
  background: url("../../../howto/common/img/bg.png") left top no-repeat #b0ee10;
  background-size: 900px auto;
  border-radius: 5px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.4); }
  .howtoWrapper .howto h2 {
    margin: 0 auto .3em;
    padding: .2em 0 .2em;
    font-size: 2rem;
    letter-spacing: 1px;
    line-height: 120%;
    width: 80%;
    text-align: center;
    font-family: UDKakugo_LargePr6-B; }
  .howtoWrapper .howto .howto_btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    margin-bottom: 20px; }
    .howtoWrapper .howto .howto_btns li {
      margin: 6px;
      width: 45%;
      letter-spacing: 1px; }
      .howtoWrapper .howto .howto_btns li button {
        width: 100%;
        padding: 10px 0;
        font-size: 1rem;
        border: none;
        border-radius: 5px;
        font-family: UDKakugo_LargePr6-B;
        cursor: pointer;
        color: #fff; }
    .howtoWrapper .howto .howto_btns li.app button,
    .howtoWrapper .howto .howto_btns li.google button {
      background: #3c5300; }
    .howtoWrapper .howto .howto_btns li.tw button {
      background: #1d9bf0; }
    .howtoWrapper .howto .howto_btns li.line button {
      background: #4cc764; }
    .howtoWrapper .howto .howto_btns li.yoyaku button {
      background: #df2b6d; }
  .howtoWrapper .howto .howto_main {
    position: relative;
    margin: 0 auto;
    width: 90%;
    padding-top: 20px;
    overflow: auto;
    border: 2px solid #ffffff;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.7); }
    .howtoWrapper .howto .howto_main .howto_main_contents {
      position: relative;
      width: 400%;
      display: flex;
      justify-content: center;
      align-items: flex-start; }
      .howtoWrapper .howto .howto_main .howto_main_contents li {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        margin: 0 1% 50px;
        width: 90%;
        background: #fff;
        border-radius: 5px; }
        .howtoWrapper .howto .howto_main .howto_main_contents li h3 {
          margin: 0 auto .5em;
          padding: .2em 0;
          font-size: 1.1rem;
          padding: 20px;
          width: 100%;
          text-align: center;
          background: #000;
          color: #fff;
          font-family: UDKakugo_LargePr6-B; }
        .howtoWrapper .howto .howto_main .howto_main_contents li div {
          position: relative;
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap: wrap;
          margin: 30px 0 0px;
          padding: 0;
          height: auto;
          text-align: center;
          font-size: 1rem;
          line-height: 1.2rem; }
          .howtoWrapper .howto .howto_main .howto_main_contents li div img {
            border: 1px solid #000;
            width: 80%;
            display: block;
            margin-bottom: 30px;
            margin-top: 1.2em; }
          .howtoWrapper .howto .howto_main .howto_main_contents li div img:last-child {
            margin-bottom: 0; }
  .howtoWrapper .howto .howto_goal {
    margin: 30px auto 60px;
    padding: .2em 0;
    font-size: 1.2rem;
    width: 90%;
    text-align: center;
    font-family: UDKakugo_LargePr6-B; }
  .howtoWrapper .howto .officialsite {
    background: #b0ee10;
    padding: 20px;
    display: block;
    max-width: 340px;
    letter-spacing: 1px;
    font-size: 1rem;
    border-radius: 5px;
    cursor: pointer;
    text-align: center;
    margin-bottom: 70px;
    font-family: UDKakugo_LargePr6-B;
    color: #000; }
  .howtoWrapper .howto .officialsite:hover {
    background: #d1ff5b; }

@media screen and (min-width: 940px) {
  .howtoWrapper .howto h2 {
    padding: 26px 0 26px; }
    .howtoWrapper .howto h2 br {
      display: none; } }