@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/* base
-------------------------------------------------------- */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
	display: block;
}

html {
	line-height: 1;
}

ul,
ol {
	list-style-type: none;
}

table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

caption,
th,
td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}

q,
blockquote {
	quotes: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
	content: "";
	content: none;
}

a img {
	border: none;
}

img {
	vertical-align: bottom;
	border: none;
	max-width: 100%;
	height: auto;
}

img[src*=".svg"] {
	width: 100%;
}

a {
	color: inherit;
	text-decoration: none;
}

*,
:before,
:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

input,
button,
select,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font: inherit;
	border: none;
	border-radius: 0;
	outline: none;
}

textarea {
	resize: vertical;
}

input[type='checkbox'],
input[type='radio'] {
	display: none;
}

input[type='submit'],
input[type='button'],
label,
button,
select {
	cursor: pointer;
}

select::-ms-expand {
	display: none;
}

/* --------------------------------------------------------
	フォントと背景
-------------------------------------------------------- */
/* 変数 */
:root {
	/* 色 */
	--light-blue: #007acc;

	/* ボックスシャドウ */
	--shadow_primary: 0 .5rem 1.2rem -.6rem rgba(0, 0, 0, .2);
	--shadow_secondary: 0 .5rem 1.2rem -.6rem rgba(0, 0, 0, .1);
	/* vwの値をスクロールバーを含めて考慮 */
	--js_windowWidth:100vw;/* JSで書き換え。（ウインドウ幅-スクロールバー）px */
	--js_vw:1vw;/* JSで書き換え。(（ウインドウ幅-スクロールバー）/100)pxで、vwのように使用する。 */
}

html {
	font-size: 62.5%;
}

@media screen and (max-width:1200px){
	html{
		font-size:58.59%;/* 1.6remで15px */
	}
}
@media screen and (max-width:1024px){
	html {
		font-size:54.69%;/* 1.6remで14px */
	}
}
/* 以降、375pxで14pxにしたいので、bodyは1.4remで指定 */
/* font-size100%時、1.4rem=22.4pxなので、XXpx/22.4=目的の％ */
@media screen and (max-width:768px){
	html{
		font-size:calc(2.667*var(--js_vw));/* 375pxで10px 1.4remで14px 2.667vwの代わり */
	}
}

body {
	font-family: "Noto Sans JP", sans-serif;
	color: #000;
	font-size: 1.6rem;
	font-weight: 500;
	background-color: #0fbcd3;
	letter-spacing: 0;
	line-height: 1.75;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 768px) {
	body {
		font-size: 1.4rem;
	}
}


/* フォント */
.bold {
	font-weight: 700;
}

.heavy {
	font-weight: 900;
}

.tal {
	text-align: left;
}

.tac {
	text-align: center;
}

.tar {
	text-align: right;
}

/* 文字色 */
/* 文字サイズ */
.u-fz18 {
	font-size: 1.8rem;
}

@media screen and (max-width: 768px) {
	.u-fz16_sp {
		font-size: 1.6rem;
	}
}

/* --------------------------------------------------------
	リンク
-------------------------------------------------------- */
a {
	color: inherit;
	transition: .5s;
}

.opa:hover {
	opacity: 0.7;
}

.link-primary{
	color: var(--light-blue);
	text-decoration: underline;
}
.link-primary:hover{
	color: inherit;
	text-decoration: underline;
}

::-moz-selection {
	color: #fff;
	background: #34383b;
}

::selection {
	color: #fff;
	background: #34383b;
}

a.hv-under {
	display: inline-block;
	position: relative;
	text-decoration: none;
}

a.hv-under::after {
	content: "";
	position: absolute;
	/* 親要素(a)を基準に配置 */
	bottom: -.25em;
	/* 文字からの距離を調整 */
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #fff;
	opacity: 0;
	/* 最初は隠す */
	transition: all .3s;
}

a.hv-under:hover::after {
	opacity: 1;
	bottom: -.125em;
}

/* テキストリンク
-------------------------------------------------------- */
a.underline,
.article_content a {
	text-decoration: underline;
}

a.underline:hover,
.article_content a:hover {
	text-decoration: none;
	opacity: 1;
}

/* --------------------------------------------------------
	共通
-------------------------------------------------------- */
#en-top {
	letter-spacing: 1px;
}

.dib {
	display: inline-block;
}

.inner {
	width: 94.6%;
	max-width: 1200px;
	margin: 0 auto;
}

.inner.w800 {
	max-width: 800px;
}

.w1060 {
	width: 100%;
	max-width: 1060px;
	margin: 0 auto;
}


@media screen and (max-width: 768px) {
	.inner.is_wide {
		width: 100%;
	}

}

/* iframe */
.iframe {
	position: relative;
}

.iframe.youtube {
	padding-top: 56.25%;
}

.iframe iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}


/* flex */
.flex {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}

.nowrap {
	flex-wrap: nowrap;
}

.fd_c {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
}

.fd_rr {
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	flex-direction: row-reverse;
}

.ai_fs {
	-webkit-box-align: start;
	align-items: flex-start;
}

.ai_fe {
	-webkit-box-align: end;
	align-items: flex-end;
}

.ai_c {
	-webkit-box-align: center;
	align-items: center;
}

.jc_fs {
	-webkit-box-pack: start;
	justify-content: flex-start;
}

.jc_fe {
	-webkit-box-pack: end;
	justify-content: flex-end;
}

.jc_c {
	-webkit-box-pack: center;
	justify-content: center;
}

.jc_sb {
	-webkit-box-pack: justify;
	justify-content: space-between;
}

.jc_sa {
	justify-content: space-around;
}

.order1 {
	-ms-flex-order: 1;
	-webkit-order: 1;
	order: 1;
}

.order2 {
	-ms-flex-order: 2;
	-webkit-order: 2;
	order: 2;
}

/* --------------------------------------------------------
	アニメーション
-------------------------------------------------------- */
.trigger {
	opacity: 0;
}

/* 下から上へ */
.animation.animation01 {
	animation: fadeup .8s ease forwards;
}

/* 左から右へ */
.animation.animation02 {
	animation: faderight .8s ease forwards;
}

/* 右から左へ */
.animation.animation03 {
	animation: fadeleft .8s ease forwards;
}

