@charset "UTF-8";

.contentpage .m_img_area{
	background-image: url(../images/staff/m_img@2x.jpg);
	background-position: bottom right;
}


/* intyo
---------------------------------------------------------*/
#intyo .prof{
	position: relative;
	width: 80%;
	max-width: 930px;
	margin: 0 auto;
}
#intyo .txt{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 80%;
	max-width: 700px;
}
#intyo .txt .name{
	max-width: 320px;
}
#intyo .txt h4{
	position: relative;
	display: flex;
    align-items: center;
	padding-bottom: 1.1em;
}
#intyo .txt h4 .min21{
	margin-right: 1em;
}
#intyo .txt h4 .ft_co{
	position: absolute;
	bottom: 0;
	left: 4rem;
}
#intyo .txt .com_bdr{
	margin: 2em 0 1.5em;
}
#intyo .txt .fs19 li{
	margin-bottom: .3em;
}
#intyo .txt .fs19 li:nth-child(2){
	padding-left: 3em;
	text-indent: -3em;
	line-height: 1.3em;
	margin-bottom: 0;
}

#intyo .bg_white2{
	position: relative;
}
#intyo .bg_white2::before{
	position: absolute;
	display: block;
	content: "";/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+1,ffffff+100&1+0,0+100 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.99) 1%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	background-size: 100% auto;
	width: 100%;
	height: 300px;
	top:0;
	left: 0;
}
#intyo .bg_white2 .w1200{
	position: relative;
	z-index: 2;
}
#intyo .bg_white2 .flt_box .img_l{
	width: 38%;
	float: left;
}
#intyo .bg_white2 .flt_box .txt_r{
	width: 58%;
	float: right;
}

.staff_reki ul,
#intyo .com_marulist{
	padding-left: 1.5em;
	box-sizing:border-box;
}
.staff_reki li,
#intyo .com_marulist li{
	margin-bottom: .7em;
}
.staff_reki li:last-child,
#intyo .com_marulist li:last-child{
	margin-bottom: 0;
}
.staff_reki li{
	display: flex;
    justify-content: space-between;
}
.staff_reki li div:nth-child(1){
	width: 5.5em;
	letter-spacing: 0.1em;
}
.staff_reki li div:nth-child(2){
	width: calc(100% - 5.5em);
}
.staff_reki.col2{
	display: flex;
    justify-content: start;
}
.staff_reki.col2 div{
	width: 48%;
	margin-right: 2%;
	max-width: 380px;
}
.staff_reki.col2 div:nth-child(2){
	margin-right: 0;
}
#intyo .com_marulist.col2 li{
	width: 49%;
}

#intyo .bnr{
	max-width: 400px;
	width: 50%;
}

#intyo .bg_green .flex_box{
	display: flex;
    justify-content: start;
	flex-wrap: wrap;
}
#intyo .bg_green .flex_box li{
	position: relative;
	width: 18.5%;
	height: auto;
	margin-right: 1.875%;
	margin-top: 2%;
	display: flex;
    justify-content: center;
    align-items: center;	
}
#intyo .bg_green .flex_box li:nth-child(5n){
	margin-right: 0;
}
#intyo .bg_green .flex_box li:nth-child(-n+5){
	margin-top: 0;
}
#intyo .bg_green .flex_box li img{
	filter: drop-shadow(0 0 10px rgba(0,0,0,0.6));
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
.staff_reki li,
#intyo .com_marulist li{
	margin-bottom: .5em;
}
.staff_reki li div:nth-child(1){
	width: 5em;
}
.staff_reki li div:nth-child(2){
	width: calc(100% - 5em);
}
.staff_reki ul,
#intyo .com_marulist{
	padding-left: 0;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#intyo .prof{
	width: 112%;
	margin-left: -6%;
}
#intyo .txt{
	width: 80%;
}
#intyo .txt h4{
	display: block;
	padding-bottom: 0;
}
#intyo .txt h4 span{
	display: block;
}
#intyo .txt h4 .min21{
	margin-right: 0;
}
#intyo .txt h4 .ft_co{
	position: static;
	margin-top:.4em;
}
	
#intyo .txt .com_bdr{
	width: 10em;
	margin: 1em 0;
}
#intyo .txt .fs19{
	font-size:90%;
}
#intyo .txt .fs19 li{
	margin-bottom: 0;
}

