@charset "UTF-8";
/* レイアウト編集用CSS */


.u_kadomaru{
	
border-radius:15px;
	
}

.u_myColumn{
  height : 100%;
}

.u_full_wide_padding{
	padding-bottom: 12em !important;
	
}

.small{
	font-size:14px;
	
}
.small_2{
	font-size:11px;
	
}

.u_mb4 img {
  /* 下の余白を4remにする */
  margin-bottom: 4rem;
}

.ball_w{
	width:180px;
	
}
.ball_w p{
	width:110%;
	    margin-left: -10px;
}

.swl-inline-icon {
    color: #D75F39;
	font-size:1.3em;
}

.u_icon_box .swl-inline-icon{
	   color: #6D9957;
	font-size:1.2em;
	
}

.u_icon_box {
  /* 横幅を指定（例：親要素に合わせる場合はwidth: 100%） */
  width: 100%;
  /* 正方形にするための比率 */
  aspect-ratio: 1 / 1;
}


.w-beforeFooter{
	margin:6em auto 0em;
	
}

.u_footer{
	padding-top:3em;
	
}
.u_footer_w{
	width:300px;
	margin:0 auto;
	padding:0;
	
}

.u_footer_center_border{

	border-right:solid 1px #fff;
	padding:0 1em;
	
}

/*768px以下のとき以下を採用*/
@media (max-width: 300px) {
	.u_footer_w {
		/* 幅200pxに指定 */
		width: 200px;
		/* 中央寄せ */
		margin: 0 auto;
		/* 余白なし */
		padding: 0;
	}
	
}

/*768px以下のとき以下を採用*/
@media (max-width: 768px) {
.top #content {
    padding-top: 0em;
}
}

/*TOPページボタン設定*/

/* 横並び全体 */
.logo-btns {
  /* 横並び配置 */
  display: flex;
  /* 間隔を均等に */
  justify-content: space-between;
  /* 行が折り返せるように */
  flex-wrap: wrap;
  /* 上下左右の余白 */
  gap: 10px;
  /* 全体の中央寄せ */
  text-align: center;
}

/* 個々のロゴボタン */
.logo-btn {
  /* 背景を白に */
  background-color: #fff;
  /* 角丸 */
  border-radius: 8px;
  /* 影で立体感 */
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  /* 内側の余白 */
  padding: 12px 24px;
  /* スムーズなホバー動作 */
  transition: all 0.3s ease;
  /* 固定幅（ロゴサイズに合わせて調整） */
  width: 245px;
  /* 高さをそろえる場合は必要に応じて追加 */
  text-align: center;

}

/* ロゴ画像調整 */
.logo-btn img {
  /* 横幅をボタンに合わせる */
  max-width: 100%;
  /* 高さは自動 */
  height: auto;
  /* ブロック表示で中央揃え */
  display: block;
  margin: 0 auto;
}

/* ホバー時の動き */
.logo-btn:hover {
  /* 少し上に浮く */
  transform: translateY(-5px);
  /* 影を強調 */
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}




/*768px以下のとき以下を採用*/
@media (max-width: 768px) {
	.logo-btn{
	
	width:300px;
	}

}

/*768px以下のとき以下を採用*/
@media (max-width: 600px) {
	.logo-btn{
 flex: 0 1 calc(50% - 10px);
	width:100%;
	}
.logo-btns {
  display: flex;
  flex-wrap: wrap;
  /* 中央寄せに変更 */
  justify-content: center;
  gap: 10px;
  text-align: center;
}
	
	
}