/* --------------------------------------------------------------------------------------
   TOP
--------------------------------------------------------------------------------------- */

.key {
	align-self: center;
	display: flex;
	flex-direction: column;
	height: 100vh;
	justify-content: center;
	position: relative;
	width: 100%;
}

.key h1 {
	position: relative;
	z-index: 1;
}

.key h1 strong {
	color: #1e4998;
	display: block;
	font-family: 'Oswald';
	font-size: 10rem;
	font-weight: bold;
	letter-spacing: 0;
	line-height: 1;
	margin-bottom: 38px;
	position: relative;
	z-index: 1;
}

.key h1 span{
	color: #000;
	display: block;
	font-size: 4rem;
	font-weight: normal;
	letter-spacing: .06em;
	line-height: 1;
}

.key-animate-01 { left: 10% !important; }
.key-animate-02 { left: -25% !important; }

.scroll-btn {
	left: 100px;
	position: absolute;
	z-index: 10;
}

.scroll-btn a {
	cursor: pointer;
	display: block;
	font-size: 2rem;
	font-weight: bold;
	letter-spacing: 1px;
	position: relative;
	transform: rotate(90deg);
}

.scroll-btn::before {
	background-color: #111f31;
	content: '';
	height: 80px;
	position: absolute;
	top: 57px;
	width: 1px;
}

.scroll-btn::after {
	background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #111f31 50.5%) no-repeat top left/100% 100%;
	content: '';
	height: 6px;
	position: absolute;
	top: 132px;
	width: 6px;
}

main {
	margin-top: 0;
	position: relative;
	z-index: 1;
}

.lead {
	align-items: end;
	display: block;
	justify-content: space-between;
	padding-top: 190px;
	width: 1050px;
	height: 78vh;
}

.lead h2 {
	font-size: 4rem;
	font-weight: bold;
	letter-spacing: 2px;
	line-height: 1.2;
	display: block;
	margin-bottom: 10rem;
	-moz-text-orientation:inherit;
	-ms-text-orientation:inherit;
	-webkit-text-orientation:inherit;
	text-orientation:inherit;
}

.lead p {
	font-size: 2rem;
	font-weight: bold;
	max-width: 655px;
	display: block;
}

.news {
	margin-top: 200px;
	padding-bottom: 90px;
	position: relative;
}

.news::after {
	background-color: #1e4998;
	bottom: 0;
	content: '';
	height: 53%;
	left: 0;
	position: absolute;
	width: 100%;
}

.news-tab {
	position: relative;
	width: 1280px;
	z-index: 1;
}

.tab-menu-list {
	display: flex;
	margin-left: 523px;
	position: relative;
	z-index: 1;
}

.tab-menu-list li {
	align-items: center;
	background-color: #f2f2f2;
	border-radius: 20px 20px 0 0;
	cursor: pointer;
	display: flex;
	font-size: 2rem;
	font-weight: bold;
	justify-content: center;
	margin-left: 20px;
	min-height: 68px;
	min-width: 260px;
	position: relative;
}

.tab-menu-list li:first-child { margin-left: 0; }

.tab-menu-list .active {
	background-color: #1e4998;
	color: #fff;
}

