@charset "utf-8";
@import url("/css/common.css");
/* ======================================================
 * company.css
 * ------------------------------------------------------
 * - Common
 * - Parts
 * - PageComponent

 * @media print, screen and (min-width: 768px)
 * - Common
 * - Parts
 * - PageComponent

 * @media only screen and (max-width: 767px)
 * - Common
 * - Parts
====================================================== */

	/* ------------------------------------------------------
   * Common
  ------------------------------------------------------ */
	.color_bllue{
		color:var(--primary);
	}
  .color_red{
		color:#e94829;
	}
  .color_while{
		color:var(--white);
  }
	/* ------------------------------------------------------
   * Parts
  ------------------------------------------------------ */
	/* ------------------------------------------------------
   * PageComponent
  ------------------------------------------------------ */

@media screen and (min-width: 768px){
  /* ------------------------------------------------------
   * Common
  ------------------------------------------------------ */

	/* ------------------------------------------------------
   * Parts
  ------------------------------------------------------ */
  .player{
    margin-top: 4rem;
  }
  .player>.col-md-6{
    position: relative;
  }
  .player .col-md-6 .h4,
  .player .col-md-6 .h5{
    color: black!important;
  }
  .tag_red{
    background-color: #e94829ad;
  }
  .tag_blue{
    background-color: #1bb8ce94;;
  }
  .tag_name{
    transition: all 1s;
    color: white;
    padding: 10px;
    font-size: 1.4rem;
    font-weight: bold;
    position: absolute;
    top: 60%;
    right: 0;
  }
  .tag_name p{
    margin-bottom: 0;
  }
  .player:hover .tag_name{
    transform: translate(200px,0);
  }

	/* ------------------------------------------------------
   * PageComponent
  ------------------------------------------------------ */
}

@media screen and (max-width: 767px){

	/* ------------------------------------------------------
   * Common
  ------------------------------------------------------ */
	/* ------------------------------------------------------
   * Parts
  ------------------------------------------------------ */
  .tag_name p{margin: auto;}

}