@charset "UTF-8";

/* --------------------------------------------
REGULATE
--------------------------------------------- */
picture{
	display : block;
	font-size : 0;
}
summary{
	padding : 0;
	margin : 0;
	list-style : none;
	cursor : pointer;
}

/* --------------------------------------------
UNIT
--------------------------------------------- */
:root{
	--remBase : 10rem / 160;
}

/* --------------------------------------------
VARIABLES
--------------------------------------------- */
:root ,
[data-bs-theme="light"]{
	--fjca-blue : #00008b;
	--bs-body-bg : white;
	--bs-body-bg-rgb : 255 , 255 , 255;
	--bs-primary : #010253;
	--bs-primary-rgb : 1 , 2 , 83;
	--bs-primary-color-filter : invert( 6% ) sepia( 65% ) saturate( 5834% ) hue-rotate( 243deg ) brightness( 86% ) contrast( 117% );
	--bs-secondary : #c1ab05;
	--bs-secondary-rgb : 216 , 167 , 66;

	--bs-dark : #1c232d;
	--bs-dark-rgb : 28 , 35 , 45;
	--filter-white : brightness( 0 ) invert( 1 );
	--bs-red : #e8294d;
	--bs-green : #1eae8b;
	--bs-blue : #2f80ed;
	--bs-yellow : #e9b93d;
	--bs-orange : #ff9500;
	--bs-teal : #30b0c7;
	--bs-purple : #b64f87;
	--bs-gray : #91a2c0;
	--bg-gold : #c1ab05;
	--bs-border-color : #d9d9d9;
	--bs-border-color02 : #ccc;
}
.bg-fjca{
	background-color : var( --fjca-blue );
}
.bg-fjca02{
	background-color : color-mix( in sRGB , var( --fjca-blue ) 10% , transparent );
}
.bg-gold{
	background-color : var( --bg-gold );
}
.text-fjca{
	color : var( --fjca-blue );
}
.badge {
	border-radius: 0px !important;
}
/* --------------------------------------------
CONTAINER
--------------------------------------------- */
@media ( min-width : 768px ){
	.container-md , .container-sm , .container{
		max-width : calc( 1116px + var( --bs-gutter-x ) );
	}
@media ( min-width : 1200px ){
	.container-xl , .container-lg , .container-md , .container{
		max-width : calc( 1116px + var( --bs-gutter-x ) );
	}
}
@media ( min-width : 1400px ){
	.container-xxl , .container-xl , .container-lg , .container-md , .container{
		max-width : calc( 1320px + var( --bs-gutter-x ) );
	}
}

}