@keyframes fadeup {
	from {
		opacity: 0;
		transform: translateY(2em);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes faderight {
	from {
		opacity: 0;
		transform: translateX(-2em);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes fadeleft {
	from {
		opacity: 0;
		transform: translateX(2em);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}


/* --------------------------------------------------------
	title
-------------------------------------------------------- */
.t-title-primary{
	color: #333;
	font-size: 3.6rem;
	font-weight: 700;
}
.t-title-primary .en-text {
	display: block;
	line-height: 1.1;
	position: relative;
	z-index: 1;
}

.t-title-primary .en-text .big {
	font-size: 2.22em;
}

.t-title-primary .en-text::before {
	content: "";
	position: absolute;

	/* 位置の調整：ここがポイント！ */
	/* innerの左端から外に出したい分だけマイナスにする */
	left: -.4em;
	bottom: -.6em;
	/* 上下位置はデザインに合わせて微調整 */

	/* 画像のサイズ（添付の黄色オブジェクトのサイズに合わせる） */
	width: 5.56em;
	height: 1.12em;
	background: url(../img/top/bg_title_yellow.svg) no-repeat center/contain;
	
	z-index: -1;
	/* 文字の後ろに回す */
}
.t-title-primary.tac .en-text::before{
	left: 0;
	right: 0;
	margin-inline: auto;
}
.t-title-primary.deco-big .en-text::before{
	width: 8.88em;
	background-image: url(../img/top/bg_title_yellow02.svg);
}
.t-title-primary.deco-most-big .en-text::before{
	width: 12.78em;
	background-image: url(../img/top/bg_title_yellow03.svg);
	bottom: -.2em;
	left: -.2em;
}

.t-title-primary.deco-blue .en-text::before{
	background-image: url(../img/top/bg_title_blue.svg);
}
.t-title-primary.deco-blue.deco-big .en-text::before{
	background-image: url(../img/top/bg_title_blue02.svg);
}

.t-title-primary .jp-text {
	font-size: 1.6rem;
	letter-spacing: .05em;
	padding-left: .33em;
	position: relative;
	z-index: 1;
}

@media screen and (max-width: 768px) {
	.t-title-primary{
		font-size: 2.6rem;
		text-align: center;
	}
	

	.t-title-primary .en-text{
		margin-bottom: .4em;
	}
	.t-title-primary .en-text .big {
		font-size: 2.22em;
	}

	.t-title-primary .en-text::before,
	.t-title-primary.deco-big .en-text::before,
	.t-title-primary.deco-blue .en-text::before,
	.t-title-primary.deco-blue.deco-big .en-text::before{
		width: 7.8em;
		height: 1.54em;
		left: 0;
		right: 0;
		margin-inline: auto;
	}
	.t-title-primary.deco-big .en-text::before{
		background-image: url(../img/top/bg_title_yellow.svg);
	}
	.t-title-primary.deco-blue.deco-big .en-text::before{
		background-image: url(../img/top/bg_title_blue.svg);
	}

	.t-title-primary.deco_sp-big .en-text::before{
		width: 9.6em;
		background-image: url(../img/top/bg_title_yellow02.svg);
	}
	.t-title-primary.deco_sp-big.deco-blue .en-text::before{
		background-image: url(../img/top/bg_title_blue02.svg);
	}

	.t-title-primary.deco-most-big .en-text::before{
		background-image: url(../img/top/bg_title_yellow03sp.svg);
		bottom: -.55em;
	}

	.t-title-primary .jp-text {
		font-size: 1.4rem;
	}

}

/* --------------------------------------------------------
	btn
-------------------------------------------------------- */
.btn_primary{
	color: #333;
	letter-spacing: .05em;
	background-color: #fff;
	max-width: 13.75em;
	min-height: 4.5em;
	display: flex;
	align-items: center;
	margin: 0 auto;
	box-shadow: var(--shadow_primary);
	position: relative;
	padding: .25em 4.1em .25em 2em;
}
.btn_primary:hover{
	box-shadow: none;
	transform: translateY(.25em);
}

.btn_primary .btn-icon{
	width: 3.5em;
	height: 3.5em;
	background-color: #ffe142;
	border-radius: .5em;
	background-image: url(../img/top/icon-btn02.svg);
	background-repeat: no-repeat;
	background-size: 40%;
	background-position: center;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: .5em;
	transition: all 0.5s ease;
}
.btn_primary:hover .btn-icon{
	background-color: var(--light-blue);
	background-image: url(../img/top/icon-btn.svg);
}
@media screen and (max-width: 768px) {
	.btn_primary{
		padding: .25em 4.1em .25em 1em;
	}

	.btn_primary .btn-icon{
		width: 3.22em;
		height: 3.22em;
	}

}

@media screen and (max-width: 480px) {}


/* --------------------------------------------------------
	リスト
-------------------------------------------------------- */

/* --------------------------------------------------------
	テーブル
-------------------------------------------------------- */
@media screen and (max-width: 768px) {}

@media screen and (max-width: 480px) {}

/* --------------------------------------------------------
	余白
-------------------------------------------------------- */

.mb40 {
	margin-bottom: 4rem;
}

.mb50 {
	margin-bottom: 5rem;
}

.mb54 {
	margin-bottom: 5.4rem;
}

.mb60 {
	margin-bottom: 6rem;
}

@media screen and (max-width: 768px) {
	.mb50 {
		margin-bottom: 7rem;
	}
}

@media screen and (max-width: 480px) {
	.mb50 {
		margin-bottom: 4rem;
	}
}

/* --------------------------------------------------------
	PC SP
-------------------------------------------------------- */
.is-sp {
	display: none;
}

@media screen and (max-width: 768px) {
	.is-pc {
		display: none;
	}

	.is-sp {
		display: block;
	}
}


/* --------------------------------------------------------
	その他共通
-------------------------------------------------------- */
.c__bg-white {
	margin-block: -3rem;
	background-color: #f2f2f2;
	border-radius: 3rem;
	position: relative;
	z-index: 15;
}

.c__bg-grada{
	background-image: linear-gradient(0deg, rgba(0, 122, 204, 1) 0%, rgba(15, 188, 211, 1) 100%);
}


/* --------------------------------------------------------
	header
-------------------------------------------------------- */
main{
	padding-top: 10rem;
}

header {
	width: 100%;
	height: 10rem;
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
	padding: 0 5rem;
	position: fixed;
	top: 0;
	left: 0;
	transition: .5s;
	z-index: 50;
	background-color: #0fbcd3;
	box-shadow: var(--shadow_secondary);
}

.is_scroll header {
	height: 8rem;
}

header>div:not(.drawer),
header>nav {
	position: relative;
	z-index: 1;
}

.gnav.pc {
	transition: .5s;
}

.hdr_logo {
	width: 40rem;
}

.gnav.pc {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: end;
	justify-content: flex-end;
	flex: 1 1 auto;
}

.gnav.pc ul {
	display: -webkit-box;
	display: flex;
}

.gnav.pc ul li:not(:last-child) {
	margin-right: 2.5em;
}

.gnav.pc ul li a {
	color: #fff;
}

.hdr_btns {
	width: auto;
	display: -webkit-box;
	display: flex;
	margin: 0 0 0 min(2.8571vw, 40px);
}

.hdr_btns a {
	display: inline-block;
	padding: 5px 15px;
	/* ボタンの余白（お好みで） */
	text-decoration: none;
	transition: all 0.3s;

	/* 未選択時の色 */
	background-color: #fff;
	color: #333;
}
.hdr_btns a:hover{
	color: #fff;
	background-color: var(--light-blue);
}

.hdr_btns a.lg-jp {
	border-top-left-radius: 7px;
	border-bottom-left-radius: 7px;
}

.hdr_btns a.lg-en {
	border-top-right-radius: 7px;
	border-bottom-right-radius: 7px;
}

/* 選択時の色（is-activeクラスがついている時） */
.hdr_btns a.is-active {
	pointer-events: none;
	background-color: var(--light-blue);
	color: #fff;
}

.hdr_links,
.hamb {
	display: none;
	margin: 0 0 0 2px;
}

.drawer {
	/* もし width: 100% や left: 0 が残っていたら、以下に書き換えてください */
	width: fit-content;
	right: 0;

	/* 上から出てくるのを防ぐため、ヘッダーの高さ分下げる */
	top: 10rem;
	/* ヘッダーの高さが60pxの場合 */
	height: calc(100vh - 10rem);

	/* 背景色を「白」にする（参考画像に合わせる） */
	background: #f2f2f2;

	/* アニメーション設定 */
	position: fixed;
	transform: translateX(100%);
	transition: transform 0.5s ease;
	/* visibility: visible; */
	/* opacity: 1; */
	z-index: 5;
	overflow-y: auto;
}
.is_scroll .drawer{
	top: 8rem;
	height: calc(100vh - 8rem);
}

.is_hamb_open .drawer {
	transform: translateX(0);
	/* 右から内側へスライド */
}
@media screen and (min-width: 901px) {
	.is_hamb_open .drawer {
		transform: translateX(100%);
	}
}

.hamb_icon span {
	transition: all 0.3s;
}

.is_hamb_open .hamb_icon span:nth-child(1) {
	top: 50%;
	transform: translateY(-50%) rotate(30deg);
	background-color: #fff;
	/* 開いている時は白（参考画像より） */
}

/* 2本目：消す */
.is_hamb_open .hamb_icon span:nth-child(2) {
	opacity: 0;
}

/* 3本目：右肩上がりの斜め線 */
.is_hamb_open .hamb_icon span:nth-child(3) {
	top: 50%;
	transform: translateY(-50%) rotate(-30deg);
	background-color: #fff;
}

.gnav.sp>ul>li>a {
	color: #333;
	display: block;
	text-align: left;
	font-size: 2rem;
	letter-spacing: .05em;
	margin-top: 1.5em;
}
.gnav.sp>ul>li>a:hover{
	text-decoration: underline;
}

@media screen and (max-width: 900px) {
	header {
		justify-content: space-between;
	}

	header .hdr_btns.pc {
		display: none;
	}

	.hamb {
		cursor: pointer;
		background-color: var(--light-blue);
		width: 6rem;
		height: 6rem;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 15px;
	}

	.gnav.pc {
		display: none;
	}

	.hdr_btns {
		width: 100%;
		margin: 0;
	}

	.hdr_btns a {
		width: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 2rem;
		padding: 0;
		height: 6rem;
		font-weight: 600;
	}

	.hdr_btns .hdr_btn_contact {
		display: none;
	}

	.hamb_icon {
		width: 50%;
		height: 25%;
		position: relative;
	}

	.hamb_icon span {
		width: 100%;
		height: 2px;
		background: #fff;
		display: block;
		position: absolute;
		left: 0;
	}

	.hamb_icon span:nth-child(1) {
		top: 0;
	}

	.hamb_icon span:nth-child(2) {
		top: 50%;
	}

	.hamb_icon span:nth-child(3) {
		top: 100%;
	}


	/* ハンバーガー開閉時 */
	.is_hamb_open {
		overflow: hidden;
	}

	.is_hamb_open .hdr_logo.is-wh a {
		color: #000;
	}

	.is_hamb_open .drawer {
		opacity: 1;
		visibility: inherit;

	}

	.is_hamb_open .drawer .drawer_body {
		box-sizing: border-box;
		width: 100%;
	}

	.drawer .drawer_body {
		padding: 6rem 4rem;
	}

}

@media screen and (max-width: 768px) {
	main{
		padding-top: 7rem;
	}

	header {
		height: 7rem;
		padding: 0 2.5%;
	}

	.is_scroll header {
		height: 6rem;
	}

	.hdr_logo {
		width: calc(96% - 4rem);
		max-width: 29.5rem;
	}

	.drawer {
		top: 7rem;
		height: calc(100vh - 7rem);
	}
	.is_scroll .drawer{
		top: 6rem;
		height: calc(100vh - 6rem);
	}

	.drawer .drawer_body {
		padding: 3.15rem;
	}

	.hdr_btns{
		padding-bottom: .5rem;
	}
	.hdr_btns a {
		font-size: 1.6rem;
		padding: 0;
		height: 4rem;
	}

	.hamb {
		width: 4rem;
		height: 4rem;
		border-radius: 10px;
	}

	.hamb_icon span {
		height: 1px;
	}

	.gnav.sp{
		width: 11.5rem;
	}
	.gnav.sp>ul>li>a {
		font-size: 1.4rem;
		margin-top: 1.5em;
	}

}


/* 背景幕の基本設定 */
.nav_overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 40;
	/* ヘッダー(50)より低く設定 */
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s;
}

/* メニューが開いた時だけ表示 */
.is_hamb_open .nav_overlay {
	opacity: 1;
	visibility: visible;
}

@media screen and (min-width: 901px) {
	.is_hamb_open .nav_overlay {
		opacity: 0;
		visibility: hidden;
	}
}

/* ヘッダー内の要素（ロゴやボタン）は z-index: 50 なので、
   この幕（40）よりも常に手前にあり、クリック可能になります */



/* --------------------------------------------------------
	トップページ
-------------------------------------------------------- */
/* メインビジュアル
-------------------------------------------------------- */
.mv_slider {
	min-width: 0;
	position: relative;
}

.mv_slider::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	/* 画像のサイズに合わせて調整 */
	height: 100%;
	/* 画像のサイズに合わせて調整 */
	background-image: url(../img/top/mv_bg.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 26%;
	/* または cover */

	/* Z軸の重なり順を調整 */
	z-index: 10;
	/* スライダー画像(0)より上、h2(999)より下 */
	pointer-events: none;
	/* 画像がクリックの邪魔をしないように */
}

.mv_slider h2 {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -66%);
	z-index: 11;
	font-weight: 700;
	color: #fff;
	font-size: min(4rem, 2.5vw);
	text-align: center;
	text-shadow: 0px 0px .2em rgba(0, 0, 0, 0.3);
	width: 100%;
	letter-spacing: .1em;
}

/* 外側の枠 */
.ticker-wrap {
	width: 100%;
	overflow: hidden;
	position: absolute;
	bottom: 6.6%;
	z-index: 11;
}

/* アニメーションの設定 */
.ticker-text {
	display: flex;
	line-height: 1.5;
	/* 横並びにし、隙間をなくす */
	width: fit-content;
	animation: ticker 40s linear infinite;
}

/* テキストのスタイル */
/* .mv_slider 内にある想定のセレクタ */
.ticker-text__en {
	font-size: min(12rem, 7.5vw);
	z-index: 11;
	font-weight: 700;
	color: rgba(250, 250, 250, 0.4);
	/* 調整：marginではなくpaddingで間隔を作ると計算がズレにくいです */
	padding-right: 10rem;
	white-space: nowrap;
}

/* 途切れさせないためのアニメーション */
@keyframes ticker {
	0% {
		transform: translateX(0);
	}

	100% {
		/* 中身のspanが2つの場合、全体の半分（-50%）移動した時点で
           1つ目と2つ目が入れ替わり、ループが繋がります。
        */
		transform: translateX(-50%);
	}
}

.swiper.mv_list .swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mv_slider .swiper-controller {
	position: absolute;
	top: 50%;
	right: 1.5%;
	transform: translateY(-50%);
	z-index: 10;
}

.mv_slider .swiper-pagination {
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	position: static;
}

.mv_slider .swiper-pagination .swiper-pagination-bullet {
	width: 20px;
	height: 20px;
	margin: 0;
	background-color: transparent;
	position: relative;
	opacity: 1;
}

.mv_slider .swiper-pagination .swiper-pagination-bullet::before {
	content: "";
	display: block;
	width: 25%;
	height: 25%;
	margin: auto;
	border-radius: 50%;
	background-color: #fff;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.mv_slider .swiper-pagination .swiper-pagination-bullet .ring-path {
	opacity: 0;
	stroke-dasharray: 94;
	/* 円周 */
	stroke-dashoffset: 94;
	/* 初期は全て隠す */
	transform: rotate(-90deg);
	transform-origin: 50% 50%;
}

.mv_slider .swiper-pagination .swiper-pagination-bullet-active .ring-path {
	opacity: 1;
	animation: ring-draw 4s linear forwards;
}

@keyframes ring-draw {
	to {
		stroke-dashoffset: 0;
		/* 最後は全体が描かれる */
	}
}

@keyframes ring-stop {
	to {
		stroke-dashoffset: 94;
		/* 最後は全体が描かれる */
	}
}

@media screen and (max-width: 768px) {
	.mv_slider::before {
		top: 45%;
		background-size: 60%;
	}

	.mv_slider h2 {
		font-size: 6.66vw;
		top: 45%;
	}

	.swiper.mv_list {
		height: 100%;
	}

	.ticker-wrap {
		bottom: 5%;
	}

	.ticker-text__en {
		font-size: calc(120 / 750 * 100vw);
	}
}

@keyframes zoomUp {
	0% {
		transform: scale(1);
	}

	100% {
		transform: scale(1.15);
	}
}

.swiper.mv_list .swiper-slide-active img,
.swiper.mv_list .swiper-slide-duplicate-active img,
.swiper.mv_list .swiper-slide-prev img {
	animation: zoomUp 7s linear 0s normal both;
}

/* --------------------------------------------
NEWS
-------------------------------------------- */

#t-news .inner{
	display: grid;
	grid-template-columns: 16rem calc(96.6% - 16rem);
	justify-content: space-between;
	padding: 6rem 0 10rem;
}

.t-news__list-area{
	padding-top: 2.5rem;
}

#t-news .news-list{
	margin-bottom: 6rem;
}


.news-list__container {
	cursor: pointer;
	--cat_color: #0099ff;
	height: 20rem;
	padding: 2rem 4% 5.5rem;
	margin-bottom: 2.4rem;
	background-color: #fff;
	box-shadow: var(--shadow_primary);
	position: relative;
	transition: color .4s, background-color .4s;
}
.news-list__container:hover{
	color: #fff;
	background-color: var(--light-blue);
}

.news-list__container.is-open{
	cursor: auto;
	height: auto;
}
.news-list__container.is-open:hover{
	color: #000;
	background-color: #fff;
}
.news-list__container .news-list__text {
	font-size: 14px;
}

.news-list__container::before,
.news-list__container::after{
	content: "";
	display: block;
	width: 100%;
	height: 3rem;
	background-image: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(255, 255, 255, 0) 100%);
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1;
	pointer-events: none;
	transition: opacity .4s;
}
.news-list__container::before{
	background-image: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(255, 255, 255, 0) 100%);
}
.news-list__container::after{
	background-image: linear-gradient(0deg,rgba(0, 122, 204, 1) 0%, rgba(0, 122, 204, 1) 25%, rgba(0, 122, 204, 0) 100%);
	opacity: 0;
}
.news-list__container:hover::before{
	opacity: 0;
}
.news-list__container:hover::after{
	opacity: 1;
}

