のクラス*/
.hidari-moji{
display: inline-block;
text-align: justify;
text-justify: inter-ideograph;
}
/*★改行したくない文字を囲う*/
span.aks {
display: inline-block;
}
/* ★非表示 */
.no{
display:none;
}
/* ★下の余白なし */
.bottom-no{
margin-bottom:0!important;
}
/* ★上だけ角丸文字囲い用 */
.ue-maru-moji{
border-radius: 30px 30px 0px 0px;
}
/* ★上だけ角丸 */
.ue-maru{
border-radius: 1000px 1000px 0px 0px;
padding: 0 1.4em!important;
}
/* ★上だけ角丸用スペンサー */
.ue-maru-s{
height:8em!important;
}
/* ★上だけ角丸用線余白 */
hr.ue-maru-sen-m-yohaku{
width: 75%;
}
/*★スケジュール時間用番号付きリスト my-time-list */
/* 1. リスト全体の基本設定 */
ol.my-time-list {
list-style: none !important;
padding: 0 !important; /* ★左に30pxの余白を追加して軸を戻す */
margin: 0 auto !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
counter-reset: my-counter !important;
margin-left: 30px !important;
}
/* 2. 各項目（li） */
ol.my-time-list li {
position: relative !important;
display: inline-flex !important;
align-items: center !important;
color: #2557a7 !important; /* あなたの数値 */
font-weight: bold !important;
padding: 15px 15px 15px 36px !important; /* あなたの数値 */
margin-bottom: 1em !important; /* あなたの数値 */
line-height: 1.2 !important;
counter-increment: my-counter !important;
z-index: 1 !important;
}
/* 3. 黄色の背景（右側をより高く切り抜く） */
ol.my-time-list li::after {
content: "" !important;
position: absolute !important;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #fff100 !important; /* あなたの数値 */
z-index: -1 !important;
/* ★形状：あなたの数値を維持 */
clip-path: polygon(0% 20%, 100% 0%, 100% 100%, 0% 80%) !important;
}
/* 4. 数字の丸（デザイン維持） */
ol.my-time-list li::before {
content: counter(my-counter) !important;
display: flex !important;
position: absolute !important;
left: -30px;
top: 50% !important;
transform: translateY(-50%) !important;
width: 50px !important; /* あなたの数値 */
height: 50px !important; /* あなたの数値 */
background-color: #34bdeb !important; /* あなたの数値 */
color: #fff !important;
border-radius: 50% !important;
align-items: center !important;
justify-content: center !important;
font-size: 30px !important; /* あなたの数値 */
z-index: 2 !important;
}
/* 偶数番目の色替え */
ol.my-time-list li:nth-child(even)::before {
background-color: #ee8383 !important; /* あなたの数値 */
}
/* ========== circle & wave path start ========== */
/* v1.0.2 add */
/* 枠としての svg のサイズ指定 */
.cstm-blk-path-lower-cir svg,
.cstm-blk-path-upper-cir svg{
display: block;
width: 100%;
height: 18vmin;
}
:where(.cstm-blk-path-lower-wave, .cstm-blk-path-upper-wave) svg {
display: block;
fill: #f6f6f6;
width: 100%;
height: 11vmin;
}
.cstm-blk-path-upper-cir,
.cstm-blk-path-upper-wave {
margin-bottom: 0 !important;
}
.cstm-blk-path-upper-wave+.wp-block-cover>.wp-block-cover__inner-container,
.cstm-blk-path-lower-wave+.wp-block-cover>.wp-block-cover__inner-container,
.cstm-blk-path-upper-cir+.wp-block-cover>.wp-block-cover__inner-container,
.cstm-blk-path-lower-cir+.wp-block-cover>.wp-block-cover__inner-container {
padding-top: 3rem;
}
:where(.cstm-blk-path-upper-cir, .cstm-blk-path-upper-wave) {
transform: translateY(1px);
}
:where(.cstm-blk-path-lower-cir, .cstm-blk-path-lower-wave) {
transform: translateY(-22px);
}
/* ========== circle & wave path end ========== */
/*★横スクロールなくす */
body {
overflow-x: clip;
}
/* ヘッダーの基本状態とアニメーション */
.mobile-header-menu-buttons {
transition: top 0.4s ease !important;
}
/* 下スクロール時に隠す（JSでクラスを付与） */
.header-hide {
top: -240px !important; /* 十分な高さで隠す */
}
/* フッターの基本状態とアニメーション */
.mobile-footer-menu-buttons {
transition: bottom 0.4s ease !important;
}
/* 下スクロール時に隠す（JSでクラスを付与） */
.footer-hide {
bottom: calc(-150px - env(safe-area-inset-bottom)) !important;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1300px以下*/
@media screen and (max-width: 1300px){
/*★ヘッダーメニュー文字大きさ */
.navi-in a{
font-size:12px;
}
.navi-in .fas {
font-size:14px;
}
.rp-yohaku{
padding:0 0px;
}
.rm-yohaku{
margin:0 0em;
}
/* ★投稿 */
body.single .main{
border-radius: 650px 650px 0px 0px;
}
/* ★上だけ角丸 */
.ue-maru{
border-radius: 650px 650px 0px 0px;
padding: 0 5em!important;
}
/* ★上だけ角丸用スペンサー */
.ue-maru-s{
height:6em!important;
}
/* ★上だけ角丸用線余白 */
hr.ue-maru-sen-m-yohaku{
width: 85%;
}
}
/*1023px以下*/
@media screen and (max-width: 1023px){
/*★モバイルで上へボタン表示 */
.mblt-header-and-footer-mobile-buttons .go-to-top-button {
display:flex;
}
body:where(.mblt-header-mobile-buttons, .mblt-header-and-footer-mobile-buttons) {
margin-top: 0px;
}
.menu-content{
width:30%;
}
body:not(.page-id-123) .main {
top:-8px;
}
.cstm-clip-lower-kaku {
clip-path: polygon(400% 0%, -300% 0%, 50% 100%);
min-height: 88vh !important;
}
.n2-ss-slider .n2-ss-layer{
margin-top:-43px!important;
}
/* ★投稿 */
body.single .main{
border-radius: 500px 500px 0px 0px;
}
.single .entry-title {
margin-top: 7.5em !important;
}
/* ★上だけ角丸 */
.ue-maru{
border-radius: 500px 500px 0px 0px;
padding: 0 3em!important;
}
/* ★上だけ角丸用スペンサー */
.ue-maru-s{
height:4em!important;
}
.widget-footer-left,
.widget-footer-center{
margin-bottom:1em!important;
}
}
/*834px以下*/
@media screen and (max-width: 834px){
/*コピーライト文字調整*/
#footer .source-org.copyright,
#footer .source-org.copyright span,
.copyright {
font-size: 0.9em !important; /* お好みのサイズに */
}
.menu-content{
width:50%;
}
body:not(.page-id-21) .article h2,
.single .entry-title{
font-size:22px;
}
.rote-h-sp-no,
.rote-m-sp-no{
transform: rotate(0deg);
}
.sp-no{
display:none!important;
}
/*★PCだけ改行
*/
.br-pc {
display: none;
}
.pc {
display: none;
}
/* ★投稿 */
body.single .main{
border-radius:400px 400px 0px 0px;
padding: 0 3em!important;
border-width:1.5em;
}
/* ★上だけ角丸 */
.ue-maru{
border-radius: 400px 400px 0px 0px;
padding: 0 2em!important;
}
/* ★上だけ角丸用スペンサー */
.ue-maru-s{
height:3em!important;
}
/* ★上だけ角丸用線余白 */
hr.ue-maru-sen-m-yohaku{
width: 90%;
}
.footer-widgets-mobile{
font-size: 13px!important;
}
}
/*946px以下*/
@media screen and (max-width: 946px){
.staff-card{
max-width:100%;
}
.staff-card {
min-height:100px;
}
}
/*480px以下*/
@media screen and (max-width: 480px){
/*必要ならばここにコードを書く*/
div#n2-ss-2 .n2-ss-slider-1 {
min-height: 650px!important;
}
.cstm-clip-lower-kaku {
clip-path: polygon(400% 0%, -300% 0%, 50% 100%);
min-height: 65vh !important;
}
.n2-ss-slider .n2-ss-layer{
margin-top:-23px!important;
}
body:not(.page-id-21) .article h2{
font-size:24px;
letter-spacing: 0.08em;
line-height: 1.4;
}
#header-container::before {
top: 10px;
}
.mobile-header-menu-buttons .logo-menu-button{
top: -130px;
width: 10em;
height: 10em;
}
.mobile-header-menu-buttons .navi-menu-button {
top:-100px;
right:3px;
}
.cstm-blk-path-lower-cir svg,
.cstm-blk-path-upper-cir svg{
height: 14vmin;
}
/* ★上だけ角丸 */
.ue-maru{
border-radius: 200px 200px 0px 0px;
padding: 0 1.3em!important;
}
/* ★上だけ角丸用スペンサー */
.ue-maru-s{
height:2em!important;
}
.article h3{
font-size:22.5px;
}
.article h4{
font-size:17.5px;
}
.article h5{
font-size:16px;
}
.a-table td{
font-size:15px!important;
}
.single .entry-title{
font-size:20px;
letter-spacing: 0.08em;
line-height: 1.4;
padding:0;
margin-top:4em!important;
}
}
/*834px以上*/
@media screen and (min-width:834px){
/*★スマホだけ改行
*/
.br-sp {
display: none;
}
.sp {
display: none;
}
.staff-list {
flex-direction: row;
flex-wrap: wrap;
justify-content: center; /* PCでも中央から並べる */
}
}
/*500px以下*/
@media screen and (max-width: 500px){
/*必要ならばここにコードを書く*/
.menu-content{
width:71%;
height:103%;
}
/* ★上だけ角丸用線余白 */
hr.ue-maru-sen-m-yohaku{
width: 95%;
}
#footer::before,
.mobile-footer-menu-buttons::before{
width: 100vw;
left: 50%;
transform: translateX(-50%);
height: 40px;
top: -39px;
background-size: 100% 100% !important;
}
}
/*700px以下*/
@media screen and (max-width: 700px){
/* ★投稿 */
body.single .main{
top:70px!important;
border-width:1em;
padding: 0 1.5em!important;
}
.single .entry-title::after {
max-width:100%;
}
.single .content-in {
max-width:90%;
}
}