/* --------------------------------------------
TYPEGRAPHY
--------------------------------------------- */
.fs-text-md{
	line-height : calc( 28 / 16 );
}
.fs-text-sm{
	line-height : calc( 24 / 14 );
}
.fs-text-lg{
	line-height : calc( 32 / 18 );
}
@media print , screen and ( width > 767px ){
	.fs-text-md-md{
		font-size : 1rem ! important;
		line-height : calc( 28 / 16 );
	}
	.fs-text-md-sm{
		font-size : .875rem ! important;
		line-height : calc( 24 / 14 );
	}
}
.fz-12{
	--fz : 12;
	font-size : calc( 12 * var( --remBase ) );
}
.fz-14{
	--fz : 14;
	font-size : calc( 14 * var( --remBase ) );
}
.fz-16{
	--fz : 16;
	font-size : calc( 16 * var( --remBase ) );
}
.fz-20{
	--fz : 20;
	font-size : calc( 20 * var( --remBase ) );
}
.fz-22{
	--fz : 22;
	font-size : calc( 22 * var( --remBase ) );
}
.fz-24{
	--fz : 24;
	font-size : calc( 24 * var( --remBase ) );
}
.fz-28{
	--fz : 28;
	font-size : calc( 28 * var( --remBase ) );
}
.fz-30{
	--fz : 30;
	font-size : calc( 30 * var( --remBase ) );
}
.fz-32{
	--fz : 32;
	font-size : calc( 32 * var( --remBase ) );
}
.fz-40{
	--fz : 40;
	font-size : calc( 40 * var( --remBase ) );
}
.lh-17{
	line-height : calc( 17 / var( --fz , 14 ) );
}
.lh-19{
	line-height : calc( 19 / var( --fz , 16 ) );
}
.lh-20{
	line-height : calc( 20 / var( --fz , 14 ) );
}
.lh-24{
	line-height : calc( 24 / var( --fz , 20 ) );
}
.lh-26{
	line-height : calc( 26 / var( --fz , 22 ) );
}
.lh-29{
	line-height : calc( 29 / var( --fz , 24 ) );
}
.lh-34{
	line-height : calc( 34 / var( --fz , 28 ) );
}
.lh-38{
	line-height : calc( 38 / var( --fz , 32 ) );
}
.lh-x130{
	line-height : 1.3;
}
.lh-x180{
	line-height : 1.8;
}
@media print , screen and ( width > 767px ){
	.fz-md-14{
		--fz : 14;
		font-size : calc( 14 * var( --remBase ) ) ! important;
	}
	.fz-md-18{
		--fz : 18;
		font-size : calc( 18 * var( --remBase ) ) ! important;
	}
	.fz-md-20{
		--fz : 20;
		font-size : calc( 20 * var( --remBase ) ) ! important;
	}
	.fz-md-32{
		--fz : 32;
		font-size : calc( 32 * var( --remBase ) ) ! important;
	}
	.lh-md-24{
		line-height : calc( 24 / var( --fz , 18 ) ) ! important;
	}
	.lh-md-38{
		line-height : calc( 38 / var( --fz , 32 ) ) ! important;
	}
	.lh-md-48{
		line-height : calc( 48 / var( --fz , 34 ) ) ! important;
	}
	.lh-md-50{
		line-height : calc( 50 / var( --fz , 40 ) ) ! important;
	}
	.lh-md-x150{
		line-height : 1.5 ! important;
	}
}

/* --------------------------------------------
COLORS
--------------------------------------------- */
.bg-red{
	background-color : var( --bs-red );
}
.bg-green{
	background-color : var( --bs-green );
}
.bg-blue{
	background-color : var( --bs-blue );
}
.bg-yellow{
	background-color : var( --bs-yellow );
}
.bg-orange{
	background-color : var( --bs-orange );
}
.bg-teal{
	background-color : var( --bs-teal );
}
.bg-purple{
	background-color : var( --bs-purple );
}
.bg-gray{
	background-color : var( --bs-gray );
}
.border-body{
	border-color : var( --bs-body-color ) ! important;
}
.border-color02{
	border-color : var( --bs-border-color02 ) ! important;
}

/* --------------------------------------------
SPACER
--------------------------------------------- */
.py-14{
	padding-block : calc( 14 * var( --remBase ) );
}
.py-28{
	padding-block : calc( 28 * var( --remBase ) );
}
.py-32{
	padding-block : calc( 32 * var( --remBase ) );
}
.py-36{
	padding-block : calc( 36 * var( --remBase ) );
}
.py-64{
	padding-block : calc( 64 * var( --remBase ) );
}
.py-112{
	padding-block : calc( 112 * var( --remBase ) );
}
.pt-32{
	padding-top : calc( 32 * var( --remBase ) );
}
.pb-32{
	padding-bottom : calc( 32 * var( --remBase ) );
}
.pb-36{
	padding-bottom : calc( 36 * var( --remBase ) );
}
.pb-56{
	padding-bottom : calc( 56 * var( --remBase ) );
}
.mt-28{
	margin-top : calc( 28 * var( --remBase ) );
}
.mt-32{
	margin-top : calc( 32 * var( --remBase ) );
}
.mt-48{
	margin-top : calc( 48 * var( --remBase ) );
}
@media print , screen and ( width > 767px ){
	.py-md-64{
		padding-block : calc( 64 * var( --remBase ) ) ! important;
	}
	.py-md-112{
		padding-block : calc( 112 * var( --remBase ) ) ! important;
	}
	.pe-md-56{
		padding-right : calc( 56 * var( --remBase ) ) ! important;
	}
}
.row-gap-68{
	row-gap : calc( 68 * var( --remBase ) );
}

/* --------------------------------------------
WIDTH
--------------------------------------------- */
.fit-content{
	width : fit-content;
}
@media print , screen and ( width > 767px ){
	.w-md-fit-content{
		width : fit-content ! important;
	}
}
html , body{
	@media print , screen and ( width > 767px ){
		min-width : 1164px;
	}
}
body{
	word-break : break-all;
}

