.my-div-style{margin-top:5rem}.next-main-container{margin-top:4.5rem}

/*!
* Sportivate サイトトップページ画像のサイズ、デザイン変更（img-fluidをカスタマイズ）
*/.image-container{position:relative;width:100%;height:75vh;overflow:hidden}.image-container img{width:100%;height:100%;object-fit:cover}.image-container h1{top:50%}.image-container a,.image-container h1{position:absolute;left:50%;transform:translate(-50%,-50%);color:white;margin:0}.image-container a{top:65%;font-size:1rem}

/*!
* ナビバーのデザイン変更
* メニューカラーの文字色変更　⇒　白へ
*/.navbar-dark .navbar-nav .nav-link{color:#fff}
/*!
* ナビバーのデザイン変更
* ナビバックグラウンドカラーの変更　⇒　デフォルトグレーから緑へ
*/.navbar-custom{background-color:#202f55}


/*!
* ブログリストの作成時刻　フォントサイズ変更
* デフォルト　1.125rem;　→　0.725rem;
*/.post-preview>.post-meta{font-size:.525rem;color:#6c757d}.bg-dark-blue{--bs-bg-opacity:1;background-color:#202f55!important}

/*!
* PCメニュー、スマホメニューを分けて設定  詳細は上段の media に設定
*/.smart-menu{font-size:20px}.pc-menu{font-size:22px;margin-top:2px;margin-right:20px}

/*!
* ボタン用のcss
* ボタンサイズをデフォルトから少し小さくする  font-size 1rem →　0.75rem
* paddingを微調整　→　0.5rem 1.0rem
* border-radiusを追加設定　 0.25rem;
*/.btn{padding:.9rem 1.575rem;font-size:.75rem;border-radius:.25rem}@media (max-width:991px){#collapseSidebar,#expandSidebar{display:none!important}}#collapseSidebar{left:190px;z-index:10;padding:6px 10px}#collapseSidebar,#expandSidebar{position:fixed;top:500px;background-color:silver;color:#fff;border:none;border-radius:4px;cursor:pointer}#expandSidebar{left:10px;z-index:1000;padding:8px 12px}

/*!
* ボタンカラー用のcss
* プライマリー　ログインボタン、会員登録ボタン他　（デフォルトピンク　⇒　ライトグリーン）
*/.btn-login,.btn-signup{color:#fff;background-color:#09bd42;border-color:#09ee8b;border-radius:20px}.btn-primary{color:#fff;background-color:#202f55;border-color:midnightblue}.btn-secondary{color:#fff;background-color:seagreen;border-color:seagreen}.btn-success{color:#fff;background-color:#138299;border-color:#198754}.btn-danger{color:#fff;background-color:#c10517;border-color:#dc3545}.btn-social-account{color:blue;background-color:white;border-color:lightgray;border-radius:20px}


/*!
* トップページ（indexページ）用デザイン
* サークルのデザイン変更（ radius削除、background カラー変更 ）
*/header.masthead .bg-my-design{z-index:0;position:absolute;background:linear-gradient(0deg,#7dd215,#d6e3f1)}header.masthead{position:relative;overflow:hidden;padding-top:calc(7rem + 72px);padding-bottom:7rem;background:linear-gradient(0deg,#c0e9b7,#94d589);background-repeat:no-repeat;background-position:50%;background-attachment:scroll;background-size:cover}

/*!
* トップページ用デザイン1
* タイトル SportsActivate.com は一番上段に表示される必要があるため z-index 10 とする
*/header.masthead .masthead-content{z-index:10}
/*!
* トップページ用デザイン1　ワイド画面時左端の画像
* 画像の掲載箇所変更 (bottom left 調整)
*/header.masthead .bg-circle-1{z-index:9;height:90rem;width:39rem;bottom:-67.8rem;left:-5rem}
/*!
* トップページ用デザイン2
* 画像の掲載箇所変更
*/header.masthead .bg-circle-2{z-index:8;height:32rem;width:32rem;top:3rem;left:15%}
/*!
* トップページ用デザイン3
* 画像の掲載箇所変更 (bottom right 調整)
*/header.masthead .bg-circle-3{z-index:7;height:20rem;width:20rem;bottom:4rem;right:14%}
/*!
* トップページ用デザイン4
* 画像の掲載箇所変更 (bottom left 調整)
*/header.masthead .bg-circle-4{z-index:6;height:32rem;width:30rem;top:6rem;right:29%}


/*!
* ページの大枠のサイズを決める containerのサイズ調整
* デフォルトだと横幅が少し余る。かつ、max 1320pxの設定のため、max 2580px まで拡張する。
* 以下 mediaクエリ　画面サイズ別 デザイン
*/@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1180px}}@media (min-width:1400px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:100%!important;width:100%;display:block;padding:0 20px}}@media (min-width:1600px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:1580px}}@media (min-width:1800px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:1780px}}@media (min-width:2000px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:1980px}}@media (min-width:2200px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:2180px}}@media (min-width:2400px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:2380px}}@media (min-width:2600px){.container-lg,.container-md,.container-sm,.container-xl,.container-xxl,.my-container{max-width:2580px}}

