@charset "utf-8";

.pc {
	display: none !important;
}


html {
	scroll-behavior: smooth;
}

#menu-button {
	position: absolute;
	width: 60px;
	height: 60px;
	right: 0;
	top: 0;
}
#menu-button button {
	position: relative;
	display: block;
	width: 60px;
	height: 60px;
	border: none;
	background: transparent;
	cursor: pointer;
}
#menu-button button i {
	position: absolute;
	width: 20px;
	height: 2px;
	left: calc(50% - 10px);
	top: calc(50% - 1px);
	background: #132657;
	transition: all 300ms ease-out;
}
#menu-button button i:nth-child(1) {
	margin-top: -6px;
}
#menu-button button i:nth-child(3) {
	margin-top: 6px;
}

body.opened-menu #menu-button button i:nth-child(1) {
	transform: translateY(6px) rotate(45deg);
}
body.opened-menu #menu-button button i:nth-child(3) {
	transform: translateY(-6px) rotate(-45deg);
}
body.opened-menu #menu-button button i:nth-child(2) {
	transform: scaleX(0);
}




#wrap > header {
	position: fixed;
	width: 100%;
	height: 60px;
	left: 0;
	top: 0;
	z-index: 1000;
}
#wrap > header .bg {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #fff;
	border-bottom: 1px solid #132657;
}
#wrap > header .inner {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 60px;
	z-index: 10;
	padding: 0 15px;
}

#wrap > header .logo {
	width: 88px;
	height: 40px;
}
#wrap > header .logo img {
	width: 100%;
	height: auto;
}

#wrap > header ul {
	line-height: 1;
}
#wrap > header li a {
	color: #132657;
}

#menu-container {
	box-sizing: border-box;
	position: fixed;
	width: 180px;
	right: 0;
	top: 60px;
	z-index: 1000;
	padding: 25px 20px;
	background: rgba(255,255,255,0.9);
	border: 0 solid #132657;
	border-width: 1px 0 1px 1px;
	backdrop-filter: blur(5px);
	transform: translateX(182px);
	transition: all 400ms ease-out
}
body.opened-menu #menu-container {
	transform: translateX(0px);
}


#menu-container .extra {
}

#global-menu {
}
#global-menu ul {
	position: relative;
	padding-right: 30px;
}
#global-menu ul + ul::after {
	position: absolute;
	content: "";
	display: block;
	width: 10px;
	height: 1px;
	left: 0;
	top: 0;
	background: #132657;
}

#global-menu ul + ul {
	margin-top: 30px;
	padding-top: 30px;
}
#global-menu li + li {
	margin-top: 20px;
}
#global-menu a {
	position: relative;
	display: inline-block;
	font-size: 16px;
	transition: all 300ms ease-out;
}
#global-menu a::after {
	position: absolute;
	content: "";
	display: block;
	width: calc(100% + 4px);
	height: 1px;
	left: -2px;
	bottom: -1px;
	background: #132657;
	transform: scaleX(0);
	transition: all 300ms ease-out;
}
#global-menu a:active {
}
#global-menu a:hover::after {
}

body.team #global-menu li.team a::after,
body.about #global-menu li.about a::after,
body.news #global-menu li.news a::after,
body.contact #global-menu li.contact a::after
{
	transform: scaleX(1);
}







#lang-menu {
	display: inline-block;
	margin-top: 30px;
	padding: 3px 6px 5px;
	color: #132675;
	border: 1px solid #132675;
}
#lang-menu ul {
	display: flex;
	font-size: 13px;
}
#lang-menu li + li::before {
	content: "/";
	margin: 0 6px;
}
#lang-menu li a {
	position: relative;
	display: inline-block;
	transition: all 300ms ease-out;
}
#lang-menu li a::after {
	position: absolute;
	display: block;
	content: "";
	width: 100%;
	height: 1px;
	left: 0;
	bottom: -1px;
	background: #132675;
	opacity: 0;
}

#lang-menu a:hover {
	opacity: 0.7;
}

html:lang(ja) #lang-menu .ja a::after,
html:lang(en) #lang-menu .en a::after {
	opacity: 1;
}


/*
#lang-menu a {
	display: inline-block;
	font-size: 14px;
	padding: 2px 6px;
	border: 1px solid #132657;
	transition: all 300ms ease-out;
}
#lang-menu a:active {
}

html:lang(ja) #lang-menu .ja,
html:lang(en) #lang-menu .en {
	display: none;
}
*/



#wrap > footer {
	box-sizing: border-box;
	position: relative;
	min-height: 80px;
	padding: 20px 15px 15px;
	/*
	background: url(../img/bg_footer.png) 50% 100% no-repeat;
	background-size: auto 200px;
	*/
}
#wrap > footer .inner {
}

body.home #wrap > footer {
	background: none;
}





#wrap > footer .primary {
}
#wrap > footer .primary .logo {
	width: 70px;
}
#wrap > footer .primary .logo img {
	width: 100%;
	height: auto;
}
#wrap > footer .primary .main-menu {
	margin: 30px 0 0;
	line-height: 1;
}
#wrap > footer .primary .main-menu > ul {
	display: grid;
	grid-template-columns: 50% 50%;
	grid-gap: 10px;
	width: 310px;
}
#wrap > footer .main-menu > ul > li {
	box-sizing: border-box;
	position: relative;
	width: 150px;
	padding-left: 10px;
	font-size: 14px;
}
#wrap > footer .main-menu > ul > li::before {
	position: absolute;
	content: "";
	display: block;
	width: 1px;
	height: 12px;
	left: 0;
	top: 2px;
	background: rgba(255,255,255,0.5);
}
#wrap > footer .main-menu > ul > li:nth-child(2n) {
}
#wrap > footer .main-menu > ul > li:nth-child(n + 3) {
	margin-top: 10px;
}

#wrap > footer .main-menu > ul > li:nth-child(3) {
	grid-row: 2 / span 3;
}
#wrap > footer .main-menu > ul > li:nth-child(5) {
	grid-column: 2 / 3;
}


