@charset "utf-8";
/*
Theme Name:Footbrio
Theme URI:https://footbrio.com
Description:Footbrio【オリジナルテーマ】
Author:株式会社リッシン
Author URI:https://rissin-corp.co.jp
Version:1.0
*/
/*Element reset*/
html{font-feature-settings:"palt"; scroll-behavior:smooth}
body,div,h1,h2,h3,h4,h5,h6,p,ol,ul,li,dl,dt,dd,button,small,strong,table,input{margin:0; font-size:1em}
body,pre{font-family:-apple-system, BlinkMacSystemFont,'Helvetica Neue', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN',"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; -webkit-font-smoothing:antialiased; line-height:1.75; color:#001324}
ul,ol{padding:0; list-style:none}
i,em,var,address{font-style:normal}
img{max-width:100%; height:auto}
a{display:block; color:inherit; text-decoration:none}
pre{white-space:pre-line; margin:0}
button{background:none; border:0; outline:0; appearance:none}
.lineclamp{line-height:1.5em; max-height:3em; background-color:inherit; position:relative; overflow:hidden; text-align:justify; display:block}
.lineclamp::before{content:"..."; position:absolute; right:0; top:1.5em; display:inline-block; width:1em; height:1.5em; background-color:inherit; line-height:1.5em; color:inherit}
.lineclamp::after{content:""; position:relative; float:right; width:1em; height:1.5em; background-color:inherit; margin-bottom:-1.5em}
body > *{font-family:"Hiragino Sans", "Helvetica Neue", "Helvetica", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif; letter-spacing:1rem}
body a{transition:all .3s}
body a:hover{opacity:.5}
body.Hbfixed{position:fixed}
.splide__list{margin: 0; padding: 0;}

@keyframes zoomUp {
  0% {
    -webkit-transform:scale(1);
    transform:scale(1);
  }
  100% {
    -webkit-transform:scale(1.15);
    transform:scale(1.15);
  }
}

@keyframes animeUp {
	0% {-webkit-top: 0; top: -6rem;}
	30%{-webkit-top: 0; top: -12rem;}
	45%{-webkit-top: 0; top: -6rem;}
	60%{-webkit-top: 0; top: -12rem;}
	100%,
	75%{-webkit-top: 0; top: -5rem;}
}

/* 登場アニメ（2026-09-26）。位置調整に transform を使っている要素が多いので、
   上書きしないよう動きは translate プロパティで付ける。移動量は SP/PC の変数で持つ。
   fadeUp はヒーローのテキスト群と、data-anim を付けた各セクションの要素で共通。 */
@keyframes fadeUp{0%{opacity:0; translate:0 var(--AnimRise)} 100%{opacity:1; translate:0 0}}
@keyframes heroSlideIn{0%{opacity:0; translate:calc(var(--HeroSlide) * -1) 0} 100%{opacity:1; translate:0 0}}
/* 視差効果を減らす設定の人には動かさず、最初から表示する */
@media (prefers-reduced-motion:reduce){
	.HeroCopyArea,.HeroVisualArea .PhoneMock,html.JsAnim [data-anim]{opacity:1!important; animation:none!important}
}

/* 背景グラデの回転は 2026-09-12 に廃止。
   2026-08-25 に 220vmax の要素を transform で30秒かけて1回転させる方式を入れたが、
   動きが内容の邪魔になるため静止したグラデに戻した。
   .TopGradient の linear-gradient(135deg) 自体は SP/PC 両ブロックに残っている。 */

/* 背景の粒子（tsParticles）は 2026-09-22 に廃止。
   トップの固定グラデをフッターより背面に置く。背景も不透明にして透過させない。 */
body:has(.TopGradient) footer{position:relative; z-index:2; background:#1d2327}

@media(max-width:789.9px){
	html.html{font-size:calc(100vw / 750); margin-top:0!important}
	html #wpadminbar{position:absolute; bottom:0; display:none}
	body{font-size:24rem}
	main{font-size:30rem; margin-bottom:100rem}
	main.TopPage{margin-bottom:0}
	h1,h2,h3,h4,h5,div,p{font-weight:500}
	.PcOnly{display:none}
	body{font-size:16rem}
	/* トップは body に1枚だけグラデを敷き、fixed で画面に固定する。
	   ヒーローとコンテンツで別々に敷くと、要素基準と画面基準で
	   グラデの起点がずれ、境目で色が途切れる（2026-08-24）。 */
	body:has(.TopPage){overflow-x:hidden}
	h1,h2,h3,h4,h5,div,p{line-height:1; font-weight:500}
	.Header{position: absolute; top:0; display:flex; height:110rem; width:100%; justify-content:space-between; align-items:center; z-index:2; border-bottom:solid 1rem #fff}
	/* トップだけヘッダーを透明にする。body.home はこのサイトでは付かない
	   （固定ページをトップに設定しているため）。背景要素の有無で判定する。 */
	body:has(.TopGradient) .Header{background:transparent; border-bottom:none}
	.HeaderInnear{display:flex; justify-content:center; align-items:center; width:100%; height:100%; margin:0 auto;  color:#000}
	.HeaderLogoWrap{display:flex; align-items:center; width:100%; height:110rem;width:100%; height:100%; z-index:3; background:transparent}
	.HeaderLogo{line-height:0; }
	.HeaderLogoAnc{margin-left:24rem}
	.HeaderLogoAnc img{width:250rem}
	.HeaderNav{display:none}
	.HeaderNav .HeaderLogo{position:absolute}
	#GlobalMenuInput{display:block; position:absolute; right:0; width:120rem; height:110rem; z-index:4; opacity:0}
	#GlobalMenu{position:fixed; right:0; width:120rem; height:110rem; z-index:3; text-align:center}
	.GlobalMenuRect{position:relative; width:60rem; height:4rem; border-radius: 30rem; top:30rem; left:calc(50% - 30rem); margin-bottom:13rem; background:#fff; border-radius:10rem; transition:all .2s}
	.GlobalMenuWords{position:relative; top:35rem; color:#fff; text-align:center; font-size:18rem; font-weight:bold; letter-spacing:2rem; transition:all .2s}
	#GlobalMenuInput:checked{top:0}
	#GlobalMenuInput:checked~#GlobalMenu{position:fixed}
	#GlobalMenuInput:checked~#GlobalMenu .Rect1{top:42rem; left:30rem; transform:translateY(0) rotate(145deg)}
	#GlobalMenuInput:checked~#GlobalMenu .Rect2{top:25rem; left:30rem; transform:translateY(0) rotate(-145deg)}
	#GlobalMenuInput:checked~.HeaderNavSp{visibility:visible; opacity:1; overflow-y:scroll}
	.HeaderNavSp{position:absolute; top:0; width:100%; height:100vh; opacity:0; visibility:hidden; background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); transition:.5s}
	.HeaderNavSpUl{position:relative; padding-top:130rem}
	.HeaderNavSpUl .HeaderNavLi{position:relative; display:flex; justify-content:flex-start; align-items:center; width:100%; height:110rem; padding:0 60rem; line-height:3.9; font-size:32rem; border-bottom:solid 1rem rgba(255,255,255,.4)}
	.HeaderNavSpUl2{margin-top:30rem}
	.HeaderNavSpUl2 .HeaderNavLi{position:relative; display:flex; justify-content:flex-start; align-items:center; width:100%; height:75rem; padding:0 60rem; font-size:28rem}
	.HeaderNav:first-child{margin-bottom:25rem}
	.HeaderNavLiAnc{color:#fff; font-weight:500; height:75rem; line-height:75rem}
	.HeaderNavSp p{text-align:center; margin:180rem 0 50rem}
	.HeaderNavSp p img{width:300rem}
	.Container{width:650rem; margin:0 auto}
	.H2Span{position:relative; display:inline-block}
	.Btn1{width:220rem; height:42rem; line-height:44rem; margin:50rem auto; border-radius:50rem; box-shadow:none; font-family:inherit; font-size:16rem; font-weight:normal; color:#fff; text-align:center; letter-spacing:.5rem}
	
	/*トップページ*/
	.TopPage{margin-bottom:0}
	/* 固定グラデーション本体。画面の対角より大きい正方形を中央に置く。
	   はみ出しは body 側の overflow-x で隠れる。
	   pointer-events:none にしないと、上のリンクが押せなくなる。 */
	.TopGradient{position:fixed; top:50%; left:50%; width:220vmax; height:220vmax; transform:translate(-50%,-50%); background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); z-index:0; pointer-events:none}
	/* グラデより前にコンテンツを出す */
	.TopPage{position:relative; z-index:2}
	.Header{z-index:3}
	.HeroArea{position:relative; width: 100%; height: 80vh; min-height: 1450rem; padding-top: 190rem; background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); overflow:hidden}
	/*ヒーローの写真。グラデの上に透過で重ねる*/
	.HeroArea::before{content:""; position:absolute; inset:0; z-index:0; background:url("images/HeroBgSp.jpg") center/cover no-repeat; opacity:.35; pointer-events:none}
	/*スクロールで出す要素。footer-top.php のJSが html に .JsAnim、画面に入った要素に .is-show を付ける。
	  JSが動かないときは .JsAnim が付かないので、最初から表示されたままになる。遅らせたい要素は style="--AnimDelay:.15s"*/
	html{--AnimRise:40rem}
	html.JsAnim [data-anim]{opacity:0}
	html.JsAnim [data-anim].is-show{animation:fadeUp .8s cubic-bezier(.22,1,.36,1) var(--AnimDelay, 0s) both}
	/*ヒーローの登場アニメ。テキスト群は読み込み時、端末は画面に入ったら footer-top.php のJSが .is-show を付けて再生。SPはスクロールして見えた時点が起点なので待ち時間を短くする*/
	.HeroArea{--HeroSlide:120rem}
	.HeroCopyArea{animation:fadeUp .8s cubic-bezier(.22,1,.36,1) .2s both}
	.HeroVisualArea .PhoneMock{animation:heroSlideIn .9s cubic-bezier(.22,1,.36,1) .1s both paused}
	.HeroVisualArea .PhoneMock02{animation-delay:.35s}
	.HeroVisualArea.is-show .PhoneMock{animation-play-state:running}
	.HeroAreaInner{position:relative; z-index:1; max-width:1280rem; margin:0 auto; padding:15rem 0 80rem; display:grid; grid-template-columns:1fr; gap:30rem; align-items:center; min-height:auto}
	.HeroCopyArea{position:relative; text-align: center; z-index:1}
	.HeroCatList{display:flex; flex-wrap:wrap; justify-content: center; margin-bottom:55rem; padding:0 30rem; list-style:none}
	.HeroCatch{display: inline-block; padding: 15rem 25rem 15rem; font-size: 30rem; font-weight: bold; margin: 0 auto 35rem; background: #fff;}
	.HeroCatch span{display: inline-block; padding: 2rem 0; background: linear-gradient(110deg, #075FEA 0%, #55158C 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;}
	.HeroCatch b{font-size: 38rem;}
	.HeroCopyMain{text-align: center; margin-bottom:45rem; font-size:42rem; font-weight:800; text-align: center; color:#fff; letter-spacing:1rem; line-height:1.6}
	.HeroCopyMain em{color:#fff; font-size: 62rem; font-style:normal}
	.HeroCopySub{font-size:17rem; font-weight:400; color:#5a6a7c; line-height:2; letter-spacing:1.5rem; margin-bottom:48rem}
	.HeroBtnWrap{display:flex; justify-content:center; align-items:center; gap:25rem; flex-wrap:wrap}
	.HeroBtnStoreApple{width:240rem; display:block}
	.HeroBtnStoreGoogle{width:292rem; display:block}
	.HeroBtnStoreApple img,.HeroBtnStoreGoogle img{width:100%; height:auto; display:block}
	.HeroBtnAppstore{display:inline-flex; align-items:center; gap:14rem; height:64rem; padding:0 26rem 0 22rem; background:#0a1626; color:#fff; border-radius:50rem; transition:all .3s}
	.HeroBtnAppstore:hover{background:#001324; opacity:1}
	.HeroBtnAppstoreIcon{width:28rem; height:28rem; display:inline-flex; align-items:center; justify-content:center; font-size:26rem; line-height:1}
	.HeroBtnAppstoreTxt{display:flex; flex-direction:column; align-items:flex-start; line-height:1.2}
	.HeroBtnAppstoreTxt span:first-child{font-size:10rem; color:#9aa6b4; letter-spacing:1rem}
	.HeroBtnAppstoreTxt span:last-child{font-size:18rem; font-weight:bold; letter-spacing:.5rem; margin-top:2rem}
	.HeroBtnSecondary{display:inline-flex; align-items:center; height:64rem; padding:0 36rem; background:#fff; color:#0a1626; border:1.5rem solid #dde3eb; border-radius:50rem; font-size:16rem; font-weight:bold; letter-spacing:1.5rem; transition:all .3s}
	.HeroBtnSecondary:hover{border-color:#006CFE; color:#006CFE; opacity:1}
	.HeroVisualArea{display:flex; justify-content:center; align-items:center; width:100%; margin-top: 60rem;  overflow:hidden}
	.PhoneMock{position:relative; width:380rem; height:700rem;}
	.PhoneMock01{transform:translateX(80rem); z-index:1}
	.PhoneMock02{transform:translateX(-5rem); z-index:1}
	.PhoneMock img{width:100%; height:100%; object-fit:cover}
	.PhoneMockDark{transform:translateX(90rem); z-index:1; background:#0a1626}
	.PhoneNotch{position:absolute; top:14rem; left:50%; transform:translateX(-50%); width:110rem; height:32rem; background:#0a1626; border-radius:20rem; z-index:10}
	.PhoneStatus{position:absolute; top:18rem; width:100%; padding:0 32rem; display:flex; justify-content:space-between; align-items:center; font-size:13rem; font-weight:600; z-index:5}
	.PhoneStatusTime{color:#001324}
	.PhoneStatusIcons{display:inline-flex; gap:5rem; align-items:center; color:#001324}
	.PhoneMockDark .PhoneStatusTime,
	.PhoneMockDark .PhoneStatusIcons{color:#fff}
	.MapScreen{position:absolute; inset:0; padding-top:60rem; display:flex; flex-direction:column}
	.MapHeader{padding:12rem 18rem 14rem; display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1rem solid #eef1f5}
	.MapHeaderTtl{font-size:14rem; font-weight:bold; color:#001324}
	.MapHeaderArea{font-size:10rem; color:#8a96a4; letter-spacing:.5rem; margin-top:2rem}
	.MapHeaderBtn{width:30rem; height:30rem; border-radius:50%; background:#f4f6f9; display:inline-flex; align-items:center; justify-content:center; font-size:14rem}
	.MapCanvas{flex:1; position:relative; background:linear-gradient(135deg, #e6ecf3 0%, #dde6f0 100%); overflow:hidden}
	.MapRoad{position:absolute; background:#fff; opacity:.8}
	.MapRoad1{top:30%; left:-10%; width:130%; height:6rem; transform:rotate(-8deg)}
	.MapRoad2{top:55%; left:-10%; width:130%; height:5rem; transform:rotate(12deg)}
	.MapRoad3{top:0; left:40%; width:5rem; height:120%; transform:rotate(15deg)}
	.MapPark{position:absolute; background:#cde3d0; border-radius:50%}
	.MapPark1{top:15%; left:10%; width:60rem; height:50rem}
	.MapPark2{top:60%; right:8%; width:80rem; height:60rem; border-radius:30% 70% 50% 50%}
	.MapPin{position:absolute; width:32rem; height:32rem; border-radius:50% 50% 50% 0; transform:rotate(-45deg); display:flex; align-items:center; justify-content:center; box-shadow:0 4rem 8rem rgba(0,0,0,.2); border:2rem solid #fff}
	.MapPin span{transform:rotate(45deg); font-size:11rem; font-weight:bold; color:#fff; letter-spacing:0}
	.MapPin1{top:22%; left:25%; background:#006CFE}
	.MapPin2{top:45%; left:55%; background:#e74c3c}
	.MapPin3{top:62%; left:30%; background:#27ae60}
	.MapPin4{top:30%; left:70%; background:#f39c12}
	.MapPinMe{position:absolute; top:48%; left:42%; width:18rem; height:18rem; border-radius:50%; background:#006CFE; border:3rem solid #fff; box-shadow:0 0 0 6rem rgba(0,108,254,.2)}
	.MapSheet{position:absolute; bottom:0; left:0; right:0; background:#fff; border-radius:18rem 18rem 0 0; padding:14rem 16rem 20rem; box-shadow:0 -4rem 16rem rgba(0,0,0,.08)}
	.MapSheetHandle{width:36rem; height:4rem; background:#dde3eb; border-radius:2rem; margin:0 auto 12rem}
	.MapSheetItem{display:flex; gap:10rem; padding:8rem 0; border-bottom:1rem solid #f4f6f9}
	.MapSheetItem:last-child{border-bottom:0}
	.MapSheetDot{width:8rem; height:8rem; border-radius:50%; margin-top:6rem; flex-shrink:0}
	.MapSheetDot1{background:#006CFE}
	.MapSheetDot2{background:#e74c3c}
	.MapSheetTxt{flex:1; min-width:0}
	.MapSheetTtl{font-size:11rem; font-weight:bold; color:#001324; line-height:1.3; margin-bottom:3rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
	.MapSheetMeta{font-size:9rem; color:#8a96a4; letter-spacing:.3rem}
	.MatchScreen{position:absolute; inset:0; padding-top:60rem; display:flex; flex-direction:column; background:#0a1626; color:#fff}
	.MatchHero{position:relative; height:120rem; background:linear-gradient(135deg, #1e2a3f 0%, #142136 100%); padding:12rem 18rem; display:flex; flex-direction:column; justify-content:space-between}
	.MatchHeroBadge{display:inline-flex; align-items:center; gap:5rem; padding:4rem 8rem; background:rgba(255,255,255,.1); border-radius:4rem; font-size:9rem; font-weight:bold; letter-spacing:.5rem; align-self:flex-start; color:#7ab4ff}
	.MatchHeroDate{font-size:10rem; color:#8a96a4; letter-spacing:.5rem}
	.MatchTeams{padding:18rem 18rem 14rem; display:flex; align-items:center; justify-content:space-between}
	.MatchTeam{display:flex; flex-direction:column; align-items:center; gap:6rem; flex:1}
	.MatchTeamLogo{width:36rem; height:36rem; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:14rem; font-weight:bold}
	.MatchTeamLogo1{background:#006CFE; color:#fff}
	.MatchTeamLogo2{background:#fff; color:#001324}
	.MatchTeamName{font-size:10rem; font-weight:600; text-align:center; line-height:1.3; max-width:80rem}
	.MatchVs{font-size:14rem; font-weight:800; color:#7ab4ff; letter-spacing:1rem}
	.MatchInfo{padding:12rem 18rem; border-top:1rem solid rgba(255,255,255,.08)}
	.MatchInfoRow{display:flex; gap:10rem; padding:7rem 0; font-size:10rem; align-items:center}
	.MatchInfoLabel{color:#8a96a4; min-width:50rem; letter-spacing:.3rem}
	.MatchInfoVal{color:#fff; font-weight:500; flex:1}
	.MatchStatus{display:inline-flex; align-items:center; gap:4rem; padding:3rem 7rem; background:rgba(255,193,7,.15); color:#ffc107; border-radius:3rem; font-size:9rem; font-weight:bold; letter-spacing:.5rem}
	.MatchCta{margin:auto 18rem 22rem; padding:12rem; background:#006CFE; border-radius:10rem; text-align:center; font-size:12rem; font-weight:bold; letter-spacing:1rem; color:#fff}
	.HeroBgMark{position:absolute; font-family:"Helvetica Neue", sans-serif; font-weight:900; color:rgba(0,108,254,.04); pointer-events:none; user-select:none; line-height:1; letter-spacing:-8rem}
	.HeroBgMark1{top:-30rem; right:-30rem; font-size:300rem}
	
	.ContetArea{display:flex; justify-content:center}
	.AdSideArea{display: none}
	.MainContent{width:100%}
	.ArticleArea{width:92%; margin:0 auto; padding-top: 50rem;}
	.SideBar{width:88%; margin:0 auto; padding-top:60rem}
	/* サイドバーを外した下層ページ。SPは元から縦積みなので幅の指定だけ揃える（2026-09-12） */
	main .ContentArea.NoSideBar .MainContent{width:88%; margin:0 auto}
	.TopPage .ArticleArea h2{padding:15rem 45rem; margin:42rem 0; font-size:32rem; font-weight:bold; color:#444; border-bottom:solid 3rem #006CFE}
	h2.ArticleAreaTtl.TtlColumn{position:relative; margin-top:0}
	.ArticleAreaTtl.TtlColumn::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1ea"; position:absolute; top:8rem; left:0; font-size:34rem; -webkit-font-smoothing:antialiased}
	.ArticleList{display:flex; flex-wrap:wrap}
	.ArticleItem{width:100%; margin-bottom:50rem}
	.ArticleItem:nth-last-child(even){margin-right:0}
	.ArticleImg{width:100%; line-height:0}
	.ArticleDate{position:relative; margin:30rem 0 15rem; padding:0 10rem 0 32rem; color:#666; font-size:24rem}
	.ArticleDate::before{content:""; position:absolute; top:-4rem; left:0; width:24rem; height:24rem; background:url("images/Clock.svg") no-repeat}
	.SubPage .ArticleArea div.ArticleList .ArticleTtlWrap{margin-bottom:12rem; text-decoration: none}
	.ArticleTtlWrap:hover{opacity:1}
	.ArticleTtlWrap:hover h3{color:#006CFE}
	.ArticleTtl{margin:12rem 0 12rem; font-size:32rem; font-weight:bold; letter-spacing:.5rem; line-height:42rem; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:#444;}
	.ArticleArea .ArticleItem ul.ArticleCatUl{display: flex; flex-wrap:wrap; padding:0; height:50rem}
	.ArticleArea ul.ArticleCatUl{padding:0; height:112rem; overflow:hidden}
	.ArticleCatLi{display:inline-block; padding:18rem 24rem 15rem; margin-right:16rem; margin-bottom: 16rem; border-radius:10rem; background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); color:#fff; font-size:24rem; line-height:15rem}
	.ArticleCatLi a{display:inline; font-weight:500; line-height: 15rem;}
	.ArticleArea ul.ArticleTagUl{ padding: 0 15rem; margin-top: 15rem; border-top: solid 1rem #ddd; background: #fafafa; border-bottom: solid 1rem #ddd;}
	.ArticleArea ul .ArticleTagLi{list-style: none; padding: 15rem 0 7rem; font-size: 20rem;}
	.ArticleArea ul .ArticleTagLi:last-child{padding: 7rem 0 12rem}
	.BtnMore{display:block; position:relative; width:420rem; font-size:28rem; font-weight:bold; color:#fff; cursor:pointer; margin:20rem auto 0; height:90rem; line-height:90rem; text-align:center; border-radius:50rem; background-image:linear-gradient(to right, #004fdf 0%, #58157d 100%); box-shadow:0 3rem 12rem 0 rgba(65,132,234,0.6)}
	.BtnMore::after{content:""; position:absolute; width:14rem; height:14rem; top:37rem; right:40rem; border:solid 2rem #fff; border-left:0; border-top:0; transform:rotate(-45deg)}
	.pagination{display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:15rem; margin:50rem 0 60rem; width:100%}
	.pagination .page-numbers{display:inline-flex; justify-content:center; align-items:center; width:70rem; height:70rem; border-radius:50%; border:solid 1.5rem #004fdf; font-size:24rem; font-weight:bold; color:#004fdf; text-decoration:none}
	.pagination .page-numbers.current{background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); border-color:transparent; color:#fff}
	.pagination a.page-numbers:hover{background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); border-color:transparent; color:#fff; opacity:1}
	.pagination .page-numbers.dots{border:none; color:#999; width:auto}
	.pagination .page-numbers.prev,.pagination .page-numbers.next{width:auto; padding:0 28rem; border-radius:35rem; font-size:22rem}

	h2.PopularAreaTtl{position:relative; padding:15rem 45rem; margin:42rem 0; font-size:35rem; font-weight:bold; color:#001324}
	h2.PopularAreaTtl::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1ea"; position:absolute; top:8rem; left:0; font-size:36rem; -webkit-font-smoothing:antialiased}
	.PopularList{width:100%; margin:0 auto}
	.PopularTtl{padding:0 10rem; margin:18rem 0 50rem; font-size:30rem; font-weight:bold; letter-spacing:1.25rem; line-height:42rem; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:#444}
	
	/*サイドバー*/
	.SearchArea{margin-top: 35rem;}
	.SearchTtl{margin-bottom: 30rem; font-size: 35rem; font-weight: bold; color: #1d2327;}
	.SearchTxtArea input{width: 100%; height: 80rem; font-size: 26rem; padding: 6rem 15rem 2rem; border: none; outline: solid 1rem #999; background: #fafafa; border-radius: 8rem;}
	.SearchTxtArea input::placeholder{color: #777;}
	.SearchTxtArea button{position: absolute; right: 0; background: #006CFE; width: 80rem; height: 100%; padding: 20rem 20rem 18rem; color: #fff}
	.SearchTxtArea button:hover{cursor: pointer; background: #1d2327;}
	.searchform{position: relative;}
	.TagArea{margin-top: 60rem;}
	.TagAreahTtl{margin-bottom: 30rem; font-size: 35rem; font-weight: bold; color: #1d2327;}
	.TagAreaUl{display:flex; flex-wrap:wrap}
	.TagArea li{display:flex; margin:0 24rem 24rem 0; border-radius:3rem; color:#fff; font-size:25rem}
	.TagArea li a{color: #fff; padding: 17rem 26rem 13rem; background: #006CFE; border-radius: 10rem; text-decoration: none;}
	
	.FooterLogo{display:inline-block; width:340rem; margin-top:20rem}
	.FooterLogoimg{height:150rem; width:auto; aspect-ratio:auto 640 / 360}
	.FooterFlex{display:flex; flex-direction:column; justify-content:space-between; align-items:center; padding:70rem 0 75rem; align-items:center; font-weight:normal; background:#1d2327; color:#fff}
	.FooterFlex1{display:flex; flex-direction:column; justify-content:center; width:100%}
	.FooterFlex1 a{display:inline-block; color:#fff}
	.FooterNav1,.FooterNav2{width:100%}
	.FooterNavUl{display:flex; justify-content:flex-start; flex-direction:column; align-items:center; flex-wrap:wrap; width:100%}
	.FooterNavUl:last-child{justify-content:flex-start}
	.FooterNavLi{width:100%; position:relative; letter-spacing:.5rem; line-height:54rem; font-size:26rem; font-weight:normal}
	.FooterNav2{display:flex; flex-direction:row; padding:30rem 50rem; border-bottom:solid 1rem #444; margin-bottom:50rem}
	.FooterNav2 .FooterNavUl{flex-direction:row}
	.FooterNav2 .FooterNavLi{width:50%; line-height:100rem}
	.FooterNav1 .FooterNavLi{line-height:110rem; padding:5rem 50rem 0; font-size:32rem; font-weight:500; letter-spacing:1rem; border-bottom:solid 1rem #444}
	.FooterNav1 .FooterNavLi:nth-child(1) a{position:relative; padding-left:47rem}
	.FooterNav1 .FooterNavLi:nth-child(1) a::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1e3"; position:absolute; top:35rem; left:0; font-size:28rem; color:#fff; -webkit-font-smoothing:antialiased}
	.FooterNav1 .FooterNavLi:nth-child(2) a{position:relative; padding-left:50rem}
	.FooterNav1 .FooterNavLi:nth-child(2) a::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f3c5"; position:absolute; top:38rem; left:0; font-size:28rem; color:#fff; -webkit-font-smoothing:antialiased}
	.FooterNav1 .FooterNavLi:nth-child(3) a{position:relative; padding-left:52rem}
	.FooterNav1 .FooterNavLi:nth-child(3) a::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1ea"; position:absolute; top:38rem; left:0; font-size:28rem; color:#fff; -webkit-font-smoothing:antialiased}
	.FooterNavLi:last-child{border-right:0}
	.FooterFlex2{display:flex; justify-content:center; width:48%}
	.CopyRight{text-align:center; color:#fff; font-size:20rem; margin-top:30rem}
	
	.SubPage h1.ArticleAreaTtl{position:relative; padding:15rem 58rem; margin-top:60rem; font-size:44rem; font-weight:bold; color:#444}
	.SubPage h1.ArticleAreaTtl::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1ea"; position:absolute; top:8rem; left:0; font-size:42rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlEstablishment{padding-left:45rem}
	.SubPage h1.ArticleAreaTtl.TtlEstablishment::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1e3"; position:absolute; top:5rem; left:0; font-size:42rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlProgress{padding-left:62rem}
	.SubPage h1.ArticleAreaTtl.TtlProgress::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f3c5"; position:absolute; top:7rem; left:0; font-size:42rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlSearch{padding: 0; line-height: 55rem;}
	.SubPage h1.ArticleAreaTtl.TtlSearch::before{content: none}
	.SubPage h1.ArticleAreaTtl.TtlTaxonomy{padding-left:0}
	.ArticlePage .ArticleItem:nth-last-child(odd){margin-right: 4%}
	.ArticlePage .ArticleItem:nth-last-child(even){margin-right: 0}
	.TtlTag{background: linear-gradient(135deg, #004fdf 0%, #58157d 100%); color: #fff; padding: 12rem 18rem 10rem; margin-right: 5rem; border-radius: 10rem}
	
	.SinglePage .ContentArea{margin-top:35rem}
	.SinglePage h1.ArticleAreaTtl{padding:25rem 0 45rem; line-height:66rem; font-weight:bold; font-size:45rem; letter-spacing:2rem; text-align: justify;}
	.SinglePage .ArticleArea .ArticleCatUl{display:flex; flex-wrap:wrap; line-height:58rem; font-weight:bold; height:124rem; font-size:38rem; letter-spacing:1rem; text-align:justify; border-top:solid 3rem #006CFE}
	.SinglePage .ContentArea p.ArticleDate{width:100%; padding:0 10rem 0 30rem; margin:34rem 0 15rem; line-height:22rem; font-size:22rem} 
	.SinglePage .ContentArea p.ArticleDate::before{font-family:"Font Awesome 6 Free"; font-weight:400; content:"\f017"; position:absolute; top:2rem; left:0; font-size:18rem; color:#666; -webkit-font-smoothing:antialiased}
	.SinglePage .Thumbnail{margin: 20rem 0 70rem}
	.SinglePage .ContentArea p{line-height:55rem}
	.SinglePage .ArticleArea h2{font-size:40rem; font-weight:bold; margin:80rem 0 25rem; letter-spacing:1.75rem; line-height:60rem; text-align:justify; background:#f0f6ff; padding:25rem 32rem 20rem}
	.SinglePage .ArticleArea h3{position:relative; font-size:40rem; font-weight:bold; margin:80rem 0 30rem; letter-spacing:1rem; line-height:60rem; text-align:justify; border-bottom:solid 4rem #eee; padding-bottom:25rem}
	.SinglePage .ArticleArea h3:after{content:""; position:absolute; left:0; bottom:-4rem; display:block; border-bottom:solid 4rem #006CFE; width:20%}
	.SinglePage .ArticleArea h4{display:inline-block; background:#f0f6ff; padding:20rem 25rem 16rem; margin:45rem 0 20rem; font-weight:bold}
	.SinglePage .ArticleArea p,.SinglePage .ArticleArea ul{font-size:32rem; line-height:68rem}
	.ArticleArea ul{padding-left:35rem; list-style:disc; margin-top:5rem}
	.ArticleArea p a {display:inline-block; color:#337ab7; text-decoration:underline}
	.SinglePage .ArticleArea p strong{background: linear-gradient(transparent 60%,#fcfea7 0%)}
	.PointArea{position:relative; border:solid 3rem #006CFE; border-radius:8rem; padding:40rem 30rem 33rem; margin-bottom: 55rem;}
	.PointAreaTtl{position:absolute; top:-22rem; display:inline-block; padding:5rem 25rem; margin-left:10rem; background:#fff; font-size:32rem; font-weight:bold}
	.SinglePage p.PointCenter{font-weight:bold; line-height: 58rem; letter-spacing: 2rem; text-align:center}
	.SinglePage .ArticleArea p br{display: block; content: ""; margin: -12rem 0;}
	.PointMarkar{background:linear-gradient(transparent 60%,#fcfea7 0%)}
	.SinglePage blockquote{margin: 45rem 0;}
	.SinglePage .ArticleArea blockquote p{font-size: 24rem; line-height: 52rem;}
	.SinglePage blockquote a{display: inline}
	.SinglePage .ArticleArea table{width:100%; margin-bottom: 85rem;}
	.SinglePage .ArticleArea table tr{display:flex; flex-direction:column}
	.SinglePage .ArticleArea table th,td{display:flex; align-items:center; min-height:85rem}
	.SinglePage .ArticleArea table th{width:100%; padding:0 25rem; background:#f9f9f9; border-top:1rem solid #ddd; border-left:1rem solid #ddd; border-right:1rem solid #ddd}
	.SinglePage .ArticleArea table td{width:100%; padding:25rem 30rem; line-height:48rem; text-align:initial;  border-top:1rem solid #ddd; border-left:1rem solid #ddd; border-right:1rem solid #ddd}
	.SinglePage .ArticleArea table tr:last-child td{border-bottom:1rem solid #ddd}
	.GoTop{display: none}
	
	.SingleEstablishment .MainContent{margin-bottom: 50rem;}
	.SinglePage .ArticleArea a.PostBtnContact{display: block; position: relative; width: 600rem; font-size: 30rem; font-weight: bold; color: #fff; cursor: pointer; margin: 20rem auto 0; height: 110rem; line-height: 115rem; text-align: center; border: none; background-size: 300% 100%; border-radius: 60rem; background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #017BFE); box-shadow: 0 3rem 12rem 0 rgba(65, 132, 234, 0.6); text-decoration: none}
	
	#toc_container.toc_white{width:100%!important; padding:10rem 25rem 40rem; margin:30rem 0 60rem}
	div#toc_container p.toc_title{padding:8rem}
	.toc_toggle a{display:inline-block}
	#toc_container .toc_list{margin-top:0}
	.ArticleArea #toc_container p.toc_title+ul.toc_list{line-height:50rem; margin-top:0; border:0}
	ul.toc_list>li>a{font-size:20rem; font-weight:bold; margin-top:25rem}
	#toc_container a{color:#1f83da; font-size:30rem}
	#toc_container ul ul{border:0;}
	#toc_container ul.toc_list li ul li a{font-size:26rem; line-height: 48rem;}
	
	.ShareArea{display: flex; flex-direction: column; align-items: center; margin-top: 120rem;}
	.ShareTxt{position: relative; text-align: center; font-weight: bold; color: #333; font-size: 32rem; margin-bottom: 38rem;}
	.ShareTxt::before{content: ""; position: absolute; top: -6rem; left: -50rem; width: 2rem; height: 48rem; background: #017BFE; transform: rotate(-20deg); animation: animeUp 2.8s ease-in-out infinite;}
	.ShareTxt::after{content: ""; position: absolute; top: -6rem; right: -50rem; width: 2rem; height: 48rem; background: #017BFE; transform: rotate(20deg); animation: animeUp 2.8s ease-in-out infinite;}
	.ShareFlex{display: flex; justify-content: center}
	.ShareFlex > div{width: 100rem; height: 100rem; border-radius: 50%; background-size: cover; margin: 0 28rem}
	.ShareFlex > div a{width: 100%; height: 100%;}
	.ShareFlex div.ShareFB{background:no-repeat url("images/FB.svg");}
	.ShareFlex div.ShareX{background: #000; background-image:url("images/X.svg"); background-position: center; background-size:52%; background-repeat: no-repeat}
	.ShareFlex div.ShareLinkdIn{background:no-repeat url("images/Linkedin.svg"); background-size: cover;}
	.ShareFlex div.ShareLine{background:no-repeat url("images/Line.svg");}
	
	/*下層ページ*/
	/*共通・ヘッダー設定*/
	.SubPage{position:relative; min-height:calc(100vh - 383rem); padding:80rem 0 10rem}
	.SubPage .MainContent{width:88%; margin:0 auto}
	.SubPageTtlArea{position:relative; width:100%; margin:0 auto; margin-bottom:90rem; color:#fff}
	.ArticlePage .SubPageTtlArea{width:100%; border-bottom:solid 3rem #006CFE; padding-bottom:60rem; margin-bottom:0}
	.ArticlePage .ArticleArea{width:100%; min-height: 500rem}
	.SubPage h1.SubPageTtl{position:relative; padding:15rem 0; margin-top:70rem; font-size:45rem; line-height:60rem; font-weight:bold; color:#001324}
	.SubPageTtl span{color:#fff; font-size:38rem; margin-top:10rem}
	.SubPageTtl span a{color:#fff}
	.SubContentsTtl{position:relative; font-size:36rem; font-weight:500; margin-bottom:80rem; padding-bottom:20rem; border-bottom:solid 1.5rem #eee}
	.SubPage + footer{margin-top:100rem}
	#breadcrumb{display:flex; align-items:center; background:#f3f3f3; height:70rem}
	.SubPage #breadcrumb{height:40rem; background:#fff}
	#breadcrumb ul{width:92%; margin:0 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
	.SubPage #breadcrumb ul{width:100%}
	.SubPage .ArticleArea.TxtArea p{line-height: 50rem;}
	.SubPage .ArticleArea.TxtArea a{color: #337ab7; text-decoration: underline; margin-top: 20rem;}
	.SubPage .ArticleArea .ArticleCatLi a{color: #fff; text-decoration: none; margin-top: 20rem;}
	#breadcrumb li{display:inline-block; position:relative; padding-right:45rem; color:#fff; letter-spacing:.5rem; font-size:24rem}
	#breadcrumb li:last-child{display:contents}
	#breadcrumb li::before{content:">"; display:block; position:absolute; right:10rem; color:#000}
	#breadcrumb li:last-child::before{display:none}
	#breadcrumb a{text-decoration:underline; color:#000}
	#breadcrumb span{color:#000}

	/*各ページ設定*/
	/* 会社情報 */
	.CompanyTable{width:100%}
	.CompanyTable tr{display:flex; flex-direction:column}
	.CompanyTable th,td{display:flex; align-items:center; min-height:80rem}
	.CompanyTable th{width:100%; padding:0 25rem; background:#f9f9f9; border-top:1rem solid #ddd; border-left:1rem solid #ddd; border-right:1rem solid #ddd}
	.CompanyTable td{width:100%; padding:25rem 30rem; line-height:48rem; text-align:initial;  border-top:1rem solid #ddd; border-left:1rem solid #ddd; border-right:1rem solid #ddd}
	.CompanyTable tr:last-child td{border-bottom:1rem solid #ddd}
	
	/* ポリシー */
	.PrivacyPage .SubPageTtlArea{position:relative; margin-bottom:100rem; height:320rem; color:#000; background:transparent; border-bottom:dotted 2rem #ddd}
	.PrivacyPage .SubPageTtlArea .Container{top:140rem}
	.SubPageTtleArea img{position:absolute; top:0; right:0; width:80rem}
	.PrivacyPage .SubPageTtl:before{background:#000}
	.PrivacyPage #breadcrumb li{color:#000}
	.PrivacyPage #breadcrumb span{color:#000}
	.PrivacyPolicy h2{font-size:35rem; font-weight:bold; line-height:50rem; margin:70rem 0 28rem; padding-bottom:28rem; border-bottom:solid 1rem #333}
	.PrivacyPolicy p{margin-bottom:37rem; line-height:52rem}
	.PrivacyPolicy ul{line-height:52rem; padding-left:38rem; margin:-18rem 0 28rem}
	.PrivacyPolicy ul li{list-style:disc}
	p.PrivacyDesc{margin-bottom:100rem}
	.Page404 h3{text-align:center; padding:30rem; background:#eee; font-size:24rem; line-height:1; border:none}
	.Page404 p{text-align:center}
	
	/* お問い合わせ */
	.FormArea{background:#f7f7f7; border-radius:10rem}
	.FormWrap{padding:75rem 40rem}
	.FormWrap .FormTtl{text-align:center; font-weight:bold; margin-bottom:50rem}
	.FormWrap dl{display:flex; flex-direction:column; margin-bottom:28rem; font-size:18rem}
	.FormWrap dt{flex:0 0 25%}
	.FormWrap dd{flex:0 0 75%}
	.FormWrap dd span{width:100%; font-size:24rem; line-height:50rem}
	.FormWrap dd input,textarea{width:100%; padding:15rem; background:#fff; border:solid 1px #ddd; border-radius:3rem; font-size:24rem; font-family:YuGothic}
	.FormWrap dd input[name="your-name"]{width:300rem}
	.FormWrap dd textarea{height:380rem; font-size:24rem; overflow-wrap:revert}
	.FormWrap input::placeholder,.FormWrap textarea::placeholder {color:#e0e0e0}
	.FormWrap dt p{position:relative; font-size:30rem; margin:15rem 0} 
	.Hissu{position:relative; top:-5rem; font-size:24rem; padding:5rem 10rem; border-radius:3rem; line-height:1; color:#ff0000}
	.wpcf7-radio{display:block; padding-top:16rem}
	.wpcf7-radio label{display:flex; margin-bottom:16rem}
	.wpcf7-radio span{margin:0}
	.wpcf7-radio span:last-child label{margin-bottom:12rem}
	.wpcf7-radio label:hover{cursor:pointer}
	.wpcf7-radio label input{width:auto}
	.wpcf7-radio label input[type="radio"]{width:34rem; height:44rem}
	.wpcf7-radio label span{margin-left:15rem; font-size:30rem; line-height:45rem}
	.ContactConfirm{margin:60rem 0 30rem; text-align:center; font-size:28rem; line-height:50rem}
	.ContactConfirm a{display:inline; color:#3084D5; text-decoration:underline}
	.ContactBtn{height:90rem; width:480rem; margin:0 auto; font-size:28rem; color:#fff; background:#006CFE; border:solid 1rem #ddd; border-radius:50rem; text-align:center; transition:all .2s}
	.ContactBtn:hover{background:#fff; border:solid 1.5rem #004480}
	.ContactBtn p{height:90rem}
	.ContactBtn:hover input{color:#004480}
	.ContactBtn input{width:100%; height:100%; border:none; background:none; color:#fff; line-height:2.6; cursor:pointer}
	.ContactConfirmPage h1,.ThanksPage h1,.Page404 h1{padding:100rem 0 15rem; margin-left:0; text-align:center}
	.ContactConfirmPage h1:before,.ThanksPage h1:before{display:none}
	.ContactDesc{padding:0 52rem 20rem}
	.ContactConfirmPage .FormRadio{margin-top:60rem}
	.ContactConfirmPage .ContactName{height:auto}
	.ContactConfirmPage .FormBtnArea{margin-top:60rem}
	.ContactConfirmPage .FormBtnArea p{padding:10rem 0 40rem}
	.ContactConfirmPage p.Submit.Previous input{background:#f0f0f0; color:#000}
	.ContactConfirmPage p.Submit.Next{padding-bottom:0}
	.ContactConfirmPage p.Submit.Next input{background:#f7931e; color:#fff}
	.ThanksPage .SubPageTtl{text-align:center}
	.ThanksPage .ContactDesc,.Page404Desc{text-align:center}
	.ThanksDesc{line-height:42rem}
	.ThanksBackTop{width:575rem; height:88rem; line-height:88rem; margin:0 auto; text-align:center; background:#f7931e; color:#fff}
	a.BtnBack{width:540rem; height:90rem; line-height:90rem; margin:80rem auto; border-radius:50rem; box-shadow:none; font-family:inherit; font-size:30rem; text-align:center; letter-spacing:.5rem; background:#006CFE; color:#fff}
	
	/*お知らせ関連ページ設定*/
	.NewsFilter{display:flex; margin-top:40rem}
	.NewsFilter li{background:#f5f5f5; border-radius:5rem; margin-right:24rem; font-size:28rem; line-height:28rem}
	.NewsFilter li a{padding:15rem 24rem}
	.NewsFilter .Active{background:#000; padding:15rem 24rem; color:#fff; line-height:28rem}
	.NewsUl{margin-top:40rem}
	.NewsLi{border-top:solid 1rem #ddd}
	.NewsUl .NewsLi:last-child{border-bottom:solid 1rem #ddd}
	.NewsLiAnc{display:flex; flex-wrap:wrap; padding:35rem 30rem; font-size:24rem}
	.NewsDate{line-height:40rem}
	.NewsCatUl{display:flex; margin-left:30rem}
	.NewsCatLi {min-width:150rem; margin-right:20rem; text-align:center; height:100%; line-height:1.6; background:#f5f5f5}
	.NewsAreaLi:first-child{border-top:solid 1px #dedede; border-bottom:solid 1px #dedede}
	.NewsAreaLi + .NewsAreaLi{border-bottom:solid 1px #dedede}
	.NewsTtl{width:100%; font-size:30rem; padding-top:10rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
	
	.SinglePage .ArticleArea .PostCardWrap{display:block; text-decoration:none}
	.PostCard{display:flex; justify-content:center; width:100%; padding:22rem; margin:40rem 0 60rem; border:solid 2.5rem #006CFE; background:#fafdff; border-radius:15rem}
	.PostCardImg{height:fit-content; width:45%; padding-right:12rem}
	.PostCardTxt{width:55%; padding-left:8rem}
	.SinglePage .ArticleArea .PostCardTxt{color:#001324}
	.SinglePage .ArticleArea .PostCardTxt:hover{color:#1f83da; text-decoration:underline}
	.SinglePage .ArticleArea p.PostCardTtl{letter-spacing:.5rem; overflow:hidden; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:28rem; font-weight:bold; line-height:38rem; margin:16rem 0}
	.SinglePage .ArticleArea p.PostCardDesc{line-height:19rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:19rem}
	.SinglePage .ArticleArea p.ProfileTtl{font-size: 35rem; font-weight: bold; line-height: 1; margin-bottom: 30rem;}
	.SinglePage .ArticleContent ul{padding: 30rem 25rem 28rem 60rem; margin: 35rem 0 37rem; border: solid 3rem #006CFE;}
	
	.ResultTtl{font-size: 32rem; margin-bottom: 38rem; font-weight: bold;}
	
	/*pagenation*/
	.nav-links{display:flex; justify-content:center; align-items:baseline; margin-bottom:80rem}
	.nav-links *{margin:0 8rem; font-size:17rem}
	.screen-reader-text{display:none}
	a.page-numbers{text-decoration:underline}
	.nav-links .next{font-size:13rem}

	.TopContent{width:100%; overflow:hidden; padding:40rem 0 0}
	.TopContent .TopInner{width:auto; margin:0 24rem}
	.TopInner{width:100%; padding:0 40rem; margin:0 auto; box-sizing:border-box}
	.TopTtl{margin-bottom:30rem; font-size:44rem; font-weight:800; line-height:1.4; color:#0a1626; letter-spacing:-.5rem}
	.TopTtlSub{display:block; margin-bottom:14rem; font-size:22rem; font-weight:700; letter-spacing:2rem; color:#006CFE}
	.TopLead{margin-bottom:56rem; font-size:26rem; line-height:1.8; color:#001324}
	.TopLead em{font-style:normal; font-weight:bold}


	/* セクション見出し。横線 + 日本語、その下に大きな英字（Barlow）。 */
	.SecTtl{line-height:1}
	.SecTtlJa{display:flex; align-items:center; margin-bottom:22rem; font-size:30rem; font-weight:700; letter-spacing:3rem; color:#0a1626}
	.SecTtlLine{display:block; flex-shrink:0; width:60rem; height:2rem; margin-right:20rem; background:#333}
	.SecTtlEn{margin-left:80rem; font-family:"Barlow", sans-serif; font-size:72rem; font-weight:700; line-height:1; letter-spacing:2rem; color:#0a1626}
	.SecTtlOnImg .SecTtlJa,.SecTtlOnImg .SecTtlEn{color:#fff}
	.SecTtlOnImg .SecTtlLine{background:#fff}

	/* サービス紹介。SPは縦積み。灰色のブロックは本文の下敷きにする。 */
	.TopAbout{padding:70rem 0 40rem; background:#fff}
	.TopAboutInner{}
	.TopAboutRow{position:relative}
	.TopAboutRow1{margin-top:70rem}
	.TopAboutRow2{margin-top:60rem}
	.TopAboutGray{display:none}
	.TopAboutImg{position: relative; z-index: 1; line-height:0}
	.TopAboutImg img{display:block; width:95%; height:auto}
	.TopAboutImg2 img{position: relative; left: 5%; display:block; width:95%; height:auto}
	.TopAboutImg3{position: relative; top:40rem; width:70%; margin-bottom: 50rem;}
	.TopAboutTxt{position: relative; top: -60rem; left: 5%; width: 95%; padding:120rem 40rem 70rem; background:#f2f5f9}
	.TopAboutTtl{margin-bottom:35rem; font-size:40rem; font-weight:700; letter-spacing:2rem; line-height:1.4; color:#0a1626}
	.TopAboutTxt p{font-size:28rem; letter-spacing:1rem; line-height:1.9; color:#313131}
	.TopAboutTxt p + p{margin-top:24rem}

	.TopCategory{padding:150rem 0; background: #f1f7ff;}
	.TopCategory .TopInner{background:linear-gradient(135deg, rgba(0,79,223) 0%, rgba(88,21,125) 100%) padding-box; padding: 100rem 45rem; border-radius:32rem; margin: 0; box-shadow: 0 0 50rem rgba(0, 25, 255, .5);}
	.TopCategoryTtl{position: relative; left: -45rem; color:#fff}
	.TopCategoryTtl .SecTtlLine{background: #fff;}
	.TopCategoryTtl .SecTtlJa{color:#fff}
	.TopCategoryTtl .SecTtlEn{color:#fff}
	.TopCategoryDesc{color:#fff; margin: 45rem 0 80rem; line-height: 1.5;}
	.TopCategoryTabs{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8rem; margin:20rem 0 40rem; padding:12rem; background:rgba(13,20,49,.28); border:solid 1px rgba(255,255,255,.30); border-radius:100rem}
	.TopCategoryTab{min-height:64rem; padding:10rem 12rem; font-size:24rem; font-weight:bold; line-height:1.4; color:#fff; background:transparent; border:0; border-radius:100rem; cursor:pointer; transition:background-color .2s ease,color .2s ease,box-shadow .2s ease}
	.TopCategoryTab.is-active{color:#2300a8; background:#fff; box-shadow:0 8rem 24rem rgba(10,15,50,.22)}
	.TopCategoryTab:not(.is-active):hover{background:rgba(255,255,255,.10)}
	.TopCategoryTab:focus-visible{outline:solid 3rem #fff; outline-offset:3rem}
	.TopCategoryPanel[hidden]{display:none}
	.TopCategoryWrap{display:flex; flex-direction:column; gap:34rem}
	.TopCategoryBlockTtl{margin-bottom:40rem; padding-left:20rem; font-size:26rem; font-weight:bold; color:#fff; border-left:solid 6rem #fff}
	.TopCategoryUl{display:flex; flex-wrap:wrap; gap:20rem; margin-bottom: 20rem;}
	.TopCategoryLi{padding:12rem 25rem 10rem; font-size:23rem; font-weight: bold; line-height:1.4; color:#2300a8; background:#fff; border:solid 1px #fff; border-radius:100rem}

	/* 使いかた。SPは写真を上に敷いて見出しを重ね、ステップは縦積み。 */
	.TopStep{position:relative; padding:0 0 100rem; background:#f2f5f7; overflow:hidden}
	.TopStepHero{position:absolute; left:0; top:0; width:100%; height:420rem; overflow:hidden; z-index:0}
	.TopStepHero img{display:block; width:100%; height:420rem; object-fit:cover}
	.TopStepHero::after{content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(180deg, rgba(4,12,44,.30) 0%, rgba(4,12,44,.58) 100%)}
	.TopStepInner{position:relative; padding:200rem 30rem 0}
	.TopStepItems{margin-top:150rem}
	.TopStepItem{position:relative; margin-bottom:80rem}
	.TopStepItem:last-child{margin-bottom:0}
	.TopStepItemBg{position:absolute; left:-30rem; top:86rem; width:100%; height:calc(100% - 60rem); background:#fff; z-index:0}
	.TopPointItem .TopStepItemBg{background:#fffef7;}
	.TopStepItemRight .TopStepItemBg{left:auto; right:-30rem}
	.TopStepItems .TopStepItem:nth-child(odd) .TopStepItemImg > img, .TopStepItems .TopStepItem:nth-child(odd) .TopStepSlider{position: relative; left:-30rem}
	.TopStepItems .TopStepItem:nth-child(odd) .TopStepItemTxt{padding-right: 90rem;}
	.TopStepItems .TopStepItem:nth-child(even) .TopStepItemImg > img, .TopStepItems .TopStepItem:nth-child(even) .TopStepSlider{position: relative; left:35rem; margin-bottom: 30rem;}
	.TopStepItems .TopStepItem:nth-child(even) .TopStepItemTxt{padding-left: 95rem; padding-right: 15rem;}
	.TopStepItemImg{position:relative; z-index:1; text-align:center}
	.TopStepItemImg > img{display:block; width:500rem; height:auto; margin:0 auto; border-radius:30rem}
	/*HOW TOのスライダー*/
	.TopStepSlider{width:500rem; margin:0 auto; padding-bottom:64rem}
	.TopStepSlider .splide__slide{line-height:0}
	.TopStepSlider img{display:block; width:100%; height:auto; border-radius:30rem}
	.TopStepSlider .splide__arrow{position:absolute; top:calc((100% - 64rem) / 2); z-index:2; display:flex; align-items:center; justify-content:center; width:72rem; height:72rem; padding:0; border:0; border-radius:50%; background:#fff; box-shadow:0 8rem 20rem rgba(0,19,36,.18); transform:translateY(-50%); cursor:pointer}
	.TopStepSlider .splide__arrow--prev{left:-56rem}
	.TopStepSlider .splide__arrow--next{right:-56rem}
	.TopStepSlider .splide__arrow svg{width:24rem; height:24rem; fill:#006CFE}
	.TopStepSlider .splide__arrow--prev svg{transform:scaleX(-1)}
	.TopStepSlider .splide__pagination{position:absolute; left:0; right:0; bottom:0; gap:14rem}
	.TopStepSlider .splide__pagination__page{display:block; width:16rem; height:16rem; padding:0; border:0; border-radius:8rem; background:#c5d0dc; cursor:pointer; transition:width .3s, background .3s}
	.TopStepSlider .splide__pagination__page.is-active{width:44rem; background:#006CFE}
	.TopStepItemNum{display: inline-block; min-width: 145rem; text-align: center; padding: 10rem 25rem; margin-bottom: 30rem; font-family: "Barlow", sans-serif; font-size: 32rem; font-weight: bold; background: #fff; border: solid 4rem #006CFE; line-height: 1; color: #006CFE;}
	.TopPointItem .TopStepItemNum{border: solid 4rem #a59100; line-height: 1; color: #a59100;}
	.TopStepItemTxt{position:relative; z-index:1; padding:34rem 34rem 44rem}
	.TopStepItemTtl{margin-bottom:22rem; font-size:38rem; font-weight:700; letter-spacing: 1.5rem; line-height:1.6; color:#0a1626}
	.TopStepItemDesc{font-size:26rem; line-height:1.9; color:#313131}

	.TopFaq{padding:100rem 0}
	.TopFaqTtl{margin-bottom: 60rem;}
	.TopFaqDl{border-top:solid 1rem #dde3ea}
	.TopFaqItem{border-bottom:solid 1rem #dde3ea}
	.TopFaqQ{position:relative; padding:32rem 0 32rem 46rem; font-size:28rem; font-weight:bold; line-height:1.6; color:#333}
	.TopFaqQ::before{content:"Q"; position:absolute; top:25rem; left:0; font-size:30rem; font-weight:800; line-height:1.6; color:#000}
	.TopFaqA{position:relative; padding:0 0 32rem 46rem; font-size:28rem; line-height:1.9; color:#000}
	.TopFaqA::before{content:"A"; position:absolute; top:-4rem; left:0; font-size:30rem; font-weight:800; line-height:1.9; color:#006CFE}

	/* お知らせ。SPは見出しの下にリストを縦積み。 */
	.TopNews{padding:120rem 0; background:#f2f5f7}
	.TopNewsInner{padding:0 30rem}
	.TopNewsList{margin-top:56rem}
	.TopNewsLiAnc{display:flex; align-items:center; padding:30rem 24rem 30rem 30rem; margin-bottom:20rem; background:#fff; color:#313131; font-size:24rem}
	.TopNewsLiInner{display:flex; flex-direction:column; align-items:flex-start}
	.TopNewsDate{margin-bottom:8rem; font-family:"Barlow", sans-serif; font-weight:700; font-size:22rem; color:#858788}
	.TopNewsTtl{letter-spacing:1rem; line-height:1.6}
	.TopNewsArrow{flex-shrink:0; margin-left:auto; padding-left:16rem; line-height:0}
	.TopNewsArrow svg{display:block; width:46rem; height:14rem}
	.TopNewsEmpty{padding:30rem; background:#f2f5f7; font-size:24rem; color:#858788}
	.TopNewsMoreAnc{display:flex; align-items:center; width:300rem; padding:26rem 24rem 26rem 30rem; margin-top:36rem; background:#0a1626; color:#fff; font-size:24rem; font-weight:700}

	.TopCta{position: relative;  text-align:center; background:linear-gradient(135deg, rgba(0,79,223) 0%, rgba(88,21,125) 100%) padding-box;}
	.TopCta::before{content:""; position:absolute; inset:0; z-index:0; background:url("images/about-03.jpg") center/cover no-repeat; opacity:.08; pointer-events:none}
	.TopCta .TopInner{position: relative; z-index: 3; padding:120rem 64rem}
	.TopCtaCatch{display: inline-block; margin-bottom:20rem; padding: 8rem 15rem 7rem; font-size:26rem; font-weight:500; line-height:1.5; border: solid 1rem #fff; color:#fff;}
	.TopCtaTtl{margin-bottom:50rem; font-size:42rem; font-weight:800; line-height:1.5; letter-spacing: 1.5rem; color:#fff}
	.TopCtaTxt{margin-bottom:44rem; font-size:16rem; line-height:1.7; color:#5a6675}
	.TopCtaBtnWrap{display:flex; flex-direction: column; justify-content:center; align-items:center; width: 100%; margin: 0 auto; background: #fff; padding: 42rem 50rem}
	.TopCtaBtnItem{display: flex; flex-direction: column; align-items: center; width: 300rem; padding: 22rem 10rem;}
	.TopCtaBtnItem .BtnItemQRImg{display: none}
	/* Apple(2.72)とGoogle(3.38)で縦横比が違うので、幅ではなく高さを揃える */
	.TopCtaBtnApple img,.TopCtaBtnGoogle img{width:auto; width:320rem; display:block}
}

@media(min-width:790px){
	/*共通*/
	html{font-size:.1vw; margin-top:0!important}
	html.html{scroll-padding-top:162rem}
	.SpOnly{display:none}
	body{font-size:16rem; background: linear-gradient(110deg, #075FEA 0%, #55158C 100%)}
	/* SP側のコメント参照 */
	body:has(.TopPage){background: #fff; overflow-x:hidden}
	h1,h2,h3,h4,h5,div,p{line-height:1; font-weight:500}
	blockquote{margin:30rem 0; font-size:14rem}
	.Header{position: absolute; display:flex; height:80rem; width:100%; justify-content:space-between; align-items:center; z-index:2; border-bottom:none}
	/* トップだけヘッダーを透明にする。body.home はこのサイトでは付かない
	   （固定ページをトップに設定しているため）。背景要素の有無で判定する。 */
	body:has(.TopGradient) .Header{background:transparent; border-bottom:none}
	.HeaderInnear{display:flex; justify-content:center; align-items:center; width:100%; height:100%; margin:0 auto;  color:#000}
	.HeaderLogo{width:160rem; line-height:0; margin:0 50rem}
	.HeaderLogoAnc{display:flex}
	.HeaderLogoimg{height:32rem; width:auto; aspect-ratio:auto 640 / 360}
	.HeaderNav{width:100%}
	.HeaderNavUl{display:flex; justify-content:end;}
	.HeaderNavLi{position:relative}
	.HeaderNavLi04{position:absolute; top:0; right:20rem; height:95rem; border-radius:0 0 10rem 10rem; width:140rem; background:linear-gradient(to bottom,#017BFE 50%,#01a2fe); text-align:center}
	.HeaderNavLi04 .HeaderNavLiAnc{display:flex; flex-direction:column; justify-content:center; height:100%; font-weight:bold; color:#fff; font-size:20rem; padding-left:0; line-height:30rem; letter-spacing:2rem}
	.HeaderNavLi04 .HeaderNavLiAnc span{position:relative; display:block; font-size:11rem; font-weight:500; letter-spacing:1rem; line-height:23rem}
	.HeaderNavLi04 .HeaderNavLiAnc span::before{content:""; position:absolute; top:3rem; left:2rem; height:15rem; width:1rem; background:#fff; transform:rotate(-15deg)}
	.HeaderNavLi04 .HeaderNavLiAnc span::after{content:""; position:absolute; top:3rem; right:5rem; height:15rem; width:1rem; background:#fff; transform:rotate(15deg)}
	.HeaderNavLiAnc{position:relative; font-size:15rem; font-weight:bold; color:#fff; margin:0 18rem}
	.HeaderNavSp{display:none}
	.HeaderNav:first-child{margin-bottom:25rem}
	#GlobalMenuInput{display:none}
	#GlobalMenu{display:none}
	.Container{width:760rem; margin:0 auto}
	.H2Span{position:relative; display:inline-block}
	.Btn1{width:220rem; height:42rem; line-height:44rem; margin:50rem auto; border-radius:50rem; box-shadow:none; font-family:inherit; font-size:16rem; font-weight:normal; color:#fff; text-align:center; letter-spacing:.5rem}
	
	/*トップページ*/
	.TopPage{}
	/* 固定グラデーション本体。画面の対角より大きい正方形を中央に置く。
	   はみ出しは body 側の overflow-x で隠れる。
	   pointer-events:none にしないと、上のリンクが押せなくなる。 */
	.TopGradient{position:fixed; top:50%; left:50%; width:220vmax; height:220vmax; transform:translate(-50%,-50%); background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); z-index:0; pointer-events:none}
	/* グラデより前にコンテンツを出す */
	.TopPage{position:relative; z-index:2}
	.Header{z-index:3}
	.HeroArea{position:relative; width:100%; background: linear-gradient(110deg, #075FEA 0%, #55158C 100%); overflow:hidden}
	/*ヒーローの写真。グラデの上に透過で重ねる*/
	.HeroArea::before{content:""; position:absolute; inset:0; z-index:0; background:url("images/HeroBg.jpg") center/cover no-repeat; opacity:.25; pointer-events:none}
	/*スクロールで出す要素。footer-top.php のJSが html に .JsAnim、画面に入った要素に .is-show を付ける。
	  JSが動かないときは .JsAnim が付かないので、最初から表示されたままになる。遅らせたい要素は style="--AnimDelay:.15s"*/
	html{--AnimRise:20rem}
	html.JsAnim [data-anim]{opacity:0}
	html.JsAnim [data-anim].is-show{animation:fadeUp .8s cubic-bezier(.22,1,.36,1) var(--AnimDelay, 0s) both}
	/*ヒーローの登場アニメ。テキスト群は読み込み時、端末は画面に入ったら footer-top.php のJSが .is-show を付けて再生*/
	.HeroArea{--HeroSlide:60rem}
	.HeroCopyArea{animation:fadeUp .8s cubic-bezier(.22,1,.36,1) .2s both}
	.HeroVisualArea .PhoneMock{animation:heroSlideIn .9s cubic-bezier(.22,1,.36,1) .4s both paused}
	.HeroVisualArea .PhoneMock02{animation-delay:.6s}
	.HeroVisualArea.is-show .PhoneMock{animation-play-state:running}
	.HeroAreaInner{position:relative; z-index:1; padding:120rem 40rem 60rem; display:flex; justify-content: center; gap:60rem; align-items:center}
	.HeroCopyArea{width:450rem}
	.HeroCatch{display: inline-block; padding: 10rem 22rem 9rem; font-size: 18rem; font-weight: bold; margin-bottom: 28rem; background: #fff;}
	.HeroCatch span{display: inline-block; padding: 2rem 0; background: linear-gradient(110deg, #075FEA 0%, #55158C 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;}
	.HeroCatch b{font-size: 24rem;}
	.HeroCopyMain{margin-bottom:40rem; font-size:30rem; font-weight:800; color:#fff; letter-spacing:0; line-height:1.45}
	.HeroCopyMain em{color:#fff; font-size: 45rem; font-style:normal}
	.HeroCopySub{font-size:24rem; font-weight:400; color:#5a6a7c; line-height:2; letter-spacing:1rem; margin-bottom:50rem}
	.HeroBtnWrap{display:flex; gap:15rem; margin-bottom: 15rem;}
	.HeroBtnStoreApple{width: 140rem;}
	.HeroBtnStoreGoogle{width: 172rem;}
	.HeroBtnAppstoreIcon{width:36rem; height:36rem; display:inline-flex; align-items:center; justify-content:center; font-size:32rem}
	.HeroBtnAppstoreTxt{display:flex; flex-direction:column; align-items:flex-start; line-height:1.2}
	.HeroBtnAppstoreTxt span:first-child{font-size:16rem; color:#9aa6b4; letter-spacing:1rem}
	.HeroBtnAppstoreTxt span:last-child{font-size:26rem; font-weight:bold; letter-spacing:.5rem; margin-top:3rem}
	.HeroBtnSecondary{display:inline-flex; align-items:center; height:88rem; padding:0 44rem; background:#fff; color:#0a1626; border:2rem solid #dde3eb; border-radius:50rem; font-size:24rem; font-weight:bold; letter-spacing:1rem}
	.HeroVisualArea{position:relative; width:48%; display:flex; justify-content:left; align-items:center}
	.PhoneMock{position:relative; width:250rem; height:460rem; overflow:hidden}
	.PhoneMock01{transform: translateX(20rem)}
	.PhoneMock02{transform: translateX(-20rem)}
	.PhoneMockLight{transform:translateX(-90rem); z-index:2}
	.PhoneMockDark{transform:translateX(90rem); z-index:1; background:#0a1626}
	.PhoneNotch{position:absolute; top:16rem; left:50%; transform:translateX(-50%); width:130rem; height:38rem; background:#0a1626; border-radius:24rem; z-index:10}
	.PhoneStatus{position:absolute; top:22rem; width:100%; padding:0 36rem; display:flex; justify-content:space-between; align-items:center; font-size:15rem; font-weight:600; z-index:5}
	.PhoneStatusTime{color:#001324}
	.PhoneStatusIcons{display:inline-flex; gap:6rem; align-items:center; color:#001324}
	.PhoneMockDark .PhoneStatusTime,
	.PhoneMockDark .PhoneStatusIcons{color:#fff}
	.MapScreen{position:absolute; inset:0; padding-top:72rem; display:flex; flex-direction:column}
	.MapHeader{padding:14rem 22rem 16rem; display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1rem solid #eef1f5}
	.MapHeaderTtl{font-size:17rem; font-weight:bold; color:#001324}
	.MapHeaderArea{font-size:12rem; color:#8a96a4; letter-spacing:.5rem; margin-top:3rem}
	.MapHeaderBtn{width:36rem; height:36rem; border-radius:50%; background:#f4f6f9; display:inline-flex; align-items:center; justify-content:center; font-size:16rem}
	.MapCanvas{flex:1; position:relative; background:linear-gradient(135deg, #e6ecf3 0%, #dde6f0 100%); overflow:hidden}
	.MapRoad{position:absolute; background:#fff; opacity:.8}
	.MapRoad1{top:30%; left:-10%; width:130%; height:7rem; transform:rotate(-8deg)}
	.MapRoad2{top:55%; left:-10%; width:130%; height:6rem; transform:rotate(12deg)}
	.MapRoad3{top:0; left:40%; width:6rem; height:120%; transform:rotate(15deg)}
	.MapPark{position:absolute; background:#cde3d0; border-radius:50%}
	.MapPark1{top:15%; left:10%; width:72rem; height:60rem}
	.MapPark2{top:60%; right:8%; width:96rem; height:72rem; border-radius:30% 70% 50% 50%}
	.MapPin{position:absolute; width:38rem; height:38rem; border-radius:50% 50% 50% 0; transform:rotate(-45deg); display:flex; align-items:center; justify-content:center; box-shadow:0 4rem 8rem rgba(0,0,0,.2); border:2.5rem solid #fff}
	.MapPin span{transform:rotate(45deg); font-size:13rem; font-weight:bold; color:#fff}
	.MapPin1{top:22%; left:25%; background:#006CFE}
	.MapPin2{top:45%; left:55%; background:#e74c3c}
	.MapPin3{top:62%; left:30%; background:#27ae60}
	.MapPin4{top:30%; left:70%; background:#f39c12}
	.MapPinMe{position:absolute; top:48%; left:42%; width:22rem; height:22rem; border-radius:50%; background:#006CFE; border:3.5rem solid #fff; box-shadow:0 0 0 7rem rgba(0,108,254,.2)}
	.MapSheet{position:absolute; bottom:0; left:0; right:0; background:#fff; border-radius:22rem 22rem 0 0; padding:16rem 18rem 24rem; box-shadow:0 -4rem 16rem rgba(0,0,0,.08)}
	.MapSheetHandle{width:42rem; height:5rem; background:#dde3eb; border-radius:3rem; margin:0 auto 14rem}
	.MapSheetItem{display:flex; gap:12rem; padding:10rem 0; border-bottom:1rem solid #f4f6f9}
	.MapSheetItem:last-child{border-bottom:0}
	.MapSheetDot{width:10rem; height:10rem; border-radius:50%; margin-top:7rem; flex-shrink:0}
	.MapSheetDot1{background:#006CFE}
	.MapSheetDot2{background:#e74c3c}
	.MapSheetTxt{flex:1; min-width:0}
	.MapSheetTtl{font-size:14rem; font-weight:bold; color:#001324; line-height:1.3; margin-bottom:4rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
	.MapSheetMeta{font-size:11rem; color:#8a96a4; letter-spacing:.3rem}
	.MatchScreen{position:absolute; inset:0; padding-top:72rem; display:flex; flex-direction:column; background:#0a1626; color:#fff}
	.MatchHero{position:relative; height:140rem; background:linear-gradient(135deg, #1e2a3f 0%, #142136 100%); padding:14rem 22rem; display:flex; flex-direction:column; justify-content:space-between}
	.MatchHeroBadge{display:inline-flex; align-items:center; gap:6rem; padding:5rem 10rem; background:rgba(255,255,255,.1); border-radius:5rem; font-size:11rem; font-weight:bold; letter-spacing:.5rem; align-self:flex-start; color:#7ab4ff}
	.MatchHeroDate{font-size:12rem; color:#8a96a4; letter-spacing:.5rem}
	.MatchTeams{padding:22rem 22rem 18rem; display:flex; align-items:center; justify-content:space-between}
	.MatchTeam{display:flex; flex-direction:column; align-items:center; gap:8rem; flex:1}
	.MatchTeamLogo{width:46rem; height:46rem; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:18rem; font-weight:bold}
	.MatchTeamLogo1{background:#006CFE; color:#fff}
	.MatchTeamLogo2{background:#fff; color:#001324}
	.MatchTeamName{font-size:12rem; font-weight:600; text-align:center; line-height:1.3; max-width:100rem}
	.MatchVs{font-size:18rem; font-weight:800; color:#7ab4ff; letter-spacing:1rem}
	.MatchInfo{padding:14rem 22rem; border-top:1rem solid rgba(255,255,255,.08)}
	.MatchInfoRow{display:flex; gap:12rem; padding:9rem 0; font-size:12rem; align-items:center}
	.MatchInfoLabel{color:#8a96a4; min-width:60rem; letter-spacing:.3rem}
	.MatchInfoVal{color:#fff; font-weight:500; flex:1}
	.MatchStatus{display:inline-flex; align-items:center; gap:5rem; padding:4rem 9rem; background:rgba(255,193,7,.15); color:#ffc107; border-radius:4rem; font-size:11rem; font-weight:bold; letter-spacing:.5rem}
	.MatchCta{margin:auto 22rem 28rem; padding:15rem; background:#006CFE; border-radius:12rem; text-align:center; font-size:14rem; font-weight:bold; letter-spacing:1rem; color:#fff}

	.HeroBgMark{position:absolute; font-family:"Helvetica Neue", sans-serif; font-weight:900; color:rgba(0,108,254,.04); pointer-events:none; user-select:none; line-height:1; letter-spacing:-10rem}
	.HeroBgMark1{top:-30rem; right:-50rem; font-size:400rem}
	
	/* メインカラム */
	.ContentArea{display:flex; justify-content:center; width:900rem; background: #fff; padding:80rem 50rem; border-radius: 20rem; margin:45rem auto}
	.AdSideArea{display: none}
	.MainContent{width:630rem; padding:0 0 10rem; margin-right:45rem; background:#fff}
	.SideBar{width:220rem}
	/* サイドバーを外した下層ページ。1カラムにして本文を中央に置く。
	   .SinglePage .MainContent が後方で幅と余白を上書きするため、
	   main を足して詳細度を上げている（2026-09-12） */
	main .ContentArea.NoSideBar .MainContent{width:100%; max-width:770rem; margin:0 auto}
	.TopPage .ArticleArea h2{padding:12rem 0; margin:42rem 0; font-size:20rem; font-weight:bold; color:#1d2327; border-bottom:solid 2rem #006CFE}
	h2.ArticleAreaTtl.TtlColumn{position:relative; margin-top:0}
	.ArticleList{display:flex; flex-wrap:wrap}
	.ArticleItem{width:300rem; margin-right:30rem; margin-bottom:32rem}
	.ArticleList .ArticleItem:nth-child(2n){margin-right:0}
	.ArticleImg{width:100%; line-height:0}
	.ArticleImg img{height:auto; box-shadow: 2rem 5rem 8rem rgba(0,0,0,.05)}
	.ArticleImg:hover img{opacity: .6; box-shadow: 0}
	.ArticleDate{position:relative; margin-top:13rem; padding:0 10rem 0 15rem; color:#1d2327; font-size:11rem; line-height:12rem;}
	.ArticleDate::before{content:""; position:absolute; top:0; left:0; width:12rem; height:12rem; background:url("images/Clock.svg") no-repeat}
	.ArticleTtlWrap{margin:8rem 0 10rem}
	.ArticleTtlWrap:hover{opacity:1}
	.ArticleTtlWrap:hover h3{color:#006CFE; text-decoration: underline;}
	.ArticleTtl{font-size:16rem; font-weight:bold; letter-spacing:1rem; line-height:22rem; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:#1d2327}
	.TopPage .ArticleArea .ArticleCatUl{padding-left:0}
	.ArticleCatUl{display:flex; flex-wrap:wrap; height:23rem; overflow:hidden}
	.ArticleCatLi{display:flex; margin:0 7rem 10rem 0; border-radius:3rem; color:#fff; font-size:12rem}
	.BtnMore{position: relative; width: 242rem; font-size: 16rem; font-weight: bold; color: #fff; cursor: pointer; margin: 20rem auto 0; height: 52rem; line-height: 52rem; text-align: center; border: none; background-size: 120% 100%; border-radius: 50rem; background-image: linear-gradient(to right, #004fdf 0%, #58157d 100%); box-shadow: 0 3rem 12rem 0 rgba(65, 132, 234, 0.6)}
	.BtnMore::after{content: ""; position: absolute; width: 10rem; height: 10rem; top:20.5rem; right:26rem; border: solid 2rem #fff; border-left: 0; border-top: 0; transform: rotate(-45deg)}
	.pagination{display:flex; justify-content:center; align-items:center; flex-wrap:wrap; width: 100%; gap:8rem; margin:30rem 0 40rem}
	.pagination .page-numbers{display:inline-flex; justify-content:center; align-items:center; width:40rem; height:40rem; border-radius:50%; border:solid 1.5rem #004fdf; font-size:14rem; font-weight:bold; color:#004fdf; text-decoration:none}
	.pagination .page-numbers.current{background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); border-color:transparent; color:#fff}
	.pagination a.page-numbers:hover{background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); border-color:transparent; color:#fff; opacity:1}
	.pagination .page-numbers.dots{border:none; color:#999; width:auto}
	.pagination .page-numbers.prev,.pagination .page-numbers.next{width:auto; padding:0 14rem; border-radius:20rem; font-size:13rem}

	/* サイドバー */
	#Splide2{display:none; height:300rem; margin-bottom: 60rem;}
	#Splide2 .splide__arrows{position:absolute; width:100%; z-index:1}
	#Splide2 .splide__arrow--prev,#Splide2 .splide__arrow--next{position:absolute; top:125rem; width:35rem; height:35rem}
	#Splide2 .splide__arrow--prev{left:calc(50% - 110rem); transform:rotate(180deg)}
	#Splide2 .splide__arrow--next{left:calc(50% + 75rem)}
	#Splide2 .splide__arrow--prev:hover,#Splide2 .splide__arrow--next:hover{cursor:pointer; opacity:.5; transition:.3s}
	#Splide2 .splide__arrow--prev svg,#Splide2 .splide__arrow--next svg{width:18rem; height:18rem}
	#Splide2 .splide__pagination{position:relative; top:12rem}
	#Splide2 .splide__pagination button{background:#ccc; border-radius:30rem; height:12rem; width:12rem; margin:0 5rem}
	#Splide2 .splide__pagination button.is-active{background:#006CFE}
	.SearchTtl{margin-bottom: 15rem; font-size: 14rem; font-weight: bold; color: #1d2327;}
	.SearchTxtArea input{width: 100%; height: 35rem; font-size: 12.5rem; padding: 2rem 8rem 0; border: none; outline: solid 1rem #999; background: #fafafa; border-radius: 3rem;}
	.SearchTxtArea input::placeholder{color: #777;}
	.SearchTxtArea button{position: absolute; right: 0; background:#0018d6; width: 32rem; height: 100%; padding: 9rem 7.5rem 8rem; color: #fff}
	.SearchTxtArea button:hover{cursor: pointer; background: #1d2327;}
	.searchform{position: relative;}
	.TagArea{margin-top: 28rem;}
	.TagAreahTtl{margin-bottom: 15rem; font-size: 14rem; font-weight: bold; color: #1d2327;}
	.TagAreaUl{display:flex; flex-wrap:wrap}
	.TagArea li{display:flex; margin:0 7rem 12rem 0; border-radius:3rem; color:#fff; font-size:12rem}
	.TagArea li a{color: #fff; padding: 5.5rem 8rem 5rem; background:linear-gradient(to right, #004fdf 0%, #58157d 100%); background-size:200% 100%; border-radius: 4rem; text-decoration: none;}
	.SideBarAd{margin-top: 15rem;}
	
	.PopularList{padding:10rem 0; background:#fff}
	.PopularAreaTtl{padding:10rem; margin:5rem 0 20rem ; font-size:14rem; font-weight:bold; color:#1d2327; border-bottom:1.5rem solid; border-image:linear-gradient(135deg, #004fdf 0%, #58157d 100%) 1;}
	.PopularItem{width:100%; margin-bottom:18rem}
	.PopularImg{width:100%; line-height:0}
	.PopularTtl{margin-top:8rem; font-size:14rem; letter-spacing:.75rem; line-height:22rem; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:#1d2327}
	
	footer{position: relative; background:#1d2327; color:#fff}
	footer::after{content:""; position: absolute; bottom: 0; left: 0; height: 6rem; width: 100%; background-image:linear-gradient(to right, #004fdf 0%, #58157d 100%)}
	.FooterFlex{padding:65rem 20rem 80rem}
	.FooterCatch{text-align:center; font-size:26rem; letter-spacing:2rem; margin-bottom:40rem}
	.FooterNav{display:flex}
	.FooterNav1{margin-bottom:20rem}
	.FooterNavUl{display:flex; justify-content:center; align-items:center}
	.FooterNavLi{text-align:center; margin:12rem 20rem; position:relative; font-size:17rem}
	.FooterNavLi:last-child{border-right:0}
	.FooterNav1 .FooterNavLi{padding-left:30rem}
	.FooterNav1 .FooterNavLi:nth-child(1)::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1e3"; position:absolute; top:-3rem; left:2rem; font-size:14rem; color:#fff; -webkit-font-smoothing:antialiased}
	.FooterNav1 .FooterNavLi:nth-child(2)::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f3c5"; position:absolute; top:-2rem; left:0; font-size:14rem; color:#fff; -webkit-font-smoothing:antialiased}
	.FooterNav1 .FooterNavLi:nth-child(3)::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1ea"; position:absolute; top:-2rem; left:0; font-size:14rem; color:#fff; -webkit-font-smoothing:antialiased}
	.FooterNav2 .FooterNavLi{width:auto; text-align:center; margin:12rem 15rem; position:relative; font-size:13rem}
	.FooterLogo{display:block; width:240rem; margin:50rem auto 20rem}
	.CopyRight{font-size:14rem; text-align:center}
	
	/*下層ページ*/
	#breadcrumb{background:#f3f3f3; padding:20rem}
	#breadcrumb ul{display:flex; width:90%; margin:0 auto}
	#breadcrumb li{position:relative; padding-right:30rem; letter-spacing:.5rem; font-size:13rem}
	#breadcrumb li::before{content:">"; display:block; position:absolute; right:10rem; color:#999}
	#breadcrumb li:last-child::before{display:none}
	#breadcrumb a{color:#000; text-decoration:underline; text-underline-offset:2.5rem}
	#breadcrumb .breadhome{position:relative}
	#breadcrumb .breadhome::before{content:""; position:absolute; left:-25rem; top:0; width:15rem; height:15rem; background:url("images/Home.svg") no-repeat}
	.SubPage{position:relative; padding-bottom:10rem; padding-top:80rem}
	.SubPageTtlArea{position:relative; display:flex; flex-direction:column; margin-bottom:30rem; color:#333; border-bottom:2rem solid; border-image:linear-gradient(135deg, #004fdf 0%, #58157d 100%) 1;}
	.SubPageTtlArea #breadcrumb{background:none; padding:25rem 0 40rem 0}
	.SubPageTtlArea #breadcrumb ul{margin-left:25rem}
	.SubPageTtl{margin-top:8rem; font-size:36rem; font-weight:bold}
	.TagPageTtl{font-size:30rem; margin:15rem 0 10rem}
	.TtlTag{background:linear-gradient(135deg, #004fdf 0%, #58157d 100%); color:#fff; padding:12rem 18rem 10rem; margin-right:5rem; border-radius:10rem}
	.SubContentsTtl{position:relative; font-size:18rem; font-weight:500; margin-bottom:70rem; padding-bottom:30rem; border-bottom:solid 1.5rem #eee}
	.SubPageH2{padding-bottom:65rem; font-size:42rem; font-family:"Abel", sans-serif; letter-spacing:8rem; text-align:center}
	.SubPageTxt{text-align:center; margin-bottom:80rem; letter-spacing:2rem}
	
	/*記事一覧ページ設定*/
	.ArticlePage .SubPageTtlArea{border-bottom:2rem solid; border-image:linear-gradient(135deg, #004fdf 0%, #58157d 100%) 1; margin-bottom:42rem}
	.SubPage h1.ArticleAreaTtl{position:relative; margin-top:8rem; padding-left:45rem; font-size:35rem; font-weight:bold}
	.SubPage h1.ArticleAreaTtl.TtlColumn{padding-left:42rem}
	.SubPage h1.ArticleAreaTtl.TtlColumn::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1ea"; position:absolute; top:2rem; left:0; font-size:30rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlEstablishment{padding-left:35rem}
	.SubPage h1.ArticleAreaTtl.TtlEstablishment::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f1e3"; position:absolute; top:2rem; left:0; font-size:30rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlProgress::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f3c5"; position:absolute; top:2rem; left:0; font-size:30rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlSearch::before{font-family:"Font Awesome 6 Free"; font-weight:900; content:"\f002"; position:absolute; top:2rem; left:0; font-size:30rem; -webkit-font-smoothing:antialiased}
	.SubPage h1.ArticleAreaTtl.TtlTaxonomy{padding-left:0}
	
	/*投稿ページ設定*/
	.SinglePage{padding-top: 80rem;}
	.SinglePage .MainContent{margin-right:50rem}
	.SinglePage .BreadAera{height:80rem; display:flex; justify-content:flex-start; align-items:center; background:#f0f0f0}
	.SinglePage .BreadAera #breadcrumb{width:1045rem; margin:0 auto}
	.SinglePage .ContentArea{margin-top:50rem}
	.SinglePage h1.ArticleAreaTtl{margin-bottom:12rem; font-size:32rem; letter-spacing:1.5rem; line-height:47rem; font-weight:bold; color:#001324}
	.SinglePage .ArticleCatUl{display:flex; align-items:center; height:50rem; margin-bottom:20rem; padding:18rem 0 0; border-top:1.5rem solid; border-image:linear-gradient(135deg, #004fdf 0%, #58157d 100%) 1;}
	.Thumbnail{margin-bottom:50rem}
	.Thumbnail img{width:100%; height:auto}
	.SinglePage .ArticleArea h2{font-size:26rem; font-weight:bold; margin:40rem 0 25rem; letter-spacing:1.75rem; line-height:40rem; text-align:justify; background:#f0f6ff; padding:18rem 15rem 15rem}
	.SinglePage .ArticleArea h3{position:relative; font-size:22rem; font-weight:bold; margin:35rem 0 20rem; letter-spacing:1rem; line-height:34rem; text-align:justify; padding:12rem 0; border-bottom:solid 2rem #eee}
	.SinglePage .ArticleArea h3:after{content:""; position:absolute; left:0; bottom:-2rem; display:block; border-bottom:solid 2rem #006CFE; width:20%}
	.SinglePage .ArticleArea h4{display:inline-block; background:#f0f6ff; font-weight:bold; padding:10rem 12rem 8rem; margin:25rem 0 12rem}
	.SinglePage .ArticleArea p strong{background:linear-gradient(transparent 58%, #fcfea7 0%); background-position:100% 0}
	.SinglePage .ArticleArea p img{margin-bottom: 20rem}
	.SinglePage .ArticleCatUl p.ArticleDate{position:relative; padding-left:17rem; margin:0;font-size:13rem; text-align:justify; letter-spacing:1rem; line-height:28rem}
	.SinglePage .ArticleCatUl p::before{content:""; position:absolute; top:8rem; left:0; width:13rem; height:13rem; background:url("images/Clock.svg") no-repeat}
	.SinglePage .ArticleCatLi{margin:0 8rem 0 0}
	.SinglePage .ArticleArea p,.SinglePage .ArticleArea ul{line-height:35rem}
	.ArticleArea ul.ArticleCatUl{line-height:12rem; padding-left:0}
	.ArticleArea ul.ArticleCatUl a{color:#fff; padding:5.5rem 8rem 5rem; background:linear-gradient(to right, #004fdf 0%, #58157d 100%); border-radius:4rem; text-decoration:none}
	.ArticleArea ul.ArticleTagUl{ padding: 0 12rem; margin-top: 10rem; border-top: solid 1rem #ddd; background: #fafafa; border-bottom: solid 1rem #ddd;}
	.ArticleArea ul .ArticleTagLi{list-style: none; padding: 10rem 0 5rem; font-size: 13rem;}
	.ArticleArea ul .ArticleTagLi:last-child{padding: 5rem 0 8rem}
	.PointArea{position:relative; border:solid 3rem #006CFE; border-radius:8rem; padding:28rem 20rem 26rem; margin-bottom: 40rem;}
	.PointAreaTtl{position:absolute; top:-16rem; display:inline-block; padding:5rem 15rem; margin-left:10rem; background:#fff; font-size:20rem; font-weight:bold}
	.SinglePage .ArticleArea p.PointCenter{font-weight:bold; text-align:center}
	.SinglePage .ArticleArea p br{display: block; content: ""; margin: -6rem 0;}
	.PointMarkar{padding:5rem 0; background:linear-gradient(transparent 70%,#fcfea7 0%); background-position:100% -4rem}
	.ArticleArea ul{padding-left:22rem; list-style:disc}
	.SinglePage .ArticleArea a{display:inline-block; color:#337ab7; text-decoration:underline}
	.SinglePage .SideBar{margin-top:2rem}
	.SinglePage .ArticleArea .PostCardWrap{display:block; text-decoration:none}
	.PostCard{display:flex; justify-content:center; width:100%; padding:13rem 18rem; margin:20rem 0 30rem; border:solid 2.5rem #006CFE; background:#fafdff; border-radius:15rem}
	.PostCardImg{height:fit-content; width:27%; padding-right:12rem}
	.PostCardTxt{width:73%; padding:0 12rem}
	.SinglePage .ArticleArea .PostCardTxt{display:flex; flex-direction:column; justify-content:center; color:#001324}
	.SinglePage .ArticleArea .PostCardTxt:hover{color:#1f83da; text-decoration:underline}
	.SinglePage .ArticleArea p.PostCardTtl{font-size:18rem; font-weight:bold; line-height:24rem; margin:8rem 0 5rem}
	.SinglePage .ArticleArea p.PostCardDesc{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13rem}
	.SinglePage .ArticleContent ul{padding:20rem 40rem 18rem; margin:15rem 0 17rem; border:solid 1.5rem #006CFE;}
	.SinglePage .ArticleContent ol{padding:20rem 55rem 18rem; margin:15rem 0 17rem; border:solid 1.5rem #006CFE;line-height: 35rem; list-style: auto}
	.SinglePage .ArticleArea ul li{font-weight:500!important}
	.SinglePage .ArticleArea blockquote p{line-height:26rem}
	.SinglePage .ArticleArea blockquote p a{display:inline}
	.SinglePage .ArticleArea blockquote.ImgQuote{margin: 0;}
	.SinglePage .ArticleArea blockquote.ImgQuote p{line-height:20rem; text-align: center;}
	.SinglePage .ArticleArea blockquote.ImgQuote p a{display:inline}
	.SinglePage .ArticleArea table{width:100%}
	.SinglePage .ArticleArea table tr{display:flex}
	.SinglePage .ArticleArea table th,td{display:flex; align-items:center; min-height:52rem}
	.SinglePage .ArticleArea table th{width:28%; padding:15rem 25rem; background:#f9f9f9; text-align: left; line-height: 28rem; border-top:1rem solid #ddd; border-left:1rem solid #ddd}
	.SinglePage .ArticleArea table td{width:72%; padding:15rem 30rem; line-height:32rem; text-align:initial;  border-top:1rem solid #ddd; border-left:1rem solid #ddd; border-right:1rem solid #ddd}
	.SinglePage .ArticleArea table tr:last-child th,.SinglePage .ArticleArea table tr:last-child td{border-bottom:1rem solid #ddd}
	.ProfileTtl{font-size: 22rem; font-weight: bold; margin-bottom: 8rem;}
	.SinglePage .ArticleArea a.PostBtnContact{display: block; position: relative; width: 280rem; font-size: 16rem; font-weight: bold; color: #fff; cursor: pointer; margin: 20rem auto 0; height: 55rem; line-height: 55rem; text-align: center; border: none; background-size: 300% 100%; border-radius: 50rem; background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #017BFE); box-shadow: 0 3rem 12rem 0 rgba(65, 132, 234, 0.6); text-decoration: none}
	.AuthorAreaTtl{font-size: 20rem; font-weight: bold; letter-spacing:1.75rem; line-height:35rem; text-align: justify;  padding-left:15rem; margin:50rem 0 25rem; border-left:solid 5rem #006CFE}
	.AuthorArea{display:flex; justify-content:flex-start; align-items:center; border-radius:10rem; border:solid 1rem #ddd; background:#fbfbfb; padding:18rem 0}
	.AuthorTtl{display:block; width:25%; text-align:center; margin-bottom:10rem; border-right:solid 1rem #ddd}
	.AuthorIcon{width:100rem; height:100rem; border-radius:50%; margin-bottom:10rem}
	.AuthorProfile{width:75%; padding:0 40rem; line-height:28rem}
	.ShareArea{display: flex; flex-direction: column; align-items: center; margin-top: 100rem;}
	.ShareTxt{position: relative; text-align: center; font-weight: bold; color: #333; font-size: 20rem; margin-bottom: 30rem;}
	.ShareTxt::before{content: ""; position: absolute; top: -5rem; left: -25rem; width: 2rem; height: 25rem; background: #017BFE; transform: rotate(-15deg); animation: animeUp 2.8s ease-in-out infinite;}
	.ShareTxt::after{content: ""; position: absolute; top: -5rem; right: -25rem; width: 2rem; height: 25rem; background: #017BFE; transform: rotate(15deg); animation: animeUp 2.8s ease-in-out infinite;}
	.ShareFlex{display: flex; justify-content: center}
	.ShareFlex > div{width: 55rem; height: 55rem; border-radius: 50%; background-size: cover; margin: 0 16rem; transition: .3s}
	.ShareFlex > div a{position: relative; width: 100%; height: 100%;}
	.ShareFlex > div:has(a:hover){opacity: .65}
	.ShareFlex > div a:hover{width: 100%; height: 100%;}
	.ShareFlex div.ShareFB{background:no-repeat url("images/FB.svg");}
	.ShareFlex div.ShareX{background: #000; background-image:url("images/X.svg"); background-position: center; background-size:52%; background-repeat: no-repeat}
	.ShareFlex div.ShareLinkdIn{background:no-repeat url("images/Linkedin.svg"); background-size: cover;}
	.ShareFlex div.ShareLine{background:no-repeat url("images/Line.svg");}
	
	.NewsFilter{display:flex; margin-top:40rem}
	.NewsFilter li{background:#f5f5f5; border-radius:5rem; margin-right:10rem; font-size:14rem; line-height:14rem}
	.NewsFilter li a{padding:7rem 12rem}
	.NewsFilter .Active{background:#000; padding:7rem 12rem; color:#fff}
	.NewsUl{margin-top:25rem}
	.NewsLi{border-top:solid 1rem #ddd}
	.NewsUl .NewsLi{border-bottom:solid 1rem #ddd}
	.NewsLiAnc{display:flex; flex-wrap:wrap; align-items:center; padding:22rem 0}
	.NewsDate{color:#888; margin-right:15rem}
	.NewsCatUl{display:flex}
	.NewsCatLi{padding:4rem 8rem; background:#f5f5f5; font-size:13rem; margin-right:10rem}
	.NewsCatUl .NewsCatLi:last-child{margin-right:20rem}
	.NewsTtl{width:100%; padding-top:18rem}
	.ArchivePage h1{margin-bottom:50rem}
	
	#toc_container.toc_white{width:100%!important; padding:10rem 30rem; margin-top:35rem; border: 2rem solid #0093fc}
	.SinglePage .ArticleArea p+ul.toc_list{border:0}
	div#toc_container p.toc_title{padding:8rem; font-size:18rem}
	#toc_container .toc_list{margin-top:0; line-height:28rem}
	.ArticleArea #toc_container p.toc_title+ul.toc_list{margin-top:0}
	.ArticleArea #toc_container ul.toc_list ul {border:0}
	.ArticleArea #toc_container ul.toc_list ul li{line-height:28rem}
	.ArticleArea #toc_container ul.toc_list ul li ul li span{display:none}
	.ArticleArea #toc_container ul.toc_list ul li ul li a{position:relative; padding-left:15rem}
	.ArticleArea #toc_container ul.toc_list ul li ul li a:before{content:"・"; position:absolute; left:0}
	.ArticleArea #toc_container ul.toc_list>li:last-child{margin-bottom:20rem}
	ul.toc_list>li>a{font-size:19rem; font-weight:bold; margin-top:12rem}
	#toc_container a{color:#0093fc}
	#toc_container a span{margin-right: 5rem;}
	#toc_container .toc_toggle a{color:#337ab7; text-decoration:underline}
	#toc_container a:hover{color:#333; opacity: 1}
	
	/*各ページ設定*/
	
	/* 会社情報 */
	.CompanyTable{width:100%}
	.CompanyTable tr{display:flex}
	.CompanyTable th,td{display:flex; align-items:center; min-height:52rem}
	.CompanyTable th{width:28%; padding:0 25rem; background:#f9f9f9; border-top:1rem solid #ddd; border-left:1rem solid #ddd}
	.CompanyTable td{width:72%; padding:10rem 30rem; line-height:32rem; text-align:initial;  border-top:1rem solid #ddd; border-left:1rem solid #ddd; border-right:1rem solid #ddd}
	.CompanyTable tr:last-child th,.CompanyTable tr:last-child td{border-bottom:1rem solid #ddd}
	
	/* お問い合わせ */
	.FormWrap{padding:50rem; border-radius:10rem; background:#fafafa; border:solid 1rem #ddd}
	.FormTtl{font-size:22rem; margin:10rem 0 50rem; text-align:center; font-weight:bold}
	.FormWrap form{padding:2rem 0; overflow:hidden}
	.FormWrap dl{display:flex; margin-bottom:25rem; font-size:17rem}
	.FormWrap dt{flex:0 0 35%; padding-top:15rem}
	.FormWrap dd{flex:0 0 65%}
	.FormWrap dd span{display:block; width:100%; font-size:16rem}
	.FormWrap dd input,textarea{width:100%; padding:8rem 10rem; background:#fff; border:solid 1px #ddd; border-radius:3rem; font-size:16rem; font-family:'Yu Gothic'; font-weight:500}
	.FormWrap dd input:focus,.FormWrap dd textarea:focus{outline:solid 1rem #0018d6}
	.FormWrap dd textarea{height:280rem; font-size:16rem; overflow-wrap:revert}
	.FormWrap input::placeholder,.FormWrap textarea::placeholder {color:#e0e0e0; font-family:Yu Gothic}
	.FormWrap dt p{position:relative; display:flex} 
	.Hissu{position:relative; top:-7rem; font-size:17rem; padding:4rem 7rem; border-radius:3rem; line-height:1; color:#ff0000}
	.wpcf7-radio{padding-top:16rem}
	.wpcf7-radio label{display:flex; margin-bottom:16rem}
	.wpcf7-radio span{margin:0}
	.wpcf7-radio span:last-child label{margin-bottom:12rem}
	.wpcf7-radio label:hover{cursor:pointer}
	.wpcf7-radio label input{width:auto}
	.wpcf7-radio label input[type="radio"]{background-color:#f7931e; width:18rem}
	.wpcf7-radio label span{margin-left:15rem}
	.ContactConfirm{margin:50rem 0 30rem; text-align:center; justify-content:center; font-size:17rem}
	.ContactConfirm a{display:inline; color:#3084D5; text-decoration:underline}
	.ContactBtn{height:50rem; width:260rem; margin:0 auto 5rem; font-size:17rem; color:#fff; background:#0018d6; border:solid 1rem #ddd; letter-spacing:1.5rem; border-radius:5rem; text-align:center; transition:all .2s; line-height:48rem}
	.ContactBtn:hover{background:#fff; border:solid 1rem #0018d6; color:#0018d6}
	.ContactBtn p{height:50rem}
	.ContactBtn:hover input{color:#004480}
	.ContactBtn input{width:100%; height:100%; border:none; background:none; color:#fff; line-height:2.6; cursor:pointer}
	.screen-reader-response{display:none}
	.wpcf7-not-valid-tip{height:25rem; margin-top:12rem; color:#ff0000}
	.wpcf7-acceptance label{display:flex; align-items:center; justify-content:center; font-size:17rem; letter-spacing:1rem}
	.wpcf7-acceptance input{width:24rem; height:24rem; margin-top:2rem; margin-right:12rem}
	.wpcf7-acceptance span{margin:0}
	.wpcf7-spinner{display:none}
	.ThanksDesc{margin-top:45rem; line-height:28rem}
	a.BtnBack{width:220rem; height:42rem; line-height:44rem; margin:50rem auto; border-radius:50rem; box-shadow:none; font-family:inherit; font-size:16rem; text-align:center; letter-spacing:.5rem; background:#006CFE; color:#fff}
	.GoTop{position: fixed; bottom: 24rem; right: 24rem; width: 42rem; height: 42rem; border-radius: 30rem; background: #fff; border: solid 2.5rem #0018d6}
	.GoTop::before{content: ""; position: absolute; top:16rem; left: 12.5rem; width: 13rem; height: 13rem; border-top: 3rem solid #0018d6; border-right: 3rem solid #0018d6; border-radius: 2rem; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); z-index: 3;}
	
	/* ポリシー */
	.PrivacyPolicy h2{font-size:20rem; font-weight:bold; margin-bottom:18rem; padding-bottom:18rem; border-bottom:solid 1rem #333}
	.PrivacyPolicy h2:first-child{margin-top: 50rem;}
	.PrivacyPolicy p{font-size:15rem; line-height:26rem; margin-bottom:37rem}
	.PrivacyPolicy ul{font-size:15rem; line-height:26rem; padding-left:20rem; margin:-18rem 0 28rem}
	.PrivacyPolicy ul li{list-style:disc}
	p.PrivacyDesc{font-size:15rem; margin-bottom:100rem}
	
	.Page404 h3{text-align:center; padding:30rem; background:#eee; font-size:24rem; line-height:1; border:none}
	.Page404 p{text-align:center; font-size:18rem}
	
	/*お知らせ関連ページ設定*/
	.SinglePage #breadcrumb li{color:#000}
	.SinglePage #breadcrumb span{color:#000}
	.ArchivePage .SubPageTtlArea{position:relative; margin-bottom:120rem; height:320rem; color:#000; background:transparent; border-bottom:dotted 2rem #ddd}
	.ArchivePage .SubPageTtlArea .Container{top:140rem}
	.ArchivePage .SubPageTtl:before{background:#000}
	.ArchivePage #breadcrumb li{color:#000}
	.ArchivePage #breadcrumb span{color:#000}
	.Container.NewsFlex{width:970rem}
	.NewsFlex{display:flex; justify-content:space-between; min-height:400rem}
	.NewsFlexPost{width:76%; padding-right:calc(3% - 1rem); padding-left:20rem; border-right:solid 1rem #c9c9c9}
	.NewsFlexArchive{width:24%; padding:12rem 20rem 12rem 3%}
	.ArchiveItemUl{margin-bottom:30rem; padding:0 5rem}
	.NewsFlexPost .NewsAreaLi{padding:0 18rem}
	.NewsFlexPost .NewsAreaLiAnc{padding:20rem 0}
	.NewsAreaLi h2{font-size:16rem; margin:0; border:none; padding:0}
	.NewsAreaLi h2:before{border:0}
	.SubPage .NewsAreaUl{margin-bottom:35rem}
	.ArchiveAreaTtl{background:#f8f8f8; padding:3rem 5rem; margin-bottom:10rem}
	.ArchiveAreaTtl:nth-of-type(2n){margin-top:30rem}
	.ArchiveItem{margin-top:8rem}
	.ArchiveItem li{}
	/*pagenation*/
	.nav-links{display:flex; justify-content:center; align-items:baseline; margin-bottom:80rem}
	.nav-links *{margin:0 8rem; font-size:17rem}
	.screen-reader-text{display:none}
	a.page-numbers{text-decoration:underline}
	.nav-links .next{font-size:13rem}	
	
	.ResultTtl{font-size: 20rem; margin-bottom: 40rem; font-weight: bold;}
	
	.Page404 h1.SubPageTtl{text-align:center; font-size:45rem; margin:100rem 0 40rem}
	.Page404 h2{font-size:18rem; text-align:center; margin-bottom:70rem; padding-bottom:50rem; border-bottom:solid 1.5rem #eee}
	.Page404 a.BtnBack{width:220rem; height:42rem; line-height:44rem; margin:50rem auto; border-radius:50rem; box-shadow:none; font-family:inherit; font-size:16rem; text-align:center; letter-spacing:.5rem; background:#006CFE; color:#fff}

	.LikeArea{display:flex; align-items: center; justify-content:center; gap:14rem; margin:36rem 0}
	.LikeBtn{display:inline-flex; justify-content: center; align-items:center; width: 48rem; height: 48rem; background:#fff; border:1rem solid #d3d9e2; border-radius:50rem; cursor:pointer; transition:all .3s}
	.LikeBtn:hover{opacity:.7}
	.LikeBtnHeart,.LikeBtnFire{display:inline-block; line-height:1; padding-top:5rem;}
	.LikeBtnHeart::before{content:"\2661"; font-size:27rem; line-height:1; color:#aeb8c4}
	.LikeBtnFire::before{content:"\1F525"; font-size:26rem; line-height:1; filter:grayscale(1); opacity:.5}
	.LikeBtnNum{font-size:20rem; font-weight:bold; line-height:1; color:#8a96a4}
	.LikeModal{position:fixed; top:0; right:0; bottom:0; left:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:20rem; background:rgba(0,19,36,.6)}
	.LikeModal[hidden]{display:none}
	.LikeModalInner{position:relative; width:100%; max-width:360rem; padding:44rem 28rem 32rem; background:#fff; border-radius:20rem; text-align:center}
	.LikeModalClose{position:absolute; top:10rem; right:10rem; width:40rem; height:40rem; padding:0; border:none; background:none; font-size:30rem; line-height:1; color:#8a96a4; cursor:pointer}
	.LikeModalClose:hover{color:#001324; opacity:1}
	.LikeModalTxt{margin-bottom:24rem; font-size:18rem; font-weight:bold; color:#001324}
	.LikeModalBtns{display:flex; flex-direction:column; align-items:center; gap:14rem}
	.LikeModalStore img{height:52rem; width:auto}
	.ArticleReact{display:flex; align-items:center; gap:12rem; margin-top:8rem; font-size:13rem; color:#5a6a7c}
	.ArticleReactItem{display:inline-flex; align-items:center; gap:5rem}
	.ArticleReactHeart,.ArticleReactFire{display:inline-block; line-height:1}
	.ArticleReactHeart::before{content:"\2661"; font-size:15rem; line-height:1; color:#aeb8c4}
	.ArticleReactFire::before{content:"\1F525"; font-size:14rem; line-height:1; filter:grayscale(1); opacity:.55}
	.ArticleReactNum{font-weight:bold; line-height:1}

	/*トップLP*/
	.HeaderNavUl .HeaderNavLi{display:flex; align-items:center}
	.HeaderNavUl .HeaderNavLi .HeaderNavLiAnc{height:auto; padding:0 18rem; font-size:15rem; line-height:1.4; transition:opacity .3s}

	/* ⚠️ .ContentArea は使わない（SP側のコメント参照） */
	/* SP側のコメント参照。PCも同じ考え方 */
	.TopContent{width:100%}
	.TopContent .TopInner{max-width:1080rem; margin:0 auto; padding:90rem 64rem}
	.TopInner{max-width:1080rem; margin:0 auto; padding:0 40rem; box-sizing:border-box}
	.TopTtl{margin-bottom:24rem; font-size:40rem; font-weight:800; line-height:1.4; color:#0a1626; letter-spacing:-.5rem}
	.TopTtlSub{display:block; margin-bottom:12rem; font-size:14rem; font-weight:700; letter-spacing:2rem; color:#006CFE}
	.TopLead{max-width:760rem; margin-bottom:56rem; font-size:17rem; line-height:1.9; color:#001324}
	.TopLead em{font-style:normal; font-weight:bold}


	/* セクション見出し。横線 + 日本語、その下に大きな英字（Barlow）。 */
	.SecTtl{line-height:1}
	.SecTtlJa{display:flex; align-items:center; margin-bottom:18rem; font-size:20rem; font-weight:700; letter-spacing:2rem; color:#0a1626}
	.SecTtlLine{display:block; flex-shrink:0; width:62rem; height:1rem; margin-right:17rem; background:#858788}
	.SecTtlEn{margin-left:78rem; font-family:"Barlow", sans-serif; font-size:53rem; font-weight:700; line-height:1; letter-spacing:1rem; color:#0a1626}
	.SecTtlOnImg .SecTtlJa,.SecTtlOnImg .SecTtlEn{color:#fff}
	.SecTtlOnImg .SecTtlLine{background:#fff}
	.TopStep .SecTtl{margin-left: 420rem}

	/* サービス紹介。灰色のブロックを背景に敷き、写真と本文をずらして重ねる。 */
	.TopAbout{padding:90rem 0 100rem; background:#fff}
	.TopAboutInner{width:833rem; margin:0 auto; position:relative; box-sizing:border-box}
	.TopAboutRow{position:relative}
	.TopAboutRow1{display:flex; margin-top:110rem}
	.TopAboutRow2{margin-top:250rem}
	.TopAboutGray{position:absolute; background:#f1f7ff; z-index:0}
	.TopAboutRow1 .TopAboutGray{left:254rem; top:-64rem; width:578rem; height:533rem}
	.TopAboutRow2 .TopAboutGray{left:66rem; top:-100rem; width:503rem; height:500rem}
	.TopAboutImg{position:relative; z-index:1; line-height:0}
	.TopAboutImg img{display:block; width:362rem; height:247rem; object-fit:cover}
	.TopAboutImg2{position:absolute; left:471rem; top:-200rem}
	.TopAboutImg3{position:absolute; left:66rem; top:-142rem}
	.TopAboutImg3 img{width:232rem; height:122rem}
	.TopAboutTxt{position:relative; z-index:1}
	.TopAboutRow1 .TopAboutTxt{margin-left:43rem; width:350rem}
	.TopAboutRow2 .TopAboutTxt{margin-left:122rem; width:397rem; padding:75rem 0 60rem}
	.TopAboutTtl{margin-bottom:24rem; font-size:24rem; font-weight:700; letter-spacing:2rem; line-height:1.7; color:#0a1626}
	.TopAboutTxt p{font-size:15rem; letter-spacing:1rem; line-height:1.8; color:#313131; text-align:justify}
	.TopAboutTxt p + p{margin-top:18rem}

	.TopCategory{padding:100rem 0; background:#f1f7ff}
	.TopCategory .TopInner{border-radius: 20rem; background:linear-gradient(135deg, rgba(0,79,223) 0%, rgba(88,21,125) 100%) padding-box}
	.TopCategoryTtl .SecTtlJa{color: #fff}
	.TopCategoryTtl .SecTtlLine{background: #fff}
	.TopCategoryTtl .SecTtlEn{color: #fff; margin-bottom: 40rem;}
	.TopCategory .TopLead{color:#e3ecff}
	.TopCategory .TxtMarkar{color:#fff00}
	.TopCategoryDesc{color: #fff; font-size: 16rem; line-height: 1.6; margin-bottom: 30rem;}
	.TopCategoryTabs{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6rem; max-width:500rem; margin:0 auto 44rem; padding:6rem; background:rgba(13,20,49,.28); border:solid 1px #fff; border-radius:100rem}
	.TopCategoryTab{min-height:50rem; padding:8rem 18rem; font-size:16rem; font-weight:bold; line-height:normal; color:#fff; background:transparent; border:0; border-radius:100rem; cursor:pointer; transition:background-color .2s ease,color .2s ease,box-shadow .2s ease}
	.TopCategoryTab.is-active{color:#2300a8; background:#fff; box-shadow:0 8rem 22rem rgba(10,15,50,.22)}
	.TopCategoryTab:not(.is-active):hover{background:rgba(255,255,255,.10)}
	.TopCategoryTab:focus-visible{outline:solid 2rem #fff; outline-offset:3rem}
	.TopCategoryPanel[hidden]{display:none}
	.TopCategoryWrap{display:flex; flex-direction:column; gap:36rem}
	.TopCategoryBlockTtl{padding-bottom:12rem; font-size:18rem; font-weight:bold; color:#fff; border-bottom:solid 1rem #fff; margin-bottom: 25rem;}
	.TopCategoryUl{display:flex; flex-wrap:wrap; gap:12rem}
	.TopCategoryLi{padding:10rem 20rem; font-size:14rem; font-weight: bold; line-height:1.4; color:#2300a8; background:#fff; border-radius:100rem}

	/* 使いかた。上部に横長の写真を敷いて見出しを重ね、以降は薄いグレーの地。
	   ステップは左右交互。背景の白ブロックは内側の外まで伸ばして画面端に逃がす。 */
	.TopStep{position:relative; background:#f2f5f7; overflow:hidden}
	.TopStepHero{position:absolute; left:0; top:0; width:100%; height:335rem; overflow:hidden; z-index:0}
	.TopStepHero img{display:block; width:100%; height:335rem; object-fit:cover}
	.TopStepHero::after{content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(180deg, rgba(4,12,44,.30) 0%, rgba(4,12,44,.55) 100%)}
	.TopStepInner{position:relative; width:833rem; margin:0 auto; padding-top:208rem; box-sizing:border-box}
	.TopStepItems{position:relative; padding-top: 90rem; margin-top:90rem}
	.TopStepItem{position:relative; display:flex; width:433rem; margin-bottom:20rem}
	.TopStepItem:last-child{margin-bottom:0}
	.TopPointItem .TopStepItemBg{}
	.TopStepItemRight{flex-direction:row-reverse; margin-left:auto}
	.TopStepItemBg{position:absolute; left:-84rem; top:-42rem; width:640rem; height:360rem; background:#fff; z-index:0}
	.TopPointItem .TopStepItemBg{background:#fffef7;}
	.TopStepItemRight .TopStepItemBg{left:auto; right:-78rem}
	.TopStepItemImg{position:relative; z-index:1; flex-shrink:0; line-height:0}
	.TopStepItemImg > img{position: relative; top: -98rem; display:block; width:235rem; height:auto; border-radius:18rem}
	/*HOW TOのスライダー*/
	.TopStepSlider{position:relative; top:-98rem; width:235rem; padding-bottom:30rem}
	.TopStepSlider .splide__slide{line-height:0}
	.TopStepSlider img{display:block; width:100%; height:auto; border-radius:18rem}
	.TopStepSlider .splide__arrow{position:absolute; top:calc((100% - 30rem) / 2); z-index:2; display:flex; align-items:center; justify-content:center; width:30rem; height:30rem; padding:0; border:0; border-radius:50%; background:#fff; box-shadow:0 4rem 12rem rgba(0,19,36,.18); transform:translateY(-50%); cursor:pointer; transition:background .2s, transform .2s}
	.TopStepSlider .splide__arrow:hover{background:#006CFE; transform:translateY(-50%) scale(1.08)}
	.TopStepSlider .splide__arrow--prev{left:-20rem}
	.TopStepSlider .splide__arrow--next{right:-20rem}
	.TopStepSlider .splide__arrow svg{width:14rem; height:14rem; fill:#006CFE; transition:fill .2s}
	.TopStepSlider .splide__arrow:hover svg{fill:#fff}
	.TopStepSlider .splide__arrow--prev svg{transform:scaleX(-1)}
	.TopStepSlider .splide__pagination{position:absolute; left:0; right:0; bottom:0; gap:8rem}
	.TopStepSlider .splide__pagination__page{display:block; width:8rem; height:8rem; padding:0; border:0; border-radius:4rem; background:#c5d0dc; cursor:pointer; transition:width .3s, background .3s}
	.TopStepSlider .splide__pagination__page.is-active{width:22rem; background:#006CFE}
	.TopStepItem:nth-child(odd) .TopStepItemNum{left: 280rem}
	.TopStepItem:nth-child(odd) .TopStepItemImg > img, .TopStepItem:nth-child(odd) .TopStepSlider{left: -40rem}
	.TopStepItem:nth-child(even) .TopStepItemImg > img, .TopStepItem:nth-child(even) .TopStepSlider{left: 40rem}
	.TopStepItemNum{position: absolute; left: -170rem; top: 10rem; min-width: 145rem; text-align: center; padding: 6rem 15rem; font-family: "Barlow", sans-serif; font-size: 25rem; font-weight: bold; background: #fff; border: solid 2rem #006CFE; line-height: 1; color: #006CFE;}
	.TopPointItem .TopStepItemNum{border: solid 2rem #a59100; line-height: 1; color: #a59100;}
	.TopStepItemTxt{position:relative; z-index:1; flex-shrink:0; width:240rem; margin-left:10rem; padding-top:45rem}
	.TopStepItemRight .TopStepItemTxt{position: relative; left: 12rem; margin-left:0; margin-right:25rem}
	.TopStepItemTtl{margin-bottom:15rem; font-size:24rem; font-weight:700; line-height:1.6; color:#0a1626}
	.TopStepItemDesc{font-size:14.5rem; line-height:1.8; color:#313131}

	.TopFaqTtl{margin-bottom: 45rem; text-align: end}
	.TopFaqTtl .SecTtlJa{justify-content: flex-end}
	.TopFaqDl{margin:0 auto; border-top:solid 1rem #dde3ea}
	.TopFaqItem{border-bottom:solid 1rem #dde3ea}
	.TopFaqQ{position:relative; padding:30rem 0 30rem 40rem; font-size:18rem; font-weight:bold; line-height:1.6; color:#333}
	.TopFaqQ::before{content:"Q"; position:absolute; top:28rem; left:0; font-size:18rem; font-weight:800; line-height:1.6; color:#555}
	.TopFaqA{position:relative; padding:0 0 30rem 40rem; font-size:16rem; line-height:1.9; color:#000}
	.TopFaqA::before{content:"A"; position:absolute; top:0; left:0; font-size:15rem; font-weight:800; line-height:1.9; color:#006CFE}

	/* お知らせ。見出しが左、記事が右の2カラム。件数はWP側から動的に出る。 */
	.TopNews{padding:92rem 0; background:#f2f5f7}
	.TopNewsInner{display:flex; justify-content:space-between; align-items:flex-start; width:833rem; margin:0 auto; box-sizing:border-box}
	.TopNewsTtlArea{padding-top:6rem}
	.TopNewsList{display:flex; flex-direction:column; gap:17rem}
	.TopNewsLiAnc{display:flex; align-items:center; width:481rem; height:83rem; padding: 23rem 33rem; background:#fff; color:#313131; font-size:12rem; box-sizing:border-box; transition:background .42s, color .42s}
	.TopNewsLiAnc:hover{background:#0a1626; color:#fff; opacity:1}
	.TopNewsLiInner{display:flex; align-items:center; min-width:0}
	.TopNewsDate{flex-shrink:0; margin-right:13rem; font-family:"Barlow", sans-serif; font-weight:700; color:#858788; transition:color .42s}
	.TopNewsLiAnc:hover .TopNewsDate{color:#b6bcc2}
	.TopNewsTtl{letter-spacing:1rem}
	.TopNewsArrow{flex-shrink:0; margin-left:auto; padding-left:16rem; line-height:0}
	.TopNewsArrow svg{display:block; width:28rem; height:8rem}
	.TopNewsEmpty{width:481rem; padding:28rem 33rem; background:#f2f5f7; font-size:12rem; color:#858788; box-sizing:border-box}
	.TopNewsMoreAnc{display:flex; align-items:center; width:173rem; height:55rem; padding:11rem 12rem 11rem 15rem; margin-left:auto; background:#0a1626; color:#fff; font-size:12rem; font-weight:700; box-sizing:border-box; transition:background .42s}
	.TopNewsMoreAnc:hover{background:#333; opacity:1}

	.TopCta{position: relative;  text-align:center; background:linear-gradient(135deg, rgba(0,79,223) 0%, rgba(88,21,125) 100%) padding-box;}
	.TopCta::before{content:""; position:absolute; inset:0; z-index:0; background:url("images/about-03.jpg") center/cover no-repeat; opacity:.08; pointer-events:none}
	.TopCta .TopInner{position: relative; z-index: 3; padding:64rem}
	.TopCtaCatch{display: inline-block; margin-bottom:15rem; padding: 4rem 15rem; font-size:18rem; font-weight:500; line-height:1.5; border: solid 1rem #fff; color:#fff;}
	.TopCtaTtl{margin-bottom:40rem; font-size:38rem; font-weight:800; line-height:1.5; letter-spacing: 1.5rem; color:#fff}
	.TopCtaTxt{margin-bottom:44rem; font-size:16rem; line-height:1.7; color:#5a6675}
	.TopCtaBtnWrap{display:flex; justify-content:center; align-items:center; width: fit-content; margin: 0 auto; background: #fff; padding: 20rem 84rem 6rem;}
	.TopCtaBtnItem{display: flex; flex-direction: column; align-items: center; width: 290rem; padding: 20rem 10rem;}
	.TopCtaBtnItem .BtnItemQRImg{margin-top: 10rem; width: 170rem}
	/* Apple(2.72)とGoogle(3.38)で縦横比が違うので、幅ではなく高さを揃える */
	.TopCtaBtnApple img,.TopCtaBtnGoogle img{width:auto; height:42rem; display:block}
}

@media(min-width:1000px){
	html{font-size:1px}
	.Container{width:940rem}
}

@media (min-width:1000px) and (max-width:1279.9px){
	.HeaderNavLi04{right:45rem}
	.TopPage .ContentArea,.SubPage .ContentArea{width:940rem}
	.SinglePage .ContentArea{width:95%}
	.MainContent{width:calc(100% - 310rem)}
	.ArticleItem{width:300rem}
}

@media (min-width:1152px){
	.TopPage .ContentArea,.SubPage .ContentArea{width:1040rem}
	.SinglePage .ContentArea{width:1040rem}
	.MainContent{width:770rem; margin-right:50rem}
	.ArticleItem{width:238rem}
	.ArticleList .ArticleItem:nth-child(2n){margin-right:25rem}
	.ArticleList .ArticleItem:nth-child(3n){margin-right:0}
	.HeroVisualArea{width:auto;}
}

@media(min-width:1280px){
	.HeaderNavLiAnc{margin:0 30rem}
	.HeaderNavLi04{width:160rem; right:5%}
	.ContentArea{width:1120rem}
	.MainContent{width:770rem; padding:0 0 10rem; margin-right:50rem}
	.SinglePage .MainContent{width: 730rem;}
	.ArticleItem{width:240rem; margin-right:25rem}
	.SinglePage .ContentArea{width: 1180rem;}
	.SinglePage .AdSideArea{display: block; width: 120rem; margin-right: 50rem;}
}

@media(min-width:1366px){
	header{padding:0 5%}
	#breadcrumb{padding:20rem 5%}
	.HeaderNavLi04{right:8%}
	.TopPage .ContentArea,.SubPage .ContentArea{width: 1210rem;}
	.AdSideArea{display: block; width: 120rem; margin-right: 50rem;}
}

@media(min-width:1520px){
	.MvArea .splide__arrow--prev,.MvArea .splide__arrow--next{top:calc(6vw - 10rem)}
}

@media(min-width:1920px){
	.MvArea{padding:40rem 100rem}
	.MvArea .splide__arrow--prev,.MvArea .splide__arrow--next{top:calc(5vw -  20rem)}
	header{padding:0 10%}
	#breadcrumb{padding:20rem 10%}
	.HeaderNavLi04{right:12%}
}