diff --git a/src/front/Components/Layouts/Offices/OfficeInformations/classes.module.scss b/src/front/Components/Layouts/Offices/OfficeInformations/classes.module.scss
index c9167816..403eb7ec 100644
--- a/src/front/Components/Layouts/Offices/OfficeInformations/classes.module.scss
+++ b/src/front/Components/Layouts/Offices/OfficeInformations/classes.module.scss
@@ -64,23 +64,50 @@
 				display: flex;
 				flex-direction: column;
 				gap: 24px;
+
+				@media (max-width: $screen-l) {
+					text-align: left;
+					display: grid;
+					grid-template-columns: repeat(2, 1fr);
+				}
+
+				@media (max-width: $screen-s) {
+					grid-template-columns: repeat(1, 1fr);
+				}
+
 				.first-line,
-				.user-line {
+				.user-line-desktop {
 					display: grid;
 					grid-template-columns: repeat(5, 1fr);
 					padding: 24px;
 					background-color: var(--purple-soft);
+
+					@media (max-width: $screen-l) {
+						display: none;
+					}
 				}
 
-				.user-line {
+				.user-line-desktop {
 					background-color: var(--grey-soft);
 				}
 
-				.user-line {
+				.user-line-desktop {
 					&:nth-child(odd) {
 						background-color: var(--grey-medium);
 					}
 				}
+
+				.user-line-mobile {
+					display: none;
+
+					@media (max-width: $screen-l) {
+						display: flex;
+						flex-direction: column;
+						gap: 24px;
+						background-color: var(--grey-soft);
+						padding: 24px 16px;
+					}
+				}
 			}
 		}
 	}
diff --git a/src/front/Components/Layouts/Offices/OfficeInformations/index.tsx b/src/front/Components/Layouts/Offices/OfficeInformations/index.tsx
index 5b02c983..9c55a60e 100644
--- a/src/front/Components/Layouts/Offices/OfficeInformations/index.tsx
+++ b/src/front/Components/Layouts/Offices/OfficeInformations/index.tsx
@@ -37,13 +37,47 @@ export default function OfficeInformations(props: IProps) {
 	}, [officeUid]);
 
 	const renderUser = (user: User) => (
-		<div key={user.uid} className={classes["user-line"]}>
-			<Typography typo={ITypo.P_16}>{user.contact?.last_name}</Typography>
-			<Typography typo={ITypo.P_16}>{user.contact?.first_name}</Typography>
-			<Typography typo={ITypo.P_16}>{user.contact?.email}</Typography>
-			<Typography typo={ITypo.P_16}>{user.contact?.phone_number}</Typography>
-			<Typography typo={ITypo.P_16}>{user.office_role ? user.office_role?.name : user.role?.name}</Typography>
-		</div>
+		<>
+			<div key={user.uid} className={classes["user-line-desktop"]}>
+				<Typography typo={ITypo.P_16}>{user.contact?.last_name}</Typography>
+				<Typography typo={ITypo.P_16}>{user.contact?.first_name}</Typography>
+				<Typography typo={ITypo.P_16}>{user.contact?.email}</Typography>
+				<Typography typo={ITypo.P_16}>{user.contact?.phone_number}</Typography>
+				<Typography typo={ITypo.P_16}>{user.office_role ? user.office_role?.name : user.role?.name}</Typography>
+			</div>
+			<div key={user.uid} className={classes["user-line-mobile"]}>
+				<div className={classes["line"]}>
+					<Typography typo={ITypo.P_16} color={ITypoColor.BLACK}>
+						Nom
+					</Typography>
+					<Typography typo={ITypo.P_16}>{user.contact?.last_name}</Typography>
+				</div>
+				<div className={classes["line"]}>
+					<Typography typo={ITypo.P_16} color={ITypoColor.BLACK}>
+						Prénom
+					</Typography>
+					<Typography typo={ITypo.P_16}>{user.contact?.first_name}</Typography>
+				</div>
+				<div className={classes["line"]}>
+					<Typography typo={ITypo.P_16} color={ITypoColor.BLACK}>
+						E-mail pro
+					</Typography>
+					<Typography typo={ITypo.P_16}>{user.contact?.email}</Typography>
+				</div>
+				<div className={classes["line"]}>
+					<Typography typo={ITypo.P_16} color={ITypoColor.BLACK}>
+						Numéro de téléphone
+					</Typography>
+					<Typography typo={ITypo.P_16}>{user.contact?.phone_number}</Typography>
+				</div>
+				<div className={classes["line"]}>
+					<Typography typo={ITypo.P_16} color={ITypoColor.BLACK}>
+						Rôle
+					</Typography>
+					<Typography typo={ITypo.P_16}>{user.office_role ? user.office_role?.name : user.role?.name}</Typography>
+				</div>
+			</div>
+		</>
 	);
 	return (
 		<DefaultOfficeDashboard mobileBackText={"Liste des utilisateurs"}>