#intyo .bg_white2::before{
	height: 30vw;
}
#intyo .bg_white2 .flt_box .img_l{
	width: 60%;
	margin: 0 auto 6%;
	float: none;
}
#intyo .bg_white2 .flt_box .txt_r{
	width: 100%;
	float: none;
}

.staff_reki ul,
#intyo .com_marulist{
	padding-left: 0;
}
.staff_reki li,
#intyo .com_marulist li{
	margin-bottom: .7em;
	line-height: 1.5em!important;
}
.staff_reki li div:nth-child(1){
	width: 5em;
}
.staff_reki li div:nth-child(2){
	width: calc(100% - 5em);
}
.staff_reki.col2{
	display: block;
}
.staff_reki.col2 div{
	width: 100%;
	margin-right: 0;
	max-width: 100%;
}
#intyo .com_marulist.col2 li{
	width: 100%;
}

#intyo .bnr{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

#intyo .bg_green .flex_box li{
	width: 32%;
	height: auto;
	margin-right: 2%!important;
	margin-top: 2%!important;
}
#intyo .bg_green .flex_box li:nth-child(3n){
	margin-right: 0!important;
}
#intyo .bg_green .flex_box li:nth-child(-n+3){
	margin-top: 0!important;
}
}






/* staff_list
---------------------------------------------------------*/
.staff_list > li{
	border-bottom: 1px solid #d1cac4;
	padding-bottom: min(90px,7vw);
	margin-bottom: min(90px,7vw);
}
.staff_list > li:last-child{
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}
.staff_list > li h4{
	margin-bottom: .3em;
}
.staff_list .inbox{
	max-width: 1200px;
	margin: 0 auto;
}
.staff_list .img_l{
	width: 31%;
}
.staff_list .txt_r{
	width: 64%;
}
.staff_list .name{
	display: flex;
    align-items: center;	
}
.staff_list .name .min35{
	margin: 0 .5em;
}

.staff_list .sub{
	display: flex;
    justify-content: space-between;
}
.staff_list .sub .staff_reki{
	width: 34%;
}
.staff_list .sub .sho{
	width: 62%;
	display: flex;
	flex-wrap: wrap;
}
.staff_list .sub .sho li{
	width: 32%;
	margin-right: 2%;
}
.staff_list .sub .sho li:nth-child(3n){
	margin-right: 0;
}
.staff_list .sub .sho li img{
	filter: drop-shadow(0 0 10px rgba(0,0,0,0.1));
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
.staff_list > li{
	padding-bottom: 12%;
	margin-bottom: min(90px,7vw);
}
.staff_list .flex_box{
	display: block;
}
.staff_list .txt_al_c .ft_co{
	font-size:90%;
	line-height: 1.4em;
	margin-top: .5em;
}
.staff_list .img_l{
	width: 50%;
	margin: 0 auto 4%;
}
.staff_list .txt_r{
	width: 100%;
}
.staff_list .sub{
	display: block;
}
.staff_list .sub .staff_reki{
	width: 100%;
}
.staff_list .sub .sho{
	width: 100%;
	margin-top: 8%;
}
.staff_list .sub .sho li{
	width: 32%;
	margin-right: 2%;
}
.staff_list .sub .sho li:nth-child(3n){
	margin-right: 0;
}
}






/* team
---------------------------------------------------------*/
#team .bg{
	position: relative;
	background: #fbf8f2;
}
#team .bg::before{
	position: absolute;
	display: block;
	content: "";
	background:url(../images/staff/grd@2x.png)no-repeat bottom -1px right #004150;
	background-size: 100% auto;
	width: 100%;
	height: calc(100% - 170px);
	bottom: 0;
	right: 0;
}
#team .w1200{
	position: relative;
	z-index: 2;
}
#team .com_index4{
	margin-left: -7em;
	width: calc(100% + 14em);
}
#team .com_index4 .ft_co{
	color: #0d4a59;
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
#team .bg::before{
	height: calc(100% - 10vw);
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#team .img{
	position: relative;
	z-index: 2;
}
#team .com_index4{
	margin-top: -3em;
	margin-bottom: -3em;
}
#team .min30{
	position: relative;
	z-index: 2;
}
}