@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"]{
	--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-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;
	--bs-border-color : #d9d9d9;
}

/* --------------------------------------------
CONTAINER
--------------------------------------------- */
@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( 1116px + var( --bs-gutter-x ) );
	}
}

/* --------------------------------------------
TYPEGRAPHY
--------------------------------------------- */
.fs-text-md{
	line-height : calc( 28 / 16 );
}
.fs-text-sm{
	line-height : calc( 24 / 14 );
}
@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 );
	}
}

/* --------------------------------------------
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 );
}
body{
	@media print , screen and ( width > 767px ){
		min-width : 1164px;
	}
}

/* --------------------------------------------
HEADER
--------------------------------------------- */
#header{
	@media screen and ( width <= 767px ){
		padding-inline : calc( 12 * var( --remBase ) );
		padding-top : calc( 20 * var( --remBase ) );
		padding-bottom : calc( 21 * var( --remBase ) );
	}
	@media print , screen and ( width > 767px ){
		grid-template-rows : calc( 79 * var( --remBase ) ) calc( 68 * var( --remBase ) );
		grid-template-columns : auto 1fr auto auto auto auto;
		column-gap : calc( 16 * 100% / 1392 );
		height : calc( 163 * 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;
		}
		.scroll{
			padding-block : calc( 74 * var( --remBase ) );
			padding-inline : calc( 12 * var( --remBase ) );
		}
	}
}
#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 ) );
			font-size : calc( 12 * var( --remBase ) );
			line-height : calc( 24 / 12 );
		}
	}
	@media print , screen and ( width > 767px ){
		grid-row : 1;
		grid-column : 6;
		a{
			padding-block : calc( 11.5 * var( --remBase ) );
			font-size : calc( 14 * var( --remBase ) );
			line-height : calc( 24 / 14 );
		}
	}
}
#navGlobal{
	details > div{
		display : grid;
		grid-template-columns : 1fr;
		overflow : hidden;
		> div{
			overflow : hidden;
		}
	}
	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 ){
		margin-top : calc( 40 * var( --remBase ) );
		> li{
			border-top : solid 1px white;
		}
		> :where( li:first-child , li:last-child ){
			a{
				font-size : calc( 16 * var( --remBase ) );
				font-weight : 700;
				line-height : calc( 28 / 16 );
				color : white;
			}
		}
		summary{
			padding-right : calc( 6 * var( --remBase ) );
		}
		details{
			&.is-open{
				> div{
					padding-bottom : calc( 16 * var( --remBase ) );
				}
			}
			li + li{
				margin-top : calc( 8 * var( --remBase ) );
			}
			a{
				font-size : calc( 16 * var( --remBase ) );
				line-height : calc( 28 / 16 );
			}
		}
	}
	@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{
				font-size : calc( 14 * var( --remBase ) );
				line-height : calc( 24 / 14 );
				color : var( --bs-body-color );
			}
		}
		> li:first-child{
			left : calc( 50% + 85 * var( --remBase ) );
		}
		> li:last-child{
			left : calc( 50% + 142 * 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-tertiary-color );
			}
			&.is-open{
				> div{
					padding-top : calc( 40 * var( --remBase ) );
					padding-bottom : calc( 60 * var( --remBase ) );
				}
			}
		}
		h4{
			width : calc( 237 * var( --remBase ) );
			font-weight : 400;
		}
		details{
			ul{
				border-left : solid 1px white;
			}
			a{
				font-size : calc( 18 * var( --remBase ) );
				line-height : calc( 32 / 18 );
			}
		}
	}
}
@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%;
		}
	}
	header{
		left : 0;
	}
	.is-active{
		h2{
			-webkit-text-decoration : underline;
			text-decoration : underline;
			text-underline-offset : .125em;
		}
	}
	.splide__pagination{
		row-gap : calc( 4 * var( --remBase ) );
		column-gap : calc( 4 * var( --remBase ) );
		> 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 ){
		padding-bottom : calc( 0 * var( --remBase ) );
		header{
			bottom : calc( 8 * var( --remBase ) );
			padding-inline : calc( 8 * var( --remBase ) );
		}
		picture{
			width : 100%;
			height : 100%;
			img{
				width : 100%;
				height : 100%;
				object-fit : cover;
				object-position : center;
			}
		}
		h2{
			font-size : calc( 14 * var( --remBase ) );
			line-height : 1.3;
		}
		.splide__pagination{
			> li{
				width : calc( 40 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 767px ){
		header{
			bottom : calc( 16 * var( --remBase ) );
			padding-inline : calc( 20 * var( --remBase ) );
		}
		h2{
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 32 / 18 );
		}
		.splide__pagination{
			> li{
				width : calc( 80 * var( --remBase ) );
			}
		}
	}
}

/* --------------------------------------------
TITLE
--------------------------------------------- */
.title02{
	font-size : calc( 24 * var( --remBase ) );
	letter-spacing : .05em;
	&::after{
		display : block;
		width : calc( 120 * var( --remBase ) );
		height : calc( 2 * var( --remBase ) );
		font-size : 0;
		content : "";
		background-color : #c1ab05;
	}
}
.title03{
	font-family : Roboto , sans-serif;
	font-size : calc( 40 * var( --remBase ) );
	font-weight : 900;
	letter-spacing : .05em;
	&::after{
		display : block;
		width : calc( 120 * var( --remBase ) );
		height : calc( 2 * var( --remBase ) );
		font-size : 0;
		content : "";
		background-color : #c1ab05;
	}
	@media print , screen and ( width > 767px ){
		line-height : calc( 50 / 40 );
	}
}

/* --------------------------------------------
LINK
--------------------------------------------- */
.more01{
	width : fit-content;
	border-bottom-color : var( --bs-body-color ) ! important;
}

/* --------------------------------------------
NEWS
--------------------------------------------- */
#news{
	position : relative;
	&::before{
		position : absolute;
		left : 0;
		display : block;
		width : 100%;
		font-size : 0;
		content : "";
		background-color : color-mix( in sRGB , var( --bs-primary ) 10% , transparent );
	}
	@media screen and ( width <= 767px ){
		padding-bottom : calc( 24 * var( --remBase ) );
		padding-right : 0;
		&::before{
			top : calc( 21 * var( --remBase ) );
			height : calc( 100% - 21 * var( --remBase ) );
		}
		.splide__track{
			margin-top : calc( 24 * var( --remBase ) );
		}
		.splide__list{
			column-gap : 0;
		}
		.more01{
			margin-top : calc( 40 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 767px ){
		padding-top : calc( 40 * var( --remBase ) );
		padding-bottom : calc( 80 * var( --remBase ) );
		&::before{
			top : calc( ( 20 + 40 ) * var( --remBase ) );
			height : calc( 100% - ( 20 + 40 ) * var( --remBase ) );
		}
		.splide__track{
			margin-top : calc( 40 * var( --remBase ) );
		}
		.splide__list{
			grid-template-columns : repeat( 4 , 1fr );
		}
		.more01{
			margin-top : calc( 50 * var( --remBase ) );
		}
	}

}
	.news-list {
		padding-bottom: 1.5rem;
		border-bottom: 1px solid #ccc !important;

		.news-image {
			object-fit: cover;
			height: 152px;
		}
	}
/* --------------------------------------------
INFOS
--------------------------------------------- */
#infos{
	time + p{
		&::before{
			margin-right : calc( 8 * var( --remBase ) );
			content : "｜";
		}
	}
	h2 + p{
		line-height : 1;
	}
	@media screen and ( width <= 767px ){
		padding-bottom : calc( 55 * var( --remBase ) );
		margin-top : calc( 45 * var( --remBase ) );
		section + section{
			margin-top : calc( 67 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 767px ){
		padding-bottom : calc( 80 * var( --remBase ) );
		margin-top : calc( 80 * var( --remBase ) );
		h2 + p{
			font-size : calc( 14 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
FOOTER
--------------------------------------------- */
#footer{
	.toTop{
		width : calc( 42 * var( --remBase ) );
		height : calc( 42 * var( --remBase ) );
	}
	@media screen and ( width <= 767px ){
		padding-bottom : calc( 80 * var( --remBase ) );
		background-color : var( --bs-primary );
		.copyright{
			padding-inline : calc( 20 * var( --remBase ) );
			margin-top : calc( ( -42 + 24 ) * var( --remBase ) );
			font-size : calc( 12 * var( --remBase ) );
			line-height : 1.8;
		}
	}
	@media print , screen and ( width > 767px ){
		background-color : var( --bs-dark );
		border-bottom : solid calc( 16 * var( --remBase ) ) var( --bs-primary );
		.row01{
			padding-top : calc( 22 * var( --remBase ) );
			padding-bottom : calc( 42 * var( --remBase ) );
		}
		.links{
			row-gap : calc( 16 * var( --remBase ) );
			column-gap : calc( 8 * var( --remBase ) );
			> li::after{
				font-size : calc( 14 * var( --remBase ) );
				line-height : calc( 24 / 14 );
				color : white;
				content : "｜";
			}
		}
		.row02{
			padding-bottom : calc( 16 * var( --remBase ) );
		}
		.copyright{
			font-size : calc( 14 * var( --remBase ) );
			line-height : 1.5;
		}
	}
}

  .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  ul.categoriy-list {
	li {
		a {
			img{
				width: 100%;
				height: 280px;
				object-fit: cover;
			}
		}
	}
  }
@media screen and ( width <= 767px ){
  ul.categoriy-list {
	li {
		a {
			img{
				width: 100%;
				height: 250px;
				object-fit: cover;
			}
		}
	}
  }
}