@charset "UTF-8";

#m_img .m_img_area {
	background-image: url(../images/staff/m_img.jpg);
}



/*共通
---------------------------------------------------------*/
#staff {
	position: relative;
	
}
#staff:before {
	width: 100%;
	height: 400px;
	content: "";
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size:  cover;
}
#staff:before {background-image: url(../images/staff/staff_bg.jpg)}
.staff .cont_box {
	position: relative;
	z-index: 1;
}

.staff h4 {
	color: #fff;
	font-size: 260%;
	font-weight: normal;
	letter-spacing: .05em;
	line-height: 1.2em;
	text-align: center;
}
#staff h4 {
	padding: 100px 0;
}

.staff .title_box {
	background: #fff;
	text-align: center;
	padding-top: 70px;
}
#staff .title_box {
	padding-bottom: 70px;
}
.staff .title_box h5 {
	font-size: 200%;
	font-weight: bold;
	text-align: center;
	line-height: 1.8em;
}
.staff .title_box p{
font-size: 140%;
	font-weight: bold;
	text-align: center;
	line-height: 1.8em;
	margin-bottom: 15px;
}
.staff .title_box hr.com_ttl_line {
	padding-bottom: 25px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.staff .title_box {
	padding-top: 7%;
}
#staff .title_box {
	padding-bottom: 7%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#staff:before {
	height: 200px;
}
.staff .cont_box {
	position: relative;
	z-index: 1;
}
#staff h4 {
	padding: 60px 0;
}

.staff .title_box {
	padding-top: 7%;
}
#staff .title_box {
	padding-bottom: 7%;
}
.staff .title_box h5 {
	font-size: 180%;
	line-height: 1.6em;
}
.staff .title_box hr.com_ttl_line {
	padding-bottom: 5%;
}
}





/*スタッフ紹介
---------------------------------------------------------*/
.staff {
	margin-bottom: 150px;
}
#staff .item_list {
	width: 94%;
	padding: 0 3%;
	max-width: 1000px;
	margin: 0 auto;
	text-align: left;
	
}
#staff .item_list > li {
	width: 48%;
	max-width: 450px;
	margin: 0 auto 100px;
	float: left;
	position: relative;
}
#staff .item_list > li:nth-child(even) {
	float: right;
}

#staff .item_list .txt_name {
	display: table;
	table-layout: fixed;
	width: 100%;
	margin-bottom: 20px;
}
#staff .doctor_list .txt_name {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
}
#staff .item_list .txt_name dt {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	width: 100px;
	height: 100px;
	border: solid 1px #766451;
	font-size: 120%;
	font-weight: bold;
	letter-spacing: .05em;
	line-height: 1.4em;
}
#staff .item_list .txt_name dt small{
font-size: 70%;
line-height: 1.3em;
display: block;
}
#staff .item_list .txt_name dd {
	display: table-cell;
	text-align: left;
	vertical-align: middle;
	padding-left: 20px;
	color: #444444;
	font-size: 140%;
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1.2em;
}
#staff .item_list .txt_name dd span {
	padding-left: 20px;
	font-size: 60%;
	color: #726452;
	font-family: 'Overpass', sans-serif;
	-webkit-font-smoothing: antialiased;
	vertical-align: middle;
}
/* 色 */
#staff .doctor_list .txt_name dt {color: #B3B1EB;}
#staff .item_list .txt_name .type1 {color: #9FDC4C;}/*DH*/
#staff .item_list .txt_name .type2 {color: #FF9B6A;}/*保育士*/
#staff .item_list .txt_name .type3 {color: #F2AC00;}/*受付*/
#staff .item_list .txt_name .type4 {color: #D2CC00;}/*歯科助手*/
#staff .item_list .txt_name .type5 {color: #71D6D2;}/*クリーンスタッフ*/

#staff .item_list .img_photo {
	padding-top: 90px;
	text-align: center;
	position: relative;
	z-index: 0;
	margin-bottom: 20px;
}

#staff .item_list .free_time {
	margin-top: 5px;
	display: table;
	table-layout: fixed;
	width: 100%;
	line-height: 1.5em;
}
#staff .item_list .border_top {
	margin-top: 15px;
	border-top: solid 1px #D0DACB;
	padding-top: 15px;
}
#staff .item_list .free_time dt {
	display: table-cell;
	text-align: left;
	vertical-align: top;
	width: 100px;
	color: #726452;
	font-weight: bold;
}
#staff .item_list .free_time dt:before {
	font-family: 'fontello';
	content: '\e807';
	color: #FFF600;
	padding-right: .5em;
}
#staff .item_list .free_time dd {
	display: table-cell;
	text-align: left;
	vertical-align: top;
}
#staff .item_list .free_time dd li {
	text-indent: -1.0em;
	margin-left: 1.0em;
}

#staff .item_list .comment {
	margin-top: 30px;
	background: repeating-linear-gradient(-45deg, #FFFB7C, #FFFB7C 2px, #fff 0, #fff 12px);
	background-size: 50px 50px;
	padding: 30px 6%;
}
#staff .item_list .free_time dd strong{
	color:#85B200;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.staff {
	margin-bottom: 12%;
}
#staff .item_list > li {
	margin-bottom: 10%;
}

#staff .item_list .txt_name {
	margin-bottom: 3%;
}
#staff .item_list .txt_name dd span {
	display: block;
	padding-left: 0;
	padding-top: 5px;
}

#staff .item_list .img_photo {
	margin-bottom: 3%;
}

#staff .item_list .free_time {
	margin-top: 5px;
	display: block;
}
#staff .item_list .border_top {
	margin-top: 15px;
	padding-top: 15px;
}

#staff .item_list .comment {
	margin-top: 5%;
	padding: 6%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.staff {
	margin-bottom: 15%;
}
#staff .item_list > li {
	width: 100%;
	float: none;
	margin-bottom: 10%;
}
#staff .item_list > li:nth-child(even) {
	float: none;
}

#staff .item_list .txt_name {
	margin-bottom: 3%;
}
#staff .item_list .txt_name dd span {
	display: block;
	padding-left: 0;
}

#staff .item_list .img_photo {
	margin-bottom: 3%;
}

#staff .item_list .free_time {
	margin-top: 5px;
	display: block;
}
#staff .item_list .border_top {
	margin-top: 15px;
	padding-top: 15px;
}

#staff .item_list .comment {
	margin-top: 3%;
	padding: 6% 5%;
}
}



/*集合写真
---------------------------------------------------------*/
.staff .image_box  {
	padding: 50px 0 90px;
	margin-bottom: 100px;
	position: relative;
}
.staff .image_box:before  {
	width: 100%;
	height: 68%;
	content: "";
	position: absolute;
	z-index: 0;
	bottom: 0;
	left: 0;
	background: rgba(141,142,90,0.1);
}
.staff .image_box dl {
	text-align: center;
	position: relative;
	z-index: 1;
}
.staff .image_box dt {
	color: #444444;
	font-size: 200%;
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1.5em;
	margin-bottom: 50px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.staff .image_box  {
	padding: 5% 0 9%;
	margin-bottom: 10%;
}
.staff .image_box dt {
	font-size: 180%;
	letter-spacing: .05em;
	margin-bottom: 5%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.staff .image_box  {
	padding: 5% 0 8%;
	margin-bottom: 10%;
}
.staff .image_box dt {
	font-size: 160%;
	letter-spacing: .05em;
	line-height: 1.5em;
	margin-bottom: 5%;
}
}