/*----------　基準（PC）---------------*/
.example {
  position: relative;
  white-space: nowrap;
  }

  /*-------------ドイツ空（ニッポン）------------------*/    

  .example  .hidari-1 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 30%;
    left: 27%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }

  .example .hidari-1:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    }

  .example img {
    width: 100%;
    }
  /*-------------/ドイツ空（ニッポン）------------------*/

  /*-------------フランス陸（ブリュネ）------------------*/    

  .example  .hidari-9 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 43%;
    left: 20%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }
  
    .example .hidari-9:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
    }
  
    .example img {
    width: 100%;
    }
  /*-------------/フランス陸（ブリュネ）------------------*/

  /*-------------オランダ海------------------*/    

  .example  .hidari-2 {/*aタグを画像の真ん中に*/
  position: absolute;
  top: 61%;
  left: 23%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  /*以下装飾*/
  border-radius:10px;
  margin:0;/*余計な隙間を除く*/
  font-size: 18px;/*文字サイズ*/
  background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
  background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
  background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
  border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
  padding: 5px 10px;/*文字と線の間の余白*/
  color: rgb(0, 0, 0);/*文字色*/
  text-decoration: none;/*下線を表示させない*/
  }

  .example .hidari-2:hover{/*カーソルを当てたとき*/
  background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
  background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
  background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
  }

  .example img {
  width: 100%;
  }
  /*-------------/オランダ海------------------*/

  /*-------------日豪伊独仏海（ノーブル）------------------*/    

  .example  .hidari-3 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 73%;
    left: 48%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }
  
    .example .hidari-3:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }
  
    .example img {
    width: 100%;
    }
  /*-------------/日豪伊独仏海（ノーブル）------------------*/

  /*-------------ドイツ・スペイン空------------------*/  
  .example  .migi-1 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 32%;
    left: 71%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }

  .example .migi-1:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    }

  .example img {
    width: 100%;
    }
  /*-------------/ドイツ・スペイン空------------------*/  

  /*-------------イタリア空（ライジング）------------------*/    

  .example  .migi-4 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 42%;
    left: 77%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;/*角丸*/
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*上下 左右文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }

  .example .migi-4:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    }

  .example img {
    width: 100%;
    }
  /*-------------/イタリア空（ライジング）------------------*/

  /*-------------フランス空------------------*/  
  .example  .migi-2 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 53%;
    left: 80%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }

  .example .migi-2:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
    }

  .example img {
    width: 100%;
    }
  /*-------------/フランス空------------------*/  

  /*-------------トルコ海------------------*/  
  .example  .migi-3 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 64%;
    left: 78%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }

  .example .migi-3:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }

  .example img {
   width: 100%;
    }
  /*-------------/トルコ海------------------*/  

  /*-------------フランス海------------------*/  
  .example  .migi-5 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 77%;
    left: 79%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }

  .example .migi-5:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }

  .example img {
   width: 100%;
    }
  /*-------------/フランス海------------------*/ 
/*----------　/基準（PC）---------------*/




/*----------　800-999系　---------------*/
@media only screen and (min-width:800px) and (max-width:999px){
  .example {
    position: relative;
    }

    /*-------------ドイツ空（ニッポン）------------------*/    
  
    .example  .hidari-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 30%;
      left: 27%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .hidari-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ空（ニッポン）------------------*/
  
    /*-------------フランス陸（ブリュネ）------------------*/    
  
    .example  .hidari-9 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 43%;
      left: 20%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-9:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/フランス陸（ブリュネ）------------------*/
  
    /*-------------オランダ海------------------*/    
  
    .example  .hidari-2 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 61%;
    left: 23%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:10px;
    margin:0;/*余計な隙間を除く*/
    font-size: 18px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 10px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }
  
    .example .hidari-2:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }
  
    .example img {
    width: 100%;
    }
    /*-------------/オランダ海------------------*/
  
    /*-------------日豪伊独仏海（ノーブル）------------------*/    
  
    .example  .hidari-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 73%;
      left: 48%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/日豪伊独仏海（ノーブル）------------------*/
  
    /*-------------ドイツ・スペイン空------------------*/  
    .example  .migi-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 32%;
      left: 71%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ・スペイン空------------------*/  
  
    /*-------------イタリア空（ライジング）------------------*/    
  
    .example  .migi-4 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 42%;
      left: 77%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;/*角丸*/
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*上下 左右文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-4:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/イタリア空（ライジング）------------------*/
  
    /*-------------フランス空------------------*/  
    .example  .migi-2 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 53%;
      left: 80%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-2:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/フランス空------------------*/  
  
    /*-------------トルコ海------------------*/  
    .example  .migi-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 63%;
      left: 79%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/トルコ海------------------*/  
  
    /*-------------フランス海------------------*/  
    .example  .migi-5 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 77%;
      left: 79%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:10px;
      margin:0;/*余計な隙間を除く*/
      font-size: 18px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 10px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-5:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/フランス海------------------*/ 
}
/*----------　/800-999系　---------------*/




