

/* mv
========================================== */

.mv {
	position: relative;
}
.mv ul {
	margin-left: auto;
}
.mv ul li {
}
.mv ul li img {
	margin-left:auto;
	width: 90%;
}

@media only screen and (max-width: 640px) {
	.mv {
		margin-top: 30px;
	}
	.mv ul li img {
		width: 100%;
	}
}

/* mv > catch
========================================== */

.mv-catch {
	position: absolute;
	z-index: 1000;
	font-size: 30px;
	background: #fff;
	color: #0487D9;
	padding: 0.5em 1em;
	left: 20%;
	top: 10%;
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
@media only screen and (max-width: 640px) {
	.mv-catch {
		font-size: 16px;
		font-family: 'Noto Sans JP', sans-serif;
		top: 3%;
		left: 50%;
		margin-left: -28%;
		font-weight: 700;
	}
}


/* top > section > title
========================================== */

.top-section-title h2 {
	font-size: 30px;
	letter-spacing: 0.1em;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	padding-bottom: 0.2em;
}
.top-section-title.fz__22 {
	font-size: 22px;
}
@media only screen and (max-width: 640px) {
	.top-section-title h2 {
		text-align: center;
	}
}


/* top > about > center
========================================== */
@media only screen and (max-width: 640px) {
	.top-about-center {
		padding-left: 15px;
		padding-right: 15px;
	}
}

/* layout > section > text
========================================== */

.top-section-title + .top-section-text {
	margin-top: 2em;
}
.top-section-text {
	margin-top: 30px;
}
.top-section-text p {
	line-height: 2.5;
	letter-spacing: 0.1em;
}
.top-section-text__fz18 p {
	font-size: 18px;
}
.top-section-text p + p {
	margin-top: 2em;
}

/* top > support
========================================== */

.top-support {
	background: url(../img/common/bg_pt01.svg);
	margin-top: 30px;
	padding-bottom: 50px;
}
.top-support__item {
	width: 50%;
	min-width: 560px;
}
@media only screen and (max-width: 1135px) {
	.top-support__item {
		min-width: 100%;
		width: 50%;
	}
}

.top-support__item:nth-of-type(1) {
	background: url(../img/top/pic-sup01.jpg)no-repeat center top;
	padding-top: 400px;
	background-size:contain;
}
.top-support__item:nth-of-type(2) {
	background: url(../img/top/pic-sup02.jpg)no-repeat center top;
	padding-top: 400px;
	background-size:contain;
}
.top-support__item:nth-of-type(1) .top-support-title h3 {
	border-bottom: 2px solid #E4E9B3;
}
.top-support__item:nth-of-type(2) .top-support-title h3 {
	border-bottom: 2px solid #0476D9;
}
@media only screen and (max-width: 640px) {
	.top-support__item:nth-of-type(1) {
		padding-top: 220px;
		padding-bottom: 20px;
	}
	.top-support__item:nth-of-type(2) {
		padding-top: 220px;
	}
}

/* top > support > title
========================================== */

.top-support-title {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 30px;
	text-align: center;
}
.top-support-title h3 {
	display: inline-block;
}

/* top > support > link
========================================== */

.top-support-link {
	margin-top: 30px;
}
.top-support-link ul {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	align-items: center;
	gap: 20px;
	align-items: stretch;
}
.top-support-link ul li {
	width: 45%;
}
.top-support-link ul li a {
	width: 100%;
	font-size: 20px;
	display: block;
	position: relative;
	height: 100%;
	text-align: center;
	padding:70px 0 60px;
}
.top-support-link ul li a.c-btn--ygreen {
	background:#F8FAE4 url(../img/common/ic_arr_r_yg_cir.svg) center bottom 1em no-repeat;
	background-size: 30px;
}
.top-support-link ul li a.c-btn--skyblue {
	background:#E4F6FD url(../img/common/ic_arr_r_bl_cir.svg) center bottom 1em no-repeat;
	background-size: 30px;
}
.top-support-link ul li a::after {
	content: "";
	width: 80px;
	height: 80px;
	display: block;
	position: absolute;
	top: -20px;
	left: 50%;
	margin-left: -40px;
}
.top-support-link ul li:nth-of-type(1) a.c-btn--ygreen::after {
	background: url(../img/top/ic_book.svg)no-repeat center;
}
.top-support-link ul li:nth-of-type(2) a.c-btn--ygreen::after {
	background: url(../img/top/ic_news.svg)no-repeat center;
}
.top-support-link ul li:nth-of-type(3) a.c-btn--ygreen::after {
	background: url(../img/top/ic_support.svg)no-repeat center;
}
.top-support-link ul li:nth-of-type(4) a.c-btn--ygreen::after {
	background: url(../img/top/ic_contact.svg)no-repeat center;
}
.top-support-link ul li:nth-of-type(1) a.c-btn--skyblue::after {
	background: url(../img/top/ic_board.svg)no-repeat center;
}
.top-support-link ul li:nth-of-type(2) a.c-btn--skyblue::after {
	background: url(../img/top/ic_contact.svg)no-repeat center;
}

@media only screen and (max-width: 767px) {
	.top-support-link ul {
		display: block;
	}
	.top-support-link ul li {
		width: 100%;
	}
	.top-support-link ul li + li {
		margin-top: 10px;
	}
	.top-support-link ul li a {
		padding: 1em 1em 1em 55px;
		text-align: left;
	}
	.top-support-link ul li a::after {
		left: 15px;
		margin-left: 0;
		top:50%;
		margin-top: -15px;
		width: 30px;
		height: 30px;
	}
	.top-support-link ul li a.c-btn--ygreen {
		background:#F8FAE4 url(../img/common/ic_arr_r_yg_cir.svg) center right 1em no-repeat;
	}
	.top-support-link ul li a.c-btn--skyblue {
		background:#E4F6FD url(../img/common/ic_arr_r_bl_cir.svg) center right 1em no-repeat;
	}
	.top-support-link ul li:nth-of-type(1) a.c-btn--ygreen::after ,
	.top-support-link ul li:nth-of-type(2) a.c-btn--ygreen::after ,
	.top-support-link ul li:nth-of-type(3) a.c-btn--ygreen::after ,
	.top-support-link ul li:nth-of-type(1) a.c-btn--skyblue::after ,
	.top-support-link ul li:nth-of-type(2) a.c-btn--skyblue::after {
		background-size: 30px;
	}
}


/* top > news > tabbtn
========================================== */

.top-news-tabbtn {
	margin-top: 20px;
	border-top: 2px solid #000;
	padding-top: 20px;
}
.top-news-tabbtn ul {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.top-news-tabbtn ul li {}

@media only screen and (max-width: 767px) {
	.top-news-tabbtn ul {
		justify-content: center;
	}
}

/* js > tab
========================================== */

button.js-tab-btn {
	background: #fff;
	padding: 0.5em 3em 0.5em 2em;
	font-size: 14px;
	border: 1px solid #ccc;
	position: relative;
	border-radius:5px;
}
.js-tab-btn::after {
	content: "";
	width: 6px;
	height: 6px;
	border-bottom: 2px solid #000;
	border-right: 2px solid #000;
	display: block;
	transform: rotate(45deg);
	right: 1em;
	top: 50%;
	margin-top: -6px;
	position: absolute;
}
.js-tab-btn.show {
	background: #0476D9;
	color: #fff;
}
.js-tab-btn.show::after {
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
}

/* js > tab > item
========================================== */

.tab-item {
	display: none;
}
.tab-item.show {
	display: block;
}

/* news > link
========================================== */

.top-news-link {
	width: 100%;
	max-width: 280px;
}
.top-news-link ul {}
.top-news-link ul li {}
.top-news-link ul li + li {
	margin-top: 20px;
}
.top-news-link ul li a {
	display: block;
	max-width: 280px;
	width: 100%;
	padding: 2em;
	font-size: 20px;
}
.top-news-link ul li a.c-btn--skyblue {
	background: #E4F6FD url(../img/common/ic_arr_r_bl_cir.svg) no-repeat center right 2em;
	background-size: 30px;	
}
.top-news-link ul li a.c-btn--ygreen {
	background: #F8FAE4 url(../img/common/ic_arr_r_yg_cir.svg) no-repeat center right 2em;
	background-size: 30px;
}

@media only screen and (max-width: 767px) {
	.top-news-link {
		width: 100%;
		max-width: 100%;
		margin-top: 30px;
	}
	.top-news-link ul li a {
		max-width: 100%;
		padding: 1.5em;
	}
}

/* top > contact
========================================== */

.top-contact {
	display: flex;
	justify-content: space-between;
}
.top-contact__txt{
	width: calc(100% - 600px);
	display: flex;
	justify-content: center;
	align-items: center;
	background: url(../img/common/bg_pt03_bl.png) no-repeat;
}
@media only screen and (max-width: 1100px) {
	.top-contact {
		display: block;
	}
	.top-contact__txt{
		width: 100%;
		padding: 50px 15px;
	}
	.top-contact figure img {
		width: 100%;
	}
}

/* top > contact > example
========================================== */

ul.top-contact-example {
	display: flex;
	gap: 1em;
	flex-wrap: wrap;
	justify-content: center;
	max-width: 340px;
	width: 100%;
	margin: 1em auto 0;
}
ul.top-contact-example li {
	font-size: 14px;
	background: #E4F6FD;
	color: #0476D9;
	padding: 1em;
}
@media only screen and (max-width: 640px) {
	ul.top-contact-example {
		gap: 0.5em;
	}
	ul.top-contact-example li {
		padding: 0.5em;
	}
}

/* top > related links
========================================== */

.top-related-links {
	padding: 80px 15px 55px;
	margin-left: 15px;
	margin-right: 15px;
}
@media only screen and (max-width: 640px) {
	.top-related-links {
		padding-top: 40px;
	}
	.top-related-links .l-container {
		padding: 0;
	}
}

/* top > library
========================================== */

.top-library {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-top: 30px;
}
.top-library > div {
	width: 48%;
}
@media only screen and (max-width: 767px) {
	.top-library {
		display: block;
	}
	.top-library > div {
		width: 100%;
	}
	.top-library > div + div {
		margin-top: 30px;
	}
}


/* top > section
========================================== */

.top-section {
	padding-top: 80px;
	padding-bottom: 60px;
}
.top-section--p0 {
	padding-top: 0;
	padding-bottom: 0;
}
@media only screen and (max-width: 767px) {
	.top-section {
		padding-top: 40px;
		padding-bottom: 30px;
	}
}


/* top > library
========================================== */

.top-library-link {
	display: block;
	position: relative;
}
.top-library-link::after {
	content: "";
	width: 120px;
	height: 120px;
	display: block;
	position: absolute;
	top: 0;
}
.top-library-link.u-disease::after {
	background: url(../img/common/ic-flat-disease.svg) no-repeat center;
}
.top-library-link.u-heart::after {
	background: url(../img/common/ic-flat-heart.svg) no-repeat center;
}
.top-library-link em {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 30px;
	display: block;
	padding-left: 120px;
}
.top-library-link span {
	font-size: 20px;
	display: block;
	padding-left: 120px;
}
@media only screen and (max-width: 767px) {
	.top-library-link::after {
		width: 40px;
		height: 40px;
	}
	.top-library-link.u-disease::after ,
	.top-library-link.u-heart::after {
		background-size: 40px;
		top: 20px;
	}
	.top-library-link em {
		padding-left: 60px;
	}
	.top-library-link span {
		padding-left: 60px;
		color: #05AFF2;
	}
	.top-library div:nth-of-type(2) .c-list-link{
		margin-top: 30px;
		padding-top: 30px;
		border-top: 1px dashed #00000050;
	}
}

/* top > headline
========================================== */

.top-headline {
	margin-top: 30px;
	padding: 20px;
}
.top-headline__btn {
	display: block;
	background: #fff;
	border: 1px solid #666;
	text-align: center;
	border-radius: 5px;
	font-size: 20px;
	padding: 1em;
	max-width: 800px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.top-headline__btn em {
	background: url(../img/common/ic_pdf_bl.svg) no-repeat right;
	padding-right: 2em;
}

@media only screen and (max-width: 767px) {
	.top-headline {
		padding: 1em;
	}
	.top-headline__btn {
		font-size: 14px;
		text-align-last: left;
	}
	.top-headline__btn em {
		display: block;
	}
}
