/***********************************************************************

------------------------------------------------------------------------
top
***********************************************************************/

/* top > mv
========================================== */

.top-mv {
	background: url(../img/top/bg_mv.png)no-repeat;
	background-size: cover;
	padding: 50px 0;
}

/* top > mv > wrap
========================================== */

.top-mv-wrap {
	display: flex;
	justify-content: center;
	gap: 50px;
	align-items: center;
	padding-left: 15px;
	padding-right: 15px;
}
.top-mv-wrap__side {
	max-width: 340px;
	width: 100%;
}
.top-mv-wrap__main {
	max-width: 800px;
	width: 100%;
}

@media screen and (max-width:1210px) {
	.top-mv-wrap {
		flex-wrap: wrap;
		flex-direction: column-reverse;
	}
	.top-mv-wrap__side {
		display: flex;
		max-width: 800px;
		width: 100%;
		justify-content: space-between;
	}
}
@media screen and (max-width:640px) {
	.top-mv-wrap__side {
		display: block;
		width: 100%;
	}
}

/* top > mv > slider
========================================== */

.top-mv-slider__item {
	box-shadow: 0px 5px 12px 0px rgba(59, 86, 117, 0.11);
	background: #fff;
	border-radius: 5px;
	overflow: hidden;
}
.top-mv-slider-name {
	background: #F8F9F8;
	padding: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.top-mv-slider-name > p {
	font-size: 22px;
	font-weight: bold;
}
.top-mv-slider-name > span {
	color: #379DF6;
	text-align: right;
	background: url(../img/common/ic_blank_bl.svg)no-repeat right center;
	padding-right: 50px;
}
@media screen and (max-width:640px) {
	.top-mv-slider-name {
		display: block;
		padding: 1em;
		text-align: center;
	}
	.top-mv-slider-name > p {
		font-size: 18px;
		text-align: center;
	}
	.top-mv-slider-name > span {
		text-align: center;
		display: inline-block;
		margin-top: 20px;
	}
}



/* top > mv > txt
========================================== */

.top-mv-txt {
	font-size: 16px;
	padding-bottom: 40px;
}
.top-mv-txt em {
	font-size: 22px;
	font-weight: bold;
	color: #379DF6;
	display: block;
}

/* top > mv > link
========================================== */

ul.top-mv-link li+li {
	margin-top: 16px;
}
ul.top-mv-link li a {
	box-shadow: 0px 5px 12px 0px rgba(59, 86, 117, 0.11);
	padding: 1.5em;
	display: block;
	border-radius: 5px;
	font-size: 20px;
	position: relative;
	background: #fff;
}
ul.top-mv-link li a::after {
	position: absolute;
	content: "";
	width: 16px;
	height: 16px;
	border-bottom: 3px solid #379DF6;
	border-right: 3px solid #379DF6;
	display: block;
	transform: rotate(45deg);
	right: 2em;
	top: 50%;
	margin-top: -8px;
}
@media screen and (max-width:1210px) {
	ul.top-mv-link {
		width: 50%;
	}
	ul.top-mv-link li+li {
	}
}
@media screen and (max-width:640px) {
	ul.top-mv-link {
		width: 100%;
	}
}



/* top > text
========================================== */

.top-text-basic {
	font-size: 18px;
	text-align: center;
	line-height: 2;
}
@media screen and (max-width:640px) {
	.top-text-basic {
		font-size: 16px;
	}
}

/* top > about
========================================== */

.top-about {
	background: #EEF4F6;
	padding: 154px 0 130px;
	position: relative;
}
.top-about::after {
	content: "";
	background: url(../img/top/bg_txt_about01.svg)no-repeat;
	width: 600px;
	height: 146px;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}
.top-about::before {
	content: "";
	background: url(../img/top/bg_txt_about02.svg)no-repeat;
	width: 377px;
	height: 146px;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
}
@media screen and (max-width:1210px) {
	.top-about::after {
		width: 100%;
		background-size: 80%;
		background-position: 0 0;
	} 
	.top-about::before {
		width: 100%;
		background-size: 50%;
		background-position: right bottom;
	} 
}


.top-about-btn {
	text-align: center;
	margin-top: 50px;
}

/* top > topicks
========================================== */

ul.top-topics-list {
	display: flex;
	justify-content: center;
	gap: 40px;
	flex-wrap: wrap;
	background: #EEF4F6;
	padding: 50px 0;
}
ul.top-topics-list li {
	width: 440px;
	background: #fff;
	box-shadow: 0px 5px 12px 0px rgba(59, 86, 117, 0.11);
	border-radius: 5px;
	overflow: hidden;
}
ul.top-topics-list li a {
	display: flex;
	padding: 50px;
	font-size: 20px;
	padding-left: 170px;
	position: relative;
}
ul.top-topics-list li:nth-of-type(1) a {
	background: url(../img/top/pic_topic01.png) no-repeat left center;
}
ul.top-topics-list li:nth-of-type(2) a {
	background: url(../img/top/pic_topic02.png) no-repeat left center;
}
ul.top-topics-list li:nth-of-type(3) a {
	background: url(../img/top/pic_topic03.jpg) no-repeat left center;
}
ul.top-topics-list li:nth-of-type(4) a {
	background: url(../img/top/pic_topic04.jpg) no-repeat left center;
}
ul.top-topics-list li a::after {
	content: "";
	width: 24px;
	height: 24px;
	display: block;
	background: url(../img/common/ic_blank_bl.svg)no-repeat;
	position: absolute;
	right: 2em;
	top: 50%;
	margin-top: -12px;
}
@media screen and (max-width:640px) {
	ul.top-topics-list {
		padding: 15px;
		display: block;
	}
	ul.top-topics-list li + li {
		margin-top: 20px;
	}
	ul.top-topics-list li {
		max-width: 100%;
		width: 100%;
	}
	ul.top-topics-list li a {
		font-size: 16px;
		padding: 2em;
		padding-left: 120px;
	}
	ul.top-topics-list li:nth-of-type(1) a ,
	ul.top-topics-list li:nth-of-type(2) a ,
	ul.top-topics-list li:nth-of-type(3) a ,
	ul.top-topics-list li:nth-of-type(4) a {
		background-size: 100px;
	}
	ul.top-topics-list li a::after {
		right: 1.5em;
	}
}

/* top > center
========================================== */

.top-center {
	display: flex;
	justify-content:space-between;
	margin-top: 50px;
}
@media screen and (max-width:1210px) {
	.top-center {
		flex-wrap: wrap;
		justify-content: center;
		gap: 30px;
	}	
}

.top-center .top-center__item {
	overflow: hidden;
	max-width: 389px;
	width: 100%;
}
.top-center .top-center__item a > div {
	text-align: center;
	padding-bottom: 40px;
}
.top-center .top-center__item a p {
	font-weight: bold;
	text-align: center;
	font-size: 25px;
	margin-top: 35px;
	margin-bottom: 50px;
}
.top-center .top-center__item span {
	background: url(../img/common/ic_blank_bl.svg) no-repeat right;
	padding-right: 2em;
	color: #0476D9;
}
@media screen and (max-width:640px) {
	.top-center .top-center__item a p {
		margin-top: 20px;
		margin-bottom: 20px;
		font-size: 20px;
	}
}


/* top > soudan > wrap
========================================== */

.top-soudan {
	margin-top: 60px;
}
.l-flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.l-flex__left {
	max-width: 500px;
	width: 100%;
}
.l-flex__right {
	max-width: calc(100% - 580px);
	width: 100%;
}

@media screen and (max-width:1210px) {
	.l-flex {
		flex-wrap: wrap;
		justify-content: center;
		padding: 15px;
	}
	.l-flex__left {
		max-width: 100%;
		width: 100%;
		text-align: center;
	}
	.l-flex__right {
		max-width: 100%;
		width: 100%;
		text-align: center;
		padding-bottom: 30px;
	}
}

/* top > soudan 
========================================== */

.top-soudan-title {
	font-weight: bold;
	color: #0476D9;
	font-size: 30px;
}
.top-soudan-txt {
	font-size: 20px;
	margin-top: 40px;
}
.top-soudan-txt span {
	font-size: 14px;
}
@media screen and (max-width:1210px) {
	.top-soudan-title {
		text-align: center;
		margin-top: 20px;
	}
	.top-soudan-txt {
		text-align: center;
		margin-top: 20px;
	}
}
@media screen and (max-width:640px) {
	.top-soudan-title {
	}
	.top-soudan-txt {
		font-size: 16px;
	}
}

/* top > map
========================================== */

.top-map {
	margin-top: 80px;
	padding-bottom: 80px;
}

.top-map .l-flex {
	justify-content: center;
}
.top-map .l-flex__right {
	max-width: 413.5px;
	width: 100%;
}
.top-map .l-flex p {
	margin-top: 30px;
	line-height: 2.5;
}

.top-map-item *  {
	font-size: 14px;
}
.top-map-item figcaption {
	text-align: center;
	margin-top: 10px;
}
@media screen and (max-width:1210px) {
	.top-map {
		margin-top: 40px;
		padding-bottom: 40px;
		padding-top: 40px;
	}
	.top-map .l-flex p {
		text-align: center;
		line-height: 2;
	}
}