@charset "utf-8";
/* CSS Document */

body {
 margin: 0;
 padding: 0;
 font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
 *font-family: 'ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif;
}


/*     タブレット・PCのみにcss効かせたい場合これの中に記述


■パソコン

@media screen and (min-width:1024px){ここにcss}

■タブレット

@media screen and (min-width:768px){ここにcss}

■スマホ

@media screen and (max-width:767px){ここにcss}

*/

* { margin: 0; padding: 0; }

/* iOSのデバイス縦横でフォントサイズが変わるの防止用 */
body { -webkit-text-size-adjust: none; }

.allwrap {
  width: 100%;
  margin: 0px auto 30px;
  text-align: left;
  font-size: 18px;
  line-height: 160%;
  max-width: 639px;
}


.display {
  width: 100%;
  margin: 0px auto -20px;
  text-align: left;
  font-size: 18px;
  line-height: 160%;
  max-width: 639px;
}
.display img {
  width: 100%;
  margin: 0px auto -20px;
}

/* スマホ・タブレット */
@media screen and (max-width:639px){

.PC-display {
  display: none;
}


.smp-display {
  width: 100%;
  margin: 10px auto;
  max-width: 639px;
  text-align: center;
}

.smp-display img {
  width: 100%;
  margin: 10px auto 5px;
}

p.example {
  width: 95%;
  text-align: left;
  margin: 10px auto;
}

p.example .square {
  border: solid 3px #F00;
  padding: 2px 15px 1px;
}

p.example .square2 {
  border: solid 3px #F00;
  padding: 2px 15px 1px;
  text-align: right;
}


p.example .note-red {
  color: #F00;
  font-size: 14px;
}

p.example .note-red2 {
  color: #F00;
  font-size: 14px;
  text-align: right;
}

p.example-red {
  width: 95%;
  color: #F00;
  margin: 10px auto;
  text-align: left;
}

}

/* パソコン */
@media screen and (min-width:640px){
.display {
  width: 100%;
  margin: 0px auto -20px;
  text-align: left;
  font-size: 18px;
  line-height: 160%;
  min-width: 640px;
}
.display img {
  width: 100%;
}

.allwrap {
  width: 100%;
  margin: 0px auto;
  text-align: left;
  font-size: 18px;
  line-height: 180%;
}

.PC-display {
  width: 100%;
  min-width: 640px;
  margin: 10px auto;
  text-align: center;
}

.PC-display img {
  width: 100%;
  margin: 10px auto 15px;
  min-width: 640px;
}

.smp-display {
  display: none;
}

p.example {
  width: 80%;
  text-align: left;
  margin: 10px auto;
}

p.example .square {
  border: solid 3px #F00;
  padding: 2px 15px 1px;
}


p.example .note-red {
  color: #F00;
  font-size: 14px;
}

p.example .note-red2 {
  color: #F00;
  font-size: 14px;
  text-align: right;
  margin-left: auto;
    margin-right: 0;
}

p.example-red {
  width: 80%;
  color: #F00;
  margin: 10px auto;
  text-align: left;
}

}