/*----------　600-799系　---------------*/
@media only screen and (min-width:600px) and (max-width:799px){
  .example {
    position: relative;
    }

    /*-------------ドイツ空（ニッポン）------------------*/    
  
    .example  .hidari-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 31%;
      left: 27%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .hidari-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ空（ニッポン）------------------*/
  
    /*-------------フランス陸（ブリュネ）------------------*/    
  
    .example  .hidari-9 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 45%;
      left: 20%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-9:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/フランス陸（ブリュネ）------------------*/
  
    /*-------------オランダ海------------------*/    
  
    .example  .hidari-2 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 61%;
    left: 23%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:9px;
    margin:0;/*余計な隙間を除く*/
    font-size: 15px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
    padding: 5px 8px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }
  
    .example .hidari-2:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }
  
    .example img {
    width: 100%;
    }
    /*-------------/オランダ海------------------*/
  
    /*-------------日豪伊独仏海（ノーブル）------------------*/    
  
    .example  .hidari-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 73%;
      left: 45%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/日豪伊独仏海（ノーブル）------------------*/
  
    /*-------------ドイツ・スペイン空------------------*/  
    .example  .migi-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 29%;
      left: 73%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ・スペイン空------------------*/  
  
    /*-------------イタリア空（ライジング）------------------*/    
  
    .example  .migi-4 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 40%;
      left: 77%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;/*角丸*/
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*上下 左右文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-4:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/イタリア空（ライジング）------------------*/
  
    /*-------------フランス空------------------*/  
    .example  .migi-2 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 52%;
      left: 80%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-2:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/フランス空------------------*/  
  
    /*-------------トルコ海------------------*/  
    .example  .migi-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 62%;
      left: 79%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/トルコ海------------------*/  
  
    /*-------------フランス海------------------*/  
    .example  .migi-5 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 77%;
      left: 81%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:9px;
      margin:0;/*余計な隙間を除く*/
      font-size: 15px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 2px; /*線で囲う*/
      padding: 5px 8px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-5:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/フランス海------------------*/ 
}
/*----------　/600-799系　---------------*/





/*----------　400-599系　---------------*/
@media only screen and (min-width:400px) and (max-width:599px) {
  .example {
    position: relative;
    }

    /*-------------ドイツ空（ニッポン）------------------*/    
  
    .example  .hidari-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 32%;
      left: 26%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .hidari-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ空（ニッポン）------------------*/
  
    /*-------------フランス陸（ブリュネ）------------------*/    
  
    .example  .hidari-9 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 46%;
      left: 18%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-9:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/フランス陸（ブリュネ）------------------*/
  
    /*-------------オランダ海------------------*/    
  
    .example  .hidari-2 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 60%;
    left: 22%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:5px;
    margin:0;/*余計な隙間を除く*/
    font-size: 10px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
    padding: 3px 5px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }
  
    .example .hidari-2:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }
  
    .example img {
    width: 100%;
    }
    /*-------------/オランダ海------------------*/
  
    /*-------------日豪伊独仏海（ノーブル）------------------*/    
  
    .example  .hidari-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 73%;
      left: 45%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/日豪伊独仏海（ノーブル）------------------*/
  
    /*-------------ドイツ・スペイン空------------------*/  
    .example  .migi-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 29%;
      left: 73%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ・スペイン空------------------*/  
  
    /*-------------イタリア空（ライジング）------------------*/    
  
    .example  .migi-4 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 41%;
      left: 78%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;/*角丸*/
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*上下 左右文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-4:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/イタリア空（ライジング）------------------*/
  
    /*-------------フランス空------------------*/  
    .example  .migi-2 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 53%;
      left: 80%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-2:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/フランス空------------------*/  
  
    /*-------------トルコ海------------------*/  
    .example  .migi-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 63%;
      left: 80%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/トルコ海------------------*/  
  
    /*-------------フランス海------------------*/  
    .example  .migi-5 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 78%;
      left: 80%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 10px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 3px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-5:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/フランス海------------------*/ 
}
/*----------　/400-599系　---------------*/