/* --------------------------------------------
HEADER
--------------------------------------------- */
#header{
	@media screen and ( width <= 767px ){
		padding-block : calc( 20 * var( --remBase ) );
		padding-inline : calc( 12 * var( --remBase ) );
		padding-bottom : calc( 21 * var( --remBase ) );
	}
	@media print , screen and ( width > 767px ){
		position : relative;
		grid-template-rows : calc( 79 * var( --remBase ) ) calc( 68 * var( --remBase ) );
		grid-template-columns : auto 1fr auto auto auto auto;
		column-gap : calc( 16 * var( --remBase ) );
		height : calc( 147 * var( --remBase ) );
		padding-inline : max( calc( ( 100% - 1392px ) / 2 ) , calc( 24 * var( --remBase ) ) );
		.logo{
			grid-row : 1;
			grid-column : 1;
		}
		#nav , .scroll{
			display : contents;
		}
		#navSns{
			grid-row : 1;
			grid-column : 5;
		}
	}
}
#menuBtn{
	@media screen and ( width <= 767px ){
		position : fixed;
		top : calc( 20 * var( --remBase ) );
		right : calc( 4 * var( --remBase ) );
		z-index : 12;
		width : calc( 40 * var( --remBase ) );
		height : calc( 40 * var( --remBase ) );
		border-color : transparent;
		border-style : solid;
		border-block-width : calc( 13 * var( --remBase ) );
		border-inline-width : calc( 9 * var( --remBase ) );
		span{
			position : absolute;
			left : 0;
			display : block;
			width : 100%;
			transition : all .4s;
			&:nth-of-type( 1 ){
				top : 0;
			}
			&:nth-of-type( 4 ){
				bottom : 0;
			}
		}
		&[aria-expanded="true"]{
			span:nth-of-type( 1 ){
				scale : 0;
				translate : calc( $( top ) var( --remBase ) ) 0;
			}
			span:nth-of-type( 2 ){
				rotate : -45deg;
			}
			span:nth-of-type( 3 ){
				rotate : 45deg;
			}
			span:nth-of-type( 4 ){
				scale : 0;
				translate : calc( -$( top ) var( --remBase ) ) 0;
			}
		}
		span{
			height : calc( 2 * var( --remBase ) );
			border-radius : 100vmax;
			&:nth-of-type( 2 ) , &:nth-of-type( 3 ){
				top : calc( ( 7 - 1 ) * var( --remBase ) );
			}
		}
		&[aria-expanded="false"]{
			span{
				background-color : var( --bs-secondary-color );
			}
		}
		&[aria-expanded="true"]{
			span{
				background-color : white;
			}
		}
	}
}
#menuBtn{
	@media screen and ( width <= 767px ){
		@media ( prefers-reduced-motion : no-preference ){
			> span{
				transition : all .3s ease;
			}
		}
	}
}
#nav{
	@media screen and ( width <= 767px ){
		body:has( &:not( [inert] ) ){
			overflow : hidden;
		}
		&:not( [inert] ){
			translate : -100% 0;
		}
		&[inert]{
			translate : 0 0;
		}
		position : fixed;
		top : 0;
		left : 100%;
		z-index : 11;
		width : calc( 319 * var( --remBase ) );
		height : 100dvh;
		overflow-y : auto;
		translate : 0 0;
		.scroll{
			overflow-y : auto;
		}
	}
}
#nav{
	@media screen and ( width <= 767px ){
		@media ( prefers-reduced-motion : no-preference ){
			transition-duration : .3s;
			transition-property : translate;
			&[inert]{
				transition-timing-function : ease-out;
			}
			&:not( [inert] ){
				transition-timing-function : ease-in;
			}
		}
	}
}
#navMypages{
	@media screen and ( width <= 767px ){
		li:nth-child( 1 ){
			width : calc( 155 * var( --remBase ) );
		}
		li:nth-child( 2 ){
			width : calc( 140 * var( --remBase ) );
		}
		a{
			width : 100%;
			padding-block : calc( 11.5 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 767px ){
		grid-row : 1;
		grid-column : 6;
		a{
			padding-block : calc( 11.5 * var( --remBase ) );
		}
	}
}
#navGlobal{
	details > div{
		grid-template-columns : 1fr;
	}
	details.is-open{
		summary{
			svg{
				rotate : -180deg;
			}
		}
		> div{
			grid-template-rows : 1fr;
		}
	}
	details:not( .is-open ){
		> div{
			grid-template-rows : 0fr;
		}
	}
	@media screen and ( width <= 767px ){
		> li{
			border-top : solid 1px white;
		}
		> :where( li:first-child , li:last-child ){
			a{
				font-weight : 700;
				color : white;
			}
		}
		summary{
			padding-right : calc( 6 * var( --remBase ) );
		}
		details{
			&.is-open{
				> div{
					padding-bottom : calc( 16 * var( --remBase ) );
				}
			}
		}
	}
	@media print , screen and ( width > 767px ){
		grid-row : 2;
		grid-column : 1/-1;
		border-image-source : linear-gradient( var( --bs-primary ) , var( --bs-primary ) );
		border-image-slice : 0 fill;
		border-image-outset : 0 100vw 0 100vw;
		> :where( li:first-child , li:last-child ){
			position : absolute;
		}
		> :where( li:first-child , li:last-child ){
			top : calc( 27.5 * var( --remBase ) );
			a{
				color : var( --bs-body-color );
			}
		}
		> li:last-child{
			left : calc( 754 * var( --remBase ) );
			&::before{
				display : inline;
				font-size : calc( 14 * var( --remBase ) );
				line-height : calc( 24 / 14 );
				color : var( --bs-body-color );
				content : "｜";
			}
		}
		> li:not( :first-child , :last-child ){
			+ li:not( :first-child , :last-child )::before{
				display : inline;
				font-size : calc( 14 * var( --remBase ) );
				line-height : calc( 24 / 14 );
				color : white;
				content : "｜";
			}
		}
		details{
			> div{
				position : absolute;
				top : calc( 100% - 1rem );
				left : 0;
				width : 100%;
				padding-inline : max( calc( ( 100% - 1092px ) / 2 ) , calc( 24 * var( --remBase ) ) );
				background-color : var( --bs-primary );
			}
			&.is-open{
				> div{
					z-index : 1;
					padding-top : calc( 40 * var( --remBase ) );
					padding-bottom : calc( 60 * var( --remBase ) );
				}
			}
		}
		h4{
			width : calc( 240 * var( --remBase ) );
			font-weight : 400;
		}
		details{
			ul{
				border-left : solid 1px white;
			}
		}
	}
	@media screen and ( 767px < width < 1164px ){
		> li:first-child{
			left : calc( 529 * var( --remBase ) );
		}
		> li:last-child{
			left : calc( 586 * var( --remBase ) );
		}
	}
	@media ( 1164px <= width < 1440px ){
		> li:first-child{
			left : max( calc( 50% - 53 * 100% / 1164 ) , calc( 529 * var( --remBase ) ) );
		}
		> li:last-child{
			left : max( calc( 50% + 4 * 100% / 1164 ) , calc( 586 * var( --remBase ) ) );
		}
	}
	@media ( width >= 1440px ){
		> li:first-child{
			left : calc( 50% + 85 * var( --remBase ) );
		}
		> li:last-child{
			left : calc( 50% + 142 * var( --remBase ) );
		}
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#navGlobal{
		summary svg{
			transition : rotate .3s ease-in;
		}
		details > div{
			transition : grid-template-rows .3s ease-in , padding-block .3s ease-in;
		}
	}
}
#navSns{
	@media screen and ( width <= 767px ){
		img{
			filter : var( --filter-white );
		}
	}
	@media print , screen and ( width > 767px ){
		img{
			filter : var( --bs-primary-color-filter );
		}
	}
}