.news-list__container.is-open::before,
.news-list__container.is-open::after{
	opacity: 0 !important;
}

.news-list__container.cat-type__event{
	--cat_color: #f98200;
}
.news-list__container.cat-type__resources{
	--cat_color: #00993d;
}

.news-list__cat{
	letter-spacing: .05em;
	color: #fff;
	writing-mode: vertical-rl;
	padding: 1em .15em;
	border-radius: 0 0 5em 5em;
	background-color: var(--cat_color);
	position: absolute;
	top: -.25em;
	left: calc(4% - 1.1em);
	z-index: 3;
	transition: color .4s, background-color .4s;
}
.news-list__container:hover .news-list__cat{
	color: var(--light-blue);
	background-color: #fff;
}
.news-list__container.is-open:hover .news-list__cat{
	color: #fff;
	background-color: var(--cat_color);
}

.news-list__grid-wrap{
	overflow: hidden;
	display: grid;
	grid-template-columns: 24rem calc(97.4% - 24rem);
	justify-content: space-between;
	align-items: flex-start;
	height: calc(20rem - 2rem);/* containerの高さ - containerの上paddingだけ引く */
}
.is-open .news-list__grid-wrap{
	height: auto;
}

.news-list__thumb{
	grid-row: 1/3;
	aspect-ratio: 3/2;
	position: relative;
	z-index: 2;
}
.news-list__thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.news-list__title-box{
	padding-top: 1rem;
	padding-bottom: .85em;
}

