#post_slider .p-postList__item{
transform: perspective(0);
backface-visibility: hidden;
}
/*メインビジュアル下の空白削除 */
.top #content {
padding-top: 0 !important;
margin-bottom: 0;
}
#header {
margin: 0 auto;
}
.p-breadcrumb.-bg-on {
background-color: black;
}
/*ヘッダーフォント*/
.ttl {
font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
}
.ttl:hover {
color: #147CE5;
}
.c-gnav>.menu-item>a .ttl {
font-size: 13px;
}
/* Glassmorphism */
/* 背景 */
.bg {
width: 100%;
padding: 60px 30px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
/* ガラス本体 */
.glass {
margin-top: 15px;
width: 100%;
max-width: 600px;
padding: 30px;
background-color: rgba(255, 255, 255, ); /* 背景色 */
border-right-color: rgba(255, 255, 255, 0.2);
border-bottom-color: rgba(255, 255, 255, 0.2);
border-radius: 25px;
-webkit-backdrop-filter: blur(20px); /* ぼかしエフェクト */
backdrop-filter: blur(99px);
}
/* ガラス内の要素 */
.glass {
text-align: center;
color: #fff;
font-family: "Heebo", sans-serif;
font-size: 20px;
font-weight: bold;
letter-spacing: 0.06em;
}
.glass p {
margin-top: 20px;
color: #fff;
font-size: 14px;
font-weight:Normal;
}
/*.glass :: before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
filter: blur(3px);
Z-index: -1;
}*/
.bg {
content: ""; /* 必須 */
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 2.5rem;
background-color:hsla(0,100%,50%,1);
background-image:
radial-gradient(at 40% 20%, hsla(28,100%,74%,1) 0px, transparent 50%),
radial-gradient(at 80% 0%, hsla(189,100%,56%,1) 0px, transparent 50%),
radial-gradient(at 0% 50%, hsla(355,100%,93%,1) 0px, transparent 50%),
radial-gradient(at 80% 50%, hsla(340,100%,76%,1) 0px, transparent 50%),
radial-gradient(at 0% 100%, hsla(22,100%,77%,1) 0px, transparent 50%),
radial-gradient(at 80% 100%, hsla(242,100%,70%,1) 0px, transparent 50%),
radial-gradient(at 0% 0%, hsla(343,100%,76%,1) 0px, transparent 50%);
}
/*スマホサイズ メイン */
@media screen and (max-width:600px) {
.bg {
padding: 30px 30px;
border-radius: 2.0rem;
}
.glass {
margin-top: 0px;
}
}
/* ヘッダー */
.-txt .c-headLogo__link{
font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.l-header__inner{
background-color: rgba(50, 50, 50, 0.70); /* 背景色 */
border: 1.5px solid rgba(255, 255, 255, 0.08); /* ボーダー */
border-right-color: rgba(255, 255, 255, 0.2);
border-bottom-color: rgba(255, 255, 255, 0.2);
border-radius: 30px;
color: black;
-webkit-backdrop-filter: blur(20px); /* ぼかしエフェクト */
backdrop-filter: blur(5px);
position: fixed;/*fixedで固定*/
box-shadow: 0 1px 1px rgba(0,0,0,0.2);
}
/* ヘッダーホバーアニメーション */
.l-header__inner:hover {
/*background-color: rgba(255, 255, 255, 0.23);*/
transition: background-color 0.8s
}
/* ヘッダー追従 */
.l-header__inner {
width:100%;
color:white;
margin: 0 auto;
}
/*メニューカスタマイズ*/
.c-gnav .sub-menu {
font-size: 13px;
background-color: rgba(255, 255, 255, 0.65); /* 背景色 */
border: 1px solid rgba(255, 255, 255, 0.35); /* ボーダー */
border-radius: 8px;
}
/*ヘッダー幅*/
@media screen and (min-width:960px) {
/* ヘッダーメイン*/
.-txt .c-headLogo__link{
font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 18px;
font-style: normal;
}
.-series .l-header__logo {
padding: 0;
}
.l-header__inner {
margin: 9px;
}
.l-header__inner.l-container {
max-width: 900px;
margin-left: calc((100% - 900px) /2);
margin-right: calc((100% - 900px) /2);
height: 65px;
}
.c-gnav .sub-menu:before {
border-radius: 8px
}
}
@media screen and (max-width:720px) {
.l-header__inner.l-container {
max-width: 100%;
}
}
@media screen and (min-width:600px) {
.-txt .c-headLogo__link{
font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 20px;
font-style: normal;
}
}
/*moreボタン*/
a.btn_text:hover{
background-color: rgba(255, 255, 255, 0.20);
border: 0.25px solid rgba(255, 255, 255, 0.35);
}
button.c-fixBtn.c-plainBtn.hov-bg-main:{
background-color: rgba(255, 255, 255, 0.30);
border: 0.25px solid rgba(255, 255, 255, 0.35);
}
.c-fixBtn:hover {
background-color: rgba(255, 255, 255, 0.30);
}
button.c-tabList__button:hover{
background-color: rgba(255, 255, 255, 0.30);
border: 0.25px solid rgba(255, 255, 255, 0.35);
border-radius: top 8px;
}
.is-style-default>.c-tabList .c-tabList__button:hover, .is-style-default>.c-tabList .c-tabList__button[aria-selected=true] {
background-color: white;
border: 0.25px solid rgba(255, 255, 255, 0.35);
color: black;
border-radius: 8px;
}
.is-style-default>.c-tabList .c-tabList__button:hover, .is-style-default>.c-tabList .c-tabList__button:hover {
background-color: rgba(255, 255, 255, 0.30);
border: 0.25px solid rgba(255, 255, 255, 0.35);
color:white;
border-radius: top 8px;
}
