/* TOP：協賛企業ロゴ。ランクごとに大きさを変え、プラチナが一番大きく見えるようにする。 */
.ts50-home .ts50-sponsors{background:#fff;padding-top:40px}
.ts50-sponsors .ts50-section__inner{border-top:1px solid var(--ts50-line);padding-top:90px}
/* 見出しは意味のまとまりで改行し、「皆さ／ま。」のような泣き別れを防ぐ */
.ts50-sponsors .ts50-title span,.ts50-title--phrases span{display:inline-block}
.ts50-sponsors__rank{margin-top:58px}
.ts50-sponsors__rank:first-of-type{margin-top:0}
.ts50-sponsors__label{display:flex;align-items:center;gap:22px;margin:0 0 26px;font-size:15px;line-height:1.4;font-weight:600;letter-spacing:.16em;color:var(--ts50-navy);text-align:center}
.ts50-sponsors__label:before,.ts50-sponsors__label:after{content:"";flex:1;height:1px;background:var(--ts50-line)}
.ts50-sponsors__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:18px}
.ts50-sponsors__item{margin:0;padding:0;max-width:100%}
.ts50-sponsors__rank--platinum .ts50-sponsors__item{width:326px}
.ts50-sponsors__rank--gold .ts50-sponsors__item{width:250px}
.ts50-sponsors__rank--silver .ts50-sponsors__item{width:200px}
.ts50-sponsors__rank--bronze .ts50-sponsors__item{width:147px}
.ts50-sponsors__rank--platinum .ts50-sponsors__list{gap:26px}
.ts50-sponsors__rank--bronze .ts50-sponsors__list{gap:14px}
.ts50-sponsors__item a{display:block;transition:transform .25s ease,box-shadow .25s ease}
.ts50-sponsors__item a:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,16,64,.1)}
.ts50-sponsors__item img{display:block;width:100%;height:auto}
@media(max-width:767px){
.ts50-home .ts50-sponsors{padding-top:20px}
.ts50-sponsors .ts50-section__inner{padding-top:60px}
.ts50-sponsors__rank{margin-top:44px}
.ts50-sponsors__label{gap:14px;font-size:14px;letter-spacing:.12em;margin-bottom:20px}
.ts50-sponsors__list,.ts50-sponsors__rank--platinum .ts50-sponsors__list{gap:12px}
.ts50-sponsors__rank--platinum .ts50-sponsors__item{width:100%;max-width:300px}
.ts50-sponsors__rank--gold .ts50-sponsors__item{width:calc(50% - 6px);max-width:200px}
.ts50-sponsors__rank--silver .ts50-sponsors__item{width:calc(50% - 6px);max-width:150px}
.ts50-sponsors__rank--bronze .ts50-sponsors__list{gap:10px}
.ts50-sponsors__rank--bronze .ts50-sponsors__item{width:calc(33.333% - 7px);max-width:120px}
}
/* ---------- 見えたときの「見当合わせ」：
   見出しの罫が真ん中から左右へ伸び、ロゴはC・M・Yの3版がずれた状態で現れて、0.6秒ほどで一枚にピタッと重なる。
   ランク内はほぼ同時に動くので待たずに全部見える。プラチナは版のずれを大きく。JSが .has-plates と .is-in を付けたときだけ動く ---------- */
.ts50-js .ts50-sponsors__label:before,.ts50-js .ts50-sponsors__label:after{transform:scaleX(0);transition:transform .7s cubic-bezier(.65,0,.35,1)}
.ts50-js .ts50-sponsors__label:before{transform-origin:right center}
.ts50-js .ts50-sponsors__label:after{transform-origin:left center}
.ts50-js .ts50-sponsors__label span{display:inline-block;opacity:0;transition:opacity .4s ease}
.ts50-js .ts50-sponsors__rank.is-in .ts50-sponsors__label:before,.ts50-js .ts50-sponsors__rank.is-in .ts50-sponsors__label:after{transform:scaleX(1)}
.ts50-js .ts50-sponsors__rank.is-in .ts50-sponsors__label span{opacity:1}
.ts50-sponsors__item.has-plates{position:relative}
/* 本物のロゴは、版が重なりきる直前にのせる */
.ts50-js .ts50-sponsors__item.has-plates>a,.ts50-js .ts50-sponsors__item.has-plates>img{opacity:0;transition:opacity .18s ease calc(var(--d,0s) + var(--dur,.6s) * .62),transform .25s ease,box-shadow .25s ease}
.ts50-js .ts50-sponsors__rank.is-in .ts50-sponsors__item.has-plates>a,.ts50-js .ts50-sponsors__rank.is-in .ts50-sponsors__item.has-plates>img{opacity:1}
/* 3色の版：ロゴを白黒にして色の地と「スクリーン」で重ね、その色1色の版にする。版どうしは「乗算」で刷り重なる */
.ts50-plates{position:absolute;inset:0;pointer-events:none}
.ts50-plate{position:absolute;inset:0;opacity:0;mix-blend-mode:multiply;isolation:isolate}
.ts50-plate img{display:block;width:100%;height:auto;filter:grayscale(1) contrast(1.6);mix-blend-mode:screen}
.ts50-plate--c{background:#00a0e9;--gx:-18px;--gy:-10px}
.ts50-plate--m{background:#e4007f;--gx:16px;--gy:8px}
.ts50-plate--y{background:#ffe100;--gx:-6px;--gy:14px}
.ts50-sponsors__rank--platinum .ts50-plate--c{--gx:-30px;--gy:-16px}
.ts50-sponsors__rank--platinum .ts50-plate--m{--gx:26px;--gy:14px}
.ts50-sponsors__rank--platinum .ts50-plate--y{--gx:-10px;--gy:24px}
.ts50-js .ts50-sponsors__rank.is-in .ts50-plate{animation:ts50Register var(--dur,.6s) cubic-bezier(.2,.9,.25,1) var(--d,0s) both}
@keyframes ts50Register{0%{opacity:.95;transform:translate(var(--gx),var(--gy))}62%{opacity:.95;transform:translate(0,0)}100%{opacity:0;transform:translate(0,0)}}
/* JSが動かない・版が作れないときは、ロゴをそのまま見せる */
.ts50-plates{display:none}
.ts50-js .ts50-plates{display:block}
@media(prefers-reduced-motion:reduce){.ts50-sponsors__item a{transition:none}.ts50-sponsors__item a:hover{transform:none}
.ts50-js .ts50-plates{display:none}
.ts50-js .ts50-sponsors__item.has-plates>a,.ts50-js .ts50-sponsors__item.has-plates>img{opacity:1;transition:none}
.ts50-js .ts50-sponsors__label:before,.ts50-js .ts50-sponsors__label:after{transform:none;transition:none}.ts50-js .ts50-sponsors__label span{opacity:1;transition:none}}
