@charset "UTF-8";
/********************************************************************************

page-company.css　会社概要ページcss

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

/*============================================================
 セクション共通
*============================================================*/
#page-company .section {
	margin-bottom: 100px;
}
#page-company dl.data div {
	padding-bottom: 24px;
	border-bottom: 1px solid #D3D3D3;
	margin-bottom: 24px;
}
#page-company dl.data div:last-child {
	margin-bottom: 0;
}
#page-company dl.data dt {
	color: #818181;
	/* float: left; */
	float: none;
}
#page-company dl.data dd {
	/* margin-left: 200px; */
}


/*============================================================
 ミッション
*============================================================*/
#page-company #sec-mission .lead {
	margin-bottom: 40px;
}
#page-company #sec-mission .list {
	gap: 48px;
}
#page-company #sec-mission .item {
	background: var(--common-color-sub);
	color: #fff;
	text-align: center;
	padding: 16px 20px;
	border-radius: 4px;
	width: 300px;
	height: 300px;
}
#page-company #sec-mission .item .icon {
	margin-bottom: 16px;
}
#page-company #sec-mission .item h3 {
	font-size: 24px;
	font-weight: 500;
	line-height: 1;
	margin-bottom: 16px;
}
#page-company #sec-mission .item p {
	text-align: left;
}

/*============================================================
 会社紹介動画
*============================================================*/
#page-company #sec-movie {
}
#page-company #sec-movie .wrap {
	max-width: 614px;
	margin: 0 auto;
}
#page-company #sec-movie .wrap video {
	width: 100%;
}

/*============================================================
 会社概要
*============================================================*/
#page-company #sec-company .block {
	gap: 40px;
}
#page-company #sec-company .block .image {
	width: 52%;
	margin-bottom: 0;
}
#page-company #sec-company .block .info {
	width: 44%;
}
#page-company #sec-company .block .info dd {
	/* margin-left: 100px; */
}

/*============================================================
 VIATRISグローバル
*============================================================*/
#page-company #sec-global .block {
	gap: 40px;
}
#page-company #sec-global .block .image {
	width: 52%;
	margin-bottom: 0;
}
#page-company #sec-global .block .info {
	width: 44%;
}
#page-company #sec-global .block .info .item {
	margin-bottom: 16px;
}
#page-company #sec-global .block .info .item:last-child {
	margin-bottom: 0;
}
#page-company #sec-global .block .info .item h3 {
	margin-bottom: 8px;
}


/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 Tablet
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 1048px) {
    /*============================================================
     セクション
    *============================================================*/
	#page-company #sec-mission .list {
		gap: 32px;
	}
	
	#page-company #sec-company .block {
		gap: 24px;
	}
	
	#page-company #sec-global .block {
		gap: 24px;
	}

}



/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 SP
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 767px) {
	#page-company .sec-title {
		margin-bottom: 32px!important;
	}
	
	#page-company dl.data div {
		padding-bottom: 16px;
		margin-bottom: 16px;
	}
	#page-company dl.data dt {
		float: none;
		margin-bottom: 8px;
	}
	#page-company dl.data dd {
		margin-left: 0!important;
	}
    /*============================================================
     セクション
    *============================================================*/
	#page-company #sec-mission .list {
		gap: 24px;
	}
	#page-company #sec-mission .item {
		height: initial;
		padding: 16px 20px 24px;
		width: 100%;
		max-width: 400px;
	}

	#page-company #sec-company .block {
		gap: 32px;
		flex-direction: column;
		align-items: center;
	}
	#page-company #sec-company .block .image {
		width: 100%;
		max-width: 480px;
	}
	#page-company #sec-company .block .info {
		width: 100%;
	}
	
	#page-company #sec-global .block {
		gap: 32px;
		flex-direction: column;
		align-items: center;
	}
	#page-company #sec-global .block .image {
		width: 100%;
		max-width: 480px;
	}
	#page-company #sec-global .block .info {
		width: 100%;
	}
}

@media screen and (max-width: 480px) {
	#page-company #sec-company .inner {
		padding: 0;
	}
	#page-company #sec-company .block .info {
		padding: 0 16px;
	}
	#page-company #sec-company .block .image {
		overflow: hidden;
	}
	#page-company #sec-company .block .image img {
		width: 144%;
		max-width: initial;
		margin-left: -23vw;
	}
	
	#page-company #sec-global .inner {
		padding: 0;
	}
	#page-company #sec-global .block .info {
		padding: 0 16px;
	}
	#page-company #sec-global .block .image {
		overflow: hidden;
	}
	#page-company #sec-global .block .image img {
		width: 144%;
		max-width: initial;
		margin-left: -23vw;
	}
}

