@charset "utf-8";
/*----------------------------
	conversation_interview
	/earth_open.html

	created: 2024.05.01
	updated: 2026.1.7
-----------------------------*/

header div.globalNav {
	padding: 0 30px 0 40px;
}

header div.globalNav h1,
header div.globalNav h1 a {
	height: 93px;
}

header div.globalNav h1 a img {
	height: 93px;
	padding: 10px 15px;
}

header div.globalNav ul {
	padding: 10px 0;
}


.main {
	background-color: white;
	padding: 50px 100px;
}

.topImg {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 30px 100px 80px;
	gap: 60px;
}

.topImg div {
	display: flex;
	align-items: center;
	max-width: 35%;
}

.topImg img.earth {
	width: 150px;
	flex-basis: 150px;
}

.topImg a {
	max-width: 35%;
	display: block;
	text-decoration: none;
}

.topImg a figure img {
	border: 2px solid dimgray;
	border-radius: 10px;
}

.topImg a figure figcaption {
	margin-top: 10px;
	text-align: center;
}

.main h1 {
	font-family: "Shin Go Bold", sans-serif;
	font-size: 1.25rem;
	background-color: lightgray;
	color: black;
	padding: 5px 20px;
	text-align: center;
	margin-bottom: 50px;
}

.contents {
	display: flex;
	flex-wrap: wrap;
	gap: 30px 15px;
}

.contents div.blankBox {
	display: none;
}

.mediaBox {
	width: 284px;
	border-radius: 8px;
	border: 1px solid lightgray;
	box-shadow: 1px 1px 7px lightgray;
	padding-bottom: 15px;
}

.mediaBox img {
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}

.mediaBox h2,
.mediaBox h3,
.mediaBox p {
	padding-left: 15px;
	padding-right: 15px;
	font-family: 'BIZ UDPGothic', sans-serif;
	font-weight: 700;
}

.mediaBox h2 {
	padding-top: 15px;
}

.mediaBox h3 {
	margin-bottom: 1rem;
}

.mediaBox a {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: #333;
	text-decoration: none;
}

.mediaBox a:hover {
	opacity: 0.8;
}

/*.mediaBox a p.name {
	margin-top: auto;
}*/

.mediaBox a p.center {
    padding-left: 5em;
}

/* - laptop - */
@media screen and (min-width: 1025px) and (max-width: 1400px) {
	
	.main {
		padding: 50px;
	}

	.topImg {
		padding: 30px 0 80px;
	}
	
	.contents {
		gap: 30px 3.9%;
		justify-content: center;
	}
	
	.contents div.blankBox {
		display: block;
		width: 284px;
		height: 5px;
	}
}

/* - tablet - */
@media screen and (min-width: 429px) and (max-width: 1025px) {
	
	.main {
		padding: 3% 6%;
	}

	.topImg {
		padding: 5% 3%;
		flex-wrap: wrap;
	}
	
	.topImg div { max-width: 80%; }
	.topImg a { max-width: 100%; }
	
	.topImg img.earth {
		width: 120px;
		flex-basis: 120px;
	}
	
	.contents {
		gap: 30px 3.0%;
		justify-content: center;
	}
	
	.contents div.blankBox {
		display: block;
		width: 284px;
		height: 5px;
	}
}

/* - mobile - */
@media screen and (max-width: 428px) {
	
	.main {
		padding: 3% 3%;
	}

	.topImg {
		padding: 5% 3%;
	}
	
	.topImg img { max-width: 100%;}
	.topImg a { height: 280px;}
	
	.topImg img.earth {
		width: 100px;
		flex-basis: 100px;
	}
	
	.contents {
		gap: 30px 0;
		justify-content: center;
	}
	
}
