@charset "UTF-8";
/* CSS Document */

.related_wrap {
  text-align: center;
  padding: 0;
  margin-top: 50px;
}

.related_img_sp > a {
  display: block;
  transition: opacity 0.3s ease-in-out; 
}
.related_img_sp > a:hover {
  opacity: 0.4;
}
.related_img_sp img {
  margin-top: 15px;
  max-width: 500px;
}
.related_img_sp > img:first-of-type {
  margin: 0 20% 10px;
  width: 60%;
  max-width: 300px;
}

.related_img_pc {
  display: none;
}





@media print, screen and (min-width: 561px) {
  
/*
  .related_wrap {
    padding: 0;
    margin-top: 100px
  }
*/
  
}





@media print, screen and (min-width:1000px) {
  
  .related_wrap {
    margin-top: 100px;
  }

  .related_img_sp {
    display: none;
  }
  
  /* HTML直書き 円形SVG画像用 */
  .related_img_pc {
    display: block;
    margin: 0 auto;
    width: 85vw;
    max-width: 1000px;
  }
  .related_img_pc > a {
    transition: opacity 0.3s ease-in-out; 
  }
  .related_img_pc > a:hover {
    opacity: 0.4;
  }
  
  .cls-1 {
    fill: #f55028;
  }
  .cls-2 {
    fill: #f5c8aa;
  }
  .cls-3 {
    fill: #777;
  }
  .cls-4 {
    fill: #fe3500;
  }
  .cls-5 {
    isolation: isolate;
  }
  .cls-6 {
    fill: #fff;
  }
  .cls-7 {
    fill: #9f9d8a;
  }
  .cls-8 {
    fill: #006473;
  }
  .cls-9 {
    fill: #f58c5a;
  }
  .cls-10 {
    mix-blend-mode: darken;
  }
  .cls-11 {
    fill: #008c9b;
  }
  .cls-12 {
    fill: #f13f21;
  }
  .cls-13 {
    fill: #007d8c;
  }
  .cls-14 {
    fill: #efa595;
  }
  .cls-15 {
    fill: #042275;
  }
  .cls-16 {
    fill: #333;
  }
  .cls-17 {
    fill: #555;
  }
  .cls-18 {
    fill: #eee;
  }
  .cls-19 {
    fill: #4f4f5e;
  }
  
}






/*
@media (min-width: 1000px) and (max-width: 1280px) {
  
  .related_img_pc {
    margin: 0 5%;
    width: 90%;
  }
  
}

@media print, screen and (min-width:1280px) {
    
  .related_img_pc {
    margin: 0;
    width: 100%;
  }
  
}
*/
