@charset "utf-8";
/* CSS Document */






a.btn{
	text-align:center;
	border-radius:50px;
	background-color:rgba(0,160,160,1);
	width:10em;
	margin:10px;
	padding:10px;
	color:#fff;
	font-size:110%;
	font-weight:bolder;
	display: inline-block;
}
a.btn:link, a.btn:visited, a.btn:active {
    color: #fff;
}
a.btn:hover{
	background-color:rgba(0,132,132,0.5);
}





/*partner*/
#partner {
padding: 65px 0 40px;
margin: 0 auto;
max-width: 1084px;
width: 97%;
}


#partner h3 {
font-size: 190%;
text-align: center;
margin-top:100px;
margin-bottom: 30px;
}
#partner h3.ttl_p {
	font-size: 215%;
}


#partner ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* これで綺麗に中央に揃います */
  gap: 24px 2.952%;        /* 縦の隙間24px、横の隙間2.952% */
  overflow: hidden;
  padding: 0;
  list-style: none;
}

/* 各列の幅だけを指定する（marginの計算は不要！） */
#partner ul.crm1 li { width: 100%; }
#partner ul.crm2 li { width: calc((100% - 2.952% * 1) / 2); }
#partner ul.crm3 li { width: calc((100% - 2.952% * 2) / 3); }
#partner ul.crm4 li { width: calc((100% - 2.952% * 3) / 4); }
#partner ul.crm5 li { width: calc((100% - 2.952% * 4) / 5); }

/* 特殊なパターンの幅調整 */
#partner ul.crm4.diamond  li { width: calc((100% - 2.952% * 1) / 2); }
#partner ul.crm4.platinum li { width: calc((100% - 1.6% * 2) / 3); }
#partner ul.crm4.platinum { gap: 24px 1.6%; } /* プラチナだけ横隙間を変更 */







#partner ul li a[target="_blank"]:not(.link_none):after{
display: none;
}

#partner ul li img {
width: 100%;
height: auto;
}

#partner ul.silver li img {
width: 87%;
display: block;
margin: auto;
height: auto;
}


#partner ul.crm1 li a img,
#partner ul.crm2 li a img,
#partner ul.crm3 li a img,
#partner ul.crm4 li a img,
#partner ul.crm5 li a img{
border: solid #ccc 1px;
}

#partner ul.ticket li a,
#partner ul.ticket li a:link,
#partner ul.ticket li a:hover,
#partner ul.ticket li a:focus{
	color: #333;
 height: auto;
}

.partner_list{
margin-bottom: 30px;
}





/* スマホ用の設定（画面幅767px以下のとき） */
@media screen and (max-width: 767px) {

/* 全員共通：スマホ時は一律「2列」にする（ダイヤモンド以外） */
#partner ul.crm4.platinum li,
#partner ul.crm4.gold li,
#partner ul.crm4.ticket li,
#partner ul.crm4.silver li{
width: calc((100% - 2.952% * 1) / 2);
}
#partner ul.crm5.region li {
width: calc((100% - 2.952% * 2) / 3);
}
/* -----------------------------------------------
* ① ダイヤモンド（1列・最大）
* ----------------------------------------------- */
#partner ul.crm4.diamond li {
width: 100%;
}

/* -----------------------------------------------
* ② プラチナ（2列・大）
* 基準の2列。画面の端までいっぱいに使います。
* ----------------------------------------------- */
#partner ul.crm4.platinum {
padding: 0; /* 横の余白なし */
gap: 16px 2.952%;
}

#partner ul.gold li img {
width: 95%;
display: block;
margin: auto;
height: auto;
}
}


#partner ul.ticket li{
border-bottom:  solid 1px #ccc;
padding-bottom: 5px;
text-align: center;
}