.news-list__date,
.news-list__title{
	font-weight: 700;
	letter-spacing: .05em;
	color: var(--cat_color);
	transition: color .4s;
}
.news-list__container:hover .news-list__date,
.news-list__container:hover .news-list__title{
	color: #fff;
}
.news-list__container.is-open:hover .news-list__date,
.news-list__container.is-open:hover .news-list__title{
	color: var(--cat_color);
}

.news-list__text{
	grid-column: 2/3;
	letter-spacing: .05em;
	color: #333;
	padding-top: .85em;
	border-top: 1px solid var(--cat_color);
	transition: color .4s, border-color .4s;
}
.news-list__container:hover .news-list__text{
	color: #fff;
	border-color: #fff;
}
.news-list__container.is-open:hover .news-list__text{
	color: #333;
	border-color: var(--cat_color);
}

.news-list__text a{
	color: var(--cat_color);
}
.news-list__text a:hover{
	text-decoration: underline;
}
.news-list__text a[target="_blank"]{
	display: inline-block;
}
.news-list__text a[target="_blank"]::after{
	content: "";
	display: inline-block;
	width: .9em;
	height: .9em;
	margin-left: .5em;
	-webkit-mask: url(../img/cmn/icon_blank.svg) no-repeat center/contain;
	mask: url(../img/cmn/icon_blank.svg) no-repeat center/contain;
	background-color: currentColor;
}

.news-list__container__btn{
	pointer-events: none;
	font-size: 1.4rem;
	font-weight: 700;
	color: #fff;
	letter-spacing: .05em;
	width: fit-content;
	padding: .3em 3.3em .3em 1.7em;
	border-radius: 1.2em 1.2em 0 0;
	background-color: #b3b3b3;
	position: absolute;
	bottom: 0;
	left: 50%;
	z-index: 2;
	transform: translateX(-50%);
	transition: background-color .4s;
	opacity: 0;
}
.news-list__container.is-open .news-list__container__btn{
	pointer-events: all;
	opacity: 1;
}
.news-list__container__btn:hover{
	background-color: var(--light-blue);
}


.news-list__container__btn::after{
	content: "";
	display: block;
	width: 1em;
	height: .5em;
	background: url(../img/cmn/news-list_btn_arrow.svg) no-repeat center/contain;
	position: absolute;
	right: 1.5em;
	top: calc(50% - .25em);
}

@media screen and (max-width: 768px) {
	.c__bg-white {
		margin-block: -2rem;
		border-radius: 2rem;
	}

	#t-news .inner{
		display: block;
		padding: 4rem 0 5rem;
	}

	.t-news__list-area{
		padding-top: 1.5rem;
	}

	#t-news .news-list{
		margin-bottom: 3rem;
	}

	.news-list__container{
		height: 12rem;
		padding: 2rem 3.9% 5.5rem;
	}

	.news-list__cat{
		padding: .8em .25em 1.5em;
		left: 0;
	}

	.news-list__grid-wrap{
		grid-template-columns: 12rem calc(96% - 12rem);
		height: calc(12rem - 2rem);/* containerの高さ - containerの上paddingだけ引く */
	}

	.news-list__thumb{
		grid-row: 1/2;
	}
	
	.news-list__title-box{
		padding-top: 0;
		padding-bottom: 0;
	}

	.news-list__text{
		grid-column: 1/3;
		margin-top: 1.25em;
		border-color: transparent;
	}
	.is-open .news-list__text{
		border-color: var(--cat_color);
	}

	.news-list__container__btn{
		font-size: 1.2rem;
	}
}

/* --------------------------------------------
ABOUT
-------------------------------------------- */
#about {
	background: linear-gradient(0deg, rgba(0, 122, 204, 1) 0%, rgba(15, 188, 211, 1) 100%);
	margin-top: -2.4%;
	color: #fff;
	position: relative;
	z-index: 1;
}

#about .inner {
	padding: 14rem 0 19rem;
	background-image: url(../img/top/bg_about.svg);
	background-repeat: no-repeat;
	background-position: top 9% center;
	text-align: center;
}

#about .t-title-primary{
	color: #fff;
	margin-bottom: 1.35em;
}

.t-about__intro-text{
	font-size: 1.8rem;
	letter-spacing: .05em;
}

.concept_flow {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 1000px;
	width: 100%;
	margin: 0 auto 5rem;
}