/*----------　399以下系　---------------*/
@media not all and (min-width:400px) {
  .example {
    position: relative;
    }

    /*-------------ドイツ空（ニッポン）------------------*/    
  
    .example  .hidari-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 32%;
      left: 26%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .hidari-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ空（ニッポン）------------------*/
  
    /*-------------フランス陸（ブリュネ）------------------*/    
  
    .example  .hidari-9 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 46%;
      left: 18%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #73ff66c4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-9:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #73ff66); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/フランス陸（ブリュネ）------------------*/
  
    /*-------------オランダ海------------------*/    
  
    .example  .hidari-2 {/*aタグを画像の真ん中に*/
    position: absolute;
    top: 60%;
    left: 22%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    /*以下装飾*/
    border-radius:5px;
    margin:0;/*余計な隙間を除く*/
    font-size: 8px;/*文字サイズ*/
    background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
    border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
    padding: 1px 5px;/*文字と線の間の余白*/
    color: rgb(0, 0, 0);/*文字色*/
    text-decoration: none;/*下線を表示させない*/
    }
  
    .example .hidari-2:hover{/*カーソルを当てたとき*/
    background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
    }
  
    .example img {
    width: 100%;
    }
    /*-------------/オランダ海------------------*/
  
    /*-------------日豪伊独仏海（ノーブル）------------------*/    
  
    .example  .hidari-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 73%;
      left: 43%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
    
      .example .hidari-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
    
      .example img {
      width: 100%;
      }
    /*-------------/日豪伊独仏海（ノーブル）------------------*/
  
    /*-------------ドイツ・スペイン空------------------*/  
    .example  .migi-1 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 29%;
      left: 73%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-1:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/ドイツ・スペイン空------------------*/  
  
    /*-------------イタリア空（ライジング）------------------*/    
  
    .example  .migi-4 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 41%;
      left: 78%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;/*角丸*/
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*上下 左右文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-4:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/イタリア空（ライジング）------------------*/
  
    /*-------------フランス空------------------*/  
    .example  .migi-2 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 53%;
      left: 80%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #96f8ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-2:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #12dfff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
      width: 100%;
      }
    /*-------------/フランス空------------------*/  
  
    /*-------------トルコ海------------------*/  
    .example  .migi-3 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 63%;
      left: 82%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-3:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/トルコ海------------------*/  
  
    /*-------------フランス海------------------*/  
    .example  .migi-5 {/*aタグを画像の真ん中に*/
      position: absolute;
      top: 78%;
      left: 81%;
      -ms-transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      transform: translate(-50%,-50%);
      /*以下装飾*/
      border-radius:5px;
      margin:0;/*余計な隙間を除く*/
      font-size: 8px;/*文字サイズ*/
      background: -moz-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: -webkit-linear-gradient(top left, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      background: linear-gradient(to bottom right, #FFF, #6694ffc4); /*背景を半透明にグラデ*/
      border: solid rgb(0, 0, 0) 1px; /*線で囲う*/
      padding: 1px 5px;/*文字と線の間の余白*/
      color: rgb(0, 0, 0);/*文字色*/
      text-decoration: none;/*下線を表示させない*/
      }
  
    .example .migi-5:hover{/*カーソルを当てたとき*/
      background: -moz-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: -webkit-linear-gradient(bottom right, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      background: linear-gradient(to top left, #FFF, #2e74ff); /*背景を濃ゆくグラデ*/
      }
  
    .example img {
     width: 100%;
      }
    /*-------------/フランス海------------------*/ 
}
/*----------　/300以下　---------------*/






/*----------　主要参加アセット　---------------*/

.asset {
  background: -moz-linear-gradient(top, #100165, #ffffff);
  background: -webkit-linear-gradient(top, #100165, #ffffff);
  background: linear-gradient(to bottom, #100165, #ffffff);
}

.assetp {
  color:#fff;
  font-size: 20px;
}

.assetf{
  font-family: "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic" , "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	color: rgb(0, 0, 0);
}

/*----------　/主要参加アセット　---------------*/