#wrap > footer .main-menu ul ul {
	margin: 10px 0 0 1px;
}
#wrap > footer .main-menu ul ul li {
	position: relative;
	font-size: 12px;
}
#wrap > footer .main-menu ul ul li::before {
}
#wrap > footer .main-menu ul ul li + li {
	margin-top: 8px;
}





#wrap > footer .sub-menu {
	margin: 30px 0 0;
}
#wrap > footer .sub-menu ul {
	display: flex;
	line-height: 1;
}
#wrap > footer .sub-menu li {
	position: relative;
}
#wrap > footer .sub-menu li + li {
	margin-left: 11px;
	padding-left: 12px;
}
#wrap > footer .sub-menu li + li::before {
	position: absolute;
	content: "";
	display: block;
	width: 1px;
	height: 12px;
	left: 0;
	top: calc(50% - 4px);
	background: rgba(255,255,255,0.5);
}
#wrap > footer .sub-menu li a {
	font-size: 11px;
	cursor: pointer;
}



/*
#wrap > footer .menu  a {
	position: relative;
	display: inline-block;
}
#wrap > footer .menu a::after {
	position: absolute;
	display: block;
	content: "";
	width: 100%;
	height: 1px;
	left: 0;
	bottom: -2px;
	background: #fff;
	transition: all 300ms ease-out;
	transform: scaleX(0);
}
#wrap > footer .menu a:active::after {
	transform: scaleX(1);
}
*/






#wrap > footer .secondary {
	margin: 45px 0 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

#wrap > footer .copyright {
	font-size: 12px;
}
#wrap > footer .copyright span {
	position: relative;
	top: 1px;
}


#wrap > footer .lang-menu {
	font-size: 13px;
}
#wrap > footer .lang-menu ul {
	display: flex;
	font-size: 13px;
}
#wrap > footer .lang-menu li + li::before {
	content: "/";
	margin: 0 6px;
}
#wrap > footer .lang-menu li a {
	position: relative;
	display: inline-block;
	transition: all 300ms ease-out;
}
#wrap > footer .lang-menu li a::after {
	position: absolute;
	display: block;
	content: "";
	width: 100%;
	height: 1px;
	left: 0;
	bottom: 0;
	background: #fff;
	opacity: 0;
}
#wrap > footer .lang-menu li a:hover {
	opacity: 0.7;
}

html:lang(ja) #wrap > footer .lang-menu li.ja a::after,
html:lang(en) #wrap > footer .lang-menu li.en a::after
{
	opacity: 1;
}














#scroll-top {
	position: absolute;
	display: flex;
	justify-content: flex-end;
	width: 32px;
	height: 32px;
	right: 15px;
	top: 20px;
	z-index: 10;
}
#scroll-top a {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 32px;
	height: 32px;
	border: 1px solid #fff;
	border-radius: 30px;
	transition: all 300ms ease-out;
	cursor: pointer;
}
#scroll-top a::after {
	position: absolute;
	content: "";
	display: block;
	width: 13px;
	height: 8px;
	background: url(../img/arrow_top_navy.svg) 0 0 no-repeat;
	background-size: 100% auto;
	transition: all 300ms ease-out;
	filter: brightness(0) invert(1);
}
#scroll-top a:hover {
	background: #fff;
}
#scroll-top a:hover::after {
	filter: brightness(1) invert(0);
}












.button-large {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 36px;
	padding: 0 20px 1px;
	font-size: 13px;
	line-height: 1;
	border: 1px solid #fff;
	border-radius: 21px;
	cursor: pointer;
	transition: all 300ms ease-out;
}
.button-large::after {
	position: absolute;
	content: "";
	display: block;
	width: 8px;
	height: 13px;
	right: 10px;
	top: calc(50% - 6px);
	background: url(../img/arrow_next_navy.svg) 0 50% no-repeat;
	background-size: 80% auto;
	transition: all 300ms ease-out;
	filter: brightness(0) invert(1);
}
.button-large:active {
	color: #132675 !important;
	background: #fff;
}
.button-large:active::after {
	filter: brightness(1) invert(0);
}





.button-normal {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 42px;
	padding: 0 20px 1px;
	font-size: 14px;
	line-height: 1;
	border: 1px solid #132675;
	border-radius: 21px;
	cursor: pointer;
	transition: all 300ms ease-out;
}
.button-normal::after {
	position: absolute;
	content: "";
	display: block;
	width: 10px;
	height: 16px;
	right: 16px;
	top: calc(50% - 8px);
	background: url(../img/arrow_next_navy.svg) 50% 50% no-repeat;
	background-size: 100% auto;
	transition: all 300ms ease-out;
	filter: brightness(1) invert(0);
}
.button-normal:active {
	color: #fff;
	background: #132675;
}
.button-normal:active::after {
	filter: brightness(0) invert(1);
}





.button-mini {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 30px;
	padding: 0 10px 1px;
	font-size: 13px;
	line-height: 1;
	border: 1px solid #132675;
	border-radius: 15px;
	cursor: pointer;
	transition: all 300ms ease-out;
}
.button-mini::after {
	position: absolute;
	content: "";
	display: block;
	width: 10px;
	height: 16px;
	right: 10px;
	top: calc(50% - 8px);
	background: url(../img/arrow_next_navy.svg) 50% 50% no-repeat;
	background-size: 80% auto;
	transition: all 300ms ease-out;
	filter: brightness(1) invert(0);
}
.button-mini:hover {
	color: #fff;
	background: #132675;
}
.button-mini:hover::after {
	filter: brightness(0) invert(1);
}






/*
body.content #wrap {
	padding-top: 60px;
}
*/


main {
	min-height: calc(100vh - 60px - 120px - 129px);
	background: #fff;
}
.main-inner {
	box-sizing: border-box;
	width: 100%;
	margin: 0 auto;
	padding: 20px 20px 60px;
}

.main-inner.compact {
	max-width: calc(900px + 80px);
}



.content-header {
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 140px;
	padding-top: 45px;
	background: url(../img/bg_header.png) 50% 0% no-repeat;
	background-size: auto 200px;
	background-attachment: fixed;
}
.content-header h1,
.content-header span {
	font-size: 36px;
	font-weight: 400;
	line-height: 1;
}