.flow_item {
	width: 16rem;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: #3a7bc8;
	/* 濃い青 */
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #fff;
	font-weight: 400;
	line-height: 1.6;

	position: relative;
	/* 3本目の線の基準にする */
	margin: 10px;
	/* 外側の線がはみ出さないよう広めに */

	/* --- 1本目と2本目の線 --- */
	border: 4px solid #fff;
	/* 1本目（円のすぐ外） */
	outline: 1px solid rgba(255, 255, 255, .6);
	/* 2本目 */
	outline-offset: 8px;
	/* 1本目と2本目の隙間 */
}

/* --- 3本目の線を追加 --- */
.flow_item::after {
	content: "";
	position: absolute;
	/* outline(2本目)よりもさらに外側に配置 */
	top: -22px;
	left: -22px;
	right: -22px;
	bottom: -22px;
	border: 1px solid rgba(255, 255, 255, .2);
	/* 3本目の線 */
	border-radius: 50%;
	pointer-events: none;
	/* クリックなどを邪魔しない */
}

/* 3つ目の明るい円 */
.flow_item.is-bright {
	background: #0fbcd3;
	/* 明るい青 */
}

/* --- 記号共通 --- */
.flow_sign {
	position: relative;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
}

/* × の作成 */
.is-cross::before,
.is-cross::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 2px;
	background: #fff;
}

.is-cross::before {
	transform: translate(-50%, -50%) rotate(45deg);
}

.is-cross::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.is-arrow {
	display: flex;
	gap: 4px;
	justify-content: center;
}

.is-arrow {
	display: flex;
	justify-content: center;
	align-items: center;
	width: auto;
	/* 幅を自動調整に */
	height: 40px;
	margin-right: 1%;
}

.is-arrow span {
	display: block;
	width: 20px;
	/* > のサイズ */
	height: 20px;
	/* > のサイズ */
	border-top: 2px solid #fff;
	/* > の太さ */
	border-right: 2px solid #fff;
	/* > の太さ */
	transform: rotate(45deg);
	/* 45度回して > の形にする */
	flex-shrink: 0;
}

.is-arrow span+span {
	margin-left: -12px;
	/* この数字を大きく（例：-10px）するともっとくっつきます */
}

#about .inner .concept_flow .flow_text {
	margin-bottom: 0;
	line-height: 1.8;
}

@media screen and (max-width: 768px) {
	#about {
		margin-top: -2rem;
	}

	#about .inner {
		padding: 4rem 0 7rem;
		background-position: top 8% center;
	}

	#about .t-title-primary{
		margin-bottom: 1em;
	}

	.t-about__intro-text{
		font-size: 1.4rem;
		margin-bottom: 2em;
	}

	.concept_flow {
		flex-direction: column;
		width: 100%;
	}

	.flow_item {
		width: 40%;
		margin: 3vw;
	}

	.flow_sign {
		width: 7vw;
		height: 7vw;
	}

	.is-arrow {
		flex-direction: column;
		/* 横幅を固定せず、高さを持たせる（矢印3つ分） */
		width: 40px;
		height: auto;
		margin: -2vw auto 1vw;
		gap: 0;
		/* 重なりを自前で制御するため0に */
	}

	.is-arrow span {
		/* 下向きにするには 135deg で正解です！ */
		transform: rotate(135deg);
		/* PC版の横の重なりをリセット */
		margin-left: 0;
		width: 4vw;
		height: 4vw;
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
	}

	/* 2つ目以降の矢印を上に持ち上げて「重なり」を作る */
	.is-arrow span+span {
		margin-left: 0;
		/* PC版の指定を打ち消し */
		margin-top: -1.5vw;
		/* 上方向にマイナスして重ねる */
	}

	.flow_item {
		outline-offset: 2vw;
	}

	.flow_item::after {
		top: -34px;
		left: -34px;
		right: -34px;
		bottom: -34px;
	}

	.is-cross::before,
	.is-cross::after {
		height: 3px;
	}

}

@media screen and (max-width: 480px) {
	.flow_item {
		width: 40.5vw;
		outline-offset: 3.5vw;
		margin: 3.2vw;
	}

	#about .inner .concept_flow .flow_text {
		margin-bottom: 0;
		font-size: 4.3vw;
	}

	.is-arrow span {
		width: 5.5vw;
		height: 5.5vw;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
	}

	.flow_sign {
		width: 9vw;
		height: 9vw;
	}

	.is-cross::before,
	.is-cross::after {
		height: 2px;
	}

	.is-arrow span+span {
		margin-top: -2vw;
		/* 上方向にマイナスして重ねる */
	}
}


/* --------------------------------------------
ORGANIZATION
-------------------------------------------- */
#about01{
	margin-bottom: 14rem;
}

.t-about02__intro-text{
	letter-spacing: .05em;
	margin-bottom: 6em;
}

.organization-container{
	display: grid;
	grid-template-columns: repeat(3, 32.1%);
	justify-content: space-between;
	padding: 8.2rem 6%;
	margin-bottom: 6rem;
	border-radius: .8rem;
	box-shadow: var(--shadow_primary);
	background-color: #fff;
	position: relative;
}

.organization-container__title{
	font-size: 1.8rem;
	font-weight: 500;
	color: #000;
	letter-spacing: .05em;
	width: fit-content;
	padding: 1.15em 2.3em;
	border: 4px solid #f2f2f2;
	border-radius: .8rem;
	background-color: #fff;
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 1;
	transform: translate(-50%, -50%);
}

.organization-box{
	--box-color: #007acc;
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 2;
	color: #fff;
	position: relative;
	z-index: 1;
}
.organization-box.color02{
	--box-color: #089dd0;
}
.organization-box.color03{
	--box-color: #0fbcd3;
}

.organization-box::before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: var(--box-color);
	opacity: .8;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
}

.organization-box__title{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	text-align: center;
	min-height: 4.5em;
	padding: .25em .1em;
	background-color: var(--box-color);
}
.organization-box__text{
	text-align: left;
	padding: 1.5em 8%;
}


@media screen and (max-width: 768px) {
	#about01{
		margin-bottom: 6rem;
	}

	.t-about02__intro-text{
		margin-bottom: 4.5em;
	}

	.organization-container{
		display: block;
		padding: 4.5rem 5% 3.5rem;
		margin-bottom: 3rem;
		border-radius: .4rem;
	}

	.organization-container__title{
		font-size: 1.6rem;
		width: fit-content;
		padding: .75em 1em;
		border-width: .2rem;
		border-radius: .4rem;
		left: calc(50% - (19.36em / 2));
		/* transformで横位置調整しようとすると文字折り返すので、要素の大きさを実際に測って（19.36em）、2分の1をleft50%から引いた。 */
		top: 0;
		z-index: 1;
		transform: translate(0, -50%);
	}

	.organization-box{
		margin-bottom: 2rem;
	}
	.organization-box:nth-last-of-type(1){
		margin-bottom: 0;
	}

	.organization-box__title{
		font-size: 1.6rem;
		min-height: 3.12em;
		padding: .15em;
	}
	.organization-box__text{
		padding: 1em 4% 1.25em;
	}

}

/* --------------------------------------------
MORE
-------------------------------------------- */
#more {
	padding: 18rem 0 15rem;
	margin-top: -3rem;
	background: url(../img/top/bg_more.jpg) no-repeat center/cover;
	position: relative;
	z-index: 1;
}

.more-btn__wrap{
	display: flex;
	justify-content: space-between;
	width: 94.6%;
	max-width: 1120px;
	margin-inline: auto;
}

.more-btn{
	display: flex;
	align-items: center;
	font-weight: 700;
	color: #333;
	width: 48.4%;
	max-width: 52rem;
	min-height: 20rem;
	padding: 1rem calc(5.6rem + 3.5%) 1rem 4.4%;
	box-shadow: var(--shadow_primary);
	background-color: rgba(255,255,255,.8);
	position: relative;
}
.more-btn:hover{
	box-shadow: none;
	transform: translateY(.75rem);
}

