@media (max-width: 380px) {
  header .wrapper {
    width: 100%;
    height: auto;
    background-color: #fff;
    padding: 0px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    z-index: 10;
  }
  header .wrapper .header-logo {
    width: 50%;
    height: auto;
    padding: 20px 0 8px 0;
  }
  header .wrapper .header-logo h1 img {
    width: 100%;
  }
  header .wrapper .header-logo p {
    font-size: 8px;
    margin-top: 5px;
    letter-spacing: 1.2px;
  }
  header .wrapper .PDF-btn {
    height: auto;
  }
  header .wrapper .PDF-btn a p {
    font-size: 10px;
    font-weight: bold;
    color: white;
    letter-spacing: 1.2px;
    background-color: #E9546B;
    display: inline-block;
    padding: 10px 10px 8px 10px;
    border-radius: 30px;
  }
  header .wrapper .PDF-btn a p:hover {
    background-color: orange;
    border-radius: 30px;
  }
  main .wrapper .container {
    height: auto;
    width: auto;
  }
  .mainVisual {
    width: auto;
    height: 570px;
    color: #222;
    position: relative;
    background-color: #f4f2e9;
  }
  .mainVisual .main-ttl {
    width: 100%;
    height: auto;
    text-align: center;
    position: absolute;
    top: 18.5%;
    left: 50%;
    transform: translate(-50%, -18.5%);
  }
  .mainVisual .main-ttl h2 {
    color: white;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 1.8px;
    background-color: #E9546B;
    padding: 12px 0;
    margin-bottom: 20px;
  }
  .mainVisual .main-ttl p {
    font-size: 16px;
    letter-spacing: 1.2px;
    font-weight: bold;
  }
  .mainVisual .main-ttl p .border {
    background: linear-gradient(transparent 70%, #fadada 70%);
  }
  .mainVisual .main-ttl strong h1 {
    font-size: 40px;
    letter-spacing: 1.2px;
    padding: 10px 0 6px 0;
  }
  .mainVisual .main-ttl strong h1 .red {
    color: #d0324b;
  }
  .mainVisual .main-ttl strong h1 .orange {
    color: #ffb733;
  }
  .mainVisual .features {
    position: absolute;
    bottom: 4%;
  }
  .mainVisual .features .point-ttl {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
  }
  .mainVisual .features .point-ttl h3 {
    color: black;
    font-size: 18px;
    letter-spacing: 1.4px;
    line-height: 1.4;
  }
  .mainVisual .features .point-ttl img {
    width: 20px;
    height: auto;
  }
  .mainVisual .features .point-ttl .miror {
    transform: scale(-1, 1);
  }
  .mainVisual .features .point {
    width: 86%;
    height: auto;
    padding: 15px 0;
    margin: 0 auto;
    border: 5px solid #d0324b;
    border-radius: 25px;
  }
  .mainVisual .features .point h4 {
    width: 83%;
    font-size: 14px;
    letter-spacing: 1.2px;
    background: linear-gradient(transparent 70%, #fadada 70%);
    margin: 0 auto;
  }
  .mainVisual .features .point .flex {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
  }
  .mainVisual .features .point .flex img {
    flex: auto;
    width: 20%;
    margin: 0 5px;
  }
  .mainVisual .img01 {
    width: 53%;
    height: auto;
    position: absolute;
    bottom: 35%;
    right: 0%;
  }
  .mainVisual .img02 {
    width: 40%;
    height: auto;
    position: absolute;
    bottom: 35%;
  }
  .socialContributions {
    width: auto;
    height: auto;
    margin: 50px;
  }
  .socialContributions .te-ma-ttl {
    height: auto;
    text-align: center;
  }
  .socialContributions .te-ma-ttl h3 {
    font-size: 22px;
    width: 120px;
    color: black;
    background: linear-gradient(transparent 70%, #fadada 70%);
    margin: 0 auto 10px auto;
  }
  .socialContributions .te-ma-ttl .English {
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1.5px;
  }
  .socialContributions .content {
    margin-top: 25px;
  }
  .socialContributions .content img {
    width: 100%;
    height: 250px;
  }
  .socialContributions .content .text {
    height: auto;
    font-size: 16px;
    letter-spacing: 1.2px;
    line-height: 1.6;
    margin-top: 12px;
  }
  .trouble {
    text-align: center;
    background-color: #e6e6e6;
    padding: 50px 0 15px 0;
  }
  .trouble h3 {
    width: 290px;
    font-size: 22px;
    color: black;
    background: linear-gradient(transparent 80%, #fadada 70%);
    margin: 0 auto 10px auto;
  }
  .trouble .pc {
    display: none;
  }
  .trouble img {
    width: 100%;
    height: auto;
  }
  .solve {
    height: auto;
    padding: 50px 20px 20px;
  }
  .solve .solve-ttl {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .solve .solve-ttl h3 {
    color: black;
    font-size: 22px;
    letter-spacing: 1.4px;
    line-height: 1.2;
    text-align: center;
  }
  .solve .solve-ttl h3 .liner {
    background: linear-gradient(transparent 80%, #fadada 70%);
  }
  .solve .solve-ttl h3 .red {
    color: #d0324b;
  }
  .solve .solve-ttl h3 .orange {
    color: #ffb733;
  }
  .solve .solve-ttl .miror {
    transform: scale(-1, 1);
  }
  .solve .coment {
    font-size: 16px;
    letter-spacing: 1.4px;
    line-height: 1.5;
    margin: 12px 0 10px 0;
    text-align: center;
  }
  .solve ul {
    margin-top: 30px;
  }
  .solve ul li {
    height: auto;
    width: 75%;
    height: auto;
    margin: 30px auto;
  }
  .solve ul li h4 {
    width: 122px;
    font-size: 18px;
    letter-spacing: 1.3px;
    color: #d0324d;
    background: linear-gradient(transparent 70%, #fadada 70%);
    margin: 0 auto 15px auto;
  }
  .solve ul li h4 .number {
    font-size: 30px;
  }
  .solve ul li img {
    width: 100%;
    height: 210px;
  }
  .solve ul li p {
    font-size: 16px;
    letter-spacing: 1.5px;
    line-height: 1.8;
    margin: 12px 0 0 0;
  }
  .solve ul li p .acsent {
    background: linear-gradient(transparent 80%, #fadada 70%);
  }
  .surviceIntroduction {
    padding: 50px 50px 10px;
    background-color: #E9546B;
  }
  .surviceIntroduction .te-ma-ttl h3 {
    font-size: 22px;
    color: white;
    text-align: center;
    letter-spacing: 1.4px;
    margin-bottom: 10px;
  }
  .surviceIntroduction .te-ma-ttl .English {
    letter-spacing: 1.2px;
  }
  .surviceIntroduction .te-ma-ttl p {
    font-size: 16px;
    color: white;
    text-align: center;
    font-weight: bold;
  }
  .surviceIntroduction ol {
    margin: 30px 0;
  }
  .surviceIntroduction ol li {
    height: auto;
    margin: 40px 0;
  }
  .surviceIntroduction ol li .circle {
    width: 70%;
    height: auto;
    display: block;
    background-color: white;
    padding: 20px;
    margin: 15px auto;
    border-radius: 50%;
  }
  .surviceIntroduction ol li .circle img {
    width: 100%;
    height: auto;
  }
  .surviceIntroduction ol li h4 {
    width: 80px;
    font-size: 20px;
    color: white;
    letter-spacing: 1.3px;
    background: linear-gradient(transparent 70%, orange 70%);
    margin: 0 auto;
  }
  .surviceIntroduction ol li .step {
    color: white;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 1.4px;
    text-align: center;
  }
  .surviceIntroduction ol li .text {
    color: white;
    font-size: 16px;
    letter-spacing: 1.6px;
    line-height: 1.5;
    margin-top: 12px;
  }
  .customerVoice {
    height: auto;
    padding: 50px 30px 20px 30px;
  }
  .customerVoice .te-ma-ttl {
    height: auto;
    text-align: center;
  }
  .customerVoice .te-ma-ttl h3 {
    font-size: 22px;
    width: 80%;
    color: black;
    letter-spacing: 1.4px;
    background: linear-gradient(transparent 70%, #fadada 70%);
    margin: 0 auto 10px auto;
  }
  .customerVoice .te-ma-ttl .English {
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1.2px;
  }
  .customerVoice .customer {
    width: auto;
    height: auto;
    margin: 0 30px;
  }
  .customerVoice .customer .section01, .customerVoice .customer .section02 {
    width: auto;
    height: auto;
    margin: 30px 0;
  }
  .customerVoice .customer .section01 img, .customerVoice .customer .section02 img {
    width: 100%;
    height: auto;
  }
  .customerVoice .customer .section01 .content, .customerVoice .customer .section02 .content {
    margin-top: 20px;
  }
  .customerVoice .customer .section01 .content .costomerName h4, .customerVoice .customer .section02 .content .costomerName h4 {
    font-size: 22px;
    letter-spacing: 1.4px;
  }
  .customerVoice .customer .section01 .content .costomerName h5, .customerVoice .customer .section02 .content .costomerName h5 {
    font-size: 14px;
    letter-spacing: 1.4px;
    line-height: 1.4;
    padding: 10px 0 15px 0;
    border-bottom: 7px double #d0324d;
  }
  .customerVoice .customer .section01 .content p, .customerVoice .customer .section02 .content p {
    width: auto;
    height: auto;
    font-size: 14px;
    letter-spacing: 1.4px;
    line-height: 1.8;
    margin-top: 15px;
  }
  .customerVoice .customer .section01 .content p .border, .customerVoice .customer .section02 .content p .border {
    background: linear-gradient(transparent 80%, #fadada 70%);
  }
  footer {
    height: auto;
  }
  footer .wrapper {
    color: white;
  }
  footer .wrapper .container {
    padding: 50px 0;
    background-color: #E9546B;
  }
  footer .wrapper .container .company-ttl {
    text-align: center;
    margin: 0 auto 40px auto;
  }
  footer .wrapper .container .company-ttl h3 {
    font-size: 22px;
    letter-spacing: 3px;
    padding-bottom: 10px;
  }
  footer .wrapper .container .company-ttl p {
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1.2px;
  }
  .company {
    padding: 0 50px;
  }
  .company ul > * + * {
    margin-top: 20px;
  }
  .company .border {
    width: 40%;
    font-size: 18px;
    font-weight: bolder;
    letter-spacing: 2px;
    border-bottom: 4px solid white;
    padding-bottom: 3px;
  }
  .company .style {
    margin-top: 8px;
    letter-spacing: 1.5px;
  }
  .copylight {
    width: auto;
    height: auto;
    text-align: center;
    margin: 20px 0;
  }
  .copylight img {
    width: 50%;
    height: auto;
  }
  .copylight p {
    font-size: 10px;
    color: black;
    margin: 8px 0;
  }
}