/*
body.notfound .content-header {
	height: 120px;
}
body.notfound .content-header h1 {
	font-size: 40px;
}
body.notfound main {
	min-height: calc(100vh - 100px - 120px - 196px);
}
*/



.return {
	margin: 40px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid #8992ab;
}
.return a {
	position: relative;
	display: flex;
	padding-left: 16px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
}
.return a::before {
	position: absolute;
	content: "";
	display: block;
	width: 8px;
	height: 13px;
	left: 0;
	top: calc(50% - 5px);
	background: url(../img/arrow_prev_navy.svg) 0 0 no-repeat;
	background-size: 100% auto;
}
.return a:active {
	text-decoration: underline;
}


.notfound-container p {
	margin: 10px 0 0;
	font-size: 14px;
	line-height: 1.8;
}
.notfound-container .link-button {
	width: 140px;
	margin: 40px auto 0;
}







/* ---------------------------------------------------------------------------------------------------- */
/* Top */

#top-intro {
	position: relative;
	min-height: calc(100svh);
}
#top-intro h1 {
	position: absolute;
	font-size: 24px;
	opacity: 0;
	pointer-events: none;
}

#top-intro .logo {
	position: absolute;
	width: 220px;
	height: 100px;
	left: calc(50% - 110px);
	top: calc(50% - 100px);
	z-index: 10;
}
#top-intro .logo img {
	width: 100%;
	height: auto;
}

#top-intro .inner {
	box-sizing: border-box;
	position: relative;
	display: flex;
	align-items: flex-end;
	width: 100%;
	height: calc(100svh);
	z-index: 10;
	margin: 0 auto;
	padding: 0 20px 20px;
}

#top-intro .news {
}
#top-intro .news .button {
	display: none;
}

#top-intro .news-container {
}
#top-intro .news-container h2 {
	display: inline-block;
	font-size: 20px;
	font-weight: 500;
	margin-bottom: 8px;
	padding-bottom: 4px;
	border-bottom: 1px solid rgba(255,255,255,0.5);
}
#top-intro .news-container ul {
	position: relative;
}
#top-intro .news-container li + li {
	margin-top: 15px;
}
#top-intro .news-container li > * {
}
#top-intro .news-container .date {
	font-size: 12px;
}
#top-intro .news-container .title {
	box-sizing: border-box;
	position: relative;
	margin: 4px 0 0;
	width: 100%;
	padding-right: 16px;
	font-size: 12px;
}
#top-intro .news-container .title::after {
	position: absolute;
	content: "";
	display: block;
	width: 8px;
	height: 13px;
	right: 0;
	top: calc(50% - 6px);
	background: url(../img/arrow_next_white.svg) 0 0 no-repeat;
	background-size: 100% auto;
	transition: all 300ms ease-out;
}
#top-intro .news-container li a:active .title {
	text-decoration: underline;
}



body.home #wrap {
	overflow: hidden;
}

#top-intro .bg {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 0;
	pointer-events: none;
}
#top-intro canvas {
	position: absolute;
	width: 100%;
	height: calc(100vh + 300px);
	left: 0;
	top: 0;
	z-index: 100;
	object-fit: cover;
	object-position: 100% 0;
	pointer-events: none;
}











#top-message {
	position: relative;
	padding: 100px 0 80px;
	background: linear-gradient(to bottom, rgba(19,38,87,0) 0%, rgba(19,38,87,1) 300px);
}
#top-message .inner {
	box-sizing: border-box;
	position: relative;
	padding: 0 20px;
}

#top-message .message {
	position: relative;
}
#top-message .message .extra {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
#top-message .message h2 {
	width: calc(100% - 125px);
	max-width: 320px;
}
#top-message .message img {
	width: 100%;
	height: auto;
}
#top-message .message ul {
	width: 105px;
	margin-bottom: 2vw;
}
#top-message .message li {
	width: 100%;
}
#top-message .message li + li {
	margin-top: 10px;
}
#top-message .message li a {
	height: 32px;
	font-size: 11px;
}
#top-message .message li:nth-child(1) a {
	padding-left: 8px;
}
#top-message .message li a::after {
	right: 8px;
}


#top-message .message .lead {
	margin: 20px 0 0;
}
#top-message .message .lead p {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.8;
}
#top-message .message .lead .note {
	display: block;
	margin: 4px 0 0;
	font-size: 11px;
}


#top-message .circles {
	position: relative;
	width: 100%;
	margin: 30px -5px 0;
}
#top-message .circles ul {
	position: relative;
	display: flex;
	width: calc(100vw - 30px);
}
#top-message .circles li {
	position: relative;
	width: calc((100vw - 30px - 20px) / 3);
	height: calc((100vw - 30px - 20px) / 3);
}
#top-message .circles li + li {
	margin-left: 10px;
}

#top-message .circles a {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	font-size: 16px;
	font-weight: 500;
	border: 1px solid #fff;
	border-radius: 162px;
	cursor: pointer;
}
#top-message .circles a span {
	position: absolute;
	width: 8px;
	height: 13px;
	left: calc(50% - 4px);
	top: 75%;
	background: url(../img/arrow_next_white.svg) 0 0 no-repeat;
	background-size: 100% auto;
	
	display: none;
}



@media screen and (max-width:374px) {
	#top-message .message h2 {
		width: calc(100% - 110px);
	}
	#top-message .message ul {
		width: 95px;
		margin-bottom: 2vw;
	}
	#top-message .message li + li {
		margin-top: 8px;
	}
	#top-message .message li a {
		height: 28px;
		font-size: 10px;
	}
	#top-message .message li a::after {
		right: 6px;
	}
	#top-message .message li:nth-child(1) a {
		padding-left: 6px;
	}
	
	#top-message .message .lead p {
		font-size: 12px;
	}
}









/* ---------------------------------------------------------------------------------------------------- */
/* About */

.about-container {
}
.about-column {
}
.about-menu {
	display: none;
}