.tab-menu-list .active::after {
	background:
		linear-gradient(to top right, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top left/50% 100%,
		linear-gradient(to top left, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top right/50% 100%;
	bottom: -6px;
	content: '';
	display: block;
	height: 6px;
	position: absolute;
	width: 10px;
}

.tab-content {
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0,0,0,.15);
	padding: 50px 90px;
	position: relative;
}

.tab-content section { text-align: center; }

.tab-content h2 {
	display: inline-block;
	font-size: 4.4rem;
	font-weight: bold;
	margin-bottom: 40px;
	position: relative;
	text-align: center;
}

.tab-content h2::after {
	background-color: #111f31;
	content: '';
	display: block;
	height: 1px;
	position: absolute;
	right: -45px;
	top: 50%;
	width: 30px;
}

.tab-content .banner a { width: 300px; }

.tab-content .tab-list {
	align-items: center;
	display: none;
	justify-content: space-between;
}

.tab-content .tab-list.active,
.tab-content .tab-list:first-child { display: flex; }

.tab-content .tab-list .post-list {
	border-left: 1px solid #b5b5b5;
	border-top: none;
	margin-top: 0;
	max-width: 720px;
	min-width: 720px;
	padding-left: 45px;
}

.tab-content .tab-list .post-list li:first-child {
	border-top: none;
	margin-top: -24px;
}

.tab-content .tab-list .post-list li a { position: relative; }

.tab-content .tab-list .post-list li a::after {
	background:
		linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top left/100% 50%,
		linear-gradient(to top left, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat bottom right/100% 50%;
	content: '';
	display: block;
	height: 12px;
	position: absolute;
	right: 0;
	top: calc(50% - 4px);
	width: 6px;
}

.ir {
	background-color: #f2f2f2;
	padding: 90px 0;
}

.head {
	font-size: 4.4rem;
	font-weight: bold;
	letter-spacing: 2px;
	position: relative;
	text-align: center;
}

.head::after {
	background-color: #000;
	bottom: -50px;
	content: '';
	display: block;
	height: 30px;
	left: 50%;
	position: absolute;
	width: 1px;
}

.ir ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	left: -25px;
	margin-top: 80px;
	position: relative;
	width: 1130px;
}

.ir li {
	margin-left: 25px;
	width: 200px;
}

.ir li:nth-child(n+6) { margin-top: 40px; }

.ir li a {
	align-items: center;
	background-color: #fff;
	border-radius: 0 20px 0 0;
	box-shadow: 0 0 10px rgb(0,0,0,.15);
	display: flex;
	height: 200px;
	justify-content: center;
	position: relative;
	transition: all .3s ease-in-out;
}

.ir li a::after  {
	background: linear-gradient(to bottom right, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top left / 100% 100%;
	bottom: 8px;
	content: '';
	display: block;
	height: 8px;
	position: absolute;
	right: 8px;
	width: 8px;
}

.ir li a .image {
	position: relative;
	text-align: center;
	width: 100%;
	z-index: 1;
}

.ir li a .image img {
	max-height: 100px;
	width: auto;
}

.ir li a .image-library img { max-height: 97px; }
.ir li a .image-news img { max-height: 96px; }
.ir li a .image-highlight img { max-height: 89px; }
.ir li a .image-calendar img { max-height: 87px; }
.ir li a .image-stock img { max-height: 81px; }
.ir li a .image-governance img { max-height: 96px; }

.ir li a .bg {
	background-repeat: no-repeat;
	height: 100%;
	position: absolute;
	text-align: center;
	transition: all .3s ease-in-out;
	width: 100%;
}
/* ----------------------------------------------------------------
   20240823　日本語用cssとの差分吸収
------------------------------------------------------------------- */
.ir li a .bg-strategy {
	background-image: url(../img/top/icon_strategy_bg.svg);
	background-position: 58% center;
	background-size: 64% auto;
}

.ir li a .bg-message {
	background-image: url(../img/top/icon_message_bg.svg);
	background-position: center 32%;
	background-size: 43% auto;
}

.ir li a .bg-library {
	background-image: url(../img/top/icon_library_bg.svg);
	background-position: center 45%;
	background-size: 65% auto;
}

.ir li a .bg-news {
	background-image: url(../img/top/icon_news_bg.svg);
	background-position: 89% 65%;
	background-size: 34% auto;
}

.ir li a .bg-highlight {
	background-image: url(../img/top/icon_highlight_bg.svg);
	background-position: center 61%;
	background-size: 53% auto;
}

.ir li a .bg-calendar {
	background-image: url(../img/top/icon_calendar_bg.svg);
	background-position: 44% 51%;
	background-size: 69% auto;
}

.ir li a .bg-stock {
	background-image: url(../img/top/icon_stock_bg.svg);
	background-position: 21% 60%;
	background-size: 47% auto;
}

.ir li a .bg-governance {
	background-image: url(../img/top/icon_governance_bg.svg);
	background-position: 58% center;
	background-size: 64% auto;
}

.ir li a .bg-public {
	background-image: url(../img/top/icon_public_bg.svg);
	background-position: 22% 32%;
	background-size: 40% auto;
}

.ir li a .bg-disclosure {
	background-image: url(../img/top/icon_disclosure_bg.svg);
	background-position: 31% 21%;
	background-size: 40% auto;
}


.ir li p {
	font-size: 1.8rem;
	margin: 15px auto 0;
	text-align: center;
}

.ir li .aj { width: 70%; }

.business {
	background-color: #fff;
	padding: 100px 0;
}

.business > p {
	font-size: 1.8rem;
	margin-top: 85px;
}

.business-inner {
	display: flex;
	justify-content: center;
	margin-bottom: 45px;
	margin-top: 70px;
}

.business-inner section {
	border-left: 1px solid #b5b5b5;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	letter-spacing: 1px;
	padding: 20px 25px;
	text-align: center;
	width: 367px;
}

.business-inner section:first-child { border-left: none; }

.business-inner section div {
	align-items: center;
	display: flex;
	min-height: 97px;
}

.business-inner section h3 {
	font-size: 2rem;
	font-weight: bold;
	margin-top: 30px;
}


.business-inner section p {
	margin-top: 30px;
	text-align: left;
}

.company {
	background-color: #f2f2f2;
	padding: 150px 0;
}

.company article {
	padding-left: 550px;
}

.company article h2 {
	display: inline-block;
	text-align: left;
}

.company article h2::after {
	height: 1px;
	left: auto;
	position: absolute;
	right: -52px;
	top: 50%;
	width: 30px;
}

.company article p {
	letter-spacing: 1px;
	margin-top: 30px;
}

.company article ul { margin-top: 40px; }

.company article li { width: 48%; }

.company article li:nth-child(n+3) { margin-top: 17px; }

.company article li a {
	font-size: 1.6rem;
	padding: 20px 0;
	text-align: center;
}

.company article li a::before { display: none; }

/* --------------------------------------------------------------------------------------
   ios用のリンク対策
--------------------------------------------------------------------------------------- */

@media (min-width: 980px) {

	.scroll-btn a:hover { text-decoration: none; }

	.tab-menu-list li:hover {
		background-color: #1e4998;
		color: #fff;
	}

	.tab-menu-list li:hover::after {
		background:
			linear-gradient(to top right, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top left/50% 100%,
			linear-gradient(to top left, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top right/50% 100%;
		bottom: -6px;
		content: '';
		display: block;
		height: 6px;
		position: absolute;
		width: 10px;
	}

	.ir li a:hover {
		box-shadow: 0 10px 30px rgb(0,0,0,.25);
		text-decoration: none;
	}

	.ir li a:hover .bg { transform: scale(1.15); }
}

/* --------------------------------------------------------------------------------------
   laptop PC
--------------------------------------------------------------------------------------- */
@media (max-width: 1280px) {
	.key h1 span{
		font-size: 3.3rem;
	}
	.lead h2{
		font-size: 3.4rem;
		line-height: 1.2;
	}
}

/* --------------------------------------------------------------------------------------
   タブレット
--------------------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	.key h1 span{font-size: 2.4vw;}
}

/* --------------------------------------------------------------------------------------
   スマホ
--------------------------------------------------------------------------------------- */

@media (max-width: 979px) {

	.key h1 strong{font-size: 13.333vw;}

	.key h1 span{font-size: 4.8vw;}

	.scroll-btn {
		bottom: 40vw;
		left: calc(50% - 30px);
	}

	.scroll-btn a { font-size: 3.2vw; }

	.scroll-btn::before {
		height: 21.333vw;
		top: 10vw;
	}

	.scroll-btn::after { top: 30vw; }

	.lead {
		display: block;
		padding: 10.667vw 5.333vw 0;
		width: auto;
		height: 100vh;
	}

	.lead h2 {
		font-size: 5vw;
		letter-spacing: 0;
		line-height: 1.5;
		text-orientation: inherit;
		writing-mode: inherit;
		margin-bottom: 7rem;
	}

	.lead p {
		font-size: 4.267vw;
		font-weight: normal;
		margin-top: 8vw;
	}

	.news {
		margin-top: 26.667vw;
		padding-bottom: 0;
	}

	.news::after { display: none; }

	.news-tab { width: auto; }

	.head { font-size: 8vw; }

	.head::after {
		bottom: -10vw;
		width: .4vw;
	}

	.tab-menu-list {
		margin-left: 0;
		margin-top: 15.467vw;
		padding: 0 1.867vw;
	}

	.tab-menu-list li {
		font-size: 4.8vw;
		margin-left: 2.667vw;
		min-height: inherit;
		min-width: inherit;
		padding: 4.667vw 0;
		width: 100%;
	}

	.tab-menu-list li:first-child { margin-left: 0; }

	.tab-content { 
		margin-top: 15.467vw;
		padding: 7vw 0 0;
	}

	.tab-content section {
		background-color: #1e4998;
		margin-right: 0;
		order: 2;
		padding: 8.667vw 0;
		text-align: center;
		width: 100%;
	}

	.tab-content .banner a {
		background-color: #fff;
		color: #111f31;
		width: 72vw;
	}

	.tab-content .banner a::after { background: linear-gradient(to bottom right, rgba(255,255,255,0) 50%, #111f31 50.5%) no-repeat top left/100% 100%; }

	.tab-content .tab-list {
		flex-wrap: wrap;
	}

	.tab-content .tab-list .post-list {
		border-left: none;
		min-width: inherit;
		padding: 0 5.333vw;
	}

	.tab-content h2 { display: none; }

	.ir,
	.business,
	.company { padding: 14.667vw 0; }

	.ir ul {
		flex-wrap: wrap;
		justify-content: space-between;
		left: auto;
		margin: 18.667vw 5.333vw 0;
		width: auto;
	}

	.ir li {
		background-color: #fff;
		border-radius: 0 20px 0 0;
		box-shadow: 0 0 10px rgb(0,0,0,.15);
		margin-left: 0;
		padding-bottom: 5.333vw;
		position: relative;
		width: 42.667vw;
	}

	.ir li:nth-child(n+3) { margin-top: 4vw; }

	.ir li::after {
		background: linear-gradient(to bottom right, rgba(255,255,255,0) 50%, #1e4998 50.5%) no-repeat top left / 100% 100%;
		bottom: 8px;
		content: '';
		display: block;
		height: 8px;
		position: absolute;
		right: 8px;
		width: 8px;
	}

	.ir li a {
		background-color: transparent;
		box-shadow: none;
		height: 30.133vw;
	}

	.ir li a::after { display: none; }

	.ir li a img {
		display: none;
	}

	.ir li a .image {
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 50% auto;
		height: 100%;
		width: 100%;
	}

	.ir li a .image-message { background-image: url(../img/common/icon_company_message.svg); background-size: 40%; }
	.ir li a .image-individual { background-image: url(../img/common/icon_individual.svg); background-size: 40%; }
	.ir li a .image-strategy { background-image: url(../img/common/icon_strategy.svg); background-size: 45%; }
	.ir li a .image-library { background-image: url(../img/common/icon_library.svg); background-size: 45%; }
	.ir li a .image-news { background-image: url(../img/common/icon_news.svg); }
	.ir li a .image-highlight { background-image: url(../img/common/icon_highlight.svg); background-size: 40%; }
	.ir li a .image-calendar { background-image: url(../img/common/icon_calendar.svg); }
	.ir li a .image-stock { background-image: url(../img/common/icon_stock.svg); }
	.ir li a .image-governance { background-image: url(../img/common/icon_governance.svg); }
	.ir li a .image-public { background-image: url(../img/common/icon_public.svg); }
	.ir li a .image-disclosure { background-image: url(../img/common/icon_disclosure.svg); background-size: 40%; }

	.ir li a .bg { display: none; }

	.ir li p {
		font-size: 3.2vw;
		font-weight: bold;
		margin-top: 0;
	}

	.ir li .aj { width: 58%; }

	.business > p {
		font-size: 3.733vw;
		margin: 17.333vw auto 0;
		width: 80%;
	}

	.business-inner {
		display: block;
		margin: 12vw 5.333vw 0;
	}

	.business-inner section {
		border-left: none;
		border-top: 1px solid #b5b5b5;
		display: block;
		letter-spacing: 0;
		margin-top: 10.667vw;
		padding: 10.667vw 0 0;
		text-align: center;
		width: auto;
	}

	.business-inner section.first{
		border-top: none;
		margin-top: 0;
		padding-top: 0;
	}

	.business-inner section div {
		display: block;
		margin: auto;
		min-height: inherit;
	}

	.business-inner section div img {
		max-height: 20vw;
		width: auto;
	}

	.business-inner section h3 {
		font-size: 4.8vw;
		margin-top: 7.667vw;
	}

	.business-inner section p {
		letter-spacing: -1px;
		margin-top: 4vw;
	}

	.business .banner { margin-top: 13.333vw; }

	.company {
		padding-left: 5.333vw;
		padding-right: 5.333vw;
	}

	.company article { padding-left: 0; }

	.company article h2 {
		display: block;
		text-align: center;
	}

	.company article h2::after {
		height: 30px;
		left: 50%;
		right: auto;
		top: auto;
		width: .4vw;
	}

	.company article p {
		letter-spacing: 0;
		margin-top: 6.667vw;
	}

	.company article p:nth-child(2) { margin-top: 16vw; }

	.company article li:nth-child(n+3) { margin-top: 5.333vw; }

	.company article ul {
		display: block;
		margin-top: 8vw;
	}

	.company article li { width: auto; }

	.company article li a {
		font-size: 4.267vw;
		justify-content: center;
		padding: 5.333vw 0;
	}

	footer{margin-top: 0;}
}