.more-btn01{
	font-size: 3.6rem;
}
.more-btn01 .is-big{
	font-size: 2em;
	line-height: 1.2;
}
.more-btn02{
	font-size: 2.2rem;
	letter-spacing: .05em;
}

.more-btn::before,
.more-btn::after{
	content: "";
	display: block;
	width: 5.6rem;
	height: 5.6rem;
	border-radius: .8rem;
	position: absolute;
	right: 7.5%;
	top: calc(50% - 2.8rem);
	transition: background-color .4s;
}

.more-btn::before{
	background-color: #ffe142;
	z-index: 1;
}
.more-btn:hover::before{
	background-color: var(--light-blue);
}

.more-btn::after{
	mask: no-repeat center/36%;/* 20px/56px */
	background-color: #333;
	z-index: 2;
}
.more-btn:hover::after{
	background-color: #fff;
}

.more-btn01::after{
	mask-image: url(../img/top/icon-btn02.svg);
}
.more-btn02::after{
	mask-image: url(../img/cmn/icon_blank.svg);
}

.more-btn > p{
	position: relative;
	z-index: 1;
}
.more-btn01 > p{
	padding-bottom: .6em;
}
.more-btn01 > p::before{
	content: "";
	display: block;
	width: 7.67em;
	height: 1.12em;
	background: url(../img/top/bg_title_yellow02.svg) no-repeat center/contain;
	position: absolute;
	bottom: .45em;
	left: -.25em;
	z-index: -1;
}

@media screen and (max-width: 768px) {
	#more {
		margin-top: -2rem;
		padding: 11.5rem 0 9.5rem;
	}


	.more-btn__wrap{
		display: block;
		width: 86.7%;
	}

	.more-btn{
		width: 100%;
		max-width: none;
		min-height: 12rem;
		padding: 1rem calc(4.5rem + 6.3%) 1rem 8.8%;
		margin-bottom: 2rem;
	}
	.more-btn__wrap .more-btn:nth-last-of-type(1){
		margin-bottom: 0;
	}

	.more-btn:hover{
		transform: translateY(.5rem);
	}

	.more-btn01{
		font-size: 2.6rem;
	}
	.more-btn01 .is-big{
		font-size: 2.14em;
	}
	.more-btn02{
		font-size: 1.6rem;
	}

	.more-btn::before,
	.more-btn::after{
		width: 4.5rem;
		height: 4.5rem;
		right: 6.2%;
		top: calc(50% - 2.25rem);
	}

}

/*-------------------------------------------------
フッター
-----------------------------------------------  */
footer {
	margin-top: -3rem;
	color: #fff;
	background-image: url(../img/top/bg_footer.svg),
		linear-gradient(0deg, rgba(15, 188, 211, 1) 0%, rgba(0, 122, 204, 1) 100%);
	background-repeat: no-repeat;
	background-position: left 0 bottom 0;
	background-size: 59%, 100%;
}

footer .inner {
	padding: 13.5rem 0 .5rem;
}

footer .inner .flex {
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8.5rem;
}

footer .inner .left-wrapper {
	width: 34%;
}

.ft-logo{
	display: block;
}

footer .inner .left-wrapper a img {
	display: block;
}

footer .flex .right-wrapper ul.flex {
	margin-bottom: 0;
}

footer .flex .right-wrapper ul.flex li {
	margin-right: 2.5em;
	letter-spacing: .05em;
}

footer .flex .right-wrapper ul.flex li:last-child {
	margin-right: 0;
}

footer .flex .right-wrapper ul.flex li a.link-icon {
	position: relative;
}

footer .flex .right-wrapper ul.flex li a.link-icon::after {
	content: '';
	width: .8em;
	height: .8em;
	background-image: url(../img/top/icon-link.svg);
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	margin-left: 6px;
}

#copyright {
	color: #fff;
	text-align: right;
	font-size: 14px;
}

@media screen and (max-width: 1200px) {
	footer .inner .right-wrapper {
		padding-right: 2%;
	}
}
@media screen and (max-width: 860px) {
	footer .flex .right-wrapper ul.flex li {
		margin-right: 0;
		width: 48.4%;
	}
}


@media screen and (max-width: 768px) {
	footer {
		margin-top: -2rem;
		background-size: 100%, 100%;
	}

	footer .inner {
		padding: 8rem 0 .75rem;
	}


	footer .inner .flex {
		display: block;
		margin-bottom: 0;
	}

	footer .inner .left-wrapper {
		width: 100%;
		margin-bottom: 2rem;
	}

	.ft-logo{
		width: 29.5rem;
		margin: 0 auto;
	}

	footer .inner .right-wrapper {
		width: 100%;
	}

	footer .flex .right-wrapper ul.flex li {
		font-size: 1.4rem;
		text-align: center;
		width: 100%;
		margin: 0 0 1.3em;
	}
	footer .flex .right-wrapper ul.flex li:nth-last-of-type(1){
		margin-bottom: 0;
	}

	#copyright {
		text-align: center;
		font-size: 3.2vw;
		line-height: 1;
	}

	#copyright {
		font-size: 1.2rem;
		line-height: 1.75;
		margin-top: 4.5em;
	}
}

/* --------------------------------------------------------
	下層共通
-------------------------------------------------------- */
#content-mv {
	padding-bottom: 5rem;
	background-image: url(../img/cmn/bg_mv.svg), linear-gradient(0deg, rgba(0, 122, 204, 1) 0%, rgba(15, 188, 211, 1) 100%);
	background-repeat: no-repeat;
	background-size: 50%, 100%;
	background-position: center bottom 30%, center;
	position: relative;
}

.content-mv__title-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 25.5rem;
	padding: 1rem 0;
}
.content-mv__title {
	font-size: 3.6rem;
	font-weight: 700;
	color: #fff;
	text-align: center;
	padding-top: .75em;
}

.content-mv__title .en-text {
	line-height: 1.2;
}

.content-mv__title .en-text .big {
	font-size: 2.22em;
}

.content-mv__title .jp-text{
	font-size: .445em;
	letter-spacing: .05em;
}

#breadcrumb {
	width: 94.6%;
	max-width: 1200px;
	margin: 0 auto;
}

#breadcrumb ul > li {
	color: #fff;
	font-size: 1.4rem;
	letter-spacing: .05em;
}

#breadcrumb ul > li::after {
	content: '';
	display: inline-block;
	background-image: url(../img/cmn/icon_breadcrumb.svg);
	background-repeat: no-repeat;
	width: .8rem;
	height: .8rem;
	margin: 0 1.2em;
}

#breadcrumb ul > li:last-child::after {
	content: none;
}

#breadcrumb ul > li a {
	text-decoration: underline;
}
#breadcrumb ul > li a:hover{
	text-decoration: none;
}


@media screen and (max-width: 768px) {
	#content-mv {
		padding-bottom: 3rem;
	}
	.content-mv__title-wrap{
		min-height: 10rem;
	}
	.content-mv__title {
		font-size: 2.6rem;
		line-height: 1.2;
		padding-top: 0;
	}

	.content-mv__title .jp-text{
		font-size: .54em;
		line-height: 1;
	}

	#breadcrumb{
		width: 86.6%;
	}
	#breadcrumb ul > li {
		font-size: 1.2rem;
	}

	#breadcrumb ul li::after {
		width: 1.1rem;
		height: 1.1rem;
		margin: 0 1em;
	}
}



/* 下層セクションタイトル
-------------------------------------------------------- */
.lower-sec__title{
	font-size: 2.8rem;
	text-align: center;
	line-height: 1.5;
	letter-spacing: .05em;
	padding-bottom: .75em;
	position: relative;
}
.lower-sec__title.white{
	color: #fff;
}
.lower-sec__title::after{
	content: "";
	display: block;
	width: 1.44em;
	height: .286em;
	background-color: #ffe142;
	position: absolute;
	left: calc(50% - .72em);
	bottom: 0;
}