/*
.about-menu li {
	border-bottom: 1px solid #8992ab;
}
.about-menu li a {
	position: relative;
	display: flex;
	padding: 24px;
}
.about-menu li a::after {
	position: absolute;
	content: "";
	display: block;
	width: 10px;
	height: 16px;
	right: 24px;
	top: calc(50% - 8px);
	background: url(../img/arrow_next_navy.svg) 0 0 no-repeat;
	background-size: 100% auto;
}
.about-menu li a:hover {
	text-decoration: underline;
}
*/


.about-column h2 {
	margin: 0 0 25px;
	font-size: 26px;
	font-weight: 400;
	color: #132657;
}


.about-column .column {
	width: 100%;
	scroll-margin-top: 80px;
}
.about-column .column + .column {
	margin-top: 30px;
	padding-top: 30px;
	scroll-margin-top: 50px;
}

.about-column a {
	text-decoration: underline;
}



.about-column #overview {
}
#overview .box dl {
	display: flex;
	justify-content: space-between;
	padding: 0 0 14px;
	border-bottom: 1px solid #8992ab;
}
#overview .box dl + dl {
	margin-top: 14px;
}
#overview .box dt {
	width: 90px;
	font-size: 15px;
	font-weight: 500;
	color: #132657;
}
#overview .box dd {
	width: calc(100% - 90px);
	font-size: 14px;
	line-height: 1.6;
}

html:lang(en) #overview .box dt {
	width: 125px;
	font-size: 14px;
}
html:lang(en) #overview .box dd {
	width: calc(100% - 125px);
}



.about-column #access {
}
#access .box {
}
#access .map {
}
#access dl {
}
#access .map img {
	width: 100%;
	height: auto;
}

#access .box + .box {
	margin-top: 60px;
}
#access .map.google {
	position: relative;
	aspect-ratio: 400 / 280;
}
#access .map iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

#access dl {
	margin: 15px 0 0;
}
#access dt {
	margin: 0 0 8px;
	font-size: 15px;
	font-weight: 500;
	color: #132657;
}
#access dd {
	font-size: 13px;
	line-height: 1.8;
}
#access .map.google + dl dd + dd {
	width: 140px;
	margin-top: 15px;
}
#access .map.access + dl dd + dd {
	margin-top: 5px;
}



.about-column #history {
}

#history h2 {
	margin-bottom: 6px;
}
#history h3 {
	margin-bottom: 25px;
	font-size: 15px;
	font-weight: 500;
}

#history .box {
	position: relative;
}
#history .box p {
	font-size: 14px;
	line-height: 1.8;
}


#history .box dl {
	position: relative;
	display: flex;
	justify-content: space-between;
}
#history .box dt {
	position: relative;
	width: 60px;
	font-size: 18px;
	color: #132657;
}
#history .box dd {
	box-sizing: border-box;
	position: relative;
	width: calc(100% - 60px);
	margin: -2px 0 0;
	padding: 0 0 0 20px;
	font-size: 14px;
	line-height: 1.7;
}
#history .box dl + dl {
	padding-top: 15px;
}

#history .box:has(dl)::after {
	position: absolute;
	content: "";
	display: block;
	width: 1px;
	height: calc(100% - 6px);
	left: 60px;
	top: 5px;
	background: #8992ab;
}
#history .box dt::after {
	box-sizing: border-box;
	position: absolute;
	content: "";
	display: block;
	width: 11px;
	height: 11px;
	left: 55px;
	top: 5px;
	z-index: 10;
	background: #fff;
	border: 1px solid #132657;
	border-radius: 6px;
}
#history .box dl:last-child dt::after {
	background: #132657;
}









.about-column #belief {
}
#belief h3 {
	position: relative;
	margin: 0 0 15px;
	font-size: 17px;
	font-weight: 400;
}
#belief h3::after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	left: 0;
	top: 50%;
	background: #8992ab;
}
#belief h3 span {
	position: relative;
	display: inline-block;
	z-index: 10;
	padding-right: 15px;
	background: #fff;
}

#belief ul + h3 {
	margin-top: 30px;
}

#belief li {
	position: relative;
	padding-left: 14px;
	font-size: 14px;
	line-height: 1.8;
}
#belief li + li {
	margin-top: 10px;
}
#belief li::before {
	position: absolute;
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	background: #132657;
	border-radius: 3px;
	left: 0;
	top: 0.7em;
}


.about-column #appendix {
	padding-bottom: 40px;
	border-top: 1px solid #8992ab;
	border-bottom: 1px solid #8992ab;
}
.about-column #appendix .note {
	margin: 0 0 15px;
	font-size: 13px;
	line-height: 1.8;
}

#appendix li + li {
	margin-top: 6px;
}
#appendix li a {
	position: relative;
	display: inline-block;
	font-size: 13px;
	text-decoration: underline;
}
#appendix li a:active {
	text-decoration: none;
}

#appendix li a::after {
	position: relative;
	content: "";
	display: inline-block;
	width: 8px;
	height: 13px;
	top: 1px;
	margin-left: 4px;
	background: url(../img/arrow_next_navy.svg) 50% 50% no-repeat;
	background-size: 80% auto;
}












/* ---------------------------------------------------------------------------------------------------- */
/* News */

.news-index {
	display: flex;
	flex-direction: column-reverse;
}
.news-list {
}
.news-list h2 {
	margin: 5px 0 15px;
	font-size: 24px;
	font-weight: 400;
	color: #132657;
}

.news-category {
	margin: 0 0 15px;
}

.news-list ul {
	border-top: 1px solid #8992ab;
}
.news-list li {
	position: relative;
	border-bottom: 1px solid #8992ab;
}
.news-list li > a:nth-child(1),
.news-list li > span:nth-child(1) {
	box-sizing: border-box;
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 18px 30px 42px 0;
}
.news-list .date {
	font-size: 14px;
	line-height: 1;
	color: #333;
}
.news-list .title {
	margin: 8px 0 0;
	font-size: 15px;
	line-height: 1.5;
}

