@media screen and (max-width: 1400px){
  /* ヘッダー */
  header>div{
    margin-left: 120px;
    margin-right: 120px;
  }
  /* メインビジュアル */
  .mv{
    height: 720px;
  }
  .mv_img{
    height: 553px;
    left: 120px;
  }
  .mv>div{
    margin-left: 120px;
    margin-right: 120px;
  }
  /* About */
  .about{
    height: 720px;
  }
  .about_back1{
    height: 564px;
    top: 156px;
    bottom: 30px;
    }
  .about span.line1, .about span.line2 {
    height: 564px;
    top: 156px;
    bottom: 30px;
  }
  .activity>div{
    margin-left: 120px;
    margin-right: 120px;
  }
  .about>div>div{
    width: 520px;
  }
  .about_name{
    margin-bottom: 40px;
  }
  .about_introduction{
    width: 502px;
    letter-spacing: 0px;
  }
  /* Activity */
  .activity{
    height: 720px;
  }
  .activity img{
    width: 100%;
    height: 400px;
    object-fit: cover;
  }
  .caption{
    font: normal normal bold 24px/30px Noto Sans CJK JP;
  }
  .caption img{
    width: 80px;
    height: 80px;
  }
  /* Goods */
  .goods{
    height: 1240px;
  }
  .goods>div{
    margin-left: 120px;
    margin-right: 120px;
    height: 936px;
    background-color: #FFFFFF;
    z-index: 1;
  }
  .goods>div>div div{
    height: 440px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .goods>div>div{
    width: 97%;
  }
  .goods>div>div img{
    width: 320px;
    height: 320px;
  }
  .goods_name{
    font: normal normal bold 32px/48px Noto Sans CJK JP;
    margin-top: 0;
  }
  .goods_price{
  font: normal normal bold 32px/48px Noto Sans CJK JP;
  margin-top: 16px;
  }
  .goods button>div{
    width: 560px;
    height: 160px;
    font: normal normal bold 32px/48px Noto Sans CJK JP;
  }
  .goods button>div>div{
    width: 525px;
    height: 128px;
  }
  /* Contact  */
  .contact{
    height: 600px;
  }
  .contact button>div{
    width: 560px;
    height: 160px;
    font: normal normal bold 32px/48px Noto Sans CJK JP;
  }
  .contact button>div>div{
    width: 525px;
    height: 128px;
  }
  /* Link  */
  .link{
    height: 600px;
  }
  /* footer */
  footer>div{
    margin-left: 120px;
    margin-right: 120px;
  }
}
@media screen and (max-width: 1280px){
  header ul{
    display: none;
  }
  .hamburger_menu{
    display: inline;
  }
  .mv_img{
    left: 0;
    object-fit: cover;
    object-position: left;
  }
  .about{
    height: 1367px;
  }
  .about_back2{
    display: inline;
    position: absolute;
    width: 100%;
    height: 1180px;
    top: 147px;
    bottom: 40px;
    }
  .about_back1{
    display: none;
  }
  .about span.line1, .about span.line2 {
    height: 1180px;
    top: 147px;
    bottom: 40px;
  }
  .about>div{
    flex-direction: column-reverse;
    align-items: center;
    justify-content: flex-start;
  }
  .about h2{
    margin-bottom: 160px;
  }
  .about>div img{
    width: 520px;
  }
  .about_name{
    margin-bottom: 40px;
    margin-top: 40px;
  }
  .about_introduction{
    width: 536px;
    letter-spacing: 1.54px;
  }
  div.activity1 .mask:hover, div.activity2 .mask:hover,
  div.activity3 .mask:hover, div.activity4 .mask:hover, 
  div.activity5 .mask:hover{
    padding-top: 88px
  }
  .caption{
    font: normal normal bold 16px/24px Noto Sans CJK JP;
    letter-spacing: 0.51px;
  }
  .link_icon2{
    margin-left: 40px;
    margin-right: 40px;
  }
}
@media screen and (max-width: 840px){
    /* ヘッダー */
    header>div{
      margin-left: 48px;
      margin-right: 48px;
    }
  /* メインビジュアル */
  .mv_img{
    height: 600px;
    width: 100%;
  }
  .mv>div{
    margin-left: 48px;
    margin-right: 48px;
    align-items: baseline;
  }
  .mv h1{
    position: relative;
    top: 357px;
    text-shadow:1px 1px 0 #050000, -1px -1px 0 #050000,
    -1px 1px 0 #050000, 1px -1px 0 #050000,
    0px 1px 0 #050000,  0 -1px 0 #050000,
    -1px 0 0 #050000, 1px 0 0 #050000;
  }
  /* About */
  .about{
    height: 1252px;
  }
  .about_back2{
    margin: 0;
    width: 100%;
    height: 1080px;
    top: 132px;
    bottom: 40px;
    }
  .about span.line1, .about span.line2 {
    height: 1080px;
    top: 132px;
    bottom: 40px;
  }
  .about h2{
    font: normal normal bold 64px/92px Noto Sans CJK JP;
    margin-bottom: 120px;
  }
  .about h2::after, .about h2::before{
    width: 190px;
  }
  .about>div{
    margin-left: 48px;
    margin-right: 48px;
  }
  .about>div>div{
    width: 536px;
  }
  .about>div img{
    width: 536px;
  }
  .about_name{
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .about_introduction{
    width: 536px;
    font: normal normal normal 24px/48px Noto Sans CJK JP;
    letter-spacing: 1.54px;
  }
  /* Activity  */
  .activity{
    height: 720px;
  }
  .activity h2{
    font: normal normal bold 64px/92px Noto Sans CJK JP;
  }
  .activity h2::after, .activity h2::before{
    width: 240px;
  }
  .activity>div{
    margin-left: 48px;
    margin-right: 48px;
    justify-content: center;
  }
  .activity2{
    display: none;
  }
  .activity>div>div{
    width: 25%;
    width: 134px;
    height: 400px;
  }
  .caption{
    font: normal normal bold 16px/24px Noto Sans CJK JP;
    letter-spacing: 0.51px;
  }
  .caption img{
    margin-top: 68px;
  }
  div.activity1 .mask:hover, div.activity2 .mask:hover,
  div.activity3 .mask:hover, div.activity4 .mask:hover, 
  div.activity5 .mask:hover{
    padding-top: 84px
  }
  /* Goods  */
  .goods{
    align-items: center;
  }
  .goods h2{
    font: normal normal bold 64px/92px Noto Sans CJK JP;
  }
  .goods h2::after, .goods h2::before{
    width: 199px;
  }
  .goods>div{
    margin-left: 48px;
    margin-right: 48px;
    width: 536px;
  }
  .goods>div>div{
    width: 94%;
  }
  .goods>div>div div{
    width: 400px;
  }
  .goods>div>img{
    margin-right: 32px;
  }
  .goods>div>p{
    margin-right: 38.5px;
  }
  .goods button>div{
    width: 472px;
    height: 160px;
    font: normal normal bold 32px/48px Noto Sans CJK JP;
  }
  .goods button>div>div{
    width: 437px;
    height: 128px;
  }
  /* Contact */
  .contact{
    height: 600px;
  }
  .contact h2{
    font: normal normal bold 64px/92px Noto Sans CJK JP;
  }
  .contact h2::after, .contact h2::before{
    width: 246px;
  }
  .contact button>div{
    width: 472px;
    height: 160px;
  }
  .contact button>div>div{
    width: 437px;
    height: 128px;
  }
  /* Link */
  .link{
    height: 600px;
  }
  .link h2{
    font: normal normal bold 64px/92px Noto Sans CJK JP;
  }
  .link h2::after, .link h2::before{
    width: 136px;
  }
  .link img{
    width: 160px;
    height: 160px;
  }
  .link_icon2{
    margin-left: 28px;
    margin-right: 28px;
  }

  /* footer */
  footer{
    height: 360px;
  }
  footer>div{
    margin-left: 48px;
    margin-right: 48px;
  }
}
@media screen and (max-width: 540px){
  /* メインビジュアル */
  .mv>div{
    align-items: flex-end;
  }
  .mv h1{
    top: 0;
    margin-bottom: 64px;
}
  /* About */
  span.line1,span.line2{
    display: none;
  }
  .about{
    height: 997px;
  }
  .about_back2{
    display: none;
  }
  .about_back3{
    display: inline;
    position: absolute;
    width: 100%;
    height: 824px;
    top: 134px;
  }
  .about span.line1, .about span.line2 {
    height: 868px;
    top: 88px;
  }
  .about h2{
    margin-bottom: 88px;
    z-index: 1;
  }
  .about>div img{
    width: 264px;
  }
  .about>div>div{
    width: 380px;
  }
  .about_name{
    margin-top: 0;
    margin-bottom: 16px;
  }
  .about_introduction{
    width: 380px;
    font: normal normal normal 24px/40px Noto Sans CJK JP;
    letter-spacing: 0px;
  }
  /* Activity */
  .activity{
    align-items: center;
  }
  .activity>div{
    margin-left: 0px;
    margin-right: 0px;
    width: 70%;
    height: 400px;
    flex-wrap: wrap;
  }
  .activity>div>div{
    width: 50%;
    height: 200px;
  }
  .activity img{
    height: 200px;
  }
  .caption{
    text-align: center;
    font: normal normal bold 32px/60px Noto Sans CJK JP;
    letter-spacing: 1.02px;
    color: #FFFFFF;
    height: 100%;
  }
  .caption img{
    margin-top: inherit;
    width: 125px;
    height: 125px;
  }
  .activity1 .caption img,.activity4 .caption img{
    margin-top: 32px;
  }
  .activity3 .caption img,.activity5 .caption img{
    margin-top: 8px;
  }
  .caption{
    font: normal normal bold 16px/24px Noto Sans CJK JP;
    letter-spacing: 0.51px;
  }
  .caption img{
    width: 80px;
    height: 80px;
  }
  div.activity1 .mask:hover, div.activity2 .mask:hover,
  div.activity3 .mask:hover, div.activity4 .mask:hover, 
  div.activity5 .mask:hover{
    padding-top: 24px
  }
  /* Goods */
  .goods h2{
    margin-bottom: 40px;
  }
  .goods{
    height: 1082px;
  }
  .goods>div{
    height: 830px;
    width: 380px;
  }
  .goods>div>div div{
    width: 264px;
    height: 440px;
    margin: 16px 0 0 24px;
  }
  .goods>div>div img{
    width: 224px;
    height: 224px;
  }
  .goods_name{
    font: normal normal bold 32px/48px Noto Sans CJK JP;
    margin-top: 40px;
  }
  .goods_price{
    margin-top: 16px;
    font: normal normal bold 32px/48px Noto Sans CJK JP;
  }
  .goods>div>img{
    margin-right: 24px;
  }
  .goods button>div{
    width: 264px;
    height: 96px;
    font: normal normal bold 16px/48px Noto Sans CJK JP;
  letter-spacing: 0.96px;
  }
  .goods button>div>div{
    width: 229px;
    height: 64px;
  }
  /* Contact */
  .contact{
    height: 480px;
  }
  .contact button>div{
    width: 264px;
    height: 96px;
    font: normal normal bold 16px/48px Noto Sans CJK JP;
    letter-spacing: 0.51px;
  }
  .contact button>div>div{
    width: 229px;
    height: 64px;
  }
  /* Link */
  .link{
    height: 480px;
  }
  .link img{
    width: 88px;
    height: 88px;
  }
  .link_icon2{
    margin-left: 16px;
    margin-right: 16px;
  }

}
@media screen and (max-width: 480px){
  span.line1,span.line2{
    display: none;
  }
  header>div{
    margin-left: 8px;
    margin-right: 8px;
  }
  header p a{
    font: normal normal normal 48px/70px DotGothic16;
  }
  .mv h1{
    font: normal normal normal 80px/139px DotGothic16;
  }
  .activity>div {
    width: 94%;
  }
  .about>div>div{
    width: 100%;
  }
  .about_introduction{
    width: 100%;
    font: normal normal normal 16px/32px Noto Sans CJK JP;
    letter-spacing: 0px;
  }
  .goods>div{
    width: 100%;
  }
  .goods>div>div{
    width: 97%;
  }
  .goods>div>div div {
    margin: 16px 0 0 8px;
  }
  .goods>div>img {
    margin-right: 8px;
  }
  .goods>div>p {
    margin-right: 14.5px;
  }
  .link_icon2{
    margin-left: 0px;
    margin-right: 0px;
  }
  footer>div{
    margin-left: 8px;
    margin-right: 8px;
  }
  footer li{
    font: normal normal bold 24px/35px Noto Sans CJK JP;
  }
  footer>div>div p{
    font: normal normal normal 48px/70px DotGothic16;
  }
}
@media screen and (max-width: 280px){
  .mv_img{
    width: 120%;
    left: -40px;
  }
}