File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
.mainp-container {
display: flex;
margin-top: 2%;
width: 100%;
height: 80vh;
box-sizing: border-box;
}
.mainp-left-wrap {
margin-right: 30px;
margin-left: 30px;
}
.mainp-left {
/* width: 20%; */
width: 340px;
margin-left: 1%;
margin-right: 1%;
border-radius: 20px;
background-color: white;
height: 45vh;
margin-top: 12%;
}
.mainp-left-img {
width: 200px;
height: 250px;
}
.mainp-right {
width: 70%;
}
.mainp-menu ul {
padding: 0;
list-style-type: none;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0;
}
.mainp-menu li {
padding: 8px;
width: calc(10% - 16px);
text-align: center;
color: white;
background-color: #903ff8;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
}
.mainp-menu li.active {
background-color: white;
color: black; /* 글자색은 배경과 대비되게 조정 */
font-weight: bold; /* 선택된 항목에 강조를 주기 위해 */
}
.mainp-menu li:hover {
cursor: pointer;
opacity: 0.7;
}
.mainp-menu li:first-child {
margin-left: 10px;
}
.mainp-menu li:last-child {
margin-right: 10px;
}
.mainp-left-top {
display: flex;
}
.mainp-left-top-div {
width: 175px;
height: 150px;
background-color: white;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
padding: 0px 10px 0px 15px;
}
.bubble-tail {
position: absolute;
bottom: -20px; /* Adjust this value based on your exact needs */
/* left: 50%; */
right: 80%;
width: 0;
height: 0;
border-style: solid;
border-width: 20px 20px 0 0px;
border-color: white transparent transparent transparent;
}