.news-list .category {
	position: absolute;
	display: flex;
	left: 0;
	bottom: 14px;
}
.news-list .category a {
	font-size: 12px;
	font-weight: 500;
	color: #666;
}
.news-list .category a:active {
	text-decoration: underline;
}
.news-list .category a + a {
	margin-left: 15px;
}

.news-list li > a:nth-child(1)::after {
	position: absolute;
	content: "";
	display: block;
	width: 10px;
	height: 16px;
	right: 0;
	top: calc(50% - 8px);
	background: url(../img/arrow_next_navy.svg) 0 0 no-repeat;
	background-size: 100% auto;
}
.news-list li > a:active .title {
	text-decoration: underline;
}


.news-category ul {
	display: flex;
	flex-wrap: wrap;
}
.news-category li {
	padding-right: 16px;
}
.news-category li a {
	position: relative;
	font-size: 14px;
	font-weight: 500;
	padding: 0 12px 0 0;
}
.news-category li a::after {
	position: absolute;
	content: "";
	display: block;
	width: 8px;
	height: 13px;
	right: 0;
	top: calc(50% - 6px);
	background: url(../img/arrow_next_navy.svg) 0 0 no-repeat;
	background-size: 100% auto;
}
.news-category li a:active {
	text-decoration: underline;
}



.news-detail .date {
	margin: 10px 0 0;
	font-size: 16px;
	line-height: 1;
	color: #132657;
}

.news-detail h1 {
	margin: 5px 0 0;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.5;
}

.news-detail .text {
	min-height: 100px;
	margin: 40px 0 0;
	line-height: 1.8;
}
.news-detail .text p {
	font-size: 14px;
	line-height: 1.8;
}
.news-detail .text p + p {
	margin-top: 1em;
}
.news-detail .text a {
	font-size: 13px;
	text-decoration: underline;
	word-break: break-all;
}


.news-detail .image {
	margin: 30px 0 0;
}
.news-detail .image img {
	max-width: 100%;
	height: auto;
}













/* ---------------------------------------------------------------------------------------------------- */
/* Team */

/*
.team-list ul {
	display: flex;
	flex-wrap: wrap;
}
.team-list li {
	width: calc((100% - 20px) / 2);
}
.team-list li:nth-child(2n) {
	margin-left: 20px;
}
.team-list li:nth-child(n + 3) {
	margin-top: 50px;
}
*/


.team-list ul {
	display: grid;
	grid-gap: 50px 20px;
	grid-template-columns: calc((100% - 20px) / 2) calc((100% - 20px) / 2);
}
.team-list li:nth-child(1) {
	grid-column: 1 / span 2;
	width: calc(50% - 10px);
}




.team-list li a {
	display: block;
	color: #333;
}
.team-list li dl {
}
.team-list li dt {
	max-width: 320px;
}
.team-list li dt img {
	width: 100%;
	height: auto;
	transition: all 300ms ease-out;
}
.team-list li dd {
	margin: 10px 0 0;
}

.team-list li a:active dt img {
	opacity: 0.7;
}

.team-list li .title {
	font-size: 20px;
}
.team-list li .title-en {
	margin: 5px 0 0;
	font-size: 14px;
}
.team-list li .position {
	margin: 5px 0 0;
	font-size: 12px;
}

body:lang(en) .team-list li .title-en {
	font-size: 20px;
}
body:lang(en) .team-list li .position {
	margin-top: 24px;
}



.team-header {
	position: relative;
}
.team-header .sns {
	position: absolute;
	right: 0;
	bottom: 0;
}
.team-header .sns ul {
	display: flex;
}
.team-header .sns li {
	width: 30px;
}
.team-header .sns li + li {
	margin-left: 8px;
}
.team-header .sns a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	background: #132657;
	border-radius: 20px;
}
.team-header .sns a img {
	width: 18px;
	height: auto;
}





.team-detail h1 {
	font-size: 32px;
	font-weight: 400;
	color: #132657;
}
.team-detail .title-en {
	margin: 2px 0 0;
	font-size: 16px;
	color: #132657;
}
.team-detail .position {
	margin: 12px 0 0;
	font-size: 15px;
}

.team-detail .photo {
	margin: 20px -20px 0;
}
.team-detail .photo img {
	width: 100%;
	height: auto;
}

.team-detail .content {
	margin: 20px 0 0;
}
.team-detail h2 {
	position: relative;
	margin: 0 0 10px;
	font-size: 18px;
	font-weight: 400;
}
.team-detail h2::after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	left: 0;
	top: 50%;
	background: #8992ab;
}
.team-detail h2 span {
	position: relative;
	display: inline-block;
	z-index: 10;
	padding-right: 15px;
	background: #fff;
}

.team-detail .content {
	line-height: 1.8;
}
.team-detail .content * + p,
.team-detail .content * + ul {
	margin-top: 20px;
}
.team-detail .content p {
	font-size: 14px;
	line-height: 1.8;
}
.team-detail .content li {
	position: relative;
	padding-left: 1em;
	text-indent: -1em;
	font-size: 16px;
	line-height: 1.8;
}
.team-detail .content li + li {
	margin-top: 15px;
}
.team-detail .content li::before {
	content: "・";
	text-indent: 0;
}


.team-detail .detail {
	margin: 20px 0 0;
}
.team-detail .detail dl {
	font-size: 14px;
}
.team-detail .detail dl + dl {
	margin-top: 18px;
}
.team-detail .detail dt {
	font-weight: 700;
}
.team-detail .detail dd {
}












/* ---------------------------------------------------------------------------------------------------- */
/* Form */

input[type="text"],
input[type="email"],
textarea
{
	box-sizing: border-box;
	width: 100%;
	padding: 3px;
	font-size: 16px;
	border: 1px solid #8992ab;
	background: #fff;
	vertical-align: bottom;
}

select
{
	appearance: none;
	padding: 8px 40px 8px 8px;
	font-size: 15px;
	border: 1px solid #8992ab;
	border-radius: 0;
	background: #eee url(../img/arrow_pulldown.svg) right 10px top 50% no-repeat;
	background-size: 16px auto;
	cursor: pointer;
}

