1  @import '../../common/styles/variables';
 2  
 3  .cnt {
 4    font-family: $font;
 5  }
 6  
 7  .title {
 8    line-height: 40px;
 9    text-align: center;
10    text-transform: uppercase;
11    font-weight: 600;
12    font-size: 17px;
13    border-bottom: 1px solid #f7f7f7;
14  }
15  
16  .frame {
17    position: relative;
18    padding: 16px;
19  }
20  
21  .frameTitle {
22    color: #939ba1;
23    font-size: 15px;
24    font-weight: 500;
25    margin-bottom: 16px;
26  }
27  
28  .frameImportant {
29    line-height: 22px;
30    font-size: 15px;
31    font-weight: 500;
32    padding: 16px;
33    border: 1px solid #f7f7f7;
34    border-radius: 16px;
35  
36    p:first-child {
37      margin-top: 0;
38    }
39  
40    p:last-child {
41      margin-bottom: 0;
42    }
43  }
44  
45  .frameContent {
46    line-height: 22px;
47    font-size: 15px;
48    margin-top: 32px;
49    overflow-y: hidden;
50  
51    transition-duration: 0.4s;
52    transition-property: max-height;
53  
54    p:first-child {
55      margin-top: 0;
56    }
57  
58    p:last-child {
59      margin-bottom: 0;
60    }
61  }
62  
63  .readMoreCnt {
64    width: 100%;
65    height: 100%;
66    max-height: 108px;
67    display: flex;
68    align-items: flex-end;
69    justify-content: center;
70    position: absolute;
71    left: 0;
72    bottom: 0;
73    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
74  }
75  
76  .readMore {
77    height: 40px;
78    display: flex;
79    align-items: center;
80    color: #fff;
81    font-size: 15px;
82    border-radius: 20px;
83    padding: 0 30px;
84    margin-bottom: 16px;
85    background: #4360df;
86    cursor: pointer;
87  }