h1 {
  color: #1d2686;
  text-shadow:
    1px 1px #fff,
    -1px 1px #fff,
    -1px -1px #fff,
    1px -1px #fff,
    1px 0px #fff,
    0px 1px #fff,
    -1px 0px #fff,
    0px -1px #fff;
  font-size: 40px;/* IE8以下とAndroid4.3以下用フォールバック */
10
    font-size: calc(2.4rem + ((1vw - 0.64rem) * 2.1429));/* 24px~36pxで可変*/

  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
}

body {
  background-color: #eee;
  text-align: center;
}


body {
  margin: auto;
}
.top {
  position: relative;
}
.top img {
  width: 100%;
}
.top p1 {
  color: #599a48;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  font-family: "Helvetica Neue",
   Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  left: 52%;
  width: 67%;	
  margin: 0;
  padding: 0em 0em 1.5em;
  position: absolute;
  top: 26%;
  transform: translate(-50%, -50%);
}
.top p2 {
  color: #6a6a6a;
  font-weight: none;
  line-height: 1.5;
  text-align: center;
  font-family: "Helvetica Neue",
   Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  left: 52%;
  width: 67%;	
  margin: auto;
  padding: 0em 0em 0em;
  position: absolute;
  top: 40%;
  transform: translate(-50%, -50%);
}
.top p3 {
  color: #599a48;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  font-family: "Helvetica Neue",
   Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  left: 52%;
  width: 67%;	
  margin: 0;
  padding: 1em 0em 1.5em;
  position: absolute;
  top: 65%;
  transform: translate(-50%, -50%);
}

/*PCでは無効（改行しない）*/
.sma{
    display: none;
}

/*スマートフォンでは有効（改行する）*/
@media screen and (max-width:768px) {
    .sma{
        display: block;
    }
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}
.top p1 { font-size: 40px; }

@media only screen and (max-width: 540px) {
.top p1 { font-size:22px; }
}

@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}
.top p2 { font-size: 22px; }

@media only screen and (max-width: 540px) {
.top p2 { font-size:14px; }
}
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}
.top p3 { font-size: 32px; }

@media only screen and (max-width: 540px) {
.top p3 { font-size:20px; }
}