input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus {
	border-color: #132657;
	outline: none;
}

input[type="submit"] {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 150px;
	height: 48px;
	font-size: 15px;
	font-weight: 500;
	color: #fff;
	border: none;
	background: #132657;
	transition: all 300ms ease-out;
	cursor: pointer;
}
input[type="submit"]:active {
	opacity: 0.7;
}




.upload {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px dashed #999;
}
.upload input[type="file"] {
	font-size: 14px;
}
.upload input[type="file"]::-webkit-file-upload-button {
    padding: 8px 16px;
	font-size: 15px;
	background: #eee;
	border: 1px solid #8992ab;
    border-radius: 0;
    cursor: pointer;
}
.upload:has(.mw-wp-form_file) input[type="file"] {
	opacity: 0;
	position: absolute;
	pointer-events: none;
}





.contact-form dl {
}
.contact-form dt {
	margin: 0 0 8px;
	font-size: 14px;
	font-weight: 500;
	color: #132657;
}
.contact-form dd {
	font-size: 14px;
	line-height: 1.5;
}

.contact-form dl + dl {
	margin-top: 24px;
}
.contact-form .note {
	margin: 10px 0 0;
	font-size: 12px;
	line-height: 1.6;
}
.contact-form .function {
	display: flex;
	justify-content: center;
	width: 100%;
	margin: 40px 0 0;
}
.contact-form .function br {
	display: none;
}
.contact-form .function input + input,
.contact-form .function input + br + input {
	margin-left: 24px;
}


.mw_wp_form .error {
	font-size: 13px !important;
	font-weight: 500;
	margin: 6px 0 0;
}


body:has(.error) .column:not(#contact),
body:has(.error) .about-menu,
body:has(.mw_wp_form_confirm) .column:not(#contact),
body:has(.mw_wp_form_confirm) .about-menu,
body:has(.mw_wp_form_complete) .column:not(#contact),
body:has(.mw_wp_form_complete) .about-menu,
body:has(.mw_wp_form_confirm) .note
{
	display: none !important;
}
body:has(.error) #contact,
body:has(.mw_wp_form_confirm) #contact,
body:has(.mw_wp_form_complete) #contact
{
	margin-top: 0;
	padding-top: 0;
}
body:has(.mw_wp_form_confirm) .upload {
	padding: 0;
	gap: 0;
	border: none;
}
body:has(.mw_wp_form_confirm) .function {
	margin-top: 60px !important;
}

body:has(.mw_wp_form_confirm) .contact-form dl + dl {
	margin-top: 30px;
}

.mw_wp_form_complete p {
	font-size: 15px;
	line-height: 1.8;
}




.contact-intro {
	margin: 10px 0 30px;
}
.contact-intro p {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.8;
}











/* ---------------------------------------------------------------------------------------------------- */
/* 採用 */

.recruit-index .lead {
	font-size: 14px;
	line-height: 1.8;
}
.recruit-index .lead p + p {
	margin-top: 10px;
}

.recruit-list ul {
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px solid #8992ab;
}
.recruit-list li {
	padding-bottom: 30px;
	border-bottom: 1px solid #8992ab;
}
.recruit-list li + li {
	margin-top: 30px;
}
.recruit-list h2 {
	margin: 0 0 12px;
	font-size: 21px;
	font-weight: 400;
	color: #132657;
}
.recruit-list .text {
	font-size: 14px;
	line-height: 1.8;
}
.recruit-list .text p + p {
	margin-top: 1.2em;
}

.recruit-list .text + dl {
	margin-top: 20px;
}
.recruit-list dl + dl {
	margin-top: 5px;
} 
.recruit-list dl {
	display: flex;
	justify-content: space-between;
}
.recruit-list dt {
	width: 200px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.8;
}
.recruit-list dd {
	width: calc(100% - 220px);
	margin-left: 20px;
	font-size: 15px;
	line-height: 1.8;
}


.entry-foot {
	margin: 20px 0 0;
}
.entry-foot p {
	font-size: 13px;
	line-height: 1.8;
}

.entry-button {
	margin: 30px 0 0;
	text-align: center;
}
.entry-button a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 150px;
	height: 48px;
	font-size: 15px;
	font-weight: 400;
	color: #fff;
	border: none;
	background: #132657;
	transition: all 300ms ease-out;
	cursor: pointer;
}
.entry-button a:active {
	opacity: 0.7;
}















/* ---------------------------------------------------------------------------------------------------- */
/* Static */

body.static .content-header {
	height: 160px;
}
body.static .content-header h1 {
	font-size: 20px;
}


.static-container {
	display: flex;
	flex-direction: column;
}
.static-column {
}
.static-menu {
	margin: 60px -20px 0;
	border-top: 1px solid #8992ab;
}

.static-column .intro p {
	font-size: 14px;
	line-height: 1.8;
}
.static-column * + .box {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid #8992ab;
}



.static-menu li {
	border-bottom: 1px solid #8992ab;
}
.static-menu li a {
	position: relative;
	display: flex;
	padding: 15px 20px;
	font-size: 13px;
}
.static-menu li a::after {
	position: absolute;
	content: "";
	display: block;
	width: 8px;
	height: 13px;
	right: 12px;
	top: calc(50% - 6px);
	background: url(../img/arrow_next_navy.svg) 0 0 no-repeat;
	background-size: 100% auto;
}


.static-column h2 {
	margin: 0 0 10px;
	font-size: 18px;
	font-weight: 600;
	color: #132657;
}
.static-column h2 strong {
	display: block;
	padding-top: 5px;
	font-size: 15px;
	line-height: 1.7;
}
.static-column h2.small {
	font-size: 16px;
}

.static-column p {
	font-size: 14px;
	line-height: 1.8;
}

.static-column .image {
	padding: 10px 0;
}
.static-column .image img {
	max-width: 200px;
	height: auto;
}

.static-column li {
	font-size: 14px;
	line-height: 1.8;
}
.static-column ol {
	counter-reset: order;
	padding: 0;
}
.static-column ol > li {
	counter-increment: order;
	padding-left: 1.5em;
	text-indent: -1.5em;
	line-height: 1.75;
}
.static-column ol > li::before {
	display: inline-block;
	width: 1.5em;
	content: counter(order) ".";
	text-indent: 0;
}

.static-column ol.extra > li {
	padding-left: 2.5em;
	text-indent: -2.5em;
}
.static-column ol.extra > li + li {
	margin-top: 5px;
}
.static-column ol.extra > li::before {
	display: inline-block;
	width: 2.5em;
	content: "（" counter(order) "）";
	text-indent: 0;
}

.static-column ol.multi > li + li {
	margin-top: 1.5em;
}
.static-column ol.multi ul {
	margin: 10px 0 0 10px;
}


.static-column ol ol {
	margin: 10px 0 0;
}
.static-column ol ol li + li {
	margin-top: 4px;
}


.static-column ol.alphabet {
	counter-reset: alphabet;
}
.static-column ol.alphabet > li {
	counter-increment: alphabet;
	padding-left: 1.5em;
	text-indent: -1.5em;
}
.static-column ol.alphabet > li::before {
	display: inline-block;
	content: counter(alphabet, lower-alpha) ".";
	text-indent: 0;
}




.static-column ul.marker li {
	padding-left: 1em;
	text-indent: -1em;
	line-height: 1.75;
}
.static-column ul.marker li::before {
	display: inline-block;
	width: 1em;
	content: "・";
	text-indent: 0;
}
.static-column ul.marker li + li {
	margin-top: 8px;
}



.static-column dl.address {
	margin: 30px 0 0;
	border: 1px solid #132657;
}
.static-column dl.address > dt {
	padding: 10px;
	font-size: 13px;
	font-weight: 400;
	color: #fff;
	background: #132657;
}
.static-column dl.address > dd {
}
.static-column dl.address dl {
	display: flex;
	justify-content: space-between;
}
.static-column dl.address dl + dl {
	border-top: 1px solid #132657;
}
.static-column dl.address dl dt {
	box-sizing: border-box;
	width: 100px;
	padding: 8px;
	font-size: 12px;
	font-weight: 500;
	color: #132657;
	background: rgba(19,38,87,0.1);
}
.static-column dl.address dl dd {
	box-sizing: border-box;
	width: calc(100% - 100px);
	padding: 8px;
	font-size: 12px;
	border-left: 1px solid #132657;
}



.static-column p + p,
.static-column p + .image,
.static-column .image + p,
.static-column * + ol
{
	margin-top: 1.2em;
}

.static-column p.note {
	margin-top: 2em !important;
}


.static-container.voting					.static-menu .voting,
.static-container.stewardship				.static-menu .stewardship,
.static-container.pri						.static-menu .pri,
.static-container.responsible-investment	.static-menu .responsible-investment,
.static-container.privacy					.static-menu .privacy,
.static-container.compliance				.static-menu .compliance,
.static-container.antisocial				.static-menu .antisocial,
.static-container.harassment				.static-menu .harassment,
.static-container.conflict					.static-menu .conflict
{
	font-weight: 700;
	background: rgba(19,38,87,0.1);
}














/* ---------------------------------------------------------------------------------------------------- */
/* アニメーション */

#wrap > header .bg {
	background: rgba(255,255,255,0);
	backdrop-filter: blur(0px);
	transition: all 500ms ease-out;
}
#wrap > header .logo {
	filter: brightness(0) invert(1);
	transition: all 500ms ease-out;
}
#menu-container {
}
#menu-button {
	filter: brightness(0) invert(1);
	transition: all 500ms ease-out;
}


