@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* CSS Remedy
*,*::before,*::after{box-sizing:border-box;}
html,body,section,div,span,h1,h2,h3,h4,p,ul,li,dl,dt,dd{margin:0;padding:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
ol,ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle;max-width:100%;}
canvas,img,svg,video{height:auto;}
audio{width:100%;}
svg{overflow:hidden;}
img {
  border-style: none
  -webkit-backface-visibility: hidden;
} */

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html, body {
  height: 100%;
}
img {
  max-width: 100%;
  vertical-align: top;
}
body {
  font-family: 'Noto Sans JP', sans-serif;
  line-height: 1;
  background-color: #ececec;
}

@media screen and (min-width: 761px) {
  .sp{display: none !important;}
}
@media screen and (max-width: 760px) {
  .pc{display: none !important;}
}

/* contents */
.contents {
  position: relative;
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  background-color: #fff;
}

.message {
  position: relative;
  width: 700px;
  margin: -175px auto 0;
  padding: 32px 35px 28px;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: .01em;
  text-align: justify;
  background: #fff;
  box-shadow: 0 1px 10px 1px rgba(0, 0, 0, 0.6);
}
.message p.sign {
  margin-top: -.1em;
  margin-right: .4em;
  font-weight: 500;
  text-align: right;
}
.message span {
  font-feature-settings: "palt";
}

.logo {
  width: 200px;
  margin: 0 auto;
  padding: 40px 0 60px;
}
.logo img {
  width: 100%;
}

@media screen and (max-width: 760px) {
  body {
    background-color: #fff;
  }
  .message {
    width: auto;
    margin: calc((70/760)*100vw) 0 0;
    padding: 0;
    font-size: calc((30/760)*100vw);
    text-align: center;
    box-shadow: none;
    /*position: relative;
    top: auto; left: auto;
    width: auto;
    margin-top: 2em;
    line-height: 1.6;
    text-align: center;*/
  }
  /*.message p {
    margin-top: 0.6em;
  }*/
  .message p.sign {
    margin: 1em 0 0;
    text-align: center;
  }
  .logo {
    width: calc((300/760)*100vw);
    margin: 0 auto;
    padding: calc((110/760)*100vw) 0 calc((80/760)*100vw);
  }
}