/* --------------------------------------------
MAIN VISUAL
--------------------------------------------- */
#mv{
	font-size : 0;
	.splide__slide{
		a{
			width : 100%;
			height : 100%;
		}
	}
	.is-active{
		h2{
			-webkit-text-decoration : underline;
			text-decoration : underline;
			text-underline-offset : .125em;
		}
	}
	.splide__pagination{
		> li{
			height : calc( 4 * var( --remBase ) );
		}
		button{
			width : 100%;
			height : 100%;
			border : 0;
		}
		button:not( .is-active ){
			background-color : #c7c7cc;
		}
		button.is-active{
			background-color : var( --bs-orange );
		}
	}
	@media screen and ( width <= 767px ){
		header{
			bottom : calc( 8 * var( --remBase ) );
		}
		picture{
			width : 100%;
			height : 100%;
			img{
				width : 100%;
				height : 100%;
				object-fit : cover;
				object-position : center;
			}
		}
		.splide__pagination{
			> li{
				width : calc( 40 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 767px ){
		header{
			bottom : calc( 16 * var( --remBase ) );
		}
		.splide__pagination{
			> li{
				width : calc( 80 * var( --remBase ) );
			}
		}
	}
}

/* --------------------------------------------
TITLE
--------------------------------------------- */
.title01{
	position : relative;
	overflow-x : clip;
	background-repeat : no-repeat;
	background-position : center;
	background-size : cover;
	span{
		position : relative;
		z-index : 1;
		letter-spacing : .05em;
		&::before{
			position : absolute;
			top : calc( -24 * var( --remBase ) );
			z-index : -1;
			display : block;
			height : calc( 100% + ( 48 ) * var( --remBase ) );
			font-size : 0;
			content : "";
			opacity : .9;
		}
		&::after{
			display : block;
			width : 100%;
			height : 1px;
			margin-top : calc( 8 * var( --remBase ) );
			font-size : 0;
			content : "";
			background-color : var( --bs-border-color );
		}
	}
	em {
		font-style: normal;
		padding-left: .5em;
	}
	@media screen and ( width <= 767px ){
		height : calc( 323 * var( --remBase ) );
		span{
			&::before{
				left : 0;
				width : 100%;
				background-image : linear-gradient( to right , color-mix( in srgb , #00008b 100% , transparent ) 57% , color-mix( in srgb , #00008b 0% , transparent ) 94% );
			}
		}
	}
	@media print , screen and ( width > 767px ){
		height : calc( 520 * var( --remBase ) );
		span{
			&::before{
				top : calc( -24 * var( --remBase ) );
				left : 50%;
				width : 100vw;
				height : calc( 100% + ( 48 ) * var( --remBase ) );
				background-image : linear-gradient( to right , color-mix( in srgb , #00008b 100% , transparent ) 40% , color-mix( in srgb , #00008b 0% , transparent ) 60% );
				translate : -50% 0;
			}
		}
	}
}
.bg-competitions{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/competition/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/competition/bg_title_pc.webp");
	}
}
.bg-seminars{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/seminar/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/seminar/bg_title_pc.webp");
	}
}
.bg-credentials{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/credential/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/credential/bg_title_pc.webp");
	}
}
.bg-organizations{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/organizations/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/organizations/bg_title_pc.webp");
	}
}
.bg-international{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/international/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/international/bg_title_pc.webp");
	}
}
.bg-cheerleading{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/cheerleading/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/cheerleading/bg_title_pc.webp");
	}
}
.bg-information{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/information/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/information/bg_title_pc.webp");
	}
}
.bg-contact{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/contact/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/contact/bg_title_pc.webp");
	}
}
.bg-support{
	@media screen and ( width <= 767px ){
		background-image: url( "../images/support/bg_title_sp.webp");
	}
	@media print , screen and ( width > 767px ){
		background-image: url( "../images/support/bg_title_pc.webp");
	}
}
/* --------------------------------------------
BREADCRUMBS
--------------------------------------------- */
.breadcrumbs{
	background-color : #f5f5f5;
	font-size: .875rem ! important;
}
.pagelink-wrap a {
	color: var(--fjca-blue);

}

/* --------------------------------------------
HEAD
--------------------------------------------- */
.head01{
	@media screen and ( width <= 767px ){
		dl > div + div{
			margin-top : calc( 12 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
text
--------------------------------------------- */

main a {
	text-decoration: underline;
}
main a.d-block  , main a.d-flex{
	text-decoration: none !important;
}
a[href$=".pdf"]::after {
  font-family: "Font Awesome 6 Free";
  content: "\f1c1"; /* PDFアイコン */
  font-weight: 900;
  margin-left: 0.3em;
  color: #e74c3c;
}
#competitionLinks a {
	text-decoration: none !important;
}
#posts li a {
	text-decoration: none !important;
}
.font-color-blue {
	color: #101060;
}