body.passed #wrap > header .bg {
	background: rgba(255,255,255,0.9);
	backdrop-filter: blur(5px);
}
body.passed #wrap > header .logo {
	filter: brightness(1) invert(0);
}
body.passed #menu-container {
}
body.passed #menu-button {
	filter: brightness(1) invert(0);
	transition: all 500ms ease-out;
}




body.home #wrap > header .logo {
	opacity: 0;
	visibility: hidden;
	transition: all 500ms ease-out;
}


body.home.passed #wrap > header .logo {
	opacity: 1;
	visibility: visible;
}








#top-message .circles em {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 100;
	object-fit: cover;
	object-position: 100% 0;
	pointer-events: none;
}
#top-message .circles i {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: 1000px;
	visibility: hidden;
}

#top-message .circles a i:nth-child(7) {
	border-width: 12px;
	border-color: rgba(255,255,255,0.1);
}
#top-message .circles a i:nth-child(8) {
	border-width: 10px;
	border-color: rgba(0,0,0,0.1);
}
#top-message .circles a i:nth-child(9) {
	border-width: 10px;
	border-color: rgba(255,255,255,0.07);
}

#top-message .circles a:active i {
	visibility: visible;
	opacity: 0;
}
#top-message .circles a:active i:nth-child(1) {
	width: 196%;
	height: 196%;
	transition: all 1000ms ease-out;
}
#top-message .circles a:active i:nth-child(2) {
	width: 180%;
	height: 180%;
	transition: all 1000ms ease-out 100ms;
}
#top-message .circles a:active i:nth-child(3) {
	width: 168%;
	height: 168%;
	transition: all 1000ms ease-out 100ms;
}
#top-message .circles a:active i:nth-child(4) {
	width: 150%;
	height: 150%;
	transition: all 1000ms ease-out 150ms;
}
#top-message .circles a:active i:nth-child(5) {
	width: 132%;
	height: 132%;
	transition: all 1000ms ease-out 150ms;
}
#top-message .circles a:active i:nth-child(6) {
	width: 116%;
	height: 116%;
	transition: all 1000ms ease-out 150ms;
}

#top-message .circles a:active i:nth-child(7) {
	width: 172%;
	height: 172%;
	transition: all 1000ms ease-out 50ms;
}
#top-message .circles a:active i:nth-child(8) {
	width: 152%;
	height: 152%;
	transition: all 1000ms ease-out 100ms;
}
#top-message .circles a:active i:nth-child(9) {
	width: 130%;
	height: 130%;
	transition: all 1000ms ease-out 150ms;
}










