前略、田中さん

ボタンのあるページの編集画面の下の方にあるカスタムCSSの欄に以下のCSSをコピペすると、どうでしょうか？

.btn-circle,
.btn-wrap-circle > a {
    background-clip: padding-box;
}

田中さん

フォーラム上部の案内をご確認いただき、各種情報のご提示をお願いします。

書き込みの前に以下の3点をご確認ください。

1. 1つのトピックにつき1つの質問を書き込んでください
2. 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください
3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

田中さんのサイト表示では特にそうはなっていませんし・・・

@mk2_mk2 さん

iphone の端末でないと再現しないかもしれません。

光る動きが早いので、よほど気にして見ないとですが・・

以前、以下のようなトピックがありました。

マイクロバルーンの円型がスマホで反映されない

https://wp-cocoon.com/community/postid/30487/

リフィトリーさん

投稿者:: @leafytree

iphone の端末でないと再現しないかもしれません。

なるほど。

ちなみに、実際のページの表示にも影響はあるのでしょうか。
ないようであれば・・・と思うのですが。

そういったことも、環境情報のご提示があれば、早めに分かるのですけど・・・

とはいえ、まずは親テーマを最新版にバージョンアップしていただくのを待った方が良いかもしれませんね。
（私はiPhoneではありませんので、再現は難しそうです。）

@mk2_mk2 さん

私のiphone だと、上記CSSで改善してるっぽいのですが、動きが早いだけに、ちょっと確認しづらいです。 ? 

リフィトリーさん

確かに一瞬ですから、繰り返し目を凝らさないと…ですね。

解決の方法があるのであれば、問題なさそうですね。

ご本人のご確認を待ちます。

@mk2_mk2 さん

メインカラムの背景色を暗くして、アニメーションを10ｓにしてみたら、上記CSSでは改善していないようです。

さて、どうしたものか・・

リフィトリーさん

それは・・・困りました。

iPhone & Safariの問題だとすると、手も足も出ません?
テストできる環境が欲しいです。

田中さん

ｍｋ２さん

以下を指定したところ、角丸の内側だけになるようです。

.btn-circle,
.btn-wrap-circle > a {
    clip-path: border-box;
}

ただ、他にどのような影響があるのかまでは、まだ調べていません。

clip-path なんてプロパティ、使ったことが無いです・・・

以下、参考ページですが、MDNの方は３日前の更新のようです。

clip-path

https://developer.mozilla.org/ja/docs/Web/CSS/clip-path

CSSのclip-pathプロパティでいろいろ簡単に実装できる、便利な使い方と実装のポイント

https://coliss.com/articles/build-websites/operation/css/how-to-use-css-clip-path.html

私の環境ではWindows10のブラウザ Firefox,Chrome,Edge,IE11でも特に問題ないように見えます。

ちなみに、CSSを設定していないページだとこんな感じです。

リフィトリーさん、mk2さんご対応ありがとうございます。

※PCからみるとCSS変えなくても枠内に収まっていらように見えます。

iPhoneから見ると枠から長方形にはみ出します。Androidでははみ出していないのでしょうか？

親テーマを最新のものにして

1つ目のコードを使用したところ幅がフィットしましたが本文背景を変えると長方形に白のエフェクトが走りはみ出します。本文背景が白の場合は綺麗に見えました。

2つ目のコードを使用したところ枠内に収まり解決に至りました。

一つ目のコードの見え方も貼っておきます。

@leafytree 

コードについての参考リンク大変ありがとうございます‼︎大変、助かりました。

皆さん、ありがとうございます！
GitHubのファイルを修正しておきました。
https://github.com/yhira/cocoon/commit/5b6e7d2bf0c4e3a6e2bdf21c32b1f299aa4da407#diff-b78be019f1dc6d57753ea900c3805b114cd53ab7c0db836cc081836df1b99b7aR4155
clip-pathは僕も初めて使いました… ? 

------------------------------------------------
https://github.com/yhira/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------

@yhira さん

Githubからダウンロードしてローカルテストサイトで「Local」のLive Link機能を使って、iphoneで確認したところ、上手くいっているようです。

パソコンのブラウザ表示も、今のところ、特に問題なさそうな感じです。

@leafytree 

ご確認いただきありがとうございます！

@yhira 

対応、ありがとうございます。

まだ最新ファイルをダウンロードしておりませんが、

対応いただいてから色々確認してみたところiPhoneから見た場合に、clip-pathを使用すると対象の外側のCSSが非表示になるため

ボタンの影をつけている場合はボタンの影がなくなります。

※パソコンでは影が消えることはありません。

私個人には光らせるときに影がないことに特に問題はないのですが、

ファイルを修正されたということでその点の影響があるかもしれないことをお伝えしておきたいと思い追記させていただきました。