/*!
* トップページ用デザイン
* タイトルフォントサイズ　レスポンシブ対応  992px 以上は 6rem がデフォルト
* 以下 mediaクエリ　画面サイズ別 デザイン
*/@media (min-width:200px){.top-page-title,header.masthead .masthead-content .masthead-heading{font-size:1.8rem}}@media (min-width:374px){.top-page-title,header.masthead .masthead-content .masthead-heading{font-size:2.4rem}}@media (min-width:576px){.top-page-title,header.masthead .masthead-content .masthead-heading{font-size:3.6rem}}@media (min-width:768px){.top-page-title,header.masthead .masthead-content .masthead-heading{font-size:4.8rem}}@media (min-width:992px){.top-page-title,header.masthead .masthead-content .masthead-heading{font-size:6rem}}


/*!
* 画面の大きさにより、main-contents、side-barの表示幅を決定する。
* その他、ナビメニューの表示、ユーザー設定メニューの切替等をする。
*/@media (min-width:200px){.pc-menu{display:none}.main-contents,.main-contents-no-sidebar,.main-contents-with-menu,.side-bar{width:100%}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:14px}.user-setting-row{gap:0}.user-setting-menu-box{overflow-x:auto;white-space:nowrap}.user-setting-menu{color:midnightblue;background-color:white;border-color:lightsteelblue;border-radius:10px;margin-bottom:3px;margin-right:3px;padding:12px}.next-team-layout{display:flex;flex-direction:column;margin-top:1px;min-height:100vh}.next-team-sidebar{width:100%;background-color:#f8f9fa;border-bottom:1px solid #ddd;position:-webkit-sticky;position:sticky;top:0;z-index:100}.pc-toggle-area{display:none}.logged-in.main-container{margin-top:0}.next-user-setting-menu-box{overflow-x:auto;white-space:nowrap}}@media (min-width:576px){.pc-menu{display:none}.main-contents,.main-contents-no-sidebar,.main-contents-with-menu,.side-bar{width:100%}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:15px}.user-setting-row{gap:0}.user-setting-menu-box{overflow-x:auto;white-space:nowrap}.user-setting-menu{color:midnightblue;background-color:white;border-color:lightsteelblue;border-radius:10px;margin-bottom:3px;margin-right:3px;padding:12px}}@media (min-width:768px){.pc-menu{display:none}.main-contents,.main-contents-no-sidebar,.main-contents-with-menu,.side-bar{width:100%}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:13px}.user-setting-row{gap:0}.user-setting-menu{color:midnightblue;background-color:white;border-color:lightsteelblue;border-radius:10px;margin-bottom:4px;margin-right:4px;padding:12px}}@media (min-width:992px){.smart-menu{display:none}.pc-menu{display:block}.main-contents{width:70%;margin-right:20px;transition:margin-left .3s ease}.main-contents-with-menu{width:55%;margin-right:20px}.main-contents-no-sidebar{width:100%}.main-contents-no-sidebar.collapsed,.main-contents.collapsed{margin-left:0}.main-contents-with-menu.collapsed{width:100%;margin-left:0}.side-bar{width:30%}.menu-sidebar{position:fixed;top:0;left:0;width:230px;height:100%;background-color:#f8f9fa;box-shadow:2px 0 10px rgba(0,0,0,.1);transition:left .3s ease;display:flex;flex-direction:column;align-items:center;text-align:center}.menu-sidebar.collapsed{left:-200px}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:13px}.user-setting-side-bar{width:200px;margin-right:5px}.user-setting-side-bar.collapsed{width:10px}.blog-detail-row,.schedule-detail-row,.team-base-row{display:flex}.widget--sticky{position:-webkit-sticky;position:sticky;top:70px}.user-setting-row{display:flex;gap:40px}.user-setting-menu-box{white-space:normal}.user-setting-menu{flex:0 0 auto;width:75%;color:midnightblue;background-color:white;border-color:lightsteelblue;border-radius:10px;padding:12px 20px;margin-bottom:5px;margin-right:5px}.team-dashboard{display:flex;width:100%}.next-team-layout{display:flex;flex-direction:row;margin-top:1px}.next-team-sidebar{height:100vh;border-bottom:none;border-right:1px solid #ddd;flex-shrink:0;transition:width .3s ease-in-out;width:var(--sidebar-width,260px)}.next-menu-sidebar{position:fixed;top:0;left:0;width:230px;height:100%;background-color:#f8f9fa;box-shadow:2px 0 10px rgba(0,0,0,.1);transition:all .3s ease;display:flex;flex-direction:column;align-items:center}.next-menu-sidebar.collapsed{width:80px;left:0}.next-widget--sticky{position:-webkit-sticky;position:sticky;top:5rem;align-self:stretch;max-height:calc(100vh - 5rem)}.next-user-setting-menu-box{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;white-space:normal;text-align:center}.pc-toggle-area{display:block;position:absolute;right:-15px;top:20px}.pc-toggle-area.collapsed{right:5px!important}}@media (min-width:1200px){.smart-menu{display:none}.pc-menu{display:block}.main-contents{width:70%;margin-right:20px}.main-contents-with-menu{width:55%;margin-right:20px}.main-contents-no-sidebar{width:100%}.side-bar{width:30%;margin-right:1px}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:15px}.user-setting-side-bar{width:200px;margin-right:5px}.blog-detail-row,.schedule-detail-row,.team-base-row{display:flex}.widget--sticky{position:-webkit-sticky;position:sticky;top:70px}.user-setting-row{display:flex;gap:40px}.user-setting-menu-box{white-space:normal}.user-setting-menu{flex:0 0 auto;width:75%;color:midnightblue;background-color:white;border-color:lightsteelblue;margin-bottom:5px;margin-right:5px}.team-dashboard{display:flex;width:100%}}@media (min-width:1400px){.smart-menu{display:none}.pc-menu{display:block}.main-contents{width:70%;margin-right:20px}.main-contents-with-menu{width:55%;margin-right:20px}.main-contents-no-sidebar{width:100%}.side-bar{width:30%;margin-right:1px}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:16px}.user-setting-side-bar{width:200px;margin-right:5px}.blog-detail-row,.schedule-detail-row,.team-base-row{display:flex}.widget--sticky{position:-webkit-sticky;position:sticky;top:70px}.user-setting-row{display:flex;gap:40px}.user-setting-menu{flex:0 0 auto;width:75%;color:#040438;background-color:#fcfcfc;border-color:lightsteelblue;margin-bottom:5px;margin-right:5px}.team-dashboard{display:flex;gap:50px}}@media (min-width:1600px){.smart-menu{display:none}.pc-menu{display:block}.main-contents{width:70%;margin-right:20px}.main-contents-with-menu{width:55%;margin-right:20px}.main-contents-no-sidebar{width:100%}.side-bar{width:30%;margin-right:1px}.sidebar-blog-post{display:flex}.sidebar-blog-post-image{width:110px;height:80px}.sidebar-blog-post-title{margin-left:30px;width:300px;height:80px;font-size:16px}.user-setting-side-bar{width:200px;margin-right:5px}.blog-detail-row,.schedule-detail-row,.team-base-row{display:flex}.widget--sticky{position:-webkit-sticky;position:sticky;top:70px}.user-setting-row{display:flex;gap:40px}.user-setting-menu{flex:0 0 auto;width:75%;color:#040438;background-color:#fcfcfc;border-color:lightsteelblue;margin-bottom:5px;margin-right:5px}.team-dashboard{display:flex;gap:50px}}@media (min-width:200px){.next-user-setting-row{width:100%;flex-direction:column}.next-user-setting-sidebar{flex:0 0 10px;margin-top:70px}.next-dashboard{display:flex;flex-direction:column;gap:15px;width:100%}.next-dashboard-child-layout{border:1px solid lightgray;border-radius:10px;padding:10px;margin-bottom:10px;width:100%;flex:1 1 auto;min-width:0;max-width:100%}}@media (min-width:992px){.next-user-setting-row{display:flex;flex-direction:row;width:100%;padding:20px;gap:40px;margin-top:50px}.next-user-setting-sidebar{flex:0 0 200px}.next-dashboard{display:flex;flex-direction:row}.next-dashboard-child-layout{border:1px solid lightgray;border-radius:10px;padding:10px;margin-bottom:10px;flex:1 1 400px;min-width:350px;max-width:600px}}

/*!
* ブログ一覧（blog）ページ用のcss　
* 一覧ページにブログ画像のサムネイルを表示し、その横にタイトル、サブタイトルを表示したい。
* （スマホ画面に切り替えるとサムネイル画像が表示されなくなるので改善が必要（2022年7月29日）
*/.blog-list-post{display:flex;margin-bottom:30px}

/*!
* ブログ一覧（blog）ページ用のcss
* 画面の大きさにより、ブログサムネイル、ブログタイトルの表示幅を決定する。
*/@media (min-width:200px){.blog-list-post-image{width:80px;height:50px;flex-shrink:0}.blog-list-post-title{margin-left:10px;width:220px;height:40px;font-size:12px}.blog-list-post-subtitle{margin-top:10px;margin-left:10px;width:220px;height:10px;font-size:9px}.schedule-monthly-summary{font-size:9px}}@media (min-width:374px){.blog-list-post-image{width:110px;height:80px;flex-shrink:0}.blog-list-post-title{margin-left:10px;width:220px;height:55px;font-size:16px}.blog-list-post-subtitle{margin-top:15px;margin-left:10px;width:220px;height:25px;font-size:12px}.schedule-monthly-summary{font-size:11px;color:red;background-color:ghostwhite;border-radius:3px;margin:5px}}@media (min-width:576px){.blog-list-post-image{width:180px;height:100px;flex-shrink:0}.blog-list-post-title{margin-left:30px;width:310px;height:70px;font-size:22px}.blog-list-post-subtitle{margin-top:30px;margin-left:30px;width:310px;height:30px;font-size:16px}.schedule-monthly-summary{font-size:13px}}@media (min-width:768px){.blog-list-post-image{width:180px;height:100px;flex-shrink:0}.blog-list-post-title{margin-left:30px;width:500px;height:60px;font-size:30px}.blog-list-post-subtitle{margin-top:60px;margin-left:30px;width:500px;height:40px;font-size:20px}.schedule-monthly-summary{font-size:15px}}@media (min-width:992px){.blog-list-post-image{width:180px;height:100px;flex-shrink:0}.blog-list-post-title{margin-left:30px;width:600px;height:60px;font-size:30px}.blog-list-post-subtitle{margin-top:50px;margin-left:30px;width:600px;height:60px;font-size:20px}.schedule-monthly-summary{font-size:17px}}@media (min-width:1200px){.blog-list-post-image{width:180px;height:100px;flex-shrink:0}.blog-list-post-title{margin-left:30px;width:700px;height:60px;font-size:30px}.blog-list-post-subtitle{margin-top:30px;margin-left:30px;width:700px;height:40px;font-size:20px}.schedule-monthly-summary{font-size:19px}}@media (min-width:1400px){.blog-list-post-image{width:180px;height:100px}.blog-list-post-title{margin-left:30px;width:800px;height:60px}.blog-list-post-subtitle{margin-top:40px;margin-left:30px;width:800px;height:40px;font-size:21px}}

/*!
* リーグ試合結果 tableの css
*/.league-match-table{font-size:10pt;border-color:whitesmoke;padding:10px;box-shadow:0 3px 6px rgba(0,0,0,.25)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:1000;display:flex;justify-content:center;align-items:center}.modal-content{background-color:white;padding:20px;border-radius:8px;width:90%;max-width:500px;z-index:1001;overflow:auto}.signup-form-input-control{display:block;width:100%;padding:.375rem .75rem;border:1px solid #ced4da;border-radius:.25rem}.calendar-parent{container-type:inline-size;container-name:calendar-container;width:100%}.calendar-wrapper .fc-button{padding:8px 12px!important;font-size:.9rem!important}@container calendar-container (max-width: 600px){.calendar-wrapper .fc-header-toolbar{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 0}.calendar-wrapper .fc-toolbar-chunk:first-child{flex:0 0 33%;order:1;display:flex;justify-content:flex-start}.calendar-wrapper .fc-toolbar-chunk:nth-child(2){flex:0 0 33%;order:2;display:flex;justify-content:center;font-weight:700;font-size:.5em!important}.calendar-wrapper .fc-toolbar-chunk:nth-child(3){flex:0 0 33%;order:3;display:flex;justify-content:flex-end}.calendar-wrapper .fc-toolbar-chunk:first-child .fc-button,.calendar-wrapper .fc-toolbar-chunk:nth-child(3) .fc-button{font-size:.75rem!important;padding:2px 5px!important;height:auto!important}.calendar-wrapper .fc-toolbar-chunk:first-child .fc-icon{font-size:.9em!important}.calendar-wrapper .fc-next-button,.calendar-wrapper .fc-prev-button{width:48px;height:48px;border-radius:8px}}