body #top-message .circles a {
	padding-top: 25px;
	font-size: 15px;
	font-weight: 300;
}
body #top-message .circles a::before {
	position: absolute;
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	left: calc(50% - 20px);
	top: calc(6% + 10px);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 80% auto;
	opacity: 0.7;
}
body #top-message .circles li:nth-child(1) a::before {
	background-image: url(../img/icon_team.svg);
	background-size: 90% auto;
	background-position: 50% 100%;
}
body #top-message .circles li:nth-child(2) a::before {
	background-image: url(../img/icon_about2.svg);
	background-size: 85% auto;
}
body #top-message .circles li:nth-child(3) a::before {
	background-image: url(../img/icon_contact3.svg);
	background-size: 95% auto;
}





body.type-b #top-message .circles a {
	font-weight: 600;
}
body.type-b #top-message .circles li:nth-child(1) a {
	background: url(../img/bg1.png) 50% 50% no-repeat;
	background-size: 158px auto;
}
body.type-b #top-message .circles li:nth-child(2) a {
	background: url(../img/bg2.png) 50% 50% no-repeat;
	background-size: 150px auto;
}
body.type-b #top-message .circles li:nth-child(3) a {
	background: url(../img/bg3.png) 50% 50% no-repeat;
	background-size: 134px auto;
}







@keyframes ani-your_css_selector_here {
    0% {
        --s-start-0: 20.55605570475263%;
        --s-end-0: 69.83997566717852%;
        --x-0: 95.95073991485911%;
        --c-0: hsla(0, 0%, 100%, 0.3);
        --y-0: 9.331597222222221%;
        --x-1: 92.84031015609163%;
        --c-1: hsla(0, 0%, 100%, 0.2);
        --s-start-1: 0%;
        --s-end-1: 55.31899567992806%;
        --y-1: 72.33289930555556%;
        --c-2: hsla(297, 100%, 66%, 0.1);
        --x-2: 83.706669369552%;
        --s-start-2: 0%;
        --s-end-2: 45.77892876736944%;
        --y-2: 11.19357638888889%;
        --c-3: hsla(163, 100%, 66%, 0.1);
        --x-3: 37.67357591729171%;
        --s-start-3: 0%;
        --s-end-3: 45.77892876736944%;
        --y-3: 95.27777777777777%;
        --c-4: hsla(224, 100%, 66%, 0.2);
        --x-4: 23%;
        --y-4: 79%;
        --s-start-4: 0%;
        --s-end-4: 74%;
    }

    100% {
        --s-start-0: 13%;
        --s-end-0: 68%;
        --x-0: 10.183965132779242%;
        --c-0: hsla(0, 0%, 100%, 0.3);
        --y-0: 77.19401041666667%;
        --x-1: 9.971112913034665%;
        --c-1: hsla(0, 0%, 100%, 0.2);
        --s-start-1: 13%;
        --s-end-1: 68%;
        --y-1: 15.887586805555555%;
        --c-2: hsla(297, 100%, 66%, 0.1);
        --x-2: 26.45829110075005%;
        --s-start-2: 13%;
        --s-end-2: 68%;
        --y-2: 107.02690972222223%;
        --c-3: hsla(163, 100%, 66%, 0.1);
        --x-3: 64.97060612203528%;
        --s-start-3: 13%;
        --s-end-3: 68%;
        --y-3: 1.5538194444444444%;
        --c-4: hsla(224, 100%, 66%, 0.2);
        --x-4: 84%;
        --y-4: 66%;
        --s-start-4: 13%;
        --s-end-4: 68%;
    }
}

@property --s-start-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 20.55605570475263%
}

@property --s-end-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 69.83997566717852%
}

@property --x-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 95.95073991485911%
}

@property --c-0 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(0, 0%, 100%, 0.3)
}

@property --y-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 9.331597222222221%
}

@property --x-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 92.84031015609163%
}

@property --c-1 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(0, 0%, 100%, 0.2)
}

@property --s-start-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%
}

@property --s-end-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 55.31899567992806%
}

@property --y-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 72.33289930555556%
}

@property --c-2 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(297, 100%, 66%, 0.1)
}

@property --x-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 83.706669369552%
}

@property --s-start-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%
}

@property --s-end-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 45.77892876736944%
}

@property --y-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 11.19357638888889%
}

@property --c-3 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(163, 100%, 66%, 0.1)
}

@property --x-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 37.67357591729171%
}

@property --s-start-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%
}

@property --s-end-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 45.77892876736944%
}

@property --y-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 95.27777777777777%
}

@property --c-4 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(224, 100%, 66%, 0.2)
}

@property --x-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 23%
}

@property --y-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 79%
}

@property --s-start-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%
}

@property --s-end-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 74%
}

body.type-a #top-message .circles li::before {
    --x-0: 95.95073991485911%;
    --c-0: hsla(0, 0%, 100%, 0.3);
    --y-0: 9.331597222222221%;
    --x-1: 92.84031015609163%;
    --c-1: hsla(0, 0%, 100%, 0.2);
    --y-1: 72.33289930555556%;
    --c-2: hsla(297, 100%, 66%, 0.1);
    --x-2: 83.706669369552%;
    --y-2: 11.19357638888889%;
    --c-3: hsla(163, 100%, 66%, 0.1);
    --x-3: 37.67357591729171%;
    --y-3: 95.27777777777777%;
    --c-4: hsla(224, 100%, 66%, 0.2);
    --x-4: 23%;
    --y-4: 79%;
    ;
    background-color: hsla(223, 64%, 20%, 1);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 3 3' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"), radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)), radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)), radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)), radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)), radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4));
    animation: ani-your_css_selector_here 6s linear infinite alternate;
    background-blend-mode: overlay, overlay, overlay, normal, normal, normal;
    will-change: transform, opacity;
    contain: paint
}




body.type-a #top-message .circles li a {
	z-index: 10;
	font-weight: 500;
}
body.type-a #top-message .circles li::before {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0.5;
	border-radius: 500px;
}