.fa3Columns
  {
    --r-index-3block-height : 800px;
    --column-gap : 30px;
    padding : 2em;
  }

.fa3Columns > div 
{
  display : flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
.fa3Columns > div > div
{
  border : solid 3px #FFFFFF;
  border-radius : 20px;
}
.faNews
{
  background-color : var(--color-pink02);
}
.faAchievement
{
  background-color : var(--color-pink01);
}
.faPhoto
{
  background-color : var(--color-purple01);
}

.faShortcut
{
  margin : 0 auto;
}
@media (max-width: 480px) 
{
  .fa3Columns
  {
    padding : 1em;
  }
  .fa3Columns > div 
  {
    display : block;
  }
  .faAchievement, .faPhoto
  {
    margin-top : 2em;
  }
}
@media (min-width: 481px) and (max-width: 767px) 
{
  .fa3Columns
  {
    padding : 1em;
  }
  .fa3Columns > div 
  {
    display : block;
  }
  .faAchievement, .faPhoto
  {
    margin-top : 2em;
  }
}
@media (min-width: 768px) and (max-width: 979px) 
{
  .fa3Columns > div 
  {
    flex-wrap: wrap;
  }
  .faNews
  {
    flex-basis : calc(30% - var(--column-gap));
  }
  .faAchievement
  {
    flex-basis : calc(70% - var(--column-gap));
  }
  .faPhoto
  {
    flex-basis : 100%;
    margin-top : 2em;
  }
  .faNews .blockTitle, .faAchievement .blockTitle, .faPhoto .blockTitle
  {
    max-width : 200px; 
  }
}
@media (min-width: 980px) and (max-width:1199px) 
{
  .fa3Columns > div 
  {
    flex-wrap: wrap;
  }
  .faNews
  {
    flex-basis : calc(30% - var(--column-gap));
  }
  .faAchievement
  {
    flex-basis : calc(70% - var(--column-gap));
  }
  .faPhoto
  {
    flex-basis : 100%;
    margin-top : 2em;
  }
  .faShortcut
  {
     width : 80%;
  }
}
@media (min-width: 1200px) and (max-width:1919px) 
{
  .fa3Columns > div 
  {
    flex-wrap: wrap;
  }
  .faNews
  {
    flex-basis : calc(30% - var(--column-gap));
  }
  .faAchievement, .faPhoto
  {
    flex-basis : calc(35% - var(--column-gap));
  }
  .faShortcut
  {
     width : 60%;
  }
}
@media (min-width: 1920px) 
{
  .fa3Columns > div 
  {
    flex-wrap: nowrap;
  }
  .faNews
  {
    flex-basis : calc(20% - var(--column-gap));
  }
  .faAchievement, .faPhoto
  {
    flex-basis : calc(40% - var(--column-gap));
  }
  .faShortcut
  {
     width : 50%;
  }
}