@charset "utf-8";



.ttl-data{
  background-color: #275AF7;
  color: #FFF;
  font-weight: 700;
  text-align: center;
}
@media print, screen and (min-width:1025px) {
  .ttl-data{
    border-radius: 30px;
    font-size: clamp(1.8rem, 0.855rem + 1.79vw, 2.4rem);
    padding: 25px;
  }
}
@media screen and (max-width: 1024px){
  .ttl-data{
    font-size: 2.0rem;
    padding: 20px;
    margin-left: -5%;
    margin-right: -5%;
  }
}







.card{
	background-color: #FFF;
}
.card.normal dl > dt{
	font-weight: 500;
	line-height: 1.6;
}
.card.normal dl > dd:not(.sp){
	color: #275AF7;
	font-family: "Albert Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
	font-weight: 700;
	line-height: 1;
}
.card.fig > p,
.card.fig2 > .ttl p,
.card.award > p,
.card.award > .other{
	font-weight: 500;
}

.award-list > li{
	border: 1px solid #B9B9B9;
	background-color: #FFF;
}
.award-list > li > .image .jp{
	font-weight: 500;
	line-height: 1.1;
}
@media print, screen and (min-width:1025px) {
	.card-list1 {
	  display: grid;
	  grid-template-columns: repeat(4, .5fr);
	  grid-template-rows: repeat(2, .5fr);
	  grid-column-gap: 2em;
	  grid-row-gap: 2em;
		margin-top: 40px;
	}
	.card-list1 .card1 {
	  grid-area: 1 / 1 / 2 / 3;
	}
	.card-list1 .card2 {
	  grid-area: 1 / 3 / 2 / 5;
	}
	.card-list1 .card3 {
	  grid-area: 2 / 1 / 3 / 5;
	}
	.award-list{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top: 30px;
	}
	.award-list > li{
		border-radius: 15px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
		padding: 25px;
		min-height: 106px;
		width: 32.846%;
	}
	.award-list > li:nth-child(n + 4){
		margin-top: 0.731%;
	}
	.award-list > li > .image {
		display: flex;
		align-items: center;
	}
	.award-list > li > .image img{
		margin-right: 4.5%;
		height: auto;
		width: 30.44%;
	}
	.award-list > li > .image .jp{
		font-size: min(1.59vw,2.0rem);
		white-space: nowrap;
	}
	.award-list > li > .image .jp span{
		font-size: min(1.1vw,1.5rem);
	}
	.card.award > .other{
		font-size: min(1.23vw,1.7rem);
		text-align: right;
		margin-top: 5px;
	}
	
	
	
	
	.card-list2 {
	  display: grid;
	  grid-template-columns: repeat(12, .5fr);
	  grid-template-rows: repeat(5, .5fr);
	  grid-column-gap: 2em;
	  grid-row-gap: 2em;
		margin-top: 40px;
	}
	
	
	
	.card{
		border-radius: 30px;
		padding: 30px 30px;
	}
	.card ul{
		font-size: min(1.01vw,1.4rem);
	}
	.card.normal{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.card.normal .image{
		margin-left: auto;
		margin-right: auto;
		max-width: 112px;
	}
	.card.normal dl > dt{
		font-size: min(1.59vw,2.2rem);
		text-align: center;
		margin-top: 20px;
		margin-bottom: 10px;
	}
	.card.normal dl > dd{
		font-size: min(5.07vw,7.0rem);
	}
	.card.normal dl > dd > span{
		font-size: min(2.17vw,3.0rem);
	}
	.card.normal dl > .sp{
		display: none;
	}
	.card.normal ul{
		margin-top: 10px;
	}
	
	
	.card.fig{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.card.fig2{
		display: flex;
	}
	.card.fig > p,
	.card.fig2 > p,
	.card.award > p{
		font-size: min(1.59vw,2.2rem);
	}
	.card.fig .image{
		margin-top: 30px;
		margin-bottom: 30px;
	}
	.card.fig ul{
		text-align: center;
	}
	.card-list1 .card.fig ul{
		text-align: right;
	}
	
	
	.card.fig2{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.card.fig2 > .ttl{
		width: 38%;
	}
	.card.fig2 > .ttl p{
		font-size: min(1.59vw,2.2rem);
	}
	.card.fig2 .image{
		width: 62%;
	}
	.card.fig2 > ul{
		display: none;
	}
	
	.card-list2 .card1 {
	  grid-area: 1 / 1 / 2 / 5;
	}
	.card-list2 .card2 {
	  grid-area: 1 / 5 / 2 / 9;
	}
	.card-list2 .card3 {
	  grid-area: 1 / 9 / 2 / 13;
	}
	.card-list2 .card4 {
	  grid-area: 2 / 1 / 4 / 7;
	}
	.card-list2 .card5 {
	  grid-area: 2 / 7 / 3 / 13;
	}
	.card-list2 .card6 {
	  grid-area: 3 / 7 / 4 / 13;
	}
	.card-list2 .card7 {
	  grid-area: 4 / 1 / 5 / 4;
	}
	.card-list2 .card8 {
	  grid-area: 4 / 4 / 5 / 7;
	}
	.card-list2 .card9 {
	  grid-area: 4 / 7 / 5 / 10;
	}
	.card-list2 .card10 {
	  grid-area: 4 / 10 / 5 / 13;
	}
	.card-list2 .card11 {
	  grid-area: 5 / 1 / 6 / 7;
	}
	.card-list2 .card12 {
	  grid-area: 5 / 7 / 6 / 13;
	}
}
@media screen and (max-width: 1024px){
	.card-list1 {
		margin-top: 40px;
	}
	.award-list{
		margin-top: 30px;
	}
	.award-list > li{
		border-radius: 15px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
		padding: 25px;
		min-height: 120px;
	}
	.award-list > li:nth-child(n + 2){
		margin-top: 10px;
	}
	.award-list > li > .image img{
		margin-bottom: 15px;
	}
	.award-list > li > .image .jp{
		font-size: 2.0rem;
	}
	.award-list > li > .image .jp span{
		font-size: 1.5rem;
	}
	.award-list > li:nth-child(1) > .image img{
		max-width: 169px;
	}
	.award-list > li:nth-child(2) > .image img{
		max-width: 64px;
	}
	.award-list > li:nth-child(3) > .image img{
		max-width: 57px;
	}
	.award-list > li:nth-child(5) > .image img{
		max-width: 209px;
	}
	.award-list > li:nth-child(6) > .image img{
		max-width: 59px;
	}
	.card.award > .other{
		text-align: right;
		margin-top: 5px;
	}
	
	
	
	
	.card-list2 {
		margin-top: 40px;
	}
	
	
	
	.card{
		border-radius: 15px;
		padding: 7% 5%;
		margin-top: 10px;
	}
	.card ul{
		font-size: min(3.07vw,1.2rem);
	}
	.card.normal{
		display: flex;
		align-items: center;
	}
	.card.normal .image{
		margin-right: 5%;
		margin-left: 3.2%;
		width: 25.8%;
	}
	.card.normal dl > dt{
		font-size: min(4.61vw,1.8rem);
		line-height: 1.6;
		margin-bottom: 10px;
	}
	.card.normal dl > dd{
		font-size: min(15.38vw,6.0rem);
	}
	.card.normal dl > dd > span{
		font-size: min(5.12vw,2.0rem);
	}
	.card.normal dl > .sp{
		margin-top: 5px;
	}
	.card.normal > ul{
		display: none;
	}
	
	
	.card.fig{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.card.fig > p,
	.card.award > p{
		font-size: min(4.61vw,1.8rem);
		text-align: center;
	}
	.card.fig .image{
		margin-top: 30px;
		margin-bottom: 30px;
	}
	.card.fig ul{
		text-align: center;
	}
	.card-list1 .card.fig ul{
		text-align: right;
	}
	
	
	.card.fig2{
	}
	.card.fig2 > .ttl{
	}
	.card.fig2 > .ttl p{
		font-size: min(4.61vw,1.8rem);
		text-align: center;
	}
	.card.fig2 > .ttl ul{
		display: none;
	}
	.card.fig2 .image{
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.card.fig2 > ul{
		text-align: center;
	}

}



@media print, screen and (min-width:1025px) {
  #company-section{
    margin-top: 100px;
  }
  #environment-section{
    margin-top: 120px;
  }
}
@media screen and (max-width: 1024px){
  #company-section{
    margin-top: 60px;
  }
  #environment-section{
    margin-top: 80px;
  }
	#graph-circle1 .image{
		margin-left: auto;
		margin-right: auto;
		width: 50%;
	}
	#graph-circle2 .image{
		margin-left: auto;
		margin-right: auto;
		width: 50%;
	}
	#graph-circle3 .image{
		margin-left: auto;
		margin-right: auto;
		width: 50%;
	}
}