@media screen and (max-width: 768px) {
	.lower-sec__title{
		font-size: 2rem;
	}
}


/* --------------------------------------------------------
	SIGLとは
-------------------------------------------------------- */
#about-overview {
	padding: 11rem 0 15rem;
	background-image: url(../img/about/bg_sec01.svg);
	background-repeat: no-repeat;
	background-position: top 70% center;
	background-size: 75%;
}

.about-overview__text{
	letter-spacing: .05em;
	margin-top: 2em;
}


@media screen and (max-width: 768px) {
	#about-overview {
		padding: 5rem 0;
		background-position: top 8% center;
		background-size: 92%;
	}

	#about-overview .inner{
		width: 86.6%;
	}
}

/* --------------------------------------------------------
	SIGLのミッション
-------------------------------------------------------- */
#about-mission{
	padding: 12rem 0 13rem;
}

.about-mission__list{
	display: grid;
	grid-template-columns: repeat(4, 23.4%);
	justify-content: space-between;
	margin-top: 4.5rem;
}

.about-mission__list > li{
	display: inherit;
    grid-template-rows: subgrid;
    grid-row: span 2;/* パーツの数 */
	padding: 1rem 3.6% 1.8rem;
	background-color: #fff;
	position: relative;
}

.about-mission__list-num{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2.4rem;
	width: 2.5em;
	height: 2.5em;
	border-radius: 0 0 .34em .34em;
	background-color: #ffe142;
	position: absolute;
	left: 7.2%;
	top: -.4rem;
	z-index: 1;
}

.about-mission__list-thumb img{
	width: 100%;
}

.about-mission__list-title{
	text-align: center;
	letter-spacing: .05em;
	line-height: 1.6;
	margin-top: .75em;
}
.about-mission__list-title .is-big{
	display: inline-block;
	font-size: 1.5em;
	letter-spacing: .05em;
	padding-inline: .25em;
	background-image:linear-gradient(transparent 75%,#ffe142 75%);
}
.about-mission__list-title .marker{
	background-image:linear-gradient(transparent 75%,#ffe142 75%);
}

@media screen and (max-width: 768px) {
	#about-mission{
		padding: 8rem 0;
	}

	.about-mission__list{
		display: block;
		margin-top: 3rem;
	}

	.about-mission__list > li{
		margin-bottom: 2.5rem;
	}
	.about-mission__list > li:nth-last-of-type(1){
		margin-bottom: 0;
	}

	.about-mission__list-title{
		font-size: 1.6rem;
	}
}

/* --------------------------------------------------------
	SIGLの組織体制について
-------------------------------------------------------- */
#about-organization{
	padding: 11.5rem 0 8rem;
}

#about-organization .lower-sec__title{
	margin-bottom: .85em;
}
.about-organization__guidance{
	text-align: center;
	letter-spacing: .05em;
	margin-bottom: 6em;
}

#about-organization .organization-container{
	margin-bottom: 0;
}

@media screen and (max-width: 768px) {
	#about-organization{
		padding: 5rem 0 3rem;
	}

	.about-organization__guidance{
		margin-bottom: 4em;
	}
}

/* --------------------------------------------------------
	メンバー紹介
-------------------------------------------------------- */
#about-member{
	padding: 7.25rem 0 16rem;
}

#about-member .lower-sec__title{
	margin-bottom: 2.5em;
}

.member-container{
	padding: 8.2rem 6%;
	border-radius: .8rem;
	box-shadow: var(--shadow_primary);
	background-color: #fff;
	position: relative;
}

.member-container__title{
	font-size: 1.8rem;
	font-weight: 500;
	color: #000;
	letter-spacing: .05em;
	text-align: center;
	width: min(22.22em, 96%);
	padding: 1.15em;
	border: 4px solid #f2f2f2;
	border-radius: .8rem;
	background-color: #fff;
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 1;
	transform: translate(-50%, -50%);
}

@media screen and (max-width: 768px) {
	#about-member{
		padding: 3rem 0 5.5rem;
	}


	#about-member .lower-sec__title{
		margin-bottom: 4em;
	}

	.member-container{
		padding: 4.5rem 5% 3.5rem;
		border-radius: .4rem;
	}

	.member-container__title{
		font-size: 1.6rem;
		padding: .75em 1em;
        border-width: .2rem;
        border-radius: .4rem;
	}

}


/* コンテナ中身
-------------------------------------------------------- */
.member-wrap__title{
	font-size: 1.8rem;
	color: #fff;
	text-align: center;
	letter-spacing: .05em;
	line-height: 1.5;
	padding: 1.5em 2%;
	background-color: var(--light-blue);
}
.member-box{
	display: flex;
	justify-content: center;
	align-items: flex-start;
}

.member-thumb{
	width: 15rem;
	margin-right: 4%;
}
.member-thumb img{
	width: 100%;
}

.member-name__group{
	width: fit-content;
}
.member-post{
	font-size: 1.4rem;
	color: #fff;
	letter-spacing: .05em;
	width: fit-content;
	padding: .25em .75em;
	margin-bottom: .75em;
	background-color: var(--light-blue);
}
.member-name{
	font-size: 1.8rem;
	color: #fff;
	letter-spacing: .05em;
}

@media screen and (max-width: 768px) {
	.member-wrap__title{
		font-size: 1.6rem;
	}

	.member-box{
		align-items: center;
		justify-content: flex-start;
	}

	.member-thumb{
		width: 12rem;
		margin-right: 6%;
	}
	.member-name__group{
		width: calc(94% - 12rem);
	}

	.member-post{
		font-size: 1.2rem;
	}
	.member-name{
		font-size: 1.6rem;
	}
}


/* 機構長の欄 */
.member__director-wrap{
	display: grid;
	grid-template-columns: repeat(2, 49.1%);
	justify-content: space-between;
	margin-top: 4rem;
}
.member__director-wrap .member-box{
	padding: 3rem 6.5% 3rem 2%;
	background-color: #f2f2f2;
	position: relative;
}

.member__director-wrap .member-thumb{
	width: 22.5rem;
	margin-right: 6%;
	margin-top: -6.5rem;
}

.member__director-wrap .member-name__group{
	padding-top: 4rem;
}
.member__director-wrap .member-name{
	color: var(--light-blue);
}


@media screen and (max-width: 840px) {
	.member__director-wrap .member-thumb{
		width: 20rem;
	}
}

@media screen and (max-width: 768px) {
	.member__director-wrap{
		display: block;
		margin-top: 5rem;
	}

	.member__director-wrap .member-box{
		align-items: flex-start;
		padding: 2.5rem 4%;
		margin-bottom: 6rem;
	}
	.member__director-wrap .member-box:nth-last-of-type(1){
		margin-bottom: 0;
	}

	.member__director-wrap .member-thumb{
		width: 14rem;
	}
	.member__director-wrap .member-name__group{
		padding-top: 0;
	}
}


/* 国際連携部門の欄 */
.member__department01-wrap{
	margin-top: 3.5rem;
}

.member__department01__box-group,
.member__department02__box-group{
	display: grid;
	grid-template-columns: 33.2% 27.4% 39.4%;
	justify-content: center;
	padding: 3.25rem 3%;
}
.member__department01__box-group {
	background-color: rgba(0,122,204,.8);
}
.member__department02__box-group {
	background-color: rgba(8,157,208,.8);
}	

.member__department01-wrap .member-name__group{
	padding-top: 3.8rem;
}



@media screen and (max-width: 1240px) {
	.member__department01-wrap .member-post{
		letter-spacing: 0;
	}
}


