/*-------------------------------------------*/ /* .vk_prBlocks /*-------------------------------------------*/ // 編集画面でcssの指定が軽くて負けるので.vk_prBlocks .vk_prBlocks_item を先に記述 .vk_prBlocks{ .vk_prBlocks_item { a{text-decoration: none;} @media screen and (max-width: 991.98px) { margin-bottom: 1.5em; } //ベタ塗りの時 &:not(.is-style-outline) { .vk_prBlocks_item { &_icon { color: #fff; } //デフォルト状態 &_icon_outer:not(.has-background) { background-color: #0693e3; } } } //背景なしの時 &.is-style-outline { //カラー選択 .vk_prBlocks_item_icon_outer { background-color: transparent; border: 1px solid currentColor; //デフォルト状態 &:not(.has-text-color) { border: 1px solid #0693e3; .vk_prBlocks_item_icon { color: #0693e3; } } } } .vk_prBlocks_item { &_link { color: #333; &:hover { color: #333; text-decoration: none; } } &_icon_outer { display: block; position: relative; margin: 0 auto; width: 80px; height: 80px; border-radius: 50%; } &_icon { position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); font-size: 36px; } &_title { background-color: transparent; margin-top: 0.9em; margin-bottom: 0.6em; text-align: center; font-size: 21px; line-height: 1.4em; border: none; border-radius:unset; padding: 0; outline: unset; outline-offset: unset; box-shadow: unset; color: inherit; display: block; /* display:block をつけておかないと左右線デザインでflex指定されて左寄りになる */ &::before { content: none; } &::after { border: none; } } &_image { position: relative; display: block; width: 120px; height: 120px; margin: 0 auto; overflow: hidden; border-radius: 50%; text-indent: -9999px; } &_summary { margin-bottom: 0.5em; text-align: center; line-height: 1.8em; } } } }