diff --git a/src/pages/Support/Support.tsx b/src/pages/Support/Support.tsx
index 806e8aa..f739533 100644
--- a/src/pages/Support/Support.tsx
+++ b/src/pages/Support/Support.tsx
@@ -18,13 +18,8 @@ export default function Support() {
             maxWidth="lg"
             sx={{
                 pt: upMd ? "25px" : "20px",
-                pb: upMd ? "70px" : "18px",
+                pb: upMd ? "82px" : "43px",
                 height: "100%",
-                display: "flex",
-                flexDirection: "column",
-            }}
-            outerContainerSx={{
-                height: upMd ? undefined : "calc(100vh - 51px)",
             }}
         >
             {upMd &&
@@ -50,18 +45,52 @@ export default function Support() {
                 :
                 <>
                     <CreateTicket />
-                    <List sx={{ mt: "40px" }}>
-                        <ListItem sx={{ px: 0 }}>
+                    <List sx={{
+                        mt: upMd ? "40px" : "60px",
+                        p: 0,
+                        display: "flex",
+                        flexDirection: "column",
+                        gap: "40px",
+                    }}>
+                        <ListItem disablePadding>
                             <TicketCard
-                                name="Название тикета"
-                                body="Содержание тикета"
-                                time="15.09.22 08:39"
+                                name="Название обращения"
+                                body="Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель"
+                                time="24.01.2022 16:40"
+                                ticketId="someTicketId"
+                            />
+                        </ListItem>
+                        <ListItem disablePadding>
+                            <TicketCard
+                                name="Название обращения Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет"
+                                body="Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — "
+                                time="24.01.2022 16:40"
+                                ticketId="someTicketId"
+                            />
+                        </ListItem>
+                        <ListItem disablePadding>
+                            <TicketCard
+                                name="Название обращения"
+                                body="Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполнитель — 
+                                это текст, который имеет Текст-заполните"
+                                time="24.01.2022 16:40"
                                 ticketId="someTicketId"
                             />
                         </ListItem>
                     </List>
                 </>
             }
-        </SectionWrapper >
+        </SectionWrapper>
     );
 }
\ No newline at end of file
diff --git a/src/pages/Support/TicketCard.tsx b/src/pages/Support/TicketCard.tsx
index 32f996c..b11f683 100644
--- a/src/pages/Support/TicketCard.tsx
+++ b/src/pages/Support/TicketCard.tsx
@@ -1,6 +1,7 @@
 import { Box, Typography, useMediaQuery, useTheme } from "@mui/material";
 import CustomButton from "../../components/CustomButton";
 import { Link as RouterLink } from "react-router-dom";
+import { useMemo } from "react";
 
 
 interface Props {
@@ -14,6 +15,17 @@ export default function TicketCard({ name, body, time, ticketId }: Props) {
     const theme = useTheme();
     const upMd = useMediaQuery(theme.breakpoints.up("md"));
 
+    const timeText = useMemo(() => (
+        <Typography sx={{
+            fontWeight: 400,
+            fontSize: "14px",
+            lineHeight: "17px",
+            color: theme.palette.grey2.main,
+            mt: "2px",
+            mb: "5px",
+        }}>{time}</Typography>
+    ), [theme.palette.grey2.main, time]);
+
     return (
         <Box
             sx={{
@@ -24,7 +36,7 @@ export default function TicketCard({ name, body, time, ticketId }: Props) {
                 display: "flex",
                 flexDirection: upMd ? "row" : "column",
                 justifyContent: "space-between",
-                gap: "20px",
+                gap: upMd ? "40px" : "20px",
                 boxShadow: `0px 100px 309px rgba(210, 208, 225, 0.24), 
                             0px 41.7776px 129.093px rgba(210, 208, 225, 0.172525),
                             0px 22.3363px 69.0192px rgba(210, 208, 225, 0.143066), 
@@ -33,31 +45,35 @@ export default function TicketCard({ name, body, time, ticketId }: Props) {
                             0px 2.76726px 8.55082px rgba(210, 208, 225, 0.0674749)`,
             }}
         >
+            {!upMd && timeText}
             <Box>
-                <Typography variant="h5" mb="20px">{name}</Typography>
-                <Typography>{body}</Typography>
+                <Typography
+                    sx={{
+                        mb: "20px",
+                        fontSize: "18px",
+                        lineHeight: "21px",
+                        fontWeight: 500,
+                    }}
+                >{name}</Typography>
+                <Typography color={theme.palette.grey3.main}>{body}</Typography>
             </Box>
             <Box
                 sx={{
                     display: "flex",
                     flexDirection: "column",
-                    alignItems: "end",
-                    alignSelf: "end",
+                    alignItems: upMd ? "end" : "start",
+                    justifyContent: "space-between",
                 }}
             >
-                <Typography sx={{
-                    fontWeight: 400,
-                    fontSize: "14px",
-                    lineHeight: "17px",
-                    color: theme.palette.grey2.main,
-                    mb: upMd ? "9px" : "20px",
-                }}>{time}</Typography>
+                {upMd && timeText}
                 <CustomButton
-                    variant="contained"
+                    variant="outlined"
                     component={RouterLink}
                     to={`/support/${ticketId}`}
                     sx={{
-                        backgroundColor: theme.palette.brightPurple.main,
+                        py: "9px",
+                        color: theme.palette.brightPurple.main,
+                        borderColor: theme.palette.brightPurple.main,
                     }}
                 >Перейти</CustomButton>
             </Box>