@media screen and (max-width: 1140px) {
	.member__department01__box-group,
	.member__department02__box-group{
		grid-template-columns: repeat(2, 48.4%);
		row-gap: 3rem;
	}

	.member__department01-wrap .member-box:nth-of-type(3){
		grid-column: 1/3;
	}

	.member__department01-wrap .member-post{
		letter-spacing: .05em;
	}
}


@media screen and (max-width: 768px) {
	.member__department01__box-group,
	.member__department02__box-group{
		display: block;
		padding: 3rem 0;
	}

	.member__department01-wrap .member-box{
		padding: 0 4%;
		margin-bottom: 3rem;
		position: relative;
	}
	.member__director-wrap .member-box:nth-last-of-type(1){
		margin-bottom: 0;
	}

	.member__department01-wrap .member-name__group{
		padding-top: 0;
	}


}

/* 部門長 */
.member__department02-wrap{
	/*width: min(34rem, 50%);*/
	margin: 4rem auto 0;
}
.member__department02-wrap .member-wrap__title{
	background-color: #089dd0;
}



.member__department02-wrap .member-name__group{
	padding-top: 3.5rem;
}

@media screen and (max-width: 768px) {
	.member__department02-wrap{
		width: 100%;
		margin-top: 3.5rem;
	}

	.member__department02-wrap .member-box{
		padding: 3rem 4%;
	}

	.member__department02-wrap .member-name__group{
		padding-top: 0;
	}
}

/* --------------------------------------------
	NEWS
-------------------------------------------- */
#news-section{
	padding: 8.5rem 0 10rem;
}

.column2-area{
	display: grid;
	grid-template-columns: 20rem calc(96.7% - 20rem);
	justify-content: space-between;
	align-items: flex-start;
	width: 94.6%;
	max-width: 1200px;
	margin-inline: auto;
}


@media screen and (max-width: 768px) {
	#news-section{
		padding: 4rem 0 5.5rem;
	}

	.column2-area{
		display: block;
	}

}


/* サイドバー
-------------------------------------------------------- */
.news-aside{
	padding: 2.25rem 10%;
	box-shadow: var(--shadow_primary);
	background-color: #fff;
	position: -webkit-sticky;
	position: sticky;
	top: 12rem;
}

.news-aside__wrap{
	margin-bottom: 2rem;
}
.news-aside__wrap:nth-last-of-type(1){
	margin-bottom: 0;
}

.news-aside__wrap-title{
	color: #333;
	text-align: center;
}

@media screen and (min-width: 769px) {
	.news-aside__acc-item__wrap{
		display: block !important;
	}
}

.news-aside__cat-list,
.news-aside__archive-list{
	padding-top: .6rem;
}

.news-aside__archive-list{
	display: grid;
	grid-template-columns: repeat(2, 47.5%);
	justify-content: space-between;
	row-gap: 1rem;
}

.news-aside__cat-list > li{
	margin-bottom: 1rem;
}
.news-aside__cat-list > li:nth-last-of-type(1){
	margin-bottom: 0;
}


.news-aside__cat,
.news-aside__archive-link{
	display: flex;
	justify-content: center;
	align-items: center;
	--cat-color: var(--light-blue);
	font-size: 1.4rem;
	letter-spacing: .05em;
	color: #999;
	padding: .225em .5em;
	border-radius: 5em;
	background-color: #f2f2f2;
	transition: color .4s, background-color .4s;
}
.news-aside__cat.is-active, .news-aside__cat:hover,
.news-aside__archive-link.is-active, .news-aside__archive-link:hover{
	color: #fff;
	background-color: var(--cat-color);
}

.news-aside__cat.cat-type__news{
	--cat-color: #0099ff;
}
.news-aside__cat.cat-type__event{
	--cat-color: #f98200;
}
.news-aside__cat.cat-type__resources{
	--cat-color: #00993d;
}

@media screen and (max-width: 768px) {
	.news-aside{
		padding: .85rem 4.5%;
		margin-bottom: 3.3rem;
		box-shadow: var(--shadow_primary);
		background-color: #fff;
		position: static;
		top: auto;
	}

	.news-aside__wrap{
		margin-bottom: 0;
		border-bottom: 1px solid #f2f2f2;
	}
	.news-aside__wrap:nth-last-of-type(1){
		border: none;
	}

	.news-aside__wrap-title{
		cursor: pointer;
		text-align: left;
		padding: .6em calc(5.6% + .8em) .6em 5.6%;
		position: relative;
		transition: background-color .4s;
	}

	.news-aside__wrap-title::after{
		content: "";
		display: block;
		width: .8em;
		height: .8em;
		background: url(../img/cmn/acc-arrow.svg) no-repeat center/contain;
		position: absolute;
		right: 6%;
		top: calc(50% - .4em);
		transition: top .4s;
	}
	.news-aside__wrap-title:hover::after{
		top: calc(50% - .3em);
	}
	.news-aside__wrap-title.is-open::after{
		transform: scale(1,-1);
	}

	.news-aside__acc-item__wrap{
		display: none;
	}
	.news-aside__acc-item__wrap.is-open{
		display: block;
	}

	.news-aside__cat-list{
		display: grid;
		grid-template-columns: repeat(2, 49%);
		justify-content: space-between;
		row-gap: .8rem;
		padding-top: .75rem;
		padding-bottom: 2.5rem;
	}

	.news-aside__archive-list{
		grid-template-columns: repeat(4, 24%);
		row-gap: .8rem;
		padding-top: .75rem;
		padding-bottom: 2.5rem;
	}

	.news-aside__cat-list > li{
		margin-bottom: 0;
	}

	.news-aside__cat,
	.news-aside__archive-link{
		font-size: 1.2rem;
		padding: .75em .5em;
	}
}


/* お知らせ一覧
-------------------------------------------------------- */


@media screen and (max-width: 768px) {

}


/* ページャー
-------------------------------------------------------- */
#pager{
	display: flex;
	justify-content: center;
	width: fit-content;
	max-width: 100%;
	padding: 1em;
	margin: 4em auto 0;
	box-shadow: var(--shadow_primary);
	background-color: #fff;
}

#pager > a,
#pager > span{
	display: flex;
	align-items: center;
	justify-content: center;
	color: #333;
	width: 3.5em;
	height: 3.5em;
	margin-inline: .1em;
	border-radius: .5em;
	transition: color .4s, background-color .4s;
}

#pager > .current,
.previouspostslink, .nextpostslink{
	background-color: #ffe142;
}

#pager > a:hover{
	color: #fff;
}
#pager > a:hover, .previouspostslink:hover, .nextpostslink:hover{
	background-color: var(--light-blue);
}

.previouspostslink::before, .nextpostslink::before{
	content: "";
	display: block;
	width: 1.25em;
	height: 1.25em;
	-webkit-mask: url(../img/top/icon-btn02.svg) no-repeat center/contain;
	mask: url(../img/top/icon-btn02.svg) no-repeat center/contain;
	background-color: #333;
	transition: background-color .4s;
}
.previouspostslink::before{
	transform: scale(-1, 1);
}

.previouspostslink:hover::before, .nextpostslink:hover::before{
	background-color: #fff;
}

@media screen and (max-width: 768px) {
	#pager{
		padding: .72em;
		margin: 2em auto 0;
	}
}



/* --------------------------------------------

-------------------------------------------- */


@media screen and (max-width: 768px) {

}


/* 
-------------------------------------------------------- */


@media screen and (max-width: 768px) {

}



/* --------------------------------------------

-------------------------------------------- */


@media screen and (max-width: 768px) {

}


/* 
-------------------------------------------------------- */


@media screen and (max-width: 768px) {

}



/* --------------------------------------------

-------------------------------------------- */


@media screen and (max-width: 768px) {

}


/* 
-------------------------------------------------------- */


@media screen and (max-width: 768px) {

}