// 【lndp_styl.css】(Landing page style.css)

.icon-links {
  display: flex;
  gap: 10px; 			// 画像どうしの間隔 
  justify-content: center; 	// 中央寄せ（必要に応じて変更可） 
  margin: 20px 0;}

.icon-links a img {
  width: 60px;
  height: 60px;
  border: none;         	// border="0" の代替 
  display: inline-block;
  transition: transform 0.2s ease;}

.icon-links a img:hover {transform: scale(1.3);}	// コメントできない ! ☆★

// --- Landing button (CS /LFD/LPP/MS) の装飾--- 

.icon-links {			// 全体を横並び (flex)＋中央配置
  display: flex;
  justify-content: center ;
  gap: 60px;			// 20px
  flex-wrap: wrap;
  margin: 30px auto;
  padding: 10px;}

.icon-btn {			// 各アイコンのホバー拡大＋影付き効果
  display: inline-block;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 10px;
  overflow: hidden;}

.icon-btn img {			// サイズ統一と角丸処理（ボタン風に）
  display: block;
  width: 40px; 			// 80px 必要に応じてサイズ調整 
  height: auto;
  border-radius: 10px;}

.icon-btn:hover {
  transform: scale(1.05);	// 1.05
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);}

// =============================================

/* =============================================


// icons_button.css (Landing Position Button)

// サイズを大きく	.icon-btn img { width: 80px; } など
// 丸みをもっと強く	border-radius: 50%;（円形に）
// 影を目立たせる	box-shadow の色や強さを調整
// 配置を縦にする	.icon-links { flex-direction: column; }

.icon-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  padding: 10px 0;}

.icon-btn img {
  width: 40px;         		// 60px 必要に応じて調整可能 
  height: 40px;			// 60px 
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;}

// ホバー時の拡大＆影効果 

.icon-btn:hover img {
  transform: scale(1.05);	// (1.15) ☆
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  cursor: pointer;}

============================================= */