/* =================================================================
		style for mobile
================================================================= */

@media screen and (max-width: 480px) {

  /* #common */
  body {
    line-height: 1.7;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    letter-spacing: 0;
  }

  .pc {
    display: none !important;
  }

  .sp {
    display: block !important;
  }


  /* =================================================================
		header
================================================================= */

  .site-header {
    width: 92%;
  }

  .head-title {
    width: 36%;
  }

  .btn-home {
    font-size: 1.3rem;
  }


  /* =================================================================
		#home
================================================================= */

  .home-hero {
    width: 100%;
    background: url(../img_old/bg_hero.jpg) center bottom / cover no-repeat;
  }

  .home-hero .wrap {
    min-width: auto;
    padding-top: 46px;
    align-items: flex-end;
  }

  .home-hero .txt {
    width: 92%;
    margin: 0 auto 32px;
  }

  .home-hero-download .download-list {
    width: 100%;
    margin-bottom: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
  }

  .home-hero-download .download-list li {
    width: 48%;
    margin-bottom: 0;
  }

  .home-hero .logo img {
    width: 80%;
  }

  .home-hero h2 {
    font-size: 1.6rem;
    margin-bottom: 24px;
  }

  .catchphrase {
    text-align: center;
    padding: 16px 0;
  }

  .catchphrase p {
    width: 90%;
    letter-spacing: 0.1em;
    font-size: 1.7rem;
  }

  .home-hero-download p {
    font-size: 1.4em;
    margin-bottom: 16px;
  }

  .home-hero .mobile {
    width: 65%;
    margin: 0 auto 0 3%;
  }

  .home-hero .watch {
    width: 35%;
    left: auto;
    right: 2%;
    bottom: -3%;
  }

  .home-hero .watch p {
    font-size: 1.6rem;
    letter-spacing: 0;
    position: absolute;
    bottom: 1.4em;
    white-space: nowrap;
  }

  .home-tagline {
    padding: 0;
  }

  .home-tagline .wrap {
    display: block;
    padding: 48px 0 32px;
  }

  .home-tagline .wrap .txt {
    width: 90%;
    margin: 0 auto;
  }

  .home-tagline h2 {
    font-size: 5.5vw;
    margin-bottom: 16px;
    color: #007fb7;
    text-align: center;
  }

  .home-tagline h3 {
    font-size: 1.8em;
    text-align: center;
    margin-bottom: 10px;
  }

  .home-tagline p {
    font-size: 1.35rem;
    margin-bottom: 20px;
  }

  .home-tagline .wrap .pct {
    width: 60%;
    margin: 0 auto 16px;
  }

  .home-tagline .wrap .pct img {
    bottom: auto
  }

  .home-sec .wrap {
    margin: 0 5%;
    padding-top: 48px;
  }

  .home-sec .txt {
    width: 100%;
  }

  .home-sec .pct {
    width: 100%;
    padding-top: 0;
    margin: 0 auto;
  }

  .home-sec .pct img {
    width: 100%;
  }

  .home-sec .txt .ttl-en {
    font-size: 3.8rem;
    margin-bottom: 16px;
    text-align: center;
  }

  .home-sec .txt h3 {
    font-size: 1.8rem;
    text-align: center;
    margin-bottom: 8px;
  }

  .home-sec .txt p {
    font-size: 1.35rem;
    margin-bottom: 16px;
  }

  .home-sec .txt .pct {
    margin-bottom: 16px;
  }

  .home-pinpoint {
    padding: 0;
  }

  .home-pinpoint .wrap {
    padding: 48px 0;
  }

  .home-design {
    position: relative;
  }

  .home-design .txt .ttl-en,
  .home-design .txt h3 {
    text-align: left;
  }

  .home-design .txt {
    width: 60%;
    margin: 0 0 16px auto;
    color: #fff;
    text-align: left;
    position: relative;
    z-index: 20;
  }

  .home-design .txt h3,
  .home-design .txt p {
    text-shadow: 0 0 7px rgba(0, 0, 0, .7);
  }

  .home-design .pct {
    width: 93%;
    margin: 0;
    position: absolute;
    left: -31%;
    bottom: -15px;
    opacity: 0.8;
    transform: rotate(-6deg);
  }

  .home-design .pct img {
    width: 100%;
    position: static;
  }

  .home-warning {
    padding: 0;
  }

  .home-warning .wrap {
    padding: 48px 0 32px;
  }

  .home-warning .txt h3 {
    margin-bottom: 16px;
  }

  .home-warning .pct {
    margin-bottom: 16px;
  }

  .home-realtime .txt {
    order: 0;
  }

  .foot-download {
    padding: 40px 5%;
  }

  .foot-download .logo img {
    width: 55%;
  }

  .foot-download p {
    font-size: 1.5rem;
  }

  .foot-download .download-list {
    width: 100%;
    margin-bottom: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
  }

  .foot-download .download-list li {
    width: 48%;
    margin: 0;
  }

  .site-footer {
    padding: 32px 0;
  }

  .foot-menu {
    margin-bottom: 24px;
  }

  .foot-menu ul {
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
  }

  .foot-menu ul li:first-child {
    border-left: none;
  }

  .foot-menu ul li {
    width: 47%;
    text-align: center;
    margin-bottom: 16px;
    padding: 0 0 4px;
    border-right: none;
    border-bottom: 1px solid #9a9a9a;
  }

  .head-link-tide {
    width: 90%;
    margin: 8px 0 0 10px;
    padding-left: 10px;
    font-size: 1.3rem;
    box-sizing: border-box;
  }

  /*--------------------
	privacy and rule
--------------------*/

  .privacy-content {
    width: 90%;
    margin: 0 auto;
  }

  .privacy-content h2 {
    font-size: 2.2rem;
    margin-bottom: 20px;
    padding-bottom: 8px;
  }

  .privacy-sec {
    margin-bottom: 32px;
  }

  .privacy-sec p {
    margin-bottom: 16px;
    overflow-wrap: break-word;
  }

  .privacy-sec ul {
    margin-bottom: 16px;
  }

  .privacy-sec h3 {
    font-size: 1.5em;
    margin-bottom: 8px;
  }


}