@media only screen and (max-width: 767px) {
  /* monjiro SP
  =================================================================== */
  .monjiro {
    position: relative;
    overflow: hidden;
    background: url(../img/contents/monjiro/bg--sp.jpg) no-repeat center top;
    background-size: cover; }

  .text {
    max-width: 375px;
    width: 100%;
    height: 80px;
    background: url(../img/contents/monjiro/text--sp.png) no-repeat center top;
    background-size: 100% auto;
    margin: 37% auto 0; }

  .bg__top {
    display: none; }

  .monjiro__container {
    width: 92.5%;
    height: 0;
    padding-top: 245.8%;
    margin-bottom: 31%; }
    .monjiro__container .monjiro__container--list {
      margin-right: -6px; }
      .monjiro__container .monjiro__container--list li {
        width: calc(33.333333% - 6px);
        margin-right: 6px;
        margin-bottom: 10px;
        padding-top: calc(52% - 6px);
        background-image: url(../img/contents/monjiro/list__off.png);
        background-repeat: no-repeat;
        background-position: left top;
        background-size: 100% auto; }

  .balloon__cap {
    display: none;
    width: 18.2%;
    padding-top: 9.5%;
    height: 0;
    position: absolute;
    right: 70.2%;
    top: 91.3%; }
    .balloon__cap span {
      display: block;
      height: 0;
      position: absolute; }
      .balloon__cap span.balloon__cap--1 {
        background: url(../img/contents/monjiro/balloon__cap--1.png) no-repeat left top;
        background-size: 100% auto;
        width: 7%;
        padding-top: 6.2%;
        right: 0;
        top: 28%; }
      .balloon__cap span.balloon__cap--2 {
        background: url(../img/contents/monjiro/balloon__cap--2.png) no-repeat left top;
        background-size: 100% auto;
        width: 8%;
        padding-top: 7.1%;
        right: 11%;
        top: 38%; }
      .balloon__cap span.balloon__cap--3 {
        background: url(../img/contents/monjiro/balloon__cap--3.png) no-repeat left top;
        background-size: 100% auto;
        width: 78%;
        padding-top: 53%;
        left: 0;
        top: 0; }

  .balloon__cin {
    display: none;
    width: 19.3%;
    padding-top: 8.2%;
    height: 0;
    position: absolute;
    left: 68.9%;
    top: 91.4%; }
    .balloon__cin span {
      display: block;
      height: 0;
      position: absolute; }
      .balloon__cin span.balloon__cin--1 {
        background: url(../img/contents/monjiro/balloon__cin--1.png) no-repeat left top;
        background-size: 100% auto;
        width: 7%;
        padding-top: 6.2%;
        left: 0;
        top: 0; }
      .balloon__cin span.balloon__cin--2 {
        background: url(../img/contents/monjiro/balloon__cin--2.png) no-repeat left top;
        background-size: 100% auto;
        width: 8%;
        padding-top: 7.1%;
        left: 8%;
        top: 10%; }
      .balloon__cin span.balloon__cin--3 {
        background: url(../img/contents/monjiro/balloon__cin--3.png) no-repeat left top;
        background-size: 100% auto;
        width: 83%;
        padding-top: 43%;
        right: 0;
        top: 0; }

  .btn__back {
    width: 98px;
    height: 67px;
    margin-bottom: 15px; }

  .footer {
    bottom: 15px;
    left: 15px; }

  /* modal 
  =================================================================== */
  .m-modal__container {
    min-height: 620px; }

  .m-modal {
    width: 330px; }
    .m-modal .m-modal__close {
      width: 40px;
      height: 40px;
      top: -15px;
      right: -15px; } }
@media only screen and (max-width: 359px) {
  .m-modal__container {
    min-height: 533px;
    -webkit-transform: scale(0.86);
    transform: scale(0.86); } }