@charset "UTF-8";
/* =====================================================================================================================
=
= なにわ歯科衛生専門学校
= graduate
=
===================================================================================================================== */

/*
- Career 共通
--------------------------------------------------------------------------------------------------------------------- */
#career{}
#career #content-header h1{
	background-image:url('/_assets/img/pc/career/main_image.jpg');
}

#career .category-links{
	justify-content:flex-start;
}


/*
- graduate 活躍する先輩たち
--------------------------------------------------------------------------------------------------------------------- */
#career.graduate{}
#career.graduate #message-list{
	width:964px;
	margin:40px 0;
}

#career.graduate #message-list .item{
	display:flex;
	flex-flow:row wrap;
	justify-content:space-between;
	margin-bottom:40px;
	padding-bottom:40px;
	border-bottom:1px dotted #ff88bf;
}
#career.graduate #message-list .item .photo{
	width: 47.7%;
	margin: 0 34px 0 0;
}
#career.graduate #message-list .item .photo p {
	font-size: 1.6rem;
	letter-spacing: 0;
	line-height: 1.5em;
	font-weight: bold;
	margin-top: 20px;
}

#career.graduate #message-list .item .photo p.day {
	color: #FF86CB;
}

#career.graduate #message-list .item .photo p.night {
	color: #B18CCA;
}

#career.graduate #message-list .item .message {
	flex:1;
}

#career.graduate #message-list .item .message .text-lead {
	font-size: 2.2rem;
	margin-bottom: 10px;
	line-height: 1.63em;
	letter-spacing: 0.1em;
	font-weight: bold;
	color: #FF86CB;
}

#career.graduate #message-list .item .message p {
	font-size: 1.6rem;
    letter-spacing: 0;
	margin-bottom: 1rem;
	color: #717171;
}
#career.graduate #message-list .item .message p span {
	color: #FF86CB;
	font-size: 1.6rem;
	font-weight: bold;
}
#career.graduate #message-list .item .message.night .text-lead,
#career.graduate #message-list .item .message.night p span {
	color: #B18CCA;
}
/*
- media query (tablet)
--------------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:768px) and (max-width:963px){/*-add190605-*/
#career.graduate #message-list{
	width:auto;
}
}/*-tablet END-*/
/*
- media query (smart phone)
--------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:767px){
	#career.graduate{}
	#career.graduate #message-list{
		width:100%;
		margin:20px 0;
	}

	#career.graduate #message-list .item{
		display:flex;
		flex-flow:column wrap;
		justify-content:space-between;
		margin-bottom:30px;
		padding-bottom:30px;
		border-bottom:1px dotted #ff88bf;
	}
/*
	#career.graduate #message-list .item:nth-child(even){
		flex-flow:column wrap;
	}
*/
	#career.graduate #message-list .item .photo{
		width: 100%;
		margin: 0 0 20px 0;
	}
/*
	#career.graduate #message-list .item:nth-child(even) .photo{
		margin:0 0 10px 0;
	}
*/
	#career.graduate #message-list .item .photo p{
		display:flex;
		flex-flow:row wrap;
		justify-content:space-between;
		margin-top:10px;
	}

	#career.graduate #message-list .item .photo p .day,
	#career.graduate #message-list .item .photo p .night{
	}

	#career.graduate #message-list .item .photo p .day{}

	#career.graduate #message-list .item .photo p .night{}

	#career.graduate #message-list .item .photo p .name{
		flex:1;
		font-size:1.6rem;
		font-weight:bold;
		margin-left:10px;
	}

	#career.graduate #message-list .item .photo p .name small{
		display:block;
		font-size:1.2rem;
		font-weight:normal;
	}

	#career.graduate #message-list .item .message{
		flex:1;
	}

	#career.graduate #message-list .item .message .text-lead{
		font-size: 2rem;
		margin-bottom: 20px;
		line-height:1.4;
	}
}