﻿/************************************************
* 共通定義
************************************************/

/************************************************
* ソリューション一覧
************************************************/
.solution_list h2 {
	margin-top: 0;
	font-size: clamp(18px, 2vw, 20px);
}

/************************************************
* ソリューションカード
************************************************/
.solution_card {
	transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.solution_card h2 {
	transition: color 0.2s ease;
	color: #1a1a1a;
}

@media (max-height: 767px) {
	.solution_card h2 {
		margin-top: 1rem;
	}
}

.solution_card a {
	text-decoration: none;
}

.solution_card p {
	color: #333;
}

.solution_card h2>span {
	font-size: 12px;
}

.solution_card .more {
	color: #005BAC;
	font-size: 14px;
}

.solution_card .more i {
	transition: transform 0.2s ease;
}

.solution_card:hover {
	background-color: #f5f8ff;
	box-shadow: 0 4px 12px rgba(0,0,0,.08);
	transform: translateY(-1px);
}

.solution_card:hover h2 {
	color: #005BAC;
}

.solution_card:hover .more {
	text-decoration: underline;
}

.solution_card:hover .more i {
	transform: translateX(4px);
}

.hash-tag {
	margin-bottom: 1rem;
}

.hash-tag span {
	display: inline-block;
	margin-right: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	background-color: #DCEAF7;
	border-radius: 15px;
	color: #20538F;
	font-size: 10px;
	font-weight: bold;
}
