@media screen and (min-width: 600px){
  body{
    /* background: #ccc; */
    margin: 0;
    padding: 0 ;
    font-family:Arial, Helvetica, sans-serif;
  }
  header{
    margin-top: -20px;
    height: 100px;
    background: #000;
    color:white;
  }
  footer{
    height: 100px;
    background: #000;
    color:white;
  }
  a:hover{
    cursor: pointer;
  }
  .spacer_50{
    height:50px;
  }
  .spacer_100{
    height:100px;
  }
  .spacer_100_mobile{
    height:100px;
  }

  /* ビデオ */
  .mainvisual{
    width: 100vw;
    /* height: 100vh; */
    overflow: hidden;
  }
  video{
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    opacity:0.2;
    z-index: -10;
  }

  #return_btn{
    margin-top: 0px;
    width: 100px;
    height: 100px;
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index:300;
    border: 1px solid black;
    /* background-color:gray; */
    border-radius:50%;
    text-align: center;
    line-height: 100px;
    color: rgb(0, 0, 0);
    font-size:30px;
    box-shadow: 4px 4px 4px gray;
    transition: all 0.3s ease-out;
  }
  #return_btn:hover{
    width: 100px;
    height: 100px;
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index:300;
    /* border: 1px solid rgb(0, 0, 0); */
    /* background-color:gray; */
    border-radius:50%;
    text-align: center;
    line-height: 45px;
    box-shadow: 0px 0px 0px gray;
    transform: translate3d(5px, 5px, 0);
    transition: all 0.3s ease-out;
  }

  #top_title{
    margin-top:0;
    font-weight: bold;
    font-size:100px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    position: relative;
    top:10px;
    left:50px;
  }
  #header_block{
    width:400px;
    height: 100px;
    /* background: white; */
    position: fixed;
    top:0;
    right:0;
    z-index: 10000;
    transition: .5s;
  }
  #menu_pc{
    position: fixed;
    top:10px;
    right: 30px;
    z-index: 10000;
  }
  #menu_pc div{
    height:30px;
  }
  #menu_pc a{
    color:black;
  }
  #menu_pc a:hover{
    color:rgb(87, 87, 87);
    transition: .5s;
  }

  .box{
    position: relative;
    /* width: 100px;
    height: 100px; */
    text-align:center;
    font-size:50px;
  }

  #box1{
    /* background: blueviolet; */
    width:200px;
    /* height:300px; */
    margin: 70px 0 0 100px;
    transition: all 0.7s;
  }
  #box1:hover{
    scale:1.1;
    transition: all ease-out 0.8s;
  }

  #box2{
    /* background: lavender; */
    width:350px;
    /* height:220px; */
    margin: -50px 0 0 60px;
    opacity: 0.1;
  }

  #box3{
    /* background: forestgreen; */
    width:280px;
    /* height:200px; */
    margin: 120px 0 0 30px;
    transition: all 0.7s;
  }
  #box3:hover{
    scale:1.1;
    transition: all ease-out 0.8s;
  }

  #box4{
    /* background: gold; */
    width:360px;
    /* height:360px; */
    margin: 100px 0 0 40px;
    opacity: 0.1;
  }

  #box5{
    /* background: orangered; */
    width:210px;
    /* height:220px; */
    margin: 100px 0 0 30px;
    transition: all 0.7s;
  }
  #box5:hover{
    scale:1.1;
    transition: all ease-out 0.8s;
  }

  #box6{
    /* background: lightsalmon; */
    width:300px;
    /* height:120px; */
    margin: 190px 0 0 100px;
    opacity: 0.1;
  }

  #box7{
    /* background: papayawhip; */
    width:370px;
    /* height:370px; */
    margin: 100px 0 0 200px;
  }

  #box8{
    /* background: lime; */
    width:210px;
    /* height:210px; */
    margin: 20px 0 0 400px;
  }

  #box9{
    /* background: deeppink; */
    width:330px;
    /* height:330px; */
    margin: 100px 0 0 100px;
  }

  #box10{
    /* background: dimgray; */
    width:100px;
    /* height:100px; */
    margin: 30px 0 0 200px;
  }
  /* ＝＝＝＝＝＝＝＝＝＝ーホバー時、枠線が伸びるCSS＝＝＝＝＝＝＝＝＝＝＝ */
  /* ボーダー */
  .border {
    position: absolute;
    display: block;
    width: 1px;
    height: 1px;
    background-color: rgb(187, 187, 187);
    overflow: hidden;
    transition: 1s;
  }  
  /* 上ボーダー */
  .border.top {
    width: 80%;
    top: 100px;
    left: 50px;
    transform: translate3d(-150%, 0, 0);
  }
  /* 右ボーダー */
  .border.right {
    height: 80%;
    top: -50px;
    right: 50px;
    transform: translate3d(0, -150%, 0);
  }
  /* 下ボーダー */
  .border.bottom {
    width: 80%;
    right: 50px;
    bottom: 320px;
    transform: translate3d(150%, 0, 0);
  }
  /* 左ボーダー */
  .border.left {
    height: 80%;
    bottom: 50px;
    left: 50px;
    transform: translate3d(0, 150%, 0);
  }

  .readmore a{
    border-radius:10px;
    box-shadow: 4px 4px 4px gray;
    padding: 10px 15px;
    background-color: black;
    color: white;
    transition: all 0.3s;
  }
  .readmore a:hover{
    background-color: rgb(204, 204, 204);
    box-shadow: 0px 0px 0px gray;
    color: white;
    transform: translate(3px, 3px);
    transition: all 0.3s;
  }

  .youtube iframe{
    width:450px;
    height:250px;
  }

  #content p{
    text-shadow:2px 2px 3px gray;
  }

  .contents{
    /* background-color:white; */
  }

  #contents_1{
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
  }
  #contents_1 p{
    font-size:20px;
  }
  #contents_2{
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
  }
  #contents_2 p{
    text-align: left;
    font-size:20px;
  }
  #contents_3{
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
  }
  #contents_3 p{
    text-align: right;
    font-size:20px;
  }

  /* マウスオーバー */
  #contents_1:hover .border {
    transform: translate3d(0, 0, 0);
  }
  #contents_2:hover .border {
    transform: translate3d(0, 0, 0);
  }
  #contents_3:hover .border {
    transform: translate3d(0, 0, 0);
  }

  footer{
    text-align: center;
    padding-top: 10px;
    padding-bottom: 50px;
  }

  .sns_icon{
    margin: 20px 30px 30px 20px;
    width: 30px;
    transition: all ease-out 0.3s;
  }
  .sns_icon:hover{
    scale:1.3;
    transition: all ease-out 0.3s;
  }
}
